@mediaradar/design-components 0.13.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 +13 -5
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +12 -2
- package/dist/index.d.ts +12 -2
- package/dist/index.js +193 -185
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -403,7 +403,7 @@ 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",
|
|
@@ -442,17 +442,22 @@ var TONE_STYLE = {
|
|
|
442
442
|
}
|
|
443
443
|
};
|
|
444
444
|
var KIND = {
|
|
445
|
-
|
|
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",
|
|
446
451
|
// Square-ish and centred, with a floor width so a 1-digit and a 3-digit
|
|
447
452
|
// count are the same shape, and lining figures so the width does not shift
|
|
448
453
|
// as the number changes.
|
|
449
454
|
count: "h-[18px] min-w-[18px] justify-center px-1.5 tabular-nums",
|
|
450
455
|
// The only kind that shouts. Caps need the letterspacing -- caps set tight
|
|
451
456
|
// are harder to read than the sentence case they replaced.
|
|
452
|
-
eyebrow: "px-2 py-
|
|
457
|
+
eyebrow: "px-2.5 py-1 uppercase tracking-wider"
|
|
453
458
|
};
|
|
454
|
-
function Badge({ tone = "neutral", kind = "label", children, className }) {
|
|
455
|
-
return /* @__PURE__ */
|
|
459
|
+
function Badge({ tone = "neutral", kind = "label", dot = false, children, className }) {
|
|
460
|
+
return /* @__PURE__ */ jsxs4(
|
|
456
461
|
"span",
|
|
457
462
|
{
|
|
458
463
|
style: TONE_STYLE[tone],
|
|
@@ -466,7 +471,10 @@ function Badge({ tone = "neutral", kind = "label", children, className }) {
|
|
|
466
471
|
KIND[kind],
|
|
467
472
|
className
|
|
468
473
|
),
|
|
469
|
-
children
|
|
474
|
+
children: [
|
|
475
|
+
dot && /* @__PURE__ */ jsx4("span", { "aria-hidden": "true", className: "size-1.5 shrink-0 rounded-full bg-current" }),
|
|
476
|
+
children
|
|
477
|
+
]
|
|
470
478
|
}
|
|
471
479
|
);
|
|
472
480
|
}
|
|
@@ -532,7 +540,7 @@ function CheckBoxBox({ checked, indeterminate, disabled, className }) {
|
|
|
532
540
|
// src/DateRangeFilter.tsx
|
|
533
541
|
import { useEffect as useEffect3, useMemo as useMemo2, useRef as useRef3, useState as useState3 } from "react";
|
|
534
542
|
import { ChevronDown as ChevronDown2, ChevronLeft, ChevronRight } from "lucide-react";
|
|
535
|
-
import { jsx as jsx6, jsxs as
|
|
543
|
+
import { jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
|
|
536
544
|
var DEFAULT_SHORTCUTS = [
|
|
537
545
|
"Year to date",
|
|
538
546
|
"Rolling 3 months",
|
|
@@ -738,8 +746,8 @@ function DateRangeFilter({
|
|
|
738
746
|
onRangeChange?.(s, e);
|
|
739
747
|
setOpen(false);
|
|
740
748
|
};
|
|
741
|
-
return /* @__PURE__ */
|
|
742
|
-
/* @__PURE__ */
|
|
749
|
+
return /* @__PURE__ */ jsxs5("div", { className: "relative", ref, children: [
|
|
750
|
+
/* @__PURE__ */ jsxs5(
|
|
743
751
|
"button",
|
|
744
752
|
{
|
|
745
753
|
type: "button",
|
|
@@ -749,7 +757,7 @@ function DateRangeFilter({
|
|
|
749
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",
|
|
750
758
|
children: [
|
|
751
759
|
icon && /* @__PURE__ */ jsx6("span", { className: "shrink-0 text-text-tertiary", children: icon }),
|
|
752
|
-
/* @__PURE__ */
|
|
760
|
+
/* @__PURE__ */ jsxs5("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
|
|
753
761
|
/* @__PURE__ */ jsx6("span", { className: showDates ? "text-[11px] text-text-tertiary" : "text-[10px] uppercase tracking-wide text-text-tertiary", children: showDates ? displayDatesLine : caption }),
|
|
754
762
|
/* @__PURE__ */ jsx6("span", { className: "text-[12px] font-medium text-text-primary", children: displayValue })
|
|
755
763
|
] }),
|
|
@@ -757,7 +765,7 @@ function DateRangeFilter({
|
|
|
757
765
|
]
|
|
758
766
|
}
|
|
759
767
|
),
|
|
760
|
-
open && /* @__PURE__ */
|
|
768
|
+
open && /* @__PURE__ */ jsxs5(
|
|
761
769
|
"div",
|
|
762
770
|
{
|
|
763
771
|
"data-testid": testIdPrefix && `${testIdPrefix}-popover`,
|
|
@@ -776,8 +784,8 @@ function DateRangeFilter({
|
|
|
776
784
|
},
|
|
777
785
|
s
|
|
778
786
|
)) }),
|
|
779
|
-
/* @__PURE__ */
|
|
780
|
-
/* @__PURE__ */
|
|
787
|
+
/* @__PURE__ */ jsxs5("div", { className: "flex flex-col p-4", children: [
|
|
788
|
+
/* @__PURE__ */ jsxs5("div", { className: "flex items-end gap-3", children: [
|
|
781
789
|
/* @__PURE__ */ jsx6(Field, { label: "Start Date", value: start ? fmt(start) : "\u2014" }),
|
|
782
790
|
/* @__PURE__ */ jsx6("span", { className: "pb-2.5 text-text-tertiary", children: "\u2014" }),
|
|
783
791
|
/* @__PURE__ */ jsx6(Field, { label: "End Date", value: end ? fmt(end) : start ? fmt(start) : "\u2014" })
|
|
@@ -786,17 +794,17 @@ function DateRangeFilter({
|
|
|
786
794
|
/* @__PURE__ */ jsx6("div", { className: "flex gap-8", children: [0, 1].map((offset) => {
|
|
787
795
|
const m = addMonths(leftMonth, offset);
|
|
788
796
|
const grid = monthGrid(m.getFullYear(), m.getMonth());
|
|
789
|
-
return /* @__PURE__ */
|
|
790
|
-
/* @__PURE__ */
|
|
797
|
+
return /* @__PURE__ */ jsxs5("div", { className: "w-[252px]", children: [
|
|
798
|
+
/* @__PURE__ */ jsxs5("div", { className: "mb-2 flex items-center justify-between", children: [
|
|
791
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" }),
|
|
792
|
-
/* @__PURE__ */
|
|
800
|
+
/* @__PURE__ */ jsxs5("span", { className: "text-[15px] font-semibold text-text-primary", children: [
|
|
793
801
|
MONTHS[m.getMonth()],
|
|
794
802
|
" ",
|
|
795
803
|
m.getFullYear()
|
|
796
804
|
] }),
|
|
797
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" })
|
|
798
806
|
] }),
|
|
799
|
-
/* @__PURE__ */
|
|
807
|
+
/* @__PURE__ */ jsxs5("div", { className: "grid grid-cols-7", children: [
|
|
800
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)),
|
|
801
809
|
grid.map((d, i) => {
|
|
802
810
|
const inMonth = d.getMonth() === m.getMonth();
|
|
@@ -812,7 +820,7 @@ function DateRangeFilter({
|
|
|
812
820
|
else if (end && isEnd) band = "left-0 right-1/2";
|
|
813
821
|
else band = "left-0 right-0";
|
|
814
822
|
}
|
|
815
|
-
return /* @__PURE__ */
|
|
823
|
+
return /* @__PURE__ */ jsxs5("button", { type: "button", onClick: () => pickDay(d), className: "relative flex h-9 items-center justify-center", children: [
|
|
816
824
|
band && /* @__PURE__ */ jsx6("span", { className: `absolute inset-y-[3px] bg-ai-tint ${band}`, "aria-hidden": "true" }),
|
|
817
825
|
/* @__PURE__ */ jsx6(
|
|
818
826
|
"span",
|
|
@@ -826,7 +834,7 @@ function DateRangeFilter({
|
|
|
826
834
|
] })
|
|
827
835
|
] }, offset);
|
|
828
836
|
}) }),
|
|
829
|
-
/* @__PURE__ */
|
|
837
|
+
/* @__PURE__ */ jsxs5("div", { className: "mt-4 flex justify-end gap-2", children: [
|
|
830
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" }),
|
|
831
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" })
|
|
832
840
|
] })
|
|
@@ -837,7 +845,7 @@ function DateRangeFilter({
|
|
|
837
845
|
] });
|
|
838
846
|
}
|
|
839
847
|
function Field({ label, value }) {
|
|
840
|
-
return /* @__PURE__ */
|
|
848
|
+
return /* @__PURE__ */ jsxs5("div", { className: "flex flex-col gap-1.5", children: [
|
|
841
849
|
/* @__PURE__ */ jsx6("span", { className: "text-[12px] font-medium text-text-secondary", children: label }),
|
|
842
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 })
|
|
843
851
|
] });
|
|
@@ -849,7 +857,7 @@ function NavBtn({ children, onClick, ...rest }) {
|
|
|
849
857
|
// src/SearchBar.tsx
|
|
850
858
|
import { useEffect as useEffect4, useRef as useRef4, useState as useState4 } from "react";
|
|
851
859
|
import { AlertCircle, Check as Check3, ChevronDown as ChevronDown3, Search as Search3 } from "lucide-react";
|
|
852
|
-
import { Fragment as Fragment3, jsx as jsx7, jsxs as
|
|
860
|
+
import { Fragment as Fragment3, jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
|
|
853
861
|
var DEFAULT_SEARCH_MATCH = { mode: "anyWord", wordJoin: "Or" };
|
|
854
862
|
var MODE_LABEL = {
|
|
855
863
|
anyWord: "Any Word",
|
|
@@ -886,7 +894,7 @@ function SearchBar({
|
|
|
886
894
|
};
|
|
887
895
|
}, [open]);
|
|
888
896
|
const showMatch = variant === "filterable" && matchValue;
|
|
889
|
-
return /* @__PURE__ */
|
|
897
|
+
return /* @__PURE__ */ jsxs6(
|
|
890
898
|
"div",
|
|
891
899
|
{
|
|
892
900
|
className: cx2(
|
|
@@ -894,7 +902,7 @@ function SearchBar({
|
|
|
894
902
|
className
|
|
895
903
|
),
|
|
896
904
|
children: [
|
|
897
|
-
/* @__PURE__ */
|
|
905
|
+
/* @__PURE__ */ jsxs6("label", { className: "flex min-w-0 flex-1 items-center gap-2 px-2.5", children: [
|
|
898
906
|
/* @__PURE__ */ jsx7(Search3, { size: 15, "aria-hidden": "true", className: "shrink-0 text-text-tertiary" }),
|
|
899
907
|
/* @__PURE__ */ jsx7(
|
|
900
908
|
"input",
|
|
@@ -920,8 +928,8 @@ function SearchBar({
|
|
|
920
928
|
// token package (insights-studio-prototype's own src/index.css;
|
|
921
929
|
// mr-clientapps' own tailwind.config.ts `colors.border.DEFAULT`) --
|
|
922
930
|
// an alias this shared component can't rely on existing.
|
|
923
|
-
/* @__PURE__ */
|
|
924
|
-
/* @__PURE__ */
|
|
931
|
+
/* @__PURE__ */ jsxs6("div", { className: "relative shrink-0 border-l border-border-default", ref, children: [
|
|
932
|
+
/* @__PURE__ */ jsxs6(
|
|
925
933
|
"button",
|
|
926
934
|
{
|
|
927
935
|
type: "button",
|
|
@@ -950,7 +958,7 @@ function SearchBar({
|
|
|
950
958
|
"aria-label": "Search match type",
|
|
951
959
|
"data-testid": testIdPrefix && `${testIdPrefix}-mode-popover`,
|
|
952
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",
|
|
953
|
-
children: /* @__PURE__ */
|
|
961
|
+
children: /* @__PURE__ */ jsxs6("div", { role: "radiogroup", "aria-label": "Search match type", className: "flex flex-col", children: [
|
|
954
962
|
/* @__PURE__ */ jsx7(
|
|
955
963
|
ModeRow,
|
|
956
964
|
{
|
|
@@ -960,7 +968,7 @@ function SearchBar({
|
|
|
960
968
|
testId: testIdPrefix && `${testIdPrefix}-mode-anyWord`,
|
|
961
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." }),
|
|
962
970
|
infoText: "The Or/And choice applies only when Any Word is the active search mode.",
|
|
963
|
-
extra: /* @__PURE__ */
|
|
971
|
+
extra: /* @__PURE__ */ jsxs6("span", { className: "flex items-center gap-3", children: [
|
|
964
972
|
/* @__PURE__ */ jsx7(
|
|
965
973
|
RadioOption,
|
|
966
974
|
{
|
|
@@ -1040,7 +1048,7 @@ function ModeRow({
|
|
|
1040
1048
|
onSelect,
|
|
1041
1049
|
testId
|
|
1042
1050
|
}) {
|
|
1043
|
-
return /* @__PURE__ */
|
|
1051
|
+
return /* @__PURE__ */ jsxs6(
|
|
1044
1052
|
"div",
|
|
1045
1053
|
{
|
|
1046
1054
|
role: "radio",
|
|
@@ -1056,9 +1064,9 @@ function ModeRow({
|
|
|
1056
1064
|
},
|
|
1057
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",
|
|
1058
1066
|
children: [
|
|
1059
|
-
/* @__PURE__ */
|
|
1060
|
-
/* @__PURE__ */
|
|
1061
|
-
/* @__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: [
|
|
1062
1070
|
/* @__PURE__ */ jsx7("span", { className: "text-[14px] font-semibold text-text-primary", children: title }),
|
|
1063
1071
|
/* @__PURE__ */ jsx7(RowInfoTip, { text: infoText })
|
|
1064
1072
|
] }),
|
|
@@ -1078,7 +1086,7 @@ function RadioOption({
|
|
|
1078
1086
|
onSelect,
|
|
1079
1087
|
testId
|
|
1080
1088
|
}) {
|
|
1081
|
-
return /* @__PURE__ */
|
|
1089
|
+
return /* @__PURE__ */ jsxs6(
|
|
1082
1090
|
"button",
|
|
1083
1091
|
{
|
|
1084
1092
|
type: "button",
|
|
@@ -1117,7 +1125,7 @@ function RowInfoTip({ text }) {
|
|
|
1117
1125
|
window.addEventListener("mousedown", onDown);
|
|
1118
1126
|
return () => window.removeEventListener("mousedown", onDown);
|
|
1119
1127
|
}, [open]);
|
|
1120
|
-
return /* @__PURE__ */
|
|
1128
|
+
return /* @__PURE__ */ jsxs6("span", { className: "relative inline-flex shrink-0 items-center", ref, children: [
|
|
1121
1129
|
/* @__PURE__ */ jsx7(
|
|
1122
1130
|
"button",
|
|
1123
1131
|
{
|
|
@@ -1146,7 +1154,7 @@ function RowInfoTip({ text }) {
|
|
|
1146
1154
|
// src/SectionRail.tsx
|
|
1147
1155
|
import { useRef as useRef5 } from "react";
|
|
1148
1156
|
import { ChevronLeft as ChevronLeft2, ChevronRight as ChevronRight2 } from "lucide-react";
|
|
1149
|
-
import { jsx as jsx8, jsxs as
|
|
1157
|
+
import { jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
1150
1158
|
function SectionRail({
|
|
1151
1159
|
title,
|
|
1152
1160
|
titleSerif,
|
|
@@ -1159,9 +1167,9 @@ function SectionRail({
|
|
|
1159
1167
|
const scroll = (direction) => {
|
|
1160
1168
|
scrollRef.current?.scrollBy({ left: direction * 320, behavior: "smooth" });
|
|
1161
1169
|
};
|
|
1162
|
-
return /* @__PURE__ */
|
|
1163
|
-
/* @__PURE__ */
|
|
1164
|
-
/* @__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: [
|
|
1165
1173
|
/* @__PURE__ */ jsx8(
|
|
1166
1174
|
"h2",
|
|
1167
1175
|
{
|
|
@@ -1171,8 +1179,8 @@ function SectionRail({
|
|
|
1171
1179
|
),
|
|
1172
1180
|
/* @__PURE__ */ jsx8("p", { className: "mt-1 text-sm text-text-secondary", children: subtitle })
|
|
1173
1181
|
] }),
|
|
1174
|
-
/* @__PURE__ */
|
|
1175
|
-
viewAllLabel && viewAllHref && /* @__PURE__ */
|
|
1182
|
+
/* @__PURE__ */ jsxs7("div", { className: "flex items-center gap-2", children: [
|
|
1183
|
+
viewAllLabel && viewAllHref && /* @__PURE__ */ jsxs7(
|
|
1176
1184
|
"a",
|
|
1177
1185
|
{
|
|
1178
1186
|
href: viewAllHref,
|
|
@@ -1219,7 +1227,7 @@ function SectionRail({
|
|
|
1219
1227
|
// src/DataScopeFilter.tsx
|
|
1220
1228
|
import { useEffect as useEffect5, useRef as useRef6, useState as useState5 } from "react";
|
|
1221
1229
|
import { Check as Check4, ChevronDown as ChevronDown4 } from "lucide-react";
|
|
1222
|
-
import { jsx as jsx9, jsxs as
|
|
1230
|
+
import { jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
|
|
1223
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.";
|
|
1224
1232
|
function cx3(...classes) {
|
|
1225
1233
|
return classes.filter(Boolean).join(" ");
|
|
@@ -1245,8 +1253,8 @@ function DataScopeFilter({ value, onChange, align = "right" }) {
|
|
|
1245
1253
|
onChange(v);
|
|
1246
1254
|
setOpen(false);
|
|
1247
1255
|
};
|
|
1248
|
-
return /* @__PURE__ */
|
|
1249
|
-
/* @__PURE__ */
|
|
1256
|
+
return /* @__PURE__ */ jsxs8("div", { className: "relative", ref, children: [
|
|
1257
|
+
/* @__PURE__ */ jsxs8(
|
|
1250
1258
|
"button",
|
|
1251
1259
|
{
|
|
1252
1260
|
type: "button",
|
|
@@ -1255,7 +1263,7 @@ function DataScopeFilter({ value, onChange, align = "right" }) {
|
|
|
1255
1263
|
"aria-haspopup": "listbox",
|
|
1256
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",
|
|
1257
1265
|
children: [
|
|
1258
|
-
/* @__PURE__ */
|
|
1266
|
+
/* @__PURE__ */ jsxs8("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
|
|
1259
1267
|
/* @__PURE__ */ jsx9("span", { className: "text-[10px] uppercase tracking-wide text-text-tertiary", children: "Data" }),
|
|
1260
1268
|
/* @__PURE__ */ jsx9("span", { className: "text-[12px] font-medium text-text-primary", children: display })
|
|
1261
1269
|
] }),
|
|
@@ -1270,7 +1278,7 @@ function DataScopeFilter({ value, onChange, align = "right" }) {
|
|
|
1270
1278
|
]
|
|
1271
1279
|
}
|
|
1272
1280
|
),
|
|
1273
|
-
open && /* @__PURE__ */
|
|
1281
|
+
open && /* @__PURE__ */ jsxs8(
|
|
1274
1282
|
"div",
|
|
1275
1283
|
{
|
|
1276
1284
|
role: "listbox",
|
|
@@ -1293,7 +1301,7 @@ function Option({
|
|
|
1293
1301
|
onClick,
|
|
1294
1302
|
hint
|
|
1295
1303
|
}) {
|
|
1296
|
-
const option = /* @__PURE__ */
|
|
1304
|
+
const option = /* @__PURE__ */ jsxs8(
|
|
1297
1305
|
"button",
|
|
1298
1306
|
{
|
|
1299
1307
|
type: "button",
|
|
@@ -1312,7 +1320,7 @@ function Option({
|
|
|
1312
1320
|
}
|
|
1313
1321
|
);
|
|
1314
1322
|
if (!hint) return option;
|
|
1315
|
-
return /* @__PURE__ */
|
|
1323
|
+
return /* @__PURE__ */ jsxs8("div", { className: "flex items-center pr-2.5", children: [
|
|
1316
1324
|
option,
|
|
1317
1325
|
/* @__PURE__ */ jsx9(InfoTip, { text: hint, trigger: "hover", label: `About ${label}` })
|
|
1318
1326
|
] });
|
|
@@ -1322,7 +1330,7 @@ function Option({
|
|
|
1322
1330
|
import { useCallback as useCallback2, useEffect as useEffect6, useLayoutEffect, useRef as useRef7, useState as useState6 } from "react";
|
|
1323
1331
|
import { createPortal as createPortal2 } from "react-dom";
|
|
1324
1332
|
import { Check as Check5, ChevronDown as ChevronDown5 } from "lucide-react";
|
|
1325
|
-
import { jsx as jsx10, jsxs as
|
|
1333
|
+
import { jsx as jsx10, jsxs as jsxs9 } from "react/jsx-runtime";
|
|
1326
1334
|
function cx4(...classes) {
|
|
1327
1335
|
return classes.filter(Boolean).join(" ");
|
|
1328
1336
|
}
|
|
@@ -1372,8 +1380,8 @@ function SelectFilter({
|
|
|
1372
1380
|
window.removeEventListener("scroll", reposition, true);
|
|
1373
1381
|
};
|
|
1374
1382
|
}, [open, close, reposition]);
|
|
1375
|
-
return /* @__PURE__ */
|
|
1376
|
-
/* @__PURE__ */
|
|
1383
|
+
return /* @__PURE__ */ jsxs9("div", { className: cx4("relative", fullWidth && "w-full"), ref, children: [
|
|
1384
|
+
/* @__PURE__ */ jsxs9(
|
|
1377
1385
|
"button",
|
|
1378
1386
|
{
|
|
1379
1387
|
type: "button",
|
|
@@ -1387,7 +1395,7 @@ function SelectFilter({
|
|
|
1387
1395
|
className
|
|
1388
1396
|
),
|
|
1389
1397
|
children: [
|
|
1390
|
-
/* @__PURE__ */
|
|
1398
|
+
/* @__PURE__ */ jsxs9("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
|
|
1391
1399
|
/* @__PURE__ */ jsx10("span", { className: "text-[10px] uppercase tracking-wide text-text-tertiary", children: caption }),
|
|
1392
1400
|
/* @__PURE__ */ jsx10("span", { className: "text-[12px] font-medium text-text-primary", children: value })
|
|
1393
1401
|
] }),
|
|
@@ -1417,7 +1425,7 @@ function SelectFilter({
|
|
|
1417
1425
|
"aria-label": caption,
|
|
1418
1426
|
children: /* @__PURE__ */ jsx10("div", { className: "max-h-[280px] overflow-y-auto p-1", children: options.map((o) => {
|
|
1419
1427
|
const selected = o === value;
|
|
1420
|
-
return /* @__PURE__ */
|
|
1428
|
+
return /* @__PURE__ */ jsxs9(
|
|
1421
1429
|
"button",
|
|
1422
1430
|
{
|
|
1423
1431
|
type: "button",
|
|
@@ -1452,7 +1460,7 @@ function SelectFilter({
|
|
|
1452
1460
|
|
|
1453
1461
|
// src/Card.tsx
|
|
1454
1462
|
import { forwardRef } from "react";
|
|
1455
|
-
import { jsx as jsx11, jsxs as
|
|
1463
|
+
import { jsx as jsx11, jsxs as jsxs10 } from "react/jsx-runtime";
|
|
1456
1464
|
var Card = forwardRef(function Card2({ staticCard, title, subtitle, action, className, children, ...rest }, ref) {
|
|
1457
1465
|
return /* @__PURE__ */ jsx11(
|
|
1458
1466
|
"article",
|
|
@@ -1465,9 +1473,9 @@ var Card = forwardRef(function Card2({ staticCard, title, subtitle, action, clas
|
|
|
1465
1473
|
className
|
|
1466
1474
|
].filter(Boolean).join(" "),
|
|
1467
1475
|
...rest,
|
|
1468
|
-
children: title ? /* @__PURE__ */
|
|
1469
|
-
/* @__PURE__ */
|
|
1470
|
-
/* @__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: [
|
|
1471
1479
|
/* @__PURE__ */ jsx11("h3", { className: "text-[15px] font-semibold leading-snug text-text-primary", children: title }),
|
|
1472
1480
|
subtitle && /* @__PURE__ */ jsx11("p", { className: "mt-0.5 text-[12px] leading-snug text-text-tertiary", children: subtitle })
|
|
1473
1481
|
] }),
|
|
@@ -1481,7 +1489,7 @@ var Card = forwardRef(function Card2({ staticCard, title, subtitle, action, clas
|
|
|
1481
1489
|
|
|
1482
1490
|
// src/NoResultsEmptyState.tsx
|
|
1483
1491
|
import { FilterX } from "lucide-react";
|
|
1484
|
-
import { jsx as jsx12, jsxs as
|
|
1492
|
+
import { jsx as jsx12, jsxs as jsxs11 } from "react/jsx-runtime";
|
|
1485
1493
|
var NO_RESULTS_TITLE = "No results match your filters";
|
|
1486
1494
|
var NO_RESULTS_BODY = "Your filters may be too narrow, conflict with each other, or have no activity in this period.";
|
|
1487
1495
|
function noResultsBody(workspaceName) {
|
|
@@ -1503,11 +1511,11 @@ function NoResultsEmptyState({
|
|
|
1503
1511
|
const showClear = hasFilters !== false && Boolean(onClearFilters);
|
|
1504
1512
|
const showEdit = Boolean(onEditFilters);
|
|
1505
1513
|
const hasActions = showClear || showEdit || Boolean(actions && actions.length > 0);
|
|
1506
|
-
return /* @__PURE__ */
|
|
1514
|
+
return /* @__PURE__ */ jsxs11("div", { className: "flex flex-col items-center justify-center gap-3 text-center", "data-testid": testIdPrefix, children: [
|
|
1507
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" }) }),
|
|
1508
1516
|
/* @__PURE__ */ jsx12("h2", { className: "text-base font-semibold text-text-primary", children: title }),
|
|
1509
1517
|
/* @__PURE__ */ jsx12("p", { className: "max-w-[420px] text-[13px] leading-relaxed text-text-secondary", children: bodyText }),
|
|
1510
|
-
hasActions && /* @__PURE__ */
|
|
1518
|
+
hasActions && /* @__PURE__ */ jsxs11("div", { className: "mt-1 flex flex-col items-center gap-3", children: [
|
|
1511
1519
|
showClear && /* @__PURE__ */ jsx12(
|
|
1512
1520
|
"button",
|
|
1513
1521
|
{
|
|
@@ -1545,7 +1553,7 @@ function NoResultsEmptyState({
|
|
|
1545
1553
|
// src/WorkspaceSelectedCard.tsx
|
|
1546
1554
|
import { useEffect as useEffect7, useRef as useRef8, useState as useState7 } from "react";
|
|
1547
1555
|
import { ChevronDown as ChevronDown6, X as X2 } from "lucide-react";
|
|
1548
|
-
import { jsx as jsx13, jsxs as
|
|
1556
|
+
import { jsx as jsx13, jsxs as jsxs12 } from "react/jsx-runtime";
|
|
1549
1557
|
function cx5(...parts) {
|
|
1550
1558
|
return parts.filter(Boolean).join(" ");
|
|
1551
1559
|
}
|
|
@@ -1567,8 +1575,8 @@ function SummaryGroupItem({
|
|
|
1567
1575
|
else if (expandCount === 0) setOpen(false);
|
|
1568
1576
|
wasEmpty.current = expandCount === 0;
|
|
1569
1577
|
}, [expandCount]);
|
|
1570
|
-
return /* @__PURE__ */
|
|
1571
|
-
/* @__PURE__ */
|
|
1578
|
+
return /* @__PURE__ */ jsxs12("div", { className: nested ? "" : "py-3 first:pt-0 last:pb-0", children: [
|
|
1579
|
+
/* @__PURE__ */ jsxs12(
|
|
1572
1580
|
"button",
|
|
1573
1581
|
{
|
|
1574
1582
|
type: "button",
|
|
@@ -1590,14 +1598,14 @@ function SummaryGroupItem({
|
|
|
1590
1598
|
]
|
|
1591
1599
|
}
|
|
1592
1600
|
),
|
|
1593
|
-
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__ */
|
|
1594
|
-
ownCount > 0 && /* @__PURE__ */
|
|
1595
|
-
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(
|
|
1596
1604
|
"div",
|
|
1597
1605
|
{
|
|
1598
1606
|
className: "flex items-center justify-between gap-2 rounded-control border border-border-default bg-canvas px-2 py-1",
|
|
1599
1607
|
children: [
|
|
1600
|
-
/* @__PURE__ */
|
|
1608
|
+
/* @__PURE__ */ jsxs12("span", { className: "min-w-0 flex-1", children: [
|
|
1601
1609
|
/* @__PURE__ */ jsx13("span", { className: "block truncate text-[12px] text-text-primary", children: item.name }),
|
|
1602
1610
|
item.meta && /* @__PURE__ */ jsx13("span", { className: "block truncate text-[11px] text-text-secondary", children: item.meta })
|
|
1603
1611
|
] }),
|
|
@@ -1632,7 +1640,7 @@ function SummaryGroupItem({
|
|
|
1632
1640
|
}
|
|
1633
1641
|
|
|
1634
1642
|
// src/chart-placeholder-shared.tsx
|
|
1635
|
-
import { jsx as jsx14, jsxs as
|
|
1643
|
+
import { jsx as jsx14, jsxs as jsxs13 } from "react/jsx-runtime";
|
|
1636
1644
|
var GRID_ROWS = [0, 25, 50, 75, 100];
|
|
1637
1645
|
var Y_TICK_WIDTHS = [26, 30, 30, 26, 20];
|
|
1638
1646
|
var Y_AXIS_W = 48;
|
|
@@ -1644,8 +1652,8 @@ function AxisFrame({
|
|
|
1644
1652
|
children
|
|
1645
1653
|
}) {
|
|
1646
1654
|
const gutter = xTicks > 0 ? X_AXIS_H : 0;
|
|
1647
|
-
return /* @__PURE__ */ jsx14("div", { className: "w-full", style: { height }, role: "presentation", "aria-hidden": "true", children: /* @__PURE__ */
|
|
1648
|
-
/* @__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: [
|
|
1649
1657
|
GRID_ROWS.map((pct) => /* @__PURE__ */ jsx14(
|
|
1650
1658
|
"div",
|
|
1651
1659
|
{
|
|
@@ -1681,8 +1689,8 @@ function BlankLegend({ rows, reverse = false }) {
|
|
|
1681
1689
|
className: `flex flex-1 justify-center gap-1.5 ${reverse ? "flex-col-reverse" : "flex-col"}`,
|
|
1682
1690
|
role: "presentation",
|
|
1683
1691
|
"aria-hidden": "true",
|
|
1684
|
-
children: Array.from({ length: rows }, (_, i) => /* @__PURE__ */
|
|
1685
|
-
/* @__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: [
|
|
1686
1694
|
/* @__PURE__ */ jsx14("span", { className: "h-2.5 w-2.5 rounded-xs bg-subtle" }),
|
|
1687
1695
|
/* @__PURE__ */ jsx14(
|
|
1688
1696
|
"span",
|
|
@@ -1706,7 +1714,7 @@ function BarChartPlaceholder({ height = 220 }) {
|
|
|
1706
1714
|
}
|
|
1707
1715
|
|
|
1708
1716
|
// src/LineChartPlaceholder.tsx
|
|
1709
|
-
import { jsx as jsx16, jsxs as
|
|
1717
|
+
import { jsx as jsx16, jsxs as jsxs14 } from "react/jsx-runtime";
|
|
1710
1718
|
var LINE_SERIES = [
|
|
1711
1719
|
[58, 52, 55, 41, 45, 33, 36, 25, 28, 17],
|
|
1712
1720
|
[74, 71, 66, 68, 59, 61, 54, 56, 48, 45],
|
|
@@ -1716,8 +1724,8 @@ var LINE_SERIES = [
|
|
|
1716
1724
|
var LINE_FORECAST_FROM = 7;
|
|
1717
1725
|
function LineChartPlaceholder({ height = 280 }) {
|
|
1718
1726
|
const toPath = (pts, from, to) => pts.slice(from, to).map((y, i) => `${(i + from) / (pts.length - 1) * 100},${y}`).join(" ");
|
|
1719
|
-
return /* @__PURE__ */
|
|
1720
|
-
/* @__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: [
|
|
1721
1729
|
/* @__PURE__ */ jsx16(
|
|
1722
1730
|
"polyline",
|
|
1723
1731
|
{
|
|
@@ -1762,12 +1770,12 @@ function LineChartPlaceholder({ height = 280 }) {
|
|
|
1762
1770
|
}
|
|
1763
1771
|
|
|
1764
1772
|
// src/PieChartPlaceholder.tsx
|
|
1765
|
-
import { jsx as jsx17, jsxs as
|
|
1773
|
+
import { jsx as jsx17, jsxs as jsxs15 } from "react/jsx-runtime";
|
|
1766
1774
|
var PIE_SEAMS = [0, 115, 180, 230, 262, 288, 310, 332];
|
|
1767
1775
|
function PieChartPlaceholder({ height = 220, legendRows = 8 }) {
|
|
1768
1776
|
const r = 45;
|
|
1769
|
-
return /* @__PURE__ */
|
|
1770
|
-
/* @__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: [
|
|
1771
1779
|
/* @__PURE__ */ jsx17("circle", { cx: "50", cy: "50", r, fill: "var(--mr-color-subtle)" }),
|
|
1772
1780
|
PIE_SEAMS.map((deg) => {
|
|
1773
1781
|
const rad = (deg - 90) * Math.PI / 180;
|
|
@@ -1790,7 +1798,7 @@ function PieChartPlaceholder({ height = 220, legendRows = 8 }) {
|
|
|
1790
1798
|
}
|
|
1791
1799
|
|
|
1792
1800
|
// src/StackedColumnPlaceholder.tsx
|
|
1793
|
-
import { jsx as jsx18, jsxs as
|
|
1801
|
+
import { jsx as jsx18, jsxs as jsxs16 } from "react/jsx-runtime";
|
|
1794
1802
|
var COLUMN_WEIGHTS = [20, 30, 15, 35, 24, 12, 28, 18];
|
|
1795
1803
|
function columnBands(count) {
|
|
1796
1804
|
const weights = Array.from({ length: count }, (_, i) => COLUMN_WEIGHTS[i % COLUMN_WEIGHTS.length]);
|
|
@@ -1815,7 +1823,7 @@ function StackedColumnPlaceholder({
|
|
|
1815
1823
|
},
|
|
1816
1824
|
i
|
|
1817
1825
|
)) });
|
|
1818
|
-
return /* @__PURE__ */
|
|
1826
|
+
return /* @__PURE__ */ jsxs16("div", { className: "flex w-full gap-4", style: { height }, role: "presentation", "aria-hidden": "true", children: [
|
|
1819
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 }),
|
|
1820
1828
|
/* @__PURE__ */ jsx18(BlankLegend, { rows: legendRows, reverse: !axis })
|
|
1821
1829
|
] });
|
|
@@ -1824,7 +1832,7 @@ function StackedColumnPlaceholder({
|
|
|
1824
1832
|
// src/Tooltip.tsx
|
|
1825
1833
|
import { useEffect as useEffect8, useId, useLayoutEffect as useLayoutEffect2, useRef as useRef9, useState as useState8 } from "react";
|
|
1826
1834
|
import { createPortal as createPortal3 } from "react-dom";
|
|
1827
|
-
import { jsx as jsx19, jsxs as
|
|
1835
|
+
import { jsx as jsx19, jsxs as jsxs17 } from "react/jsx-runtime";
|
|
1828
1836
|
function cx6(...parts) {
|
|
1829
1837
|
return parts.filter(Boolean).join(" ");
|
|
1830
1838
|
}
|
|
@@ -1961,7 +1969,7 @@ function Tooltip({
|
|
|
1961
1969
|
document.body
|
|
1962
1970
|
) : null;
|
|
1963
1971
|
if (anchorRef) return floating;
|
|
1964
|
-
return /* @__PURE__ */
|
|
1972
|
+
return /* @__PURE__ */ jsxs17(
|
|
1965
1973
|
"span",
|
|
1966
1974
|
{
|
|
1967
1975
|
ref,
|
|
@@ -1980,13 +1988,13 @@ function Tooltip({
|
|
|
1980
1988
|
}
|
|
1981
1989
|
|
|
1982
1990
|
// src/AdvertiserNoResults.tsx
|
|
1983
|
-
import { jsx as jsx20, jsxs as
|
|
1991
|
+
import { jsx as jsx20, jsxs as jsxs18 } from "react/jsx-runtime";
|
|
1984
1992
|
function AdvertiserNoResults({
|
|
1985
1993
|
query,
|
|
1986
1994
|
hint = "Try checking your spelling or searching for a broader brand name."
|
|
1987
1995
|
}) {
|
|
1988
|
-
return /* @__PURE__ */
|
|
1989
|
-
/* @__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: [
|
|
1990
1998
|
"No results found for \u201C",
|
|
1991
1999
|
query,
|
|
1992
2000
|
"\u201D"
|
|
@@ -1997,9 +2005,9 @@ function AdvertiserNoResults({
|
|
|
1997
2005
|
|
|
1998
2006
|
// src/SelectAllVisible.tsx
|
|
1999
2007
|
import { ListChecks as ListChecks2 } from "lucide-react";
|
|
2000
|
-
import { jsx as jsx21, jsxs as
|
|
2008
|
+
import { jsx as jsx21, jsxs as jsxs19 } from "react/jsx-runtime";
|
|
2001
2009
|
function SelectAllVisible({ count, allSelected, onToggle, testIdPrefix }) {
|
|
2002
|
-
return /* @__PURE__ */
|
|
2010
|
+
return /* @__PURE__ */ jsxs19(
|
|
2003
2011
|
"button",
|
|
2004
2012
|
{
|
|
2005
2013
|
type: "button",
|
|
@@ -2016,14 +2024,14 @@ function SelectAllVisible({ count, allSelected, onToggle, testIdPrefix }) {
|
|
|
2016
2024
|
|
|
2017
2025
|
// src/SelectedSection.tsx
|
|
2018
2026
|
import { ChevronDown as ChevronDown7 } from "lucide-react";
|
|
2019
|
-
import { jsx as jsx22, jsxs as
|
|
2027
|
+
import { jsx as jsx22, jsxs as jsxs20 } from "react/jsx-runtime";
|
|
2020
2028
|
function cx7(...parts) {
|
|
2021
2029
|
return parts.filter(Boolean).join(" ");
|
|
2022
2030
|
}
|
|
2023
2031
|
function SelectedSection({ count, open, onToggle, children, testIdPrefix }) {
|
|
2024
2032
|
if (count === 0) return null;
|
|
2025
|
-
return /* @__PURE__ */
|
|
2026
|
-
/* @__PURE__ */
|
|
2033
|
+
return /* @__PURE__ */ jsxs20("div", { className: "flex flex-col", children: [
|
|
2034
|
+
/* @__PURE__ */ jsxs20(
|
|
2027
2035
|
"button",
|
|
2028
2036
|
{
|
|
2029
2037
|
type: "button",
|
|
@@ -2047,7 +2055,7 @@ function SelectedSection({ count, open, onToggle, children, testIdPrefix }) {
|
|
|
2047
2055
|
import { useCallback as useCallback3, useEffect as useEffect9, useLayoutEffect as useLayoutEffect3, useMemo as useMemo3, useRef as useRef10, useState as useState9 } from "react";
|
|
2048
2056
|
import { createPortal as createPortal4 } from "react-dom";
|
|
2049
2057
|
import { Search as Search4, Plus, Info as Info2, ChevronRight as ChevronRight3, ChevronDown as ChevronDown8, Check as Check6, List, Loader2 } from "lucide-react";
|
|
2050
|
-
import { Fragment as Fragment4, jsx as jsx23, jsxs as
|
|
2058
|
+
import { Fragment as Fragment4, jsx as jsx23, jsxs as jsxs21 } from "react/jsx-runtime";
|
|
2051
2059
|
function cx8(...parts) {
|
|
2052
2060
|
return parts.filter(Boolean).join(" ");
|
|
2053
2061
|
}
|
|
@@ -2142,8 +2150,8 @@ function SelectionPicker({
|
|
|
2142
2150
|
}
|
|
2143
2151
|
};
|
|
2144
2152
|
const rowGridCols = showInfoColumn ? "grid-cols-[36px_1fr_44px]" : "grid-cols-[36px_1fr]";
|
|
2145
|
-
return /* @__PURE__ */
|
|
2146
|
-
helper && /* @__PURE__ */
|
|
2153
|
+
return /* @__PURE__ */ jsxs21("div", { className: "flex flex-col gap-4", children: [
|
|
2154
|
+
helper && /* @__PURE__ */ jsxs21(Fragment4, { children: [
|
|
2147
2155
|
/* @__PURE__ */ jsx23("p", { className: "text-[13px] text-text-secondary", children: helper }),
|
|
2148
2156
|
/* @__PURE__ */ jsx23("hr", { className: "-mx-5 -mt-2 border-border-default sm:-mx-6" })
|
|
2149
2157
|
] }),
|
|
@@ -2152,7 +2160,7 @@ function SelectionPicker({
|
|
|
2152
2160
|
{ id: "lists", label: "Account lists", icon: List }
|
|
2153
2161
|
].map((t) => {
|
|
2154
2162
|
const on = source === t.id;
|
|
2155
|
-
return /* @__PURE__ */
|
|
2163
|
+
return /* @__PURE__ */ jsxs21(
|
|
2156
2164
|
"button",
|
|
2157
2165
|
{
|
|
2158
2166
|
type: "button",
|
|
@@ -2170,9 +2178,9 @@ function SelectionPicker({
|
|
|
2170
2178
|
t.id
|
|
2171
2179
|
);
|
|
2172
2180
|
}) }),
|
|
2173
|
-
source === "search" && /* @__PURE__ */
|
|
2174
|
-
/* @__PURE__ */
|
|
2175
|
-
/* @__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: [
|
|
2176
2184
|
/* @__PURE__ */ jsx23(Search4, { size: 15, className: "text-text-secondary", "aria-hidden": "true" }),
|
|
2177
2185
|
/* @__PURE__ */ jsx23(
|
|
2178
2186
|
"input",
|
|
@@ -2202,14 +2210,14 @@ function SelectionPicker({
|
|
|
2202
2210
|
)),
|
|
2203
2211
|
toolbarExtra
|
|
2204
2212
|
] }),
|
|
2205
|
-
!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: [
|
|
2206
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" }) }),
|
|
2207
|
-
/* @__PURE__ */
|
|
2215
|
+
/* @__PURE__ */ jsxs21("div", { className: "flex flex-col gap-1", children: [
|
|
2208
2216
|
/* @__PURE__ */ jsx23("p", { className: "text-[14px] font-semibold text-text-primary", children: "Search to get started" }),
|
|
2209
2217
|
/* @__PURE__ */ jsx23("p", { className: "text-[13px] text-text-tertiary", children: "Use the search or filters above to find and add options." })
|
|
2210
2218
|
] })
|
|
2211
|
-
] }) : /* @__PURE__ */
|
|
2212
|
-
/* @__PURE__ */
|
|
2219
|
+
] }) : /* @__PURE__ */ jsxs21("div", { className: "overflow-hidden rounded-control border border-border-default", children: [
|
|
2220
|
+
/* @__PURE__ */ jsxs21(
|
|
2213
2221
|
"div",
|
|
2214
2222
|
{
|
|
2215
2223
|
className: cx8(
|
|
@@ -2238,8 +2246,8 @@ function SelectionPicker({
|
|
|
2238
2246
|
const isLocked = lockedIds?.has(row.id) ?? false;
|
|
2239
2247
|
const kids = getChildren?.(row);
|
|
2240
2248
|
const isOpen = expanded.has(row.id);
|
|
2241
|
-
return /* @__PURE__ */
|
|
2242
|
-
/* @__PURE__ */
|
|
2249
|
+
return /* @__PURE__ */ jsxs21("div", { className: "border-t border-border-default/60 first:border-t-0", children: [
|
|
2250
|
+
/* @__PURE__ */ jsxs21(
|
|
2243
2251
|
"div",
|
|
2244
2252
|
{
|
|
2245
2253
|
onClick: isLocked ? void 0 : () => toggleRow(row),
|
|
@@ -2290,13 +2298,13 @@ function SelectionPicker({
|
|
|
2290
2298
|
),
|
|
2291
2299
|
isOpen && kids && /* @__PURE__ */ jsx23("div", { className: "bg-canvas/60 pb-1.5 pl-10 pr-3", children: kids.map((kid) => {
|
|
2292
2300
|
const kidSel = selectedIds.has(kid.id);
|
|
2293
|
-
return /* @__PURE__ */
|
|
2301
|
+
return /* @__PURE__ */ jsxs21(
|
|
2294
2302
|
"div",
|
|
2295
2303
|
{
|
|
2296
2304
|
className: "flex items-center justify-between gap-2 border-t border-border-default/40 py-2 first:border-t-0",
|
|
2297
2305
|
children: [
|
|
2298
2306
|
/* @__PURE__ */ jsx23("span", { className: "truncate text-[13px] text-text-secondary", children: kid.name }),
|
|
2299
|
-
/* @__PURE__ */
|
|
2307
|
+
/* @__PURE__ */ jsxs21(
|
|
2300
2308
|
"button",
|
|
2301
2309
|
{
|
|
2302
2310
|
type: "button",
|
|
@@ -2319,7 +2327,7 @@ function SelectionPicker({
|
|
|
2319
2327
|
}) })
|
|
2320
2328
|
] }, row.id);
|
|
2321
2329
|
}) }),
|
|
2322
|
-
!loading && !error && hasMore && /* @__PURE__ */
|
|
2330
|
+
!loading && !error && hasMore && /* @__PURE__ */ jsxs21(
|
|
2323
2331
|
"button",
|
|
2324
2332
|
{
|
|
2325
2333
|
type: "button",
|
|
@@ -2335,12 +2343,12 @@ function SelectionPicker({
|
|
|
2335
2343
|
)
|
|
2336
2344
|
] })
|
|
2337
2345
|
] }),
|
|
2338
|
-
source === "lists" && /* @__PURE__ */
|
|
2346
|
+
source === "lists" && /* @__PURE__ */ jsxs21("div", { className: "flex min-w-0 flex-col gap-3", children: [
|
|
2339
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." }),
|
|
2340
|
-
accountLists && accountLists.length > 0 ? /* @__PURE__ */
|
|
2348
|
+
accountLists && accountLists.length > 0 ? /* @__PURE__ */ jsxs21(Fragment4, { children: [
|
|
2341
2349
|
/* @__PURE__ */ jsx23(ScrollFade, { className: "flex max-h-[396px] flex-col gap-2 overflow-y-auto pr-0.5", children: accountLists.map((list) => {
|
|
2342
2350
|
const on = (selectedListIds ?? []).includes(list.id);
|
|
2343
|
-
return /* @__PURE__ */
|
|
2351
|
+
return /* @__PURE__ */ jsxs21(
|
|
2344
2352
|
"button",
|
|
2345
2353
|
{
|
|
2346
2354
|
type: "button",
|
|
@@ -2362,9 +2370,9 @@ function SelectionPicker({
|
|
|
2362
2370
|
children: on ? /* @__PURE__ */ jsx23(Check6, { size: 16 }) : /* @__PURE__ */ jsx23(Plus, { size: 16 })
|
|
2363
2371
|
}
|
|
2364
2372
|
),
|
|
2365
|
-
/* @__PURE__ */
|
|
2373
|
+
/* @__PURE__ */ jsxs21("span", { className: "min-w-0 flex-1", children: [
|
|
2366
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 }) }),
|
|
2367
|
-
/* @__PURE__ */
|
|
2375
|
+
/* @__PURE__ */ jsxs21("span", { className: "block truncate text-[12px] text-text-secondary", children: [
|
|
2368
2376
|
list.count,
|
|
2369
2377
|
" accounts \xB7 ",
|
|
2370
2378
|
list.entityTypes.join(", "),
|
|
@@ -2378,7 +2386,7 @@ function SelectionPicker({
|
|
|
2378
2386
|
list.id
|
|
2379
2387
|
);
|
|
2380
2388
|
}) }),
|
|
2381
|
-
/* @__PURE__ */
|
|
2389
|
+
/* @__PURE__ */ jsxs21(
|
|
2382
2390
|
"p",
|
|
2383
2391
|
{
|
|
2384
2392
|
className: "border-t border-border-default pt-2 text-right text-[12px] font-medium text-text-tertiary",
|
|
@@ -2390,9 +2398,9 @@ function SelectionPicker({
|
|
|
2390
2398
|
]
|
|
2391
2399
|
}
|
|
2392
2400
|
)
|
|
2393
|
-
] }) : /* @__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: [
|
|
2394
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" }) }),
|
|
2395
|
-
/* @__PURE__ */
|
|
2403
|
+
/* @__PURE__ */ jsxs21("div", { className: "flex flex-col gap-1", children: [
|
|
2396
2404
|
/* @__PURE__ */ jsx23("p", { className: "text-[14px] font-semibold text-text-primary", children: "No account lists yet" }),
|
|
2397
2405
|
/* @__PURE__ */ jsx23("p", { className: "text-[13px] text-text-tertiary", children: "Account lists set up for you will appear here." })
|
|
2398
2406
|
] })
|
|
@@ -2476,8 +2484,8 @@ function FilterDropdown({
|
|
|
2476
2484
|
const count = active.size;
|
|
2477
2485
|
const label = count === 0 ? filter.label : count === 1 ? [...active][0] : "Multiple";
|
|
2478
2486
|
const filterSlug = slug4(filter.label);
|
|
2479
|
-
return /* @__PURE__ */
|
|
2480
|
-
/* @__PURE__ */
|
|
2487
|
+
return /* @__PURE__ */ jsxs21("div", { className: "relative", children: [
|
|
2488
|
+
/* @__PURE__ */ jsxs21(
|
|
2481
2489
|
"button",
|
|
2482
2490
|
{
|
|
2483
2491
|
ref: btnRef,
|
|
@@ -2494,7 +2502,7 @@ function FilterDropdown({
|
|
|
2494
2502
|
}
|
|
2495
2503
|
),
|
|
2496
2504
|
open && pos && createPortal4(
|
|
2497
|
-
/* @__PURE__ */
|
|
2505
|
+
/* @__PURE__ */ jsxs21(
|
|
2498
2506
|
"div",
|
|
2499
2507
|
{
|
|
2500
2508
|
ref: menuRef,
|
|
@@ -2503,7 +2511,7 @@ function FilterDropdown({
|
|
|
2503
2511
|
style: { top: pos.top, left: pos.left },
|
|
2504
2512
|
className: "fixed z-[80] min-w-[220px] rounded-card border border-border-default bg-surface p-2 shadow-overlay",
|
|
2505
2513
|
children: [
|
|
2506
|
-
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: [
|
|
2507
2515
|
/* @__PURE__ */ jsx23(Search4, { size: 14, className: "shrink-0 text-text-secondary", "aria-hidden": "true" }),
|
|
2508
2516
|
/* @__PURE__ */ jsx23(
|
|
2509
2517
|
"input",
|
|
@@ -2518,7 +2526,7 @@ function FilterDropdown({
|
|
|
2518
2526
|
] }),
|
|
2519
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) => {
|
|
2520
2528
|
const on = active.has(opt);
|
|
2521
|
-
return /* @__PURE__ */
|
|
2529
|
+
return /* @__PURE__ */ jsxs21(
|
|
2522
2530
|
"label",
|
|
2523
2531
|
{
|
|
2524
2532
|
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 +2562,7 @@ function gridForColumns(columns) {
|
|
|
2554
2562
|
|
|
2555
2563
|
// src/PublisherBreakdownList.tsx
|
|
2556
2564
|
import { useState as useState10 } from "react";
|
|
2557
|
-
import { jsx as jsx24, jsxs as
|
|
2565
|
+
import { jsx as jsx24, jsxs as jsxs22 } from "react/jsx-runtime";
|
|
2558
2566
|
function cx9(...parts) {
|
|
2559
2567
|
return parts.filter(Boolean).join(" ");
|
|
2560
2568
|
}
|
|
@@ -2583,7 +2591,7 @@ function BreakdownTag({ children }) {
|
|
|
2583
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 });
|
|
2584
2592
|
}
|
|
2585
2593
|
function DelayedTip({ label, children }) {
|
|
2586
|
-
return /* @__PURE__ */
|
|
2594
|
+
return /* @__PURE__ */ jsxs22("span", { className: "group/dt relative inline-flex", tabIndex: 0, "aria-label": label, children: [
|
|
2587
2595
|
children,
|
|
2588
2596
|
/* @__PURE__ */ jsx24(
|
|
2589
2597
|
"span",
|
|
@@ -2599,9 +2607,9 @@ var COL_CURRENT = 76;
|
|
|
2599
2607
|
var COL_PREVIOUS = 76;
|
|
2600
2608
|
var COL_YOY = 44;
|
|
2601
2609
|
function MetricListHeader({ className }) {
|
|
2602
|
-
return /* @__PURE__ */
|
|
2610
|
+
return /* @__PURE__ */ jsxs22("div", { className: cx9("flex items-baseline gap-2 pb-2", className), children: [
|
|
2603
2611
|
/* @__PURE__ */ jsx24("span", { className: "flex-1" }),
|
|
2604
|
-
/* @__PURE__ */
|
|
2612
|
+
/* @__PURE__ */ jsxs22("span", { className: "flex shrink-0 items-center gap-2 pr-1.5", children: [
|
|
2605
2613
|
/* @__PURE__ */ jsx24("span", { className: "text-right text-[11px] font-medium text-text-tertiary", style: { width: COL_CURRENT }, children: "Current" }),
|
|
2606
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" }) }),
|
|
2607
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" }) })
|
|
@@ -2611,10 +2619,10 @@ function MetricListHeader({ className }) {
|
|
|
2611
2619
|
function MetricCells({ spendN, yoy }) {
|
|
2612
2620
|
const prior = priorYearAmt(spendN, yoy);
|
|
2613
2621
|
const up = yoy !== "NEW" && yoy >= 0;
|
|
2614
|
-
return /* @__PURE__ */
|
|
2622
|
+
return /* @__PURE__ */ jsxs22("span", { className: "flex shrink-0 items-center gap-2 pr-1.5", children: [
|
|
2615
2623
|
/* @__PURE__ */ jsx24("span", { className: "text-right text-[12px] font-bold tabular-nums text-text-primary", style: { width: COL_CURRENT }, children: fmtM(spendN) }),
|
|
2616
2624
|
/* @__PURE__ */ jsx24("span", { className: "text-right text-[12px] font-normal tabular-nums text-text-primary", style: { width: COL_PREVIOUS }, children: prior ?? "\u2014" }),
|
|
2617
|
-
/* @__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: [
|
|
2618
2626
|
up ? "+" : "\u2212",
|
|
2619
2627
|
Math.abs(yoy),
|
|
2620
2628
|
"%"
|
|
@@ -2625,14 +2633,14 @@ function PublisherBreakdownList({ rows, defaultVisibleCount = 10, padded = true,
|
|
|
2625
2633
|
const [showAll, setShowAll] = useState10(false);
|
|
2626
2634
|
const visible = showAll ? rows : rows.slice(0, defaultVisibleCount);
|
|
2627
2635
|
const rowPad = padded ? "px-5" : "";
|
|
2628
|
-
return /* @__PURE__ */
|
|
2629
|
-
/* @__PURE__ */
|
|
2636
|
+
return /* @__PURE__ */ jsxs22("div", { className: "flex flex-col", children: [
|
|
2637
|
+
/* @__PURE__ */ jsxs22("div", { className: "flex flex-col", children: [
|
|
2630
2638
|
/* @__PURE__ */ jsx24(MetricListHeader, { className: rowPad }),
|
|
2631
|
-
visible.map((p) => /* @__PURE__ */
|
|
2632
|
-
/* @__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: [
|
|
2633
2641
|
renderLogo ? renderLogo(p) : /* @__PURE__ */ jsx24(Monogram, { name: p.brand, size: 28 }),
|
|
2634
|
-
/* @__PURE__ */
|
|
2635
|
-
/* @__PURE__ */
|
|
2642
|
+
/* @__PURE__ */ jsxs22("div", { className: "min-w-0", children: [
|
|
2643
|
+
/* @__PURE__ */ jsxs22("div", { className: "flex flex-wrap items-center gap-1.5", children: [
|
|
2636
2644
|
/* @__PURE__ */ jsx24("span", { className: "text-[14px] font-semibold text-text-primary", children: p.brand }),
|
|
2637
2645
|
p.tags.map((t) => /* @__PURE__ */ jsx24(BreakdownTag, { children: t }, t))
|
|
2638
2646
|
] }),
|
|
@@ -2642,14 +2650,14 @@ function PublisherBreakdownList({ rows, defaultVisibleCount = 10, padded = true,
|
|
|
2642
2650
|
/* @__PURE__ */ jsx24(MetricCells, { spendN: p.spendN, yoy: p.yoy })
|
|
2643
2651
|
] }, p.brand))
|
|
2644
2652
|
] }),
|
|
2645
|
-
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__ */
|
|
2646
|
-
/* @__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: [
|
|
2647
2655
|
"Showing ",
|
|
2648
2656
|
visible.length,
|
|
2649
2657
|
" of ",
|
|
2650
2658
|
rows.length
|
|
2651
2659
|
] }),
|
|
2652
|
-
!showAll ? /* @__PURE__ */
|
|
2660
|
+
!showAll ? /* @__PURE__ */ jsxs22("button", { type: "button", onClick: () => setShowAll(true), className: "font-semibold text-text-link hover:underline", children: [
|
|
2653
2661
|
"See all (",
|
|
2654
2662
|
rows.length - defaultVisibleCount,
|
|
2655
2663
|
" more)"
|
|
@@ -2663,7 +2671,7 @@ import { forwardRef as forwardRef2 } from "react";
|
|
|
2663
2671
|
import { Slot } from "@radix-ui/react-slot";
|
|
2664
2672
|
import { cva } from "class-variance-authority";
|
|
2665
2673
|
import { Loader2 as Loader22 } from "lucide-react";
|
|
2666
|
-
import { jsx as jsx25, jsxs as
|
|
2674
|
+
import { jsx as jsx25, jsxs as jsxs23 } from "react/jsx-runtime";
|
|
2667
2675
|
var buttonVariants = cva(
|
|
2668
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",
|
|
2669
2677
|
{
|
|
@@ -2691,7 +2699,7 @@ var buttonVariants = cva(
|
|
|
2691
2699
|
var Button = forwardRef2(
|
|
2692
2700
|
({ className, variant, size, asChild = false, loading = false, disabled, children, ...props }, ref) => {
|
|
2693
2701
|
const Comp = asChild ? Slot : "button";
|
|
2694
|
-
return /* @__PURE__ */
|
|
2702
|
+
return /* @__PURE__ */ jsxs23(
|
|
2695
2703
|
Comp,
|
|
2696
2704
|
{
|
|
2697
2705
|
className: cn(buttonVariants({ variant, size, className })),
|
|
@@ -2710,14 +2718,14 @@ var Button = forwardRef2(
|
|
|
2710
2718
|
Button.displayName = "Button";
|
|
2711
2719
|
|
|
2712
2720
|
// src/FilterDropdownFooter.tsx
|
|
2713
|
-
import { jsx as jsx26, jsxs as
|
|
2721
|
+
import { jsx as jsx26, jsxs as jsxs24 } from "react/jsx-runtime";
|
|
2714
2722
|
function FilterDropdownFooter({
|
|
2715
2723
|
onClear,
|
|
2716
2724
|
onApply,
|
|
2717
2725
|
clearLabel = "Clear all",
|
|
2718
2726
|
applyLabel = "Apply"
|
|
2719
2727
|
}) {
|
|
2720
|
-
return /* @__PURE__ */
|
|
2728
|
+
return /* @__PURE__ */ jsxs24(
|
|
2721
2729
|
"div",
|
|
2722
2730
|
{
|
|
2723
2731
|
className: cn(
|
|
@@ -2735,7 +2743,7 @@ function FilterDropdownFooter({
|
|
|
2735
2743
|
// src/NameListModal.tsx
|
|
2736
2744
|
import { useEffect as useEffect10, useState as useState11 } from "react";
|
|
2737
2745
|
import { createPortal as createPortal5 } from "react-dom";
|
|
2738
|
-
import { jsx as jsx27, jsxs as
|
|
2746
|
+
import { jsx as jsx27, jsxs as jsxs25 } from "react/jsx-runtime";
|
|
2739
2747
|
function NameListModal({
|
|
2740
2748
|
title,
|
|
2741
2749
|
initialName,
|
|
@@ -2765,7 +2773,7 @@ function NameListModal({
|
|
|
2765
2773
|
{
|
|
2766
2774
|
className: "fixed inset-0 z-70 flex items-center justify-center bg-scrim px-4",
|
|
2767
2775
|
onMouseDown: (e) => e.target === e.currentTarget && onCancel(),
|
|
2768
|
-
children: /* @__PURE__ */
|
|
2776
|
+
children: /* @__PURE__ */ jsxs25(
|
|
2769
2777
|
"div",
|
|
2770
2778
|
{
|
|
2771
2779
|
role: "dialog",
|
|
@@ -2774,7 +2782,7 @@ function NameListModal({
|
|
|
2774
2782
|
className: "w-full max-w-[420px] rounded-card border border-border-default bg-surface p-5 shadow-overlay",
|
|
2775
2783
|
children: [
|
|
2776
2784
|
/* @__PURE__ */ jsx27("h2", { className: "text-[16px] font-semibold text-text-primary", children: title }),
|
|
2777
|
-
/* @__PURE__ */
|
|
2785
|
+
/* @__PURE__ */ jsxs25("div", { className: "mt-4 flex flex-col gap-1.5", children: [
|
|
2778
2786
|
/* @__PURE__ */ jsx27("label", { htmlFor: "account-list-name", className: "text-[12px] font-medium text-text-secondary", children: fieldLabel }),
|
|
2779
2787
|
/* @__PURE__ */ jsx27(
|
|
2780
2788
|
"input",
|
|
@@ -2788,11 +2796,11 @@ function NameListModal({
|
|
|
2788
2796
|
}
|
|
2789
2797
|
)
|
|
2790
2798
|
] }),
|
|
2791
|
-
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: [
|
|
2792
2800
|
/* @__PURE__ */ jsx27(CheckBox, { checked: !!checked[o.key], onChange: () => toggle(o.key), ariaLabel: o.label }),
|
|
2793
2801
|
o.label
|
|
2794
2802
|
] }, o.key)) }),
|
|
2795
|
-
/* @__PURE__ */
|
|
2803
|
+
/* @__PURE__ */ jsxs25("div", { className: "mt-5 flex items-center justify-end gap-2", children: [
|
|
2796
2804
|
/* @__PURE__ */ jsx27(Button, { variant: "secondary", onClick: onCancel, children: "Cancel" }),
|
|
2797
2805
|
/* @__PURE__ */ jsx27(Button, { disabled: !name.trim(), onClick: () => onSubmit(name.trim(), checked), children: submitLabel })
|
|
2798
2806
|
] })
|
|
@@ -2806,7 +2814,7 @@ function NameListModal({
|
|
|
2806
2814
|
}
|
|
2807
2815
|
|
|
2808
2816
|
// src/ChipTrigger.tsx
|
|
2809
|
-
import { jsx as jsx28, jsxs as
|
|
2817
|
+
import { jsx as jsx28, jsxs as jsxs26 } from "react/jsx-runtime";
|
|
2810
2818
|
function chipTriggerClass(variant = "box") {
|
|
2811
2819
|
return cn(
|
|
2812
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",
|
|
@@ -2817,12 +2825,12 @@ function chipTriggerClass(variant = "box") {
|
|
|
2817
2825
|
);
|
|
2818
2826
|
}
|
|
2819
2827
|
function ChipContent({ caption, value, icon }) {
|
|
2820
|
-
const stack = /* @__PURE__ */
|
|
2828
|
+
const stack = /* @__PURE__ */ jsxs26("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
|
|
2821
2829
|
/* @__PURE__ */ jsx28("span", { className: "text-[10px] uppercase tracking-wide text-text-tertiary", children: caption }),
|
|
2822
2830
|
/* @__PURE__ */ jsx28("span", { className: "text-[12px] font-medium text-text-primary", children: value })
|
|
2823
2831
|
] });
|
|
2824
2832
|
if (icon) {
|
|
2825
|
-
return /* @__PURE__ */
|
|
2833
|
+
return /* @__PURE__ */ jsxs26("span", { className: "flex items-center gap-2", children: [
|
|
2826
2834
|
/* @__PURE__ */ jsx28("span", { className: "shrink-0 text-text-tertiary", children: icon }),
|
|
2827
2835
|
stack
|
|
2828
2836
|
] });
|
|
@@ -2832,10 +2840,10 @@ function ChipContent({ caption, value, icon }) {
|
|
|
2832
2840
|
|
|
2833
2841
|
// src/FilterChipBar.tsx
|
|
2834
2842
|
import { CircleSlash, X as X3 } from "lucide-react";
|
|
2835
|
-
import { jsx as jsx29, jsxs as
|
|
2843
|
+
import { jsx as jsx29, jsxs as jsxs27 } from "react/jsx-runtime";
|
|
2836
2844
|
function FilterChipBar({ chips, onRemove, onClearAll, parkedKeys }) {
|
|
2837
2845
|
if (chips.length === 0) return null;
|
|
2838
|
-
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: [
|
|
2839
2847
|
chips.map((c) => /* @__PURE__ */ jsx29(
|
|
2840
2848
|
Chip,
|
|
2841
2849
|
{
|
|
@@ -2855,8 +2863,8 @@ function Chip({
|
|
|
2855
2863
|
parked,
|
|
2856
2864
|
onRemove
|
|
2857
2865
|
}) {
|
|
2858
|
-
return /* @__PURE__ */
|
|
2859
|
-
/* @__PURE__ */
|
|
2866
|
+
return /* @__PURE__ */ jsxs27("span", { className: "group relative inline-flex", children: [
|
|
2867
|
+
/* @__PURE__ */ jsxs27(
|
|
2860
2868
|
"span",
|
|
2861
2869
|
{
|
|
2862
2870
|
className: cn(
|
|
@@ -2896,10 +2904,10 @@ function Chip({
|
|
|
2896
2904
|
|
|
2897
2905
|
// src/SortButton.tsx
|
|
2898
2906
|
import { ArrowUp, ArrowDown, ArrowUpDown } from "lucide-react";
|
|
2899
|
-
import { jsx as jsx30, jsxs as
|
|
2907
|
+
import { jsx as jsx30, jsxs as jsxs28 } from "react/jsx-runtime";
|
|
2900
2908
|
function SortButton({ label, sortKey, sort, onSort, disabled = false }) {
|
|
2901
2909
|
const active = !disabled && sort.key === sortKey;
|
|
2902
|
-
return /* @__PURE__ */
|
|
2910
|
+
return /* @__PURE__ */ jsxs28(
|
|
2903
2911
|
"button",
|
|
2904
2912
|
{
|
|
2905
2913
|
type: "button",
|
|
@@ -2951,7 +2959,7 @@ function sortProp(sort) {
|
|
|
2951
2959
|
|
|
2952
2960
|
// src/Pager.tsx
|
|
2953
2961
|
import { ChevronLeft as ChevronLeft3, ChevronRight as ChevronRight4 } from "lucide-react";
|
|
2954
|
-
import { jsx as jsx31, jsxs as
|
|
2962
|
+
import { jsx as jsx31, jsxs as jsxs29 } from "react/jsx-runtime";
|
|
2955
2963
|
function pageWindow(current, total) {
|
|
2956
2964
|
if (total <= 7) return Array.from({ length: total }, (_, i) => i + 1);
|
|
2957
2965
|
const keep = /* @__PURE__ */ new Set([1, total, current, current - 1, current + 1]);
|
|
@@ -2967,7 +2975,7 @@ function pageWindow(current, total) {
|
|
|
2967
2975
|
}
|
|
2968
2976
|
function Pager({ page, totalPages, onPage }) {
|
|
2969
2977
|
const btn = "flex h-8 min-w-8 items-center justify-center rounded-control px-2 text-[13px] transition-colors";
|
|
2970
|
-
return /* @__PURE__ */
|
|
2978
|
+
return /* @__PURE__ */ jsxs29("div", { className: "flex items-center gap-1", children: [
|
|
2971
2979
|
/* @__PURE__ */ jsx31(
|
|
2972
2980
|
"button",
|
|
2973
2981
|
{
|
|
@@ -3056,7 +3064,7 @@ function Tag({ children, className }) {
|
|
|
3056
3064
|
|
|
3057
3065
|
// src/TablePagination.tsx
|
|
3058
3066
|
import { ChevronDown as ChevronDown9, ChevronFirst, ChevronLast, ChevronLeft as ChevronLeft4, ChevronRight as ChevronRight5 } from "lucide-react";
|
|
3059
|
-
import { jsx as jsx34, jsxs as
|
|
3067
|
+
import { jsx as jsx34, jsxs as jsxs30 } from "react/jsx-runtime";
|
|
3060
3068
|
function TablePagination({
|
|
3061
3069
|
page,
|
|
3062
3070
|
perPage,
|
|
@@ -3076,9 +3084,9 @@ function TablePagination({
|
|
|
3076
3084
|
btn,
|
|
3077
3085
|
"text-text-secondary hover:bg-subtle hover:text-text-primary disabled:pointer-events-none disabled:opacity-30"
|
|
3078
3086
|
);
|
|
3079
|
-
return /* @__PURE__ */
|
|
3080
|
-
/* @__PURE__ */
|
|
3081
|
-
/* @__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: [
|
|
3082
3090
|
/* @__PURE__ */ jsx34(
|
|
3083
3091
|
"select",
|
|
3084
3092
|
{
|
|
@@ -3100,7 +3108,7 @@ function TablePagination({
|
|
|
3100
3108
|
] }),
|
|
3101
3109
|
"items per page"
|
|
3102
3110
|
] }),
|
|
3103
|
-
/* @__PURE__ */
|
|
3111
|
+
/* @__PURE__ */ jsxs30("nav", { className: "flex items-center gap-1", "aria-label": "Pagination", children: [
|
|
3104
3112
|
/* @__PURE__ */ jsx34(
|
|
3105
3113
|
"button",
|
|
3106
3114
|
{
|
|
@@ -3162,7 +3170,7 @@ function TablePagination({
|
|
|
3162
3170
|
}
|
|
3163
3171
|
)
|
|
3164
3172
|
] }),
|
|
3165
|
-
/* @__PURE__ */
|
|
3173
|
+
/* @__PURE__ */ jsxs30("span", { className: "text-[13px] text-text-tertiary tabular-nums", children: [
|
|
3166
3174
|
rangeStart.toLocaleString(),
|
|
3167
3175
|
" \u2013 ",
|
|
3168
3176
|
rangeEnd.toLocaleString(),
|
|
@@ -3177,7 +3185,7 @@ function TablePagination({
|
|
|
3177
3185
|
// src/DateRangePicker.tsx
|
|
3178
3186
|
import { useEffect as useEffect11, useMemo as useMemo4, useRef as useRef11, useState as useState12 } from "react";
|
|
3179
3187
|
import { ChevronDown as ChevronDown10 } from "lucide-react";
|
|
3180
|
-
import { jsx as jsx35, jsxs as
|
|
3188
|
+
import { jsx as jsx35, jsxs as jsxs31 } from "react/jsx-runtime";
|
|
3181
3189
|
var MONTH_ABBR = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
|
|
3182
3190
|
var QUARTER_ABBR = ["Q1", "Q2", "Q3", "Q4"];
|
|
3183
3191
|
var PRESETS = ["Rolling 3 months", "Rolling 6 months", "Rolling 12 months"];
|
|
@@ -3283,8 +3291,8 @@ function DateRangePicker({
|
|
|
3283
3291
|
if (showFooter) setDraft(label);
|
|
3284
3292
|
else commit(label);
|
|
3285
3293
|
};
|
|
3286
|
-
return /* @__PURE__ */
|
|
3287
|
-
/* @__PURE__ */
|
|
3294
|
+
return /* @__PURE__ */ jsxs31("div", { className: "relative", ref, children: [
|
|
3295
|
+
/* @__PURE__ */ jsxs31(
|
|
3288
3296
|
"button",
|
|
3289
3297
|
{
|
|
3290
3298
|
type: "button",
|
|
@@ -3293,7 +3301,7 @@ function DateRangePicker({
|
|
|
3293
3301
|
"aria-haspopup": "listbox",
|
|
3294
3302
|
className: chipTriggerClass(),
|
|
3295
3303
|
children: [
|
|
3296
|
-
/* @__PURE__ */
|
|
3304
|
+
/* @__PURE__ */ jsxs31("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
|
|
3297
3305
|
/* @__PURE__ */ jsx35("span", { className: "text-[10px] text-text-tertiary", children: spanLabel(value, end) }),
|
|
3298
3306
|
/* @__PURE__ */ jsx35("span", { className: "text-[12px] font-medium text-text-primary", children: value })
|
|
3299
3307
|
] }),
|
|
@@ -3301,7 +3309,7 @@ function DateRangePicker({
|
|
|
3301
3309
|
]
|
|
3302
3310
|
}
|
|
3303
3311
|
),
|
|
3304
|
-
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: [
|
|
3305
3313
|
presets.map((p) => /* @__PURE__ */ jsx35(
|
|
3306
3314
|
"button",
|
|
3307
3315
|
{
|
|
@@ -3312,20 +3320,20 @@ function DateRangePicker({
|
|
|
3312
3320
|
},
|
|
3313
3321
|
p
|
|
3314
3322
|
)),
|
|
3315
|
-
/* @__PURE__ */
|
|
3323
|
+
/* @__PURE__ */ jsxs31("div", { className: "mt-1 border-t border-border-default px-3 pb-2 pt-2", children: [
|
|
3316
3324
|
/* @__PURE__ */ jsx35("div", { className: "text-[13px] font-semibold text-text-primary", children: "Custom Range" }),
|
|
3317
|
-
/* @__PURE__ */
|
|
3318
|
-
/* @__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: [
|
|
3319
3327
|
"From",
|
|
3320
|
-
/* @__PURE__ */
|
|
3328
|
+
/* @__PURE__ */ jsxs31("span", { className: "flex gap-1", children: [
|
|
3321
3329
|
granularity === "month" && /* @__PURE__ */ jsx35(MiniSelect, { value: fromMo, onChange: setFromMo, options: MONTH_ABBR.map((mm, i) => ({ label: mm, value: i })) }),
|
|
3322
3330
|
granularity === "quarter" && /* @__PURE__ */ jsx35(MiniSelect, { value: fromQ, onChange: setFromQ, options: QUARTER_ABBR.map((qq, i) => ({ label: qq, value: i })) }),
|
|
3323
3331
|
/* @__PURE__ */ jsx35(MiniSelect, { value: fromYr, onChange: setFromYr, options: yearOptions.map((y) => ({ label: String(y), value: y })) })
|
|
3324
3332
|
] })
|
|
3325
3333
|
] }),
|
|
3326
|
-
/* @__PURE__ */
|
|
3334
|
+
/* @__PURE__ */ jsxs31("label", { className: "flex items-center justify-between gap-2 text-[12px] text-text-secondary", children: [
|
|
3327
3335
|
"To",
|
|
3328
|
-
/* @__PURE__ */
|
|
3336
|
+
/* @__PURE__ */ jsxs31("span", { className: "flex gap-1", children: [
|
|
3329
3337
|
granularity === "month" && /* @__PURE__ */ jsx35(MiniSelect, { value: toMo, onChange: setToMo, options: MONTH_ABBR.map((mm, i) => ({ label: mm, value: i })) }),
|
|
3330
3338
|
granularity === "quarter" && /* @__PURE__ */ jsx35(MiniSelect, { value: toQ, onChange: setToQ, options: QUARTER_ABBR.map((qq, i) => ({ label: qq, value: i })) }),
|
|
3331
3339
|
/* @__PURE__ */ jsx35(MiniSelect, { value: toYr, onChange: setToYr, options: yearOptions.map((y) => ({ label: String(y), value: y })) })
|
|
@@ -3351,7 +3359,7 @@ function DateRangePicker({
|
|
|
3351
3359
|
// src/MultiSelectFilter.tsx
|
|
3352
3360
|
import { useCallback as useCallback4, useEffect as useEffect12, useRef as useRef12, useState as useState13 } from "react";
|
|
3353
3361
|
import { ChevronDown as ChevronDown11, Check as Check7, Minus as Minus2, Search as Search5, X as X4 } from "lucide-react";
|
|
3354
|
-
import { jsx as jsx36, jsxs as
|
|
3362
|
+
import { jsx as jsx36, jsxs as jsxs32 } from "react/jsx-runtime";
|
|
3355
3363
|
function MultiSelectFilter({
|
|
3356
3364
|
caption,
|
|
3357
3365
|
options = [],
|
|
@@ -3442,8 +3450,8 @@ function MultiSelectFilter({
|
|
|
3442
3450
|
const kids = live.filter((c) => c.label.toLowerCase().includes(ql));
|
|
3443
3451
|
return kids.length ? { ...g, children: kids } : null;
|
|
3444
3452
|
}).filter((g) => g !== null) : [];
|
|
3445
|
-
return /* @__PURE__ */
|
|
3446
|
-
/* @__PURE__ */
|
|
3453
|
+
return /* @__PURE__ */ jsxs32("div", { className: cn("relative", fullWidth && "w-full"), ref, children: [
|
|
3454
|
+
/* @__PURE__ */ jsxs32(
|
|
3447
3455
|
"button",
|
|
3448
3456
|
{
|
|
3449
3457
|
type: "button",
|
|
@@ -3463,7 +3471,7 @@ function MultiSelectFilter({
|
|
|
3463
3471
|
]
|
|
3464
3472
|
}
|
|
3465
3473
|
),
|
|
3466
|
-
open && /* @__PURE__ */
|
|
3474
|
+
open && /* @__PURE__ */ jsxs32(
|
|
3467
3475
|
"div",
|
|
3468
3476
|
{
|
|
3469
3477
|
className: cn(
|
|
@@ -3474,7 +3482,7 @@ function MultiSelectFilter({
|
|
|
3474
3482
|
role: "dialog",
|
|
3475
3483
|
"aria-label": caption,
|
|
3476
3484
|
children: [
|
|
3477
|
-
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: [
|
|
3478
3486
|
/* @__PURE__ */ jsx36(Search5, { size: 14, className: "text-text-secondary", "aria-hidden": "true" }),
|
|
3479
3487
|
/* @__PURE__ */ jsx36(
|
|
3480
3488
|
"input",
|
|
@@ -3488,11 +3496,11 @@ function MultiSelectFilter({
|
|
|
3488
3496
|
),
|
|
3489
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 }) })
|
|
3490
3498
|
] }) }),
|
|
3491
|
-
/* @__PURE__ */
|
|
3499
|
+
/* @__PURE__ */ jsxs32("div", { className: "max-h-[280px] overflow-y-auto p-1", children: [
|
|
3492
3500
|
groups ? visibleGroups.map((g) => {
|
|
3493
3501
|
const state = groupState(g);
|
|
3494
|
-
return /* @__PURE__ */
|
|
3495
|
-
/* @__PURE__ */
|
|
3502
|
+
return /* @__PURE__ */ jsxs32("div", { children: [
|
|
3503
|
+
/* @__PURE__ */ jsxs32(
|
|
3496
3504
|
"button",
|
|
3497
3505
|
{
|
|
3498
3506
|
type: "button",
|
|
@@ -3507,7 +3515,7 @@ function MultiSelectFilter({
|
|
|
3507
3515
|
),
|
|
3508
3516
|
g.children.map((c) => {
|
|
3509
3517
|
const checked = draft.includes(c.id);
|
|
3510
|
-
return /* @__PURE__ */
|
|
3518
|
+
return /* @__PURE__ */ jsxs32(
|
|
3511
3519
|
"button",
|
|
3512
3520
|
{
|
|
3513
3521
|
type: "button",
|
|
@@ -3525,7 +3533,7 @@ function MultiSelectFilter({
|
|
|
3525
3533
|
] }, g.id);
|
|
3526
3534
|
}) : items.map((o) => {
|
|
3527
3535
|
const checked = draft.includes(o.id);
|
|
3528
|
-
return /* @__PURE__ */
|
|
3536
|
+
return /* @__PURE__ */ jsxs32(
|
|
3529
3537
|
"button",
|
|
3530
3538
|
{
|
|
3531
3539
|
type: "button",
|
|
@@ -3551,7 +3559,7 @@ function MultiSelectFilter({
|
|
|
3551
3559
|
}),
|
|
3552
3560
|
(groups && !visibleGroups.length || !groups && !items.length) && /* @__PURE__ */ jsx36("div", { className: "py-6 text-center text-[13px] text-text-tertiary", children: "No matches." })
|
|
3553
3561
|
] }),
|
|
3554
|
-
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(
|
|
3555
3563
|
"button",
|
|
3556
3564
|
{
|
|
3557
3565
|
type: "button",
|
|
@@ -3570,7 +3578,7 @@ function MultiSelectFilter({
|
|
|
3570
3578
|
}
|
|
3571
3579
|
function TriCheck({ state }) {
|
|
3572
3580
|
const filled = state !== "none";
|
|
3573
|
-
return /* @__PURE__ */
|
|
3581
|
+
return /* @__PURE__ */ jsxs32(
|
|
3574
3582
|
"span",
|
|
3575
3583
|
{
|
|
3576
3584
|
className: cn(
|
|
@@ -3585,7 +3593,7 @@ function TriCheck({ state }) {
|
|
|
3585
3593
|
);
|
|
3586
3594
|
}
|
|
3587
3595
|
function OptionCount({ n }) {
|
|
3588
|
-
return /* @__PURE__ */
|
|
3596
|
+
return /* @__PURE__ */ jsxs32("span", { className: "shrink-0 text-[12px] tabular-nums text-text-tertiary", children: [
|
|
3589
3597
|
"(",
|
|
3590
3598
|
n.toLocaleString(),
|
|
3591
3599
|
")"
|
|
@@ -3633,11 +3641,11 @@ function Toggle({ checked, onChange, label, size = "md", disabled, className })
|
|
|
3633
3641
|
// src/AISpark.tsx
|
|
3634
3642
|
import { useId as useId2 } from "react";
|
|
3635
3643
|
import { Sparkles } from "lucide-react";
|
|
3636
|
-
import { Fragment as Fragment5, jsx as jsx38, jsxs as
|
|
3644
|
+
import { Fragment as Fragment5, jsx as jsx38, jsxs as jsxs33 } from "react/jsx-runtime";
|
|
3637
3645
|
function AISpark({ size = 16, className }) {
|
|
3638
3646
|
const id = useId2();
|
|
3639
|
-
return /* @__PURE__ */
|
|
3640
|
-
/* @__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: [
|
|
3641
3649
|
/* @__PURE__ */ jsx38("stop", { offset: "0%", stopColor: "var(--mr-color-brand-primary)" }),
|
|
3642
3650
|
/* @__PURE__ */ jsx38("stop", { offset: "100%", className: "[stop-color:#9474ff] in-data-[theme=dark]:[stop-color:#a488ff]" })
|
|
3643
3651
|
] }) }) }),
|