@lessly/ui 0.20.0 → 0.21.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.d.ts +1 -56
- package/dist/index.js +564 -733
- package/dist/styles.css +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -2444,191 +2444,15 @@ var EmptyState = React42.forwardRef(
|
|
|
2444
2444
|
);
|
|
2445
2445
|
EmptyState.displayName = "EmptyState";
|
|
2446
2446
|
|
|
2447
|
-
// src/components/sign-in-screen.tsx
|
|
2448
|
-
import * as React43 from "react";
|
|
2449
|
-
|
|
2450
|
-
// src/lib/auth-surface.ts
|
|
2451
|
-
var AUTH_GLOW_BG = "radial-gradient(560px 320px at 28% 16%, var(--auth-glow-a), transparent 68%),radial-gradient(520px 340px at 78% 90%, var(--auth-glow-b), transparent 66%),var(--bg-sunken)";
|
|
2452
|
-
var AUTH_FILLED_BUTTON = "flex h-[46px] w-full items-center justify-center gap-[11px] rounded-[10px] border border-transparent bg-text-primary px-[14px] text-[14.5px] font-semibold tracking-[-0.005em] text-bg-sunken transition-opacity hover:opacity-[0.92] focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-text-brand active:translate-y-px disabled:cursor-not-allowed disabled:opacity-[0.55]";
|
|
2453
|
-
var AUTH_QUIET_BUTTON = "flex h-[46px] w-full items-center justify-center gap-[11px] rounded-[10px] border border-border-default bg-transparent px-[14px] text-[14.5px] font-medium tracking-[-0.005em] text-text-secondary transition-colors hover:bg-bg-secondary focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-text-brand";
|
|
2454
|
-
var AUTH_BUTTON_SHADOW = "var(--auth-btn-shadow)";
|
|
2455
|
-
|
|
2456
|
-
// src/components/sign-in-screen.tsx
|
|
2457
|
-
import { Fragment, jsx as jsx49, jsxs as jsxs23 } from "react/jsx-runtime";
|
|
2458
|
-
var DEFAULT_TITLE = {
|
|
2459
|
-
login: "Sign in",
|
|
2460
|
-
forbidden: "Access restricted",
|
|
2461
|
-
error: "Couldn't load"
|
|
2462
|
-
};
|
|
2463
|
-
var DEFAULT_DESCRIPTION = {
|
|
2464
|
-
forbidden: "This app is limited to one Workspace group.",
|
|
2465
|
-
error: "Something interrupted sign-in. Try again in a moment."
|
|
2466
|
-
};
|
|
2467
|
-
function Spinner({ className }) {
|
|
2468
|
-
return /* @__PURE__ */ jsx49(
|
|
2469
|
-
"span",
|
|
2470
|
-
{
|
|
2471
|
-
"aria-hidden": "true",
|
|
2472
|
-
className: cn(
|
|
2473
|
-
"inline-block animate-spin rounded-full border-2 border-current border-t-transparent",
|
|
2474
|
-
className
|
|
2475
|
-
)
|
|
2476
|
-
}
|
|
2477
|
-
);
|
|
2478
|
-
}
|
|
2479
|
-
function GoogleGlyph() {
|
|
2480
|
-
return /* @__PURE__ */ jsx49("span", { className: "inline-flex size-[26px] flex-none items-center justify-center rounded-md bg-white shadow-[0_0_0_1px_rgba(0,0,0,0.05)_inset]", children: /* @__PURE__ */ jsxs23("svg", { width: "17", height: "17", viewBox: "0 0 18 18", "aria-hidden": "true", children: [
|
|
2481
|
-
/* @__PURE__ */ jsx49("path", { fill: "#4285F4", d: "M17.64 9.2c0-.64-.06-1.25-.16-1.84H9v3.48h4.84a4.14 4.14 0 0 1-1.8 2.72v2.26h2.92c1.7-1.57 2.68-3.88 2.68-6.62z" }),
|
|
2482
|
-
/* @__PURE__ */ jsx49("path", { fill: "#34A853", d: "M9 18c2.43 0 4.47-.8 5.96-2.18l-2.92-2.26c-.8.54-1.84.86-3.04.86-2.34 0-4.32-1.58-5.03-3.7H.96v2.33A9 9 0 0 0 9 18z" }),
|
|
2483
|
-
/* @__PURE__ */ jsx49("path", { fill: "#FBBC05", d: "M3.97 10.72a5.4 5.4 0 0 1 0-3.44V4.95H.96a9 9 0 0 0 0 8.1l3.01-2.33z" }),
|
|
2484
|
-
/* @__PURE__ */ jsx49("path", { fill: "#EA4335", d: "M9 3.58c1.32 0 2.5.46 3.44 1.35l2.58-2.58C13.46.9 11.43 0 9 0A9 9 0 0 0 .96 4.95l3.01 2.33C4.68 5.16 6.66 3.58 9 3.58z" })
|
|
2485
|
-
] }) });
|
|
2486
|
-
}
|
|
2487
|
-
var LockIcon = (props) => /* @__PURE__ */ jsxs23("svg", { width: "13", height: "13", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", ...props, children: [
|
|
2488
|
-
/* @__PURE__ */ jsx49("rect", { x: "3", y: "11", width: "18", height: "11", rx: "2" }),
|
|
2489
|
-
/* @__PURE__ */ jsx49("path", { d: "M7 11V7a5 5 0 0 1 10 0v4" })
|
|
2490
|
-
] });
|
|
2491
|
-
var WarningIcon = (props) => /* @__PURE__ */ jsxs23("svg", { width: "17", height: "17", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", ...props, children: [
|
|
2492
|
-
/* @__PURE__ */ jsx49("path", { d: "M10.29 3.86 1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z" }),
|
|
2493
|
-
/* @__PURE__ */ jsx49("line", { x1: "12", y1: "9", x2: "12", y2: "13" }),
|
|
2494
|
-
/* @__PURE__ */ jsx49("line", { x1: "12", y1: "17", x2: "12.01", y2: "17" })
|
|
2495
|
-
] });
|
|
2496
|
-
var ErrorIcon = (props) => /* @__PURE__ */ jsxs23("svg", { width: "17", height: "17", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", ...props, children: [
|
|
2497
|
-
/* @__PURE__ */ jsx49("circle", { cx: "12", cy: "12", r: "10" }),
|
|
2498
|
-
/* @__PURE__ */ jsx49("line", { x1: "12", y1: "8", x2: "12", y2: "12" }),
|
|
2499
|
-
/* @__PURE__ */ jsx49("line", { x1: "12", y1: "16", x2: "12.01", y2: "16" })
|
|
2500
|
-
] });
|
|
2501
|
-
var RetryIcon = (props) => /* @__PURE__ */ jsxs23("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", ...props, children: [
|
|
2502
|
-
/* @__PURE__ */ jsx49("path", { d: "M23 4v6h-6" }),
|
|
2503
|
-
/* @__PURE__ */ jsx49("path", { d: "M20.49 15a9 9 0 1 1-2.12-9.36L23 10" })
|
|
2504
|
-
] });
|
|
2505
|
-
var calloutBase = "mb-[22px] flex gap-[10px] rounded-[10px] border px-[13px] py-[12px] text-left text-[13px] leading-[1.5] text-text-secondary [&_code]:font-mono [&_code]:text-[12px] [&_code]:text-text-primary [&_strong]:font-semibold [&_strong]:text-text-primary";
|
|
2506
|
-
function LockNote({ children }) {
|
|
2507
|
-
return /* @__PURE__ */ jsxs23("div", { className: "mx-auto mt-[20px] flex flex-wrap items-center justify-center gap-[7px] text-[12px] leading-[1.4] text-text-secondary [&_code]:rounded-[5px] [&_code]:bg-bg-secondary [&_code]:px-[6px] [&_code]:py-[2px] [&_code]:font-mono [&_code]:text-[11.5px] [&_code]:text-text-secondary", children: [
|
|
2508
|
-
/* @__PURE__ */ jsx49(LockIcon, { className: "flex-none text-text-tertiary" }),
|
|
2509
|
-
children
|
|
2510
|
-
] });
|
|
2511
|
-
}
|
|
2512
|
-
var SignInScreen = React43.forwardRef(
|
|
2513
|
-
({
|
|
2514
|
-
state: state2 = "login",
|
|
2515
|
-
brand,
|
|
2516
|
-
eyebrow,
|
|
2517
|
-
title,
|
|
2518
|
-
description,
|
|
2519
|
-
googleLabel = "Continue with Google",
|
|
2520
|
-
onGoogle,
|
|
2521
|
-
signingIn = false,
|
|
2522
|
-
signingInLabel = "Signing you in\u2026",
|
|
2523
|
-
restriction,
|
|
2524
|
-
forbidden,
|
|
2525
|
-
error,
|
|
2526
|
-
onRetry,
|
|
2527
|
-
retryLabel = "Try again",
|
|
2528
|
-
loadingLabel = "Loading\u2026",
|
|
2529
|
-
footer,
|
|
2530
|
-
className,
|
|
2531
|
-
...props
|
|
2532
|
-
}, ref) => {
|
|
2533
|
-
const shell = (children) => /* @__PURE__ */ jsx49(
|
|
2534
|
-
"div",
|
|
2535
|
-
{
|
|
2536
|
-
ref,
|
|
2537
|
-
className: cn(
|
|
2538
|
-
"relative flex min-h-screen w-full items-center justify-center overflow-hidden px-6 py-12 text-text-primary",
|
|
2539
|
-
className
|
|
2540
|
-
),
|
|
2541
|
-
style: { background: AUTH_GLOW_BG },
|
|
2542
|
-
...props,
|
|
2543
|
-
children
|
|
2544
|
-
}
|
|
2545
|
-
);
|
|
2546
|
-
const brandMark = /* @__PURE__ */ jsx49("div", { className: "text-[24px] font-bold leading-none tracking-[-0.02em] text-text-primary", children: brand });
|
|
2547
|
-
if (state2 === "loading") {
|
|
2548
|
-
return shell(
|
|
2549
|
-
/* @__PURE__ */ jsxs23("div", { className: "flex flex-col items-center gap-[16px] text-text-secondary", children: [
|
|
2550
|
-
brandMark,
|
|
2551
|
-
/* @__PURE__ */ jsx49(Spinner, { className: "size-[22px] text-text-tertiary opacity-90" }),
|
|
2552
|
-
/* @__PURE__ */ jsx49("span", { role: "status", className: "text-[13.5px] tracking-[-0.005em]", children: loadingLabel })
|
|
2553
|
-
] })
|
|
2554
|
-
);
|
|
2555
|
-
}
|
|
2556
|
-
const heading = title ?? DEFAULT_TITLE[state2];
|
|
2557
|
-
const sub = description ?? DEFAULT_DESCRIPTION[state2];
|
|
2558
|
-
return shell(
|
|
2559
|
-
/* @__PURE__ */ jsxs23(
|
|
2560
|
-
"div",
|
|
2561
|
-
{
|
|
2562
|
-
className: "relative w-full max-w-[360px] rounded-2xl bg-bg-surface px-[34px] pb-[30px] pt-[38px] text-center",
|
|
2563
|
-
style: {
|
|
2564
|
-
border: "1px solid var(--auth-card-border)",
|
|
2565
|
-
boxShadow: "var(--auth-card-shadow)"
|
|
2566
|
-
},
|
|
2567
|
-
children: [
|
|
2568
|
-
/* @__PURE__ */ jsx49("div", { className: "mb-[22px]", children: brandMark }),
|
|
2569
|
-
eyebrow && state2 === "login" && /* @__PURE__ */ jsx49("p", { className: "mb-[12px] text-[13px] font-medium text-text-tertiary", children: eyebrow }),
|
|
2570
|
-
/* @__PURE__ */ jsx49("h1", { className: "mb-[8px] text-[20px] font-semibold leading-[1.25] tracking-[-0.015em] text-text-primary", children: heading }),
|
|
2571
|
-
sub && /* @__PURE__ */ jsx49("p", { className: "mx-auto mb-[24px] max-w-[280px] text-[13.5px] leading-[1.5] text-text-secondary", children: sub }),
|
|
2572
|
-
state2 === "login" && /* @__PURE__ */ jsx49(
|
|
2573
|
-
"button",
|
|
2574
|
-
{
|
|
2575
|
-
type: "button",
|
|
2576
|
-
onClick: onGoogle,
|
|
2577
|
-
disabled: signingIn,
|
|
2578
|
-
"aria-busy": signingIn || void 0,
|
|
2579
|
-
className: AUTH_FILLED_BUTTON,
|
|
2580
|
-
style: { boxShadow: AUTH_BUTTON_SHADOW },
|
|
2581
|
-
children: signingIn ? /* @__PURE__ */ jsxs23(Fragment, { children: [
|
|
2582
|
-
/* @__PURE__ */ jsx49(Spinner, { className: "size-[17px] opacity-50" }),
|
|
2583
|
-
/* @__PURE__ */ jsx49("span", { children: signingInLabel })
|
|
2584
|
-
] }) : /* @__PURE__ */ jsxs23(Fragment, { children: [
|
|
2585
|
-
/* @__PURE__ */ jsx49(GoogleGlyph, {}),
|
|
2586
|
-
/* @__PURE__ */ jsx49("span", { children: googleLabel })
|
|
2587
|
-
] })
|
|
2588
|
-
}
|
|
2589
|
-
),
|
|
2590
|
-
state2 === "forbidden" && forbidden && /* @__PURE__ */ jsxs23("div", { role: "status", className: cn(calloutBase, "border-border-warning bg-bg-warning-subtle"), children: [
|
|
2591
|
-
/* @__PURE__ */ jsx49(WarningIcon, { className: "mt-px flex-none text-border-warning" }),
|
|
2592
|
-
/* @__PURE__ */ jsx49("span", { children: forbidden })
|
|
2593
|
-
] }),
|
|
2594
|
-
state2 === "error" && /* @__PURE__ */ jsxs23(Fragment, { children: [
|
|
2595
|
-
/* @__PURE__ */ jsxs23("div", { role: "alert", className: cn(calloutBase, "border-border-danger bg-bg-danger-subtle"), children: [
|
|
2596
|
-
/* @__PURE__ */ jsx49(ErrorIcon, { className: "mt-px flex-none text-border-danger" }),
|
|
2597
|
-
/* @__PURE__ */ jsx49("span", { children: error ?? "The identity provider didn\u2019t respond. Retry in a moment." })
|
|
2598
|
-
] }),
|
|
2599
|
-
onRetry && /* @__PURE__ */ jsxs23(
|
|
2600
|
-
"button",
|
|
2601
|
-
{
|
|
2602
|
-
type: "button",
|
|
2603
|
-
onClick: onRetry,
|
|
2604
|
-
className: AUTH_FILLED_BUTTON,
|
|
2605
|
-
style: { boxShadow: AUTH_BUTTON_SHADOW },
|
|
2606
|
-
children: [
|
|
2607
|
-
/* @__PURE__ */ jsx49(RetryIcon, {}),
|
|
2608
|
-
/* @__PURE__ */ jsx49("span", { children: retryLabel })
|
|
2609
|
-
]
|
|
2610
|
-
}
|
|
2611
|
-
)
|
|
2612
|
-
] }),
|
|
2613
|
-
restriction && (state2 === "login" || state2 === "forbidden") && /* @__PURE__ */ jsx49(LockNote, { children: restriction }),
|
|
2614
|
-
footer != null && /* @__PURE__ */ jsx49("div", { className: "mt-[24px] text-[11px] tracking-[0.005em] text-text-tertiary", children: footer })
|
|
2615
|
-
]
|
|
2616
|
-
}
|
|
2617
|
-
)
|
|
2618
|
-
);
|
|
2619
|
-
}
|
|
2620
|
-
);
|
|
2621
|
-
SignInScreen.displayName = "SignInScreen";
|
|
2622
|
-
|
|
2623
2447
|
// src/components/copy-button.tsx
|
|
2624
|
-
import * as
|
|
2448
|
+
import * as React43 from "react";
|
|
2625
2449
|
import { Check as Check5, Copy } from "lucide-react";
|
|
2626
|
-
import { jsx as
|
|
2627
|
-
var CopyButton =
|
|
2450
|
+
import { jsx as jsx49 } from "react/jsx-runtime";
|
|
2451
|
+
var CopyButton = React43.forwardRef(
|
|
2628
2452
|
({ value, label = "Copy", className, variant = "ghost", size = "icon", onClick, ...props }, ref) => {
|
|
2629
|
-
const [copied, setCopied] =
|
|
2630
|
-
const timer =
|
|
2631
|
-
|
|
2453
|
+
const [copied, setCopied] = React43.useState(false);
|
|
2454
|
+
const timer = React43.useRef(void 0);
|
|
2455
|
+
React43.useEffect(() => () => clearTimeout(timer.current), []);
|
|
2632
2456
|
const handleClick = async (e) => {
|
|
2633
2457
|
onClick?.(e);
|
|
2634
2458
|
if (!navigator.clipboard?.writeText) return;
|
|
@@ -2640,7 +2464,7 @@ var CopyButton = React44.forwardRef(
|
|
|
2640
2464
|
} catch {
|
|
2641
2465
|
}
|
|
2642
2466
|
};
|
|
2643
|
-
return /* @__PURE__ */
|
|
2467
|
+
return /* @__PURE__ */ jsx49(
|
|
2644
2468
|
Button,
|
|
2645
2469
|
{
|
|
2646
2470
|
ref,
|
|
@@ -2651,7 +2475,7 @@ var CopyButton = React44.forwardRef(
|
|
|
2651
2475
|
className: cn(className),
|
|
2652
2476
|
...props,
|
|
2653
2477
|
"aria-label": copied ? "Copied" : label,
|
|
2654
|
-
children: copied ? /* @__PURE__ */
|
|
2478
|
+
children: copied ? /* @__PURE__ */ jsx49(Check5, { className: "size-4 text-text-success" }) : /* @__PURE__ */ jsx49(Copy, { className: "size-4" })
|
|
2655
2479
|
}
|
|
2656
2480
|
);
|
|
2657
2481
|
}
|
|
@@ -2659,9 +2483,9 @@ var CopyButton = React44.forwardRef(
|
|
|
2659
2483
|
CopyButton.displayName = "CopyButton";
|
|
2660
2484
|
|
|
2661
2485
|
// src/components/stat-card.tsx
|
|
2662
|
-
import * as
|
|
2486
|
+
import * as React44 from "react";
|
|
2663
2487
|
import { ArrowDown, ArrowUp, Info as Info2, Minus as Minus2 } from "lucide-react";
|
|
2664
|
-
import { jsx as
|
|
2488
|
+
import { jsx as jsx50, jsxs as jsxs23 } from "react/jsx-runtime";
|
|
2665
2489
|
var directionIcons = {
|
|
2666
2490
|
up: ArrowUp,
|
|
2667
2491
|
down: ArrowDown,
|
|
@@ -2677,36 +2501,36 @@ var toneFromDirection = {
|
|
|
2677
2501
|
down: "negative",
|
|
2678
2502
|
neutral: "neutral"
|
|
2679
2503
|
};
|
|
2680
|
-
var StatCard =
|
|
2504
|
+
var StatCard = React44.forwardRef(
|
|
2681
2505
|
({ label, value, delta, hint, sub, icon: Icon, className, ...props }, ref) => {
|
|
2682
2506
|
const direction = delta?.direction ?? "neutral";
|
|
2683
2507
|
const tone = delta?.tone ?? toneFromDirection[direction];
|
|
2684
2508
|
const DeltaIcon = directionIcons[direction];
|
|
2685
2509
|
const deltaClass = toneClasses[tone];
|
|
2686
|
-
return /* @__PURE__ */
|
|
2510
|
+
return /* @__PURE__ */ jsxs23(
|
|
2687
2511
|
"div",
|
|
2688
2512
|
{
|
|
2689
2513
|
ref,
|
|
2690
2514
|
className: cn("rounded-xl border border-border-subtle bg-bg-surface p-5", className),
|
|
2691
2515
|
...props,
|
|
2692
2516
|
children: [
|
|
2693
|
-
/* @__PURE__ */
|
|
2694
|
-
/* @__PURE__ */
|
|
2695
|
-
/* @__PURE__ */
|
|
2696
|
-
hint && /* @__PURE__ */
|
|
2697
|
-
/* @__PURE__ */
|
|
2698
|
-
/* @__PURE__ */
|
|
2517
|
+
/* @__PURE__ */ jsxs23("div", { className: "flex items-center justify-between gap-2", children: [
|
|
2518
|
+
/* @__PURE__ */ jsxs23("div", { className: "flex items-center gap-1.5", children: [
|
|
2519
|
+
/* @__PURE__ */ jsx50("span", { className: "text-xs font-medium uppercase tracking-wide text-text-tertiary", children: label }),
|
|
2520
|
+
hint && /* @__PURE__ */ jsx50(TooltipProvider, { children: /* @__PURE__ */ jsxs23(Tooltip, { children: [
|
|
2521
|
+
/* @__PURE__ */ jsx50(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx50("button", { type: "button", "aria-label": "More info", className: "inline-flex cursor-help text-icon-secondary focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-border-focus rounded-sm", children: /* @__PURE__ */ jsx50(Info2, { className: "size-3.5", "aria-hidden": "true" }) }) }),
|
|
2522
|
+
/* @__PURE__ */ jsx50(TooltipContent, { children: hint })
|
|
2699
2523
|
] }) })
|
|
2700
2524
|
] }),
|
|
2701
|
-
Icon && /* @__PURE__ */
|
|
2525
|
+
Icon && /* @__PURE__ */ jsx50(Icon, { className: "size-4 text-icon-secondary", "aria-hidden": "true" })
|
|
2702
2526
|
] }),
|
|
2703
|
-
/* @__PURE__ */
|
|
2704
|
-
(delta || sub) && /* @__PURE__ */
|
|
2705
|
-
delta && /* @__PURE__ */
|
|
2706
|
-
/* @__PURE__ */
|
|
2527
|
+
/* @__PURE__ */ jsx50("div", { className: "mt-2 text-3xl font-semibold text-text-primary", children: value }),
|
|
2528
|
+
(delta || sub) && /* @__PURE__ */ jsxs23("div", { className: "mt-2 flex items-center gap-2 text-sm", children: [
|
|
2529
|
+
delta && /* @__PURE__ */ jsxs23("span", { className: cn("inline-flex items-center gap-0.5 font-medium", deltaClass), children: [
|
|
2530
|
+
/* @__PURE__ */ jsx50(DeltaIcon, { className: "size-3.5", "aria-hidden": "true" }),
|
|
2707
2531
|
delta.value
|
|
2708
2532
|
] }),
|
|
2709
|
-
sub && /* @__PURE__ */
|
|
2533
|
+
sub && /* @__PURE__ */ jsx50("span", { className: "text-text-tertiary", children: sub })
|
|
2710
2534
|
] })
|
|
2711
2535
|
]
|
|
2712
2536
|
}
|
|
@@ -2716,11 +2540,11 @@ var StatCard = React45.forwardRef(
|
|
|
2716
2540
|
StatCard.displayName = "StatCard";
|
|
2717
2541
|
|
|
2718
2542
|
// src/components/confirm-dialog.tsx
|
|
2719
|
-
import * as
|
|
2543
|
+
import * as React45 from "react";
|
|
2720
2544
|
import { Loader2 } from "lucide-react";
|
|
2721
|
-
import { jsx as
|
|
2722
|
-
var InlineError =
|
|
2723
|
-
({ children, className, ...props }, ref) => /* @__PURE__ */
|
|
2545
|
+
import { jsx as jsx51, jsxs as jsxs24 } from "react/jsx-runtime";
|
|
2546
|
+
var InlineError = React45.forwardRef(
|
|
2547
|
+
({ children, className, ...props }, ref) => /* @__PURE__ */ jsx51(
|
|
2724
2548
|
"div",
|
|
2725
2549
|
{
|
|
2726
2550
|
ref,
|
|
@@ -2746,12 +2570,12 @@ function ConfirmDialog({
|
|
|
2746
2570
|
destructive = false,
|
|
2747
2571
|
onConfirm
|
|
2748
2572
|
}) {
|
|
2749
|
-
const [internalOpen, setInternalOpen] =
|
|
2573
|
+
const [internalOpen, setInternalOpen] = React45.useState(false);
|
|
2750
2574
|
const isControlled = open !== void 0;
|
|
2751
2575
|
const actualOpen = isControlled ? open : internalOpen;
|
|
2752
|
-
const [busy, setBusy] =
|
|
2753
|
-
const [error, setError] =
|
|
2754
|
-
|
|
2576
|
+
const [busy, setBusy] = React45.useState(false);
|
|
2577
|
+
const [error, setError] = React45.useState(null);
|
|
2578
|
+
React45.useEffect(() => {
|
|
2755
2579
|
if (!actualOpen) setError(null);
|
|
2756
2580
|
}, [actualOpen]);
|
|
2757
2581
|
const setOpen = (next) => {
|
|
@@ -2771,20 +2595,20 @@ function ConfirmDialog({
|
|
|
2771
2595
|
setBusy(false);
|
|
2772
2596
|
}
|
|
2773
2597
|
};
|
|
2774
|
-
return /* @__PURE__ */
|
|
2598
|
+
return /* @__PURE__ */ jsxs24(Dialog, { open: actualOpen, onOpenChange: (next) => {
|
|
2775
2599
|
if (!busy) setOpen(next);
|
|
2776
2600
|
}, children: [
|
|
2777
|
-
trigger && /* @__PURE__ */
|
|
2778
|
-
/* @__PURE__ */
|
|
2779
|
-
/* @__PURE__ */
|
|
2780
|
-
/* @__PURE__ */
|
|
2781
|
-
description && /* @__PURE__ */
|
|
2601
|
+
trigger && /* @__PURE__ */ jsx51(DialogTrigger, { asChild: true, children: trigger }),
|
|
2602
|
+
/* @__PURE__ */ jsxs24(DialogContent, { children: [
|
|
2603
|
+
/* @__PURE__ */ jsxs24(DialogHeader, { children: [
|
|
2604
|
+
/* @__PURE__ */ jsx51(DialogTitle, { children: title }),
|
|
2605
|
+
description && /* @__PURE__ */ jsx51(DialogDescription, { children: description })
|
|
2782
2606
|
] }),
|
|
2783
|
-
error && /* @__PURE__ */
|
|
2784
|
-
/* @__PURE__ */
|
|
2785
|
-
/* @__PURE__ */
|
|
2786
|
-
/* @__PURE__ */
|
|
2787
|
-
busy && /* @__PURE__ */
|
|
2607
|
+
error && /* @__PURE__ */ jsx51(InlineError, { children: error }),
|
|
2608
|
+
/* @__PURE__ */ jsxs24(DialogFooter, { children: [
|
|
2609
|
+
/* @__PURE__ */ jsx51(Button, { variant: "outline", disabled: busy, onClick: () => setOpen(false), children: cancelLabel }),
|
|
2610
|
+
/* @__PURE__ */ jsxs24(Button, { variant: destructive ? "destructive" : "default", disabled: busy, onClick: handleConfirm, children: [
|
|
2611
|
+
busy && /* @__PURE__ */ jsx51(Loader2, { className: "size-4 animate-spin", "aria-hidden": "true" }),
|
|
2788
2612
|
confirmLabel
|
|
2789
2613
|
] })
|
|
2790
2614
|
] })
|
|
@@ -2794,7 +2618,7 @@ function ConfirmDialog({
|
|
|
2794
2618
|
|
|
2795
2619
|
// src/components/user-menu.tsx
|
|
2796
2620
|
import { ChevronsUpDown } from "lucide-react";
|
|
2797
|
-
import { Fragment
|
|
2621
|
+
import { Fragment, jsx as jsx52, jsxs as jsxs25 } from "react/jsx-runtime";
|
|
2798
2622
|
function initialsOf(name) {
|
|
2799
2623
|
const parts = name.trim().split(/\s+/).filter(Boolean);
|
|
2800
2624
|
if (parts.length === 0) return "?";
|
|
@@ -2803,11 +2627,11 @@ function initialsOf(name) {
|
|
|
2803
2627
|
}
|
|
2804
2628
|
function UserMenu({ user, items, collapsed = false, align = "start" }) {
|
|
2805
2629
|
const secondLine = user.subtitle ?? user.email;
|
|
2806
|
-
const avatar = /* @__PURE__ */
|
|
2807
|
-
user.avatarUrl && /* @__PURE__ */
|
|
2808
|
-
/* @__PURE__ */
|
|
2630
|
+
const avatar = /* @__PURE__ */ jsxs25(Avatar, { className: collapsed ? "size-9" : "size-7", children: [
|
|
2631
|
+
user.avatarUrl && /* @__PURE__ */ jsx52(AvatarImage, { src: user.avatarUrl, alt: user.name }),
|
|
2632
|
+
/* @__PURE__ */ jsx52(AvatarFallback, { className: "text-xs", children: initialsOf(user.name) })
|
|
2809
2633
|
] });
|
|
2810
|
-
const trigger = collapsed ? /* @__PURE__ */
|
|
2634
|
+
const trigger = collapsed ? /* @__PURE__ */ jsx52(
|
|
2811
2635
|
"button",
|
|
2812
2636
|
{
|
|
2813
2637
|
type: "button",
|
|
@@ -2815,46 +2639,46 @@ function UserMenu({ user, items, collapsed = false, align = "start" }) {
|
|
|
2815
2639
|
className: "rounded-full focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-border-focus",
|
|
2816
2640
|
children: avatar
|
|
2817
2641
|
}
|
|
2818
|
-
) : /* @__PURE__ */
|
|
2642
|
+
) : /* @__PURE__ */ jsxs25(
|
|
2819
2643
|
"button",
|
|
2820
2644
|
{
|
|
2821
2645
|
type: "button",
|
|
2822
2646
|
className: "flex w-full items-center gap-2.5 rounded-xl px-1.5 py-[5px] text-left transition-colors hover:bg-[var(--hov-bg)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-border-focus",
|
|
2823
2647
|
children: [
|
|
2824
2648
|
avatar,
|
|
2825
|
-
/* @__PURE__ */
|
|
2826
|
-
/* @__PURE__ */
|
|
2827
|
-
secondLine && /* @__PURE__ */
|
|
2649
|
+
/* @__PURE__ */ jsxs25("span", { className: "flex min-w-0 flex-1 flex-col gap-0.5", children: [
|
|
2650
|
+
/* @__PURE__ */ jsx52("span", { className: "truncate text-sm leading-[normal] font-medium text-text-primary", children: user.name }),
|
|
2651
|
+
secondLine && /* @__PURE__ */ jsx52("span", { className: "truncate text-xs leading-[normal] text-text-tertiary", children: secondLine })
|
|
2828
2652
|
] }),
|
|
2829
|
-
/* @__PURE__ */
|
|
2653
|
+
/* @__PURE__ */ jsx52(ChevronsUpDown, { size: 14, "aria-hidden": "true", className: "shrink-0 text-text-tertiary" })
|
|
2830
2654
|
]
|
|
2831
2655
|
}
|
|
2832
2656
|
);
|
|
2833
|
-
const menuTrigger = /* @__PURE__ */
|
|
2834
|
-
const menu = /* @__PURE__ */
|
|
2835
|
-
collapsed ? /* @__PURE__ */
|
|
2836
|
-
/* @__PURE__ */
|
|
2837
|
-
/* @__PURE__ */
|
|
2657
|
+
const menuTrigger = /* @__PURE__ */ jsx52(DropdownMenuTrigger, { asChild: true, children: trigger });
|
|
2658
|
+
const menu = /* @__PURE__ */ jsxs25(DropdownMenu, { children: [
|
|
2659
|
+
collapsed ? /* @__PURE__ */ jsx52(TooltipProvider, { children: /* @__PURE__ */ jsxs25(Tooltip, { children: [
|
|
2660
|
+
/* @__PURE__ */ jsx52(TooltipTrigger, { asChild: true, children: menuTrigger }),
|
|
2661
|
+
/* @__PURE__ */ jsx52(TooltipContent, { side: "right", children: user.name })
|
|
2838
2662
|
] }) }) : menuTrigger,
|
|
2839
|
-
/* @__PURE__ */
|
|
2663
|
+
/* @__PURE__ */ jsxs25(
|
|
2840
2664
|
DropdownMenuContent,
|
|
2841
2665
|
{
|
|
2842
2666
|
align,
|
|
2843
2667
|
sideOffset: 6,
|
|
2844
2668
|
className: "flex w-56 flex-col gap-px rounded-xl border-border-subtle bg-[var(--menu-bg)] p-1 shadow-(--menu-shadow)",
|
|
2845
2669
|
children: [
|
|
2846
|
-
/* @__PURE__ */
|
|
2847
|
-
/* @__PURE__ */
|
|
2848
|
-
secondLine && /* @__PURE__ */
|
|
2670
|
+
/* @__PURE__ */ jsxs25(DropdownMenuLabel, { className: "px-2 pt-1.5 pb-1 text-xs font-medium text-text-tertiary", children: [
|
|
2671
|
+
/* @__PURE__ */ jsx52("span", { className: "block truncate text-sm font-medium text-text-primary", children: user.name }),
|
|
2672
|
+
secondLine && /* @__PURE__ */ jsx52("span", { className: "block truncate text-xs font-normal text-text-tertiary", children: secondLine })
|
|
2849
2673
|
] }),
|
|
2850
|
-
/* @__PURE__ */
|
|
2674
|
+
/* @__PURE__ */ jsx52(DropdownMenuSeparator, { className: "mx-0 shrink-0 bg-border-subtle" }),
|
|
2851
2675
|
items.map((item, i) => {
|
|
2852
2676
|
const Icon = item.icon;
|
|
2853
|
-
const content = /* @__PURE__ */
|
|
2854
|
-
Icon && /* @__PURE__ */
|
|
2677
|
+
const content = /* @__PURE__ */ jsxs25(Fragment, { children: [
|
|
2678
|
+
Icon && /* @__PURE__ */ jsx52(Icon, { className: "size-4", "aria-hidden": "true" }),
|
|
2855
2679
|
item.label
|
|
2856
2680
|
] });
|
|
2857
|
-
return /* @__PURE__ */
|
|
2681
|
+
return /* @__PURE__ */ jsx52(
|
|
2858
2682
|
DropdownMenuItem,
|
|
2859
2683
|
{
|
|
2860
2684
|
onSelect: item.onSelect,
|
|
@@ -2863,7 +2687,7 @@ function UserMenu({ user, items, collapsed = false, align = "start" }) {
|
|
|
2863
2687
|
item.destructive && "text-text-danger focus:text-text-danger"
|
|
2864
2688
|
),
|
|
2865
2689
|
asChild: Boolean(item.href),
|
|
2866
|
-
children: item.href ? /* @__PURE__ */
|
|
2690
|
+
children: item.href ? /* @__PURE__ */ jsx52("a", { href: item.href, children: content }) : content
|
|
2867
2691
|
},
|
|
2868
2692
|
`${item.label}-${i}`
|
|
2869
2693
|
);
|
|
@@ -2877,20 +2701,20 @@ function UserMenu({ user, items, collapsed = false, align = "start" }) {
|
|
|
2877
2701
|
|
|
2878
2702
|
// src/components/extension-link.tsx
|
|
2879
2703
|
import { Link as Link2 } from "react-router";
|
|
2880
|
-
import { jsx as
|
|
2704
|
+
import { jsx as jsx53 } from "react/jsx-runtime";
|
|
2881
2705
|
function ExtensionLink({ uiMode, to, className, children, ...anchorProps }) {
|
|
2882
2706
|
if (uiMode === "federation") {
|
|
2883
|
-
return /* @__PURE__ */
|
|
2707
|
+
return /* @__PURE__ */ jsx53(Link2, { to, className, ...anchorProps, children });
|
|
2884
2708
|
}
|
|
2885
|
-
return /* @__PURE__ */
|
|
2709
|
+
return /* @__PURE__ */ jsx53("a", { href: to, className, ...anchorProps, children });
|
|
2886
2710
|
}
|
|
2887
2711
|
ExtensionLink.displayName = "ExtensionLink";
|
|
2888
2712
|
|
|
2889
2713
|
// src/components/extension-icon.tsx
|
|
2890
|
-
import * as
|
|
2714
|
+
import * as React46 from "react";
|
|
2891
2715
|
import * as LucideIcons from "lucide-react";
|
|
2892
2716
|
import { Puzzle } from "lucide-react";
|
|
2893
|
-
import { jsx as
|
|
2717
|
+
import { jsx as jsx54 } from "react/jsx-runtime";
|
|
2894
2718
|
var FORWARD_REF = /* @__PURE__ */ Symbol.for("react.forward_ref");
|
|
2895
2719
|
var catalog = LucideIcons;
|
|
2896
2720
|
function toPascalCase(name) {
|
|
@@ -2915,14 +2739,14 @@ function warnUnknownIconOnce(name) {
|
|
|
2915
2739
|
warnedUnknownIcons.add(name);
|
|
2916
2740
|
console.warn(`[@lessly/ui] ExtensionIcon: unknown icon "${name}" \u2014 falling back to Puzzle.`);
|
|
2917
2741
|
}
|
|
2918
|
-
var ExtensionIcon =
|
|
2742
|
+
var ExtensionIcon = React46.forwardRef(
|
|
2919
2743
|
({ name, ...props }, ref) => {
|
|
2920
2744
|
const Icon = resolveIcon(name);
|
|
2921
2745
|
if (!Icon) {
|
|
2922
2746
|
warnUnknownIconOnce(name);
|
|
2923
|
-
return /* @__PURE__ */
|
|
2747
|
+
return /* @__PURE__ */ jsx54(Puzzle, { ref, ...props });
|
|
2924
2748
|
}
|
|
2925
|
-
return /* @__PURE__ */
|
|
2749
|
+
return /* @__PURE__ */ jsx54(Icon, { ref, ...props });
|
|
2926
2750
|
}
|
|
2927
2751
|
);
|
|
2928
2752
|
ExtensionIcon.displayName = "ExtensionIcon";
|
|
@@ -2969,9 +2793,9 @@ function useSidebar(options = {}) {
|
|
|
2969
2793
|
}
|
|
2970
2794
|
|
|
2971
2795
|
// src/components/nav-row.tsx
|
|
2972
|
-
import * as
|
|
2796
|
+
import * as React47 from "react";
|
|
2973
2797
|
import { Slot as Slot4 } from "@radix-ui/react-slot";
|
|
2974
|
-
import { Fragment as
|
|
2798
|
+
import { Fragment as Fragment2, jsx as jsx55, jsxs as jsxs26 } from "react/jsx-runtime";
|
|
2975
2799
|
var base = "flex w-full items-center text-left text-sm transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-border-focus";
|
|
2976
2800
|
var shape = {
|
|
2977
2801
|
rail: "gap-[14px] rounded-xl px-2.5 py-2",
|
|
@@ -2987,9 +2811,9 @@ var state = {
|
|
|
2987
2811
|
active: "font-semibold text-text-brand hover:bg-[var(--menu-hov)]"
|
|
2988
2812
|
}
|
|
2989
2813
|
};
|
|
2990
|
-
var NavRow =
|
|
2991
|
-
const content = /* @__PURE__ */
|
|
2992
|
-
icon && /* @__PURE__ */
|
|
2814
|
+
var NavRow = React47.forwardRef(function NavRow2({ icon, label, active = false, variant, trailing, hideLabel = false, asChild = false, className, children, ...props }, ref) {
|
|
2815
|
+
const content = /* @__PURE__ */ jsxs26(Fragment2, { children: [
|
|
2816
|
+
icon && /* @__PURE__ */ jsx55(
|
|
2993
2817
|
"span",
|
|
2994
2818
|
{
|
|
2995
2819
|
className: "flex size-5 shrink-0 items-center justify-center [&_svg]:size-[18px]",
|
|
@@ -2997,24 +2821,24 @@ var NavRow = React48.forwardRef(function NavRow2({ icon, label, active = false,
|
|
|
2997
2821
|
children: icon
|
|
2998
2822
|
}
|
|
2999
2823
|
),
|
|
3000
|
-
!hideLabel && /* @__PURE__ */
|
|
3001
|
-
trailing && /* @__PURE__ */
|
|
2824
|
+
!hideLabel && /* @__PURE__ */ jsx55("span", { className: "min-w-0 flex-1 truncate", children: label }),
|
|
2825
|
+
trailing && /* @__PURE__ */ jsx55("span", { className: "flex shrink-0 items-center", children: trailing })
|
|
3002
2826
|
] });
|
|
3003
2827
|
const classes = cn(base, shape[variant], state[variant][active ? "active" : "idle"], className);
|
|
3004
2828
|
if (asChild) {
|
|
3005
|
-
const child =
|
|
3006
|
-
return /* @__PURE__ */
|
|
2829
|
+
const child = React47.Children.only(children);
|
|
2830
|
+
return /* @__PURE__ */ jsx55(Slot4, { ref, className: classes, "aria-label": hideLabel ? label : void 0, ...props, children: React47.cloneElement(child, void 0, content) });
|
|
3007
2831
|
}
|
|
3008
|
-
return /* @__PURE__ */
|
|
2832
|
+
return /* @__PURE__ */ jsx55("button", { ref, type: "button", className: classes, "aria-label": hideLabel ? label : void 0, ...props, children: content });
|
|
3009
2833
|
});
|
|
3010
2834
|
NavRow.displayName = "NavRow";
|
|
3011
2835
|
|
|
3012
2836
|
// src/components/nav-section-label.tsx
|
|
3013
|
-
import * as
|
|
3014
|
-
import { jsx as
|
|
3015
|
-
var NavSectionLabel =
|
|
2837
|
+
import * as React48 from "react";
|
|
2838
|
+
import { jsx as jsx56 } from "react/jsx-runtime";
|
|
2839
|
+
var NavSectionLabel = React48.forwardRef(
|
|
3016
2840
|
function NavSectionLabel2({ className, ...props }, ref) {
|
|
3017
|
-
return /* @__PURE__ */
|
|
2841
|
+
return /* @__PURE__ */ jsx56(
|
|
3018
2842
|
"div",
|
|
3019
2843
|
{
|
|
3020
2844
|
ref,
|
|
@@ -3027,8 +2851,8 @@ var NavSectionLabel = React49.forwardRef(
|
|
|
3027
2851
|
NavSectionLabel.displayName = "NavSectionLabel";
|
|
3028
2852
|
|
|
3029
2853
|
// src/components/menu-popup.tsx
|
|
3030
|
-
import * as
|
|
3031
|
-
import { jsx as
|
|
2854
|
+
import * as React49 from "react";
|
|
2855
|
+
import { jsx as jsx57, jsxs as jsxs27 } from "react/jsx-runtime";
|
|
3032
2856
|
function MenuPopup({
|
|
3033
2857
|
trigger,
|
|
3034
2858
|
children,
|
|
@@ -3040,9 +2864,9 @@ function MenuPopup({
|
|
|
3040
2864
|
sideOffset = 6,
|
|
3041
2865
|
className
|
|
3042
2866
|
}) {
|
|
3043
|
-
return /* @__PURE__ */
|
|
3044
|
-
/* @__PURE__ */
|
|
3045
|
-
/* @__PURE__ */
|
|
2867
|
+
return /* @__PURE__ */ jsxs27(Popover, { open, defaultOpen, onOpenChange, children: [
|
|
2868
|
+
/* @__PURE__ */ jsx57(PopoverTrigger, { asChild: true, children: trigger }),
|
|
2869
|
+
/* @__PURE__ */ jsx57(
|
|
3046
2870
|
PopoverContent,
|
|
3047
2871
|
{
|
|
3048
2872
|
side: direction === "up" ? "top" : "bottom",
|
|
@@ -3057,9 +2881,9 @@ function MenuPopup({
|
|
|
3057
2881
|
)
|
|
3058
2882
|
] });
|
|
3059
2883
|
}
|
|
3060
|
-
var MenuDivider =
|
|
2884
|
+
var MenuDivider = React49.forwardRef(
|
|
3061
2885
|
function MenuDivider2({ className, ...props }, ref) {
|
|
3062
|
-
return /* @__PURE__ */
|
|
2886
|
+
return /* @__PURE__ */ jsx57(
|
|
3063
2887
|
"div",
|
|
3064
2888
|
{
|
|
3065
2889
|
ref,
|
|
@@ -3074,7 +2898,7 @@ MenuDivider.displayName = "MenuDivider";
|
|
|
3074
2898
|
|
|
3075
2899
|
// src/components/sidebar-nav.tsx
|
|
3076
2900
|
import { Link as Link3, useLocation } from "react-router";
|
|
3077
|
-
import { jsx as
|
|
2901
|
+
import { jsx as jsx58, jsxs as jsxs28 } from "react/jsx-runtime";
|
|
3078
2902
|
function isActivePath(pathname, full, exact) {
|
|
3079
2903
|
if (exact) return pathname === full;
|
|
3080
2904
|
return pathname === full || pathname.startsWith(`${full}/`);
|
|
@@ -3090,23 +2914,23 @@ function SidebarNavLink({
|
|
|
3090
2914
|
const Comp = LinkComponent ?? Link3;
|
|
3091
2915
|
const to = `${basePath}${item.href}`;
|
|
3092
2916
|
const Icon = item.icon;
|
|
3093
|
-
const link = /* @__PURE__ */
|
|
2917
|
+
const link = /* @__PURE__ */ jsx58(
|
|
3094
2918
|
NavRow,
|
|
3095
2919
|
{
|
|
3096
2920
|
variant: "rail",
|
|
3097
2921
|
active,
|
|
3098
2922
|
label: item.label,
|
|
3099
2923
|
hideLabel: collapsed,
|
|
3100
|
-
icon: Icon ? /* @__PURE__ */
|
|
2924
|
+
icon: Icon ? /* @__PURE__ */ jsx58(Icon, { "aria-hidden": "true" }) : void 0,
|
|
3101
2925
|
className: cn(collapsed && "size-9 justify-center px-0 py-0", className),
|
|
3102
2926
|
asChild: true,
|
|
3103
|
-
children: /* @__PURE__ */
|
|
2927
|
+
children: /* @__PURE__ */ jsx58(Comp, { to, "aria-current": active ? "page" : void 0 })
|
|
3104
2928
|
}
|
|
3105
2929
|
);
|
|
3106
2930
|
if (!collapsed) return link;
|
|
3107
|
-
return /* @__PURE__ */
|
|
3108
|
-
/* @__PURE__ */
|
|
3109
|
-
/* @__PURE__ */
|
|
2931
|
+
return /* @__PURE__ */ jsxs28(Tooltip, { children: [
|
|
2932
|
+
/* @__PURE__ */ jsx58(TooltipTrigger, { asChild: true, children: link }),
|
|
2933
|
+
/* @__PURE__ */ jsx58(TooltipContent, { side: "right", children: item.label })
|
|
3110
2934
|
] });
|
|
3111
2935
|
}
|
|
3112
2936
|
function SidebarNav({
|
|
@@ -3118,7 +2942,7 @@ function SidebarNav({
|
|
|
3118
2942
|
className
|
|
3119
2943
|
}) {
|
|
3120
2944
|
const { pathname } = useLocation();
|
|
3121
|
-
const nav = /* @__PURE__ */
|
|
2945
|
+
const nav = /* @__PURE__ */ jsx58(
|
|
3122
2946
|
"nav",
|
|
3123
2947
|
{
|
|
3124
2948
|
className: cn(
|
|
@@ -3129,7 +2953,7 @@ function SidebarNav({
|
|
|
3129
2953
|
children: items.map((item) => {
|
|
3130
2954
|
const full = `${basePath}${item.href}`;
|
|
3131
2955
|
const active = isItemActive ? isItemActive(item, pathname) : isActivePath(pathname, full, item.exact);
|
|
3132
|
-
return /* @__PURE__ */
|
|
2956
|
+
return /* @__PURE__ */ jsx58(
|
|
3133
2957
|
SidebarNavLink,
|
|
3134
2958
|
{
|
|
3135
2959
|
item,
|
|
@@ -3143,14 +2967,14 @@ function SidebarNav({
|
|
|
3143
2967
|
})
|
|
3144
2968
|
}
|
|
3145
2969
|
);
|
|
3146
|
-
return collapsed ? /* @__PURE__ */
|
|
2970
|
+
return collapsed ? /* @__PURE__ */ jsx58(TooltipProvider, { children: nav }) : nav;
|
|
3147
2971
|
}
|
|
3148
2972
|
|
|
3149
2973
|
// src/components/app-sidebar.tsx
|
|
3150
2974
|
import { PanelLeft } from "lucide-react";
|
|
3151
|
-
import { Fragment as
|
|
2975
|
+
import { Fragment as Fragment3, jsx as jsx59, jsxs as jsxs29 } from "react/jsx-runtime";
|
|
3152
2976
|
function Divider({ collapsed, testId, className }) {
|
|
3153
|
-
return /* @__PURE__ */
|
|
2977
|
+
return /* @__PURE__ */ jsx59(
|
|
3154
2978
|
"div",
|
|
3155
2979
|
{
|
|
3156
2980
|
"data-testid": testId,
|
|
@@ -3182,7 +3006,7 @@ function AppSidebar({
|
|
|
3182
3006
|
defaultCollapsed,
|
|
3183
3007
|
onCollapsedChange
|
|
3184
3008
|
});
|
|
3185
|
-
const pin = collapsible ? /* @__PURE__ */
|
|
3009
|
+
const pin = collapsible ? /* @__PURE__ */ jsx59(
|
|
3186
3010
|
"button",
|
|
3187
3011
|
{
|
|
3188
3012
|
type: "button",
|
|
@@ -3190,10 +3014,10 @@ function AppSidebar({
|
|
|
3190
3014
|
"aria-label": collapsed ? "Expand sidebar" : "Collapse sidebar",
|
|
3191
3015
|
"aria-expanded": !collapsed,
|
|
3192
3016
|
className: "flex size-6 shrink-0 items-center justify-center rounded-md text-text-secondary transition-colors hover:bg-[var(--hov-bg)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-border-focus",
|
|
3193
|
-
children: /* @__PURE__ */
|
|
3017
|
+
children: /* @__PURE__ */ jsx59(PanelLeft, { className: "size-4", "aria-hidden": "true" })
|
|
3194
3018
|
}
|
|
3195
3019
|
) : null;
|
|
3196
|
-
return /* @__PURE__ */
|
|
3020
|
+
return /* @__PURE__ */ jsxs29(
|
|
3197
3021
|
"aside",
|
|
3198
3022
|
{
|
|
3199
3023
|
"data-collapsed": collapsed,
|
|
@@ -3203,12 +3027,12 @@ function AppSidebar({
|
|
|
3203
3027
|
className
|
|
3204
3028
|
),
|
|
3205
3029
|
children: [
|
|
3206
|
-
/* @__PURE__ */
|
|
3030
|
+
/* @__PURE__ */ jsx59("div", { className: cn("flex items-center gap-2", collapsed ? "justify-center px-1 pt-2" : "px-3 pt-[13px]"), children: collapsed ? collapsible ? logoCollapsed ?? logo ? (
|
|
3207
3031
|
/* The collapsed rail (52px) can't fit the logo mark beside the pin side by side —
|
|
3208
3032
|
so the pin overlays the mark instead, revealed on hover/focus, same as pre-flat-rail. */
|
|
3209
|
-
/* @__PURE__ */
|
|
3210
|
-
/* @__PURE__ */
|
|
3211
|
-
/* @__PURE__ */
|
|
3033
|
+
/* @__PURE__ */ jsxs29("div", { className: "group relative flex size-8 items-center justify-center", children: [
|
|
3034
|
+
/* @__PURE__ */ jsx59("span", { className: "pointer-events-none transition-opacity group-hover:opacity-0 group-focus-within:opacity-0", children: logoCollapsed ?? logo }),
|
|
3035
|
+
/* @__PURE__ */ jsx59(
|
|
3212
3036
|
"button",
|
|
3213
3037
|
{
|
|
3214
3038
|
type: "button",
|
|
@@ -3216,7 +3040,7 @@ function AppSidebar({
|
|
|
3216
3040
|
"aria-label": "Expand sidebar",
|
|
3217
3041
|
"aria-expanded": false,
|
|
3218
3042
|
className: "absolute inset-0 flex items-center justify-center rounded-md text-text-secondary opacity-0 transition-opacity hover:bg-[var(--hov-bg)] focus-visible:outline-none focus-visible:opacity-100 focus-visible:ring-2 focus-visible:ring-border-focus group-hover:opacity-100 group-focus-within:opacity-100",
|
|
3219
|
-
children: /* @__PURE__ */
|
|
3043
|
+
children: /* @__PURE__ */ jsx59(PanelLeft, { className: "size-4", "aria-hidden": "true" })
|
|
3220
3044
|
}
|
|
3221
3045
|
)
|
|
3222
3046
|
] })
|
|
@@ -3225,7 +3049,7 @@ function AppSidebar({
|
|
|
3225
3049
|
count, it's expanded-only). Hover-revealing the pin over nothing would leave
|
|
3226
3050
|
an invisible 32px box as the only way back to expanded, so render it plain
|
|
3227
3051
|
and fully visible instead. */
|
|
3228
|
-
/* @__PURE__ */
|
|
3052
|
+
/* @__PURE__ */ jsx59(
|
|
3229
3053
|
"button",
|
|
3230
3054
|
{
|
|
3231
3055
|
type: "button",
|
|
@@ -3233,15 +3057,15 @@ function AppSidebar({
|
|
|
3233
3057
|
"aria-label": "Expand sidebar",
|
|
3234
3058
|
"aria-expanded": false,
|
|
3235
3059
|
className: "flex size-8 shrink-0 items-center justify-center rounded-md text-text-secondary transition-colors hover:bg-[var(--hov-bg)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-border-focus",
|
|
3236
|
-
children: /* @__PURE__ */
|
|
3060
|
+
children: /* @__PURE__ */ jsx59(PanelLeft, { className: "size-4", "aria-hidden": "true" })
|
|
3237
3061
|
}
|
|
3238
3062
|
)
|
|
3239
|
-
) : logoCollapsed ?? logo : /* @__PURE__ */
|
|
3063
|
+
) : logoCollapsed ?? logo : /* @__PURE__ */ jsxs29(Fragment3, { children: [
|
|
3240
3064
|
header ?? logo,
|
|
3241
3065
|
pin
|
|
3242
3066
|
] }) }),
|
|
3243
|
-
/* @__PURE__ */
|
|
3244
|
-
/* @__PURE__ */
|
|
3067
|
+
/* @__PURE__ */ jsx59(Divider, { collapsed, testId: "sidebar-divider-header", className: "mt-3" }),
|
|
3068
|
+
/* @__PURE__ */ jsx59(
|
|
3245
3069
|
"div",
|
|
3246
3070
|
{
|
|
3247
3071
|
"data-testid": "sidebar-scroll",
|
|
@@ -3249,12 +3073,12 @@ function AppSidebar({
|
|
|
3249
3073
|
"min-h-0 flex-1 overflow-y-auto overflow-x-hidden pt-3 pb-2",
|
|
3250
3074
|
collapsed ? "px-1" : "px-3"
|
|
3251
3075
|
),
|
|
3252
|
-
children: /* @__PURE__ */
|
|
3076
|
+
children: /* @__PURE__ */ jsx59(SidebarNav, { items, collapsed, basePath, LinkComponent, isItemActive })
|
|
3253
3077
|
}
|
|
3254
3078
|
),
|
|
3255
|
-
footer && /* @__PURE__ */
|
|
3256
|
-
/* @__PURE__ */
|
|
3257
|
-
/* @__PURE__ */
|
|
3079
|
+
footer && /* @__PURE__ */ jsxs29(Fragment3, { children: [
|
|
3080
|
+
/* @__PURE__ */ jsx59(Divider, { collapsed, testId: "sidebar-divider-account" }),
|
|
3081
|
+
/* @__PURE__ */ jsx59("div", { className: cn("py-2", collapsed ? "px-1" : "px-3"), children: footer })
|
|
3258
3082
|
] })
|
|
3259
3083
|
]
|
|
3260
3084
|
}
|
|
@@ -3262,40 +3086,40 @@ function AppSidebar({
|
|
|
3262
3086
|
}
|
|
3263
3087
|
|
|
3264
3088
|
// src/components/sidebar-product-header.tsx
|
|
3265
|
-
import * as
|
|
3089
|
+
import * as React50 from "react";
|
|
3266
3090
|
import { Slot as Slot5 } from "@radix-ui/react-slot";
|
|
3267
3091
|
import { ChevronsUpDown as ChevronsUpDown2 } from "lucide-react";
|
|
3268
|
-
import { Fragment as
|
|
3269
|
-
var SidebarProductHeader =
|
|
3092
|
+
import { Fragment as Fragment4, jsx as jsx60, jsxs as jsxs30 } from "react/jsx-runtime";
|
|
3093
|
+
var SidebarProductHeader = React50.forwardRef(
|
|
3270
3094
|
function SidebarProductHeader2({ name, icon, trailing, asChild = false, className, children, ...props }, ref) {
|
|
3271
|
-
const adornment = trailing === void 0 ? /* @__PURE__ */
|
|
3272
|
-
const content = /* @__PURE__ */
|
|
3273
|
-
icon && /* @__PURE__ */
|
|
3274
|
-
/* @__PURE__ */
|
|
3275
|
-
adornment && /* @__PURE__ */
|
|
3095
|
+
const adornment = trailing === void 0 ? /* @__PURE__ */ jsx60(ChevronsUpDown2, { size: 14, "aria-hidden": "true", className: "shrink-0 text-text-tertiary" }) : trailing;
|
|
3096
|
+
const content = /* @__PURE__ */ jsxs30(Fragment4, { children: [
|
|
3097
|
+
icon && /* @__PURE__ */ jsx60("span", { className: "flex size-7 shrink-0 items-center justify-center overflow-hidden rounded-md", "aria-hidden": "true", children: icon }),
|
|
3098
|
+
/* @__PURE__ */ jsx60("span", { className: "min-w-0 flex-1 truncate text-sm font-semibold text-text-primary", children: name }),
|
|
3099
|
+
adornment && /* @__PURE__ */ jsx60("span", { className: "flex shrink-0 items-center", children: adornment })
|
|
3276
3100
|
] });
|
|
3277
3101
|
const classes = cn("flex w-full items-center gap-2.5 rounded-xl px-1.5 py-0 text-left", className);
|
|
3278
3102
|
if (asChild) {
|
|
3279
|
-
const child =
|
|
3280
|
-
return /* @__PURE__ */
|
|
3103
|
+
const child = React50.Children.only(children);
|
|
3104
|
+
return /* @__PURE__ */ jsx60(Slot5, { ref, className: classes, ...props, children: React50.cloneElement(child, void 0, content) });
|
|
3281
3105
|
}
|
|
3282
|
-
return /* @__PURE__ */
|
|
3106
|
+
return /* @__PURE__ */ jsx60("button", { ref, type: "button", className: classes, ...props, children: content });
|
|
3283
3107
|
}
|
|
3284
3108
|
);
|
|
3285
3109
|
SidebarProductHeader.displayName = "SidebarProductHeader";
|
|
3286
3110
|
|
|
3287
3111
|
// src/components/org-product-switcher.tsx
|
|
3288
3112
|
import { ChevronsUpDown as ChevronsUpDown3, Check as Check6 } from "lucide-react";
|
|
3289
|
-
import { Fragment as
|
|
3113
|
+
import { Fragment as Fragment5, jsx as jsx61, jsxs as jsxs31 } from "react/jsx-runtime";
|
|
3290
3114
|
var triggerBox = "flex w-full items-center gap-2.5 rounded-xl px-1.5 py-1 text-left transition-colors hover:bg-[var(--hov-bg)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-border-focus";
|
|
3291
3115
|
var menuItem = "gap-2 rounded-md px-2 py-1.5 text-sm font-medium text-text-secondary focus:bg-[var(--menu-hov)] focus:text-text-primary";
|
|
3292
3116
|
var sectionLabel = "px-2 pt-1.5 pb-1 text-xs font-medium text-text-tertiary";
|
|
3293
3117
|
function Mark({ item, size }) {
|
|
3294
3118
|
const box = size === "md" ? "size-7" : "size-5";
|
|
3295
3119
|
if (item.icon) {
|
|
3296
|
-
return /* @__PURE__ */
|
|
3120
|
+
return /* @__PURE__ */ jsx61("span", { className: cn("flex shrink-0 items-center justify-center overflow-hidden rounded-md", box), "aria-hidden": "true", children: item.icon });
|
|
3297
3121
|
}
|
|
3298
|
-
return /* @__PURE__ */
|
|
3122
|
+
return /* @__PURE__ */ jsx61(
|
|
3299
3123
|
"span",
|
|
3300
3124
|
{
|
|
3301
3125
|
"aria-hidden": "true",
|
|
@@ -3322,44 +3146,44 @@ function OrgProductSwitcher({
|
|
|
3322
3146
|
const activeOrg = organizations.find((o) => o.id === activeOrgId);
|
|
3323
3147
|
const activeProduct = products.find((p) => p.id === activeProductId);
|
|
3324
3148
|
const ariaLabel = props["aria-label"] ?? `${activeOrg?.name ?? ""} / ${activeProduct?.name ?? ""}`;
|
|
3325
|
-
return /* @__PURE__ */
|
|
3326
|
-
/* @__PURE__ */
|
|
3327
|
-
activeProduct && /* @__PURE__ */
|
|
3328
|
-
/* @__PURE__ */
|
|
3329
|
-
/* @__PURE__ */
|
|
3330
|
-
/* @__PURE__ */
|
|
3149
|
+
return /* @__PURE__ */ jsxs31(DropdownMenu, { children: [
|
|
3150
|
+
/* @__PURE__ */ jsxs31(DropdownMenuTrigger, { "aria-label": ariaLabel, className: cn(triggerBox, className), children: [
|
|
3151
|
+
activeProduct && /* @__PURE__ */ jsx61(Mark, { item: activeProduct, size: "md" }),
|
|
3152
|
+
/* @__PURE__ */ jsxs31("span", { className: "flex min-w-0 flex-1 flex-col gap-0.5", children: [
|
|
3153
|
+
/* @__PURE__ */ jsx61("span", { className: "truncate text-xs leading-[normal] text-text-tertiary", children: activeOrg?.name }),
|
|
3154
|
+
/* @__PURE__ */ jsx61("span", { className: "truncate text-sm leading-[normal] font-semibold text-text-primary", children: activeProduct?.name })
|
|
3331
3155
|
] }),
|
|
3332
|
-
/* @__PURE__ */
|
|
3156
|
+
/* @__PURE__ */ jsx61(ChevronsUpDown3, { size: 14, "aria-hidden": "true", className: "shrink-0 text-text-tertiary" })
|
|
3333
3157
|
] }),
|
|
3334
|
-
/* @__PURE__ */
|
|
3158
|
+
/* @__PURE__ */ jsxs31(
|
|
3335
3159
|
DropdownMenuContent,
|
|
3336
3160
|
{
|
|
3337
3161
|
align: "start",
|
|
3338
3162
|
sideOffset: 6,
|
|
3339
3163
|
className: "flex w-60 flex-col gap-px rounded-xl border-border-subtle bg-[var(--menu-bg)] p-1 shadow-(--menu-shadow)",
|
|
3340
3164
|
children: [
|
|
3341
|
-
/* @__PURE__ */
|
|
3342
|
-
organizations.map((o) => /* @__PURE__ */
|
|
3343
|
-
/* @__PURE__ */
|
|
3344
|
-
/* @__PURE__ */
|
|
3345
|
-
o.id === activeOrgId && /* @__PURE__ */
|
|
3165
|
+
/* @__PURE__ */ jsx61(DropdownMenuLabel, { className: sectionLabel, children: "Organizations" }),
|
|
3166
|
+
organizations.map((o) => /* @__PURE__ */ jsxs31(DropdownMenuItem, { className: menuItem, onSelect: () => onOrgSelect(o.id), children: [
|
|
3167
|
+
/* @__PURE__ */ jsx61(Mark, { item: o, size: "sm" }),
|
|
3168
|
+
/* @__PURE__ */ jsx61("span", { className: "min-w-0 flex-1 truncate", children: o.name }),
|
|
3169
|
+
o.id === activeOrgId && /* @__PURE__ */ jsx61(Check6, { className: "size-4 shrink-0 text-text-secondary", "aria-hidden": "true" })
|
|
3346
3170
|
] }, o.id)),
|
|
3347
|
-
/* @__PURE__ */
|
|
3348
|
-
/* @__PURE__ */
|
|
3171
|
+
/* @__PURE__ */ jsx61(DropdownMenuSeparator, { className: "mx-0 shrink-0 bg-border-subtle" }),
|
|
3172
|
+
/* @__PURE__ */ jsxs31(DropdownMenuLabel, { className: sectionLabel, children: [
|
|
3349
3173
|
activeOrg?.name,
|
|
3350
3174
|
" \xB7 Products"
|
|
3351
3175
|
] }),
|
|
3352
|
-
products.map((p) => /* @__PURE__ */
|
|
3353
|
-
/* @__PURE__ */
|
|
3354
|
-
/* @__PURE__ */
|
|
3355
|
-
p.id === activeProductId && /* @__PURE__ */
|
|
3176
|
+
products.map((p) => /* @__PURE__ */ jsxs31(DropdownMenuItem, { className: menuItem, onSelect: () => onProductSelect(p.id), children: [
|
|
3177
|
+
/* @__PURE__ */ jsx61(Mark, { item: p, size: "sm" }),
|
|
3178
|
+
/* @__PURE__ */ jsx61("span", { className: "min-w-0 flex-1 truncate", children: p.name }),
|
|
3179
|
+
p.id === activeProductId && /* @__PURE__ */ jsx61(Check6, { className: "size-4 shrink-0 text-text-secondary", "aria-hidden": "true" })
|
|
3356
3180
|
] }, p.id)),
|
|
3357
|
-
actions && actions.length > 0 && /* @__PURE__ */
|
|
3358
|
-
/* @__PURE__ */
|
|
3359
|
-
actions.map((a) => /* @__PURE__ */
|
|
3181
|
+
actions && actions.length > 0 && /* @__PURE__ */ jsxs31(Fragment5, { children: [
|
|
3182
|
+
/* @__PURE__ */ jsx61(DropdownMenuSeparator, { className: "mx-0 shrink-0 bg-border-subtle" }),
|
|
3183
|
+
actions.map((a) => /* @__PURE__ */ jsx61(DropdownMenuItem, { className: menuItem, onSelect: a.onSelect, asChild: Boolean(a.href), children: a.href ? /* @__PURE__ */ jsxs31("a", { href: a.href, children: [
|
|
3360
3184
|
a.icon,
|
|
3361
3185
|
a.label
|
|
3362
|
-
] }) : /* @__PURE__ */
|
|
3186
|
+
] }) : /* @__PURE__ */ jsxs31(Fragment5, { children: [
|
|
3363
3187
|
a.icon,
|
|
3364
3188
|
a.label
|
|
3365
3189
|
] }) }, a.id))
|
|
@@ -3373,12 +3197,12 @@ OrgProductSwitcher.displayName = "OrgProductSwitcher";
|
|
|
3373
3197
|
|
|
3374
3198
|
// src/components/sidebar-back-header.tsx
|
|
3375
3199
|
import { ArrowLeft as ArrowLeft2 } from "lucide-react";
|
|
3376
|
-
import { jsx as
|
|
3200
|
+
import { jsx as jsx62, jsxs as jsxs32 } from "react/jsx-runtime";
|
|
3377
3201
|
var focusRing = "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-border-focus";
|
|
3378
3202
|
var arrowPlate = "flex size-5 items-center justify-center rounded-md transition-colors hover:bg-[color-mix(in_srgb,var(--text-primary)_12%,transparent)] hover:text-text-primary";
|
|
3379
3203
|
var arrowBox = "flex shrink-0 cursor-pointer items-center rounded-xl py-2 pr-0 pl-2.5 text-text-secondary";
|
|
3380
3204
|
var titleBox = "min-w-0 flex-1 cursor-pointer truncate rounded-xl py-2 pr-2.5 pl-[14px] text-left text-sm font-semibold text-text-primary";
|
|
3381
|
-
var Arrow = () => /* @__PURE__ */
|
|
3205
|
+
var Arrow = () => /* @__PURE__ */ jsx62(ArrowLeft2, { size: 16, "aria-hidden": "true" });
|
|
3382
3206
|
function SidebarBackHeader({
|
|
3383
3207
|
title,
|
|
3384
3208
|
onBack,
|
|
@@ -3392,7 +3216,7 @@ function SidebarBackHeader({
|
|
|
3392
3216
|
const { className: arrowClassName, ...arrowRest } = arrowProps ?? {};
|
|
3393
3217
|
const { className: titleClassName, ...titleRest } = titleProps ?? {};
|
|
3394
3218
|
if (!onTitleClick) {
|
|
3395
|
-
return /* @__PURE__ */
|
|
3219
|
+
return /* @__PURE__ */ jsxs32(
|
|
3396
3220
|
"button",
|
|
3397
3221
|
{
|
|
3398
3222
|
type: "button",
|
|
@@ -3400,14 +3224,14 @@ function SidebarBackHeader({
|
|
|
3400
3224
|
className: cn("flex items-center rounded-xl", focusRing, className),
|
|
3401
3225
|
...rowProps,
|
|
3402
3226
|
children: [
|
|
3403
|
-
/* @__PURE__ */
|
|
3404
|
-
/* @__PURE__ */
|
|
3227
|
+
/* @__PURE__ */ jsx62("span", { className: arrowBox, children: /* @__PURE__ */ jsx62("span", { className: cn(arrowPlate, arrowClassName), ...arrowRest, children: /* @__PURE__ */ jsx62(Arrow, {}) }) }),
|
|
3228
|
+
/* @__PURE__ */ jsx62("span", { className: cn(titleBox, titleClassName), ...titleRest, children: title })
|
|
3405
3229
|
]
|
|
3406
3230
|
}
|
|
3407
3231
|
);
|
|
3408
3232
|
}
|
|
3409
|
-
return /* @__PURE__ */
|
|
3410
|
-
/* @__PURE__ */
|
|
3233
|
+
return /* @__PURE__ */ jsxs32("div", { className: cn("flex items-center", className), ...rowProps, children: [
|
|
3234
|
+
/* @__PURE__ */ jsx62(
|
|
3411
3235
|
"button",
|
|
3412
3236
|
{
|
|
3413
3237
|
type: "button",
|
|
@@ -3415,10 +3239,10 @@ function SidebarBackHeader({
|
|
|
3415
3239
|
onClick: onBack,
|
|
3416
3240
|
className: cn(arrowBox, focusRing, arrowClassName),
|
|
3417
3241
|
...arrowRest,
|
|
3418
|
-
children: /* @__PURE__ */
|
|
3242
|
+
children: /* @__PURE__ */ jsx62("span", { className: arrowPlate, children: /* @__PURE__ */ jsx62(Arrow, {}) })
|
|
3419
3243
|
}
|
|
3420
3244
|
),
|
|
3421
|
-
/* @__PURE__ */
|
|
3245
|
+
/* @__PURE__ */ jsx62(
|
|
3422
3246
|
"button",
|
|
3423
3247
|
{
|
|
3424
3248
|
type: "button",
|
|
@@ -3433,54 +3257,54 @@ function SidebarBackHeader({
|
|
|
3433
3257
|
SidebarBackHeader.displayName = "SidebarBackHeader";
|
|
3434
3258
|
|
|
3435
3259
|
// src/components/app-shell.tsx
|
|
3436
|
-
import * as
|
|
3260
|
+
import * as React51 from "react";
|
|
3437
3261
|
import { Menu as Menu2 } from "lucide-react";
|
|
3438
3262
|
import { useLocation as useLocation2 } from "react-router";
|
|
3439
|
-
import { jsx as
|
|
3263
|
+
import { jsx as jsx63, jsxs as jsxs33 } from "react/jsx-runtime";
|
|
3440
3264
|
function expandedSidebar(sidebar) {
|
|
3441
|
-
return
|
|
3265
|
+
return React51.isValidElement(sidebar) ? React51.cloneElement(sidebar, { collapsed: false }) : sidebar;
|
|
3442
3266
|
}
|
|
3443
3267
|
function AppShell({ sidebar, topBar, children, className }) {
|
|
3444
3268
|
const { pathname } = useLocation2();
|
|
3445
|
-
const [mobileOpen, setMobileOpen] =
|
|
3446
|
-
|
|
3269
|
+
const [mobileOpen, setMobileOpen] = React51.useState(false);
|
|
3270
|
+
React51.useEffect(() => {
|
|
3447
3271
|
setMobileOpen(false);
|
|
3448
3272
|
}, [pathname]);
|
|
3449
3273
|
const isMobile = useIsMobile();
|
|
3450
3274
|
if (isMobile) {
|
|
3451
|
-
return /* @__PURE__ */
|
|
3452
|
-
/* @__PURE__ */
|
|
3453
|
-
/* @__PURE__ */
|
|
3454
|
-
/* @__PURE__ */
|
|
3455
|
-
/* @__PURE__ */
|
|
3456
|
-
/* @__PURE__ */
|
|
3457
|
-
/* @__PURE__ */
|
|
3275
|
+
return /* @__PURE__ */ jsx63(TooltipProvider, { children: /* @__PURE__ */ jsxs33("div", { className: cn("flex min-h-screen flex-col bg-bg-surface", className), children: [
|
|
3276
|
+
/* @__PURE__ */ jsxs33("header", { className: "flex shrink-0 items-center justify-between border-b border-border-subtle bg-bg-surface px-4 py-3", children: [
|
|
3277
|
+
/* @__PURE__ */ jsxs33(Sheet, { open: mobileOpen, onOpenChange: setMobileOpen, children: [
|
|
3278
|
+
/* @__PURE__ */ jsx63(SheetTrigger, { asChild: true, children: /* @__PURE__ */ jsx63(Button, { variant: "ghost", size: "icon", className: "size-8 text-text-secondary", "aria-label": "Open navigation", children: /* @__PURE__ */ jsx63(Menu2, { className: "size-5" }) }) }),
|
|
3279
|
+
/* @__PURE__ */ jsxs33(SheetContent, { side: "left", className: "w-[248px] bg-bg-surface p-0", children: [
|
|
3280
|
+
/* @__PURE__ */ jsx63(SheetTitle, { className: "sr-only", children: "Navigation" }),
|
|
3281
|
+
/* @__PURE__ */ jsx63(SheetDescription, { className: "sr-only", children: "Application navigation menu" }),
|
|
3458
3282
|
expandedSidebar(sidebar)
|
|
3459
3283
|
] })
|
|
3460
3284
|
] }),
|
|
3461
|
-
/* @__PURE__ */
|
|
3285
|
+
/* @__PURE__ */ jsx63("div", { className: "flex items-center gap-2", children: topBar })
|
|
3462
3286
|
] }),
|
|
3463
|
-
/* @__PURE__ */
|
|
3287
|
+
/* @__PURE__ */ jsx63("main", { className: "flex-1 overflow-auto", children })
|
|
3464
3288
|
] }) });
|
|
3465
3289
|
}
|
|
3466
|
-
return /* @__PURE__ */
|
|
3467
|
-
/* @__PURE__ */
|
|
3468
|
-
/* @__PURE__ */
|
|
3469
|
-
topBar && /* @__PURE__ */
|
|
3470
|
-
/* @__PURE__ */
|
|
3290
|
+
return /* @__PURE__ */ jsx63(TooltipProvider, { children: /* @__PURE__ */ jsxs33("div", { className: cn("flex min-h-screen gap-3 bg-bg-surface p-4", className), children: [
|
|
3291
|
+
/* @__PURE__ */ jsx63("div", { className: "sticky top-4 h-[calc(100vh-32px)] shrink-0", children: sidebar }),
|
|
3292
|
+
/* @__PURE__ */ jsxs33("div", { className: "flex min-w-0 flex-1 flex-col overflow-hidden", children: [
|
|
3293
|
+
topBar && /* @__PURE__ */ jsx63("div", { className: "flex shrink-0 items-center justify-end gap-2", children: topBar }),
|
|
3294
|
+
/* @__PURE__ */ jsx63("main", { className: "flex-1 overflow-y-auto", children })
|
|
3471
3295
|
] })
|
|
3472
3296
|
] }) });
|
|
3473
3297
|
}
|
|
3474
3298
|
var AuthenticatedLayout = AppShell;
|
|
3475
3299
|
|
|
3476
3300
|
// src/components/grid.tsx
|
|
3477
|
-
import * as
|
|
3301
|
+
import * as React52 from "react";
|
|
3478
3302
|
import { Slot as Slot6 } from "@radix-ui/react-slot";
|
|
3479
|
-
import { jsx as
|
|
3480
|
-
var Grid =
|
|
3303
|
+
import { jsx as jsx64 } from "react/jsx-runtime";
|
|
3304
|
+
var Grid = React52.forwardRef(
|
|
3481
3305
|
({ fluid = false, asChild = false, className, ...props }, ref) => {
|
|
3482
3306
|
const Comp = asChild ? Slot6 : "div";
|
|
3483
|
-
return /* @__PURE__ */
|
|
3307
|
+
return /* @__PURE__ */ jsx64(
|
|
3484
3308
|
Comp,
|
|
3485
3309
|
{
|
|
3486
3310
|
ref,
|
|
@@ -3498,9 +3322,9 @@ var Grid = React53.forwardRef(
|
|
|
3498
3322
|
Grid.displayName = "Grid";
|
|
3499
3323
|
|
|
3500
3324
|
// src/components/col.tsx
|
|
3501
|
-
import * as
|
|
3325
|
+
import * as React53 from "react";
|
|
3502
3326
|
import { Slot as Slot7 } from "@radix-ui/react-slot";
|
|
3503
|
-
import { jsx as
|
|
3327
|
+
import { jsx as jsx65 } from "react/jsx-runtime";
|
|
3504
3328
|
var TIER_MAX = { base: 4, md: 8, xl: 12 };
|
|
3505
3329
|
var SPAN = {
|
|
3506
3330
|
base: { 1: "col-span-1", 2: "col-span-2", 3: "col-span-3", 4: "col-span-4" },
|
|
@@ -3620,17 +3444,17 @@ function responsiveClasses(span, offset) {
|
|
|
3620
3444
|
}
|
|
3621
3445
|
return cn(...spanClasses, ...startClasses);
|
|
3622
3446
|
}
|
|
3623
|
-
var Col =
|
|
3447
|
+
var Col = React53.forwardRef(
|
|
3624
3448
|
({ span, offset, asChild = false, className, ...props }, ref) => {
|
|
3625
3449
|
const Comp = asChild ? Slot7 : "div";
|
|
3626
|
-
return /* @__PURE__ */
|
|
3450
|
+
return /* @__PURE__ */ jsx65(Comp, { ref, className: cn(responsiveClasses(span, offset), className), ...props });
|
|
3627
3451
|
}
|
|
3628
3452
|
);
|
|
3629
3453
|
Col.displayName = "Col";
|
|
3630
3454
|
|
|
3631
3455
|
// src/components/code-block.tsx
|
|
3632
|
-
import * as
|
|
3633
|
-
import { jsx as
|
|
3456
|
+
import * as React54 from "react";
|
|
3457
|
+
import { jsx as jsx66, jsxs as jsxs34 } from "react/jsx-runtime";
|
|
3634
3458
|
var TOKEN_CLASS = {
|
|
3635
3459
|
comment: "text-text-tertiary italic",
|
|
3636
3460
|
string: "text-text-success",
|
|
@@ -3758,11 +3582,11 @@ function tokenize(code, lang) {
|
|
|
3758
3582
|
}
|
|
3759
3583
|
return tokens;
|
|
3760
3584
|
}
|
|
3761
|
-
var CodeBlock =
|
|
3585
|
+
var CodeBlock = React54.forwardRef(
|
|
3762
3586
|
({ code, lang = "tsx", copy = false, filename, scroll = false, className, ...props }, ref) => {
|
|
3763
|
-
const tokens =
|
|
3587
|
+
const tokens = React54.useMemo(() => tokenize(code, lang), [code, lang]);
|
|
3764
3588
|
const framed = Boolean(filename) || copy;
|
|
3765
|
-
const pre = /* @__PURE__ */
|
|
3589
|
+
const pre = /* @__PURE__ */ jsx66(
|
|
3766
3590
|
"pre",
|
|
3767
3591
|
{
|
|
3768
3592
|
ref,
|
|
@@ -3773,21 +3597,21 @@ var CodeBlock = React55.forwardRef(
|
|
|
3773
3597
|
className
|
|
3774
3598
|
),
|
|
3775
3599
|
...props,
|
|
3776
|
-
children: /* @__PURE__ */
|
|
3600
|
+
children: /* @__PURE__ */ jsx66("code", { children: tokens.map((token, index) => /* @__PURE__ */ jsx66("span", { className: TOKEN_CLASS[token.kind], children: token.text }, index)) })
|
|
3777
3601
|
}
|
|
3778
3602
|
);
|
|
3779
3603
|
if (!framed) return pre;
|
|
3780
|
-
return /* @__PURE__ */
|
|
3781
|
-
/* @__PURE__ */
|
|
3782
|
-
filename ? /* @__PURE__ */
|
|
3783
|
-
copy ? /* @__PURE__ */
|
|
3604
|
+
return /* @__PURE__ */ jsxs34("div", { className: "overflow-hidden rounded-lg border border-border-subtle bg-bg-primary", children: [
|
|
3605
|
+
/* @__PURE__ */ jsxs34("div", { className: "flex items-center justify-between gap-3 border-b border-border-subtle px-4 py-2", children: [
|
|
3606
|
+
filename ? /* @__PURE__ */ jsx66("span", { className: "font-mono text-xs text-text-tertiary", children: filename }) : /* @__PURE__ */ jsx66("span", {}),
|
|
3607
|
+
copy ? /* @__PURE__ */ jsx66(CopyButton, { value: code, label: "Copy code" }) : null
|
|
3784
3608
|
] }),
|
|
3785
3609
|
pre
|
|
3786
3610
|
] });
|
|
3787
3611
|
}
|
|
3788
3612
|
);
|
|
3789
3613
|
CodeBlock.displayName = "CodeBlock";
|
|
3790
|
-
var Code =
|
|
3614
|
+
var Code = React54.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx66(
|
|
3791
3615
|
"code",
|
|
3792
3616
|
{
|
|
3793
3617
|
ref,
|
|
@@ -3801,13 +3625,13 @@ var Code = React55.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */
|
|
|
3801
3625
|
Code.displayName = "Code";
|
|
3802
3626
|
|
|
3803
3627
|
// src/components/grid-overlay.tsx
|
|
3804
|
-
import * as
|
|
3805
|
-
import { jsx as
|
|
3628
|
+
import * as React55 from "react";
|
|
3629
|
+
import { jsx as jsx67 } from "react/jsx-runtime";
|
|
3806
3630
|
var BASELINE = "var(--grid-gutter) / 2";
|
|
3807
|
-
var GridOverlay =
|
|
3631
|
+
var GridOverlay = React55.forwardRef(
|
|
3808
3632
|
({ columns, baseline = false, className, style, ...props }, ref) => {
|
|
3809
3633
|
const count = Number.isFinite(columns) ? Math.max(1, Math.floor(columns)) : 1;
|
|
3810
|
-
return /* @__PURE__ */
|
|
3634
|
+
return /* @__PURE__ */ jsx67(
|
|
3811
3635
|
"div",
|
|
3812
3636
|
{
|
|
3813
3637
|
ref,
|
|
@@ -3824,7 +3648,7 @@ var GridOverlay = React56.forwardRef(
|
|
|
3824
3648
|
...style
|
|
3825
3649
|
},
|
|
3826
3650
|
...props,
|
|
3827
|
-
children: Array.from({ length: count }).map((_, i) => /* @__PURE__ */
|
|
3651
|
+
children: Array.from({ length: count }).map((_, i) => /* @__PURE__ */ jsx67("span", { style: { backgroundColor: "var(--bg-brand)", opacity: 0.1 } }, i))
|
|
3828
3652
|
}
|
|
3829
3653
|
);
|
|
3830
3654
|
}
|
|
@@ -3832,10 +3656,10 @@ var GridOverlay = React56.forwardRef(
|
|
|
3832
3656
|
GridOverlay.displayName = "GridOverlay";
|
|
3833
3657
|
|
|
3834
3658
|
// src/components/segment-chip.tsx
|
|
3835
|
-
import * as
|
|
3659
|
+
import * as React56 from "react";
|
|
3836
3660
|
import { cva as cva9 } from "class-variance-authority";
|
|
3837
3661
|
import { Link2 as Link22, KeyRound, Clock, Plus } from "lucide-react";
|
|
3838
|
-
import { jsx as
|
|
3662
|
+
import { jsx as jsx68, jsxs as jsxs35 } from "react/jsx-runtime";
|
|
3839
3663
|
var segmentChipVariants = cva9(
|
|
3840
3664
|
"inline-flex items-center gap-1.5 rounded-lg border px-2.5 py-1 text-sm font-medium leading-tight",
|
|
3841
3665
|
{
|
|
@@ -3856,11 +3680,11 @@ var kindIcons = {
|
|
|
3856
3680
|
pending: Clock,
|
|
3857
3681
|
available: Plus
|
|
3858
3682
|
};
|
|
3859
|
-
var SegmentChip =
|
|
3683
|
+
var SegmentChip = React56.forwardRef(
|
|
3860
3684
|
({ kind, resource, icon, hideIcon = false, className, ...props }, ref) => {
|
|
3861
3685
|
const Icon = icon ?? kindIcons[kind ?? "granted"];
|
|
3862
|
-
return /* @__PURE__ */
|
|
3863
|
-
!hideIcon && /* @__PURE__ */
|
|
3686
|
+
return /* @__PURE__ */ jsxs35("span", { ref, className: cn(segmentChipVariants({ kind }), className), ...props, children: [
|
|
3687
|
+
!hideIcon && /* @__PURE__ */ jsx68(Icon, { className: "size-3.5 shrink-0 opacity-90", "aria-hidden": "true" }),
|
|
3864
3688
|
resource
|
|
3865
3689
|
] });
|
|
3866
3690
|
}
|
|
@@ -3868,9 +3692,9 @@ var SegmentChip = React57.forwardRef(
|
|
|
3868
3692
|
SegmentChip.displayName = "SegmentChip";
|
|
3869
3693
|
|
|
3870
3694
|
// src/components/connection-card.tsx
|
|
3871
|
-
import * as
|
|
3695
|
+
import * as React57 from "react";
|
|
3872
3696
|
import { AlertTriangle, ChevronDown as ChevronDown4 } from "lucide-react";
|
|
3873
|
-
import { Fragment as
|
|
3697
|
+
import { Fragment as Fragment6, jsx as jsx69, jsxs as jsxs36 } from "react/jsx-runtime";
|
|
3874
3698
|
var authLabels = { app: "App", oauth: "OAuth", token: "token" };
|
|
3875
3699
|
var statusMeta = {
|
|
3876
3700
|
connected: { label: "Connected", badge: "success", dot: "success" },
|
|
@@ -3880,7 +3704,7 @@ var statusMeta = {
|
|
|
3880
3704
|
function monogram(name) {
|
|
3881
3705
|
return name.replace(/[^a-zA-Z0-9 ]/g, " ").split(/\s+/).filter(Boolean).slice(0, 2).map((w) => w[0].toUpperCase()).join("");
|
|
3882
3706
|
}
|
|
3883
|
-
var ConnectionCard =
|
|
3707
|
+
var ConnectionCard = React57.forwardRef(
|
|
3884
3708
|
({
|
|
3885
3709
|
name,
|
|
3886
3710
|
scope,
|
|
@@ -3901,7 +3725,7 @@ var ConnectionCard = React58.forwardRef(
|
|
|
3901
3725
|
}, ref) => {
|
|
3902
3726
|
const meta = statusMeta[status];
|
|
3903
3727
|
const connected = status !== "disconnected";
|
|
3904
|
-
const glyphBox = /* @__PURE__ */
|
|
3728
|
+
const glyphBox = /* @__PURE__ */ jsx69(
|
|
3905
3729
|
"div",
|
|
3906
3730
|
{
|
|
3907
3731
|
"aria-hidden": "true",
|
|
@@ -3909,51 +3733,51 @@ var ConnectionCard = React58.forwardRef(
|
|
|
3909
3733
|
children: glyph ?? monogram(name)
|
|
3910
3734
|
}
|
|
3911
3735
|
);
|
|
3912
|
-
const identity = /* @__PURE__ */
|
|
3913
|
-
/* @__PURE__ */
|
|
3914
|
-
/* @__PURE__ */
|
|
3915
|
-
/* @__PURE__ */
|
|
3916
|
-
/* @__PURE__ */
|
|
3736
|
+
const identity = /* @__PURE__ */ jsxs36("div", { className: "min-w-0", children: [
|
|
3737
|
+
/* @__PURE__ */ jsx69("p", { className: "truncate text-sm font-semibold text-text-primary", children: name }),
|
|
3738
|
+
/* @__PURE__ */ jsxs36("div", { className: "mt-0.5 flex flex-wrap gap-1", children: [
|
|
3739
|
+
/* @__PURE__ */ jsx69(Badge, { variant: "secondary", children: scope }),
|
|
3740
|
+
/* @__PURE__ */ jsx69(Badge, { variant: "secondary", children: authLabels[auth] })
|
|
3917
3741
|
] })
|
|
3918
3742
|
] });
|
|
3919
|
-
const statusBadge = /* @__PURE__ */
|
|
3920
|
-
/* @__PURE__ */
|
|
3743
|
+
const statusBadge = /* @__PURE__ */ jsxs36(Badge, { variant: meta.badge, className: "gap-1.5", children: [
|
|
3744
|
+
/* @__PURE__ */ jsx69(StatusDot, { status: meta.dot, size: "sm" }),
|
|
3921
3745
|
statusLabel ?? meta.label
|
|
3922
3746
|
] });
|
|
3923
|
-
const accessNote = access ? /* @__PURE__ */
|
|
3747
|
+
const accessNote = access ? /* @__PURE__ */ jsxs36(
|
|
3924
3748
|
"div",
|
|
3925
3749
|
{
|
|
3926
3750
|
role: "note",
|
|
3927
3751
|
className: "flex items-start gap-2 border-t border-border-subtle bg-bg-warning-subtle px-4 py-2.5 text-xs font-medium text-text-warning",
|
|
3928
3752
|
children: [
|
|
3929
|
-
/* @__PURE__ */
|
|
3930
|
-
/* @__PURE__ */
|
|
3753
|
+
/* @__PURE__ */ jsx69(AlertTriangle, { className: "mt-0.5 size-3.5 shrink-0", "aria-hidden": "true" }),
|
|
3754
|
+
/* @__PURE__ */ jsx69("span", { children: access })
|
|
3931
3755
|
]
|
|
3932
3756
|
}
|
|
3933
3757
|
) : null;
|
|
3934
3758
|
const footerAction = collapsible ? action : connected && action;
|
|
3935
|
-
const footer = grantedCount !== void 0 || footerAction ? /* @__PURE__ */
|
|
3936
|
-
/* @__PURE__ */
|
|
3759
|
+
const footer = grantedCount !== void 0 || footerAction ? /* @__PURE__ */ jsxs36("div", { className: "flex items-center justify-between border-t border-border-subtle px-4 py-3", children: [
|
|
3760
|
+
/* @__PURE__ */ jsx69("span", { className: "text-sm text-text-secondary", children: grantedCount !== void 0 ? /* @__PURE__ */ jsxs36(Fragment6, { children: [
|
|
3937
3761
|
"Granted to ",
|
|
3938
|
-
/* @__PURE__ */
|
|
3762
|
+
/* @__PURE__ */ jsx69("span", { className: "font-semibold text-text-primary", children: grantedCount }),
|
|
3939
3763
|
" ",
|
|
3940
3764
|
grantedCount === 1 ? "product" : "products"
|
|
3941
|
-
] }) : /* @__PURE__ */
|
|
3765
|
+
] }) : /* @__PURE__ */ jsx69("span", { className: "text-text-tertiary", children: "Not granted to any product yet" }) }),
|
|
3942
3766
|
footerAction
|
|
3943
3767
|
] }) : null;
|
|
3944
|
-
const drawer = children ? /* @__PURE__ */
|
|
3768
|
+
const drawer = children ? /* @__PURE__ */ jsx69("div", { "data-slot": "drawer", className: "border-t border-border-subtle", children }) : null;
|
|
3945
3769
|
if (!collapsible) {
|
|
3946
|
-
return /* @__PURE__ */
|
|
3770
|
+
return /* @__PURE__ */ jsxs36(
|
|
3947
3771
|
Card,
|
|
3948
3772
|
{
|
|
3949
3773
|
ref,
|
|
3950
3774
|
className: cn(status === "disconnected" && "border-dashed border-border-default", className),
|
|
3951
3775
|
...props,
|
|
3952
3776
|
children: [
|
|
3953
|
-
/* @__PURE__ */
|
|
3777
|
+
/* @__PURE__ */ jsxs36("div", { className: "flex items-center gap-3 p-4", children: [
|
|
3954
3778
|
glyphBox,
|
|
3955
3779
|
identity,
|
|
3956
|
-
/* @__PURE__ */
|
|
3780
|
+
/* @__PURE__ */ jsx69("div", { className: "ml-auto shrink-0", children: connected ? statusBadge : action })
|
|
3957
3781
|
] }),
|
|
3958
3782
|
accessNote,
|
|
3959
3783
|
footer,
|
|
@@ -3962,7 +3786,7 @@ var ConnectionCard = React58.forwardRef(
|
|
|
3962
3786
|
}
|
|
3963
3787
|
);
|
|
3964
3788
|
}
|
|
3965
|
-
return /* @__PURE__ */
|
|
3789
|
+
return /* @__PURE__ */ jsx69(Collapsible, { defaultOpen, open, onOpenChange, children: /* @__PURE__ */ jsxs36(
|
|
3966
3790
|
Card,
|
|
3967
3791
|
{
|
|
3968
3792
|
ref,
|
|
@@ -3973,7 +3797,7 @@ var ConnectionCard = React58.forwardRef(
|
|
|
3973
3797
|
),
|
|
3974
3798
|
...props,
|
|
3975
3799
|
children: [
|
|
3976
|
-
/* @__PURE__ */
|
|
3800
|
+
/* @__PURE__ */ jsx69(CollapsibleTrigger2, { asChild: true, children: /* @__PURE__ */ jsxs36(
|
|
3977
3801
|
"button",
|
|
3978
3802
|
{
|
|
3979
3803
|
type: "button",
|
|
@@ -3981,9 +3805,9 @@ var ConnectionCard = React58.forwardRef(
|
|
|
3981
3805
|
children: [
|
|
3982
3806
|
glyphBox,
|
|
3983
3807
|
identity,
|
|
3984
|
-
/* @__PURE__ */
|
|
3808
|
+
/* @__PURE__ */ jsxs36("div", { className: "ml-auto flex shrink-0 items-center gap-2", children: [
|
|
3985
3809
|
statusBadge,
|
|
3986
|
-
/* @__PURE__ */
|
|
3810
|
+
/* @__PURE__ */ jsx69(
|
|
3987
3811
|
ChevronDown4,
|
|
3988
3812
|
{
|
|
3989
3813
|
"aria-hidden": "true",
|
|
@@ -3994,7 +3818,7 @@ var ConnectionCard = React58.forwardRef(
|
|
|
3994
3818
|
]
|
|
3995
3819
|
}
|
|
3996
3820
|
) }),
|
|
3997
|
-
/* @__PURE__ */
|
|
3821
|
+
/* @__PURE__ */ jsxs36(CollapsibleContent2, { children: [
|
|
3998
3822
|
accessNote,
|
|
3999
3823
|
footer,
|
|
4000
3824
|
drawer
|
|
@@ -4007,32 +3831,32 @@ var ConnectionCard = React58.forwardRef(
|
|
|
4007
3831
|
ConnectionCard.displayName = "ConnectionCard";
|
|
4008
3832
|
|
|
4009
3833
|
// src/components/request-row.tsx
|
|
4010
|
-
import * as
|
|
4011
|
-
import { Fragment as
|
|
3834
|
+
import * as React58 from "react";
|
|
3835
|
+
import { Fragment as Fragment7, jsx as jsx70, jsxs as jsxs37 } from "react/jsx-runtime";
|
|
4012
3836
|
function monogram2(name) {
|
|
4013
3837
|
return name.replace(/[^a-zA-Z0-9 ]/g, " ").split(/\s+/).filter(Boolean).slice(0, 2).map((w) => w[0].toUpperCase()).join("");
|
|
4014
3838
|
}
|
|
4015
|
-
var RequestRow =
|
|
3839
|
+
var RequestRow = React58.forwardRef(
|
|
4016
3840
|
({ surface, name, state: state2, glyph, subtitle, grantedResource, onApprove, onDeny, onRequest, action, className, ...props }, ref) => {
|
|
4017
3841
|
let controls = action;
|
|
4018
3842
|
if (controls === void 0) {
|
|
4019
3843
|
if (surface === "org" && state2 === "pending") {
|
|
4020
|
-
controls = /* @__PURE__ */
|
|
4021
|
-
/* @__PURE__ */
|
|
4022
|
-
/* @__PURE__ */
|
|
3844
|
+
controls = /* @__PURE__ */ jsxs37(Fragment7, { children: [
|
|
3845
|
+
/* @__PURE__ */ jsx70(Button, { variant: "outline", size: "sm", onClick: onDeny, children: "Deny" }),
|
|
3846
|
+
/* @__PURE__ */ jsx70(Button, { size: "sm", onClick: onApprove, children: "Approve" })
|
|
4023
3847
|
] });
|
|
4024
3848
|
} else if (state2 === "available") {
|
|
4025
|
-
controls = /* @__PURE__ */
|
|
3849
|
+
controls = /* @__PURE__ */ jsx70(Button, { size: "sm", onClick: onRequest, children: "Request" });
|
|
4026
3850
|
} else if (state2 === "pending") {
|
|
4027
|
-
controls = /* @__PURE__ */
|
|
4028
|
-
/* @__PURE__ */
|
|
3851
|
+
controls = /* @__PURE__ */ jsxs37(Badge, { variant: "secondary", className: "gap-1.5", children: [
|
|
3852
|
+
/* @__PURE__ */ jsx70(StatusDot, { status: "neutral", size: "sm" }),
|
|
4029
3853
|
"Pending"
|
|
4030
3854
|
] });
|
|
4031
3855
|
} else if (state2 === "granted") {
|
|
4032
|
-
controls = /* @__PURE__ */
|
|
3856
|
+
controls = /* @__PURE__ */ jsx70(SegmentChip, { kind: "granted", resource: grantedResource ?? "a segment" });
|
|
4033
3857
|
}
|
|
4034
3858
|
}
|
|
4035
|
-
return /* @__PURE__ */
|
|
3859
|
+
return /* @__PURE__ */ jsxs37(
|
|
4036
3860
|
"div",
|
|
4037
3861
|
{
|
|
4038
3862
|
ref,
|
|
@@ -4042,7 +3866,7 @@ var RequestRow = React59.forwardRef(
|
|
|
4042
3866
|
),
|
|
4043
3867
|
...props,
|
|
4044
3868
|
children: [
|
|
4045
|
-
/* @__PURE__ */
|
|
3869
|
+
/* @__PURE__ */ jsx70(
|
|
4046
3870
|
"div",
|
|
4047
3871
|
{
|
|
4048
3872
|
"aria-hidden": "true",
|
|
@@ -4050,11 +3874,11 @@ var RequestRow = React59.forwardRef(
|
|
|
4050
3874
|
children: glyph ?? monogram2(name)
|
|
4051
3875
|
}
|
|
4052
3876
|
),
|
|
4053
|
-
/* @__PURE__ */
|
|
4054
|
-
/* @__PURE__ */
|
|
4055
|
-
subtitle && /* @__PURE__ */
|
|
3877
|
+
/* @__PURE__ */ jsxs37("div", { className: "min-w-0", children: [
|
|
3878
|
+
/* @__PURE__ */ jsx70("p", { className: "truncate text-sm font-semibold text-text-primary", children: name }),
|
|
3879
|
+
subtitle && /* @__PURE__ */ jsx70("p", { className: "truncate text-xs text-text-tertiary", children: subtitle })
|
|
4056
3880
|
] }),
|
|
4057
|
-
/* @__PURE__ */
|
|
3881
|
+
/* @__PURE__ */ jsx70("div", { className: "ml-auto flex shrink-0 items-center gap-2", children: controls })
|
|
4058
3882
|
]
|
|
4059
3883
|
}
|
|
4060
3884
|
);
|
|
@@ -4063,9 +3887,9 @@ var RequestRow = React59.forwardRef(
|
|
|
4063
3887
|
RequestRow.displayName = "RequestRow";
|
|
4064
3888
|
|
|
4065
3889
|
// src/components/feedback-button.tsx
|
|
4066
|
-
import * as
|
|
3890
|
+
import * as React59 from "react";
|
|
4067
3891
|
import { MessageSquare, Loader2 as Loader22, CheckCircle2 } from "lucide-react";
|
|
4068
|
-
import { jsx as
|
|
3892
|
+
import { jsx as jsx71, jsxs as jsxs38 } from "react/jsx-runtime";
|
|
4069
3893
|
var TITLE_MAX = 256;
|
|
4070
3894
|
var DETAILS_MAX = 65536;
|
|
4071
3895
|
var DEFAULT_LABELS = {
|
|
@@ -4079,15 +3903,15 @@ var DEFAULT_LABELS = {
|
|
|
4079
3903
|
};
|
|
4080
3904
|
function FeedbackButton({ onSubmit, labels, className }) {
|
|
4081
3905
|
const l = { ...DEFAULT_LABELS, ...labels };
|
|
4082
|
-
const uid =
|
|
3906
|
+
const uid = React59.useId();
|
|
4083
3907
|
const titleId = `${uid}-title`;
|
|
4084
3908
|
const detailsId = `${uid}-details`;
|
|
4085
3909
|
const titleErrId = `${uid}-title-error`;
|
|
4086
3910
|
const detailsErrId = `${uid}-details-error`;
|
|
4087
|
-
const [open, setOpen] =
|
|
4088
|
-
const [status, setStatus] =
|
|
4089
|
-
const [title, setTitle] =
|
|
4090
|
-
const [details, setDetails] =
|
|
3911
|
+
const [open, setOpen] = React59.useState(false);
|
|
3912
|
+
const [status, setStatus] = React59.useState("idle");
|
|
3913
|
+
const [title, setTitle] = React59.useState("");
|
|
3914
|
+
const [details, setDetails] = React59.useState("");
|
|
4091
3915
|
const titleTooLong = title.length > TITLE_MAX;
|
|
4092
3916
|
const detailsTooLong = details.length > DETAILS_MAX;
|
|
4093
3917
|
const titleEmpty = title.trim().length === 0;
|
|
@@ -4112,20 +3936,20 @@ function FeedbackButton({ onSubmit, labels, className }) {
|
|
|
4112
3936
|
setStatus("error");
|
|
4113
3937
|
}
|
|
4114
3938
|
};
|
|
4115
|
-
return /* @__PURE__ */
|
|
4116
|
-
/* @__PURE__ */
|
|
4117
|
-
/* @__PURE__ */
|
|
3939
|
+
return /* @__PURE__ */ jsxs38(Popover, { open, onOpenChange: changeOpen, children: [
|
|
3940
|
+
/* @__PURE__ */ jsx71(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs38(Button, { variant: "ghost", size: "sm", "aria-label": l.trigger, className, children: [
|
|
3941
|
+
/* @__PURE__ */ jsx71(MessageSquare, { className: "size-4", "aria-hidden": "true" }),
|
|
4118
3942
|
l.trigger
|
|
4119
3943
|
] }) }),
|
|
4120
|
-
/* @__PURE__ */
|
|
4121
|
-
/* @__PURE__ */
|
|
4122
|
-
/* @__PURE__ */
|
|
4123
|
-
/* @__PURE__ */
|
|
4124
|
-
] }) : /* @__PURE__ */
|
|
4125
|
-
/* @__PURE__ */
|
|
4126
|
-
/* @__PURE__ */
|
|
4127
|
-
/* @__PURE__ */
|
|
4128
|
-
/* @__PURE__ */
|
|
3944
|
+
/* @__PURE__ */ jsx71(PopoverContent, { align: "end", side: "bottom", className: "w-80", children: status === "success" ? /* @__PURE__ */ jsxs38("div", { className: "flex flex-col items-center gap-3 py-2 text-center", children: [
|
|
3945
|
+
/* @__PURE__ */ jsx71(CheckCircle2, { className: "size-8 text-text-success", "aria-hidden": "true" }),
|
|
3946
|
+
/* @__PURE__ */ jsx71("p", { role: "status", className: "text-sm text-text-primary", children: l.success }),
|
|
3947
|
+
/* @__PURE__ */ jsx71(Button, { variant: "outline", size: "sm", onClick: () => changeOpen(false), children: "Close" })
|
|
3948
|
+
] }) : /* @__PURE__ */ jsxs38("form", { onSubmit: handleSubmit, className: "flex flex-col gap-3", children: [
|
|
3949
|
+
/* @__PURE__ */ jsx71("p", { className: "text-sm font-medium text-text-primary", children: l.title }),
|
|
3950
|
+
/* @__PURE__ */ jsxs38("div", { className: "flex flex-col gap-1.5", children: [
|
|
3951
|
+
/* @__PURE__ */ jsx71(Label2, { htmlFor: titleId, children: l.titleField }),
|
|
3952
|
+
/* @__PURE__ */ jsx71(
|
|
4129
3953
|
Input,
|
|
4130
3954
|
{
|
|
4131
3955
|
id: titleId,
|
|
@@ -4136,16 +3960,16 @@ function FeedbackButton({ onSubmit, labels, className }) {
|
|
|
4136
3960
|
"aria-describedby": titleTooLong ? titleErrId : void 0
|
|
4137
3961
|
}
|
|
4138
3962
|
),
|
|
4139
|
-
titleTooLong && /* @__PURE__ */
|
|
3963
|
+
titleTooLong && /* @__PURE__ */ jsxs38("p", { id: titleErrId, className: "text-xs text-text-danger", children: [
|
|
4140
3964
|
l.titleField,
|
|
4141
3965
|
" must be ",
|
|
4142
3966
|
TITLE_MAX,
|
|
4143
3967
|
" characters or fewer."
|
|
4144
3968
|
] })
|
|
4145
3969
|
] }),
|
|
4146
|
-
/* @__PURE__ */
|
|
4147
|
-
/* @__PURE__ */
|
|
4148
|
-
/* @__PURE__ */
|
|
3970
|
+
/* @__PURE__ */ jsxs38("div", { className: "flex flex-col gap-1.5", children: [
|
|
3971
|
+
/* @__PURE__ */ jsx71(Label2, { htmlFor: detailsId, children: l.detailsField }),
|
|
3972
|
+
/* @__PURE__ */ jsx71(
|
|
4149
3973
|
Textarea,
|
|
4150
3974
|
{
|
|
4151
3975
|
id: detailsId,
|
|
@@ -4156,16 +3980,16 @@ function FeedbackButton({ onSubmit, labels, className }) {
|
|
|
4156
3980
|
"aria-describedby": detailsTooLong ? detailsErrId : void 0
|
|
4157
3981
|
}
|
|
4158
3982
|
),
|
|
4159
|
-
detailsTooLong && /* @__PURE__ */
|
|
3983
|
+
detailsTooLong && /* @__PURE__ */ jsxs38("p", { id: detailsErrId, className: "text-xs text-text-danger", children: [
|
|
4160
3984
|
l.detailsField,
|
|
4161
3985
|
" must be ",
|
|
4162
3986
|
DETAILS_MAX,
|
|
4163
3987
|
" characters or fewer."
|
|
4164
3988
|
] })
|
|
4165
3989
|
] }),
|
|
4166
|
-
status === "error" && /* @__PURE__ */
|
|
4167
|
-
/* @__PURE__ */
|
|
4168
|
-
submitting && /* @__PURE__ */
|
|
3990
|
+
status === "error" && /* @__PURE__ */ jsx71(InlineError, { children: l.error }),
|
|
3991
|
+
/* @__PURE__ */ jsxs38(Button, { type: "submit", disabled: !valid || submitting, children: [
|
|
3992
|
+
submitting && /* @__PURE__ */ jsx71(Loader22, { className: "size-4 animate-spin", "aria-hidden": "true" }),
|
|
4169
3993
|
l.submit
|
|
4170
3994
|
] })
|
|
4171
3995
|
] }) })
|
|
@@ -4174,7 +3998,7 @@ function FeedbackButton({ onSubmit, labels, className }) {
|
|
|
4174
3998
|
|
|
4175
3999
|
// src/components/create-product-window.tsx
|
|
4176
4000
|
import { useForm } from "react-hook-form";
|
|
4177
|
-
import { jsx as
|
|
4001
|
+
import { jsx as jsx72, jsxs as jsxs39 } from "react/jsx-runtime";
|
|
4178
4002
|
var CREATE_ORG_VALUE = "__create_new_org__";
|
|
4179
4003
|
function CreateProductWindow({
|
|
4180
4004
|
organizations,
|
|
@@ -4207,10 +4031,10 @@ function CreateProductWindow({
|
|
|
4207
4031
|
}
|
|
4208
4032
|
});
|
|
4209
4033
|
const showSelect = organizations.length > 0;
|
|
4210
|
-
return /* @__PURE__ */
|
|
4211
|
-
showSelect && /* @__PURE__ */
|
|
4212
|
-
/* @__PURE__ */
|
|
4213
|
-
/* @__PURE__ */
|
|
4034
|
+
return /* @__PURE__ */ jsxs39("div", { className: "flex w-full max-w-md flex-col gap-6", children: [
|
|
4035
|
+
showSelect && /* @__PURE__ */ jsxs39("div", { className: "space-y-2", children: [
|
|
4036
|
+
/* @__PURE__ */ jsx72("span", { className: "text-sm font-medium leading-none text-text-primary", children: "Organization" }),
|
|
4037
|
+
/* @__PURE__ */ jsx72(
|
|
4214
4038
|
Select,
|
|
4215
4039
|
{
|
|
4216
4040
|
"data-testid": "create-product-org-select",
|
|
@@ -4223,9 +4047,9 @@ function CreateProductWindow({
|
|
|
4223
4047
|
}
|
|
4224
4048
|
)
|
|
4225
4049
|
] }),
|
|
4226
|
-
!createOrgMode && /* @__PURE__ */
|
|
4227
|
-
/* @__PURE__ */
|
|
4228
|
-
productsLoading ? /* @__PURE__ */
|
|
4050
|
+
!createOrgMode && /* @__PURE__ */ jsxs39("div", { className: "space-y-2", children: [
|
|
4051
|
+
/* @__PURE__ */ jsx72("span", { className: "text-sm font-medium leading-none text-text-primary", children: "Products" }),
|
|
4052
|
+
productsLoading ? /* @__PURE__ */ jsx72("p", { className: "text-sm text-text-tertiary", children: "Loading products\u2026" }) : products.length === 0 ? /* @__PURE__ */ jsx72("p", { className: "text-sm text-text-tertiary", children: "No products yet." }) : /* @__PURE__ */ jsx72("ul", { className: "flex flex-col gap-1", children: products.map((product) => /* @__PURE__ */ jsx72("li", { children: /* @__PURE__ */ jsxs39(
|
|
4229
4053
|
"button",
|
|
4230
4054
|
{
|
|
4231
4055
|
type: "button",
|
|
@@ -4234,14 +4058,14 @@ function CreateProductWindow({
|
|
|
4234
4058
|
"flex w-full items-center justify-between rounded-md border border-border-default bg-bg-primary px-3 py-2 text-left text-sm text-text-primary hover:bg-bg-secondary focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-border-focus"
|
|
4235
4059
|
),
|
|
4236
4060
|
children: [
|
|
4237
|
-
/* @__PURE__ */
|
|
4238
|
-
/* @__PURE__ */
|
|
4061
|
+
/* @__PURE__ */ jsx72("span", { className: "truncate", children: product.name }),
|
|
4062
|
+
/* @__PURE__ */ jsx72("span", { className: "ml-2 truncate text-text-tertiary", children: product.slug })
|
|
4239
4063
|
]
|
|
4240
4064
|
}
|
|
4241
4065
|
) }, product.id)) })
|
|
4242
4066
|
] }),
|
|
4243
|
-
/* @__PURE__ */
|
|
4244
|
-
createOrgMode && /* @__PURE__ */
|
|
4067
|
+
/* @__PURE__ */ jsx72(Form, { ...form, children: /* @__PURE__ */ jsxs39("form", { onSubmit: handleSubmit, className: "flex flex-col gap-4", noValidate: true, children: [
|
|
4068
|
+
createOrgMode && /* @__PURE__ */ jsx72(
|
|
4245
4069
|
FormField,
|
|
4246
4070
|
{
|
|
4247
4071
|
control: form.control,
|
|
@@ -4249,14 +4073,14 @@ function CreateProductWindow({
|
|
|
4249
4073
|
rules: {
|
|
4250
4074
|
validate: (value) => value.trim().length > 0 || "Organization name is required"
|
|
4251
4075
|
},
|
|
4252
|
-
render: ({ field }) => /* @__PURE__ */
|
|
4253
|
-
/* @__PURE__ */
|
|
4254
|
-
/* @__PURE__ */
|
|
4255
|
-
/* @__PURE__ */
|
|
4076
|
+
render: ({ field }) => /* @__PURE__ */ jsxs39(FormItem, { children: [
|
|
4077
|
+
/* @__PURE__ */ jsx72(FormLabel, { children: "Organization name" }),
|
|
4078
|
+
/* @__PURE__ */ jsx72(FormControl, { children: /* @__PURE__ */ jsx72(Input, { placeholder: "Acme Inc.", ...field }) }),
|
|
4079
|
+
/* @__PURE__ */ jsx72(FormMessage, {})
|
|
4256
4080
|
] })
|
|
4257
4081
|
}
|
|
4258
4082
|
),
|
|
4259
|
-
/* @__PURE__ */
|
|
4083
|
+
/* @__PURE__ */ jsx72(
|
|
4260
4084
|
FormField,
|
|
4261
4085
|
{
|
|
4262
4086
|
control: form.control,
|
|
@@ -4264,15 +4088,15 @@ function CreateProductWindow({
|
|
|
4264
4088
|
rules: {
|
|
4265
4089
|
validate: (value) => value.trim().length > 0 || "Product name is required"
|
|
4266
4090
|
},
|
|
4267
|
-
render: ({ field }) => /* @__PURE__ */
|
|
4268
|
-
/* @__PURE__ */
|
|
4269
|
-
/* @__PURE__ */
|
|
4270
|
-
/* @__PURE__ */
|
|
4091
|
+
render: ({ field }) => /* @__PURE__ */ jsxs39(FormItem, { children: [
|
|
4092
|
+
/* @__PURE__ */ jsx72(FormLabel, { children: "Product name" }),
|
|
4093
|
+
/* @__PURE__ */ jsx72(FormControl, { children: /* @__PURE__ */ jsx72(Input, { placeholder: "My product", ...field }) }),
|
|
4094
|
+
/* @__PURE__ */ jsx72(FormMessage, {})
|
|
4271
4095
|
] })
|
|
4272
4096
|
}
|
|
4273
4097
|
),
|
|
4274
|
-
error && /* @__PURE__ */
|
|
4275
|
-
/* @__PURE__ */
|
|
4098
|
+
error && /* @__PURE__ */ jsx72(InlineError, { children: error }),
|
|
4099
|
+
/* @__PURE__ */ jsx72(Button, { type: "submit", disabled: submitting, children: "Create product" })
|
|
4276
4100
|
] }) })
|
|
4277
4101
|
] });
|
|
4278
4102
|
}
|
|
@@ -4311,18 +4135,18 @@ function isNotificationSettled(item) {
|
|
|
4311
4135
|
}
|
|
4312
4136
|
|
|
4313
4137
|
// src/components/notification-bell.tsx
|
|
4314
|
-
import * as
|
|
4138
|
+
import * as React60 from "react";
|
|
4315
4139
|
import { BellRing, Check as Check7, Settings } from "lucide-react";
|
|
4316
|
-
import { jsx as
|
|
4140
|
+
import { jsx as jsx73, jsxs as jsxs40 } from "react/jsx-runtime";
|
|
4317
4141
|
function MarkReadButton({ title, onClick }) {
|
|
4318
|
-
return /* @__PURE__ */
|
|
4142
|
+
return /* @__PURE__ */ jsx73(
|
|
4319
4143
|
"button",
|
|
4320
4144
|
{
|
|
4321
4145
|
type: "button",
|
|
4322
4146
|
"aria-label": `Mark "${title}" as read`,
|
|
4323
4147
|
onClick,
|
|
4324
4148
|
className: "flex size-5 shrink-0 items-center justify-center rounded text-text-tertiary opacity-0 transition-opacity hover:text-text-primary focus-visible:opacity-100 group-hover:opacity-100",
|
|
4325
|
-
children: /* @__PURE__ */
|
|
4149
|
+
children: /* @__PURE__ */ jsx73(Check7, { className: "size-3.5", "aria-hidden": "true" })
|
|
4326
4150
|
}
|
|
4327
4151
|
);
|
|
4328
4152
|
}
|
|
@@ -4338,10 +4162,10 @@ function BellRow({
|
|
|
4338
4162
|
const markable = Boolean(onMarkRead) && unread && item.cls !== "ephemeral";
|
|
4339
4163
|
const actions = settled ? [] : item.actions ?? [];
|
|
4340
4164
|
const age = item.createdAt ? formatAge(item.createdAt instanceof Date ? item.createdAt : new Date(item.createdAt)) : null;
|
|
4341
|
-
return /* @__PURE__ */
|
|
4342
|
-
/* @__PURE__ */
|
|
4343
|
-
/* @__PURE__ */
|
|
4344
|
-
/* @__PURE__ */
|
|
4165
|
+
return /* @__PURE__ */ jsxs40("div", { className: cn("group rounded-lg bg-bg-surface px-3 py-2.5", settled && "opacity-45"), children: [
|
|
4166
|
+
/* @__PURE__ */ jsxs40("div", { className: "flex items-start gap-2.5", children: [
|
|
4167
|
+
/* @__PURE__ */ jsxs40("div", { className: "min-w-0 flex-1", children: [
|
|
4168
|
+
/* @__PURE__ */ jsx73(
|
|
4345
4169
|
"button",
|
|
4346
4170
|
{
|
|
4347
4171
|
type: "button",
|
|
@@ -4353,20 +4177,20 @@ function BellRow({
|
|
|
4353
4177
|
children: item.title
|
|
4354
4178
|
}
|
|
4355
4179
|
),
|
|
4356
|
-
/* @__PURE__ */
|
|
4357
|
-
/* @__PURE__ */
|
|
4180
|
+
/* @__PURE__ */ jsxs40("p", { className: "mt-1 truncate text-xs text-text-tertiary", children: [
|
|
4181
|
+
/* @__PURE__ */ jsx73("span", { className: "font-semibold uppercase tracking-wide text-text-secondary", children: item.source }),
|
|
4358
4182
|
item.receipt ? `, ${item.receipt}` : ""
|
|
4359
4183
|
] })
|
|
4360
4184
|
] }),
|
|
4361
|
-
(age || markable) && /* @__PURE__ */
|
|
4362
|
-
age && /* @__PURE__ */
|
|
4363
|
-
markable && /* @__PURE__ */
|
|
4185
|
+
(age || markable) && /* @__PURE__ */ jsxs40("div", { className: "mt-px flex shrink-0 items-center gap-1", children: [
|
|
4186
|
+
age && /* @__PURE__ */ jsx73("span", { className: "text-xs text-text-tertiary", children: age }),
|
|
4187
|
+
markable && /* @__PURE__ */ jsx73(MarkReadButton, { title: item.title, onClick: () => onMarkRead(item.id) })
|
|
4364
4188
|
] })
|
|
4365
4189
|
] }),
|
|
4366
|
-
(actions.length > 0 || item.deepLink) && /* @__PURE__ */
|
|
4190
|
+
(actions.length > 0 || item.deepLink) && /* @__PURE__ */ jsxs40("div", { className: "mt-2 flex flex-wrap items-center gap-x-4 gap-y-2", children: [
|
|
4367
4191
|
actions.map((action) => {
|
|
4368
4192
|
const chip = action.variant === "primary" || action.variant === "destructive";
|
|
4369
|
-
return /* @__PURE__ */
|
|
4193
|
+
return /* @__PURE__ */ jsx73(
|
|
4370
4194
|
"button",
|
|
4371
4195
|
{
|
|
4372
4196
|
type: "button",
|
|
@@ -4381,7 +4205,7 @@ function BellRow({
|
|
|
4381
4205
|
action.id
|
|
4382
4206
|
);
|
|
4383
4207
|
}),
|
|
4384
|
-
item.deepLink && /* @__PURE__ */
|
|
4208
|
+
item.deepLink && /* @__PURE__ */ jsx73(
|
|
4385
4209
|
"button",
|
|
4386
4210
|
{
|
|
4387
4211
|
type: "button",
|
|
@@ -4393,7 +4217,7 @@ function BellRow({
|
|
|
4393
4217
|
] })
|
|
4394
4218
|
] });
|
|
4395
4219
|
}
|
|
4396
|
-
var NotificationBell =
|
|
4220
|
+
var NotificationBell = React60.forwardRef(
|
|
4397
4221
|
({
|
|
4398
4222
|
items,
|
|
4399
4223
|
unreadCount,
|
|
@@ -4410,13 +4234,13 @@ var NotificationBell = React61.forwardRef(
|
|
|
4410
4234
|
className
|
|
4411
4235
|
}, ref) => {
|
|
4412
4236
|
const unread = unreadCount ?? items.filter((n) => !n.read && n.cls !== "ephemeral").length;
|
|
4413
|
-
const age =
|
|
4237
|
+
const age = React60.useCallback(
|
|
4414
4238
|
(createdAt) => formatAge ? formatAge(createdAt) : formatRelativeAge(createdAt),
|
|
4415
4239
|
[formatAge]
|
|
4416
4240
|
);
|
|
4417
4241
|
const rows = items.slice(0, maxItems);
|
|
4418
|
-
return /* @__PURE__ */
|
|
4419
|
-
/* @__PURE__ */
|
|
4242
|
+
return /* @__PURE__ */ jsxs40(Popover, { open, onOpenChange, children: [
|
|
4243
|
+
/* @__PURE__ */ jsx73(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs40(
|
|
4420
4244
|
"button",
|
|
4421
4245
|
{
|
|
4422
4246
|
ref,
|
|
@@ -4427,16 +4251,16 @@ var NotificationBell = React61.forwardRef(
|
|
|
4427
4251
|
className
|
|
4428
4252
|
),
|
|
4429
4253
|
children: [
|
|
4430
|
-
/* @__PURE__ */
|
|
4431
|
-
unread > 0 && /* @__PURE__ */
|
|
4254
|
+
/* @__PURE__ */ jsx73(BellRing, { className: "size-[18px]", "aria-hidden": "true" }),
|
|
4255
|
+
unread > 0 && /* @__PURE__ */ jsx73("span", { className: "absolute -right-1.5 -top-1.5 flex size-[17px] items-center justify-center rounded-full bg-bg-brand text-xs font-bold leading-none text-text-on-brand ring-2 ring-bg-surface", children: unread })
|
|
4432
4256
|
]
|
|
4433
4257
|
}
|
|
4434
4258
|
) }),
|
|
4435
|
-
/* @__PURE__ */
|
|
4436
|
-
/* @__PURE__ */
|
|
4437
|
-
/* @__PURE__ */
|
|
4438
|
-
/* @__PURE__ */
|
|
4439
|
-
/* @__PURE__ */
|
|
4259
|
+
/* @__PURE__ */ jsxs40(PopoverContent, { align: "end", className: "w-[380px] overflow-hidden p-0", children: [
|
|
4260
|
+
/* @__PURE__ */ jsxs40("div", { className: "flex items-center justify-between px-5 py-3", children: [
|
|
4261
|
+
/* @__PURE__ */ jsx73("span", { className: "text-sm font-bold text-text-primary", children: "Notification center" }),
|
|
4262
|
+
/* @__PURE__ */ jsxs40("div", { className: "flex items-center gap-3", children: [
|
|
4263
|
+
/* @__PURE__ */ jsx73(
|
|
4440
4264
|
"button",
|
|
4441
4265
|
{
|
|
4442
4266
|
type: "button",
|
|
@@ -4449,19 +4273,19 @@ var NotificationBell = React61.forwardRef(
|
|
|
4449
4273
|
children: "Mark all read"
|
|
4450
4274
|
}
|
|
4451
4275
|
),
|
|
4452
|
-
onOpenSettings && /* @__PURE__ */
|
|
4276
|
+
onOpenSettings && /* @__PURE__ */ jsx73(
|
|
4453
4277
|
"button",
|
|
4454
4278
|
{
|
|
4455
4279
|
type: "button",
|
|
4456
4280
|
"aria-label": "Notification settings",
|
|
4457
4281
|
onClick: () => onOpenSettings(),
|
|
4458
4282
|
className: "flex size-6 items-center justify-center rounded-md text-text-tertiary transition-colors hover:bg-bg-surface hover:text-text-primary",
|
|
4459
|
-
children: /* @__PURE__ */
|
|
4283
|
+
children: /* @__PURE__ */ jsx73(Settings, { className: "size-[15px]", "aria-hidden": "true" })
|
|
4460
4284
|
}
|
|
4461
4285
|
)
|
|
4462
4286
|
] })
|
|
4463
4287
|
] }),
|
|
4464
|
-
/* @__PURE__ */
|
|
4288
|
+
/* @__PURE__ */ jsx73("div", { className: "space-y-1.5 px-2 pb-2", children: rows.length === 0 ? /* @__PURE__ */ jsx73("p", { className: "px-3 py-12 text-center text-xs leading-relaxed text-text-disabled", children: "Nothing yet. Everything addressed to you lands here." }) : rows.map((item) => /* @__PURE__ */ jsx73(
|
|
4465
4289
|
BellRow,
|
|
4466
4290
|
{
|
|
4467
4291
|
item,
|
|
@@ -4472,7 +4296,7 @@ var NotificationBell = React61.forwardRef(
|
|
|
4472
4296
|
},
|
|
4473
4297
|
item.id
|
|
4474
4298
|
)) }),
|
|
4475
|
-
items.length > 0 && onOpenArchive && /* @__PURE__ */
|
|
4299
|
+
items.length > 0 && onOpenArchive && /* @__PURE__ */ jsx73(
|
|
4476
4300
|
"button",
|
|
4477
4301
|
{
|
|
4478
4302
|
type: "button",
|
|
@@ -4488,21 +4312,21 @@ var NotificationBell = React61.forwardRef(
|
|
|
4488
4312
|
NotificationBell.displayName = "NotificationBell";
|
|
4489
4313
|
|
|
4490
4314
|
// src/components/notification-center.tsx
|
|
4491
|
-
import * as
|
|
4315
|
+
import * as React61 from "react";
|
|
4492
4316
|
import { ArrowUpRight, Check as Check8, Search as Search2 } from "lucide-react";
|
|
4493
|
-
import { jsx as
|
|
4317
|
+
import { jsx as jsx74, jsxs as jsxs41 } from "react/jsx-runtime";
|
|
4494
4318
|
var chipBase = "rounded-lg px-3 py-1.5 text-sm font-medium transition-colors";
|
|
4495
4319
|
var chipOn = "bg-bg-brand-subtle text-text-brand";
|
|
4496
4320
|
var chipOff = "bg-bg-elevated text-text-secondary hover:text-text-primary";
|
|
4497
4321
|
function MarkReadButton2({ title, onClick }) {
|
|
4498
|
-
return /* @__PURE__ */
|
|
4322
|
+
return /* @__PURE__ */ jsx74(
|
|
4499
4323
|
"button",
|
|
4500
4324
|
{
|
|
4501
4325
|
type: "button",
|
|
4502
4326
|
"aria-label": `Mark "${title}" as read`,
|
|
4503
4327
|
onClick,
|
|
4504
4328
|
className: "flex size-5 shrink-0 items-center justify-center rounded text-text-tertiary opacity-0 transition-opacity hover:text-text-primary focus-visible:opacity-100 group-hover:opacity-100",
|
|
4505
|
-
children: /* @__PURE__ */
|
|
4329
|
+
children: /* @__PURE__ */ jsx74(Check8, { className: "size-3.5", "aria-hidden": "true" })
|
|
4506
4330
|
}
|
|
4507
4331
|
);
|
|
4508
4332
|
}
|
|
@@ -4516,16 +4340,16 @@ function CenterRow({
|
|
|
4516
4340
|
const unread = !item.read;
|
|
4517
4341
|
const markable = Boolean(onMarkRead) && unread && item.cls !== "ephemeral";
|
|
4518
4342
|
const age = item.createdAt ? formatAge(item.createdAt instanceof Date ? item.createdAt : new Date(item.createdAt)) : null;
|
|
4519
|
-
return /* @__PURE__ */
|
|
4520
|
-
/* @__PURE__ */
|
|
4521
|
-
/* @__PURE__ */
|
|
4522
|
-
/* @__PURE__ */
|
|
4523
|
-
(age || markable) && /* @__PURE__ */
|
|
4524
|
-
age && /* @__PURE__ */
|
|
4525
|
-
markable && /* @__PURE__ */
|
|
4343
|
+
return /* @__PURE__ */ jsxs41("article", { className: "group rounded-lg bg-bg-elevated px-4 py-3", children: [
|
|
4344
|
+
/* @__PURE__ */ jsxs41("div", { className: "flex items-center gap-2", children: [
|
|
4345
|
+
/* @__PURE__ */ jsx74("span", { className: "text-xs font-semibold uppercase tracking-[0.09em] text-text-secondary", children: item.source }),
|
|
4346
|
+
/* @__PURE__ */ jsx74(Badge, { variant: severityBadgeVariant(item.severity), children: severityLabels[item.severity] }),
|
|
4347
|
+
(age || markable) && /* @__PURE__ */ jsxs41("div", { className: "ml-auto flex shrink-0 items-center gap-1.5", children: [
|
|
4348
|
+
age && /* @__PURE__ */ jsx74("span", { className: "text-xs tabular-nums text-text-tertiary", children: age }),
|
|
4349
|
+
markable && /* @__PURE__ */ jsx74(MarkReadButton2, { title: item.title, onClick: () => onMarkRead(item.id) })
|
|
4526
4350
|
] })
|
|
4527
4351
|
] }),
|
|
4528
|
-
/* @__PURE__ */
|
|
4352
|
+
/* @__PURE__ */ jsx74(
|
|
4529
4353
|
"button",
|
|
4530
4354
|
{
|
|
4531
4355
|
type: "button",
|
|
@@ -4537,13 +4361,13 @@ function CenterRow({
|
|
|
4537
4361
|
children: item.title
|
|
4538
4362
|
}
|
|
4539
4363
|
),
|
|
4540
|
-
item.body && /* @__PURE__ */
|
|
4541
|
-
(item.receipt || item.deepLink) && /* @__PURE__ */
|
|
4542
|
-
item.receipt && /* @__PURE__ */
|
|
4543
|
-
/* @__PURE__ */
|
|
4364
|
+
item.body && /* @__PURE__ */ jsx74("p", { className: "mt-0.5 text-sm leading-snug text-text-secondary", children: item.body }),
|
|
4365
|
+
(item.receipt || item.deepLink) && /* @__PURE__ */ jsxs41("div", { className: "mt-2 flex flex-wrap items-center gap-x-4 gap-y-1.5", children: [
|
|
4366
|
+
item.receipt && /* @__PURE__ */ jsxs41("span", { className: "inline-flex items-center gap-1.5 text-sm text-text-tertiary", children: [
|
|
4367
|
+
/* @__PURE__ */ jsx74(Check8, { className: "size-3 shrink-0 text-text-success", "aria-hidden": "true" }),
|
|
4544
4368
|
item.receipt
|
|
4545
4369
|
] }),
|
|
4546
|
-
item.deepLink && /* @__PURE__ */
|
|
4370
|
+
item.deepLink && /* @__PURE__ */ jsxs41(
|
|
4547
4371
|
"button",
|
|
4548
4372
|
{
|
|
4549
4373
|
type: "button",
|
|
@@ -4551,14 +4375,14 @@ function CenterRow({
|
|
|
4551
4375
|
className: "inline-flex items-center gap-1 text-sm font-medium text-text-brand transition-colors hover:text-text-primary",
|
|
4552
4376
|
children: [
|
|
4553
4377
|
item.deepLink.label,
|
|
4554
|
-
/* @__PURE__ */
|
|
4378
|
+
/* @__PURE__ */ jsx74(ArrowUpRight, { className: "size-3", "aria-hidden": "true" })
|
|
4555
4379
|
]
|
|
4556
4380
|
}
|
|
4557
4381
|
)
|
|
4558
4382
|
] })
|
|
4559
4383
|
] });
|
|
4560
4384
|
}
|
|
4561
|
-
var NotificationCenter =
|
|
4385
|
+
var NotificationCenter = React61.forwardRef(
|
|
4562
4386
|
({
|
|
4563
4387
|
items,
|
|
4564
4388
|
title = "Notifications",
|
|
@@ -4574,16 +4398,16 @@ var NotificationCenter = React62.forwardRef(
|
|
|
4574
4398
|
formatAge,
|
|
4575
4399
|
className
|
|
4576
4400
|
}, ref) => {
|
|
4577
|
-
const [status, setStatus] =
|
|
4578
|
-
const [source, setSource] =
|
|
4579
|
-
const [product, setProduct] =
|
|
4580
|
-
const [query, setQuery] =
|
|
4581
|
-
const [limit, setLimit] =
|
|
4582
|
-
const age =
|
|
4401
|
+
const [status, setStatus] = React61.useState("all");
|
|
4402
|
+
const [source, setSource] = React61.useState("all");
|
|
4403
|
+
const [product, setProduct] = React61.useState("all");
|
|
4404
|
+
const [query, setQuery] = React61.useState("");
|
|
4405
|
+
const [limit, setLimit] = React61.useState(pageSize);
|
|
4406
|
+
const age = React61.useCallback(
|
|
4583
4407
|
(createdAt) => formatAge ? formatAge(createdAt) : formatRelativeAge(createdAt),
|
|
4584
4408
|
[formatAge]
|
|
4585
4409
|
);
|
|
4586
|
-
const sourceChips =
|
|
4410
|
+
const sourceChips = React61.useMemo(
|
|
4587
4411
|
() => sources ?? Array.from(new Set(items.map((n) => n.source))),
|
|
4588
4412
|
[sources, items]
|
|
4589
4413
|
);
|
|
@@ -4594,13 +4418,13 @@ var NotificationCenter = React62.forwardRef(
|
|
|
4594
4418
|
const shown = matched.slice(0, limit);
|
|
4595
4419
|
const remaining = matched.length - shown.length;
|
|
4596
4420
|
const filtering = q !== "" || status !== "all" || source !== "all" || product !== "all";
|
|
4597
|
-
return /* @__PURE__ */
|
|
4598
|
-
/* @__PURE__ */
|
|
4599
|
-
/* @__PURE__ */
|
|
4600
|
-
/* @__PURE__ */
|
|
4601
|
-
description && /* @__PURE__ */
|
|
4421
|
+
return /* @__PURE__ */ jsxs41("div", { ref, className: cn("mx-auto max-w-[560px]", className), children: [
|
|
4422
|
+
/* @__PURE__ */ jsxs41("div", { className: "mb-4 flex items-start gap-4", children: [
|
|
4423
|
+
/* @__PURE__ */ jsxs41("div", { className: "min-w-0 flex-1", children: [
|
|
4424
|
+
/* @__PURE__ */ jsx74("h1", { className: "mb-1.5 text-2xl font-semibold tracking-tight text-text-primary", children: title }),
|
|
4425
|
+
description && /* @__PURE__ */ jsx74("p", { className: "text-sm text-text-tertiary", children: description })
|
|
4602
4426
|
] }),
|
|
4603
|
-
onMarkAllRead && /* @__PURE__ */
|
|
4427
|
+
onMarkAllRead && /* @__PURE__ */ jsx74(
|
|
4604
4428
|
"button",
|
|
4605
4429
|
{
|
|
4606
4430
|
type: "button",
|
|
@@ -4610,9 +4434,9 @@ var NotificationCenter = React62.forwardRef(
|
|
|
4610
4434
|
}
|
|
4611
4435
|
)
|
|
4612
4436
|
] }),
|
|
4613
|
-
searchable && /* @__PURE__ */
|
|
4614
|
-
/* @__PURE__ */
|
|
4615
|
-
/* @__PURE__ */
|
|
4437
|
+
searchable && /* @__PURE__ */ jsxs41("div", { className: "mb-3 flex items-center gap-2 rounded-lg bg-bg-elevated px-3 py-2", children: [
|
|
4438
|
+
/* @__PURE__ */ jsx74(Search2, { className: "size-4 shrink-0 text-text-tertiary", "aria-hidden": "true" }),
|
|
4439
|
+
/* @__PURE__ */ jsx74(
|
|
4616
4440
|
"input",
|
|
4617
4441
|
{
|
|
4618
4442
|
type: "text",
|
|
@@ -4623,8 +4447,8 @@ var NotificationCenter = React62.forwardRef(
|
|
|
4623
4447
|
}
|
|
4624
4448
|
)
|
|
4625
4449
|
] }),
|
|
4626
|
-
/* @__PURE__ */
|
|
4627
|
-
/* @__PURE__ */
|
|
4450
|
+
/* @__PURE__ */ jsxs41("div", { className: "mb-2 flex flex-wrap gap-1.5", children: [
|
|
4451
|
+
/* @__PURE__ */ jsx74(
|
|
4628
4452
|
"button",
|
|
4629
4453
|
{
|
|
4630
4454
|
type: "button",
|
|
@@ -4633,7 +4457,7 @@ var NotificationCenter = React62.forwardRef(
|
|
|
4633
4457
|
children: "All"
|
|
4634
4458
|
}
|
|
4635
4459
|
),
|
|
4636
|
-
/* @__PURE__ */
|
|
4460
|
+
/* @__PURE__ */ jsx74(
|
|
4637
4461
|
"button",
|
|
4638
4462
|
{
|
|
4639
4463
|
type: "button",
|
|
@@ -4643,8 +4467,8 @@ var NotificationCenter = React62.forwardRef(
|
|
|
4643
4467
|
}
|
|
4644
4468
|
)
|
|
4645
4469
|
] }),
|
|
4646
|
-
/* @__PURE__ */
|
|
4647
|
-
/* @__PURE__ */
|
|
4470
|
+
/* @__PURE__ */ jsxs41("div", { className: "mb-2 flex flex-wrap gap-1.5", children: [
|
|
4471
|
+
/* @__PURE__ */ jsx74(
|
|
4648
4472
|
"button",
|
|
4649
4473
|
{
|
|
4650
4474
|
type: "button",
|
|
@@ -4653,7 +4477,7 @@ var NotificationCenter = React62.forwardRef(
|
|
|
4653
4477
|
children: "All sources"
|
|
4654
4478
|
}
|
|
4655
4479
|
),
|
|
4656
|
-
sourceChips.map((s) => /* @__PURE__ */
|
|
4480
|
+
sourceChips.map((s) => /* @__PURE__ */ jsx74(
|
|
4657
4481
|
"button",
|
|
4658
4482
|
{
|
|
4659
4483
|
type: "button",
|
|
@@ -4664,8 +4488,8 @@ var NotificationCenter = React62.forwardRef(
|
|
|
4664
4488
|
s
|
|
4665
4489
|
))
|
|
4666
4490
|
] }),
|
|
4667
|
-
products && products.length > 0 && /* @__PURE__ */
|
|
4668
|
-
/* @__PURE__ */
|
|
4491
|
+
products && products.length > 0 && /* @__PURE__ */ jsxs41("div", { className: "mb-4 flex flex-wrap gap-1.5", children: [
|
|
4492
|
+
/* @__PURE__ */ jsx74(
|
|
4669
4493
|
"button",
|
|
4670
4494
|
{
|
|
4671
4495
|
type: "button",
|
|
@@ -4674,7 +4498,7 @@ var NotificationCenter = React62.forwardRef(
|
|
|
4674
4498
|
children: "All products"
|
|
4675
4499
|
}
|
|
4676
4500
|
),
|
|
4677
|
-
products.map((p) => /* @__PURE__ */
|
|
4501
|
+
products.map((p) => /* @__PURE__ */ jsx74(
|
|
4678
4502
|
"button",
|
|
4679
4503
|
{
|
|
4680
4504
|
type: "button",
|
|
@@ -4685,8 +4509,8 @@ var NotificationCenter = React62.forwardRef(
|
|
|
4685
4509
|
p.id
|
|
4686
4510
|
))
|
|
4687
4511
|
] }),
|
|
4688
|
-
shown.length === 0 ? /* @__PURE__ */
|
|
4689
|
-
shown.map((item) => /* @__PURE__ */
|
|
4512
|
+
shown.length === 0 ? /* @__PURE__ */ jsx74("p", { className: "rounded-xl bg-bg-elevated px-4 py-10 text-center text-sm leading-relaxed text-text-disabled", children: filtering ? "Nothing matches." : "Nothing here yet. Everything addressed to you lands here." }) : /* @__PURE__ */ jsxs41("div", { className: "flex flex-col gap-1.5", children: [
|
|
4513
|
+
shown.map((item) => /* @__PURE__ */ jsx74(
|
|
4690
4514
|
CenterRow,
|
|
4691
4515
|
{
|
|
4692
4516
|
item,
|
|
@@ -4697,7 +4521,7 @@ var NotificationCenter = React62.forwardRef(
|
|
|
4697
4521
|
},
|
|
4698
4522
|
item.id
|
|
4699
4523
|
)),
|
|
4700
|
-
remaining > 0 && /* @__PURE__ */
|
|
4524
|
+
remaining > 0 && /* @__PURE__ */ jsxs41(
|
|
4701
4525
|
"button",
|
|
4702
4526
|
{
|
|
4703
4527
|
type: "button",
|
|
@@ -4717,9 +4541,9 @@ var NotificationCenter = React62.forwardRef(
|
|
|
4717
4541
|
NotificationCenter.displayName = "NotificationCenter";
|
|
4718
4542
|
|
|
4719
4543
|
// src/components/notification-settings.tsx
|
|
4720
|
-
import * as
|
|
4544
|
+
import * as React62 from "react";
|
|
4721
4545
|
import { Moon as Moon2, Plus as Plus2, Volume2 } from "lucide-react";
|
|
4722
|
-
import { Fragment as
|
|
4546
|
+
import { Fragment as Fragment8, jsx as jsx75, jsxs as jsxs42 } from "react/jsx-runtime";
|
|
4723
4547
|
var THRESHOLDS = [
|
|
4724
4548
|
["everything", "Everything"],
|
|
4725
4549
|
["important", "Important"],
|
|
@@ -4731,13 +4555,13 @@ function ThresholdControl({
|
|
|
4731
4555
|
value,
|
|
4732
4556
|
onChange
|
|
4733
4557
|
}) {
|
|
4734
|
-
return /* @__PURE__ */
|
|
4558
|
+
return /* @__PURE__ */ jsx75(
|
|
4735
4559
|
"span",
|
|
4736
4560
|
{
|
|
4737
4561
|
role: "group",
|
|
4738
4562
|
"aria-label": `Interrupt me for ${label}`,
|
|
4739
4563
|
className: "inline-flex shrink-0 overflow-hidden rounded-md bg-bg-primary",
|
|
4740
|
-
children: THRESHOLDS.map(([threshold, text]) => /* @__PURE__ */
|
|
4564
|
+
children: THRESHOLDS.map(([threshold, text]) => /* @__PURE__ */ jsx75(
|
|
4741
4565
|
"button",
|
|
4742
4566
|
{
|
|
4743
4567
|
type: "button",
|
|
@@ -4754,7 +4578,7 @@ function ThresholdControl({
|
|
|
4754
4578
|
}
|
|
4755
4579
|
);
|
|
4756
4580
|
}
|
|
4757
|
-
var NotificationSettings =
|
|
4581
|
+
var NotificationSettings = React62.forwardRef(
|
|
4758
4582
|
({
|
|
4759
4583
|
subscriptions,
|
|
4760
4584
|
value,
|
|
@@ -4767,7 +4591,7 @@ var NotificationSettings = React63.forwardRef(
|
|
|
4767
4591
|
pushSlot,
|
|
4768
4592
|
className
|
|
4769
4593
|
}, ref) => {
|
|
4770
|
-
const [tab, setTab] =
|
|
4594
|
+
const [tab, setTab] = React62.useState(DEFAULT_KEY);
|
|
4771
4595
|
const isDefault = tab === DEFAULT_KEY;
|
|
4772
4596
|
const defaults = value[DEFAULT_KEY] ?? { thresholds: {} };
|
|
4773
4597
|
const customized = !isDefault && Object.prototype.hasOwnProperty.call(value, tab);
|
|
@@ -4787,15 +4611,15 @@ var NotificationSettings = React63.forwardRef(
|
|
|
4787
4611
|
const scopeGroup = (scope) => {
|
|
4788
4612
|
const rows = subscriptions.filter((s) => s.scope === scope);
|
|
4789
4613
|
if (rows.length === 0) return null;
|
|
4790
|
-
return /* @__PURE__ */
|
|
4791
|
-
/* @__PURE__ */
|
|
4792
|
-
/* @__PURE__ */
|
|
4614
|
+
return /* @__PURE__ */ jsxs42("div", { children: [
|
|
4615
|
+
/* @__PURE__ */ jsx75("p", { className: "mb-1.5 px-0.5 text-xs font-bold uppercase tracking-wider text-text-tertiary", children: scope === "product" ? "This product" : "Organization" }),
|
|
4616
|
+
/* @__PURE__ */ jsx75("div", { className: "space-y-2", children: rows.map((sub) => /* @__PURE__ */ jsxs42(
|
|
4793
4617
|
"div",
|
|
4794
4618
|
{
|
|
4795
4619
|
className: "flex items-center gap-4 rounded-xl bg-bg-elevated px-4 py-3",
|
|
4796
4620
|
children: [
|
|
4797
|
-
/* @__PURE__ */
|
|
4798
|
-
/* @__PURE__ */
|
|
4621
|
+
/* @__PURE__ */ jsx75("p", { className: "min-w-0 flex-1 text-sm font-semibold text-text-primary", children: sub.name }),
|
|
4622
|
+
/* @__PURE__ */ jsx75(
|
|
4799
4623
|
ThresholdControl,
|
|
4800
4624
|
{
|
|
4801
4625
|
label: sub.name,
|
|
@@ -4809,10 +4633,10 @@ var NotificationSettings = React63.forwardRef(
|
|
|
4809
4633
|
)) })
|
|
4810
4634
|
] }, scope);
|
|
4811
4635
|
};
|
|
4812
|
-
return /* @__PURE__ */
|
|
4813
|
-
products && products.length > 0 && /* @__PURE__ */
|
|
4814
|
-
/* @__PURE__ */
|
|
4815
|
-
/* @__PURE__ */
|
|
4636
|
+
return /* @__PURE__ */ jsxs42("div", { ref, className: cn("space-y-5", className), children: [
|
|
4637
|
+
products && products.length > 0 && /* @__PURE__ */ jsxs42("div", { children: [
|
|
4638
|
+
/* @__PURE__ */ jsx75("p", { className: "mb-2 px-0.5 text-xs font-bold uppercase tracking-wider text-text-tertiary", children: "Preferences for" }),
|
|
4639
|
+
/* @__PURE__ */ jsx75("div", { className: "flex flex-wrap gap-2", children: [{ id: DEFAULT_KEY, label: "Default" }, ...products].map((t) => /* @__PURE__ */ jsxs42(
|
|
4816
4640
|
"button",
|
|
4817
4641
|
{
|
|
4818
4642
|
type: "button",
|
|
@@ -4823,32 +4647,32 @@ var NotificationSettings = React63.forwardRef(
|
|
|
4823
4647
|
),
|
|
4824
4648
|
children: [
|
|
4825
4649
|
t.label,
|
|
4826
|
-
t.id !== DEFAULT_KEY && Object.prototype.hasOwnProperty.call(value, t.id) && /* @__PURE__ */
|
|
4650
|
+
t.id !== DEFAULT_KEY && Object.prototype.hasOwnProperty.call(value, t.id) && /* @__PURE__ */ jsx75("span", { className: "size-1.5 rounded-full bg-bg-brand", "aria-label": "customized" })
|
|
4827
4651
|
]
|
|
4828
4652
|
},
|
|
4829
4653
|
t.id
|
|
4830
4654
|
)) })
|
|
4831
4655
|
] }),
|
|
4832
|
-
isDefault ? /* @__PURE__ */
|
|
4833
|
-
/* @__PURE__ */
|
|
4834
|
-
/* @__PURE__ */
|
|
4835
|
-
/* @__PURE__ */
|
|
4836
|
-
/* @__PURE__ */
|
|
4837
|
-
pushSlot ?? /* @__PURE__ */
|
|
4656
|
+
isDefault ? /* @__PURE__ */ jsxs42(Fragment8, { children: [
|
|
4657
|
+
/* @__PURE__ */ jsx75("p", { className: "text-sm leading-relaxed text-text-secondary", children: "Your defaults, applied to every product unless you customize one. Everything addressed to you always lands in the in-app record; that cannot be turned off." }),
|
|
4658
|
+
/* @__PURE__ */ jsxs42(Card, { className: "border-none bg-bg-elevated p-5", children: [
|
|
4659
|
+
/* @__PURE__ */ jsx75("p", { className: "mb-1.5 text-xs font-bold uppercase tracking-wide text-text-tertiary", children: "Push to" }),
|
|
4660
|
+
/* @__PURE__ */ jsx75("p", { className: "mb-3 text-sm leading-relaxed text-text-secondary", children: "Forward notifications beyond the in-app record to a connected integration." }),
|
|
4661
|
+
pushSlot ?? /* @__PURE__ */ jsx75("div", { className: "rounded-lg bg-bg-surface px-4 py-6 text-center", children: /* @__PURE__ */ jsx75("p", { className: "text-sm text-text-tertiary", children: "No integrations connected." }) })
|
|
4838
4662
|
] }),
|
|
4839
|
-
mutes.length > 0 && /* @__PURE__ */
|
|
4840
|
-
/* @__PURE__ */
|
|
4841
|
-
/* @__PURE__ */
|
|
4842
|
-
/* @__PURE__ */
|
|
4843
|
-
/* @__PURE__ */
|
|
4844
|
-
/* @__PURE__ */
|
|
4845
|
-
/* @__PURE__ */
|
|
4663
|
+
mutes.length > 0 && /* @__PURE__ */ jsxs42("div", { children: [
|
|
4664
|
+
/* @__PURE__ */ jsx75("p", { className: "mb-1.5 px-0.5 text-xs font-bold uppercase tracking-wider text-text-tertiary", children: "Muted" }),
|
|
4665
|
+
/* @__PURE__ */ jsx75(Card, { className: "border-none bg-bg-elevated p-2", children: mutes.map((m) => /* @__PURE__ */ jsxs42("div", { className: "flex items-center gap-3 rounded-lg px-3 py-2.5", children: [
|
|
4666
|
+
/* @__PURE__ */ jsx75(Moon2, { className: "size-4 shrink-0 text-text-tertiary", "aria-hidden": "true" }),
|
|
4667
|
+
/* @__PURE__ */ jsxs42("div", { className: "min-w-0 flex-1", children: [
|
|
4668
|
+
/* @__PURE__ */ jsx75("p", { className: "text-sm font-medium text-text-primary", children: m.source }),
|
|
4669
|
+
/* @__PURE__ */ jsxs42("p", { className: "text-sm text-text-tertiary", children: [
|
|
4846
4670
|
"Muted \u2014 ",
|
|
4847
4671
|
m.label,
|
|
4848
4672
|
". Critical still comes through."
|
|
4849
4673
|
] })
|
|
4850
4674
|
] }),
|
|
4851
|
-
/* @__PURE__ */
|
|
4675
|
+
/* @__PURE__ */ jsx75(
|
|
4852
4676
|
"button",
|
|
4853
4677
|
{
|
|
4854
4678
|
type: "button",
|
|
@@ -4861,13 +4685,13 @@ var NotificationSettings = React63.forwardRef(
|
|
|
4861
4685
|
] }),
|
|
4862
4686
|
scopeGroup("product"),
|
|
4863
4687
|
scopeGroup("org"),
|
|
4864
|
-
onSoundEnabledChange && /* @__PURE__ */
|
|
4865
|
-
/* @__PURE__ */
|
|
4866
|
-
/* @__PURE__ */
|
|
4867
|
-
/* @__PURE__ */
|
|
4868
|
-
/* @__PURE__ */
|
|
4688
|
+
onSoundEnabledChange && /* @__PURE__ */ jsx75(Card, { className: "border-none bg-bg-elevated p-4", children: /* @__PURE__ */ jsxs42("div", { className: "flex items-center gap-3", children: [
|
|
4689
|
+
/* @__PURE__ */ jsx75(Volume2, { className: "size-4 text-text-tertiary", "aria-hidden": "true" }),
|
|
4690
|
+
/* @__PURE__ */ jsxs42("div", { className: "flex-1", children: [
|
|
4691
|
+
/* @__PURE__ */ jsx75("p", { className: "text-sm font-medium text-text-primary", children: "Notification sound" }),
|
|
4692
|
+
/* @__PURE__ */ jsx75("p", { className: "text-sm text-text-tertiary", children: "Play a tone when a notification arrives. Critical always chimes." })
|
|
4869
4693
|
] }),
|
|
4870
|
-
/* @__PURE__ */
|
|
4694
|
+
/* @__PURE__ */ jsx75(
|
|
4871
4695
|
Switch,
|
|
4872
4696
|
{
|
|
4873
4697
|
checked: soundEnabled ?? false,
|
|
@@ -4876,35 +4700,35 @@ var NotificationSettings = React63.forwardRef(
|
|
|
4876
4700
|
}
|
|
4877
4701
|
)
|
|
4878
4702
|
] }) })
|
|
4879
|
-
] }) : !customized ? /* @__PURE__ */
|
|
4880
|
-
/* @__PURE__ */
|
|
4703
|
+
] }) : !customized ? /* @__PURE__ */ jsxs42(Card, { className: "border-none bg-bg-elevated p-8 text-center", children: [
|
|
4704
|
+
/* @__PURE__ */ jsxs42("p", { className: "text-sm font-semibold text-text-primary", children: [
|
|
4881
4705
|
productLabel,
|
|
4882
4706
|
" follows your Default preferences."
|
|
4883
4707
|
] }),
|
|
4884
|
-
/* @__PURE__ */
|
|
4885
|
-
/* @__PURE__ */
|
|
4708
|
+
/* @__PURE__ */ jsx75("p", { className: "mx-auto mt-1.5 max-w-[360px] text-sm leading-relaxed text-text-tertiary", children: "Interrupt thresholds, sound and forwarding all come from Default. Opt in to give this product its own interrupt thresholds." }),
|
|
4709
|
+
/* @__PURE__ */ jsxs42(
|
|
4886
4710
|
"button",
|
|
4887
4711
|
{
|
|
4888
4712
|
type: "button",
|
|
4889
4713
|
onClick: customize,
|
|
4890
4714
|
className: "mt-5 inline-flex items-center gap-1.5 rounded-lg bg-bg-brand px-3.5 py-2 text-sm font-semibold text-text-on-brand transition-colors hover:bg-bg-brand-hover",
|
|
4891
4715
|
children: [
|
|
4892
|
-
/* @__PURE__ */
|
|
4716
|
+
/* @__PURE__ */ jsx75(Plus2, { className: "size-4", "aria-hidden": "true" }),
|
|
4893
4717
|
" Customize for ",
|
|
4894
4718
|
productLabel
|
|
4895
4719
|
]
|
|
4896
4720
|
}
|
|
4897
4721
|
)
|
|
4898
|
-
] }) : /* @__PURE__ */
|
|
4899
|
-
/* @__PURE__ */
|
|
4900
|
-
/* @__PURE__ */
|
|
4901
|
-
/* @__PURE__ */
|
|
4722
|
+
] }) : /* @__PURE__ */ jsxs42(Fragment8, { children: [
|
|
4723
|
+
/* @__PURE__ */ jsx75(Card, { className: "border-none bg-bg-brand-subtle p-3.5", children: /* @__PURE__ */ jsxs42("div", { className: "flex items-center gap-3", children: [
|
|
4724
|
+
/* @__PURE__ */ jsxs42("div", { className: "min-w-0 flex-1", children: [
|
|
4725
|
+
/* @__PURE__ */ jsxs42("p", { className: "text-sm font-semibold text-text-brand", children: [
|
|
4902
4726
|
"Custom preferences for ",
|
|
4903
4727
|
productLabel
|
|
4904
4728
|
] }),
|
|
4905
|
-
/* @__PURE__ */
|
|
4729
|
+
/* @__PURE__ */ jsx75("p", { className: "text-sm leading-relaxed text-text-secondary", children: "Only the interrupt thresholds below differ. Sound and forwarding follow Default." })
|
|
4906
4730
|
] }),
|
|
4907
|
-
/* @__PURE__ */
|
|
4731
|
+
/* @__PURE__ */ jsx75(
|
|
4908
4732
|
"button",
|
|
4909
4733
|
{
|
|
4910
4734
|
type: "button",
|
|
@@ -4922,14 +4746,14 @@ var NotificationSettings = React63.forwardRef(
|
|
|
4922
4746
|
NotificationSettings.displayName = "NotificationSettings";
|
|
4923
4747
|
|
|
4924
4748
|
// src/components/notification-toast.tsx
|
|
4925
|
-
import * as
|
|
4749
|
+
import * as React63 from "react";
|
|
4926
4750
|
import { X as X3 } from "lucide-react";
|
|
4927
|
-
import { jsx as
|
|
4751
|
+
import { jsx as jsx76, jsxs as jsxs43 } from "react/jsx-runtime";
|
|
4928
4752
|
var chipBase2 = "rounded-lg px-2.5 py-1 text-sm font-medium transition-colors";
|
|
4929
4753
|
var chipPrimary = "bg-bg-brand text-text-on-brand hover:bg-bg-brand-hover";
|
|
4930
4754
|
var chipDestructive = "bg-bg-elevated text-text-danger hover:bg-bg-surface";
|
|
4931
4755
|
var linkAction = "text-sm font-semibold text-text-brand transition-colors hover:text-text-primary";
|
|
4932
|
-
var NotificationToast =
|
|
4756
|
+
var NotificationToast = React63.forwardRef(
|
|
4933
4757
|
({
|
|
4934
4758
|
item,
|
|
4935
4759
|
showSource = true,
|
|
@@ -4941,7 +4765,7 @@ var NotificationToast = React64.forwardRef(
|
|
|
4941
4765
|
className
|
|
4942
4766
|
}, ref) => {
|
|
4943
4767
|
const actions = item.actions ?? [];
|
|
4944
|
-
return /* @__PURE__ */
|
|
4768
|
+
return /* @__PURE__ */ jsxs43(
|
|
4945
4769
|
"div",
|
|
4946
4770
|
{
|
|
4947
4771
|
ref,
|
|
@@ -4952,21 +4776,21 @@ var NotificationToast = React64.forwardRef(
|
|
|
4952
4776
|
className
|
|
4953
4777
|
),
|
|
4954
4778
|
children: [
|
|
4955
|
-
/* @__PURE__ */
|
|
4956
|
-
showSource && /* @__PURE__ */
|
|
4957
|
-
/* @__PURE__ */
|
|
4958
|
-
onDismiss && /* @__PURE__ */
|
|
4779
|
+
/* @__PURE__ */ jsxs43("div", { className: "flex items-center gap-2", children: [
|
|
4780
|
+
showSource && /* @__PURE__ */ jsx76("span", { className: "text-xs font-semibold uppercase tracking-[0.09em] text-text-secondary", children: item.source }),
|
|
4781
|
+
/* @__PURE__ */ jsx76(Badge, { variant: severityBadgeVariant(item.severity), children: severityLabels[item.severity] }),
|
|
4782
|
+
onDismiss && /* @__PURE__ */ jsx76(
|
|
4959
4783
|
"button",
|
|
4960
4784
|
{
|
|
4961
4785
|
type: "button",
|
|
4962
4786
|
"aria-label": dismissLabel,
|
|
4963
4787
|
onClick: () => onDismiss(item),
|
|
4964
4788
|
className: "-mr-1 ml-auto flex size-5 shrink-0 items-center justify-center rounded text-text-tertiary transition-colors hover:bg-bg-surface hover:text-text-primary",
|
|
4965
|
-
children: /* @__PURE__ */
|
|
4789
|
+
children: /* @__PURE__ */ jsx76(X3, { className: "size-3.5", "aria-hidden": "true" })
|
|
4966
4790
|
}
|
|
4967
4791
|
)
|
|
4968
4792
|
] }),
|
|
4969
|
-
onItemClick ? /* @__PURE__ */
|
|
4793
|
+
onItemClick ? /* @__PURE__ */ jsx76(
|
|
4970
4794
|
"button",
|
|
4971
4795
|
{
|
|
4972
4796
|
type: "button",
|
|
@@ -4974,12 +4798,12 @@ var NotificationToast = React64.forwardRef(
|
|
|
4974
4798
|
className: "mt-1 block text-left text-sm font-semibold leading-snug text-text-primary underline-offset-2 hover:underline",
|
|
4975
4799
|
children: item.title
|
|
4976
4800
|
}
|
|
4977
|
-
) : /* @__PURE__ */
|
|
4978
|
-
item.body && /* @__PURE__ */
|
|
4979
|
-
note && /* @__PURE__ */
|
|
4980
|
-
actions.length > 0 && /* @__PURE__ */
|
|
4801
|
+
) : /* @__PURE__ */ jsx76("p", { className: "mt-1 text-sm font-semibold leading-snug text-text-primary", children: item.title }),
|
|
4802
|
+
item.body && /* @__PURE__ */ jsx76("p", { className: "mt-0.5 text-sm leading-snug text-text-secondary", children: item.body }),
|
|
4803
|
+
note && /* @__PURE__ */ jsx76("p", { className: "mt-1.5 text-xs font-medium text-text-warning", children: note }),
|
|
4804
|
+
actions.length > 0 && /* @__PURE__ */ jsx76("div", { className: "mt-2.5 flex flex-wrap items-center gap-2", children: actions.map((action) => {
|
|
4981
4805
|
const variant = action.variant ?? "link";
|
|
4982
|
-
return /* @__PURE__ */
|
|
4806
|
+
return /* @__PURE__ */ jsx76(
|
|
4983
4807
|
"button",
|
|
4984
4808
|
{
|
|
4985
4809
|
type: "button",
|
|
@@ -4998,15 +4822,15 @@ var NotificationToast = React64.forwardRef(
|
|
|
4998
4822
|
NotificationToast.displayName = "NotificationToast";
|
|
4999
4823
|
|
|
5000
4824
|
// src/components/notification-toaster.tsx
|
|
5001
|
-
import * as
|
|
5002
|
-
import { jsx as
|
|
4825
|
+
import * as React64 from "react";
|
|
4826
|
+
import { jsx as jsx77 } from "react/jsx-runtime";
|
|
5003
4827
|
var positions = {
|
|
5004
4828
|
"bottom-right": "bottom-6 right-6 flex-col",
|
|
5005
4829
|
"bottom-left": "bottom-6 left-6 flex-col",
|
|
5006
4830
|
"top-right": "top-6 right-6 flex-col-reverse",
|
|
5007
4831
|
"top-left": "top-6 left-6 flex-col-reverse"
|
|
5008
4832
|
};
|
|
5009
|
-
var NotificationToaster =
|
|
4833
|
+
var NotificationToaster = React64.forwardRef(
|
|
5010
4834
|
({
|
|
5011
4835
|
items,
|
|
5012
4836
|
dwell,
|
|
@@ -5020,15 +4844,15 @@ var NotificationToaster = React65.forwardRef(
|
|
|
5020
4844
|
className
|
|
5021
4845
|
}, ref) => {
|
|
5022
4846
|
const shown = items.slice(0, max);
|
|
5023
|
-
const [paused, setPaused] =
|
|
5024
|
-
const onDismissRef =
|
|
4847
|
+
const [paused, setPaused] = React64.useState(false);
|
|
4848
|
+
const onDismissRef = React64.useRef(onDismiss);
|
|
5025
4849
|
onDismissRef.current = onDismiss;
|
|
5026
4850
|
const fyiDwell = dwell?.fyi;
|
|
5027
4851
|
const importantDwell = dwell?.important;
|
|
5028
4852
|
const criticalDwell = dwell?.critical;
|
|
5029
|
-
const remaining =
|
|
4853
|
+
const remaining = React64.useRef(/* @__PURE__ */ new Map());
|
|
5030
4854
|
const liveIds = shown.map((item) => `${item.id}:${item.severity}`).join(" ");
|
|
5031
|
-
|
|
4855
|
+
React64.useEffect(() => {
|
|
5032
4856
|
const owedById = remaining.current;
|
|
5033
4857
|
const dwellSeconds = {
|
|
5034
4858
|
fyi: fyiDwell ?? TOAST_DWELL.fyi,
|
|
@@ -5069,7 +4893,7 @@ var NotificationToaster = React65.forwardRef(
|
|
|
5069
4893
|
};
|
|
5070
4894
|
}, [liveIds, paused, fyiDwell, importantDwell, criticalDwell]);
|
|
5071
4895
|
if (shown.length === 0) return null;
|
|
5072
|
-
return /* @__PURE__ */
|
|
4896
|
+
return /* @__PURE__ */ jsx77(
|
|
5073
4897
|
"div",
|
|
5074
4898
|
{
|
|
5075
4899
|
ref,
|
|
@@ -5082,7 +4906,7 @@ var NotificationToaster = React65.forwardRef(
|
|
|
5082
4906
|
positions[position],
|
|
5083
4907
|
className
|
|
5084
4908
|
),
|
|
5085
|
-
children: shown.map((item, i) => /* @__PURE__ */
|
|
4909
|
+
children: shown.map((item, i) => /* @__PURE__ */ jsx77("div", { className: "pointer-events-auto", children: /* @__PURE__ */ jsx77(
|
|
5086
4910
|
NotificationToast,
|
|
5087
4911
|
{
|
|
5088
4912
|
item,
|
|
@@ -5353,8 +5177,16 @@ var COUNTRY_OPTIONS = [
|
|
|
5353
5177
|
];
|
|
5354
5178
|
|
|
5355
5179
|
// src/components/organization-onboarding-form.tsx
|
|
5356
|
-
import * as
|
|
5357
|
-
|
|
5180
|
+
import * as React65 from "react";
|
|
5181
|
+
|
|
5182
|
+
// src/lib/auth-surface.ts
|
|
5183
|
+
var AUTH_GLOW_BG = "radial-gradient(560px 320px at 28% 16%, var(--auth-glow-a), transparent 68%),radial-gradient(520px 340px at 78% 90%, var(--auth-glow-b), transparent 66%),var(--bg-sunken)";
|
|
5184
|
+
var AUTH_FILLED_BUTTON = "flex h-[46px] w-full items-center justify-center gap-[11px] rounded-[10px] border border-transparent bg-text-primary px-[14px] text-[14.5px] font-semibold tracking-[-0.005em] text-bg-sunken transition-opacity hover:opacity-[0.92] focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-text-brand active:translate-y-px disabled:cursor-not-allowed disabled:opacity-[0.55]";
|
|
5185
|
+
var AUTH_QUIET_BUTTON = "flex h-[46px] w-full items-center justify-center gap-[11px] rounded-[10px] border border-border-default bg-transparent px-[14px] text-[14.5px] font-medium tracking-[-0.005em] text-text-secondary transition-colors hover:bg-bg-secondary focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-text-brand";
|
|
5186
|
+
var AUTH_BUTTON_SHADOW = "var(--auth-btn-shadow)";
|
|
5187
|
+
|
|
5188
|
+
// src/components/organization-onboarding-form.tsx
|
|
5189
|
+
import { jsx as jsx78, jsxs as jsxs44 } from "react/jsx-runtime";
|
|
5358
5190
|
var CONTROLLER_SHARE_PCT = 50;
|
|
5359
5191
|
var MAX_BENEFICIAL_OWNERS = 50;
|
|
5360
5192
|
function parseShare(raw) {
|
|
@@ -5385,21 +5217,21 @@ function OrganizationOnboardingForm({
|
|
|
5385
5217
|
onCancel,
|
|
5386
5218
|
className
|
|
5387
5219
|
}) {
|
|
5388
|
-
const [name, setName] =
|
|
5389
|
-
const [legalName, setLegalName] =
|
|
5390
|
-
const [ownerName, setOwnerName] =
|
|
5391
|
-
const [countryOfIncorporation, setCountryOfIncorporation] =
|
|
5220
|
+
const [name, setName] = React65.useState(defaultValues?.name ?? "");
|
|
5221
|
+
const [legalName, setLegalName] = React65.useState(defaultValues?.legal_name ?? "");
|
|
5222
|
+
const [ownerName, setOwnerName] = React65.useState(defaultValues?.owner_name ?? "");
|
|
5223
|
+
const [countryOfIncorporation, setCountryOfIncorporation] = React65.useState(
|
|
5392
5224
|
defaultValues?.country_of_incorporation ?? ""
|
|
5393
5225
|
);
|
|
5394
|
-
const [residencyCountry, setResidencyCountry] =
|
|
5226
|
+
const [residencyCountry, setResidencyCountry] = React65.useState(
|
|
5395
5227
|
defaultValues?.residency_country ?? ""
|
|
5396
5228
|
);
|
|
5397
|
-
const [owners, setOwners] =
|
|
5229
|
+
const [owners, setOwners] = React65.useState(
|
|
5398
5230
|
() => initialRows(defaultValues?.beneficial_owners)
|
|
5399
5231
|
);
|
|
5400
|
-
const [ownershipConfirmed, setOwnershipConfirmed] =
|
|
5401
|
-
const nextKeyRef =
|
|
5402
|
-
const submittingRef =
|
|
5232
|
+
const [ownershipConfirmed, setOwnershipConfirmed] = React65.useState(false);
|
|
5233
|
+
const nextKeyRef = React65.useRef(owners.length);
|
|
5234
|
+
const submittingRef = React65.useRef(false);
|
|
5403
5235
|
const trimmed = name.trim();
|
|
5404
5236
|
const filledOwners = owners.filter((row) => !isRowBlank(row));
|
|
5405
5237
|
const ownerShares = filledOwners.map((row) => parseShare(row.share));
|
|
@@ -5444,7 +5276,7 @@ function OrganizationOnboardingForm({
|
|
|
5444
5276
|
...needsOwnershipConfirmation ? { ownership_confirmed: ownershipConfirmed } : {}
|
|
5445
5277
|
});
|
|
5446
5278
|
};
|
|
5447
|
-
|
|
5279
|
+
React65.useEffect(() => {
|
|
5448
5280
|
submittingRef.current = false;
|
|
5449
5281
|
}, [
|
|
5450
5282
|
name,
|
|
@@ -5457,12 +5289,12 @@ function OrganizationOnboardingForm({
|
|
|
5457
5289
|
submitting,
|
|
5458
5290
|
serverError
|
|
5459
5291
|
]);
|
|
5460
|
-
const countryField = (params) => /* @__PURE__ */
|
|
5461
|
-
/* @__PURE__ */
|
|
5292
|
+
const countryField = (params) => /* @__PURE__ */ jsxs44("div", { className: "space-y-1.5", children: [
|
|
5293
|
+
/* @__PURE__ */ jsxs44(Label2, { htmlFor: params.id, children: [
|
|
5462
5294
|
params.label,
|
|
5463
|
-
params.required && /* @__PURE__ */
|
|
5295
|
+
params.required && /* @__PURE__ */ jsx78("span", { className: "text-text-danger", children: " *" })
|
|
5464
5296
|
] }),
|
|
5465
|
-
/* @__PURE__ */
|
|
5297
|
+
/* @__PURE__ */ jsx78(
|
|
5466
5298
|
Select,
|
|
5467
5299
|
{
|
|
5468
5300
|
id: params.id,
|
|
@@ -5475,10 +5307,10 @@ function OrganizationOnboardingForm({
|
|
|
5475
5307
|
}
|
|
5476
5308
|
)
|
|
5477
5309
|
] });
|
|
5478
|
-
return /* @__PURE__ */
|
|
5479
|
-
/* @__PURE__ */
|
|
5480
|
-
/* @__PURE__ */
|
|
5481
|
-
/* @__PURE__ */
|
|
5310
|
+
return /* @__PURE__ */ jsxs44("form", { onSubmit: handleSubmit, className: cn("space-y-4", className), children: [
|
|
5311
|
+
/* @__PURE__ */ jsxs44("div", { className: "space-y-1.5", children: [
|
|
5312
|
+
/* @__PURE__ */ jsx78(Label2, { htmlFor: "create-org-name", children: "Organization name" }),
|
|
5313
|
+
/* @__PURE__ */ jsx78(
|
|
5482
5314
|
Input,
|
|
5483
5315
|
{
|
|
5484
5316
|
id: "create-org-name",
|
|
@@ -5489,9 +5321,9 @@ function OrganizationOnboardingForm({
|
|
|
5489
5321
|
}
|
|
5490
5322
|
)
|
|
5491
5323
|
] }),
|
|
5492
|
-
/* @__PURE__ */
|
|
5493
|
-
/* @__PURE__ */
|
|
5494
|
-
/* @__PURE__ */
|
|
5324
|
+
/* @__PURE__ */ jsxs44("div", { className: "space-y-1.5", children: [
|
|
5325
|
+
/* @__PURE__ */ jsx78(Label2, { htmlFor: "create-org-legal-name", children: "Legal name" }),
|
|
5326
|
+
/* @__PURE__ */ jsx78(
|
|
5495
5327
|
Input,
|
|
5496
5328
|
{
|
|
5497
5329
|
id: "create-org-legal-name",
|
|
@@ -5502,9 +5334,9 @@ function OrganizationOnboardingForm({
|
|
|
5502
5334
|
}
|
|
5503
5335
|
)
|
|
5504
5336
|
] }),
|
|
5505
|
-
/* @__PURE__ */
|
|
5506
|
-
/* @__PURE__ */
|
|
5507
|
-
/* @__PURE__ */
|
|
5337
|
+
/* @__PURE__ */ jsxs44("div", { className: "space-y-1.5", children: [
|
|
5338
|
+
/* @__PURE__ */ jsx78(Label2, { htmlFor: "create-org-owner-name", children: "Owner name" }),
|
|
5339
|
+
/* @__PURE__ */ jsx78(
|
|
5508
5340
|
Input,
|
|
5509
5341
|
{
|
|
5510
5342
|
id: "create-org-owner-name",
|
|
@@ -5529,10 +5361,10 @@ function OrganizationOnboardingForm({
|
|
|
5529
5361
|
onChange: setResidencyCountry,
|
|
5530
5362
|
required: false
|
|
5531
5363
|
}),
|
|
5532
|
-
/* @__PURE__ */
|
|
5533
|
-
/* @__PURE__ */
|
|
5534
|
-
/* @__PURE__ */
|
|
5535
|
-
/* @__PURE__ */
|
|
5364
|
+
/* @__PURE__ */ jsxs44("div", { className: "space-y-2", children: [
|
|
5365
|
+
/* @__PURE__ */ jsxs44("div", { className: "flex items-center justify-between", children: [
|
|
5366
|
+
/* @__PURE__ */ jsx78(Label2, { children: "Beneficial owners" }),
|
|
5367
|
+
/* @__PURE__ */ jsx78(
|
|
5536
5368
|
Button,
|
|
5537
5369
|
{
|
|
5538
5370
|
type: "button",
|
|
@@ -5545,16 +5377,16 @@ function OrganizationOnboardingForm({
|
|
|
5545
5377
|
}
|
|
5546
5378
|
)
|
|
5547
5379
|
] }),
|
|
5548
|
-
owners.length === 0 && /* @__PURE__ */
|
|
5549
|
-
owners.map((row) => /* @__PURE__ */
|
|
5380
|
+
owners.length === 0 && /* @__PURE__ */ jsx78("p", { className: "text-xs text-text-tertiary", children: "List the natural persons who ultimately own or control the organization." }),
|
|
5381
|
+
owners.map((row) => /* @__PURE__ */ jsxs44(
|
|
5550
5382
|
"div",
|
|
5551
5383
|
{
|
|
5552
5384
|
"data-testid": `beneficial-owner-row-${row.key}`,
|
|
5553
5385
|
className: "flex items-end gap-2",
|
|
5554
5386
|
children: [
|
|
5555
|
-
/* @__PURE__ */
|
|
5556
|
-
/* @__PURE__ */
|
|
5557
|
-
/* @__PURE__ */
|
|
5387
|
+
/* @__PURE__ */ jsxs44("div", { className: "flex-1 space-y-1", children: [
|
|
5388
|
+
/* @__PURE__ */ jsx78(Label2, { htmlFor: `bo-name-${row.key}`, className: "text-xs", children: "Name" }),
|
|
5389
|
+
/* @__PURE__ */ jsx78(
|
|
5558
5390
|
Input,
|
|
5559
5391
|
{
|
|
5560
5392
|
id: `bo-name-${row.key}`,
|
|
@@ -5564,9 +5396,9 @@ function OrganizationOnboardingForm({
|
|
|
5564
5396
|
}
|
|
5565
5397
|
)
|
|
5566
5398
|
] }),
|
|
5567
|
-
/* @__PURE__ */
|
|
5568
|
-
/* @__PURE__ */
|
|
5569
|
-
/* @__PURE__ */
|
|
5399
|
+
/* @__PURE__ */ jsxs44("div", { className: "w-40 space-y-1", children: [
|
|
5400
|
+
/* @__PURE__ */ jsx78(Label2, { htmlFor: `bo-country-${row.key}`, className: "text-xs", children: "Country" }),
|
|
5401
|
+
/* @__PURE__ */ jsx78(
|
|
5570
5402
|
Select,
|
|
5571
5403
|
{
|
|
5572
5404
|
id: `bo-country-${row.key}`,
|
|
@@ -5579,9 +5411,9 @@ function OrganizationOnboardingForm({
|
|
|
5579
5411
|
}
|
|
5580
5412
|
)
|
|
5581
5413
|
] }),
|
|
5582
|
-
/* @__PURE__ */
|
|
5583
|
-
/* @__PURE__ */
|
|
5584
|
-
/* @__PURE__ */
|
|
5414
|
+
/* @__PURE__ */ jsxs44("div", { className: "w-24 space-y-1", children: [
|
|
5415
|
+
/* @__PURE__ */ jsx78(Label2, { htmlFor: `bo-share-${row.key}`, className: "text-xs", children: "Share %" }),
|
|
5416
|
+
/* @__PURE__ */ jsx78(
|
|
5585
5417
|
Input,
|
|
5586
5418
|
{
|
|
5587
5419
|
id: `bo-share-${row.key}`,
|
|
@@ -5592,7 +5424,7 @@ function OrganizationOnboardingForm({
|
|
|
5592
5424
|
}
|
|
5593
5425
|
)
|
|
5594
5426
|
] }),
|
|
5595
|
-
/* @__PURE__ */
|
|
5427
|
+
/* @__PURE__ */ jsx78(
|
|
5596
5428
|
Button,
|
|
5597
5429
|
{
|
|
5598
5430
|
type: "button",
|
|
@@ -5607,15 +5439,15 @@ function OrganizationOnboardingForm({
|
|
|
5607
5439
|
},
|
|
5608
5440
|
row.key
|
|
5609
5441
|
)),
|
|
5610
|
-
!ownersValid && /* @__PURE__ */
|
|
5611
|
-
shareSum > 100 && /* @__PURE__ */
|
|
5442
|
+
!ownersValid && /* @__PURE__ */ jsx78("p", { "data-testid": "beneficial-owners-error", className: "text-xs text-text-danger", children: "Every owner needs a name, a country and a share between 0 and 100." }),
|
|
5443
|
+
shareSum > 100 && /* @__PURE__ */ jsxs44("p", { "data-testid": "beneficial-owners-sum-warning", className: "text-xs text-text-warning", children: [
|
|
5612
5444
|
"The listed shares add up to ",
|
|
5613
5445
|
shareSum,
|
|
5614
5446
|
"%, which is more than 100%."
|
|
5615
5447
|
] })
|
|
5616
5448
|
] }),
|
|
5617
|
-
needsOwnershipConfirmation && /* @__PURE__ */
|
|
5618
|
-
/* @__PURE__ */
|
|
5449
|
+
needsOwnershipConfirmation && /* @__PURE__ */ jsxs44("div", { className: "flex items-start gap-2", children: [
|
|
5450
|
+
/* @__PURE__ */ jsx78(
|
|
5619
5451
|
Checkbox,
|
|
5620
5452
|
{
|
|
5621
5453
|
id: "create-org-ownership-confirmed",
|
|
@@ -5624,24 +5456,24 @@ function OrganizationOnboardingForm({
|
|
|
5624
5456
|
onCheckedChange: (value) => setOwnershipConfirmed(value === true)
|
|
5625
5457
|
}
|
|
5626
5458
|
),
|
|
5627
|
-
/* @__PURE__ */
|
|
5459
|
+
/* @__PURE__ */ jsxs44(
|
|
5628
5460
|
Label2,
|
|
5629
5461
|
{
|
|
5630
5462
|
htmlFor: "create-org-ownership-confirmed",
|
|
5631
5463
|
className: "text-xs font-normal leading-snug",
|
|
5632
5464
|
children: [
|
|
5633
5465
|
"I confirm the ownership structure above is complete and correct",
|
|
5634
|
-
requireSanctionsFields && /* @__PURE__ */
|
|
5466
|
+
requireSanctionsFields && /* @__PURE__ */ jsx78("span", { className: "text-text-danger", children: " *" })
|
|
5635
5467
|
]
|
|
5636
5468
|
}
|
|
5637
5469
|
)
|
|
5638
5470
|
] }),
|
|
5639
|
-
(serverError || violations && violations.length > 0) && /* @__PURE__ */
|
|
5471
|
+
(serverError || violations && violations.length > 0) && /* @__PURE__ */ jsxs44(InlineError, { children: [
|
|
5640
5472
|
serverError,
|
|
5641
|
-
violations && violations.length > 0 && /* @__PURE__ */
|
|
5473
|
+
violations && violations.length > 0 && /* @__PURE__ */ jsx78("ul", { "data-testid": "create-org-violations", className: "mt-1 list-disc pl-4", children: violations.map((violation) => /* @__PURE__ */ jsx78("li", { children: violation }, violation)) })
|
|
5642
5474
|
] }),
|
|
5643
|
-
/* @__PURE__ */
|
|
5644
|
-
/* @__PURE__ */
|
|
5475
|
+
/* @__PURE__ */ jsxs44("div", { className: "space-y-2 pt-1", children: [
|
|
5476
|
+
/* @__PURE__ */ jsx78(
|
|
5645
5477
|
"button",
|
|
5646
5478
|
{
|
|
5647
5479
|
type: "submit",
|
|
@@ -5652,20 +5484,20 @@ function OrganizationOnboardingForm({
|
|
|
5652
5484
|
children: submitting ? "Creating\u2026" : submitLabel
|
|
5653
5485
|
}
|
|
5654
5486
|
),
|
|
5655
|
-
onCancel && /* @__PURE__ */
|
|
5487
|
+
onCancel && /* @__PURE__ */ jsx78("button", { type: "button", onClick: onCancel, className: AUTH_QUIET_BUTTON, children: "Cancel" })
|
|
5656
5488
|
] })
|
|
5657
5489
|
] });
|
|
5658
5490
|
}
|
|
5659
5491
|
|
|
5660
5492
|
// src/components/onboarding-screen-shell.tsx
|
|
5661
|
-
import { jsx as
|
|
5493
|
+
import { jsx as jsx79, jsxs as jsxs45 } from "react/jsx-runtime";
|
|
5662
5494
|
var CARD_WIDTH = {
|
|
5663
5495
|
md: "max-w-[440px]",
|
|
5664
5496
|
lg: "max-w-[560px]"
|
|
5665
5497
|
};
|
|
5666
5498
|
function OnboardingScreenShell({
|
|
5667
5499
|
logo,
|
|
5668
|
-
themeToggle = /* @__PURE__ */
|
|
5500
|
+
themeToggle = /* @__PURE__ */ jsx79(ThemeToggle, {}),
|
|
5669
5501
|
title,
|
|
5670
5502
|
description,
|
|
5671
5503
|
footer,
|
|
@@ -5674,7 +5506,7 @@ function OnboardingScreenShell({
|
|
|
5674
5506
|
className,
|
|
5675
5507
|
...props
|
|
5676
5508
|
}) {
|
|
5677
|
-
return /* @__PURE__ */
|
|
5509
|
+
return /* @__PURE__ */ jsxs45(
|
|
5678
5510
|
"div",
|
|
5679
5511
|
{
|
|
5680
5512
|
className: cn(
|
|
@@ -5684,8 +5516,8 @@ function OnboardingScreenShell({
|
|
|
5684
5516
|
style: { background: AUTH_GLOW_BG },
|
|
5685
5517
|
...props,
|
|
5686
5518
|
children: [
|
|
5687
|
-
themeToggle && /* @__PURE__ */
|
|
5688
|
-
/* @__PURE__ */
|
|
5519
|
+
themeToggle && /* @__PURE__ */ jsx79("div", { className: "absolute right-6 top-6", children: themeToggle }),
|
|
5520
|
+
/* @__PURE__ */ jsxs45(
|
|
5689
5521
|
"div",
|
|
5690
5522
|
{
|
|
5691
5523
|
className: cn(
|
|
@@ -5697,8 +5529,8 @@ function OnboardingScreenShell({
|
|
|
5697
5529
|
boxShadow: "var(--auth-card-shadow)"
|
|
5698
5530
|
},
|
|
5699
5531
|
children: [
|
|
5700
|
-
logo && /* @__PURE__ */
|
|
5701
|
-
/* @__PURE__ */
|
|
5532
|
+
logo && /* @__PURE__ */ jsx79("div", { className: "mb-[22px] flex items-center justify-center text-[24px] font-bold leading-none tracking-[-0.02em] text-text-primary", children: logo }),
|
|
5533
|
+
/* @__PURE__ */ jsx79(
|
|
5702
5534
|
"h1",
|
|
5703
5535
|
{
|
|
5704
5536
|
className: cn(
|
|
@@ -5709,9 +5541,9 @@ function OnboardingScreenShell({
|
|
|
5709
5541
|
children: title
|
|
5710
5542
|
}
|
|
5711
5543
|
),
|
|
5712
|
-
description && /* @__PURE__ */
|
|
5713
|
-
/* @__PURE__ */
|
|
5714
|
-
footer != null && /* @__PURE__ */
|
|
5544
|
+
description && /* @__PURE__ */ jsx79("p", { className: "mx-auto mb-[24px] max-w-[320px] text-[13.5px] leading-[1.5] text-text-secondary", children: description }),
|
|
5545
|
+
/* @__PURE__ */ jsx79("div", { className: "text-left", children }),
|
|
5546
|
+
footer != null && /* @__PURE__ */ jsx79("div", { className: "mt-[24px] text-[11px] tracking-[0.005em] text-text-tertiary", children: footer })
|
|
5715
5547
|
]
|
|
5716
5548
|
}
|
|
5717
5549
|
)
|
|
@@ -5721,7 +5553,7 @@ function OnboardingScreenShell({
|
|
|
5721
5553
|
}
|
|
5722
5554
|
|
|
5723
5555
|
// src/components/organization-create-screen.tsx
|
|
5724
|
-
import { jsx as
|
|
5556
|
+
import { jsx as jsx80 } from "react/jsx-runtime";
|
|
5725
5557
|
function OrganizationCreateScreen({
|
|
5726
5558
|
requireSanctionsFields,
|
|
5727
5559
|
onSubmit,
|
|
@@ -5739,7 +5571,7 @@ function OrganizationCreateScreen({
|
|
|
5739
5571
|
footer,
|
|
5740
5572
|
...props
|
|
5741
5573
|
}) {
|
|
5742
|
-
return /* @__PURE__ */
|
|
5574
|
+
return /* @__PURE__ */ jsx80(
|
|
5743
5575
|
OnboardingScreenShell,
|
|
5744
5576
|
{
|
|
5745
5577
|
logo,
|
|
@@ -5749,7 +5581,7 @@ function OrganizationCreateScreen({
|
|
|
5749
5581
|
footer,
|
|
5750
5582
|
width: "lg",
|
|
5751
5583
|
...props,
|
|
5752
|
-
children: /* @__PURE__ */
|
|
5584
|
+
children: /* @__PURE__ */ jsx80(
|
|
5753
5585
|
OrganizationOnboardingForm,
|
|
5754
5586
|
{
|
|
5755
5587
|
requireSanctionsFields,
|
|
@@ -5768,8 +5600,8 @@ function OrganizationCreateScreen({
|
|
|
5768
5600
|
}
|
|
5769
5601
|
|
|
5770
5602
|
// src/components/product-create-screen.tsx
|
|
5771
|
-
import * as
|
|
5772
|
-
import { jsx as
|
|
5603
|
+
import * as React66 from "react";
|
|
5604
|
+
import { jsx as jsx81, jsxs as jsxs46 } from "react/jsx-runtime";
|
|
5773
5605
|
var productRow = "flex w-full items-center justify-between rounded-md border border-border-default bg-bg-primary px-3 py-2 text-left text-sm text-text-primary";
|
|
5774
5606
|
function ProductCreateScreen({
|
|
5775
5607
|
// Destructured only to keep it out of `...props`, which is spread onto a <div>.
|
|
@@ -5795,11 +5627,11 @@ function ProductCreateScreen({
|
|
|
5795
5627
|
footer,
|
|
5796
5628
|
...props
|
|
5797
5629
|
}) {
|
|
5798
|
-
const [name, setName] =
|
|
5799
|
-
const submittingRef =
|
|
5630
|
+
const [name, setName] = React66.useState(defaultName);
|
|
5631
|
+
const submittingRef = React66.useRef(false);
|
|
5800
5632
|
const trimmed = name.trim();
|
|
5801
5633
|
const canSubmit = trimmed !== "" && !submitting;
|
|
5802
|
-
|
|
5634
|
+
React66.useEffect(() => {
|
|
5803
5635
|
submittingRef.current = false;
|
|
5804
5636
|
}, [name, submitting, serverError]);
|
|
5805
5637
|
const handleSubmit = (event) => {
|
|
@@ -5811,7 +5643,7 @@ function ProductCreateScreen({
|
|
|
5811
5643
|
const products = existingProducts ?? [];
|
|
5812
5644
|
const orgs = organizations ?? [];
|
|
5813
5645
|
const pickerLayout = orgs.length > 0;
|
|
5814
|
-
const productList = /* @__PURE__ */
|
|
5646
|
+
const productList = /* @__PURE__ */ jsx81("ul", { className: "flex flex-col gap-1", children: products.map((product) => /* @__PURE__ */ jsx81("li", { children: onOpenProduct ? /* @__PURE__ */ jsxs46(
|
|
5815
5647
|
"button",
|
|
5816
5648
|
{
|
|
5817
5649
|
type: "button",
|
|
@@ -5822,15 +5654,15 @@ function ProductCreateScreen({
|
|
|
5822
5654
|
"hover:bg-bg-secondary focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-border-focus"
|
|
5823
5655
|
),
|
|
5824
5656
|
children: [
|
|
5825
|
-
/* @__PURE__ */
|
|
5826
|
-
product.slug && /* @__PURE__ */
|
|
5657
|
+
/* @__PURE__ */ jsx81("span", { className: "truncate", children: product.name }),
|
|
5658
|
+
product.slug && /* @__PURE__ */ jsx81("span", { className: "ml-2 truncate text-text-tertiary", children: product.slug })
|
|
5827
5659
|
]
|
|
5828
5660
|
}
|
|
5829
|
-
) : /* @__PURE__ */
|
|
5830
|
-
/* @__PURE__ */
|
|
5831
|
-
product.slug && /* @__PURE__ */
|
|
5661
|
+
) : /* @__PURE__ */ jsxs46("div", { className: productRow, children: [
|
|
5662
|
+
/* @__PURE__ */ jsx81("span", { className: "truncate", children: product.name }),
|
|
5663
|
+
product.slug && /* @__PURE__ */ jsx81("span", { className: "ml-2 truncate text-text-tertiary", children: product.slug })
|
|
5832
5664
|
] }) }, product.id)) });
|
|
5833
|
-
return /* @__PURE__ */
|
|
5665
|
+
return /* @__PURE__ */ jsxs46(
|
|
5834
5666
|
OnboardingScreenShell,
|
|
5835
5667
|
{
|
|
5836
5668
|
logo,
|
|
@@ -5840,10 +5672,10 @@ function ProductCreateScreen({
|
|
|
5840
5672
|
footer,
|
|
5841
5673
|
...props,
|
|
5842
5674
|
children: [
|
|
5843
|
-
pickerLayout && /* @__PURE__ */
|
|
5844
|
-
/* @__PURE__ */
|
|
5845
|
-
/* @__PURE__ */
|
|
5846
|
-
/* @__PURE__ */
|
|
5675
|
+
pickerLayout && /* @__PURE__ */ jsxs46("div", { className: "mb-4 space-y-4", children: [
|
|
5676
|
+
/* @__PURE__ */ jsxs46("div", { className: "space-y-1.5", children: [
|
|
5677
|
+
/* @__PURE__ */ jsx81(Label2, { htmlFor: "create-product-org-select", children: "Organization" }),
|
|
5678
|
+
/* @__PURE__ */ jsx81(
|
|
5847
5679
|
Select,
|
|
5848
5680
|
{
|
|
5849
5681
|
id: "create-product-org-select",
|
|
@@ -5857,15 +5689,15 @@ function ProductCreateScreen({
|
|
|
5857
5689
|
}
|
|
5858
5690
|
)
|
|
5859
5691
|
] }),
|
|
5860
|
-
/* @__PURE__ */
|
|
5861
|
-
/* @__PURE__ */
|
|
5862
|
-
productsLoading ? /* @__PURE__ */
|
|
5692
|
+
/* @__PURE__ */ jsxs46("div", { "data-testid": "existing-products", className: "space-y-1.5", children: [
|
|
5693
|
+
/* @__PURE__ */ jsx81(Label2, { children: existingProductsLabel }),
|
|
5694
|
+
productsLoading ? /* @__PURE__ */ jsx81("p", { className: "text-sm text-text-tertiary", children: "Loading products\u2026" }) : products.length === 0 ? /* @__PURE__ */ jsx81("p", { className: "text-sm text-text-tertiary", children: "No products yet." }) : productList
|
|
5863
5695
|
] })
|
|
5864
5696
|
] }),
|
|
5865
|
-
/* @__PURE__ */
|
|
5866
|
-
/* @__PURE__ */
|
|
5867
|
-
/* @__PURE__ */
|
|
5868
|
-
/* @__PURE__ */
|
|
5697
|
+
/* @__PURE__ */ jsxs46("form", { onSubmit: handleSubmit, className: "space-y-4", noValidate: true, children: [
|
|
5698
|
+
/* @__PURE__ */ jsxs46("div", { className: "space-y-1.5", children: [
|
|
5699
|
+
/* @__PURE__ */ jsx81(Label2, { htmlFor: "create-product-name", children: "Product name" }),
|
|
5700
|
+
/* @__PURE__ */ jsx81(
|
|
5869
5701
|
Input,
|
|
5870
5702
|
{
|
|
5871
5703
|
id: "create-product-name",
|
|
@@ -5876,9 +5708,9 @@ function ProductCreateScreen({
|
|
|
5876
5708
|
}
|
|
5877
5709
|
)
|
|
5878
5710
|
] }),
|
|
5879
|
-
serverError && /* @__PURE__ */
|
|
5880
|
-
/* @__PURE__ */
|
|
5881
|
-
/* @__PURE__ */
|
|
5711
|
+
serverError && /* @__PURE__ */ jsx81(InlineError, { children: serverError }),
|
|
5712
|
+
/* @__PURE__ */ jsxs46("div", { className: "space-y-2 pt-1", children: [
|
|
5713
|
+
/* @__PURE__ */ jsx81(
|
|
5882
5714
|
"button",
|
|
5883
5715
|
{
|
|
5884
5716
|
type: "submit",
|
|
@@ -5889,16 +5721,16 @@ function ProductCreateScreen({
|
|
|
5889
5721
|
children: submitting ? "Creating\u2026" : submitLabel
|
|
5890
5722
|
}
|
|
5891
5723
|
),
|
|
5892
|
-
onCancel && /* @__PURE__ */
|
|
5724
|
+
onCancel && /* @__PURE__ */ jsx81("button", { type: "button", onClick: onCancel, className: AUTH_QUIET_BUTTON, children: "Cancel" })
|
|
5893
5725
|
] })
|
|
5894
5726
|
] }),
|
|
5895
|
-
!pickerLayout && products.length > 0 && /* @__PURE__ */
|
|
5727
|
+
!pickerLayout && products.length > 0 && /* @__PURE__ */ jsxs46(
|
|
5896
5728
|
"div",
|
|
5897
5729
|
{
|
|
5898
5730
|
"data-testid": "existing-products",
|
|
5899
5731
|
className: "mt-6 space-y-2 border-t border-border-default pt-5",
|
|
5900
5732
|
children: [
|
|
5901
|
-
/* @__PURE__ */
|
|
5733
|
+
/* @__PURE__ */ jsx81(Label2, { children: existingProductsLabel }),
|
|
5902
5734
|
productList
|
|
5903
5735
|
]
|
|
5904
5736
|
}
|
|
@@ -6122,7 +5954,6 @@ export {
|
|
|
6122
5954
|
SidebarNav,
|
|
6123
5955
|
SidebarNavLink,
|
|
6124
5956
|
SidebarProductHeader,
|
|
6125
|
-
SignInScreen,
|
|
6126
5957
|
Skeleton,
|
|
6127
5958
|
Slider,
|
|
6128
5959
|
StatCard,
|