@mediaradar/design-components 0.11.0 → 0.13.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 +528 -439
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +75 -2
- package/dist/index.d.ts +75 -2
- package/dist/index.js +387 -299
- package/dist/index.js.map +1 -1
- package/package.json +2 -2
- package/scripts/tailwind-coverage.mjs +11 -0
package/dist/index.js
CHANGED
|
@@ -388,18 +388,92 @@ function OptionRow({
|
|
|
388
388
|
);
|
|
389
389
|
}
|
|
390
390
|
|
|
391
|
-
// src/CheckBox.tsx
|
|
392
|
-
import { Check as Check2, Minus } from "lucide-react";
|
|
393
|
-
|
|
394
391
|
// src/cn.ts
|
|
395
392
|
import { clsx } from "clsx";
|
|
396
|
-
import {
|
|
393
|
+
import { extendTailwindMerge } from "tailwind-merge";
|
|
394
|
+
var twMerge = extendTailwindMerge({
|
|
395
|
+
extend: {
|
|
396
|
+
classGroups: {
|
|
397
|
+
"font-size": [{ text: ["micro", "dense"] }]
|
|
398
|
+
}
|
|
399
|
+
}
|
|
400
|
+
});
|
|
397
401
|
function cn(...inputs) {
|
|
398
402
|
return twMerge(clsx(inputs));
|
|
399
403
|
}
|
|
400
404
|
|
|
401
|
-
// src/
|
|
405
|
+
// src/Badge.tsx
|
|
402
406
|
import { jsx as jsx4 } from "react/jsx-runtime";
|
|
407
|
+
var TONE = {
|
|
408
|
+
neutral: "bg-subtle text-text-secondary",
|
|
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",
|
|
416
|
+
success: "bg-status-success/15 text-text-success",
|
|
417
|
+
// Heavier tint than success and danger on purpose. Equal opacity does not
|
|
418
|
+
// give equal presence: the warning amber (#b8843a) sits far closer to the
|
|
419
|
+
// warm canvas than red or green do, so the same 15% that reads clearly for
|
|
420
|
+
// those two disappeared here and the badge looked neutral.
|
|
421
|
+
warning: "bg-status-warning/30 text-text-warning",
|
|
422
|
+
danger: "bg-status-danger/15 text-text-danger",
|
|
423
|
+
// The gradient is the OUTLINE, not the fill. As a fill it was the most
|
|
424
|
+
// distinct tone by a mile, but white text on it ran from 7.5:1 at the blue
|
|
425
|
+
// end down to 2.1:1 at the amber end -- the last third of every AI badge
|
|
426
|
+
// was unreadable. Outlining keeps the gradient as the signal and puts the
|
|
427
|
+
// text back on a flat tint.
|
|
428
|
+
//
|
|
429
|
+
// Two backgrounds in one box: the tint clipped to the padding box, the
|
|
430
|
+
// gradient to the border box, over a transparent 1px border. The tint is
|
|
431
|
+
// opaque on purpose -- an outline over a transparent centre would let the
|
|
432
|
+
// gradient show through the middle, and the badge has to sit on both the
|
|
433
|
+
// canvas and a card without knowing which.
|
|
434
|
+
ai: "border border-transparent text-ai-ontint",
|
|
435
|
+
// Sits on artwork, not on the canvas, so it carries its own scrim rather
|
|
436
|
+
// than a theme surface -- the image behind it is not a colour we control.
|
|
437
|
+
overlay: "bg-scrim text-brand-onprimary"
|
|
438
|
+
};
|
|
439
|
+
var TONE_STYLE = {
|
|
440
|
+
ai: {
|
|
441
|
+
background: "linear-gradient(var(--mr-color-ai-tint), var(--mr-color-ai-tint)) padding-box, var(--mr-color-ai-gradient) border-box"
|
|
442
|
+
}
|
|
443
|
+
};
|
|
444
|
+
var KIND = {
|
|
445
|
+
label: "px-2 py-0.5",
|
|
446
|
+
// Square-ish and centred, with a floor width so a 1-digit and a 3-digit
|
|
447
|
+
// count are the same shape, and lining figures so the width does not shift
|
|
448
|
+
// as the number changes.
|
|
449
|
+
count: "h-[18px] min-w-[18px] justify-center px-1.5 tabular-nums",
|
|
450
|
+
// The only kind that shouts. Caps need the letterspacing -- caps set tight
|
|
451
|
+
// are harder to read than the sentence case they replaced.
|
|
452
|
+
eyebrow: "px-2 py-0.5 uppercase tracking-wider"
|
|
453
|
+
};
|
|
454
|
+
function Badge({ tone = "neutral", kind = "label", children, className }) {
|
|
455
|
+
return /* @__PURE__ */ jsx4(
|
|
456
|
+
"span",
|
|
457
|
+
{
|
|
458
|
+
style: TONE_STYLE[tone],
|
|
459
|
+
className: cn(
|
|
460
|
+
// `inline-flex` + `gap` so a leading icon sits on the text baseline
|
|
461
|
+
// without every caller re-inventing the spacing. `shrink-0` because a
|
|
462
|
+
// badge is almost always beside flexible text that would otherwise
|
|
463
|
+
// squash it. `whitespace-nowrap` because a wrapped badge is a bug.
|
|
464
|
+
"inline-flex shrink-0 items-center gap-1 whitespace-nowrap rounded-full text-micro font-semibold leading-none",
|
|
465
|
+
TONE[tone],
|
|
466
|
+
KIND[kind],
|
|
467
|
+
className
|
|
468
|
+
),
|
|
469
|
+
children
|
|
470
|
+
}
|
|
471
|
+
);
|
|
472
|
+
}
|
|
473
|
+
|
|
474
|
+
// src/CheckBox.tsx
|
|
475
|
+
import { Check as Check2, Minus } from "lucide-react";
|
|
476
|
+
import { jsx as jsx5 } from "react/jsx-runtime";
|
|
403
477
|
function boxClass(on, disabled) {
|
|
404
478
|
return cn(
|
|
405
479
|
"flex h-[18px] w-[18px] shrink-0 items-center justify-center rounded-[5px] border transition-colors",
|
|
@@ -408,8 +482,8 @@ function boxClass(on, disabled) {
|
|
|
408
482
|
);
|
|
409
483
|
}
|
|
410
484
|
function Glyph({ checked, indeterminate }) {
|
|
411
|
-
if (indeterminate) return /* @__PURE__ */
|
|
412
|
-
return checked ? /* @__PURE__ */
|
|
485
|
+
if (indeterminate) return /* @__PURE__ */ jsx5(Minus, { size: 13, strokeWidth: 3 });
|
|
486
|
+
return checked ? /* @__PURE__ */ jsx5(Check2, { size: 13, strokeWidth: 3 }) : null;
|
|
413
487
|
}
|
|
414
488
|
function CheckBox({
|
|
415
489
|
checked,
|
|
@@ -423,7 +497,7 @@ function CheckBox({
|
|
|
423
497
|
className
|
|
424
498
|
}) {
|
|
425
499
|
const on = checked || !!indeterminate;
|
|
426
|
-
return /* @__PURE__ */
|
|
500
|
+
return /* @__PURE__ */ jsx5(
|
|
427
501
|
"button",
|
|
428
502
|
{
|
|
429
503
|
type: "button",
|
|
@@ -447,18 +521,18 @@ function CheckBox({
|
|
|
447
521
|
disabled && "hover:border-border-interactive",
|
|
448
522
|
className
|
|
449
523
|
),
|
|
450
|
-
children: /* @__PURE__ */
|
|
524
|
+
children: /* @__PURE__ */ jsx5(Glyph, { checked, indeterminate })
|
|
451
525
|
}
|
|
452
526
|
);
|
|
453
527
|
}
|
|
454
528
|
function CheckBoxBox({ checked, indeterminate, disabled, className }) {
|
|
455
|
-
return /* @__PURE__ */
|
|
529
|
+
return /* @__PURE__ */ jsx5("span", { "aria-hidden": "true", className: cn(boxClass(checked || !!indeterminate, disabled), className), children: /* @__PURE__ */ jsx5(Glyph, { checked, indeterminate }) });
|
|
456
530
|
}
|
|
457
531
|
|
|
458
532
|
// src/DateRangeFilter.tsx
|
|
459
533
|
import { useEffect as useEffect3, useMemo as useMemo2, useRef as useRef3, useState as useState3 } from "react";
|
|
460
534
|
import { ChevronDown as ChevronDown2, ChevronLeft, ChevronRight } from "lucide-react";
|
|
461
|
-
import { jsx as
|
|
535
|
+
import { jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
462
536
|
var DEFAULT_SHORTCUTS = [
|
|
463
537
|
"Year to date",
|
|
464
538
|
"Rolling 3 months",
|
|
@@ -674,12 +748,12 @@ function DateRangeFilter({
|
|
|
674
748
|
"aria-expanded": open,
|
|
675
749
|
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",
|
|
676
750
|
children: [
|
|
677
|
-
icon && /* @__PURE__ */
|
|
751
|
+
icon && /* @__PURE__ */ jsx6("span", { className: "shrink-0 text-text-tertiary", children: icon }),
|
|
678
752
|
/* @__PURE__ */ jsxs4("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
|
|
679
|
-
/* @__PURE__ */
|
|
680
|
-
/* @__PURE__ */
|
|
753
|
+
/* @__PURE__ */ jsx6("span", { className: showDates ? "text-[11px] text-text-tertiary" : "text-[10px] uppercase tracking-wide text-text-tertiary", children: showDates ? displayDatesLine : caption }),
|
|
754
|
+
/* @__PURE__ */ jsx6("span", { className: "text-[12px] font-medium text-text-primary", children: displayValue })
|
|
681
755
|
] }),
|
|
682
|
-
/* @__PURE__ */
|
|
756
|
+
/* @__PURE__ */ jsx6(ChevronDown2, { size: 14, "aria-hidden": "true", className: `shrink-0 text-text-secondary transition-transform ${open ? "rotate-180" : ""}` })
|
|
683
757
|
]
|
|
684
758
|
}
|
|
685
759
|
),
|
|
@@ -691,7 +765,7 @@ function DateRangeFilter({
|
|
|
691
765
|
role: "dialog",
|
|
692
766
|
"aria-label": "Select date range",
|
|
693
767
|
children: [
|
|
694
|
-
/* @__PURE__ */
|
|
768
|
+
/* @__PURE__ */ jsx6("div", { className: "flex w-44 shrink-0 flex-col gap-0.5 border-r border-border-default p-2", children: SHORTCUTS.map((s) => /* @__PURE__ */ jsx6(
|
|
695
769
|
"button",
|
|
696
770
|
{
|
|
697
771
|
type: "button",
|
|
@@ -704,26 +778,26 @@ function DateRangeFilter({
|
|
|
704
778
|
)) }),
|
|
705
779
|
/* @__PURE__ */ jsxs4("div", { className: "flex flex-col p-4", children: [
|
|
706
780
|
/* @__PURE__ */ jsxs4("div", { className: "flex items-end gap-3", children: [
|
|
707
|
-
/* @__PURE__ */
|
|
708
|
-
/* @__PURE__ */
|
|
709
|
-
/* @__PURE__ */
|
|
781
|
+
/* @__PURE__ */ jsx6(Field, { label: "Start Date", value: start ? fmt(start) : "\u2014" }),
|
|
782
|
+
/* @__PURE__ */ jsx6("span", { className: "pb-2.5 text-text-tertiary", children: "\u2014" }),
|
|
783
|
+
/* @__PURE__ */ jsx6(Field, { label: "End Date", value: end ? fmt(end) : start ? fmt(start) : "\u2014" })
|
|
710
784
|
] }),
|
|
711
|
-
/* @__PURE__ */
|
|
712
|
-
/* @__PURE__ */
|
|
785
|
+
/* @__PURE__ */ jsx6("div", { className: "my-4 border-t border-border-default" }),
|
|
786
|
+
/* @__PURE__ */ jsx6("div", { className: "flex gap-8", children: [0, 1].map((offset) => {
|
|
713
787
|
const m = addMonths(leftMonth, offset);
|
|
714
788
|
const grid = monthGrid(m.getFullYear(), m.getMonth());
|
|
715
789
|
return /* @__PURE__ */ jsxs4("div", { className: "w-[252px]", children: [
|
|
716
790
|
/* @__PURE__ */ jsxs4("div", { className: "mb-2 flex items-center justify-between", children: [
|
|
717
|
-
offset === 0 ? /* @__PURE__ */
|
|
791
|
+
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" }),
|
|
718
792
|
/* @__PURE__ */ jsxs4("span", { className: "text-[15px] font-semibold text-text-primary", children: [
|
|
719
793
|
MONTHS[m.getMonth()],
|
|
720
794
|
" ",
|
|
721
795
|
m.getFullYear()
|
|
722
796
|
] }),
|
|
723
|
-
offset === 1 ? /* @__PURE__ */
|
|
797
|
+
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" })
|
|
724
798
|
] }),
|
|
725
799
|
/* @__PURE__ */ jsxs4("div", { className: "grid grid-cols-7", children: [
|
|
726
|
-
WEEKDAYS.map((w) => /* @__PURE__ */
|
|
800
|
+
WEEKDAYS.map((w) => /* @__PURE__ */ jsx6("div", { className: "flex h-8 items-center justify-center text-[12px] font-semibold text-text-secondary", children: w }, w)),
|
|
727
801
|
grid.map((d, i) => {
|
|
728
802
|
const inMonth = d.getMonth() === m.getMonth();
|
|
729
803
|
const hasRange = !!(start && end);
|
|
@@ -739,8 +813,8 @@ function DateRangeFilter({
|
|
|
739
813
|
else band = "left-0 right-0";
|
|
740
814
|
}
|
|
741
815
|
return /* @__PURE__ */ jsxs4("button", { type: "button", onClick: () => pickDay(d), className: "relative flex h-9 items-center justify-center", children: [
|
|
742
|
-
band && /* @__PURE__ */
|
|
743
|
-
/* @__PURE__ */
|
|
816
|
+
band && /* @__PURE__ */ jsx6("span", { className: `absolute inset-y-[3px] bg-ai-tint ${band}`, "aria-hidden": "true" }),
|
|
817
|
+
/* @__PURE__ */ jsx6(
|
|
744
818
|
"span",
|
|
745
819
|
{
|
|
746
820
|
className: `relative z-10 flex h-8 w-8 items-center justify-center rounded-full text-[13px] tabular-nums ${endpoint ? "bg-brand-primaryAction font-semibold text-white" : inMonth ? "text-text-primary hover:bg-subtle" : "text-text-tertiary"}`,
|
|
@@ -753,8 +827,8 @@ function DateRangeFilter({
|
|
|
753
827
|
] }, offset);
|
|
754
828
|
}) }),
|
|
755
829
|
/* @__PURE__ */ jsxs4("div", { className: "mt-4 flex justify-end gap-2", children: [
|
|
756
|
-
/* @__PURE__ */
|
|
757
|
-
/* @__PURE__ */
|
|
830
|
+
/* @__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
|
+
/* @__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" })
|
|
758
832
|
] })
|
|
759
833
|
] })
|
|
760
834
|
]
|
|
@@ -764,18 +838,18 @@ function DateRangeFilter({
|
|
|
764
838
|
}
|
|
765
839
|
function Field({ label, value }) {
|
|
766
840
|
return /* @__PURE__ */ jsxs4("div", { className: "flex flex-col gap-1.5", children: [
|
|
767
|
-
/* @__PURE__ */
|
|
768
|
-
/* @__PURE__ */
|
|
841
|
+
/* @__PURE__ */ jsx6("span", { className: "text-[12px] font-medium text-text-secondary", children: label }),
|
|
842
|
+
/* @__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 })
|
|
769
843
|
] });
|
|
770
844
|
}
|
|
771
845
|
function NavBtn({ children, onClick, ...rest }) {
|
|
772
|
-
return /* @__PURE__ */
|
|
846
|
+
return /* @__PURE__ */ jsx6("button", { type: "button", onClick, className: "flex h-7 w-7 items-center justify-center rounded-full text-text-secondary transition-colors hover:bg-subtle hover:text-text-primary", ...rest, children });
|
|
773
847
|
}
|
|
774
848
|
|
|
775
849
|
// src/SearchBar.tsx
|
|
776
850
|
import { useEffect as useEffect4, useRef as useRef4, useState as useState4 } from "react";
|
|
777
851
|
import { AlertCircle, Check as Check3, ChevronDown as ChevronDown3, Search as Search3 } from "lucide-react";
|
|
778
|
-
import { Fragment as Fragment3, jsx as
|
|
852
|
+
import { Fragment as Fragment3, jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
|
|
779
853
|
var DEFAULT_SEARCH_MATCH = { mode: "anyWord", wordJoin: "Or" };
|
|
780
854
|
var MODE_LABEL = {
|
|
781
855
|
anyWord: "Any Word",
|
|
@@ -821,8 +895,8 @@ function SearchBar({
|
|
|
821
895
|
),
|
|
822
896
|
children: [
|
|
823
897
|
/* @__PURE__ */ jsxs5("label", { className: "flex min-w-0 flex-1 items-center gap-2 px-2.5", children: [
|
|
824
|
-
/* @__PURE__ */
|
|
825
|
-
/* @__PURE__ */
|
|
898
|
+
/* @__PURE__ */ jsx7(Search3, { size: 15, "aria-hidden": "true", className: "shrink-0 text-text-tertiary" }),
|
|
899
|
+
/* @__PURE__ */ jsx7(
|
|
826
900
|
"input",
|
|
827
901
|
{
|
|
828
902
|
type: "text",
|
|
@@ -858,7 +932,7 @@ function SearchBar({
|
|
|
858
932
|
className: "flex h-full items-center gap-1 px-2.5 text-[13px] font-medium text-text-primary transition-colors hover:bg-subtle",
|
|
859
933
|
children: [
|
|
860
934
|
matchValue.mode === "anyWord" ? `${MODE_LABEL.anyWord} (${matchValue.wordJoin})` : MODE_LABEL[matchValue.mode],
|
|
861
|
-
/* @__PURE__ */
|
|
935
|
+
/* @__PURE__ */ jsx7(
|
|
862
936
|
ChevronDown3,
|
|
863
937
|
{
|
|
864
938
|
size: 14,
|
|
@@ -869,7 +943,7 @@ function SearchBar({
|
|
|
869
943
|
]
|
|
870
944
|
}
|
|
871
945
|
),
|
|
872
|
-
open && /* @__PURE__ */
|
|
946
|
+
open && /* @__PURE__ */ jsx7(
|
|
873
947
|
"div",
|
|
874
948
|
{
|
|
875
949
|
role: "dialog",
|
|
@@ -877,17 +951,17 @@ function SearchBar({
|
|
|
877
951
|
"data-testid": testIdPrefix && `${testIdPrefix}-mode-popover`,
|
|
878
952
|
className: "absolute right-0 top-[calc(100%+8px)] z-50 w-[400px] rounded-card border border-border-default bg-surface p-3 shadow-overlay",
|
|
879
953
|
children: /* @__PURE__ */ jsxs5("div", { role: "radiogroup", "aria-label": "Search match type", className: "flex flex-col", children: [
|
|
880
|
-
/* @__PURE__ */
|
|
954
|
+
/* @__PURE__ */ jsx7(
|
|
881
955
|
ModeRow,
|
|
882
956
|
{
|
|
883
957
|
title: "Any Word Text Search",
|
|
884
958
|
selected: matchValue.mode === "anyWord",
|
|
885
959
|
onSelect: () => onMatchChange?.({ mode: "anyWord", wordJoin: matchValue.wordJoin }),
|
|
886
960
|
testId: testIdPrefix && `${testIdPrefix}-mode-anyWord`,
|
|
887
|
-
description: /* @__PURE__ */
|
|
961
|
+
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." }),
|
|
888
962
|
infoText: "The Or/And choice applies only when Any Word is the active search mode.",
|
|
889
963
|
extra: /* @__PURE__ */ jsxs5("span", { className: "flex items-center gap-3", children: [
|
|
890
|
-
/* @__PURE__ */
|
|
964
|
+
/* @__PURE__ */ jsx7(
|
|
891
965
|
RadioOption,
|
|
892
966
|
{
|
|
893
967
|
label: "Or",
|
|
@@ -896,7 +970,7 @@ function SearchBar({
|
|
|
896
970
|
testId: testIdPrefix && `${testIdPrefix}-word-join-or`
|
|
897
971
|
}
|
|
898
972
|
),
|
|
899
|
-
/* @__PURE__ */
|
|
973
|
+
/* @__PURE__ */ jsx7(
|
|
900
974
|
RadioOption,
|
|
901
975
|
{
|
|
902
976
|
label: "And",
|
|
@@ -908,8 +982,8 @@ function SearchBar({
|
|
|
908
982
|
] })
|
|
909
983
|
}
|
|
910
984
|
),
|
|
911
|
-
/* @__PURE__ */
|
|
912
|
-
/* @__PURE__ */
|
|
985
|
+
/* @__PURE__ */ jsx7(Divider, {}),
|
|
986
|
+
/* @__PURE__ */ jsx7(
|
|
913
987
|
ModeRow,
|
|
914
988
|
{
|
|
915
989
|
title: "Exact Match Text Search",
|
|
@@ -920,8 +994,8 @@ function SearchBar({
|
|
|
920
994
|
infoText: "Keywords are matched as a single contiguous phrase, in the order you typed them."
|
|
921
995
|
}
|
|
922
996
|
),
|
|
923
|
-
/* @__PURE__ */
|
|
924
|
-
/* @__PURE__ */
|
|
997
|
+
/* @__PURE__ */ jsx7(Divider, {}),
|
|
998
|
+
/* @__PURE__ */ jsx7(
|
|
925
999
|
ModeRow,
|
|
926
1000
|
{
|
|
927
1001
|
title: "Contextual Search",
|
|
@@ -933,8 +1007,8 @@ function SearchBar({
|
|
|
933
1007
|
infoText: "Uses semantic matching, so results can include related terms even when the exact keyword isn't present."
|
|
934
1008
|
}
|
|
935
1009
|
),
|
|
936
|
-
/* @__PURE__ */
|
|
937
|
-
/* @__PURE__ */
|
|
1010
|
+
/* @__PURE__ */ jsx7(Divider, {}),
|
|
1011
|
+
/* @__PURE__ */ jsx7(
|
|
938
1012
|
ModeRow,
|
|
939
1013
|
{
|
|
940
1014
|
title: "Ad Code Search",
|
|
@@ -954,7 +1028,7 @@ function SearchBar({
|
|
|
954
1028
|
);
|
|
955
1029
|
}
|
|
956
1030
|
function Divider() {
|
|
957
|
-
return /* @__PURE__ */
|
|
1031
|
+
return /* @__PURE__ */ jsx7("div", { className: "my-2.5 border-t border-border-default", "aria-hidden": "true" });
|
|
958
1032
|
}
|
|
959
1033
|
function ModeRow({
|
|
960
1034
|
title,
|
|
@@ -985,15 +1059,15 @@ function ModeRow({
|
|
|
985
1059
|
/* @__PURE__ */ jsxs5("div", { className: "flex items-center justify-between gap-2", children: [
|
|
986
1060
|
/* @__PURE__ */ jsxs5("div", { className: "flex flex-wrap items-center gap-3", children: [
|
|
987
1061
|
/* @__PURE__ */ jsxs5("span", { className: "flex items-center gap-1", children: [
|
|
988
|
-
/* @__PURE__ */
|
|
989
|
-
/* @__PURE__ */
|
|
1062
|
+
/* @__PURE__ */ jsx7("span", { className: "text-[14px] font-semibold text-text-primary", children: title }),
|
|
1063
|
+
/* @__PURE__ */ jsx7(RowInfoTip, { text: infoText })
|
|
990
1064
|
] }),
|
|
991
|
-
badge && /* @__PURE__ */
|
|
1065
|
+
badge && /* @__PURE__ */ jsx7("span", { className: "rounded-full bg-subtle px-2 py-0.5 text-[10px] font-semibold uppercase tracking-wide text-text-secondary", children: badge }),
|
|
992
1066
|
extra
|
|
993
1067
|
] }),
|
|
994
|
-
selected && /* @__PURE__ */
|
|
1068
|
+
selected && /* @__PURE__ */ jsx7(Check3, { size: 16, strokeWidth: 2.5, "aria-hidden": "true", className: "shrink-0 text-brand-primaryAction" })
|
|
995
1069
|
] }),
|
|
996
|
-
/* @__PURE__ */
|
|
1070
|
+
/* @__PURE__ */ jsx7("span", { className: "block text-[12.5px] leading-snug text-text-secondary", children: description })
|
|
997
1071
|
]
|
|
998
1072
|
}
|
|
999
1073
|
);
|
|
@@ -1017,14 +1091,14 @@ function RadioOption({
|
|
|
1017
1091
|
"aria-checked": checked,
|
|
1018
1092
|
className: "flex items-center gap-1.5 text-[13px] font-medium text-text-primary",
|
|
1019
1093
|
children: [
|
|
1020
|
-
/* @__PURE__ */
|
|
1094
|
+
/* @__PURE__ */ jsx7(
|
|
1021
1095
|
"span",
|
|
1022
1096
|
{
|
|
1023
1097
|
className: cx2(
|
|
1024
1098
|
"flex h-4 w-4 shrink-0 items-center justify-center rounded-full border-2 transition-colors",
|
|
1025
1099
|
checked ? "border-brand-primaryAction" : "border-border-interactive"
|
|
1026
1100
|
),
|
|
1027
|
-
children: checked && /* @__PURE__ */
|
|
1101
|
+
children: checked && /* @__PURE__ */ jsx7("span", { className: "h-2 w-2 rounded-full bg-brand-primaryAction" })
|
|
1028
1102
|
}
|
|
1029
1103
|
),
|
|
1030
1104
|
label
|
|
@@ -1044,7 +1118,7 @@ function RowInfoTip({ text }) {
|
|
|
1044
1118
|
return () => window.removeEventListener("mousedown", onDown);
|
|
1045
1119
|
}, [open]);
|
|
1046
1120
|
return /* @__PURE__ */ jsxs5("span", { className: "relative inline-flex shrink-0 items-center", ref, children: [
|
|
1047
|
-
/* @__PURE__ */
|
|
1121
|
+
/* @__PURE__ */ jsx7(
|
|
1048
1122
|
"button",
|
|
1049
1123
|
{
|
|
1050
1124
|
type: "button",
|
|
@@ -1055,10 +1129,10 @@ function RowInfoTip({ text }) {
|
|
|
1055
1129
|
"aria-label": "More information",
|
|
1056
1130
|
"aria-expanded": open,
|
|
1057
1131
|
className: "inline-flex text-text-tertiary transition-colors hover:text-text-primary",
|
|
1058
|
-
children: /* @__PURE__ */
|
|
1132
|
+
children: /* @__PURE__ */ jsx7(AlertCircle, { size: 13, "aria-hidden": "true" })
|
|
1059
1133
|
}
|
|
1060
1134
|
),
|
|
1061
|
-
open && /* @__PURE__ */
|
|
1135
|
+
open && /* @__PURE__ */ jsx7(
|
|
1062
1136
|
"span",
|
|
1063
1137
|
{
|
|
1064
1138
|
role: "tooltip",
|
|
@@ -1072,7 +1146,7 @@ function RowInfoTip({ text }) {
|
|
|
1072
1146
|
// src/SectionRail.tsx
|
|
1073
1147
|
import { useRef as useRef5 } from "react";
|
|
1074
1148
|
import { ChevronLeft as ChevronLeft2, ChevronRight as ChevronRight2 } from "lucide-react";
|
|
1075
|
-
import { jsx as
|
|
1149
|
+
import { jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
|
|
1076
1150
|
function SectionRail({
|
|
1077
1151
|
title,
|
|
1078
1152
|
titleSerif,
|
|
@@ -1088,14 +1162,14 @@ function SectionRail({
|
|
|
1088
1162
|
return /* @__PURE__ */ jsxs6("section", { className: "flex flex-col gap-4", children: [
|
|
1089
1163
|
/* @__PURE__ */ jsxs6("header", { className: "flex flex-col gap-3 sm:flex-row sm:items-end sm:justify-between", children: [
|
|
1090
1164
|
/* @__PURE__ */ jsxs6("div", { children: [
|
|
1091
|
-
/* @__PURE__ */
|
|
1165
|
+
/* @__PURE__ */ jsx8(
|
|
1092
1166
|
"h2",
|
|
1093
1167
|
{
|
|
1094
1168
|
className: titleSerif ? "font-serif text-2xl font-normal tracking-tight text-text-primary sm:text-[28px]" : "text-xl font-medium tracking-tight text-text-primary sm:text-2xl",
|
|
1095
1169
|
children: title
|
|
1096
1170
|
}
|
|
1097
1171
|
),
|
|
1098
|
-
/* @__PURE__ */
|
|
1172
|
+
/* @__PURE__ */ jsx8("p", { className: "mt-1 text-sm text-text-secondary", children: subtitle })
|
|
1099
1173
|
] }),
|
|
1100
1174
|
/* @__PURE__ */ jsxs6("div", { className: "flex items-center gap-2", children: [
|
|
1101
1175
|
viewAllLabel && viewAllHref && /* @__PURE__ */ jsxs6(
|
|
@@ -1109,29 +1183,29 @@ function SectionRail({
|
|
|
1109
1183
|
]
|
|
1110
1184
|
}
|
|
1111
1185
|
),
|
|
1112
|
-
/* @__PURE__ */
|
|
1186
|
+
/* @__PURE__ */ jsx8(
|
|
1113
1187
|
"button",
|
|
1114
1188
|
{
|
|
1115
1189
|
type: "button",
|
|
1116
1190
|
onClick: () => scroll(-1),
|
|
1117
1191
|
"aria-label": "Previous",
|
|
1118
1192
|
className: "hidden h-10 w-10 items-center justify-center rounded-control border border-border-default text-text-secondary transition-colors hover:bg-subtle hover:text-text-primary sm:flex lg:hidden",
|
|
1119
|
-
children: /* @__PURE__ */
|
|
1193
|
+
children: /* @__PURE__ */ jsx8(ChevronLeft2, { size: 16 })
|
|
1120
1194
|
}
|
|
1121
1195
|
),
|
|
1122
|
-
/* @__PURE__ */
|
|
1196
|
+
/* @__PURE__ */ jsx8(
|
|
1123
1197
|
"button",
|
|
1124
1198
|
{
|
|
1125
1199
|
type: "button",
|
|
1126
1200
|
onClick: () => scroll(1),
|
|
1127
1201
|
"aria-label": "Next",
|
|
1128
1202
|
className: "hidden h-10 w-10 items-center justify-center rounded-control border border-border-default text-text-secondary transition-colors hover:bg-subtle hover:text-text-primary sm:flex lg:hidden",
|
|
1129
|
-
children: /* @__PURE__ */
|
|
1203
|
+
children: /* @__PURE__ */ jsx8(ChevronRight2, { size: 16 })
|
|
1130
1204
|
}
|
|
1131
1205
|
)
|
|
1132
1206
|
] })
|
|
1133
1207
|
] }),
|
|
1134
|
-
/* @__PURE__ */
|
|
1208
|
+
/* @__PURE__ */ jsx8(
|
|
1135
1209
|
"div",
|
|
1136
1210
|
{
|
|
1137
1211
|
ref: scrollRef,
|
|
@@ -1145,7 +1219,7 @@ function SectionRail({
|
|
|
1145
1219
|
// src/DataScopeFilter.tsx
|
|
1146
1220
|
import { useEffect as useEffect5, useRef as useRef6, useState as useState5 } from "react";
|
|
1147
1221
|
import { Check as Check4, ChevronDown as ChevronDown4 } from "lucide-react";
|
|
1148
|
-
import { jsx as
|
|
1222
|
+
import { jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
1149
1223
|
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.";
|
|
1150
1224
|
function cx3(...classes) {
|
|
1151
1225
|
return classes.filter(Boolean).join(" ");
|
|
@@ -1182,10 +1256,10 @@ function DataScopeFilter({ value, onChange, align = "right" }) {
|
|
|
1182
1256
|
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",
|
|
1183
1257
|
children: [
|
|
1184
1258
|
/* @__PURE__ */ jsxs7("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
|
|
1185
|
-
/* @__PURE__ */
|
|
1186
|
-
/* @__PURE__ */
|
|
1259
|
+
/* @__PURE__ */ jsx9("span", { className: "text-[10px] uppercase tracking-wide text-text-tertiary", children: "Data" }),
|
|
1260
|
+
/* @__PURE__ */ jsx9("span", { className: "text-[12px] font-medium text-text-primary", children: display })
|
|
1187
1261
|
] }),
|
|
1188
|
-
/* @__PURE__ */
|
|
1262
|
+
/* @__PURE__ */ jsx9(
|
|
1189
1263
|
ChevronDown4,
|
|
1190
1264
|
{
|
|
1191
1265
|
size: 14,
|
|
@@ -1206,8 +1280,8 @@ function DataScopeFilter({ value, onChange, align = "right" }) {
|
|
|
1206
1280
|
align === "right" ? "right-0" : "left-0"
|
|
1207
1281
|
),
|
|
1208
1282
|
children: [
|
|
1209
|
-
/* @__PURE__ */
|
|
1210
|
-
/* @__PURE__ */
|
|
1283
|
+
/* @__PURE__ */ jsx9(Option, { label: "All", selected: !value, onClick: () => choose(false) }),
|
|
1284
|
+
/* @__PURE__ */ jsx9(Option, { label: "Final only", selected: value, onClick: () => choose(true), hint: FINAL_ONLY_TEXT })
|
|
1211
1285
|
]
|
|
1212
1286
|
}
|
|
1213
1287
|
)
|
|
@@ -1232,7 +1306,7 @@ function Option({
|
|
|
1232
1306
|
selected ? "font-semibold text-text-primary" : "text-text-secondary"
|
|
1233
1307
|
),
|
|
1234
1308
|
children: [
|
|
1235
|
-
/* @__PURE__ */
|
|
1309
|
+
/* @__PURE__ */ jsx9(Check4, { size: 14, "aria-hidden": "true", className: cx3("shrink-0 text-brand-primaryAction", !selected && "invisible") }),
|
|
1236
1310
|
label
|
|
1237
1311
|
]
|
|
1238
1312
|
}
|
|
@@ -1240,7 +1314,7 @@ function Option({
|
|
|
1240
1314
|
if (!hint) return option;
|
|
1241
1315
|
return /* @__PURE__ */ jsxs7("div", { className: "flex items-center pr-2.5", children: [
|
|
1242
1316
|
option,
|
|
1243
|
-
/* @__PURE__ */
|
|
1317
|
+
/* @__PURE__ */ jsx9(InfoTip, { text: hint, trigger: "hover", label: `About ${label}` })
|
|
1244
1318
|
] });
|
|
1245
1319
|
}
|
|
1246
1320
|
|
|
@@ -1248,7 +1322,7 @@ function Option({
|
|
|
1248
1322
|
import { useCallback as useCallback2, useEffect as useEffect6, useLayoutEffect, useRef as useRef7, useState as useState6 } from "react";
|
|
1249
1323
|
import { createPortal as createPortal2 } from "react-dom";
|
|
1250
1324
|
import { Check as Check5, ChevronDown as ChevronDown5 } from "lucide-react";
|
|
1251
|
-
import { jsx as
|
|
1325
|
+
import { jsx as jsx10, jsxs as jsxs8 } from "react/jsx-runtime";
|
|
1252
1326
|
function cx4(...classes) {
|
|
1253
1327
|
return classes.filter(Boolean).join(" ");
|
|
1254
1328
|
}
|
|
@@ -1314,10 +1388,10 @@ function SelectFilter({
|
|
|
1314
1388
|
),
|
|
1315
1389
|
children: [
|
|
1316
1390
|
/* @__PURE__ */ jsxs8("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
|
|
1317
|
-
/* @__PURE__ */
|
|
1318
|
-
/* @__PURE__ */
|
|
1391
|
+
/* @__PURE__ */ jsx10("span", { className: "text-[10px] uppercase tracking-wide text-text-tertiary", children: caption }),
|
|
1392
|
+
/* @__PURE__ */ jsx10("span", { className: "text-[12px] font-medium text-text-primary", children: value })
|
|
1319
1393
|
] }),
|
|
1320
|
-
/* @__PURE__ */
|
|
1394
|
+
/* @__PURE__ */ jsx10(
|
|
1321
1395
|
ChevronDown5,
|
|
1322
1396
|
{
|
|
1323
1397
|
size: 14,
|
|
@@ -1329,7 +1403,7 @@ function SelectFilter({
|
|
|
1329
1403
|
}
|
|
1330
1404
|
),
|
|
1331
1405
|
open && pos && createPortal2(
|
|
1332
|
-
/* @__PURE__ */
|
|
1406
|
+
/* @__PURE__ */ jsx10(
|
|
1333
1407
|
"div",
|
|
1334
1408
|
{
|
|
1335
1409
|
ref: popoverRef,
|
|
@@ -1341,7 +1415,7 @@ function SelectFilter({
|
|
|
1341
1415
|
),
|
|
1342
1416
|
role: "listbox",
|
|
1343
1417
|
"aria-label": caption,
|
|
1344
|
-
children: /* @__PURE__ */
|
|
1418
|
+
children: /* @__PURE__ */ jsx10("div", { className: "max-h-[280px] overflow-y-auto p-1", children: options.map((o) => {
|
|
1345
1419
|
const selected = o === value;
|
|
1346
1420
|
return /* @__PURE__ */ jsxs8(
|
|
1347
1421
|
"button",
|
|
@@ -1356,8 +1430,8 @@ function SelectFilter({
|
|
|
1356
1430
|
},
|
|
1357
1431
|
className: "flex w-full items-center gap-2.5 rounded-control px-2 py-2 text-left transition-colors hover:bg-subtle",
|
|
1358
1432
|
children: [
|
|
1359
|
-
/* @__PURE__ */
|
|
1360
|
-
/* @__PURE__ */
|
|
1433
|
+
/* @__PURE__ */ jsx10("span", { className: "flex h-4 w-4 shrink-0 items-center justify-center text-brand-primaryAction", children: selected && /* @__PURE__ */ jsx10(Check5, { size: 15, strokeWidth: 3 }) }),
|
|
1434
|
+
/* @__PURE__ */ jsx10(
|
|
1361
1435
|
"span",
|
|
1362
1436
|
{
|
|
1363
1437
|
className: cx4("flex-1 text-[14px]", selected ? "font-semibold text-text-primary" : "text-text-primary"),
|
|
@@ -1378,9 +1452,9 @@ function SelectFilter({
|
|
|
1378
1452
|
|
|
1379
1453
|
// src/Card.tsx
|
|
1380
1454
|
import { forwardRef } from "react";
|
|
1381
|
-
import { jsx as
|
|
1455
|
+
import { jsx as jsx11, jsxs as jsxs9 } from "react/jsx-runtime";
|
|
1382
1456
|
var Card = forwardRef(function Card2({ staticCard, title, subtitle, action, className, children, ...rest }, ref) {
|
|
1383
|
-
return /* @__PURE__ */
|
|
1457
|
+
return /* @__PURE__ */ jsx11(
|
|
1384
1458
|
"article",
|
|
1385
1459
|
{
|
|
1386
1460
|
ref,
|
|
@@ -1394,12 +1468,12 @@ var Card = forwardRef(function Card2({ staticCard, title, subtitle, action, clas
|
|
|
1394
1468
|
children: title ? /* @__PURE__ */ jsxs9("div", { className: "flex flex-1 flex-col p-card-padding", children: [
|
|
1395
1469
|
/* @__PURE__ */ jsxs9("div", { className: "flex items-start justify-between gap-2", children: [
|
|
1396
1470
|
/* @__PURE__ */ jsxs9("div", { children: [
|
|
1397
|
-
/* @__PURE__ */
|
|
1398
|
-
subtitle && /* @__PURE__ */
|
|
1471
|
+
/* @__PURE__ */ jsx11("h3", { className: "text-[15px] font-semibold leading-snug text-text-primary", children: title }),
|
|
1472
|
+
subtitle && /* @__PURE__ */ jsx11("p", { className: "mt-0.5 text-[12px] leading-snug text-text-tertiary", children: subtitle })
|
|
1399
1473
|
] }),
|
|
1400
|
-
action && /* @__PURE__ */
|
|
1474
|
+
action && /* @__PURE__ */ jsx11("div", { className: "shrink-0 text-text-tertiary", children: action })
|
|
1401
1475
|
] }),
|
|
1402
|
-
/* @__PURE__ */
|
|
1476
|
+
/* @__PURE__ */ jsx11("div", { className: "mt-4 flex flex-1 flex-col", children })
|
|
1403
1477
|
] }) : children
|
|
1404
1478
|
}
|
|
1405
1479
|
);
|
|
@@ -1407,7 +1481,7 @@ var Card = forwardRef(function Card2({ staticCard, title, subtitle, action, clas
|
|
|
1407
1481
|
|
|
1408
1482
|
// src/NoResultsEmptyState.tsx
|
|
1409
1483
|
import { FilterX } from "lucide-react";
|
|
1410
|
-
import { jsx as
|
|
1484
|
+
import { jsx as jsx12, jsxs as jsxs10 } from "react/jsx-runtime";
|
|
1411
1485
|
var NO_RESULTS_TITLE = "No results match your filters";
|
|
1412
1486
|
var NO_RESULTS_BODY = "Your filters may be too narrow, conflict with each other, or have no activity in this period.";
|
|
1413
1487
|
function noResultsBody(workspaceName) {
|
|
@@ -1430,11 +1504,11 @@ function NoResultsEmptyState({
|
|
|
1430
1504
|
const showEdit = Boolean(onEditFilters);
|
|
1431
1505
|
const hasActions = showClear || showEdit || Boolean(actions && actions.length > 0);
|
|
1432
1506
|
return /* @__PURE__ */ jsxs10("div", { className: "flex flex-col items-center justify-center gap-3 text-center", "data-testid": testIdPrefix, children: [
|
|
1433
|
-
/* @__PURE__ */
|
|
1434
|
-
/* @__PURE__ */
|
|
1435
|
-
/* @__PURE__ */
|
|
1507
|
+
/* @__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
|
+
/* @__PURE__ */ jsx12("h2", { className: "text-base font-semibold text-text-primary", children: title }),
|
|
1509
|
+
/* @__PURE__ */ jsx12("p", { className: "max-w-[420px] text-[13px] leading-relaxed text-text-secondary", children: bodyText }),
|
|
1436
1510
|
hasActions && /* @__PURE__ */ jsxs10("div", { className: "mt-1 flex flex-col items-center gap-3", children: [
|
|
1437
|
-
showClear && /* @__PURE__ */
|
|
1511
|
+
showClear && /* @__PURE__ */ jsx12(
|
|
1438
1512
|
"button",
|
|
1439
1513
|
{
|
|
1440
1514
|
type: "button",
|
|
@@ -1444,7 +1518,7 @@ function NoResultsEmptyState({
|
|
|
1444
1518
|
children: "Clear all filters"
|
|
1445
1519
|
}
|
|
1446
1520
|
),
|
|
1447
|
-
showEdit && /* @__PURE__ */
|
|
1521
|
+
showEdit && /* @__PURE__ */ jsx12(
|
|
1448
1522
|
"button",
|
|
1449
1523
|
{
|
|
1450
1524
|
type: "button",
|
|
@@ -1454,7 +1528,7 @@ function NoResultsEmptyState({
|
|
|
1454
1528
|
children: "Edit filters"
|
|
1455
1529
|
}
|
|
1456
1530
|
),
|
|
1457
|
-
actions?.map((action, i) => /* @__PURE__ */
|
|
1531
|
+
actions?.map((action, i) => /* @__PURE__ */ jsx12(
|
|
1458
1532
|
"button",
|
|
1459
1533
|
{
|
|
1460
1534
|
type: "button",
|
|
@@ -1471,12 +1545,12 @@ function NoResultsEmptyState({
|
|
|
1471
1545
|
// src/WorkspaceSelectedCard.tsx
|
|
1472
1546
|
import { useEffect as useEffect7, useRef as useRef8, useState as useState7 } from "react";
|
|
1473
1547
|
import { ChevronDown as ChevronDown6, X as X2 } from "lucide-react";
|
|
1474
|
-
import { jsx as
|
|
1548
|
+
import { jsx as jsx13, jsxs as jsxs11 } from "react/jsx-runtime";
|
|
1475
1549
|
function cx5(...parts) {
|
|
1476
1550
|
return parts.filter(Boolean).join(" ");
|
|
1477
1551
|
}
|
|
1478
1552
|
function WorkspaceSelectedCard({ groups, testIdPrefix }) {
|
|
1479
|
-
return /* @__PURE__ */
|
|
1553
|
+
return /* @__PURE__ */ jsx13("aside", { className: "sticky top-4 flex min-w-0 flex-col gap-4 self-start rounded-card border border-border-default bg-surface px-5 pb-5 pt-4 shadow-raised sm:px-6 sm:pb-6", children: /* @__PURE__ */ jsx13("div", { className: "flex flex-col divide-y divide-border-default", children: groups.map((g) => /* @__PURE__ */ jsx13(SummaryGroupItem, { group: g, testIdPrefix }, g.id)) }) });
|
|
1480
1554
|
}
|
|
1481
1555
|
function SummaryGroupItem({
|
|
1482
1556
|
group,
|
|
@@ -1503,7 +1577,7 @@ function SummaryGroupItem({
|
|
|
1503
1577
|
"data-testid": testIdPrefix && `${testIdPrefix}-group-${group.id}`,
|
|
1504
1578
|
className: "flex w-full min-w-0 items-center gap-2 text-left",
|
|
1505
1579
|
children: [
|
|
1506
|
-
/* @__PURE__ */
|
|
1580
|
+
/* @__PURE__ */ jsx13(
|
|
1507
1581
|
ChevronDown6,
|
|
1508
1582
|
{
|
|
1509
1583
|
size: 14,
|
|
@@ -1511,12 +1585,12 @@ function SummaryGroupItem({
|
|
|
1511
1585
|
className: cx5("shrink-0 text-text-secondary transition-transform", !open && "-rotate-90")
|
|
1512
1586
|
}
|
|
1513
1587
|
),
|
|
1514
|
-
/* @__PURE__ */
|
|
1515
|
-
/* @__PURE__ */
|
|
1588
|
+
/* @__PURE__ */ jsx13("span", { className: cx5("truncate font-semibold text-text-primary", nested ? "text-[12px]" : "text-[13px]"), children: group.label }),
|
|
1589
|
+
/* @__PURE__ */ jsx13("span", { className: "shrink-0 rounded-full bg-subtle px-1.5 py-0.5 text-[11px] font-semibold text-text-secondary", children: ownCount })
|
|
1516
1590
|
]
|
|
1517
1591
|
}
|
|
1518
1592
|
),
|
|
1519
|
-
open && /* @__PURE__ */
|
|
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__ */ jsxs11("div", { className: "flex flex-col gap-2.5", children: [
|
|
1520
1594
|
ownCount > 0 && /* @__PURE__ */ jsxs11("div", { className: "flex flex-col gap-1.5", children: [
|
|
1521
1595
|
group.items.map((item) => /* @__PURE__ */ jsxs11(
|
|
1522
1596
|
"div",
|
|
@@ -1524,24 +1598,24 @@ function SummaryGroupItem({
|
|
|
1524
1598
|
className: "flex items-center justify-between gap-2 rounded-control border border-border-default bg-canvas px-2 py-1",
|
|
1525
1599
|
children: [
|
|
1526
1600
|
/* @__PURE__ */ jsxs11("span", { className: "min-w-0 flex-1", children: [
|
|
1527
|
-
/* @__PURE__ */
|
|
1528
|
-
item.meta && /* @__PURE__ */
|
|
1601
|
+
/* @__PURE__ */ jsx13("span", { className: "block truncate text-[12px] text-text-primary", children: item.name }),
|
|
1602
|
+
item.meta && /* @__PURE__ */ jsx13("span", { className: "block truncate text-[11px] text-text-secondary", children: item.meta })
|
|
1529
1603
|
] }),
|
|
1530
|
-
/* @__PURE__ */
|
|
1604
|
+
/* @__PURE__ */ jsx13(
|
|
1531
1605
|
"button",
|
|
1532
1606
|
{
|
|
1533
1607
|
type: "button",
|
|
1534
1608
|
"aria-label": `Remove ${item.name}`,
|
|
1535
1609
|
onClick: () => group.onRemove(item.id),
|
|
1536
1610
|
className: "flex h-5 w-5 shrink-0 items-center justify-center rounded-control text-text-secondary hover:bg-subtle hover:text-text-danger",
|
|
1537
|
-
children: /* @__PURE__ */
|
|
1611
|
+
children: /* @__PURE__ */ jsx13(X2, { size: 12, "aria-hidden": "true" })
|
|
1538
1612
|
}
|
|
1539
1613
|
)
|
|
1540
1614
|
]
|
|
1541
1615
|
},
|
|
1542
1616
|
item.id
|
|
1543
1617
|
)),
|
|
1544
|
-
/* @__PURE__ */
|
|
1618
|
+
/* @__PURE__ */ jsx13(
|
|
1545
1619
|
"button",
|
|
1546
1620
|
{
|
|
1547
1621
|
type: "button",
|
|
@@ -1552,13 +1626,13 @@ function SummaryGroupItem({
|
|
|
1552
1626
|
}
|
|
1553
1627
|
)
|
|
1554
1628
|
] }),
|
|
1555
|
-
group.subGroups?.map((sg) => /* @__PURE__ */
|
|
1629
|
+
group.subGroups?.map((sg) => /* @__PURE__ */ jsx13(SummaryGroupItem, { group: sg, nested: true, testIdPrefix }, sg.id))
|
|
1556
1630
|
] }) })
|
|
1557
1631
|
] });
|
|
1558
1632
|
}
|
|
1559
1633
|
|
|
1560
1634
|
// src/chart-placeholder-shared.tsx
|
|
1561
|
-
import { jsx as
|
|
1635
|
+
import { jsx as jsx14, jsxs as jsxs12 } from "react/jsx-runtime";
|
|
1562
1636
|
var GRID_ROWS = [0, 25, 50, 75, 100];
|
|
1563
1637
|
var Y_TICK_WIDTHS = [26, 30, 30, 26, 20];
|
|
1564
1638
|
var Y_AXIS_W = 48;
|
|
@@ -1570,9 +1644,9 @@ function AxisFrame({
|
|
|
1570
1644
|
children
|
|
1571
1645
|
}) {
|
|
1572
1646
|
const gutter = xTicks > 0 ? X_AXIS_H : 0;
|
|
1573
|
-
return /* @__PURE__ */
|
|
1647
|
+
return /* @__PURE__ */ jsx14("div", { className: "w-full", style: { height }, role: "presentation", "aria-hidden": "true", children: /* @__PURE__ */ jsxs12("div", { className: "relative h-full w-full", children: [
|
|
1574
1648
|
/* @__PURE__ */ jsxs12("div", { className: "absolute inset-y-0 right-0", style: { left: Y_AXIS_W, bottom: gutter }, children: [
|
|
1575
|
-
GRID_ROWS.map((pct) => /* @__PURE__ */
|
|
1649
|
+
GRID_ROWS.map((pct) => /* @__PURE__ */ jsx14(
|
|
1576
1650
|
"div",
|
|
1577
1651
|
{
|
|
1578
1652
|
className: "absolute inset-x-0 border-t border-dashed",
|
|
@@ -1580,9 +1654,9 @@ function AxisFrame({
|
|
|
1580
1654
|
},
|
|
1581
1655
|
pct
|
|
1582
1656
|
)),
|
|
1583
|
-
/* @__PURE__ */
|
|
1657
|
+
/* @__PURE__ */ jsx14("div", { className: "absolute inset-0", children })
|
|
1584
1658
|
] }),
|
|
1585
|
-
/* @__PURE__ */
|
|
1659
|
+
/* @__PURE__ */ jsx14("div", { className: "absolute left-0 top-0", style: { width: Y_AXIS_W, bottom: gutter }, children: GRID_ROWS.map((pct, i) => /* @__PURE__ */ jsx14(
|
|
1586
1660
|
"div",
|
|
1587
1661
|
{
|
|
1588
1662
|
className: "absolute right-2 h-2 -translate-y-1/2 rounded-xs bg-subtle",
|
|
@@ -1590,18 +1664,18 @@ function AxisFrame({
|
|
|
1590
1664
|
},
|
|
1591
1665
|
pct
|
|
1592
1666
|
)) }),
|
|
1593
|
-
xTicks > 0 && /* @__PURE__ */
|
|
1667
|
+
xTicks > 0 && /* @__PURE__ */ jsx14(
|
|
1594
1668
|
"div",
|
|
1595
1669
|
{
|
|
1596
1670
|
className: "absolute bottom-0 right-0 flex items-center",
|
|
1597
1671
|
style: { left: Y_AXIS_W, height: X_AXIS_H },
|
|
1598
|
-
children: Array.from({ length: xTicks }, (_, i) => /* @__PURE__ */
|
|
1672
|
+
children: Array.from({ length: xTicks }, (_, i) => /* @__PURE__ */ jsx14("div", { className: "flex flex-1 justify-center", children: /* @__PURE__ */ jsx14("div", { className: "h-2 w-full max-w-[26px] rounded-xs bg-subtle" }) }, i))
|
|
1599
1673
|
}
|
|
1600
1674
|
)
|
|
1601
1675
|
] }) });
|
|
1602
1676
|
}
|
|
1603
1677
|
function BlankLegend({ rows, reverse = false }) {
|
|
1604
|
-
return /* @__PURE__ */
|
|
1678
|
+
return /* @__PURE__ */ jsx14(
|
|
1605
1679
|
"ul",
|
|
1606
1680
|
{
|
|
1607
1681
|
className: `flex flex-1 justify-center gap-1.5 ${reverse ? "flex-col-reverse" : "flex-col"}`,
|
|
@@ -1609,8 +1683,8 @@ function BlankLegend({ rows, reverse = false }) {
|
|
|
1609
1683
|
"aria-hidden": "true",
|
|
1610
1684
|
children: Array.from({ length: rows }, (_, i) => /* @__PURE__ */ jsxs12("li", { className: "flex items-center justify-between gap-2", children: [
|
|
1611
1685
|
/* @__PURE__ */ jsxs12("span", { className: "flex items-center gap-1.5", children: [
|
|
1612
|
-
/* @__PURE__ */
|
|
1613
|
-
/* @__PURE__ */
|
|
1686
|
+
/* @__PURE__ */ jsx14("span", { className: "h-2.5 w-2.5 rounded-xs bg-subtle" }),
|
|
1687
|
+
/* @__PURE__ */ jsx14(
|
|
1614
1688
|
"span",
|
|
1615
1689
|
{
|
|
1616
1690
|
className: "h-2 rounded-xs bg-subtle",
|
|
@@ -1618,21 +1692,21 @@ function BlankLegend({ rows, reverse = false }) {
|
|
|
1618
1692
|
}
|
|
1619
1693
|
)
|
|
1620
1694
|
] }),
|
|
1621
|
-
/* @__PURE__ */
|
|
1695
|
+
/* @__PURE__ */ jsx14("span", { className: "h-2 w-6 rounded-xs bg-subtle" })
|
|
1622
1696
|
] }, i))
|
|
1623
1697
|
}
|
|
1624
1698
|
);
|
|
1625
1699
|
}
|
|
1626
1700
|
|
|
1627
1701
|
// src/BarChartPlaceholder.tsx
|
|
1628
|
-
import { jsx as
|
|
1702
|
+
import { jsx as jsx15 } from "react/jsx-runtime";
|
|
1629
1703
|
var BAR_PROFILE = [92, 86, 76, 65, 57, 40, 30, 24, 18, 13];
|
|
1630
1704
|
function BarChartPlaceholder({ height = 220 }) {
|
|
1631
|
-
return /* @__PURE__ */
|
|
1705
|
+
return /* @__PURE__ */ jsx15(AxisFrame, { height, xTicks: BAR_PROFILE.length, children: /* @__PURE__ */ jsx15("div", { className: "flex h-full w-full items-end gap-2", children: BAR_PROFILE.map((pct, i) => /* @__PURE__ */ jsx15("div", { className: "flex-1 rounded-t-[3px] bg-subtle", style: { height: `${pct}%` } }, i)) }) });
|
|
1632
1706
|
}
|
|
1633
1707
|
|
|
1634
1708
|
// src/LineChartPlaceholder.tsx
|
|
1635
|
-
import { jsx as
|
|
1709
|
+
import { jsx as jsx16, jsxs as jsxs13 } from "react/jsx-runtime";
|
|
1636
1710
|
var LINE_SERIES = [
|
|
1637
1711
|
[58, 52, 55, 41, 45, 33, 36, 25, 28, 17],
|
|
1638
1712
|
[74, 71, 66, 68, 59, 61, 54, 56, 48, 45],
|
|
@@ -1643,8 +1717,8 @@ var LINE_FORECAST_FROM = 7;
|
|
|
1643
1717
|
function LineChartPlaceholder({ height = 280 }) {
|
|
1644
1718
|
const toPath = (pts, from, to) => pts.slice(from, to).map((y, i) => `${(i + from) / (pts.length - 1) * 100},${y}`).join(" ");
|
|
1645
1719
|
return /* @__PURE__ */ jsxs13(AxisFrame, { height, xTicks: LINE_SERIES[0].length, children: [
|
|
1646
|
-
/* @__PURE__ */
|
|
1647
|
-
/* @__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__ */ jsxs13("g", { children: [
|
|
1721
|
+
/* @__PURE__ */ jsx16(
|
|
1648
1722
|
"polyline",
|
|
1649
1723
|
{
|
|
1650
1724
|
points: toPath(pts, 0, LINE_FORECAST_FROM + 1),
|
|
@@ -1656,7 +1730,7 @@ function LineChartPlaceholder({ height = 280 }) {
|
|
|
1656
1730
|
strokeLinejoin: "round"
|
|
1657
1731
|
}
|
|
1658
1732
|
),
|
|
1659
|
-
/* @__PURE__ */
|
|
1733
|
+
/* @__PURE__ */ jsx16(
|
|
1660
1734
|
"polyline",
|
|
1661
1735
|
{
|
|
1662
1736
|
points: toPath(pts, LINE_FORECAST_FROM, pts.length),
|
|
@@ -1671,7 +1745,7 @@ function LineChartPlaceholder({ height = 280 }) {
|
|
|
1671
1745
|
)
|
|
1672
1746
|
] }, s)) }),
|
|
1673
1747
|
LINE_SERIES.map(
|
|
1674
|
-
(pts, s) => pts.map((y, i) => /* @__PURE__ */
|
|
1748
|
+
(pts, s) => pts.map((y, i) => /* @__PURE__ */ jsx16(
|
|
1675
1749
|
"div",
|
|
1676
1750
|
{
|
|
1677
1751
|
className: "absolute h-1.5 w-1.5 -translate-x-1/2 -translate-y-1/2 rounded-full",
|
|
@@ -1688,16 +1762,16 @@ function LineChartPlaceholder({ height = 280 }) {
|
|
|
1688
1762
|
}
|
|
1689
1763
|
|
|
1690
1764
|
// src/PieChartPlaceholder.tsx
|
|
1691
|
-
import { jsx as
|
|
1765
|
+
import { jsx as jsx17, jsxs as jsxs14 } from "react/jsx-runtime";
|
|
1692
1766
|
var PIE_SEAMS = [0, 115, 180, 230, 262, 288, 310, 332];
|
|
1693
1767
|
function PieChartPlaceholder({ height = 220, legendRows = 8 }) {
|
|
1694
1768
|
const r = 45;
|
|
1695
1769
|
return /* @__PURE__ */ jsxs14("div", { className: "flex w-full items-center gap-3", style: { height }, role: "presentation", "aria-hidden": "true", children: [
|
|
1696
|
-
/* @__PURE__ */
|
|
1697
|
-
/* @__PURE__ */
|
|
1770
|
+
/* @__PURE__ */ jsx17("div", { className: "flex h-full items-center justify-center", style: { width: "60%" }, children: /* @__PURE__ */ jsxs14("svg", { viewBox: "0 0 100 100", className: "h-full", style: { aspectRatio: "1 / 1" }, children: [
|
|
1771
|
+
/* @__PURE__ */ jsx17("circle", { cx: "50", cy: "50", r, fill: "var(--mr-color-subtle)" }),
|
|
1698
1772
|
PIE_SEAMS.map((deg) => {
|
|
1699
1773
|
const rad = (deg - 90) * Math.PI / 180;
|
|
1700
|
-
return /* @__PURE__ */
|
|
1774
|
+
return /* @__PURE__ */ jsx17(
|
|
1701
1775
|
"line",
|
|
1702
1776
|
{
|
|
1703
1777
|
x1: "50",
|
|
@@ -1711,12 +1785,12 @@ function PieChartPlaceholder({ height = 220, legendRows = 8 }) {
|
|
|
1711
1785
|
);
|
|
1712
1786
|
})
|
|
1713
1787
|
] }) }),
|
|
1714
|
-
/* @__PURE__ */
|
|
1788
|
+
/* @__PURE__ */ jsx17(BlankLegend, { rows: legendRows })
|
|
1715
1789
|
] });
|
|
1716
1790
|
}
|
|
1717
1791
|
|
|
1718
1792
|
// src/StackedColumnPlaceholder.tsx
|
|
1719
|
-
import { jsx as
|
|
1793
|
+
import { jsx as jsx18, jsxs as jsxs15 } from "react/jsx-runtime";
|
|
1720
1794
|
var COLUMN_WEIGHTS = [20, 30, 15, 35, 24, 12, 28, 18];
|
|
1721
1795
|
function columnBands(count) {
|
|
1722
1796
|
const weights = Array.from({ length: count }, (_, i) => COLUMN_WEIGHTS[i % COLUMN_WEIGHTS.length]);
|
|
@@ -1729,7 +1803,7 @@ function StackedColumnPlaceholder({
|
|
|
1729
1803
|
legendRows = 4,
|
|
1730
1804
|
axis = false
|
|
1731
1805
|
}) {
|
|
1732
|
-
const column = /* @__PURE__ */
|
|
1806
|
+
const column = /* @__PURE__ */ jsx18("div", { className: "flex h-full flex-col overflow-hidden rounded-control bg-subtle", style: { width }, children: columnBands(legendRows).map((pct, i) => /* @__PURE__ */ jsx18(
|
|
1733
1807
|
"div",
|
|
1734
1808
|
{
|
|
1735
1809
|
style: {
|
|
@@ -1742,15 +1816,15 @@ function StackedColumnPlaceholder({
|
|
|
1742
1816
|
i
|
|
1743
1817
|
)) });
|
|
1744
1818
|
return /* @__PURE__ */ jsxs15("div", { className: "flex w-full gap-4", style: { height }, role: "presentation", "aria-hidden": "true", children: [
|
|
1745
|
-
axis ? /* @__PURE__ */
|
|
1746
|
-
/* @__PURE__ */
|
|
1819
|
+
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
|
+
/* @__PURE__ */ jsx18(BlankLegend, { rows: legendRows, reverse: !axis })
|
|
1747
1821
|
] });
|
|
1748
1822
|
}
|
|
1749
1823
|
|
|
1750
1824
|
// src/Tooltip.tsx
|
|
1751
1825
|
import { useEffect as useEffect8, useId, useLayoutEffect as useLayoutEffect2, useRef as useRef9, useState as useState8 } from "react";
|
|
1752
1826
|
import { createPortal as createPortal3 } from "react-dom";
|
|
1753
|
-
import { jsx as
|
|
1827
|
+
import { jsx as jsx19, jsxs as jsxs16 } from "react/jsx-runtime";
|
|
1754
1828
|
function cx6(...parts) {
|
|
1755
1829
|
return parts.filter(Boolean).join(" ");
|
|
1756
1830
|
}
|
|
@@ -1865,7 +1939,7 @@ function Tooltip({
|
|
|
1865
1939
|
}
|
|
1866
1940
|
}
|
|
1867
1941
|
const floating = anchor != null && typeof document !== "undefined" ? createPortal3(
|
|
1868
|
-
/* @__PURE__ */
|
|
1942
|
+
/* @__PURE__ */ jsx19(
|
|
1869
1943
|
"span",
|
|
1870
1944
|
{
|
|
1871
1945
|
ref: boxRef,
|
|
@@ -1906,7 +1980,7 @@ function Tooltip({
|
|
|
1906
1980
|
}
|
|
1907
1981
|
|
|
1908
1982
|
// src/AdvertiserNoResults.tsx
|
|
1909
|
-
import { jsx as
|
|
1983
|
+
import { jsx as jsx20, jsxs as jsxs17 } from "react/jsx-runtime";
|
|
1910
1984
|
function AdvertiserNoResults({
|
|
1911
1985
|
query,
|
|
1912
1986
|
hint = "Try checking your spelling or searching for a broader brand name."
|
|
@@ -1917,13 +1991,13 @@ function AdvertiserNoResults({
|
|
|
1917
1991
|
query,
|
|
1918
1992
|
"\u201D"
|
|
1919
1993
|
] }),
|
|
1920
|
-
/* @__PURE__ */
|
|
1994
|
+
/* @__PURE__ */ jsx20("p", { className: "text-[12px] leading-snug text-text-tertiary", children: hint })
|
|
1921
1995
|
] });
|
|
1922
1996
|
}
|
|
1923
1997
|
|
|
1924
1998
|
// src/SelectAllVisible.tsx
|
|
1925
1999
|
import { ListChecks as ListChecks2 } from "lucide-react";
|
|
1926
|
-
import { jsx as
|
|
2000
|
+
import { jsx as jsx21, jsxs as jsxs18 } from "react/jsx-runtime";
|
|
1927
2001
|
function SelectAllVisible({ count, allSelected, onToggle, testIdPrefix }) {
|
|
1928
2002
|
return /* @__PURE__ */ jsxs18(
|
|
1929
2003
|
"button",
|
|
@@ -1933,7 +2007,7 @@ function SelectAllVisible({ count, allSelected, onToggle, testIdPrefix }) {
|
|
|
1933
2007
|
onClick: onToggle,
|
|
1934
2008
|
className: "flex w-full items-center gap-2 rounded-control px-2 py-1.5 text-left text-[12px] font-semibold text-text-link transition-colors hover:bg-subtle",
|
|
1935
2009
|
children: [
|
|
1936
|
-
/* @__PURE__ */
|
|
2010
|
+
/* @__PURE__ */ jsx21(ListChecks2, { size: 14, "aria-hidden": "true" }),
|
|
1937
2011
|
allSelected ? `Deselect ${count} visible` : `Select all ${count} visible`
|
|
1938
2012
|
]
|
|
1939
2013
|
}
|
|
@@ -1942,7 +2016,7 @@ function SelectAllVisible({ count, allSelected, onToggle, testIdPrefix }) {
|
|
|
1942
2016
|
|
|
1943
2017
|
// src/SelectedSection.tsx
|
|
1944
2018
|
import { ChevronDown as ChevronDown7 } from "lucide-react";
|
|
1945
|
-
import { jsx as
|
|
2019
|
+
import { jsx as jsx22, jsxs as jsxs19 } from "react/jsx-runtime";
|
|
1946
2020
|
function cx7(...parts) {
|
|
1947
2021
|
return parts.filter(Boolean).join(" ");
|
|
1948
2022
|
}
|
|
@@ -1958,14 +2032,14 @@ function SelectedSection({ count, open, onToggle, children, testIdPrefix }) {
|
|
|
1958
2032
|
"aria-expanded": open,
|
|
1959
2033
|
className: "flex w-full items-center gap-1.5 rounded-control px-2 py-1 text-left text-[11px] font-semibold uppercase tracking-wide text-text-tertiary transition-colors hover:text-text-primary",
|
|
1960
2034
|
children: [
|
|
1961
|
-
/* @__PURE__ */
|
|
2035
|
+
/* @__PURE__ */ jsx22(ChevronDown7, { size: 13, "aria-hidden": "true", className: cx7("transition-transform", !open && "-rotate-90") }),
|
|
1962
2036
|
"Selected (",
|
|
1963
2037
|
count,
|
|
1964
2038
|
")"
|
|
1965
2039
|
]
|
|
1966
2040
|
}
|
|
1967
2041
|
),
|
|
1968
|
-
open && /* @__PURE__ */
|
|
2042
|
+
open && /* @__PURE__ */ jsx22("div", { className: "flex flex-col gap-0.5", children })
|
|
1969
2043
|
] });
|
|
1970
2044
|
}
|
|
1971
2045
|
|
|
@@ -1973,7 +2047,7 @@ function SelectedSection({ count, open, onToggle, children, testIdPrefix }) {
|
|
|
1973
2047
|
import { useCallback as useCallback3, useEffect as useEffect9, useLayoutEffect as useLayoutEffect3, useMemo as useMemo3, useRef as useRef10, useState as useState9 } from "react";
|
|
1974
2048
|
import { createPortal as createPortal4 } from "react-dom";
|
|
1975
2049
|
import { Search as Search4, Plus, Info as Info2, ChevronRight as ChevronRight3, ChevronDown as ChevronDown8, Check as Check6, List, Loader2 } from "lucide-react";
|
|
1976
|
-
import { Fragment as Fragment4, jsx as
|
|
2050
|
+
import { Fragment as Fragment4, jsx as jsx23, jsxs as jsxs20 } from "react/jsx-runtime";
|
|
1977
2051
|
function cx8(...parts) {
|
|
1978
2052
|
return parts.filter(Boolean).join(" ");
|
|
1979
2053
|
}
|
|
@@ -2070,10 +2144,10 @@ function SelectionPicker({
|
|
|
2070
2144
|
const rowGridCols = showInfoColumn ? "grid-cols-[36px_1fr_44px]" : "grid-cols-[36px_1fr]";
|
|
2071
2145
|
return /* @__PURE__ */ jsxs20("div", { className: "flex flex-col gap-4", children: [
|
|
2072
2146
|
helper && /* @__PURE__ */ jsxs20(Fragment4, { children: [
|
|
2073
|
-
/* @__PURE__ */
|
|
2074
|
-
/* @__PURE__ */
|
|
2147
|
+
/* @__PURE__ */ jsx23("p", { className: "text-[13px] text-text-secondary", children: helper }),
|
|
2148
|
+
/* @__PURE__ */ jsx23("hr", { className: "-mx-5 -mt-2 border-border-default sm:-mx-6" })
|
|
2075
2149
|
] }),
|
|
2076
|
-
hasAccountLists && /* @__PURE__ */
|
|
2150
|
+
hasAccountLists && /* @__PURE__ */ jsx23("div", { className: "inline-flex gap-0.5 self-start rounded-control border border-border-default bg-canvas p-0.5", children: [
|
|
2077
2151
|
{ id: "search", label: "Search", icon: Search4 },
|
|
2078
2152
|
{ id: "lists", label: "Account lists", icon: List }
|
|
2079
2153
|
].map((t) => {
|
|
@@ -2089,7 +2163,7 @@ function SelectionPicker({
|
|
|
2089
2163
|
on ? "bg-surface text-text-primary shadow-raised" : "text-text-secondary hover:text-text-primary"
|
|
2090
2164
|
),
|
|
2091
2165
|
children: [
|
|
2092
|
-
/* @__PURE__ */
|
|
2166
|
+
/* @__PURE__ */ jsx23(t.icon, { size: 14, "aria-hidden": "true" }),
|
|
2093
2167
|
t.label
|
|
2094
2168
|
]
|
|
2095
2169
|
},
|
|
@@ -2099,8 +2173,8 @@ function SelectionPicker({
|
|
|
2099
2173
|
source === "search" && /* @__PURE__ */ jsxs20("div", { className: "flex min-w-0 flex-col gap-3", children: [
|
|
2100
2174
|
/* @__PURE__ */ jsxs20("div", { className: "flex flex-wrap items-center gap-2", children: [
|
|
2101
2175
|
/* @__PURE__ */ jsxs20("div", { className: "flex h-9 min-w-[200px] flex-1 items-center gap-2 rounded-control border border-border-default bg-input px-3", children: [
|
|
2102
|
-
/* @__PURE__ */
|
|
2103
|
-
/* @__PURE__ */
|
|
2176
|
+
/* @__PURE__ */ jsx23(Search4, { size: 15, className: "text-text-secondary", "aria-hidden": "true" }),
|
|
2177
|
+
/* @__PURE__ */ jsx23(
|
|
2104
2178
|
"input",
|
|
2105
2179
|
{
|
|
2106
2180
|
value: query,
|
|
@@ -2116,7 +2190,7 @@ function SelectionPicker({
|
|
|
2116
2190
|
}
|
|
2117
2191
|
)
|
|
2118
2192
|
] }),
|
|
2119
|
-
filters.map((f) => /* @__PURE__ */
|
|
2193
|
+
filters.map((f) => /* @__PURE__ */ jsx23(
|
|
2120
2194
|
FilterDropdown,
|
|
2121
2195
|
{
|
|
2122
2196
|
filter: f,
|
|
@@ -2129,10 +2203,10 @@ function SelectionPicker({
|
|
|
2129
2203
|
toolbarExtra
|
|
2130
2204
|
] }),
|
|
2131
2205
|
!hasSearched ? /* @__PURE__ */ jsxs20("div", { className: "flex flex-col items-center gap-3 rounded-card border border-dashed border-border-default py-10 text-center", children: [
|
|
2132
|
-
/* @__PURE__ */
|
|
2206
|
+
/* @__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" }) }),
|
|
2133
2207
|
/* @__PURE__ */ jsxs20("div", { className: "flex flex-col gap-1", children: [
|
|
2134
|
-
/* @__PURE__ */
|
|
2135
|
-
/* @__PURE__ */
|
|
2208
|
+
/* @__PURE__ */ jsx23("p", { className: "text-[14px] font-semibold text-text-primary", children: "Search to get started" }),
|
|
2209
|
+
/* @__PURE__ */ jsx23("p", { className: "text-[13px] text-text-tertiary", children: "Use the search or filters above to find and add options." })
|
|
2136
2210
|
] })
|
|
2137
2211
|
] }) : /* @__PURE__ */ jsxs20("div", { className: "overflow-hidden rounded-control border border-border-default", children: [
|
|
2138
2212
|
/* @__PURE__ */ jsxs20(
|
|
@@ -2143,7 +2217,7 @@ function SelectionPicker({
|
|
|
2143
2217
|
rowGridCols
|
|
2144
2218
|
),
|
|
2145
2219
|
children: [
|
|
2146
|
-
/* @__PURE__ */
|
|
2220
|
+
/* @__PURE__ */ jsx23(
|
|
2147
2221
|
CheckBox,
|
|
2148
2222
|
{
|
|
2149
2223
|
checked: allSelected,
|
|
@@ -2154,12 +2228,12 @@ function SelectionPicker({
|
|
|
2154
2228
|
testId: testIdPrefix && `${testIdPrefix}-select-all`
|
|
2155
2229
|
}
|
|
2156
2230
|
),
|
|
2157
|
-
/* @__PURE__ */
|
|
2158
|
-
showInfoColumn && /* @__PURE__ */
|
|
2231
|
+
/* @__PURE__ */ jsx23("div", { className: cx8("grid gap-2", gridForColumns(columns)), children: columns.map((c) => /* @__PURE__ */ jsx23("span", { className: c.className, children: c.header }, c.key)) }),
|
|
2232
|
+
showInfoColumn && /* @__PURE__ */ jsx23("span", { className: "text-right", children: "Info" })
|
|
2159
2233
|
]
|
|
2160
2234
|
}
|
|
2161
2235
|
),
|
|
2162
|
-
/* @__PURE__ */
|
|
2236
|
+
/* @__PURE__ */ jsx23("div", { className: "max-h-[360px] overflow-y-auto", children: loading ? /* @__PURE__ */ jsx23("div", { className: "flex items-center justify-center py-6", role: "status", "aria-label": "Loading", children: /* @__PURE__ */ jsx23(Loader2, { size: 18, className: "animate-spin text-text-tertiary", "aria-hidden": "true" }) }) : error ? /* @__PURE__ */ jsx23("p", { className: "px-3 py-8 text-center text-[13px] text-text-tertiary", children: errorMessage }) : rows.length === 0 ? /* @__PURE__ */ jsx23("div", { className: "px-3 py-8 text-center text-[13px] text-text-tertiary", children: "No matches. Try a different search or filter." }) : rows.map((row) => {
|
|
2163
2237
|
const isSel = selectedIds.has(row.id);
|
|
2164
2238
|
const isLocked = lockedIds?.has(row.id) ?? false;
|
|
2165
2239
|
const kids = getChildren?.(row);
|
|
@@ -2177,7 +2251,7 @@ function SelectionPicker({
|
|
|
2177
2251
|
!isLocked && isSel && "opacity-60"
|
|
2178
2252
|
),
|
|
2179
2253
|
children: [
|
|
2180
|
-
isLocked ? /* @__PURE__ */
|
|
2254
|
+
isLocked ? /* @__PURE__ */ jsx23("span", { "aria-hidden": "true" }) : /* @__PURE__ */ jsx23(
|
|
2181
2255
|
CheckBox,
|
|
2182
2256
|
{
|
|
2183
2257
|
checked: isSel,
|
|
@@ -2186,8 +2260,8 @@ function SelectionPicker({
|
|
|
2186
2260
|
testId: testIdPrefix && `${testIdPrefix}-row-${slug4(row.id)}`
|
|
2187
2261
|
}
|
|
2188
2262
|
),
|
|
2189
|
-
/* @__PURE__ */
|
|
2190
|
-
showInfoColumn && /* @__PURE__ */
|
|
2263
|
+
/* @__PURE__ */ jsx23("div", { className: cx8("grid gap-2 text-[13px] text-text-primary", gridForColumns(columns)), children: columns.map((c) => /* @__PURE__ */ jsx23("span", { className: cx8("truncate", c.className), children: c.render(row) }, c.key)) }),
|
|
2264
|
+
showInfoColumn && /* @__PURE__ */ jsx23("div", { className: "flex items-center justify-end", children: kids && kids.length > 0 ? /* @__PURE__ */ jsx23(
|
|
2191
2265
|
"button",
|
|
2192
2266
|
{
|
|
2193
2267
|
type: "button",
|
|
@@ -2201,27 +2275,27 @@ function SelectionPicker({
|
|
|
2201
2275
|
});
|
|
2202
2276
|
},
|
|
2203
2277
|
className: "flex h-7 w-7 items-center justify-center rounded-control text-text-secondary hover:bg-canvas hover:text-text-primary",
|
|
2204
|
-
children: /* @__PURE__ */
|
|
2278
|
+
children: /* @__PURE__ */ jsx23(ChevronRight3, { size: 15, className: cx8("transition-transform", isOpen && "rotate-90") })
|
|
2205
2279
|
}
|
|
2206
|
-
) : /* @__PURE__ */
|
|
2280
|
+
) : /* @__PURE__ */ jsx23(
|
|
2207
2281
|
"span",
|
|
2208
2282
|
{
|
|
2209
2283
|
className: "flex h-7 w-7 items-center justify-center text-text-tertiary",
|
|
2210
2284
|
title: "No additional details",
|
|
2211
|
-
children: /* @__PURE__ */
|
|
2285
|
+
children: /* @__PURE__ */ jsx23(Info2, { size: 14 })
|
|
2212
2286
|
}
|
|
2213
2287
|
) })
|
|
2214
2288
|
]
|
|
2215
2289
|
}
|
|
2216
2290
|
),
|
|
2217
|
-
isOpen && kids && /* @__PURE__ */
|
|
2291
|
+
isOpen && kids && /* @__PURE__ */ jsx23("div", { className: "bg-canvas/60 pb-1.5 pl-10 pr-3", children: kids.map((kid) => {
|
|
2218
2292
|
const kidSel = selectedIds.has(kid.id);
|
|
2219
2293
|
return /* @__PURE__ */ jsxs20(
|
|
2220
2294
|
"div",
|
|
2221
2295
|
{
|
|
2222
2296
|
className: "flex items-center justify-between gap-2 border-t border-border-default/40 py-2 first:border-t-0",
|
|
2223
2297
|
children: [
|
|
2224
|
-
/* @__PURE__ */
|
|
2298
|
+
/* @__PURE__ */ jsx23("span", { className: "truncate text-[13px] text-text-secondary", children: kid.name }),
|
|
2225
2299
|
/* @__PURE__ */ jsxs20(
|
|
2226
2300
|
"button",
|
|
2227
2301
|
{
|
|
@@ -2233,7 +2307,7 @@ function SelectionPicker({
|
|
|
2233
2307
|
kidSel ? "text-text-tertiary" : "text-text-link hover:bg-subtle"
|
|
2234
2308
|
),
|
|
2235
2309
|
children: [
|
|
2236
|
-
kidSel ? /* @__PURE__ */
|
|
2310
|
+
kidSel ? /* @__PURE__ */ jsx23(Check6, { size: 13 }) : /* @__PURE__ */ jsx23(Plus, { size: 13 }),
|
|
2237
2311
|
kidSel ? "Added" : "Add"
|
|
2238
2312
|
]
|
|
2239
2313
|
}
|
|
@@ -2254,7 +2328,7 @@ function SelectionPicker({
|
|
|
2254
2328
|
"data-testid": testIdPrefix && `${testIdPrefix}-load-more`,
|
|
2255
2329
|
className: "flex w-full items-center justify-center gap-2 border-t border-border-default px-2 py-1.5 text-[13px] text-brand-primaryAction transition-colors hover:bg-subtle disabled:opacity-50",
|
|
2256
2330
|
children: [
|
|
2257
|
-
loadingMore ? /* @__PURE__ */
|
|
2331
|
+
loadingMore ? /* @__PURE__ */ jsx23(Loader2, { size: 13, className: "animate-spin", "aria-hidden": "true" }) : null,
|
|
2258
2332
|
loadingMore ? "Loading\u2026" : "Load more"
|
|
2259
2333
|
]
|
|
2260
2334
|
}
|
|
@@ -2262,9 +2336,9 @@ function SelectionPicker({
|
|
|
2262
2336
|
] })
|
|
2263
2337
|
] }),
|
|
2264
2338
|
source === "lists" && /* @__PURE__ */ jsxs20("div", { className: "flex min-w-0 flex-col gap-3", children: [
|
|
2265
|
-
/* @__PURE__ */
|
|
2339
|
+
/* @__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." }),
|
|
2266
2340
|
accountLists && accountLists.length > 0 ? /* @__PURE__ */ jsxs20(Fragment4, { children: [
|
|
2267
|
-
/* @__PURE__ */
|
|
2341
|
+
/* @__PURE__ */ jsx23(ScrollFade, { className: "flex max-h-[396px] flex-col gap-2 overflow-y-auto pr-0.5", children: accountLists.map((list) => {
|
|
2268
2342
|
const on = (selectedListIds ?? []).includes(list.id);
|
|
2269
2343
|
return /* @__PURE__ */ jsxs20(
|
|
2270
2344
|
"button",
|
|
@@ -2278,18 +2352,18 @@ function SelectionPicker({
|
|
|
2278
2352
|
on ? "border-brand-primaryAction bg-brand-primarySoft" : "border-border-default bg-surface hover:bg-subtle"
|
|
2279
2353
|
),
|
|
2280
2354
|
children: [
|
|
2281
|
-
/* @__PURE__ */
|
|
2355
|
+
/* @__PURE__ */ jsx23(
|
|
2282
2356
|
"span",
|
|
2283
2357
|
{
|
|
2284
2358
|
className: cx8(
|
|
2285
2359
|
"flex h-5 w-5 shrink-0 items-center justify-center rounded-full",
|
|
2286
2360
|
on ? "text-brand-primaryAction" : "text-text-secondary"
|
|
2287
2361
|
),
|
|
2288
|
-
children: on ? /* @__PURE__ */
|
|
2362
|
+
children: on ? /* @__PURE__ */ jsx23(Check6, { size: 16 }) : /* @__PURE__ */ jsx23(Plus, { size: 16 })
|
|
2289
2363
|
}
|
|
2290
2364
|
),
|
|
2291
2365
|
/* @__PURE__ */ jsxs20("span", { className: "min-w-0 flex-1", children: [
|
|
2292
|
-
/* @__PURE__ */
|
|
2366
|
+
/* @__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 }) }),
|
|
2293
2367
|
/* @__PURE__ */ jsxs20("span", { className: "block truncate text-[12px] text-text-secondary", children: [
|
|
2294
2368
|
list.count,
|
|
2295
2369
|
" accounts \xB7 ",
|
|
@@ -2298,7 +2372,7 @@ function SelectionPicker({
|
|
|
2298
2372
|
formatListDate(list.updatedAt)
|
|
2299
2373
|
] })
|
|
2300
2374
|
] }),
|
|
2301
|
-
/* @__PURE__ */
|
|
2375
|
+
/* @__PURE__ */ jsx23("span", { className: cx8("shrink-0 text-[12px] font-medium", on ? "text-brand-primaryAction" : "text-text-secondary"), children: on ? "Added" : "Add" })
|
|
2302
2376
|
]
|
|
2303
2377
|
},
|
|
2304
2378
|
list.id
|
|
@@ -2317,10 +2391,10 @@ function SelectionPicker({
|
|
|
2317
2391
|
}
|
|
2318
2392
|
)
|
|
2319
2393
|
] }) : /* @__PURE__ */ jsxs20("div", { className: "flex flex-col items-center gap-3 rounded-card border border-dashed border-border-default py-10 text-center", children: [
|
|
2320
|
-
/* @__PURE__ */
|
|
2394
|
+
/* @__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" }) }),
|
|
2321
2395
|
/* @__PURE__ */ jsxs20("div", { className: "flex flex-col gap-1", children: [
|
|
2322
|
-
/* @__PURE__ */
|
|
2323
|
-
/* @__PURE__ */
|
|
2396
|
+
/* @__PURE__ */ jsx23("p", { className: "text-[14px] font-semibold text-text-primary", children: "No account lists yet" }),
|
|
2397
|
+
/* @__PURE__ */ jsx23("p", { className: "text-[13px] text-text-tertiary", children: "Account lists set up for you will appear here." })
|
|
2324
2398
|
] })
|
|
2325
2399
|
] })
|
|
2326
2400
|
] })
|
|
@@ -2352,7 +2426,7 @@ function ScrollFade({ className, children }) {
|
|
|
2352
2426
|
[sync]
|
|
2353
2427
|
);
|
|
2354
2428
|
const mask = edges.top || edges.bottom ? `linear-gradient(to bottom, transparent 0, #000 ${edges.top ? EDGE_FADE : 0}px, #000 calc(100% - ${edges.bottom ? EDGE_FADE : 0}px), transparent 100%)` : void 0;
|
|
2355
|
-
return /* @__PURE__ */
|
|
2429
|
+
return /* @__PURE__ */ jsx23("div", { ref: attach, onScroll: sync, className, style: { maskImage: mask, WebkitMaskImage: mask }, children });
|
|
2356
2430
|
}
|
|
2357
2431
|
function formatListDate(iso) {
|
|
2358
2432
|
try {
|
|
@@ -2415,7 +2489,7 @@ function FilterDropdown({
|
|
|
2415
2489
|
className: "inline-flex h-9 items-center gap-1.5 whitespace-nowrap rounded-control border border-border-default bg-input px-3 text-[13px] font-medium text-text-secondary transition-colors hover:bg-subtle",
|
|
2416
2490
|
children: [
|
|
2417
2491
|
label,
|
|
2418
|
-
/* @__PURE__ */
|
|
2492
|
+
/* @__PURE__ */ jsx23(ChevronDown8, { size: 13, "aria-hidden": "true", className: cx8("transition-transform", open && "rotate-180") })
|
|
2419
2493
|
]
|
|
2420
2494
|
}
|
|
2421
2495
|
),
|
|
@@ -2430,8 +2504,8 @@ function FilterDropdown({
|
|
|
2430
2504
|
className: "fixed z-[80] min-w-[220px] rounded-card border border-border-default bg-surface p-2 shadow-overlay",
|
|
2431
2505
|
children: [
|
|
2432
2506
|
searchable && /* @__PURE__ */ jsxs20("div", { className: "mb-1.5 flex h-8 items-center gap-2 rounded-control border border-border-default bg-input px-2.5", children: [
|
|
2433
|
-
/* @__PURE__ */
|
|
2434
|
-
/* @__PURE__ */
|
|
2507
|
+
/* @__PURE__ */ jsx23(Search4, { size: 14, className: "shrink-0 text-text-secondary", "aria-hidden": "true" }),
|
|
2508
|
+
/* @__PURE__ */ jsx23(
|
|
2435
2509
|
"input",
|
|
2436
2510
|
{
|
|
2437
2511
|
autoFocus: true,
|
|
@@ -2442,14 +2516,14 @@ function FilterDropdown({
|
|
|
2442
2516
|
}
|
|
2443
2517
|
)
|
|
2444
2518
|
] }),
|
|
2445
|
-
/* @__PURE__ */
|
|
2519
|
+
/* @__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) => {
|
|
2446
2520
|
const on = active.has(opt);
|
|
2447
2521
|
return /* @__PURE__ */ jsxs20(
|
|
2448
2522
|
"label",
|
|
2449
2523
|
{
|
|
2450
2524
|
className: "flex cursor-pointer items-center gap-2 rounded-control px-2 py-1.5 text-[13px] text-text-primary hover:bg-subtle",
|
|
2451
2525
|
children: [
|
|
2452
|
-
/* @__PURE__ */
|
|
2526
|
+
/* @__PURE__ */ jsx23(
|
|
2453
2527
|
CheckBox,
|
|
2454
2528
|
{
|
|
2455
2529
|
checked: on,
|
|
@@ -2480,7 +2554,7 @@ function gridForColumns(columns) {
|
|
|
2480
2554
|
|
|
2481
2555
|
// src/PublisherBreakdownList.tsx
|
|
2482
2556
|
import { useState as useState10 } from "react";
|
|
2483
|
-
import { jsx as
|
|
2557
|
+
import { jsx as jsx24, jsxs as jsxs21 } from "react/jsx-runtime";
|
|
2484
2558
|
function cx9(...parts) {
|
|
2485
2559
|
return parts.filter(Boolean).join(" ");
|
|
2486
2560
|
}
|
|
@@ -2495,7 +2569,7 @@ function initials(name) {
|
|
|
2495
2569
|
return name.replace(/[^a-zA-Z0-9]/g, "").slice(0, 2).toUpperCase();
|
|
2496
2570
|
}
|
|
2497
2571
|
function Monogram({ name, size = 28 }) {
|
|
2498
|
-
return /* @__PURE__ */
|
|
2572
|
+
return /* @__PURE__ */ jsx24(
|
|
2499
2573
|
"span",
|
|
2500
2574
|
{
|
|
2501
2575
|
"aria-hidden": "true",
|
|
@@ -2506,12 +2580,12 @@ function Monogram({ name, size = 28 }) {
|
|
|
2506
2580
|
);
|
|
2507
2581
|
}
|
|
2508
2582
|
function BreakdownTag({ children }) {
|
|
2509
|
-
return /* @__PURE__ */
|
|
2583
|
+
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 });
|
|
2510
2584
|
}
|
|
2511
2585
|
function DelayedTip({ label, children }) {
|
|
2512
2586
|
return /* @__PURE__ */ jsxs21("span", { className: "group/dt relative inline-flex", tabIndex: 0, "aria-label": label, children: [
|
|
2513
2587
|
children,
|
|
2514
|
-
/* @__PURE__ */
|
|
2588
|
+
/* @__PURE__ */ jsx24(
|
|
2515
2589
|
"span",
|
|
2516
2590
|
{
|
|
2517
2591
|
role: "tooltip",
|
|
@@ -2526,11 +2600,11 @@ var COL_PREVIOUS = 76;
|
|
|
2526
2600
|
var COL_YOY = 44;
|
|
2527
2601
|
function MetricListHeader({ className }) {
|
|
2528
2602
|
return /* @__PURE__ */ jsxs21("div", { className: cx9("flex items-baseline gap-2 pb-2", className), children: [
|
|
2529
|
-
/* @__PURE__ */
|
|
2603
|
+
/* @__PURE__ */ jsx24("span", { className: "flex-1" }),
|
|
2530
2604
|
/* @__PURE__ */ jsxs21("span", { className: "flex shrink-0 items-center gap-2 pr-1.5", children: [
|
|
2531
|
-
/* @__PURE__ */
|
|
2532
|
-
/* @__PURE__ */
|
|
2533
|
-
/* @__PURE__ */
|
|
2605
|
+
/* @__PURE__ */ jsx24("span", { className: "text-right text-[11px] font-medium text-text-tertiary", style: { width: COL_CURRENT }, children: "Current" }),
|
|
2606
|
+
/* @__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
|
+
/* @__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" }) })
|
|
2534
2608
|
] })
|
|
2535
2609
|
] });
|
|
2536
2610
|
}
|
|
@@ -2538,9 +2612,9 @@ function MetricCells({ spendN, yoy }) {
|
|
|
2538
2612
|
const prior = priorYearAmt(spendN, yoy);
|
|
2539
2613
|
const up = yoy !== "NEW" && yoy >= 0;
|
|
2540
2614
|
return /* @__PURE__ */ jsxs21("span", { className: "flex shrink-0 items-center gap-2 pr-1.5", children: [
|
|
2541
|
-
/* @__PURE__ */
|
|
2542
|
-
/* @__PURE__ */
|
|
2543
|
-
/* @__PURE__ */
|
|
2615
|
+
/* @__PURE__ */ jsx24("span", { className: "text-right text-[12px] font-bold tabular-nums text-text-primary", style: { width: COL_CURRENT }, children: fmtM(spendN) }),
|
|
2616
|
+
/* @__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__ */ jsxs21("span", { className: cx9("text-right text-[12px] font-semibold tabular-nums", up ? "text-text-success" : "text-text-danger"), children: [
|
|
2544
2618
|
up ? "+" : "\u2212",
|
|
2545
2619
|
Math.abs(yoy),
|
|
2546
2620
|
"%"
|
|
@@ -2553,22 +2627,22 @@ function PublisherBreakdownList({ rows, defaultVisibleCount = 10, padded = true,
|
|
|
2553
2627
|
const rowPad = padded ? "px-5" : "";
|
|
2554
2628
|
return /* @__PURE__ */ jsxs21("div", { className: "flex flex-col", children: [
|
|
2555
2629
|
/* @__PURE__ */ jsxs21("div", { className: "flex flex-col", children: [
|
|
2556
|
-
/* @__PURE__ */
|
|
2630
|
+
/* @__PURE__ */ jsx24(MetricListHeader, { className: rowPad }),
|
|
2557
2631
|
visible.map((p) => /* @__PURE__ */ jsxs21("div", { className: cx9("flex items-center justify-between gap-3 border-t border-border-default/60 py-2.5 first:border-t-0", rowPad), children: [
|
|
2558
2632
|
/* @__PURE__ */ jsxs21("div", { className: "flex min-w-0 items-center gap-2.5", children: [
|
|
2559
|
-
renderLogo ? renderLogo(p) : /* @__PURE__ */
|
|
2633
|
+
renderLogo ? renderLogo(p) : /* @__PURE__ */ jsx24(Monogram, { name: p.brand, size: 28 }),
|
|
2560
2634
|
/* @__PURE__ */ jsxs21("div", { className: "min-w-0", children: [
|
|
2561
2635
|
/* @__PURE__ */ jsxs21("div", { className: "flex flex-wrap items-center gap-1.5", children: [
|
|
2562
|
-
/* @__PURE__ */
|
|
2563
|
-
p.tags.map((t) => /* @__PURE__ */
|
|
2636
|
+
/* @__PURE__ */ jsx24("span", { className: "text-[14px] font-semibold text-text-primary", children: p.brand }),
|
|
2637
|
+
p.tags.map((t) => /* @__PURE__ */ jsx24(BreakdownTag, { children: t }, t))
|
|
2564
2638
|
] }),
|
|
2565
|
-
/* @__PURE__ */
|
|
2639
|
+
/* @__PURE__ */ jsx24("div", { className: "truncate text-[11.5px] text-text-tertiary", children: p.owner })
|
|
2566
2640
|
] })
|
|
2567
2641
|
] }),
|
|
2568
|
-
/* @__PURE__ */
|
|
2642
|
+
/* @__PURE__ */ jsx24(MetricCells, { spendN: p.spendN, yoy: p.yoy })
|
|
2569
2643
|
] }, p.brand))
|
|
2570
2644
|
] }),
|
|
2571
|
-
rows.length > defaultVisibleCount && (viewAllHref ? /* @__PURE__ */
|
|
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__ */ jsxs21("div", { className: cx9("flex items-center gap-2 border-t border-border-default py-3 text-[12px] text-text-tertiary", rowPad), children: [
|
|
2572
2646
|
/* @__PURE__ */ jsxs21("span", { children: [
|
|
2573
2647
|
"Showing ",
|
|
2574
2648
|
visible.length,
|
|
@@ -2579,7 +2653,7 @@ function PublisherBreakdownList({ rows, defaultVisibleCount = 10, padded = true,
|
|
|
2579
2653
|
"See all (",
|
|
2580
2654
|
rows.length - defaultVisibleCount,
|
|
2581
2655
|
" more)"
|
|
2582
|
-
] }) : /* @__PURE__ */
|
|
2656
|
+
] }) : /* @__PURE__ */ jsx24("button", { type: "button", onClick: () => setShowAll(false), className: "font-semibold text-text-link hover:underline", children: "Show less" })
|
|
2583
2657
|
] }))
|
|
2584
2658
|
] });
|
|
2585
2659
|
}
|
|
@@ -2589,7 +2663,7 @@ import { forwardRef as forwardRef2 } from "react";
|
|
|
2589
2663
|
import { Slot } from "@radix-ui/react-slot";
|
|
2590
2664
|
import { cva } from "class-variance-authority";
|
|
2591
2665
|
import { Loader2 as Loader22 } from "lucide-react";
|
|
2592
|
-
import { jsx as
|
|
2666
|
+
import { jsx as jsx25, jsxs as jsxs22 } from "react/jsx-runtime";
|
|
2593
2667
|
var buttonVariants = cva(
|
|
2594
2668
|
"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",
|
|
2595
2669
|
{
|
|
@@ -2626,7 +2700,7 @@ var Button = forwardRef2(
|
|
|
2626
2700
|
"aria-busy": loading || void 0,
|
|
2627
2701
|
...props,
|
|
2628
2702
|
children: [
|
|
2629
|
-
loading && /* @__PURE__ */
|
|
2703
|
+
loading && /* @__PURE__ */ jsx25(Loader22, { className: "size-4 shrink-0 animate-spin", "aria-hidden": "true" }),
|
|
2630
2704
|
children
|
|
2631
2705
|
]
|
|
2632
2706
|
}
|
|
@@ -2636,7 +2710,7 @@ var Button = forwardRef2(
|
|
|
2636
2710
|
Button.displayName = "Button";
|
|
2637
2711
|
|
|
2638
2712
|
// src/FilterDropdownFooter.tsx
|
|
2639
|
-
import { jsx as
|
|
2713
|
+
import { jsx as jsx26, jsxs as jsxs23 } from "react/jsx-runtime";
|
|
2640
2714
|
function FilterDropdownFooter({
|
|
2641
2715
|
onClear,
|
|
2642
2716
|
onApply,
|
|
@@ -2651,8 +2725,8 @@ function FilterDropdownFooter({
|
|
|
2651
2725
|
onClear ? "justify-between" : "justify-end"
|
|
2652
2726
|
),
|
|
2653
2727
|
children: [
|
|
2654
|
-
onClear && /* @__PURE__ */
|
|
2655
|
-
/* @__PURE__ */
|
|
2728
|
+
onClear && /* @__PURE__ */ jsx26(Button, { type: "button", variant: "ghost", size: "sm", onClick: onClear, children: clearLabel }),
|
|
2729
|
+
/* @__PURE__ */ jsx26(Button, { type: "button", variant: "primary", size: "sm", onClick: onApply, children: applyLabel })
|
|
2656
2730
|
]
|
|
2657
2731
|
}
|
|
2658
2732
|
);
|
|
@@ -2661,7 +2735,7 @@ function FilterDropdownFooter({
|
|
|
2661
2735
|
// src/NameListModal.tsx
|
|
2662
2736
|
import { useEffect as useEffect10, useState as useState11 } from "react";
|
|
2663
2737
|
import { createPortal as createPortal5 } from "react-dom";
|
|
2664
|
-
import { jsx as
|
|
2738
|
+
import { jsx as jsx27, jsxs as jsxs24 } from "react/jsx-runtime";
|
|
2665
2739
|
function NameListModal({
|
|
2666
2740
|
title,
|
|
2667
2741
|
initialName,
|
|
@@ -2686,7 +2760,7 @@ function NameListModal({
|
|
|
2686
2760
|
// bg-scrim, not a literal: design-tokens gained a scrim token in 2.5.0.
|
|
2687
2761
|
// No in-data-[theme=dark] override needed any more -- the token redefines
|
|
2688
2762
|
// itself under that attribute in dark.css, so one class covers both themes.
|
|
2689
|
-
/* @__PURE__ */
|
|
2763
|
+
/* @__PURE__ */ jsx27(
|
|
2690
2764
|
"div",
|
|
2691
2765
|
{
|
|
2692
2766
|
className: "fixed inset-0 z-70 flex items-center justify-center bg-scrim px-4",
|
|
@@ -2699,10 +2773,10 @@ function NameListModal({
|
|
|
2699
2773
|
"aria-label": title,
|
|
2700
2774
|
className: "w-full max-w-[420px] rounded-card border border-border-default bg-surface p-5 shadow-overlay",
|
|
2701
2775
|
children: [
|
|
2702
|
-
/* @__PURE__ */
|
|
2776
|
+
/* @__PURE__ */ jsx27("h2", { className: "text-[16px] font-semibold text-text-primary", children: title }),
|
|
2703
2777
|
/* @__PURE__ */ jsxs24("div", { className: "mt-4 flex flex-col gap-1.5", children: [
|
|
2704
|
-
/* @__PURE__ */
|
|
2705
|
-
/* @__PURE__ */
|
|
2778
|
+
/* @__PURE__ */ jsx27("label", { htmlFor: "account-list-name", className: "text-[12px] font-medium text-text-secondary", children: fieldLabel }),
|
|
2779
|
+
/* @__PURE__ */ jsx27(
|
|
2706
2780
|
"input",
|
|
2707
2781
|
{
|
|
2708
2782
|
id: "account-list-name",
|
|
@@ -2714,13 +2788,13 @@ function NameListModal({
|
|
|
2714
2788
|
}
|
|
2715
2789
|
)
|
|
2716
2790
|
] }),
|
|
2717
|
-
options && options.length > 0 && /* @__PURE__ */
|
|
2718
|
-
/* @__PURE__ */
|
|
2791
|
+
options && options.length > 0 && /* @__PURE__ */ jsx27("div", { className: "mt-4 flex flex-col gap-2.5", children: options.map((o) => /* @__PURE__ */ jsxs24("label", { className: "flex cursor-pointer items-center gap-2.5 text-[13px] text-text-primary", children: [
|
|
2792
|
+
/* @__PURE__ */ jsx27(CheckBox, { checked: !!checked[o.key], onChange: () => toggle(o.key), ariaLabel: o.label }),
|
|
2719
2793
|
o.label
|
|
2720
2794
|
] }, o.key)) }),
|
|
2721
2795
|
/* @__PURE__ */ jsxs24("div", { className: "mt-5 flex items-center justify-end gap-2", children: [
|
|
2722
|
-
/* @__PURE__ */
|
|
2723
|
-
/* @__PURE__ */
|
|
2796
|
+
/* @__PURE__ */ jsx27(Button, { variant: "secondary", onClick: onCancel, children: "Cancel" }),
|
|
2797
|
+
/* @__PURE__ */ jsx27(Button, { disabled: !name.trim(), onClick: () => onSubmit(name.trim(), checked), children: submitLabel })
|
|
2724
2798
|
] })
|
|
2725
2799
|
]
|
|
2726
2800
|
}
|
|
@@ -2732,7 +2806,7 @@ function NameListModal({
|
|
|
2732
2806
|
}
|
|
2733
2807
|
|
|
2734
2808
|
// src/ChipTrigger.tsx
|
|
2735
|
-
import { jsx as
|
|
2809
|
+
import { jsx as jsx28, jsxs as jsxs25 } from "react/jsx-runtime";
|
|
2736
2810
|
function chipTriggerClass(variant = "box") {
|
|
2737
2811
|
return cn(
|
|
2738
2812
|
"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",
|
|
@@ -2744,12 +2818,12 @@ function chipTriggerClass(variant = "box") {
|
|
|
2744
2818
|
}
|
|
2745
2819
|
function ChipContent({ caption, value, icon }) {
|
|
2746
2820
|
const stack = /* @__PURE__ */ jsxs25("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
|
|
2747
|
-
/* @__PURE__ */
|
|
2748
|
-
/* @__PURE__ */
|
|
2821
|
+
/* @__PURE__ */ jsx28("span", { className: "text-[10px] uppercase tracking-wide text-text-tertiary", children: caption }),
|
|
2822
|
+
/* @__PURE__ */ jsx28("span", { className: "text-[12px] font-medium text-text-primary", children: value })
|
|
2749
2823
|
] });
|
|
2750
2824
|
if (icon) {
|
|
2751
2825
|
return /* @__PURE__ */ jsxs25("span", { className: "flex items-center gap-2", children: [
|
|
2752
|
-
/* @__PURE__ */
|
|
2826
|
+
/* @__PURE__ */ jsx28("span", { className: "shrink-0 text-text-tertiary", children: icon }),
|
|
2753
2827
|
stack
|
|
2754
2828
|
] });
|
|
2755
2829
|
}
|
|
@@ -2758,11 +2832,11 @@ function ChipContent({ caption, value, icon }) {
|
|
|
2758
2832
|
|
|
2759
2833
|
// src/FilterChipBar.tsx
|
|
2760
2834
|
import { CircleSlash, X as X3 } from "lucide-react";
|
|
2761
|
-
import { jsx as
|
|
2835
|
+
import { jsx as jsx29, jsxs as jsxs26 } from "react/jsx-runtime";
|
|
2762
2836
|
function FilterChipBar({ chips, onRemove, onClearAll, parkedKeys }) {
|
|
2763
2837
|
if (chips.length === 0) return null;
|
|
2764
2838
|
return /* @__PURE__ */ jsxs26("div", { className: "flex flex-wrap items-center gap-1.5 border-t border-border-default pt-2.5", children: [
|
|
2765
|
-
chips.map((c) => /* @__PURE__ */
|
|
2839
|
+
chips.map((c) => /* @__PURE__ */ jsx29(
|
|
2766
2840
|
Chip,
|
|
2767
2841
|
{
|
|
2768
2842
|
label: c.label,
|
|
@@ -2772,7 +2846,7 @@ function FilterChipBar({ chips, onRemove, onClearAll, parkedKeys }) {
|
|
|
2772
2846
|
},
|
|
2773
2847
|
c.key
|
|
2774
2848
|
)),
|
|
2775
|
-
/* @__PURE__ */
|
|
2849
|
+
/* @__PURE__ */ jsx29("button", { type: "button", onClick: onClearAll, className: "ml-1 text-[12px] font-medium text-text-link hover:underline", children: "Clear all" })
|
|
2776
2850
|
] });
|
|
2777
2851
|
}
|
|
2778
2852
|
function Chip({
|
|
@@ -2794,22 +2868,22 @@ function Chip({
|
|
|
2794
2868
|
) : "bg-subtle text-text-secondary ring-transparent group-hover:bg-border-default group-hover:text-text-primary group-hover:ring-border-interactive"
|
|
2795
2869
|
),
|
|
2796
2870
|
children: [
|
|
2797
|
-
parked && /* @__PURE__ */
|
|
2871
|
+
parked && /* @__PURE__ */ jsx29(CircleSlash, { size: 11, "aria-hidden": "true", className: "shrink-0 text-text-tertiary" }),
|
|
2798
2872
|
label,
|
|
2799
|
-
/* @__PURE__ */
|
|
2873
|
+
/* @__PURE__ */ jsx29(
|
|
2800
2874
|
"button",
|
|
2801
2875
|
{
|
|
2802
2876
|
type: "button",
|
|
2803
2877
|
onClick: onRemove,
|
|
2804
2878
|
"aria-label": `Remove ${groupLabel}: ${label}`,
|
|
2805
2879
|
className: "text-text-tertiary transition-colors hover:text-text-primary",
|
|
2806
|
-
children: /* @__PURE__ */
|
|
2880
|
+
children: /* @__PURE__ */ jsx29(X3, { size: 12 })
|
|
2807
2881
|
}
|
|
2808
2882
|
)
|
|
2809
2883
|
]
|
|
2810
2884
|
}
|
|
2811
2885
|
),
|
|
2812
|
-
/* @__PURE__ */
|
|
2886
|
+
/* @__PURE__ */ jsx29(
|
|
2813
2887
|
"span",
|
|
2814
2888
|
{
|
|
2815
2889
|
role: "tooltip",
|
|
@@ -2822,7 +2896,7 @@ function Chip({
|
|
|
2822
2896
|
|
|
2823
2897
|
// src/SortButton.tsx
|
|
2824
2898
|
import { ArrowUp, ArrowDown, ArrowUpDown } from "lucide-react";
|
|
2825
|
-
import { jsx as
|
|
2899
|
+
import { jsx as jsx30, jsxs as jsxs27 } from "react/jsx-runtime";
|
|
2826
2900
|
function SortButton({ label, sortKey, sort, onSort, disabled = false }) {
|
|
2827
2901
|
const active = !disabled && sort.key === sortKey;
|
|
2828
2902
|
return /* @__PURE__ */ jsxs27(
|
|
@@ -2835,12 +2909,25 @@ function SortButton({ label, sortKey, sort, onSort, disabled = false }) {
|
|
|
2835
2909
|
className: cn(
|
|
2836
2910
|
// text-left overrides the UA default on <button>, which would centre a
|
|
2837
2911
|
// label that wraps onto two lines, out of step with the column under it.
|
|
2838
|
-
|
|
2912
|
+
// `uppercase` is NOT this control imposing a treatment -- it is
|
|
2913
|
+
// restoring one. Every table header row sets uppercase on the <tr>,
|
|
2914
|
+
// and a <button> does not inherit text-transform from its parent
|
|
2915
|
+
// (measured: the <th> computes `uppercase`, the button inside it
|
|
2916
|
+
// computes `none`), so without this a sortable label renders
|
|
2917
|
+
// sentence case beside caps neighbours in the same band.
|
|
2918
|
+
//
|
|
2919
|
+
// Letter-spacing DOES inherit, which is why no tracking is set here.
|
|
2920
|
+
// This control used to set its own `tracking-wide` while every
|
|
2921
|
+
// header row sets `tracking-wider`, so sortable labels rendered
|
|
2922
|
+
// subtly tighter than the fixed headers next to them. A control
|
|
2923
|
+
// should carry exactly the properties that do not inherit, and
|
|
2924
|
+
// nothing more.
|
|
2925
|
+
"group inline-flex items-center gap-1 text-left uppercase transition-colors",
|
|
2839
2926
|
!disabled && "hover:text-text-primary"
|
|
2840
2927
|
),
|
|
2841
2928
|
children: [
|
|
2842
2929
|
label,
|
|
2843
|
-
!disabled && (active ? sort.dir === "asc" ? /* @__PURE__ */
|
|
2930
|
+
!disabled && (active ? sort.dir === "asc" ? /* @__PURE__ */ jsx30(ArrowUp, { size: 12, className: "shrink-0 text-brand-primaryAction" }) : /* @__PURE__ */ jsx30(ArrowDown, { size: 12, className: "shrink-0 text-brand-primaryAction" }) : /* @__PURE__ */ jsx30(
|
|
2844
2931
|
ArrowUpDown,
|
|
2845
2932
|
{
|
|
2846
2933
|
size: 12,
|
|
@@ -2864,7 +2951,7 @@ function sortProp(sort) {
|
|
|
2864
2951
|
|
|
2865
2952
|
// src/Pager.tsx
|
|
2866
2953
|
import { ChevronLeft as ChevronLeft3, ChevronRight as ChevronRight4 } from "lucide-react";
|
|
2867
|
-
import { jsx as
|
|
2954
|
+
import { jsx as jsx31, jsxs as jsxs28 } from "react/jsx-runtime";
|
|
2868
2955
|
function pageWindow(current, total) {
|
|
2869
2956
|
if (total <= 7) return Array.from({ length: total }, (_, i) => i + 1);
|
|
2870
2957
|
const keep = /* @__PURE__ */ new Set([1, total, current, current - 1, current + 1]);
|
|
@@ -2881,7 +2968,7 @@ function pageWindow(current, total) {
|
|
|
2881
2968
|
function Pager({ page, totalPages, onPage }) {
|
|
2882
2969
|
const btn = "flex h-8 min-w-8 items-center justify-center rounded-control px-2 text-[13px] transition-colors";
|
|
2883
2970
|
return /* @__PURE__ */ jsxs28("div", { className: "flex items-center gap-1", children: [
|
|
2884
|
-
/* @__PURE__ */
|
|
2971
|
+
/* @__PURE__ */ jsx31(
|
|
2885
2972
|
"button",
|
|
2886
2973
|
{
|
|
2887
2974
|
type: "button",
|
|
@@ -2889,11 +2976,11 @@ function Pager({ page, totalPages, onPage }) {
|
|
|
2889
2976
|
disabled: page === 1,
|
|
2890
2977
|
"aria-label": "Previous page",
|
|
2891
2978
|
className: cn(btn, "text-text-secondary hover:bg-subtle hover:text-text-primary disabled:pointer-events-none disabled:opacity-30"),
|
|
2892
|
-
children: /* @__PURE__ */
|
|
2979
|
+
children: /* @__PURE__ */ jsx31(ChevronLeft3, { size: 16 })
|
|
2893
2980
|
}
|
|
2894
2981
|
),
|
|
2895
2982
|
pageWindow(page, totalPages).map(
|
|
2896
|
-
(p) => typeof p === "string" ? /* @__PURE__ */
|
|
2983
|
+
(p) => typeof p === "string" ? /* @__PURE__ */ jsx31("span", { className: "px-1 text-[13px] text-text-tertiary", children: "\u2026" }, p) : /* @__PURE__ */ jsx31(
|
|
2897
2984
|
"button",
|
|
2898
2985
|
{
|
|
2899
2986
|
type: "button",
|
|
@@ -2908,7 +2995,7 @@ function Pager({ page, totalPages, onPage }) {
|
|
|
2908
2995
|
p
|
|
2909
2996
|
)
|
|
2910
2997
|
),
|
|
2911
|
-
/* @__PURE__ */
|
|
2998
|
+
/* @__PURE__ */ jsx31(
|
|
2912
2999
|
"button",
|
|
2913
3000
|
{
|
|
2914
3001
|
type: "button",
|
|
@@ -2916,14 +3003,14 @@ function Pager({ page, totalPages, onPage }) {
|
|
|
2916
3003
|
disabled: page === totalPages,
|
|
2917
3004
|
"aria-label": "Next page",
|
|
2918
3005
|
className: cn(btn, "text-text-secondary hover:bg-subtle hover:text-text-primary disabled:pointer-events-none disabled:opacity-30"),
|
|
2919
|
-
children: /* @__PURE__ */
|
|
3006
|
+
children: /* @__PURE__ */ jsx31(ChevronRight4, { size: 16 })
|
|
2920
3007
|
}
|
|
2921
3008
|
)
|
|
2922
3009
|
] });
|
|
2923
3010
|
}
|
|
2924
3011
|
|
|
2925
3012
|
// src/WorkspaceAvatar.tsx
|
|
2926
|
-
import { jsx as
|
|
3013
|
+
import { jsx as jsx32 } from "react/jsx-runtime";
|
|
2927
3014
|
function workspaceInitials(name) {
|
|
2928
3015
|
const words = name.trim().split(/\s+/).filter(Boolean);
|
|
2929
3016
|
if (words.length === 0) return "\xB7";
|
|
@@ -2939,7 +3026,7 @@ var SIZES = {
|
|
|
2939
3026
|
lg: "h-11 w-11 text-[15px]"
|
|
2940
3027
|
};
|
|
2941
3028
|
function WorkspaceAvatar({ name, size = "md" }) {
|
|
2942
|
-
return /* @__PURE__ */
|
|
3029
|
+
return /* @__PURE__ */ jsx32(
|
|
2943
3030
|
"span",
|
|
2944
3031
|
{
|
|
2945
3032
|
"aria-hidden": "true",
|
|
@@ -2953,9 +3040,9 @@ function WorkspaceAvatar({ name, size = "md" }) {
|
|
|
2953
3040
|
}
|
|
2954
3041
|
|
|
2955
3042
|
// src/Tag.tsx
|
|
2956
|
-
import { jsx as
|
|
3043
|
+
import { jsx as jsx33 } from "react/jsx-runtime";
|
|
2957
3044
|
function Tag({ children, className }) {
|
|
2958
|
-
return /* @__PURE__ */
|
|
3045
|
+
return /* @__PURE__ */ jsx33(
|
|
2959
3046
|
"span",
|
|
2960
3047
|
{
|
|
2961
3048
|
className: cn(
|
|
@@ -2969,7 +3056,7 @@ function Tag({ children, className }) {
|
|
|
2969
3056
|
|
|
2970
3057
|
// src/TablePagination.tsx
|
|
2971
3058
|
import { ChevronDown as ChevronDown9, ChevronFirst, ChevronLast, ChevronLeft as ChevronLeft4, ChevronRight as ChevronRight5 } from "lucide-react";
|
|
2972
|
-
import { jsx as
|
|
3059
|
+
import { jsx as jsx34, jsxs as jsxs29 } from "react/jsx-runtime";
|
|
2973
3060
|
function TablePagination({
|
|
2974
3061
|
page,
|
|
2975
3062
|
perPage,
|
|
@@ -2992,17 +3079,17 @@ function TablePagination({
|
|
|
2992
3079
|
return /* @__PURE__ */ jsxs29("div", { className: cn("flex flex-wrap items-center justify-between gap-x-4 gap-y-2", className), children: [
|
|
2993
3080
|
/* @__PURE__ */ jsxs29("label", { className: "flex items-center gap-2 text-[13px] text-text-secondary", children: [
|
|
2994
3081
|
/* @__PURE__ */ jsxs29("span", { className: "relative", children: [
|
|
2995
|
-
/* @__PURE__ */
|
|
3082
|
+
/* @__PURE__ */ jsx34(
|
|
2996
3083
|
"select",
|
|
2997
3084
|
{
|
|
2998
3085
|
value: perPage,
|
|
2999
3086
|
onChange: (e) => onPerPageChange(Number(e.target.value)),
|
|
3000
3087
|
"aria-label": "Items per page",
|
|
3001
3088
|
className: "appearance-none rounded-control border border-border-default bg-input py-1 pl-2.5 pr-7 text-[13px] font-medium text-text-primary focus:outline focus:outline-2 focus:outline-border-focus",
|
|
3002
|
-
children: perPageOptions.map((n) => /* @__PURE__ */
|
|
3089
|
+
children: perPageOptions.map((n) => /* @__PURE__ */ jsx34("option", { value: n, children: n }, n))
|
|
3003
3090
|
}
|
|
3004
3091
|
),
|
|
3005
|
-
/* @__PURE__ */
|
|
3092
|
+
/* @__PURE__ */ jsx34(
|
|
3006
3093
|
ChevronDown9,
|
|
3007
3094
|
{
|
|
3008
3095
|
size: 13,
|
|
@@ -3014,7 +3101,7 @@ function TablePagination({
|
|
|
3014
3101
|
"items per page"
|
|
3015
3102
|
] }),
|
|
3016
3103
|
/* @__PURE__ */ jsxs29("nav", { className: "flex items-center gap-1", "aria-label": "Pagination", children: [
|
|
3017
|
-
/* @__PURE__ */
|
|
3104
|
+
/* @__PURE__ */ jsx34(
|
|
3018
3105
|
"button",
|
|
3019
3106
|
{
|
|
3020
3107
|
type: "button",
|
|
@@ -3022,10 +3109,10 @@ function TablePagination({
|
|
|
3022
3109
|
disabled: current === 1,
|
|
3023
3110
|
"aria-label": "First page",
|
|
3024
3111
|
className: stepBtn,
|
|
3025
|
-
children: /* @__PURE__ */
|
|
3112
|
+
children: /* @__PURE__ */ jsx34(ChevronFirst, { size: 16, "aria-hidden": "true" })
|
|
3026
3113
|
}
|
|
3027
3114
|
),
|
|
3028
|
-
/* @__PURE__ */
|
|
3115
|
+
/* @__PURE__ */ jsx34(
|
|
3029
3116
|
"button",
|
|
3030
3117
|
{
|
|
3031
3118
|
type: "button",
|
|
@@ -3033,11 +3120,11 @@ function TablePagination({
|
|
|
3033
3120
|
disabled: current === 1,
|
|
3034
3121
|
"aria-label": "Previous page",
|
|
3035
3122
|
className: stepBtn,
|
|
3036
|
-
children: /* @__PURE__ */
|
|
3123
|
+
children: /* @__PURE__ */ jsx34(ChevronLeft4, { size: 16, "aria-hidden": "true" })
|
|
3037
3124
|
}
|
|
3038
3125
|
),
|
|
3039
3126
|
pageWindow(current, totalPages).map(
|
|
3040
|
-
(p) => typeof p === "string" ? /* @__PURE__ */
|
|
3127
|
+
(p) => typeof p === "string" ? /* @__PURE__ */ jsx34("span", { className: "px-1 text-[13px] text-text-tertiary", children: "\u2026" }, p) : /* @__PURE__ */ jsx34(
|
|
3041
3128
|
"button",
|
|
3042
3129
|
{
|
|
3043
3130
|
type: "button",
|
|
@@ -3052,7 +3139,7 @@ function TablePagination({
|
|
|
3052
3139
|
p
|
|
3053
3140
|
)
|
|
3054
3141
|
),
|
|
3055
|
-
/* @__PURE__ */
|
|
3142
|
+
/* @__PURE__ */ jsx34(
|
|
3056
3143
|
"button",
|
|
3057
3144
|
{
|
|
3058
3145
|
type: "button",
|
|
@@ -3060,10 +3147,10 @@ function TablePagination({
|
|
|
3060
3147
|
disabled: current === totalPages,
|
|
3061
3148
|
"aria-label": "Next page",
|
|
3062
3149
|
className: stepBtn,
|
|
3063
|
-
children: /* @__PURE__ */
|
|
3150
|
+
children: /* @__PURE__ */ jsx34(ChevronRight5, { size: 16, "aria-hidden": "true" })
|
|
3064
3151
|
}
|
|
3065
3152
|
),
|
|
3066
|
-
/* @__PURE__ */
|
|
3153
|
+
/* @__PURE__ */ jsx34(
|
|
3067
3154
|
"button",
|
|
3068
3155
|
{
|
|
3069
3156
|
type: "button",
|
|
@@ -3071,7 +3158,7 @@ function TablePagination({
|
|
|
3071
3158
|
disabled: current === totalPages,
|
|
3072
3159
|
"aria-label": "Last page",
|
|
3073
3160
|
className: stepBtn,
|
|
3074
|
-
children: /* @__PURE__ */
|
|
3161
|
+
children: /* @__PURE__ */ jsx34(ChevronLast, { size: 16, "aria-hidden": "true" })
|
|
3075
3162
|
}
|
|
3076
3163
|
)
|
|
3077
3164
|
] }),
|
|
@@ -3090,7 +3177,7 @@ function TablePagination({
|
|
|
3090
3177
|
// src/DateRangePicker.tsx
|
|
3091
3178
|
import { useEffect as useEffect11, useMemo as useMemo4, useRef as useRef11, useState as useState12 } from "react";
|
|
3092
3179
|
import { ChevronDown as ChevronDown10 } from "lucide-react";
|
|
3093
|
-
import { jsx as
|
|
3180
|
+
import { jsx as jsx35, jsxs as jsxs30 } from "react/jsx-runtime";
|
|
3094
3181
|
var MONTH_ABBR = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
|
|
3095
3182
|
var QUARTER_ABBR = ["Q1", "Q2", "Q3", "Q4"];
|
|
3096
3183
|
var PRESETS = ["Rolling 3 months", "Rolling 6 months", "Rolling 12 months"];
|
|
@@ -3126,7 +3213,7 @@ function spanLabel(label, today) {
|
|
|
3126
3213
|
return `${fmtDate(s)} \u2013 ${fmtDate(e)}`;
|
|
3127
3214
|
}
|
|
3128
3215
|
function MiniSelect({ value, onChange, options }) {
|
|
3129
|
-
return /* @__PURE__ */
|
|
3216
|
+
return /* @__PURE__ */ jsx35(
|
|
3130
3217
|
"select",
|
|
3131
3218
|
{
|
|
3132
3219
|
value: String(value),
|
|
@@ -3135,7 +3222,7 @@ function MiniSelect({ value, onChange, options }) {
|
|
|
3135
3222
|
if (opt) onChange(opt.value);
|
|
3136
3223
|
},
|
|
3137
3224
|
className: "rounded-control border border-border-default bg-input px-1.5 py-1 text-[12px] text-text-primary outline-hidden focus:border-border-focus",
|
|
3138
|
-
children: options.map((o) => /* @__PURE__ */
|
|
3225
|
+
children: options.map((o) => /* @__PURE__ */ jsx35("option", { value: String(o.value), children: o.label }, String(o.value)))
|
|
3139
3226
|
}
|
|
3140
3227
|
);
|
|
3141
3228
|
}
|
|
@@ -3207,15 +3294,15 @@ function DateRangePicker({
|
|
|
3207
3294
|
className: chipTriggerClass(),
|
|
3208
3295
|
children: [
|
|
3209
3296
|
/* @__PURE__ */ jsxs30("span", { className: "flex flex-col gap-1 text-left leading-none", children: [
|
|
3210
|
-
/* @__PURE__ */
|
|
3211
|
-
/* @__PURE__ */
|
|
3297
|
+
/* @__PURE__ */ jsx35("span", { className: "text-[10px] text-text-tertiary", children: spanLabel(value, end) }),
|
|
3298
|
+
/* @__PURE__ */ jsx35("span", { className: "text-[12px] font-medium text-text-primary", children: value })
|
|
3212
3299
|
] }),
|
|
3213
|
-
/* @__PURE__ */
|
|
3300
|
+
/* @__PURE__ */ jsx35(ChevronDown10, { size: 14, "aria-hidden": "true", className: cn("shrink-0 text-text-secondary transition-transform", open && "rotate-180") })
|
|
3214
3301
|
]
|
|
3215
3302
|
}
|
|
3216
3303
|
),
|
|
3217
3304
|
open && /* @__PURE__ */ jsxs30("div", { className: cn("absolute top-[calc(100%+8px)] z-30 w-[280px] overflow-hidden rounded-card border border-border-default bg-surface py-1 shadow-overlay", align === "right" ? "right-0" : "left-0"), children: [
|
|
3218
|
-
presets.map((p) => /* @__PURE__ */
|
|
3305
|
+
presets.map((p) => /* @__PURE__ */ jsx35(
|
|
3219
3306
|
"button",
|
|
3220
3307
|
{
|
|
3221
3308
|
type: "button",
|
|
@@ -3226,25 +3313,25 @@ function DateRangePicker({
|
|
|
3226
3313
|
p
|
|
3227
3314
|
)),
|
|
3228
3315
|
/* @__PURE__ */ jsxs30("div", { className: "mt-1 border-t border-border-default px-3 pb-2 pt-2", children: [
|
|
3229
|
-
/* @__PURE__ */
|
|
3316
|
+
/* @__PURE__ */ jsx35("div", { className: "text-[13px] font-semibold text-text-primary", children: "Custom Range" }),
|
|
3230
3317
|
/* @__PURE__ */ jsxs30("div", { className: "mt-2 flex flex-col gap-2", children: [
|
|
3231
3318
|
/* @__PURE__ */ jsxs30("label", { className: "flex items-center justify-between gap-2 text-[12px] text-text-secondary", children: [
|
|
3232
3319
|
"From",
|
|
3233
3320
|
/* @__PURE__ */ jsxs30("span", { className: "flex gap-1", children: [
|
|
3234
|
-
granularity === "month" && /* @__PURE__ */
|
|
3235
|
-
granularity === "quarter" && /* @__PURE__ */
|
|
3236
|
-
/* @__PURE__ */
|
|
3321
|
+
granularity === "month" && /* @__PURE__ */ jsx35(MiniSelect, { value: fromMo, onChange: setFromMo, options: MONTH_ABBR.map((mm, i) => ({ label: mm, value: i })) }),
|
|
3322
|
+
granularity === "quarter" && /* @__PURE__ */ jsx35(MiniSelect, { value: fromQ, onChange: setFromQ, options: QUARTER_ABBR.map((qq, i) => ({ label: qq, value: i })) }),
|
|
3323
|
+
/* @__PURE__ */ jsx35(MiniSelect, { value: fromYr, onChange: setFromYr, options: yearOptions.map((y) => ({ label: String(y), value: y })) })
|
|
3237
3324
|
] })
|
|
3238
3325
|
] }),
|
|
3239
3326
|
/* @__PURE__ */ jsxs30("label", { className: "flex items-center justify-between gap-2 text-[12px] text-text-secondary", children: [
|
|
3240
3327
|
"To",
|
|
3241
3328
|
/* @__PURE__ */ jsxs30("span", { className: "flex gap-1", children: [
|
|
3242
|
-
granularity === "month" && /* @__PURE__ */
|
|
3243
|
-
granularity === "quarter" && /* @__PURE__ */
|
|
3244
|
-
/* @__PURE__ */
|
|
3329
|
+
granularity === "month" && /* @__PURE__ */ jsx35(MiniSelect, { value: toMo, onChange: setToMo, options: MONTH_ABBR.map((mm, i) => ({ label: mm, value: i })) }),
|
|
3330
|
+
granularity === "quarter" && /* @__PURE__ */ jsx35(MiniSelect, { value: toQ, onChange: setToQ, options: QUARTER_ABBR.map((qq, i) => ({ label: qq, value: i })) }),
|
|
3331
|
+
/* @__PURE__ */ jsx35(MiniSelect, { value: toYr, onChange: setToYr, options: yearOptions.map((y) => ({ label: String(y), value: y })) })
|
|
3245
3332
|
] })
|
|
3246
3333
|
] }),
|
|
3247
|
-
/* @__PURE__ */
|
|
3334
|
+
/* @__PURE__ */ jsx35(
|
|
3248
3335
|
"button",
|
|
3249
3336
|
{
|
|
3250
3337
|
type: "button",
|
|
@@ -3256,7 +3343,7 @@ function DateRangePicker({
|
|
|
3256
3343
|
)
|
|
3257
3344
|
] })
|
|
3258
3345
|
] }),
|
|
3259
|
-
showFooter && /* @__PURE__ */
|
|
3346
|
+
showFooter && /* @__PURE__ */ jsx35(FilterDropdownFooter, { onApply: () => commit(draft) })
|
|
3260
3347
|
] })
|
|
3261
3348
|
] });
|
|
3262
3349
|
}
|
|
@@ -3264,7 +3351,7 @@ function DateRangePicker({
|
|
|
3264
3351
|
// src/MultiSelectFilter.tsx
|
|
3265
3352
|
import { useCallback as useCallback4, useEffect as useEffect12, useRef as useRef12, useState as useState13 } from "react";
|
|
3266
3353
|
import { ChevronDown as ChevronDown11, Check as Check7, Minus as Minus2, Search as Search5, X as X4 } from "lucide-react";
|
|
3267
|
-
import { jsx as
|
|
3354
|
+
import { jsx as jsx36, jsxs as jsxs31 } from "react/jsx-runtime";
|
|
3268
3355
|
function MultiSelectFilter({
|
|
3269
3356
|
caption,
|
|
3270
3357
|
options = [],
|
|
@@ -3364,8 +3451,8 @@ function MultiSelectFilter({
|
|
|
3364
3451
|
"aria-expanded": open,
|
|
3365
3452
|
className: cn(chipTriggerClass(variant), fullWidth && "w-full justify-between"),
|
|
3366
3453
|
children: [
|
|
3367
|
-
/* @__PURE__ */
|
|
3368
|
-
/* @__PURE__ */
|
|
3454
|
+
/* @__PURE__ */ jsx36(ChipContent, { caption, value, icon }),
|
|
3455
|
+
/* @__PURE__ */ jsx36(
|
|
3369
3456
|
ChevronDown11,
|
|
3370
3457
|
{
|
|
3371
3458
|
size: 14,
|
|
@@ -3387,9 +3474,9 @@ function MultiSelectFilter({
|
|
|
3387
3474
|
role: "dialog",
|
|
3388
3475
|
"aria-label": caption,
|
|
3389
3476
|
children: [
|
|
3390
|
-
searchable && /* @__PURE__ */
|
|
3391
|
-
/* @__PURE__ */
|
|
3392
|
-
/* @__PURE__ */
|
|
3477
|
+
searchable && /* @__PURE__ */ jsx36("div", { className: "border-b border-border-default p-2", children: /* @__PURE__ */ jsxs31("div", { className: "flex h-9 items-center gap-2 rounded-control border border-border-default bg-input px-2.5", children: [
|
|
3478
|
+
/* @__PURE__ */ jsx36(Search5, { size: 14, className: "text-text-secondary", "aria-hidden": "true" }),
|
|
3479
|
+
/* @__PURE__ */ jsx36(
|
|
3393
3480
|
"input",
|
|
3394
3481
|
{
|
|
3395
3482
|
type: "text",
|
|
@@ -3399,7 +3486,7 @@ function MultiSelectFilter({
|
|
|
3399
3486
|
className: "h-full flex-1 bg-transparent text-[13px] outline-hidden placeholder:text-text-tertiary"
|
|
3400
3487
|
}
|
|
3401
3488
|
),
|
|
3402
|
-
q && /* @__PURE__ */
|
|
3489
|
+
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 }) })
|
|
3403
3490
|
] }) }),
|
|
3404
3491
|
/* @__PURE__ */ jsxs31("div", { className: "max-h-[280px] overflow-y-auto p-1", children: [
|
|
3405
3492
|
groups ? visibleGroups.map((g) => {
|
|
@@ -3412,9 +3499,9 @@ function MultiSelectFilter({
|
|
|
3412
3499
|
onClick: () => toggleGroup(g),
|
|
3413
3500
|
className: "flex w-full items-center gap-2.5 rounded-control px-2 py-2 text-left transition-colors hover:bg-subtle",
|
|
3414
3501
|
children: [
|
|
3415
|
-
/* @__PURE__ */
|
|
3416
|
-
/* @__PURE__ */
|
|
3417
|
-
counts && /* @__PURE__ */
|
|
3502
|
+
/* @__PURE__ */ jsx36(TriCheck, { state }),
|
|
3503
|
+
/* @__PURE__ */ jsx36("span", { className: cn("flex-1 text-[14px] text-text-primary", !plainParent && "font-semibold"), children: g.label }),
|
|
3504
|
+
counts && /* @__PURE__ */ jsx36(OptionCount, { n: countFor(g.id) })
|
|
3418
3505
|
]
|
|
3419
3506
|
}
|
|
3420
3507
|
),
|
|
@@ -3427,9 +3514,9 @@ function MultiSelectFilter({
|
|
|
3427
3514
|
onClick: () => toggle(c.id),
|
|
3428
3515
|
className: "flex w-full items-center gap-2.5 rounded-control py-2 pl-9 pr-2 text-left transition-colors hover:bg-subtle",
|
|
3429
3516
|
children: [
|
|
3430
|
-
/* @__PURE__ */
|
|
3431
|
-
/* @__PURE__ */
|
|
3432
|
-
counts && /* @__PURE__ */
|
|
3517
|
+
/* @__PURE__ */ jsx36(TriCheck, { state: checked ? "all" : "none" }),
|
|
3518
|
+
/* @__PURE__ */ jsx36("span", { className: "flex-1 text-[14px] text-text-primary", children: c.label }),
|
|
3519
|
+
counts && /* @__PURE__ */ jsx36(OptionCount, { n: countFor(c.id) })
|
|
3433
3520
|
]
|
|
3434
3521
|
},
|
|
3435
3522
|
c.id
|
|
@@ -3445,26 +3532,26 @@ function MultiSelectFilter({
|
|
|
3445
3532
|
onClick: () => toggle(o.id),
|
|
3446
3533
|
className: "flex w-full items-center gap-2.5 rounded-control px-2 py-2 text-left transition-colors hover:bg-subtle",
|
|
3447
3534
|
children: [
|
|
3448
|
-
/* @__PURE__ */
|
|
3535
|
+
/* @__PURE__ */ jsx36(
|
|
3449
3536
|
"span",
|
|
3450
3537
|
{
|
|
3451
3538
|
className: cn(
|
|
3452
3539
|
"flex h-[18px] w-[18px] shrink-0 items-center justify-center rounded-[5px] border transition-colors",
|
|
3453
3540
|
checked ? "border-transparent bg-brand-primaryAction text-brand-onprimary" : "border-border-interactive bg-input"
|
|
3454
3541
|
),
|
|
3455
|
-
children: checked && /* @__PURE__ */
|
|
3542
|
+
children: checked && /* @__PURE__ */ jsx36(Check7, { size: 13, strokeWidth: 3 })
|
|
3456
3543
|
}
|
|
3457
3544
|
),
|
|
3458
|
-
/* @__PURE__ */
|
|
3459
|
-
counts && /* @__PURE__ */
|
|
3545
|
+
/* @__PURE__ */ jsx36("span", { className: "flex-1 text-[14px] text-text-primary", children: o.label }),
|
|
3546
|
+
counts && /* @__PURE__ */ jsx36(OptionCount, { n: countFor(o.id) })
|
|
3460
3547
|
]
|
|
3461
3548
|
},
|
|
3462
3549
|
o.id
|
|
3463
3550
|
);
|
|
3464
3551
|
}),
|
|
3465
|
-
(groups && !visibleGroups.length || !groups && !items.length) && /* @__PURE__ */
|
|
3552
|
+
(groups && !visibleGroups.length || !groups && !items.length) && /* @__PURE__ */ jsx36("div", { className: "py-6 text-center text-[13px] text-text-tertiary", children: "No matches." })
|
|
3466
3553
|
] }),
|
|
3467
|
-
showFooter ? /* @__PURE__ */
|
|
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__ */ jsxs31(
|
|
3468
3555
|
"button",
|
|
3469
3556
|
{
|
|
3470
3557
|
type: "button",
|
|
@@ -3491,8 +3578,8 @@ function TriCheck({ state }) {
|
|
|
3491
3578
|
filled ? "border-transparent bg-brand-primaryAction text-brand-onprimary" : "border-border-interactive bg-input"
|
|
3492
3579
|
),
|
|
3493
3580
|
children: [
|
|
3494
|
-
state === "all" && /* @__PURE__ */
|
|
3495
|
-
state === "some" && /* @__PURE__ */
|
|
3581
|
+
state === "all" && /* @__PURE__ */ jsx36(Check7, { size: 13, strokeWidth: 3 }),
|
|
3582
|
+
state === "some" && /* @__PURE__ */ jsx36(Minus2, { size: 13, strokeWidth: 3 })
|
|
3496
3583
|
]
|
|
3497
3584
|
}
|
|
3498
3585
|
);
|
|
@@ -3506,14 +3593,14 @@ function OptionCount({ n }) {
|
|
|
3506
3593
|
}
|
|
3507
3594
|
|
|
3508
3595
|
// src/Toggle.tsx
|
|
3509
|
-
import { jsx as
|
|
3596
|
+
import { jsx as jsx37 } from "react/jsx-runtime";
|
|
3510
3597
|
var SIZES2 = {
|
|
3511
3598
|
sm: { track: "h-5 w-9", knob: "h-4 w-4", on: "translate-x-[18px]" },
|
|
3512
3599
|
md: { track: "h-6 w-11", knob: "h-5 w-5", on: "translate-x-[22px]" }
|
|
3513
3600
|
};
|
|
3514
3601
|
function Toggle({ checked, onChange, label, size = "md", disabled, className }) {
|
|
3515
3602
|
const s = SIZES2[size];
|
|
3516
|
-
return /* @__PURE__ */
|
|
3603
|
+
return /* @__PURE__ */ jsx37(
|
|
3517
3604
|
"button",
|
|
3518
3605
|
{
|
|
3519
3606
|
type: "button",
|
|
@@ -3529,7 +3616,7 @@ function Toggle({ checked, onChange, label, size = "md", disabled, className })
|
|
|
3529
3616
|
disabled && "cursor-not-allowed opacity-50",
|
|
3530
3617
|
className
|
|
3531
3618
|
),
|
|
3532
|
-
children: /* @__PURE__ */
|
|
3619
|
+
children: /* @__PURE__ */ jsx37(
|
|
3533
3620
|
"span",
|
|
3534
3621
|
{
|
|
3535
3622
|
className: cn(
|
|
@@ -3546,20 +3633,20 @@ function Toggle({ checked, onChange, label, size = "md", disabled, className })
|
|
|
3546
3633
|
// src/AISpark.tsx
|
|
3547
3634
|
import { useId as useId2 } from "react";
|
|
3548
3635
|
import { Sparkles } from "lucide-react";
|
|
3549
|
-
import { Fragment as Fragment5, jsx as
|
|
3636
|
+
import { Fragment as Fragment5, jsx as jsx38, jsxs as jsxs32 } from "react/jsx-runtime";
|
|
3550
3637
|
function AISpark({ size = 16, className }) {
|
|
3551
3638
|
const id = useId2();
|
|
3552
3639
|
return /* @__PURE__ */ jsxs32(Fragment5, { children: [
|
|
3553
|
-
/* @__PURE__ */
|
|
3554
|
-
/* @__PURE__ */
|
|
3555
|
-
/* @__PURE__ */
|
|
3640
|
+
/* @__PURE__ */ jsx38("svg", { width: "0", height: "0", "aria-hidden": "true", style: { position: "absolute" }, children: /* @__PURE__ */ jsx38("defs", { children: /* @__PURE__ */ jsxs32("linearGradient", { id, x1: "0", y1: "0", x2: "1", y2: "1", children: [
|
|
3641
|
+
/* @__PURE__ */ jsx38("stop", { offset: "0%", stopColor: "var(--mr-color-brand-primary)" }),
|
|
3642
|
+
/* @__PURE__ */ jsx38("stop", { offset: "100%", className: "[stop-color:#9474ff] in-data-[theme=dark]:[stop-color:#a488ff]" })
|
|
3556
3643
|
] }) }) }),
|
|
3557
|
-
/* @__PURE__ */
|
|
3644
|
+
/* @__PURE__ */ jsx38(Sparkles, { size, stroke: `url(#${id})`, className, "aria-hidden": "true" })
|
|
3558
3645
|
] });
|
|
3559
3646
|
}
|
|
3560
3647
|
|
|
3561
3648
|
// src/Freshness.tsx
|
|
3562
|
-
import { jsx as
|
|
3649
|
+
import { jsx as jsx39 } from "react/jsx-runtime";
|
|
3563
3650
|
var dotColor = {
|
|
3564
3651
|
fresh: "bg-status-success",
|
|
3565
3652
|
recent: "bg-status-warning",
|
|
@@ -3571,7 +3658,7 @@ var srLabel = {
|
|
|
3571
3658
|
stale: "Older than a day"
|
|
3572
3659
|
};
|
|
3573
3660
|
function Freshness({ level }) {
|
|
3574
|
-
return /* @__PURE__ */
|
|
3661
|
+
return /* @__PURE__ */ jsx39(
|
|
3575
3662
|
"span",
|
|
3576
3663
|
{
|
|
3577
3664
|
className: cn("inline-block h-1.5 w-1.5 shrink-0 rounded-full", dotColor[level]),
|
|
@@ -3585,6 +3672,7 @@ export {
|
|
|
3585
3672
|
AdvertiserNoResults,
|
|
3586
3673
|
AdvertiserQuickFilter,
|
|
3587
3674
|
AdvertiserSearchPrompt,
|
|
3675
|
+
Badge,
|
|
3588
3676
|
BarChartPlaceholder,
|
|
3589
3677
|
Button,
|
|
3590
3678
|
Card,
|