@flamingo-stack/openframe-frontend-core 0.0.701-snapshot.20261005171139 → 0.0.701
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/{chunk-CXDJUKC6.cjs → chunk-2CSYUMNM.cjs} +2 -2
- package/dist/{chunk-E3DH543A.cjs → chunk-4H5Q6MQG.cjs} +35 -35
- package/dist/{chunk-3WSFIV5G.cjs → chunk-65YVUYWJ.cjs} +32 -32
- package/dist/{chunk-UJJWTJ6S.js → chunk-6JG75WVO.js} +4 -4
- package/dist/{chunk-YGRHITPY.cjs → chunk-7ZDTAABP.cjs} +3 -3
- package/dist/{chunk-Z5HDCZAS.js → chunk-A5ZGKBN2.js} +1 -1
- package/dist/{chunk-CZ34HXDW.js → chunk-B7M6QEEM.js} +275 -661
- package/dist/{chunk-FHM7GD5B.cjs → chunk-BPS7JQCI.cjs} +2 -2
- package/dist/{chunk-LZNJH23A.cjs → chunk-BQ34PIFC.cjs} +3 -3
- package/dist/{chunk-AEQANLBW.cjs → chunk-BRQY2HKD.cjs} +17 -17
- package/dist/{chunk-ETFFEA3J.js → chunk-BZYMGI4L.js} +1 -1
- package/dist/{chunk-IZKOQVXO.js → chunk-CUPJCGLB.js} +1 -1
- package/dist/{chunk-QFW3RUZS.cjs → chunk-DG2I57UM.cjs} +16 -16
- package/dist/{chunk-HYFLTFFB.js → chunk-DJLZXJYB.js} +1 -1
- package/dist/{chunk-MWUBBBWZ.js → chunk-EONNPRAW.js} +1 -1
- package/dist/{chunk-446KS5BG.js → chunk-GD4JALTR.js} +1 -1
- package/dist/{chunk-3G76LRGL.cjs → chunk-GFXZMFDX.cjs} +9 -9
- package/dist/{chunk-BO5ZHDA4.js → chunk-JPVDJB27.js} +3 -3
- package/dist/{chunk-2V4Z44G6.js → chunk-MFORWVGD.js} +4 -4
- package/dist/{chunk-JOY6HVPV.js → chunk-N7DPIH57.js} +1 -1
- package/dist/{chunk-PLK6GHN7.js → chunk-N7HMUQRV.js} +1 -1
- package/dist/{chunk-L7KZA7ZD.cjs → chunk-NIT257DV.cjs} +2 -2
- package/dist/{chunk-SAA7B3DA.js → chunk-PNWIVND4.js} +2 -2
- package/dist/{chunk-FD4DBTFO.cjs → chunk-QDIX2ZRL.cjs} +44 -430
- package/dist/{chunk-CYYTD5ZK.cjs → chunk-QPNR4N7N.cjs} +16 -16
- package/dist/{chunk-HIXGAY2L.cjs → chunk-QZGFJBG5.cjs} +50 -50
- package/dist/{chunk-RS7HWAYX.js → chunk-S4ADN25W.js} +1 -1
- package/dist/{chunk-HPJ4XS2L.js → chunk-V5QNDOEL.js} +3 -3
- package/dist/{chunk-B3LZJ6J3.cjs → chunk-YBC346FY.cjs} +12 -12
- package/dist/{chunk-ASN65P3F.cjs → chunk-ZSPHOHOW.cjs} +2 -2
- package/dist/components/case-studies/index.cjs +11 -11
- package/dist/components/case-studies/index.js +2 -2
- package/dist/components/contact/index.cjs +3 -3
- package/dist/components/contact/index.js +2 -2
- package/dist/components/docs/index.cjs +6 -6
- package/dist/components/docs/index.js +5 -5
- package/dist/components/embeds/index.cjs +3 -3
- package/dist/components/embeds/index.js +2 -2
- package/dist/components/faq/index.cjs +3 -3
- package/dist/components/faq/index.js +2 -2
- package/dist/components/features/index.cjs +2 -22
- package/dist/components/features/index.js +1 -21
- package/dist/components/features/remote-session/index.d.ts +1 -9
- package/dist/components/features/remote-session/index.d.ts.map +1 -1
- package/dist/components/features/remote-session/remote-session-block.d.ts +2 -4
- package/dist/components/features/remote-session/remote-session-block.d.ts.map +1 -1
- package/dist/components/features/remote-session/remote-session-chat-panel.d.ts +2 -4
- package/dist/components/features/remote-session/remote-session-chat-panel.d.ts.map +1 -1
- package/dist/components/features/remote-session/remote-session-parts.d.ts +2 -13
- package/dist/components/features/remote-session/remote-session-parts.d.ts.map +1 -1
- package/dist/components/features/remote-session/types.d.ts +0 -22
- package/dist/components/features/remote-session/types.d.ts.map +1 -1
- package/dist/components/help-center-pages/index.cjs +49 -49
- package/dist/components/help-center-pages/index.js +13 -13
- package/dist/components/index.cjs +33 -53
- package/dist/components/index.js +12 -32
- package/dist/components/meeting-scheduler/index.cjs +22 -22
- package/dist/components/meeting-scheduler/index.js +1 -1
- package/dist/components/navigation/index.cjs +5 -5
- package/dist/components/navigation/index.js +4 -4
- package/dist/components/onboarding-guides/index.cjs +5 -5
- package/dist/components/onboarding-guides/index.js +4 -4
- package/dist/components/tickets/index.cjs +6 -6
- package/dist/components/tickets/index.js +5 -5
- package/dist/components/ui/index.cjs +2 -2
- package/dist/components/ui/index.js +1 -1
- package/dist/index.cjs +6 -26
- package/dist/index.js +5 -25
- package/dist/tailwind.config.cjs +1 -7
- package/dist/tailwind.config.js +1 -7
- package/package.json +1 -1
- package/src/components/features/remote-session/index.ts +0 -28
- package/src/components/features/remote-session/remote-session-block.tsx +3 -6
- package/src/components/features/remote-session/remote-session-chat-panel.tsx +7 -11
- package/src/components/features/remote-session/remote-session-parts.tsx +3 -32
- package/src/components/features/remote-session/types.ts +0 -26
- package/tailwind.config.ts +0 -6
- package/dist/components/features/remote-session/remote-session-events.d.ts +0 -24
- package/dist/components/features/remote-session/remote-session-events.d.ts.map +0 -1
- package/dist/components/features/remote-session/remote-session-keep-modals.d.ts +0 -41
- package/dist/components/features/remote-session/remote-session-keep-modals.d.ts.map +0 -1
- package/dist/components/features/remote-session/remote-session-status.d.ts +0 -34
- package/dist/components/features/remote-session/remote-session-status.d.ts.map +0 -1
- package/dist/components/features/remote-session/remote-session-viewers.d.ts +0 -15
- package/dist/components/features/remote-session/remote-session-viewers.d.ts.map +0 -1
- package/src/components/features/remote-session/remote-session-events.tsx +0 -93
- package/src/components/features/remote-session/remote-session-keep-modals.tsx +0 -208
- package/src/components/features/remote-session/remote-session-status.tsx +0 -102
- package/src/components/features/remote-session/remote-session-viewers.tsx +0 -103
|
@@ -194,7 +194,6 @@ import {
|
|
|
194
194
|
FlaskVialIcon,
|
|
195
195
|
GoogleLogoIcon,
|
|
196
196
|
HhsLogoIcon,
|
|
197
|
-
HourglassIcon,
|
|
198
197
|
ImageOffIcon,
|
|
199
198
|
ImagePlusIcon,
|
|
200
199
|
InfoCircleIcon,
|
|
@@ -202,7 +201,6 @@ import {
|
|
|
202
201
|
IsoLogoIcon,
|
|
203
202
|
LinkedinIcon,
|
|
204
203
|
LinuxLogoIcon,
|
|
205
|
-
LockIcon,
|
|
206
204
|
MessageOffIcon,
|
|
207
205
|
MessagesIcon,
|
|
208
206
|
MicrosoftLogoIcon,
|
|
@@ -30419,93 +30417,8 @@ function TimeTrackerHeaderButton({ className, disabled }) {
|
|
|
30419
30417
|
}
|
|
30420
30418
|
|
|
30421
30419
|
// src/components/features/remote-session/remote-session-parts.tsx
|
|
30422
|
-
import { useEffect as useEffect45, useState as
|
|
30423
|
-
|
|
30424
|
-
// src/components/features/remote-session/remote-session-viewers.tsx
|
|
30425
|
-
import { useState as useState77 } from "react";
|
|
30420
|
+
import { useEffect as useEffect45, useState as useState77 } from "react";
|
|
30426
30421
|
import { jsx as jsx268, jsxs as jsxs211 } from "react/jsx-runtime";
|
|
30427
|
-
function viewerLabel(viewer) {
|
|
30428
|
-
if (viewer.isHost) return `${viewer.name} (host)`;
|
|
30429
|
-
if (viewer.isYou) return `${viewer.name} (you)`;
|
|
30430
|
-
return viewer.name;
|
|
30431
|
-
}
|
|
30432
|
-
function hostFirst(viewers) {
|
|
30433
|
-
return [...viewers.filter((viewer) => viewer.isHost), ...viewers.filter((viewer) => !viewer.isHost)];
|
|
30434
|
-
}
|
|
30435
|
-
function RemoteSessionViewers({ viewers, max = 4, className }) {
|
|
30436
|
-
const [open, setOpen] = useState77(false);
|
|
30437
|
-
if (viewers.length === 0) return null;
|
|
30438
|
-
const ordered = hostFirst(viewers);
|
|
30439
|
-
const faces = ordered.slice(0, max);
|
|
30440
|
-
const overflow2 = ordered.length - faces.length;
|
|
30441
|
-
const Chevron = open ? Chevron02UpIcon : Chevron02DownIcon;
|
|
30442
|
-
return /* @__PURE__ */ jsxs211(DropdownMenu, { open, onOpenChange: setOpen, children: [
|
|
30443
|
-
/* @__PURE__ */ jsxs211(
|
|
30444
|
-
DropdownMenuTrigger,
|
|
30445
|
-
{
|
|
30446
|
-
"aria-label": `In this session: ${ordered.map(viewerLabel).join(", ")}`,
|
|
30447
|
-
className: cn(
|
|
30448
|
-
"flex shrink-0 items-center gap-[var(--spacing-system-xxs)] rounded-md outline-none",
|
|
30449
|
-
"focus-visible:ring-2 focus-visible:ring-ods-focus",
|
|
30450
|
-
className
|
|
30451
|
-
),
|
|
30452
|
-
children: [
|
|
30453
|
-
/* @__PURE__ */ jsxs211("span", { className: "flex items-center", children: [
|
|
30454
|
-
faces.map((viewer, index) => /* @__PURE__ */ jsx268(
|
|
30455
|
-
SquareAvatar,
|
|
30456
|
-
{
|
|
30457
|
-
variant: "round",
|
|
30458
|
-
sizePx: 32,
|
|
30459
|
-
src: viewer.avatarUrl ?? void 0,
|
|
30460
|
-
alt: viewer.name,
|
|
30461
|
-
fallback: viewer.name,
|
|
30462
|
-
className: cn(
|
|
30463
|
-
"relative bg-ods-bg",
|
|
30464
|
-
viewer.isHost ? "ring-2 ring-ods-accent" : "ring-1 ring-ods-border",
|
|
30465
|
-
index > 0 && "-ml-2"
|
|
30466
|
-
),
|
|
30467
|
-
style: { zIndex: faces.length - index + 1 }
|
|
30468
|
-
},
|
|
30469
|
-
viewer.id
|
|
30470
|
-
)),
|
|
30471
|
-
overflow2 > 0 && /* @__PURE__ */ jsxs211("span", { className: "relative -ml-2 flex size-8 shrink-0 items-center justify-center rounded-full bg-ods-bg text-ods-text-secondary ring-1 ring-ods-border text-h6", children: [
|
|
30472
|
-
"+",
|
|
30473
|
-
overflow2
|
|
30474
|
-
] })
|
|
30475
|
-
] }),
|
|
30476
|
-
/* @__PURE__ */ jsx268("span", { className: "flex size-8 items-center justify-center rounded-md text-ods-text-primary", children: /* @__PURE__ */ jsx268(Chevron, { size: 16, color: "currentColor" }) })
|
|
30477
|
-
]
|
|
30478
|
-
}
|
|
30479
|
-
),
|
|
30480
|
-
/* @__PURE__ */ jsx268(DropdownMenuContent, { align: "end", className: "w-[280px] p-0", children: ordered.map((viewer) => /* @__PURE__ */ jsxs211(
|
|
30481
|
-
DropdownMenuItem,
|
|
30482
|
-
{
|
|
30483
|
-
className: cn(
|
|
30484
|
-
"gap-[var(--spacing-system-xsf)] rounded-none border-b border-ods-border bg-ods-bg last:border-b-0",
|
|
30485
|
-
"py-[var(--spacing-system-s)] pl-[var(--spacing-system-mf)] pr-[var(--spacing-system-xs)] text-h4"
|
|
30486
|
-
),
|
|
30487
|
-
children: [
|
|
30488
|
-
/* @__PURE__ */ jsx268(
|
|
30489
|
-
SquareAvatar,
|
|
30490
|
-
{
|
|
30491
|
-
variant: "round",
|
|
30492
|
-
sizePx: 24,
|
|
30493
|
-
src: viewer.avatarUrl ?? void 0,
|
|
30494
|
-
alt: "",
|
|
30495
|
-
fallback: viewer.name,
|
|
30496
|
-
className: "shrink-0"
|
|
30497
|
-
}
|
|
30498
|
-
),
|
|
30499
|
-
/* @__PURE__ */ jsx268("span", { className: "min-w-0 flex-1 truncate", children: viewerLabel(viewer) })
|
|
30500
|
-
]
|
|
30501
|
-
},
|
|
30502
|
-
viewer.id
|
|
30503
|
-
)) })
|
|
30504
|
-
] });
|
|
30505
|
-
}
|
|
30506
|
-
|
|
30507
|
-
// src/components/features/remote-session/remote-session-parts.tsx
|
|
30508
|
-
import { jsx as jsx269, jsxs as jsxs212 } from "react/jsx-runtime";
|
|
30509
30422
|
var DESKTOP_SCALE = {
|
|
30510
30423
|
"--spacing-system-xs": "0.5rem",
|
|
30511
30424
|
"--spacing-system-s": "0.75rem",
|
|
@@ -30526,11 +30439,11 @@ var DESKTOP_SCALE = {
|
|
|
30526
30439
|
"--font-line-space-h6-caption": "1.25rem"
|
|
30527
30440
|
};
|
|
30528
30441
|
function RemoteSessionScope({ children, className }) {
|
|
30529
|
-
return /* @__PURE__ */
|
|
30442
|
+
return /* @__PURE__ */ jsx268("div", { "data-app-type": "openframe", style: DESKTOP_SCALE, className, children });
|
|
30530
30443
|
}
|
|
30531
30444
|
function RemoteSessionOrgLogo({ name, logoUrl, sizePx, className }) {
|
|
30532
30445
|
if (logoUrl) {
|
|
30533
|
-
return /* @__PURE__ */
|
|
30446
|
+
return /* @__PURE__ */ jsx268(
|
|
30534
30447
|
SquareAvatar,
|
|
30535
30448
|
{
|
|
30536
30449
|
variant: "square",
|
|
@@ -30543,7 +30456,7 @@ function RemoteSessionOrgLogo({ name, logoUrl, sizePx, className }) {
|
|
|
30543
30456
|
}
|
|
30544
30457
|
);
|
|
30545
30458
|
}
|
|
30546
|
-
return /* @__PURE__ */
|
|
30459
|
+
return /* @__PURE__ */ jsx268(
|
|
30547
30460
|
"div",
|
|
30548
30461
|
{
|
|
30549
30462
|
role: "img",
|
|
@@ -30553,40 +30466,19 @@ function RemoteSessionOrgLogo({ name, logoUrl, sizePx, className }) {
|
|
|
30553
30466
|
"flex shrink-0 items-center justify-center rounded-md border border-ods-border bg-ods-card",
|
|
30554
30467
|
className
|
|
30555
30468
|
),
|
|
30556
|
-
children: /* @__PURE__ */
|
|
30557
|
-
}
|
|
30558
|
-
);
|
|
30559
|
-
}
|
|
30560
|
-
function RemoteSessionRecordingTag({ className }) {
|
|
30561
|
-
return /* @__PURE__ */ jsxs212(
|
|
30562
|
-
"div",
|
|
30563
|
-
{
|
|
30564
|
-
className: cn(
|
|
30565
|
-
"flex h-8 items-center gap-[var(--spacing-system-xs)] self-start rounded-md bg-ods-success-secondary p-[var(--spacing-system-xsf)]",
|
|
30566
|
-
className
|
|
30567
|
-
),
|
|
30568
|
-
children: [
|
|
30569
|
-
/* @__PURE__ */ jsx269(RecordingIcon, { size: 16, color: "currentColor", className: "text-ods-success" }),
|
|
30570
|
-
/* @__PURE__ */ jsx269("span", { className: "text-ods-success text-h5", children: "Session Recording" })
|
|
30571
|
-
]
|
|
30469
|
+
children: /* @__PURE__ */ jsx268(OpenFrameLogo, { className: "size-1/2" })
|
|
30572
30470
|
}
|
|
30573
30471
|
);
|
|
30574
30472
|
}
|
|
30575
|
-
function
|
|
30576
|
-
|
|
30577
|
-
|
|
30578
|
-
})
|
|
30579
|
-
const hasViewers = !!viewers && viewers.length > 0;
|
|
30580
|
-
if (!showRecordingTag && !hasViewers) return null;
|
|
30581
|
-
if (!hasViewers) return /* @__PURE__ */ jsx269(RemoteSessionRecordingTag, {});
|
|
30582
|
-
return /* @__PURE__ */ jsxs212("div", { className: "flex w-full items-center gap-[var(--spacing-system-m)]", children: [
|
|
30583
|
-
showRecordingTag && /* @__PURE__ */ jsx269(RemoteSessionRecordingTag, { className: "flex-1 justify-center self-auto" }),
|
|
30584
|
-
/* @__PURE__ */ jsx269(RemoteSessionViewers, { viewers, className: "ml-auto" })
|
|
30473
|
+
function RemoteSessionRecordingTag() {
|
|
30474
|
+
return /* @__PURE__ */ jsxs211("div", { className: "flex h-8 items-center gap-[var(--spacing-system-xs)] self-start rounded-md bg-ods-success-secondary p-[var(--spacing-system-xsf)]", children: [
|
|
30475
|
+
/* @__PURE__ */ jsx268(RecordingIcon, { size: 16, color: "currentColor", className: "text-ods-success" }),
|
|
30476
|
+
/* @__PURE__ */ jsx268("span", { className: "text-ods-success text-h5", children: "Session Recording" })
|
|
30585
30477
|
] });
|
|
30586
30478
|
}
|
|
30587
30479
|
var REMOTE_SESSION_DRAG_HANDLE_CLASS = "cursor-grab active:cursor-grabbing";
|
|
30588
30480
|
function RemoteSessionDragger({ dragHandlers }) {
|
|
30589
|
-
return /* @__PURE__ */
|
|
30481
|
+
return /* @__PURE__ */ jsx268(
|
|
30590
30482
|
"span",
|
|
30591
30483
|
{
|
|
30592
30484
|
"aria-hidden": true,
|
|
@@ -30595,7 +30487,7 @@ function RemoteSessionDragger({ dragHandlers }) {
|
|
|
30595
30487
|
dragHandlers && REMOTE_SESSION_DRAG_HANDLE_CLASS
|
|
30596
30488
|
),
|
|
30597
30489
|
...dragHandlers,
|
|
30598
|
-
children: /* @__PURE__ */
|
|
30490
|
+
children: /* @__PURE__ */ jsx268(DraggerIcon, { size: 24, color: "currentColor" })
|
|
30599
30491
|
}
|
|
30600
30492
|
);
|
|
30601
30493
|
}
|
|
@@ -30607,7 +30499,7 @@ function formatRemoteSessionElapsed(elapsedMs) {
|
|
|
30607
30499
|
return hours > 0 ? `${hours}:${String(minutes).padStart(2, "0")}:${seconds}` : `${minutes}:${seconds}`;
|
|
30608
30500
|
}
|
|
30609
30501
|
function useRemoteSessionTimer(startedAt) {
|
|
30610
|
-
const [nowMs, setNowMs] =
|
|
30502
|
+
const [nowMs, setNowMs] = useState77(() => Date.now());
|
|
30611
30503
|
useEffect45(() => {
|
|
30612
30504
|
const timer = setInterval(() => setNowMs(Date.now()), 1e3);
|
|
30613
30505
|
return () => clearInterval(timer);
|
|
@@ -30616,7 +30508,7 @@ function useRemoteSessionTimer(startedAt) {
|
|
|
30616
30508
|
}
|
|
30617
30509
|
|
|
30618
30510
|
// src/components/features/remote-session/remote-access-request-card.tsx
|
|
30619
|
-
import { jsx as
|
|
30511
|
+
import { jsx as jsx269, jsxs as jsxs212 } from "react/jsx-runtime";
|
|
30620
30512
|
function displaySiteUrl(url) {
|
|
30621
30513
|
return url.replace(/^https?:\/\//, "").replace(/\/$/, "");
|
|
30622
30514
|
}
|
|
@@ -30631,30 +30523,30 @@ function RemoteAccessRequestCard({
|
|
|
30631
30523
|
const { organizationName } = party;
|
|
30632
30524
|
const siteUrl = party.organizationSiteUrl ?? void 0;
|
|
30633
30525
|
const openableSite = siteUrl?.startsWith("https://") ? siteUrl : void 0;
|
|
30634
|
-
return /* @__PURE__ */
|
|
30635
|
-
/* @__PURE__ */
|
|
30636
|
-
/* @__PURE__ */
|
|
30637
|
-
/* @__PURE__ */
|
|
30638
|
-
/* @__PURE__ */
|
|
30639
|
-
/* @__PURE__ */
|
|
30640
|
-
siteUrl && /* @__PURE__ */
|
|
30526
|
+
return /* @__PURE__ */ jsxs212("div", { className: "flex w-full flex-col gap-[var(--spacing-system-l)] rounded-md border border-ods-border bg-ods-card p-[var(--spacing-system-xl)]", children: [
|
|
30527
|
+
/* @__PURE__ */ jsx269("h1", { className: "w-full text-ods-text-primary text-h2", children: "Your IT support team is requesting remote access" }),
|
|
30528
|
+
/* @__PURE__ */ jsxs212("div", { className: "flex w-full items-center gap-[var(--spacing-system-m)] rounded-md border border-ods-border bg-ods-bg p-[var(--spacing-system-m)]", children: [
|
|
30529
|
+
/* @__PURE__ */ jsx269(RemoteSessionOrgLogo, { name: organizationName, logoUrl: party.organizationLogoUrl, sizePx: 64 }),
|
|
30530
|
+
/* @__PURE__ */ jsxs212("div", { className: "flex min-w-0 flex-1 flex-col", children: [
|
|
30531
|
+
/* @__PURE__ */ jsx269("p", { className: "w-full truncate text-ods-text-primary text-h3", children: organizationName }),
|
|
30532
|
+
siteUrl && /* @__PURE__ */ jsx269("p", { className: "w-full truncate text-ods-text-secondary text-h4", children: displaySiteUrl(siteUrl) })
|
|
30641
30533
|
] }),
|
|
30642
|
-
openableSite && onOpenSite && /* @__PURE__ */
|
|
30534
|
+
openableSite && onOpenSite && /* @__PURE__ */ jsx269(Button, { variant: "outline", size: "icon", "aria-label": "Open website", onClick: () => onOpenSite(openableSite), children: /* @__PURE__ */ jsx269(ExternalLinkIcon, { size: 24, color: "currentColor" }) })
|
|
30643
30535
|
] }),
|
|
30644
|
-
/* @__PURE__ */
|
|
30536
|
+
/* @__PURE__ */ jsxs212("p", { className: "w-full text-ods-text-primary text-h4", children: [
|
|
30645
30537
|
"A technician from ",
|
|
30646
|
-
/* @__PURE__ */
|
|
30538
|
+
/* @__PURE__ */ jsx269("span", { className: "text-ods-accent", children: organizationName }),
|
|
30647
30539
|
" will be able to view your screen and control your mouse and keyboard during this session."
|
|
30648
30540
|
] }),
|
|
30649
|
-
/* @__PURE__ */
|
|
30650
|
-
showRecordingNotice && /* @__PURE__ */
|
|
30651
|
-
/* @__PURE__ */
|
|
30652
|
-
/* @__PURE__ */
|
|
30541
|
+
/* @__PURE__ */ jsxs212("div", { className: "flex w-full flex-col gap-[var(--spacing-system-xs)]", children: [
|
|
30542
|
+
showRecordingNotice && /* @__PURE__ */ jsxs212("div", { className: "flex w-full items-center gap-[var(--spacing-system-xs)] rounded-md border border-ods-border bg-ods-bg p-[var(--spacing-system-s)]", children: [
|
|
30543
|
+
/* @__PURE__ */ jsx269(InfoCircleIcon, { size: 24, color: "currentColor", className: "shrink-0 text-ods-accent" }),
|
|
30544
|
+
/* @__PURE__ */ jsx269("p", { className: "min-w-0 flex-1 text-ods-text-primary text-h6", children: "This session will be recorded and available upon request." })
|
|
30653
30545
|
] }),
|
|
30654
|
-
error ? /* @__PURE__ */
|
|
30546
|
+
error ? /* @__PURE__ */ jsx269("p", { className: "w-full text-ods-text-primary text-h6", children: error }) : /* @__PURE__ */ jsx269("p", { className: "w-full text-ods-text-secondary text-h6", children: "You can end the session at any time." })
|
|
30655
30547
|
] }),
|
|
30656
|
-
/* @__PURE__ */
|
|
30657
|
-
/* @__PURE__ */
|
|
30548
|
+
/* @__PURE__ */ jsxs212("div", { className: "flex w-full items-stretch gap-[var(--spacing-system-l)]", children: [
|
|
30549
|
+
/* @__PURE__ */ jsx269(
|
|
30658
30550
|
Button,
|
|
30659
30551
|
{
|
|
30660
30552
|
variant: "outline",
|
|
@@ -30665,7 +30557,7 @@ function RemoteAccessRequestCard({
|
|
|
30665
30557
|
children: "Decline"
|
|
30666
30558
|
}
|
|
30667
30559
|
),
|
|
30668
|
-
/* @__PURE__ */
|
|
30560
|
+
/* @__PURE__ */ jsx269(
|
|
30669
30561
|
Button,
|
|
30670
30562
|
{
|
|
30671
30563
|
variant: "accent",
|
|
@@ -30682,10 +30574,10 @@ function RemoteAccessRequestCard({
|
|
|
30682
30574
|
|
|
30683
30575
|
// src/components/features/remote-session/remote-session-block.tsx
|
|
30684
30576
|
import { forwardRef as forwardRef31 } from "react";
|
|
30685
|
-
import { jsx as
|
|
30577
|
+
import { jsx as jsx270, jsxs as jsxs213 } from "react/jsx-runtime";
|
|
30686
30578
|
var RemoteSessionBlockFrame = forwardRef31(
|
|
30687
30579
|
({ children, expanded = false, onHide, className }, ref) => {
|
|
30688
|
-
return /* @__PURE__ */
|
|
30580
|
+
return /* @__PURE__ */ jsxs213(
|
|
30689
30581
|
"div",
|
|
30690
30582
|
{
|
|
30691
30583
|
ref,
|
|
@@ -30696,16 +30588,16 @@ var RemoteSessionBlockFrame = forwardRef31(
|
|
|
30696
30588
|
),
|
|
30697
30589
|
children: [
|
|
30698
30590
|
children,
|
|
30699
|
-
/* @__PURE__ */
|
|
30591
|
+
/* @__PURE__ */ jsxs213(
|
|
30700
30592
|
"button",
|
|
30701
30593
|
{
|
|
30702
30594
|
type: "button",
|
|
30703
30595
|
className: "flex h-12 w-full shrink-0 items-center gap-[var(--spacing-system-xs)] border-t border-ods-border bg-ods-card px-[var(--spacing-system-m)]",
|
|
30704
30596
|
onClick: onHide,
|
|
30705
30597
|
children: [
|
|
30706
|
-
/* @__PURE__ */
|
|
30707
|
-
/* @__PURE__ */
|
|
30708
|
-
/* @__PURE__ */
|
|
30598
|
+
/* @__PURE__ */ jsx270(Chevrons03RightIcon, { size: 24 }),
|
|
30599
|
+
/* @__PURE__ */ jsx270("span", { className: "min-w-0 flex-1 truncate text-left text-ods-text-secondary text-h4", children: "Hide this Block" }),
|
|
30600
|
+
/* @__PURE__ */ jsx270(OpenFrameLogo, { className: "size-6 shrink-0" })
|
|
30709
30601
|
]
|
|
30710
30602
|
}
|
|
30711
30603
|
)
|
|
@@ -30716,12 +30608,12 @@ var RemoteSessionBlockFrame = forwardRef31(
|
|
|
30716
30608
|
);
|
|
30717
30609
|
RemoteSessionBlockFrame.displayName = "RemoteSessionBlockFrame";
|
|
30718
30610
|
function RemoteSessionEndButton({ onEndSession }) {
|
|
30719
|
-
return /* @__PURE__ */
|
|
30611
|
+
return /* @__PURE__ */ jsx270(
|
|
30720
30612
|
Button,
|
|
30721
30613
|
{
|
|
30722
30614
|
variant: "outline",
|
|
30723
30615
|
fullWidth: true,
|
|
30724
|
-
leftIcon: /* @__PURE__ */
|
|
30616
|
+
leftIcon: /* @__PURE__ */ jsx270(MonitorOffIcon, { size: 24, color: "currentColor", className: "text-ods-error" }),
|
|
30725
30617
|
onClick: onEndSession,
|
|
30726
30618
|
children: "End Session"
|
|
30727
30619
|
}
|
|
@@ -30731,15 +30623,14 @@ function RemoteSessionSummary({
|
|
|
30731
30623
|
party,
|
|
30732
30624
|
elapsed,
|
|
30733
30625
|
showRecordingTag = false,
|
|
30734
|
-
viewers,
|
|
30735
30626
|
onOpenChat,
|
|
30736
30627
|
onEndSession,
|
|
30737
30628
|
dragHandlers
|
|
30738
30629
|
}) {
|
|
30739
30630
|
const technician = party.technicianName;
|
|
30740
|
-
return /* @__PURE__ */
|
|
30741
|
-
/* @__PURE__ */
|
|
30742
|
-
/* @__PURE__ */
|
|
30631
|
+
return /* @__PURE__ */ jsxs213("div", { className: "relative flex flex-col gap-[var(--spacing-system-m)] p-[var(--spacing-system-m)]", children: [
|
|
30632
|
+
/* @__PURE__ */ jsx270(RemoteSessionDragger, { dragHandlers }),
|
|
30633
|
+
/* @__PURE__ */ jsxs213(
|
|
30743
30634
|
"div",
|
|
30744
30635
|
{
|
|
30745
30636
|
className: cn(
|
|
@@ -30748,7 +30639,7 @@ function RemoteSessionSummary({
|
|
|
30748
30639
|
),
|
|
30749
30640
|
...dragHandlers,
|
|
30750
30641
|
children: [
|
|
30751
|
-
technician ? /* @__PURE__ */
|
|
30642
|
+
technician ? /* @__PURE__ */ jsx270(
|
|
30752
30643
|
SquareAvatar,
|
|
30753
30644
|
{
|
|
30754
30645
|
variant: "round",
|
|
@@ -30756,42 +30647,42 @@ function RemoteSessionSummary({
|
|
|
30756
30647
|
src: party.technicianAvatarUrl ?? void 0,
|
|
30757
30648
|
fallback: technician
|
|
30758
30649
|
}
|
|
30759
|
-
) : /* @__PURE__ */
|
|
30760
|
-
/* @__PURE__ */
|
|
30761
|
-
/* @__PURE__ */
|
|
30650
|
+
) : /* @__PURE__ */ jsx270(RemoteSessionOrgLogo, { name: party.organizationName, logoUrl: party.organizationLogoUrl, sizePx: 48 }),
|
|
30651
|
+
/* @__PURE__ */ jsxs213("div", { className: "flex min-w-0 flex-1 flex-col", children: [
|
|
30652
|
+
/* @__PURE__ */ jsxs213("p", { className: "w-full truncate text-ods-text-primary text-h4", children: [
|
|
30762
30653
|
technician ? `${technician} connected` : "IT support team is connected",
|
|
30763
30654
|
" ",
|
|
30764
|
-
/* @__PURE__ */
|
|
30655
|
+
/* @__PURE__ */ jsxs213("span", { className: "text-ods-text-secondary", children: [
|
|
30765
30656
|
"(",
|
|
30766
30657
|
elapsed,
|
|
30767
30658
|
")"
|
|
30768
30659
|
] })
|
|
30769
30660
|
] }),
|
|
30770
|
-
/* @__PURE__ */
|
|
30661
|
+
/* @__PURE__ */ jsx270("p", { className: "w-full truncate text-ods-text-secondary text-h4", children: party.organizationName })
|
|
30771
30662
|
] })
|
|
30772
30663
|
]
|
|
30773
30664
|
}
|
|
30774
30665
|
),
|
|
30775
|
-
/* @__PURE__ */
|
|
30776
|
-
/* @__PURE__ */
|
|
30777
|
-
/* @__PURE__ */
|
|
30666
|
+
showRecordingTag && /* @__PURE__ */ jsx270(RemoteSessionRecordingTag, {}),
|
|
30667
|
+
/* @__PURE__ */ jsxs213("div", { className: "flex w-full items-stretch gap-[var(--spacing-system-m)]", children: [
|
|
30668
|
+
/* @__PURE__ */ jsx270(
|
|
30778
30669
|
Button,
|
|
30779
30670
|
{
|
|
30780
30671
|
variant: "outline",
|
|
30781
30672
|
fullWidth: true,
|
|
30782
|
-
leftIcon: /* @__PURE__ */
|
|
30673
|
+
leftIcon: /* @__PURE__ */ jsx270(ChatsIcon, { size: 24, color: "currentColor" }),
|
|
30783
30674
|
onClick: onOpenChat,
|
|
30784
30675
|
children: "Open Chat"
|
|
30785
30676
|
}
|
|
30786
30677
|
),
|
|
30787
|
-
/* @__PURE__ */
|
|
30678
|
+
/* @__PURE__ */ jsx270(RemoteSessionEndButton, { onEndSession })
|
|
30788
30679
|
] })
|
|
30789
30680
|
] });
|
|
30790
30681
|
}
|
|
30791
30682
|
var RemoteSessionMinimizedChip = forwardRef31(
|
|
30792
30683
|
({ party, onExpand, dragHandlers }, ref) => {
|
|
30793
30684
|
const technician = party.technicianName;
|
|
30794
|
-
return /* @__PURE__ */
|
|
30685
|
+
return /* @__PURE__ */ jsxs213(
|
|
30795
30686
|
"button",
|
|
30796
30687
|
{
|
|
30797
30688
|
ref,
|
|
@@ -30804,7 +30695,7 @@ var RemoteSessionMinimizedChip = forwardRef31(
|
|
|
30804
30695
|
onClick: onExpand,
|
|
30805
30696
|
...dragHandlers,
|
|
30806
30697
|
children: [
|
|
30807
|
-
technician ? /* @__PURE__ */
|
|
30698
|
+
technician ? /* @__PURE__ */ jsx270(
|
|
30808
30699
|
SquareAvatar,
|
|
30809
30700
|
{
|
|
30810
30701
|
sizePx: 48,
|
|
@@ -30812,7 +30703,7 @@ var RemoteSessionMinimizedChip = forwardRef31(
|
|
|
30812
30703
|
fallback: technician,
|
|
30813
30704
|
className: "rounded-none"
|
|
30814
30705
|
}
|
|
30815
|
-
) : /* @__PURE__ */
|
|
30706
|
+
) : /* @__PURE__ */ jsx270(
|
|
30816
30707
|
RemoteSessionOrgLogo,
|
|
30817
30708
|
{
|
|
30818
30709
|
name: party.organizationName,
|
|
@@ -30821,7 +30712,7 @@ var RemoteSessionMinimizedChip = forwardRef31(
|
|
|
30821
30712
|
className: "rounded-none border-0"
|
|
30822
30713
|
}
|
|
30823
30714
|
),
|
|
30824
|
-
/* @__PURE__ */
|
|
30715
|
+
/* @__PURE__ */ jsx270("span", { className: "flex h-9 w-12 items-center justify-center border-t border-ods-border bg-ods-card", children: /* @__PURE__ */ jsx270(Chevrons03LeftIcon, { size: 24 }) })
|
|
30825
30716
|
]
|
|
30826
30717
|
}
|
|
30827
30718
|
);
|
|
@@ -30831,7 +30722,7 @@ RemoteSessionMinimizedChip.displayName = "RemoteSessionMinimizedChip";
|
|
|
30831
30722
|
|
|
30832
30723
|
// src/components/features/remote-session/remote-session-chat-panel.tsx
|
|
30833
30724
|
import { useEffect as useEffect46, useRef as useRef40 } from "react";
|
|
30834
|
-
import { jsx as
|
|
30725
|
+
import { jsx as jsx271, jsxs as jsxs214 } from "react/jsx-runtime";
|
|
30835
30726
|
function formatTime2(at) {
|
|
30836
30727
|
return at.toLocaleTimeString([], { hour: "numeric", minute: "2-digit" });
|
|
30837
30728
|
}
|
|
@@ -30840,7 +30731,6 @@ function RemoteSessionChatPanel({
|
|
|
30840
30731
|
elapsed,
|
|
30841
30732
|
messages,
|
|
30842
30733
|
showRecordingTag = false,
|
|
30843
|
-
viewers,
|
|
30844
30734
|
draft,
|
|
30845
30735
|
onDraftChange,
|
|
30846
30736
|
onSend,
|
|
@@ -30861,10 +30751,10 @@ function RemoteSessionChatPanel({
|
|
|
30861
30751
|
onSend(text);
|
|
30862
30752
|
onDraftChange("");
|
|
30863
30753
|
};
|
|
30864
|
-
return /* @__PURE__ */
|
|
30865
|
-
/* @__PURE__ */
|
|
30866
|
-
/* @__PURE__ */
|
|
30867
|
-
/* @__PURE__ */
|
|
30754
|
+
return /* @__PURE__ */ jsxs214("div", { className: "flex min-h-0 flex-1 flex-col", children: [
|
|
30755
|
+
/* @__PURE__ */ jsxs214("div", { className: "relative flex flex-col gap-[var(--spacing-system-m)] p-[var(--spacing-system-m)]", children: [
|
|
30756
|
+
/* @__PURE__ */ jsx271(RemoteSessionDragger, { dragHandlers }),
|
|
30757
|
+
/* @__PURE__ */ jsxs214(
|
|
30868
30758
|
"div",
|
|
30869
30759
|
{
|
|
30870
30760
|
className: cn(
|
|
@@ -30873,45 +30763,45 @@ function RemoteSessionChatPanel({
|
|
|
30873
30763
|
),
|
|
30874
30764
|
...dragHandlers,
|
|
30875
30765
|
children: [
|
|
30876
|
-
/* @__PURE__ */
|
|
30766
|
+
/* @__PURE__ */ jsxs214("p", { className: "w-full truncate text-ods-text-primary text-h4", children: [
|
|
30877
30767
|
"Your IT support team is connected ",
|
|
30878
|
-
/* @__PURE__ */
|
|
30768
|
+
/* @__PURE__ */ jsxs214("span", { className: "text-ods-text-secondary", children: [
|
|
30879
30769
|
"(",
|
|
30880
30770
|
elapsed,
|
|
30881
30771
|
")"
|
|
30882
30772
|
] })
|
|
30883
30773
|
] }),
|
|
30884
|
-
/* @__PURE__ */
|
|
30774
|
+
/* @__PURE__ */ jsx271("p", { className: "w-full truncate text-ods-text-secondary text-h4", children: "You can end this session at any time" })
|
|
30885
30775
|
]
|
|
30886
30776
|
}
|
|
30887
30777
|
),
|
|
30888
|
-
/* @__PURE__ */
|
|
30889
|
-
/* @__PURE__ */
|
|
30890
|
-
/* @__PURE__ */
|
|
30778
|
+
showRecordingTag && /* @__PURE__ */ jsx271(RemoteSessionRecordingTag, {}),
|
|
30779
|
+
/* @__PURE__ */ jsxs214("div", { className: "flex w-full items-stretch gap-[var(--spacing-system-m)]", children: [
|
|
30780
|
+
/* @__PURE__ */ jsx271(
|
|
30891
30781
|
Button,
|
|
30892
30782
|
{
|
|
30893
30783
|
variant: "outline",
|
|
30894
30784
|
fullWidth: true,
|
|
30895
|
-
leftIcon: /* @__PURE__ */
|
|
30785
|
+
leftIcon: /* @__PURE__ */ jsx271(MessageOffIcon, { size: 24, color: "currentColor" }),
|
|
30896
30786
|
onClick: onCloseChat,
|
|
30897
30787
|
children: "Close Chat"
|
|
30898
30788
|
}
|
|
30899
30789
|
),
|
|
30900
|
-
/* @__PURE__ */
|
|
30790
|
+
/* @__PURE__ */ jsx271(RemoteSessionEndButton, { onEndSession })
|
|
30901
30791
|
] })
|
|
30902
30792
|
] }),
|
|
30903
|
-
/* @__PURE__ */
|
|
30793
|
+
/* @__PURE__ */ jsx271(
|
|
30904
30794
|
"div",
|
|
30905
30795
|
{
|
|
30906
30796
|
ref: listRef,
|
|
30907
30797
|
className: "flex min-h-0 flex-1 flex-col overflow-y-auto bg-ods-card p-[var(--spacing-system-m)]",
|
|
30908
|
-
children: /* @__PURE__ */
|
|
30909
|
-
(message) => message.author === "system" ? /* @__PURE__ */
|
|
30798
|
+
children: /* @__PURE__ */ jsx271("div", { className: "mt-auto flex flex-col gap-[var(--spacing-system-s)]", children: messages.map(
|
|
30799
|
+
(message) => message.author === "system" ? /* @__PURE__ */ jsx271("p", { className: "w-full text-center text-ods-text-secondary text-h6", children: message.text }, message.id) : /* @__PURE__ */ jsx271(RemoteSessionChatMessageRow, { message, party }, message.id)
|
|
30910
30800
|
) })
|
|
30911
30801
|
}
|
|
30912
30802
|
),
|
|
30913
|
-
error && /* @__PURE__ */
|
|
30914
|
-
/* @__PURE__ */
|
|
30803
|
+
error && /* @__PURE__ */ jsx271("p", { className: "bg-ods-card px-[var(--spacing-system-m)] text-ods-error text-h6", children: error }),
|
|
30804
|
+
/* @__PURE__ */ jsxs214(
|
|
30915
30805
|
"form",
|
|
30916
30806
|
{
|
|
30917
30807
|
className: "flex items-center gap-[var(--spacing-system-xs)] bg-ods-card px-[var(--spacing-system-m)] pb-[var(--spacing-system-m)]",
|
|
@@ -30920,7 +30810,7 @@ function RemoteSessionChatPanel({
|
|
|
30920
30810
|
handleSend();
|
|
30921
30811
|
},
|
|
30922
30812
|
children: [
|
|
30923
|
-
/* @__PURE__ */
|
|
30813
|
+
/* @__PURE__ */ jsx271(
|
|
30924
30814
|
"input",
|
|
30925
30815
|
{
|
|
30926
30816
|
value: draft,
|
|
@@ -30931,14 +30821,14 @@ function RemoteSessionChatPanel({
|
|
|
30931
30821
|
className: "h-12 min-w-0 flex-1 rounded-md border border-ods-border bg-ods-bg px-[var(--spacing-system-s)] text-ods-text-primary outline-none text-h6 placeholder:text-ods-text-secondary"
|
|
30932
30822
|
}
|
|
30933
30823
|
),
|
|
30934
|
-
/* @__PURE__ */
|
|
30824
|
+
/* @__PURE__ */ jsx271(
|
|
30935
30825
|
"button",
|
|
30936
30826
|
{
|
|
30937
30827
|
type: "submit",
|
|
30938
30828
|
"aria-label": "Send message",
|
|
30939
30829
|
disabled: !ready,
|
|
30940
30830
|
className: "flex size-12 shrink-0 items-center justify-center",
|
|
30941
|
-
children: /* @__PURE__ */
|
|
30831
|
+
children: /* @__PURE__ */ jsx271(Send03Icon, { size: 24, color: "currentColor", className: "text-ods-text-primary" })
|
|
30942
30832
|
}
|
|
30943
30833
|
)
|
|
30944
30834
|
]
|
|
@@ -30952,9 +30842,9 @@ function RemoteSessionChatMessageRow({
|
|
|
30952
30842
|
}) {
|
|
30953
30843
|
const isTechnician = message.author === "technician";
|
|
30954
30844
|
const technician = message.name ?? party.technicianName ?? "Technician";
|
|
30955
|
-
return /* @__PURE__ */
|
|
30956
|
-
/* @__PURE__ */
|
|
30957
|
-
isTechnician && /* @__PURE__ */
|
|
30845
|
+
return /* @__PURE__ */ jsxs214("div", { className: "flex w-full flex-col", children: [
|
|
30846
|
+
/* @__PURE__ */ jsxs214("div", { className: "flex w-full items-center gap-[var(--spacing-system-xs)]", children: [
|
|
30847
|
+
isTechnician && /* @__PURE__ */ jsx271(
|
|
30958
30848
|
SquareAvatar,
|
|
30959
30849
|
{
|
|
30960
30850
|
variant: "round",
|
|
@@ -30963,7 +30853,7 @@ function RemoteSessionChatMessageRow({
|
|
|
30963
30853
|
fallback: technician
|
|
30964
30854
|
}
|
|
30965
30855
|
),
|
|
30966
|
-
/* @__PURE__ */
|
|
30856
|
+
/* @__PURE__ */ jsx271(
|
|
30967
30857
|
"span",
|
|
30968
30858
|
{
|
|
30969
30859
|
className: cn(
|
|
@@ -30973,14 +30863,14 @@ function RemoteSessionChatMessageRow({
|
|
|
30973
30863
|
children: isTechnician ? technician : "User"
|
|
30974
30864
|
}
|
|
30975
30865
|
),
|
|
30976
|
-
/* @__PURE__ */
|
|
30866
|
+
/* @__PURE__ */ jsx271("span", { className: "shrink-0 text-ods-text-secondary text-h6", children: formatTime2(message.at) })
|
|
30977
30867
|
] }),
|
|
30978
|
-
/* @__PURE__ */
|
|
30868
|
+
/* @__PURE__ */ jsx271("p", { className: "w-full break-words text-ods-text-primary text-h6", children: message.text })
|
|
30979
30869
|
] });
|
|
30980
30870
|
}
|
|
30981
30871
|
|
|
30982
30872
|
// src/components/features/remote-session/remote-session-dialog.tsx
|
|
30983
|
-
import { jsx as
|
|
30873
|
+
import { jsx as jsx272, jsxs as jsxs215 } from "react/jsx-runtime";
|
|
30984
30874
|
var NOTICE_COPY = {
|
|
30985
30875
|
"session-ended": { title: "Remote session ended", suffix: "has disconnected from your device." },
|
|
30986
30876
|
"connection-lost": { title: "Connection lost", suffix: "lost the connection to your device." }
|
|
@@ -30993,315 +30883,49 @@ function RemoteSessionDialog({
|
|
|
30993
30883
|
onClose
|
|
30994
30884
|
}) {
|
|
30995
30885
|
if (variant === "end-confirm") {
|
|
30996
|
-
return /* @__PURE__ */
|
|
30997
|
-
/* @__PURE__ */
|
|
30998
|
-
/* @__PURE__ */
|
|
30999
|
-
/* @__PURE__ */
|
|
30886
|
+
return /* @__PURE__ */ jsxs215(DialogCard, { children: [
|
|
30887
|
+
/* @__PURE__ */ jsxs215("div", { className: "flex w-full flex-col gap-[var(--spacing-system-xs)]", children: [
|
|
30888
|
+
/* @__PURE__ */ jsx272("h1", { className: "w-full text-ods-text-primary text-h2", children: "End remote session?" }),
|
|
30889
|
+
/* @__PURE__ */ jsx272("p", { className: "w-full text-ods-text-primary text-h4", children: "The technician will lose access to your device immediately." })
|
|
31000
30890
|
] }),
|
|
31001
|
-
/* @__PURE__ */
|
|
31002
|
-
/* @__PURE__ */
|
|
31003
|
-
/* @__PURE__ */
|
|
30891
|
+
/* @__PURE__ */ jsxs215("div", { className: "flex w-full items-stretch gap-[var(--spacing-system-l)]", children: [
|
|
30892
|
+
/* @__PURE__ */ jsx272(Button, { variant: "outline", fullWidth: true, disabled: ending, onClick: onClose, children: "Cancel" }),
|
|
30893
|
+
/* @__PURE__ */ jsx272(Button, { variant: "destructive", fullWidth: true, loading: ending, onClick: onEndSession, children: "End Session" })
|
|
31004
30894
|
] })
|
|
31005
30895
|
] });
|
|
31006
30896
|
}
|
|
31007
30897
|
const copy = NOTICE_COPY[variant];
|
|
31008
|
-
return /* @__PURE__ */
|
|
31009
|
-
/* @__PURE__ */
|
|
31010
|
-
/* @__PURE__ */
|
|
31011
|
-
/* @__PURE__ */
|
|
31012
|
-
/* @__PURE__ */
|
|
30898
|
+
return /* @__PURE__ */ jsxs215(DialogCard, { children: [
|
|
30899
|
+
/* @__PURE__ */ jsxs215("div", { className: "flex w-full flex-col gap-[var(--spacing-system-xs)]", children: [
|
|
30900
|
+
/* @__PURE__ */ jsx272("h1", { className: "w-full text-ods-text-primary text-h2", children: copy.title }),
|
|
30901
|
+
/* @__PURE__ */ jsxs215("p", { className: "w-full text-ods-text-primary text-h4", children: [
|
|
30902
|
+
/* @__PURE__ */ jsx272("span", { className: "text-ods-accent", children: organizationName }),
|
|
31013
30903
|
" ",
|
|
31014
30904
|
copy.suffix
|
|
31015
30905
|
] })
|
|
31016
30906
|
] }),
|
|
31017
|
-
/* @__PURE__ */
|
|
30907
|
+
/* @__PURE__ */ jsx272("div", { className: "flex w-full justify-end", children: /* @__PURE__ */ jsx272(Button, { variant: "outline", className: "w-1/2", onClick: onClose, children: "Close" }) })
|
|
31018
30908
|
] });
|
|
31019
30909
|
}
|
|
31020
30910
|
function DialogCard({ children }) {
|
|
31021
|
-
return /* @__PURE__ */
|
|
30911
|
+
return /* @__PURE__ */ jsx272("div", { className: "flex w-full flex-col gap-[var(--spacing-system-l)] rounded-md border border-ods-border bg-ods-card p-[var(--spacing-system-xl)]", children });
|
|
31022
30912
|
}
|
|
31023
30913
|
|
|
31024
30914
|
// src/components/features/remote-session/remote-session-overlay.tsx
|
|
31025
|
-
import { jsx as
|
|
30915
|
+
import { jsx as jsx273, jsxs as jsxs216 } from "react/jsx-runtime";
|
|
31026
30916
|
function RemoteSessionBorder({ className }) {
|
|
31027
|
-
return /* @__PURE__ */
|
|
30917
|
+
return /* @__PURE__ */ jsx273("div", { className: cn("pointer-events-none size-full border-4 border-ods-warning", className) });
|
|
31028
30918
|
}
|
|
31029
30919
|
function RemoteSessionPill({ onEndSession }) {
|
|
31030
|
-
return /* @__PURE__ */
|
|
30920
|
+
return /* @__PURE__ */ jsxs216(
|
|
31031
30921
|
"button",
|
|
31032
30922
|
{
|
|
31033
30923
|
type: "button",
|
|
31034
30924
|
className: "flex items-center gap-[var(--spacing-system-xsf)] rounded-b-md bg-ods-warning px-[var(--spacing-system-m)] py-[var(--spacing-system-xs)] text-ods-text-on-accent",
|
|
31035
30925
|
onClick: onEndSession,
|
|
31036
30926
|
children: [
|
|
31037
|
-
/* @__PURE__ */
|
|
31038
|
-
/* @__PURE__ */
|
|
31039
|
-
]
|
|
31040
|
-
}
|
|
31041
|
-
);
|
|
31042
|
-
}
|
|
31043
|
-
|
|
31044
|
-
// src/components/features/remote-session/remote-session-keep-modals.tsx
|
|
31045
|
-
import { useState as useState79 } from "react";
|
|
31046
|
-
import { jsx as jsx275, jsxs as jsxs218 } from "react/jsx-runtime";
|
|
31047
|
-
var REMOTE_SESSION_KEEP_REASON_LABELS = {
|
|
31048
|
-
CLIENT_DISPUTE: "Client dispute",
|
|
31049
|
-
INTERNAL_REVIEW: "Internal review",
|
|
31050
|
-
LEGAL_OR_COMPLIANCE: "Legal or compliance request",
|
|
31051
|
-
OTHER: "Other"
|
|
31052
|
-
};
|
|
31053
|
-
var KEEP_REASONS = Object.keys(REMOTE_SESSION_KEEP_REASON_LABELS);
|
|
31054
|
-
var DESCRIPTION_MAX_LENGTH = 500;
|
|
31055
|
-
function KeepNotice({ icon, title, children }) {
|
|
31056
|
-
return /* @__PURE__ */ jsxs218("div", { className: "flex w-full items-start gap-[var(--spacing-system-m)] rounded-md border border-ods-border bg-ods-card p-[var(--spacing-system-m)]", children: [
|
|
31057
|
-
/* @__PURE__ */ jsx275("span", { className: "flex shrink-0 text-ods-text-secondary", children: icon }),
|
|
31058
|
-
/* @__PURE__ */ jsxs218("div", { className: "flex min-w-0 flex-1 flex-col", children: [
|
|
31059
|
-
/* @__PURE__ */ jsx275("p", { className: "text-ods-text-primary text-h3", children: title }),
|
|
31060
|
-
/* @__PURE__ */ jsx275("p", { className: "text-ods-text-secondary text-h4", children })
|
|
31061
|
-
] })
|
|
31062
|
-
] });
|
|
31063
|
-
}
|
|
31064
|
-
function KeepRecordingModal({
|
|
31065
|
-
isOpen,
|
|
31066
|
-
onClose,
|
|
31067
|
-
keptUsage,
|
|
31068
|
-
isPending = false,
|
|
31069
|
-
onConfirm
|
|
31070
|
-
}) {
|
|
31071
|
-
const [reason, setReason] = useState79("");
|
|
31072
|
-
const [description, setDescription] = useState79("");
|
|
31073
|
-
const [seededOpen, setSeededOpen] = useState79(isOpen);
|
|
31074
|
-
if (seededOpen !== isOpen) {
|
|
31075
|
-
setSeededOpen(isOpen);
|
|
31076
|
-
if (isOpen) {
|
|
31077
|
-
setReason("");
|
|
31078
|
-
setDescription("");
|
|
31079
|
-
}
|
|
31080
|
-
}
|
|
31081
|
-
const trimmed = description.trim();
|
|
31082
|
-
const canKeep = reason !== "" && (reason !== "OTHER" || trimmed !== "");
|
|
31083
|
-
const handleKeep = () => {
|
|
31084
|
-
if (!canKeep || isPending) return;
|
|
31085
|
-
onConfirm({ reason, description: reason === "OTHER" ? trimmed : null });
|
|
31086
|
-
};
|
|
31087
|
-
return /* @__PURE__ */ jsxs218(Modal, { isOpen, onClose: isPending ? () => {
|
|
31088
|
-
} : onClose, className: "text-left md:max-w-[600px]", children: [
|
|
31089
|
-
/* @__PURE__ */ jsx275(ModalHeader, { children: /* @__PURE__ */ jsx275(ModalTitle, { children: "Keep this recording" }) }),
|
|
31090
|
-
/* @__PURE__ */ jsxs218(
|
|
31091
|
-
KeepNotice,
|
|
31092
|
-
{
|
|
31093
|
-
icon: /* @__PURE__ */ jsx275(InfoCircleIcon, { size: 24, color: "currentColor" }),
|
|
31094
|
-
title: "This recording won't be deleted automatically",
|
|
31095
|
-
children: [
|
|
31096
|
-
"It stays until you stop keeping it. Kept recordings use ",
|
|
31097
|
-
keptUsage,
|
|
31098
|
-
"."
|
|
31099
|
-
]
|
|
31100
|
-
}
|
|
31101
|
-
),
|
|
31102
|
-
/* @__PURE__ */ jsxs218("div", { className: "flex w-full flex-col gap-[var(--spacing-system-xs)]", children: [
|
|
31103
|
-
/* @__PURE__ */ jsxs218(
|
|
31104
|
-
Select,
|
|
31105
|
-
{
|
|
31106
|
-
value: reason,
|
|
31107
|
-
onValueChange: (value) => setReason(value),
|
|
31108
|
-
disabled: isPending,
|
|
31109
|
-
children: [
|
|
31110
|
-
/* @__PURE__ */ jsx275(SelectTrigger, { label: "Reason", labelVariant: "large", children: /* @__PURE__ */ jsx275(SelectValue, { placeholder: "Select Reason" }) }),
|
|
31111
|
-
/* @__PURE__ */ jsx275(SelectContent, { children: KEEP_REASONS.map((value) => /* @__PURE__ */ jsx275(SelectItem, { value, children: REMOTE_SESSION_KEEP_REASON_LABELS[value] }, value)) })
|
|
31112
|
-
]
|
|
31113
|
-
}
|
|
31114
|
-
),
|
|
31115
|
-
reason === "OTHER" && /* @__PURE__ */ jsx275(
|
|
31116
|
-
Input,
|
|
31117
|
-
{
|
|
31118
|
-
"aria-label": "Reason description",
|
|
31119
|
-
value: description,
|
|
31120
|
-
onChange: (event) => setDescription(event.target.value),
|
|
31121
|
-
placeholder: "Briefly describe what's going on",
|
|
31122
|
-
maxLength: DESCRIPTION_MAX_LENGTH,
|
|
31123
|
-
disabled: isPending
|
|
31124
|
-
}
|
|
31125
|
-
)
|
|
31126
|
-
] }),
|
|
31127
|
-
/* @__PURE__ */ jsxs218(ModalFooter, { children: [
|
|
31128
|
-
/* @__PURE__ */ jsx275(Button, { type: "button", variant: "outline", onClick: onClose, disabled: isPending, className: "flex-1 md:hidden", children: "Cancel" }),
|
|
31129
|
-
/* @__PURE__ */ jsx275("div", { className: "hidden flex-1 md:block" }),
|
|
31130
|
-
/* @__PURE__ */ jsx275(
|
|
31131
|
-
Button,
|
|
31132
|
-
{
|
|
31133
|
-
type: "button",
|
|
31134
|
-
variant: "accent",
|
|
31135
|
-
onClick: handleKeep,
|
|
31136
|
-
loading: isPending,
|
|
31137
|
-
disabled: !canKeep,
|
|
31138
|
-
className: "flex-1",
|
|
31139
|
-
children: "Keep"
|
|
31140
|
-
}
|
|
31141
|
-
)
|
|
31142
|
-
] })
|
|
31143
|
-
] });
|
|
31144
|
-
}
|
|
31145
|
-
function ReleaseKeepingModal({
|
|
31146
|
-
isOpen,
|
|
31147
|
-
onClose,
|
|
31148
|
-
keptBy,
|
|
31149
|
-
keptOn,
|
|
31150
|
-
reason,
|
|
31151
|
-
ticket,
|
|
31152
|
-
expiresOn,
|
|
31153
|
-
dueOn,
|
|
31154
|
-
isPending = false,
|
|
31155
|
-
onConfirm
|
|
31156
|
-
}) {
|
|
31157
|
-
return /* @__PURE__ */ jsxs218(Modal, { isOpen, onClose: isPending ? () => {
|
|
31158
|
-
} : onClose, className: "text-left md:max-w-[600px]", children: [
|
|
31159
|
-
/* @__PURE__ */ jsx275(ModalHeader, { children: /* @__PURE__ */ jsx275(ModalTitle, { children: "Release Keeping" }) }),
|
|
31160
|
-
/* @__PURE__ */ jsxs218("div", { className: "flex w-full flex-col gap-[var(--spacing-system-xsf)] text-ods-text-primary text-h4", children: [
|
|
31161
|
-
/* @__PURE__ */ jsxs218("p", { children: [
|
|
31162
|
-
"Kept by ",
|
|
31163
|
-
keptBy,
|
|
31164
|
-
" on ",
|
|
31165
|
-
keptOn,
|
|
31166
|
-
" for ",
|
|
31167
|
-
reason,
|
|
31168
|
-
"."
|
|
31169
|
-
] }),
|
|
31170
|
-
ticket && /* @__PURE__ */ jsxs218("p", { children: [
|
|
31171
|
-
"Ticket: ",
|
|
31172
|
-
ticket
|
|
31173
|
-
] })
|
|
31174
|
-
] }),
|
|
31175
|
-
/* @__PURE__ */ jsx275(KeepNotice, { icon: /* @__PURE__ */ jsx275(HourglassIcon, { size: 24, color: "currentColor" }), title: `It will expire on ${expiresOn}`, children: dueOn ? `It was due to expire on ${dueOn}. Releasing gives it 3 days' grace, and it shows amber until then. Whoever placed the Keep is reminded the day before it goes. Nothing is deleted now.` : "Nothing is deleted now." }),
|
|
31176
|
-
/* @__PURE__ */ jsxs218(ModalFooter, { children: [
|
|
31177
|
-
/* @__PURE__ */ jsx275(Button, { type: "button", variant: "outline", onClick: onClose, disabled: isPending, className: "flex-1 md:hidden", children: "Cancel" }),
|
|
31178
|
-
/* @__PURE__ */ jsx275("div", { className: "hidden flex-1 md:block" }),
|
|
31179
|
-
/* @__PURE__ */ jsx275(Button, { type: "button", variant: "accent", onClick: onConfirm, loading: isPending, className: "flex-1", children: "Release Keeping" })
|
|
31180
|
-
] })
|
|
31181
|
-
] });
|
|
31182
|
-
}
|
|
31183
|
-
|
|
31184
|
-
// src/components/features/remote-session/remote-session-events.tsx
|
|
31185
|
-
import { jsx as jsx276, jsxs as jsxs219 } from "react/jsx-runtime";
|
|
31186
|
-
function formatRemoteSessionOffset(offsetMs) {
|
|
31187
|
-
const total = Math.max(0, Math.floor(offsetMs / 1e3));
|
|
31188
|
-
const hours = Math.floor(total / 3600);
|
|
31189
|
-
const minutes = String(Math.floor(total % 3600 / 60)).padStart(2, "0");
|
|
31190
|
-
const seconds = String(total % 60).padStart(2, "0");
|
|
31191
|
-
return hours > 0 ? `${hours}:${minutes}:${seconds}` : `${minutes}:${seconds}`;
|
|
31192
|
-
}
|
|
31193
|
-
function RemoteSessionEventList({ events, activeEventId, onSelect, className }) {
|
|
31194
|
-
return /* @__PURE__ */ jsxs219("section", { className: cn("flex w-full flex-col gap-[var(--spacing-system-xxs)]", className), children: [
|
|
31195
|
-
/* @__PURE__ */ jsx276("h2", { className: "text-ods-text-secondary text-h5", children: "Session Events" }),
|
|
31196
|
-
/* @__PURE__ */ jsx276("ol", { className: "flex w-full flex-col gap-[var(--spacing-system-xxs)] rounded-md border border-ods-border bg-ods-card p-[var(--spacing-system-m)]", children: events.map((event) => /* @__PURE__ */ jsx276("li", { children: /* @__PURE__ */ jsxs219(
|
|
31197
|
-
"button",
|
|
31198
|
-
{
|
|
31199
|
-
type: "button",
|
|
31200
|
-
"aria-current": event.id === activeEventId || void 0,
|
|
31201
|
-
onClick: () => onSelect?.(event),
|
|
31202
|
-
className: cn(
|
|
31203
|
-
"flex w-full items-start gap-[var(--spacing-system-xxs)] rounded-md p-[var(--spacing-system-xxs)] text-left outline-none transition-colors",
|
|
31204
|
-
"hover:bg-ods-bg-hover focus-visible:ring-2 focus-visible:ring-ods-focus",
|
|
31205
|
-
event.id === activeEventId && "bg-ods-border hover:bg-ods-border"
|
|
31206
|
-
),
|
|
31207
|
-
children: [
|
|
31208
|
-
/* @__PURE__ */ jsx276("span", { className: "w-[84px] shrink-0 text-ods-text-secondary text-h4", children: formatRemoteSessionOffset(event.offsetMs) }),
|
|
31209
|
-
/* @__PURE__ */ jsxs219("span", { className: "flex min-w-0 flex-1 flex-col", children: [
|
|
31210
|
-
/* @__PURE__ */ jsx276("span", { className: "text-ods-text-primary text-h4", children: event.title }),
|
|
31211
|
-
event.detail && /* @__PURE__ */ jsx276("span", { className: "text-ods-text-secondary text-h6", children: event.detail })
|
|
31212
|
-
] })
|
|
31213
|
-
]
|
|
31214
|
-
}
|
|
31215
|
-
) }, event.id)) })
|
|
31216
|
-
] });
|
|
31217
|
-
}
|
|
31218
|
-
function RemoteSessionTimelineMarkers({
|
|
31219
|
-
events,
|
|
31220
|
-
durationMs,
|
|
31221
|
-
onSelect,
|
|
31222
|
-
className
|
|
31223
|
-
}) {
|
|
31224
|
-
if (durationMs <= 0) return null;
|
|
31225
|
-
return /* @__PURE__ */ jsx276("div", { className: cn("relative h-4 w-full", className), children: events.map((event) => {
|
|
31226
|
-
const share = Math.min(1, Math.max(0, event.offsetMs / durationMs));
|
|
31227
|
-
const label = `${event.title} at ${formatRemoteSessionOffset(event.offsetMs)}`;
|
|
31228
|
-
return /* @__PURE__ */ jsx276(
|
|
31229
|
-
"button",
|
|
31230
|
-
{
|
|
31231
|
-
type: "button",
|
|
31232
|
-
"aria-label": label,
|
|
31233
|
-
title: label,
|
|
31234
|
-
onClick: () => onSelect?.(event),
|
|
31235
|
-
style: { left: `${share * 100}%` },
|
|
31236
|
-
className: "absolute top-0 h-4 w-1 -translate-x-1/2 rounded-md bg-ods-text-secondary outline-none transition-colors hover:bg-ods-text-primary focus-visible:ring-2 focus-visible:ring-ods-focus"
|
|
31237
|
-
},
|
|
31238
|
-
event.id
|
|
31239
|
-
);
|
|
31240
|
-
}) });
|
|
31241
|
-
}
|
|
31242
|
-
|
|
31243
|
-
// src/components/features/remote-session/remote-session-status.tsx
|
|
31244
|
-
import { jsx as jsx277, jsxs as jsxs220 } from "react/jsx-runtime";
|
|
31245
|
-
function LiveDot() {
|
|
31246
|
-
return /* @__PURE__ */ jsx277("span", { "aria-hidden": true, className: "size-2 animate-live-pulse rounded-full bg-current motion-reduce:animate-none" });
|
|
31247
|
-
}
|
|
31248
|
-
var STATUS_TAG = {
|
|
31249
|
-
live: { label: "Live", variant: "critical" },
|
|
31250
|
-
processing: { label: "Processing", variant: "warning" },
|
|
31251
|
-
failed: { label: "Failed", variant: "error" }
|
|
31252
|
-
};
|
|
31253
|
-
function RemoteSessionStatusTag({ status, className }) {
|
|
31254
|
-
const { label, variant } = STATUS_TAG[status];
|
|
31255
|
-
return /* @__PURE__ */ jsx277(
|
|
31256
|
-
Tag,
|
|
31257
|
-
{
|
|
31258
|
-
label,
|
|
31259
|
-
variant,
|
|
31260
|
-
icon: status === "live" ? /* @__PURE__ */ jsx277(LiveDot, {}) : void 0,
|
|
31261
|
-
className: cn("pointer-events-none shrink-0", className)
|
|
31262
|
-
}
|
|
31263
|
-
);
|
|
31264
|
-
}
|
|
31265
|
-
function RemoteSessionExpiry(props) {
|
|
31266
|
-
const { className } = props;
|
|
31267
|
-
if (props.state === "none") {
|
|
31268
|
-
return /* @__PURE__ */ jsx277("p", { className: cn("text-ods-text-primary text-h4", className), children: "-" });
|
|
31269
|
-
}
|
|
31270
|
-
if (props.state === "expired") {
|
|
31271
|
-
return /* @__PURE__ */ jsx277("p", { className: cn("text-ods-text-secondary text-h4", className), children: "Expired" });
|
|
31272
|
-
}
|
|
31273
|
-
if (props.state === "kept") {
|
|
31274
|
-
return /* @__PURE__ */ jsxs220("div", { className: cn("flex min-w-0 flex-col", className), children: [
|
|
31275
|
-
/* @__PURE__ */ jsxs220("p", { className: "flex items-center gap-[var(--spacing-system-xxs)] text-ods-text-primary text-h4", children: [
|
|
31276
|
-
/* @__PURE__ */ jsx277(LockIcon, { size: 24, color: "currentColor", className: "shrink-0" }),
|
|
31277
|
-
"Kept"
|
|
31278
|
-
] }),
|
|
31279
|
-
/* @__PURE__ */ jsxs220("p", { className: "truncate text-ods-text-secondary text-h6", children: [
|
|
31280
|
-
"Kept by ",
|
|
31281
|
-
props.keptBy,
|
|
31282
|
-
" \xB7 ",
|
|
31283
|
-
props.reason
|
|
31284
|
-
] })
|
|
31285
|
-
] });
|
|
31286
|
-
}
|
|
31287
|
-
return /* @__PURE__ */ jsxs220("div", { className: cn("flex min-w-0 flex-col", className), children: [
|
|
31288
|
-
/* @__PURE__ */ jsx277("p", { className: "text-ods-text-primary text-h4", children: props.date }),
|
|
31289
|
-
props.remaining && /* @__PURE__ */ jsx277("p", { className: "truncate text-ods-text-secondary text-h6", children: props.remaining })
|
|
31290
|
-
] });
|
|
31291
|
-
}
|
|
31292
|
-
function RemoteSessionStorageAlert({ scope, capacity, className }) {
|
|
31293
|
-
const message = scope === "session" ? "This session isn't being recorded. Recording storage is full. New sessions aren't recorded until space is freed." : `Recording storage full. New sessions aren't recorded.${capacity ? ` All ${capacity} of recording storage is used.` : ""}`;
|
|
31294
|
-
return /* @__PURE__ */ jsxs220(
|
|
31295
|
-
"div",
|
|
31296
|
-
{
|
|
31297
|
-
role: "alert",
|
|
31298
|
-
className: cn(
|
|
31299
|
-
"flex w-full items-start gap-[var(--spacing-system-m)] rounded-md bg-ods-warning-secondary p-[var(--spacing-system-s)] text-ods-warning",
|
|
31300
|
-
className
|
|
31301
|
-
),
|
|
31302
|
-
children: [
|
|
31303
|
-
/* @__PURE__ */ jsx277(AlertTriangleIcon, { size: 24, color: "currentColor", className: "shrink-0" }),
|
|
31304
|
-
/* @__PURE__ */ jsx277("p", { className: "min-w-0 flex-1 text-h3", children: message })
|
|
30927
|
+
/* @__PURE__ */ jsx273(MonitorOffIcon, { size: 24, color: "currentColor" }),
|
|
30928
|
+
/* @__PURE__ */ jsx273("span", { className: "whitespace-nowrap text-h3", children: "End Session" })
|
|
31305
30929
|
]
|
|
31306
30930
|
}
|
|
31307
30931
|
);
|
|
@@ -31311,7 +30935,7 @@ function RemoteSessionStorageAlert({ scope, capacity, className }) {
|
|
|
31311
30935
|
import { combine as combine3 } from "@atlaskit/pragmatic-drag-and-drop/combine";
|
|
31312
30936
|
import { monitorForElements } from "@atlaskit/pragmatic-drag-and-drop/element/adapter";
|
|
31313
30937
|
import { preventUnhandled } from "@atlaskit/pragmatic-drag-and-drop/utils/prevent-unhandled";
|
|
31314
|
-
import { Fragment as Fragment50, useCallback as useCallback29, useEffect as useEffect50, useMemo as useMemo25, useRef as useRef45, useState as
|
|
30938
|
+
import { Fragment as Fragment50, useCallback as useCallback29, useEffect as useEffect50, useMemo as useMemo25, useRef as useRef45, useState as useState82 } from "react";
|
|
31315
30939
|
import { createPortal } from "react-dom";
|
|
31316
30940
|
|
|
31317
30941
|
// src/utils/auto-scroll-ancestors.ts
|
|
@@ -31424,10 +31048,10 @@ function aimToChange(columns, ticketId, aim) {
|
|
|
31424
31048
|
// src/components/features/board/board-column.tsx
|
|
31425
31049
|
import { attachClosestEdge as attachClosestEdge2 } from "@atlaskit/pragmatic-drag-and-drop-hitbox/closest-edge";
|
|
31426
31050
|
import { dropTargetForElements as dropTargetForElements2 } from "@atlaskit/pragmatic-drag-and-drop/element/adapter";
|
|
31427
|
-
import { memo as memo6, useCallback as useCallback27, useEffect as useEffect48, useRef as useRef43, useState as
|
|
31051
|
+
import { memo as memo6, useCallback as useCallback27, useEffect as useEffect48, useRef as useRef43, useState as useState80 } from "react";
|
|
31428
31052
|
|
|
31429
31053
|
// src/components/features/board/board-column-header.tsx
|
|
31430
|
-
import { jsx as
|
|
31054
|
+
import { jsx as jsx274, jsxs as jsxs217 } from "react/jsx-runtime";
|
|
31431
31055
|
function BoardColumnHeader({
|
|
31432
31056
|
column,
|
|
31433
31057
|
collapsed = false,
|
|
@@ -31440,8 +31064,8 @@ function BoardColumnHeader({
|
|
|
31440
31064
|
const useStatusVariant = resolveTicketStatus(tagStatus) !== null;
|
|
31441
31065
|
const actionClass = "h-8 w-8 p-0 md:h-8 md:w-8";
|
|
31442
31066
|
if (collapsed) {
|
|
31443
|
-
return /* @__PURE__ */
|
|
31444
|
-
onToggleCollapse && /* @__PURE__ */
|
|
31067
|
+
return /* @__PURE__ */ jsxs217("div", { className: "flex h-full flex-col items-center gap-[var(--spacing-system-xsf)]", children: [
|
|
31068
|
+
onToggleCollapse && /* @__PURE__ */ jsx274(
|
|
31445
31069
|
Button,
|
|
31446
31070
|
{
|
|
31447
31071
|
variant: "transparent",
|
|
@@ -31449,10 +31073,10 @@ function BoardColumnHeader({
|
|
|
31449
31073
|
className: actionClass,
|
|
31450
31074
|
onClick: onToggleCollapse,
|
|
31451
31075
|
"aria-label": "Expand column",
|
|
31452
|
-
children: /* @__PURE__ */
|
|
31076
|
+
children: /* @__PURE__ */ jsx274(Arrow02RightIcon, { className: "h-6 w-6 text-ods-text-secondary" })
|
|
31453
31077
|
}
|
|
31454
31078
|
),
|
|
31455
|
-
/* @__PURE__ */
|
|
31079
|
+
/* @__PURE__ */ jsx274(
|
|
31456
31080
|
TicketStatusTag,
|
|
31457
31081
|
{
|
|
31458
31082
|
status: tagStatus,
|
|
@@ -31461,17 +31085,17 @@ function BoardColumnHeader({
|
|
|
31461
31085
|
className: "h-auto [writing-mode:vertical-rl]"
|
|
31462
31086
|
}
|
|
31463
31087
|
),
|
|
31464
|
-
/* @__PURE__ */
|
|
31088
|
+
/* @__PURE__ */ jsx274("span", { className: "text-h5", style: { color: column.color }, children: count })
|
|
31465
31089
|
] });
|
|
31466
31090
|
}
|
|
31467
|
-
return /* @__PURE__ */
|
|
31468
|
-
/* @__PURE__ */
|
|
31469
|
-
/* @__PURE__ */
|
|
31470
|
-
/* @__PURE__ */
|
|
31091
|
+
return /* @__PURE__ */ jsxs217("div", { className: "flex items-center gap-[var(--spacing-system-xsf)]", children: [
|
|
31092
|
+
/* @__PURE__ */ jsxs217("div", { className: "flex min-w-0 flex-1 items-center gap-[var(--spacing-system-xsf)]", children: [
|
|
31093
|
+
/* @__PURE__ */ jsx274(TicketStatusTag, { status: tagStatus, label: column.label, color: useStatusVariant ? void 0 : column.color }),
|
|
31094
|
+
/* @__PURE__ */ jsx274("span", { className: "text-h5", style: useStatusVariant ? void 0 : { color: column.color }, children: count })
|
|
31471
31095
|
] }),
|
|
31472
|
-
/* @__PURE__ */
|
|
31473
|
-
column.tooltip && /* @__PURE__ */
|
|
31474
|
-
onToggleCollapse && /* @__PURE__ */
|
|
31096
|
+
/* @__PURE__ */ jsxs217("div", { className: "flex shrink-0 items-center gap-[var(--spacing-system-xxs)]", children: [
|
|
31097
|
+
column.tooltip && /* @__PURE__ */ jsx274(TouchFriendlyTooltip, { content: column.tooltip, side: "bottom", children: /* @__PURE__ */ jsx274(Button, { variant: "transparent", size: "icon", className: actionClass, "aria-label": column.tooltip, children: /* @__PURE__ */ jsx274(InfoCircleIcon, { className: "h-6 w-6 text-ods-text-secondary" }) }) }),
|
|
31098
|
+
onToggleCollapse && /* @__PURE__ */ jsx274(
|
|
31475
31099
|
Button,
|
|
31476
31100
|
{
|
|
31477
31101
|
variant: "transparent",
|
|
@@ -31479,10 +31103,10 @@ function BoardColumnHeader({
|
|
|
31479
31103
|
className: actionClass,
|
|
31480
31104
|
onClick: onToggleCollapse,
|
|
31481
31105
|
"aria-label": "Collapse column",
|
|
31482
|
-
children: /* @__PURE__ */
|
|
31106
|
+
children: /* @__PURE__ */ jsx274(Arrow02LeftIcon, { className: "h-6 w-6 text-ods-text-secondary" })
|
|
31483
31107
|
}
|
|
31484
31108
|
),
|
|
31485
|
-
onArchive && /* @__PURE__ */
|
|
31109
|
+
onArchive && /* @__PURE__ */ jsx274(
|
|
31486
31110
|
Button,
|
|
31487
31111
|
{
|
|
31488
31112
|
variant: "transparent",
|
|
@@ -31490,10 +31114,10 @@ function BoardColumnHeader({
|
|
|
31490
31114
|
className: actionClass,
|
|
31491
31115
|
onClick: onArchive,
|
|
31492
31116
|
"aria-label": "Archive resolved tickets",
|
|
31493
|
-
children: /* @__PURE__ */
|
|
31117
|
+
children: /* @__PURE__ */ jsx274(BoxArchiveIcon, { className: "h-6 w-6 text-ods-text-secondary" })
|
|
31494
31118
|
}
|
|
31495
31119
|
),
|
|
31496
|
-
onAddTicket && /* @__PURE__ */
|
|
31120
|
+
onAddTicket && /* @__PURE__ */ jsx274(
|
|
31497
31121
|
Button,
|
|
31498
31122
|
{
|
|
31499
31123
|
variant: "transparent",
|
|
@@ -31501,7 +31125,7 @@ function BoardColumnHeader({
|
|
|
31501
31125
|
className: actionClass,
|
|
31502
31126
|
onClick: onAddTicket,
|
|
31503
31127
|
"aria-label": "Add ticket",
|
|
31504
|
-
children: /* @__PURE__ */
|
|
31128
|
+
children: /* @__PURE__ */ jsx274(PlusIcon, { className: "h-6 w-6 text-ods-text-secondary" })
|
|
31505
31129
|
}
|
|
31506
31130
|
)
|
|
31507
31131
|
] })
|
|
@@ -31600,7 +31224,7 @@ import {
|
|
|
31600
31224
|
useEffect as useEffect47,
|
|
31601
31225
|
useMemo as useMemo24,
|
|
31602
31226
|
useRef as useRef42,
|
|
31603
|
-
useState as
|
|
31227
|
+
useState as useState79
|
|
31604
31228
|
} from "react";
|
|
31605
31229
|
|
|
31606
31230
|
// src/utils/drag-effect.ts
|
|
@@ -31614,14 +31238,14 @@ function holdMoveDragEffect(element) {
|
|
|
31614
31238
|
}
|
|
31615
31239
|
|
|
31616
31240
|
// src/components/features/board/board-ticket-approval.tsx
|
|
31617
|
-
import { useState as
|
|
31618
|
-
import { jsx as
|
|
31241
|
+
import { useState as useState78 } from "react";
|
|
31242
|
+
import { jsx as jsx275, jsxs as jsxs218 } from "react/jsx-runtime";
|
|
31619
31243
|
function BoardTicketApproval({ pendingApproval, onApprove, onReject }) {
|
|
31620
|
-
const [expanded, setExpanded] =
|
|
31244
|
+
const [expanded, setExpanded] = useState78(false);
|
|
31621
31245
|
const { innerRef, containerStyle } = useCollapsible({ expanded });
|
|
31622
31246
|
const isAdmin = pendingApproval.approvalType === "ADMIN";
|
|
31623
|
-
return /* @__PURE__ */
|
|
31624
|
-
/* @__PURE__ */
|
|
31247
|
+
return /* @__PURE__ */ jsxs218("div", { className: "pointer-events-auto flex flex-col", children: [
|
|
31248
|
+
/* @__PURE__ */ jsxs218(
|
|
31625
31249
|
"button",
|
|
31626
31250
|
{
|
|
31627
31251
|
type: "button",
|
|
@@ -31629,7 +31253,7 @@ function BoardTicketApproval({ pendingApproval, onApprove, onReject }) {
|
|
|
31629
31253
|
"aria-expanded": expanded,
|
|
31630
31254
|
className: "flex w-full cursor-pointer items-center gap-[var(--spacing-system-xxs)] text-h6",
|
|
31631
31255
|
children: [
|
|
31632
|
-
/* @__PURE__ */
|
|
31256
|
+
/* @__PURE__ */ jsxs218(
|
|
31633
31257
|
"span",
|
|
31634
31258
|
{
|
|
31635
31259
|
className: cn(
|
|
@@ -31637,16 +31261,16 @@ function BoardTicketApproval({ pendingApproval, onApprove, onReject }) {
|
|
|
31637
31261
|
isAdmin ? "text-ods-open-yellow" : "text-ods-text-secondary"
|
|
31638
31262
|
),
|
|
31639
31263
|
children: [
|
|
31640
|
-
isAdmin ? /* @__PURE__ */
|
|
31641
|
-
/* @__PURE__ */
|
|
31264
|
+
isAdmin ? /* @__PURE__ */ jsx275(ShieldCheckIcon, { className: "size-4 shrink-0" }) : /* @__PURE__ */ jsx275(DotsLoaderIcon, { size: 16, className: "shrink-0" }),
|
|
31265
|
+
/* @__PURE__ */ jsx275("span", { className: "flex-1 truncate text-left", children: isAdmin ? "Technician approval required" : "Pending client approval" })
|
|
31642
31266
|
]
|
|
31643
31267
|
}
|
|
31644
31268
|
),
|
|
31645
|
-
expanded ? /* @__PURE__ */
|
|
31269
|
+
expanded ? /* @__PURE__ */ jsx275(Chevron02UpIcon, { className: "size-4 shrink-0 text-ods-text-secondary" }) : /* @__PURE__ */ jsx275(Chevron02DownIcon, { className: "size-4 shrink-0 text-ods-text-secondary" })
|
|
31646
31270
|
]
|
|
31647
31271
|
}
|
|
31648
31272
|
),
|
|
31649
|
-
/* @__PURE__ */
|
|
31273
|
+
/* @__PURE__ */ jsx275("div", { style: containerStyle, children: /* @__PURE__ */ jsx275("div", { ref: innerRef, className: "pt-[var(--spacing-system-xs)]", children: /* @__PURE__ */ jsx275(
|
|
31650
31274
|
ApprovalBatchMessage,
|
|
31651
31275
|
{
|
|
31652
31276
|
className: "mb-0",
|
|
@@ -31699,7 +31323,7 @@ function hasMoveSettled(columns, move) {
|
|
|
31699
31323
|
}
|
|
31700
31324
|
|
|
31701
31325
|
// src/components/features/board/ticket-card.tsx
|
|
31702
|
-
import { Fragment as Fragment48, jsx as
|
|
31326
|
+
import { Fragment as Fragment48, jsx as jsx276, jsxs as jsxs219 } from "react/jsx-runtime";
|
|
31703
31327
|
var PRIORITY_COLOR_CLASS = {
|
|
31704
31328
|
low: "text-ods-text-secondary",
|
|
31705
31329
|
medium: "text-ods-info",
|
|
@@ -31731,24 +31355,24 @@ function TicketCardBody({
|
|
|
31731
31355
|
const showDeviceRow = !!(ticket.deviceHostnames?.length || ticket.organizationName);
|
|
31732
31356
|
const deviceText = [ticket.deviceHostnames?.join(", "), ticket.organizationName].filter(Boolean).join(", ");
|
|
31733
31357
|
const hasRightSection = !!(ticket.priority || ticket.assignees?.length || renderAssignSlot);
|
|
31734
|
-
const rightSection = hasRightSection ? /* @__PURE__ */
|
|
31735
|
-
ticket.priority && /* @__PURE__ */
|
|
31358
|
+
const rightSection = hasRightSection ? /* @__PURE__ */ jsxs219("div", { className: "pointer-events-auto flex shrink-0 items-center gap-[var(--spacing-system-xsf)]", children: [
|
|
31359
|
+
ticket.priority && /* @__PURE__ */ jsx276(
|
|
31736
31360
|
Flag02Icon,
|
|
31737
31361
|
{
|
|
31738
31362
|
className: cn("size-4", PRIORITY_COLOR_CLASS[ticket.priority]),
|
|
31739
31363
|
"aria-label": `Priority: ${ticket.priority}`
|
|
31740
31364
|
}
|
|
31741
31365
|
),
|
|
31742
|
-
renderAssignSlot ? renderAssignSlot(ticket) : ticket.assignees?.length ? /* @__PURE__ */
|
|
31366
|
+
renderAssignSlot ? renderAssignSlot(ticket) : ticket.assignees?.length ? /* @__PURE__ */ jsxs219("div", { className: "flex -space-x-2", children: [
|
|
31743
31367
|
ticket.assignees.slice(0, MAX_VISIBLE_ASSIGNEES).map(
|
|
31744
|
-
(a) => a.deleted ? /* @__PURE__ */
|
|
31368
|
+
(a) => a.deleted ? /* @__PURE__ */ jsx276(
|
|
31745
31369
|
DeletedUserAvatar,
|
|
31746
31370
|
{
|
|
31747
31371
|
size: "sm",
|
|
31748
31372
|
accessibleLabel: `Deleted user: ${a.name ?? a.initials ?? a.id}`
|
|
31749
31373
|
},
|
|
31750
31374
|
a.id
|
|
31751
|
-
) : /* @__PURE__ */
|
|
31375
|
+
) : /* @__PURE__ */ jsx276(
|
|
31752
31376
|
SquareAvatar,
|
|
31753
31377
|
{
|
|
31754
31378
|
src: a.avatarUrl,
|
|
@@ -31760,7 +31384,7 @@ function TicketCardBody({
|
|
|
31760
31384
|
a.id
|
|
31761
31385
|
)
|
|
31762
31386
|
),
|
|
31763
|
-
ticket.assignees.length > MAX_VISIBLE_ASSIGNEES && /* @__PURE__ */
|
|
31387
|
+
ticket.assignees.length > MAX_VISIBLE_ASSIGNEES && /* @__PURE__ */ jsxs219("div", { className: "flex h-8 w-8 shrink-0 items-center justify-center rounded-full border border-ods-border bg-ods-bg text-ods-text-secondary text-h6", children: [
|
|
31764
31388
|
"+",
|
|
31765
31389
|
ticket.assignees.length - MAX_VISIBLE_ASSIGNEES
|
|
31766
31390
|
] })
|
|
@@ -31770,7 +31394,7 @@ function TicketCardBody({
|
|
|
31770
31394
|
const tooltipLabel = ticket.createdAt ? formatTicketFullTimestamp(ticket.createdAt) : null;
|
|
31771
31395
|
const metaLabel = [ticket.ticketNumber || null, timestampLabel].filter(Boolean).join(" \u2022 ");
|
|
31772
31396
|
const metaClass = "truncate text-ods-text-secondary text-h6";
|
|
31773
|
-
const meta = href ? /* @__PURE__ */
|
|
31397
|
+
const meta = href ? /* @__PURE__ */ jsx276(
|
|
31774
31398
|
next_link_default,
|
|
31775
31399
|
{
|
|
31776
31400
|
href,
|
|
@@ -31781,28 +31405,28 @@ function TicketCardBody({
|
|
|
31781
31405
|
className: cn("pointer-events-auto block", metaClass),
|
|
31782
31406
|
children: metaLabel
|
|
31783
31407
|
}
|
|
31784
|
-
) : /* @__PURE__ */
|
|
31785
|
-
return /* @__PURE__ */
|
|
31786
|
-
/* @__PURE__ */
|
|
31787
|
-
/* @__PURE__ */
|
|
31788
|
-
/* @__PURE__ */
|
|
31789
|
-
showDeviceRow && /* @__PURE__ */
|
|
31790
|
-
/* @__PURE__ */
|
|
31791
|
-
/* @__PURE__ */
|
|
31408
|
+
) : /* @__PURE__ */ jsx276("p", { className: cn(tooltipLabel && "pointer-events-auto", metaClass), children: metaLabel });
|
|
31409
|
+
return /* @__PURE__ */ jsxs219(Fragment48, { children: [
|
|
31410
|
+
/* @__PURE__ */ jsxs219("div", { className: "flex items-start gap-[var(--spacing-system-sf)]", children: [
|
|
31411
|
+
/* @__PURE__ */ jsxs219("div", { className: "flex min-w-0 flex-1 flex-col gap-[var(--spacing-system-zero)]", title: ticket.title, children: [
|
|
31412
|
+
/* @__PURE__ */ jsx276("p", { className: "truncate text-ods-text-primary text-h3", children: ticket.title }),
|
|
31413
|
+
showDeviceRow && /* @__PURE__ */ jsxs219("div", { className: "flex min-w-0 items-center gap-[var(--spacing-system-xxs)] text-ods-text-secondary text-h6", children: [
|
|
31414
|
+
/* @__PURE__ */ jsx276(LaptopIcon, { className: "size-4 shrink-0" }),
|
|
31415
|
+
/* @__PURE__ */ jsx276("span", { className: "truncate", title: deviceText, children: deviceText })
|
|
31792
31416
|
] })
|
|
31793
31417
|
] }),
|
|
31794
31418
|
rightSection
|
|
31795
31419
|
] }),
|
|
31796
|
-
ticket.tags?.length ? /* @__PURE__ */
|
|
31797
|
-
metaLabel && (tooltipLabel ? /* @__PURE__ */
|
|
31798
|
-
/* @__PURE__ */
|
|
31799
|
-
/* @__PURE__ */
|
|
31420
|
+
ticket.tags?.length ? /* @__PURE__ */ jsx276(TicketTagRow, { tags: ticket.tags }) : null,
|
|
31421
|
+
metaLabel && (tooltipLabel ? /* @__PURE__ */ jsx276(TooltipProvider, { children: /* @__PURE__ */ jsxs219(Tooltip, { children: [
|
|
31422
|
+
/* @__PURE__ */ jsx276(TooltipTrigger, { asChild: true, children: meta }),
|
|
31423
|
+
/* @__PURE__ */ jsx276(TooltipContent, { children: tooltipLabel })
|
|
31800
31424
|
] }) }) : meta),
|
|
31801
|
-
ticket.escalatedByUser && /* @__PURE__ */
|
|
31802
|
-
/* @__PURE__ */
|
|
31803
|
-
/* @__PURE__ */
|
|
31425
|
+
ticket.escalatedByUser && /* @__PURE__ */ jsxs219("div", { className: "flex items-center gap-[var(--spacing-system-xxs)] text-ods-open-yellow text-h6", children: [
|
|
31426
|
+
/* @__PURE__ */ jsx276(UserCheckIcon, { className: "size-4 shrink-0" }),
|
|
31427
|
+
/* @__PURE__ */ jsx276("span", { className: "truncate", children: "Escalated by User" })
|
|
31804
31428
|
] }),
|
|
31805
|
-
ticket.activity && /* @__PURE__ */
|
|
31429
|
+
ticket.activity && /* @__PURE__ */ jsxs219(
|
|
31806
31430
|
"div",
|
|
31807
31431
|
{
|
|
31808
31432
|
className: cn(
|
|
@@ -31810,32 +31434,32 @@ function TicketCardBody({
|
|
|
31810
31434
|
ticket.activity.kind === "stale" ? "text-ods-open-yellow" : "text-ods-text-secondary"
|
|
31811
31435
|
),
|
|
31812
31436
|
children: [
|
|
31813
|
-
ticket.activity.kind === "stale" ? /* @__PURE__ */
|
|
31814
|
-
/* @__PURE__ */
|
|
31437
|
+
ticket.activity.kind === "stale" ? /* @__PURE__ */ jsx276(ClockIcon, { className: "size-4 shrink-0" }) : /* @__PURE__ */ jsx276(DotsLoaderIcon, { className: "size-4 shrink-0" }),
|
|
31438
|
+
/* @__PURE__ */ jsx276("span", { className: "truncate", children: ticket.activity.label ?? ACTIVITY_DEFAULT_LABEL[ticket.activity.kind] })
|
|
31815
31439
|
]
|
|
31816
31440
|
}
|
|
31817
31441
|
),
|
|
31818
|
-
showNewMessage && /* @__PURE__ */
|
|
31442
|
+
showNewMessage && /* @__PURE__ */ jsx276(
|
|
31819
31443
|
Tag,
|
|
31820
31444
|
{
|
|
31821
31445
|
label: "New Message",
|
|
31822
|
-
icon: /* @__PURE__ */
|
|
31446
|
+
icon: /* @__PURE__ */ jsx276(MessagesIcon, { size: 16, color: newMessageTextColor }),
|
|
31823
31447
|
className: "w-fit shrink-0",
|
|
31824
31448
|
style: { backgroundColor: columnColor, color: newMessageTextColor }
|
|
31825
31449
|
}
|
|
31826
31450
|
),
|
|
31827
|
-
ticket.pendingApproval && /* @__PURE__ */
|
|
31451
|
+
ticket.pendingApproval && /* @__PURE__ */ jsx276(BoardTicketApproval, { pendingApproval: ticket.pendingApproval, onApprove, onReject })
|
|
31828
31452
|
] });
|
|
31829
31453
|
}
|
|
31830
31454
|
function TicketCardView({ className, style, ...bodyProps }) {
|
|
31831
31455
|
const { ticket, columnColor } = bodyProps;
|
|
31832
31456
|
const showNewMessage = !!ticket.hasNewMessage && !!columnColor;
|
|
31833
|
-
return /* @__PURE__ */
|
|
31457
|
+
return /* @__PURE__ */ jsx276(
|
|
31834
31458
|
"div",
|
|
31835
31459
|
{
|
|
31836
31460
|
className: cn(TICKET_CARD_SHELL, className),
|
|
31837
31461
|
style: showNewMessage ? { borderColor: columnColor, ...style } : style,
|
|
31838
|
-
children: /* @__PURE__ */
|
|
31462
|
+
children: /* @__PURE__ */ jsx276("div", { className: "relative z-10 flex flex-col gap-[var(--spacing-system-sf)]", children: /* @__PURE__ */ jsx276(TicketCardBody, { ...bodyProps }) })
|
|
31839
31463
|
}
|
|
31840
31464
|
);
|
|
31841
31465
|
}
|
|
@@ -31856,7 +31480,7 @@ var TicketCard = memo5(function TicketCardImpl({
|
|
|
31856
31480
|
useEffect47(() => {
|
|
31857
31481
|
ticketRef.current = ticket;
|
|
31858
31482
|
});
|
|
31859
|
-
const [isDragging, setIsDragging] =
|
|
31483
|
+
const [isDragging, setIsDragging] = useState79(false);
|
|
31860
31484
|
const isLanding = useIsLanding(ticket.id);
|
|
31861
31485
|
const aim = useDropAim();
|
|
31862
31486
|
const closestEdge = aim && aim.columnId === columnId && aim.ticketId === ticket.id ? aim.edge : null;
|
|
@@ -31950,7 +31574,7 @@ var TicketCard = memo5(function TicketCardImpl({
|
|
|
31950
31574
|
[isDragging]
|
|
31951
31575
|
);
|
|
31952
31576
|
const body = useMemo24(
|
|
31953
|
-
() => /* @__PURE__ */
|
|
31577
|
+
() => /* @__PURE__ */ jsx276(
|
|
31954
31578
|
TicketCardBody,
|
|
31955
31579
|
{
|
|
31956
31580
|
ticket,
|
|
@@ -31979,7 +31603,7 @@ var TicketCard = memo5(function TicketCardImpl({
|
|
|
31979
31603
|
} else if (isLanding) {
|
|
31980
31604
|
style.visibility = "hidden";
|
|
31981
31605
|
}
|
|
31982
|
-
const insertionLine = closestEdge ? /* @__PURE__ */
|
|
31606
|
+
const insertionLine = closestEdge ? /* @__PURE__ */ jsx276(
|
|
31983
31607
|
"span",
|
|
31984
31608
|
{
|
|
31985
31609
|
"aria-hidden": true,
|
|
@@ -31998,9 +31622,9 @@ var TicketCard = memo5(function TicketCardImpl({
|
|
|
31998
31622
|
}
|
|
31999
31623
|
) : null;
|
|
32000
31624
|
if (href) {
|
|
32001
|
-
return /* @__PURE__ */
|
|
31625
|
+
return /* @__PURE__ */ jsxs219("div", { ...outerProps, children: [
|
|
32002
31626
|
insertionLine,
|
|
32003
|
-
/* @__PURE__ */
|
|
31627
|
+
/* @__PURE__ */ jsx276(
|
|
32004
31628
|
next_link_default,
|
|
32005
31629
|
{
|
|
32006
31630
|
href,
|
|
@@ -32013,12 +31637,12 @@ var TicketCard = memo5(function TicketCardImpl({
|
|
|
32013
31637
|
className: "absolute inset-0 z-0 rounded-md focus-visible:outline-none"
|
|
32014
31638
|
}
|
|
32015
31639
|
),
|
|
32016
|
-
/* @__PURE__ */
|
|
31640
|
+
/* @__PURE__ */ jsx276("div", { className: cn("pointer-events-none", innerWrapperClass), children: body })
|
|
32017
31641
|
] });
|
|
32018
31642
|
}
|
|
32019
|
-
return /* @__PURE__ */
|
|
31643
|
+
return /* @__PURE__ */ jsxs219("div", { ...outerProps, children: [
|
|
32020
31644
|
insertionLine,
|
|
32021
|
-
/* @__PURE__ */
|
|
31645
|
+
/* @__PURE__ */ jsx276(
|
|
32022
31646
|
"button",
|
|
32023
31647
|
{
|
|
32024
31648
|
type: "button",
|
|
@@ -32029,23 +31653,23 @@ var TicketCard = memo5(function TicketCardImpl({
|
|
|
32029
31653
|
className: "absolute inset-0 z-0 cursor-pointer rounded-md focus-visible:outline-none"
|
|
32030
31654
|
}
|
|
32031
31655
|
),
|
|
32032
|
-
/* @__PURE__ */
|
|
31656
|
+
/* @__PURE__ */ jsx276("div", { className: cn("pointer-events-none", innerWrapperClass), children: body })
|
|
32033
31657
|
] });
|
|
32034
31658
|
});
|
|
32035
31659
|
function TicketTagRow({ tags }) {
|
|
32036
31660
|
const visible = tags.slice(0, MAX_VISIBLE_TAGS);
|
|
32037
31661
|
const hidden = tags.length - visible.length;
|
|
32038
|
-
return /* @__PURE__ */
|
|
32039
|
-
visible.map((tag) => /* @__PURE__ */
|
|
32040
|
-
hidden > 0 && /* @__PURE__ */
|
|
31662
|
+
return /* @__PURE__ */ jsxs219("div", { className: "flex h-8 flex-wrap items-start gap-[var(--spacing-system-xxs)] overflow-clip", children: [
|
|
31663
|
+
visible.map((tag) => /* @__PURE__ */ jsx276(Tag, { variant: "outline", label: tag }, tag)),
|
|
31664
|
+
hidden > 0 && /* @__PURE__ */ jsx276(Tag, { variant: "outline", label: `+${hidden}` })
|
|
32041
31665
|
] });
|
|
32042
31666
|
}
|
|
32043
31667
|
|
|
32044
31668
|
// src/components/features/board/ticket-card-skeleton.tsx
|
|
32045
31669
|
import { forwardRef as forwardRef32 } from "react";
|
|
32046
|
-
import { jsx as
|
|
31670
|
+
import { jsx as jsx277, jsxs as jsxs220 } from "react/jsx-runtime";
|
|
32047
31671
|
var TicketCardSkeleton = forwardRef32(
|
|
32048
|
-
({ className, ...props }, ref) => /* @__PURE__ */
|
|
31672
|
+
({ className, ...props }, ref) => /* @__PURE__ */ jsxs220(
|
|
32049
31673
|
"div",
|
|
32050
31674
|
{
|
|
32051
31675
|
ref,
|
|
@@ -32055,22 +31679,22 @@ var TicketCardSkeleton = forwardRef32(
|
|
|
32055
31679
|
),
|
|
32056
31680
|
...props,
|
|
32057
31681
|
children: [
|
|
32058
|
-
/* @__PURE__ */
|
|
32059
|
-
/* @__PURE__ */
|
|
32060
|
-
/* @__PURE__ */
|
|
32061
|
-
/* @__PURE__ */
|
|
32062
|
-
/* @__PURE__ */
|
|
32063
|
-
/* @__PURE__ */
|
|
31682
|
+
/* @__PURE__ */ jsxs220("div", { className: "flex items-start gap-[var(--spacing-system-sf)]", children: [
|
|
31683
|
+
/* @__PURE__ */ jsxs220("div", { className: "flex min-w-0 flex-1 flex-col gap-[var(--spacing-system-xxs)]", children: [
|
|
31684
|
+
/* @__PURE__ */ jsx277("div", { className: "flex items-center text-h3", children: /* @__PURE__ */ jsx277(Skeleton, { className: "h-4 w-3/4" }) }),
|
|
31685
|
+
/* @__PURE__ */ jsxs220("div", { className: "flex items-center gap-[var(--spacing-system-xxs)] text-h6", children: [
|
|
31686
|
+
/* @__PURE__ */ jsx277(Skeleton, { className: "size-4 shrink-0 rounded-sm" }),
|
|
31687
|
+
/* @__PURE__ */ jsx277(Skeleton, { className: "h-3 w-1/2" })
|
|
32064
31688
|
] })
|
|
32065
31689
|
] }),
|
|
32066
|
-
/* @__PURE__ */
|
|
32067
|
-
/* @__PURE__ */
|
|
32068
|
-
/* @__PURE__ */
|
|
31690
|
+
/* @__PURE__ */ jsxs220("div", { className: "flex shrink-0 items-center gap-[var(--spacing-system-xsf)]", children: [
|
|
31691
|
+
/* @__PURE__ */ jsx277(Skeleton, { className: "size-4 rounded-sm" }),
|
|
31692
|
+
/* @__PURE__ */ jsx277(Skeleton, { className: "size-8 rounded-full" })
|
|
32069
31693
|
] })
|
|
32070
31694
|
] }),
|
|
32071
|
-
/* @__PURE__ */
|
|
32072
|
-
/* @__PURE__ */
|
|
32073
|
-
/* @__PURE__ */
|
|
31695
|
+
/* @__PURE__ */ jsxs220("div", { className: "flex h-8 items-center gap-[var(--spacing-system-xxs)]", children: [
|
|
31696
|
+
/* @__PURE__ */ jsx277(Skeleton, { className: "h-8 w-16 rounded-md" }),
|
|
31697
|
+
/* @__PURE__ */ jsx277(Skeleton, { className: "h-8 w-12 rounded-md" })
|
|
32074
31698
|
] })
|
|
32075
31699
|
]
|
|
32076
31700
|
}
|
|
@@ -32079,7 +31703,7 @@ var TicketCardSkeleton = forwardRef32(
|
|
|
32079
31703
|
TicketCardSkeleton.displayName = "TicketCardSkeleton";
|
|
32080
31704
|
|
|
32081
31705
|
// src/components/features/board/board-column.tsx
|
|
32082
|
-
import { Fragment as Fragment49, jsx as
|
|
31706
|
+
import { Fragment as Fragment49, jsx as jsx278, jsxs as jsxs221 } from "react/jsx-runtime";
|
|
32083
31707
|
var BoardColumn = memo6(function BoardColumnImpl({
|
|
32084
31708
|
column,
|
|
32085
31709
|
collapsed = false,
|
|
@@ -32098,7 +31722,7 @@ var BoardColumn = memo6(function BoardColumnImpl({
|
|
|
32098
31722
|
className
|
|
32099
31723
|
}) {
|
|
32100
31724
|
const laneRef = useRef43(null);
|
|
32101
|
-
const [isOver, setIsOver] =
|
|
31725
|
+
const [isOver, setIsOver] = useState80(false);
|
|
32102
31726
|
useEffect48(() => {
|
|
32103
31727
|
const element = laneRef.current;
|
|
32104
31728
|
if (!element || collapsed || touchMode || column.dropDisabled) return void 0;
|
|
@@ -32131,7 +31755,7 @@ var BoardColumn = memo6(function BoardColumnImpl({
|
|
|
32131
31755
|
});
|
|
32132
31756
|
}, [column.id, column.dropDisabled, column.allowedFromColumns, collapsed, touchMode]);
|
|
32133
31757
|
const handleToggleCollapse = useCallback27(() => onToggleCollapse?.(column.id), [onToggleCollapse, column.id]);
|
|
32134
|
-
return /* @__PURE__ */
|
|
31758
|
+
return /* @__PURE__ */ jsxs221(
|
|
32135
31759
|
"div",
|
|
32136
31760
|
{
|
|
32137
31761
|
ref: laneRef,
|
|
@@ -32147,7 +31771,7 @@ var BoardColumn = memo6(function BoardColumnImpl({
|
|
|
32147
31771
|
),
|
|
32148
31772
|
style: column.system ? void 0 : { backgroundColor: tintOnDark(column.color) },
|
|
32149
31773
|
children: [
|
|
32150
|
-
/* @__PURE__ */
|
|
31774
|
+
/* @__PURE__ */ jsx278(
|
|
32151
31775
|
BoardColumnHeader,
|
|
32152
31776
|
{
|
|
32153
31777
|
column,
|
|
@@ -32157,9 +31781,9 @@ var BoardColumn = memo6(function BoardColumnImpl({
|
|
|
32157
31781
|
onArchive: !collapsed && column.archivable && onArchive ? () => onArchive(column.id) : void 0
|
|
32158
31782
|
}
|
|
32159
31783
|
),
|
|
32160
|
-
!collapsed && /* @__PURE__ */
|
|
32161
|
-
/* @__PURE__ */
|
|
32162
|
-
/* @__PURE__ */
|
|
31784
|
+
!collapsed && /* @__PURE__ */ jsxs221(Fragment49, { children: [
|
|
31785
|
+
/* @__PURE__ */ jsx278("div", { "aria-hidden": true, className: "-mx-[var(--spacing-system-sf)] h-px shrink-0 bg-ods-border" }),
|
|
31786
|
+
/* @__PURE__ */ jsx278(
|
|
32163
31787
|
ColumnBody,
|
|
32164
31788
|
{
|
|
32165
31789
|
column,
|
|
@@ -32222,13 +31846,13 @@ function ColumnBody({
|
|
|
32222
31846
|
// wholesale. The browser's own anchoring is unusable here — it silently
|
|
32223
31847
|
// skips transformed elements, so it works between drags and does nothing
|
|
32224
31848
|
// during one — and leaving both on double-corrects every insertion.
|
|
32225
|
-
/* @__PURE__ */
|
|
31849
|
+
/* @__PURE__ */ jsxs221(
|
|
32226
31850
|
"div",
|
|
32227
31851
|
{
|
|
32228
31852
|
ref: scrollRef,
|
|
32229
31853
|
className: "flex min-h-0 flex-1 flex-col gap-[var(--spacing-system-xs)] overflow-y-auto py-[5px] [overflow-anchor:none]",
|
|
32230
31854
|
children: [
|
|
32231
|
-
column.isLoading ? /* @__PURE__ */
|
|
31855
|
+
column.isLoading ? /* @__PURE__ */ jsx278(SkeletonStack, {}) : column.tickets.length === 0 ? /* @__PURE__ */ jsx278(EmptyState2, { columnId: column.id, touchMode }) : column.tickets.map((t) => /* @__PURE__ */ jsx278(
|
|
32232
31856
|
TicketCard,
|
|
32233
31857
|
{
|
|
32234
31858
|
ticket: t,
|
|
@@ -32244,26 +31868,26 @@ function ColumnBody({
|
|
|
32244
31868
|
},
|
|
32245
31869
|
t.id
|
|
32246
31870
|
)),
|
|
32247
|
-
column.isLoadingMore && !column.isLoading && /* @__PURE__ */
|
|
32248
|
-
column.hasMore && /* @__PURE__ */
|
|
31871
|
+
column.isLoadingMore && !column.isLoading && /* @__PURE__ */ jsx278(TicketCardSkeleton, {}),
|
|
31872
|
+
column.hasMore && /* @__PURE__ */ jsx278("div", { ref: sentinelRef, "aria-hidden": true, className: "h-1 shrink-0" })
|
|
32249
31873
|
]
|
|
32250
31874
|
}
|
|
32251
31875
|
)
|
|
32252
31876
|
);
|
|
32253
31877
|
}
|
|
32254
31878
|
function SkeletonStack({ count = 4 }) {
|
|
32255
|
-
return /* @__PURE__ */
|
|
31879
|
+
return /* @__PURE__ */ jsx278(Fragment49, { children: Array.from({ length: count }, (_, i) => /* @__PURE__ */ jsx278(TicketCardSkeleton, {}, `skeleton-${i}`)) });
|
|
32256
31880
|
}
|
|
32257
31881
|
function EmptyState2({ columnId, touchMode }) {
|
|
32258
31882
|
const aim = useDropAim();
|
|
32259
31883
|
if (aim && aim.columnId === columnId) {
|
|
32260
|
-
return /* @__PURE__ */
|
|
31884
|
+
return /* @__PURE__ */ jsx278("div", { "aria-hidden": true, ...{ [DROP_LINE_ATTRIBUTE]: "" }, className: "h-0.5 shrink-0 rounded-full bg-ods-accent" });
|
|
32261
31885
|
}
|
|
32262
|
-
return /* @__PURE__ */
|
|
32263
|
-
/* @__PURE__ */
|
|
32264
|
-
/* @__PURE__ */
|
|
32265
|
-
/* @__PURE__ */
|
|
32266
|
-
/* @__PURE__ */
|
|
31886
|
+
return /* @__PURE__ */ jsxs221("div", { className: "flex flex-1 flex-col items-center justify-center gap-[var(--spacing-system-lf)] p-[var(--spacing-system-lf)] text-center text-ods-text-secondary", children: [
|
|
31887
|
+
/* @__PURE__ */ jsx278(TagIcon, { className: "h-6 w-6 shrink-0" }),
|
|
31888
|
+
/* @__PURE__ */ jsxs221("div", { className: "flex w-full flex-col", children: [
|
|
31889
|
+
/* @__PURE__ */ jsx278("p", { className: "text-h4", children: "No tickets here" }),
|
|
31890
|
+
/* @__PURE__ */ jsx278("p", { className: "text-h6", children: touchMode ? "Change a ticket's status to move it to this column" : "Drag a ticket here or change its status to move it to this column" })
|
|
32267
31891
|
] })
|
|
32268
31892
|
] });
|
|
32269
31893
|
}
|
|
@@ -32277,10 +31901,10 @@ function resolveBoardDrop(columns, { source, target }) {
|
|
|
32277
31901
|
}
|
|
32278
31902
|
|
|
32279
31903
|
// src/components/features/board/use-board-collapse.ts
|
|
32280
|
-
import { useCallback as useCallback28, useEffect as useEffect49, useRef as useRef44, useState as
|
|
31904
|
+
import { useCallback as useCallback28, useEffect as useEffect49, useRef as useRef44, useState as useState81 } from "react";
|
|
32281
31905
|
function useBoardCollapse(storageKey) {
|
|
32282
31906
|
const [persisted, setPersisted] = useLocalStorage(storageKey ?? "__board_collapse_unused__", {});
|
|
32283
|
-
const [memory, setMemory] =
|
|
31907
|
+
const [memory, setMemory] = useState81({});
|
|
32284
31908
|
const collapsed = storageKey ? persisted : memory;
|
|
32285
31909
|
const setMap = storageKey ? setPersisted : setMemory;
|
|
32286
31910
|
const setMapRef = useRef44(setMap);
|
|
@@ -32297,7 +31921,7 @@ function useBoardCollapse(storageKey) {
|
|
|
32297
31921
|
}
|
|
32298
31922
|
|
|
32299
31923
|
// src/components/features/board/touch-board.tsx
|
|
32300
|
-
import { jsx as
|
|
31924
|
+
import { jsx as jsx279 } from "react/jsx-runtime";
|
|
32301
31925
|
function TouchBoard({
|
|
32302
31926
|
columns,
|
|
32303
31927
|
onLoadMore,
|
|
@@ -32312,11 +31936,11 @@ function TouchBoard({
|
|
|
32312
31936
|
className
|
|
32313
31937
|
}) {
|
|
32314
31938
|
const { collapsed, toggle } = useBoardCollapse(collapseStorageKey);
|
|
32315
|
-
return /* @__PURE__ */
|
|
31939
|
+
return /* @__PURE__ */ jsx279("div", { className: cn("flex h-full min-h-0 flex-col", className), children: /* @__PURE__ */ jsx279(
|
|
32316
31940
|
"div",
|
|
32317
31941
|
{
|
|
32318
31942
|
className: "flex min-h-0 flex-1 snap-x snap-mandatory gap-[var(--spacing-system-mf)] overflow-x-auto overscroll-x-contain [scrollbar-width:none] [&::-webkit-scrollbar]:hidden",
|
|
32319
|
-
children: columns.map((column) => /* @__PURE__ */
|
|
31943
|
+
children: columns.map((column) => /* @__PURE__ */ jsx279(
|
|
32320
31944
|
BoardColumn,
|
|
32321
31945
|
{
|
|
32322
31946
|
column,
|
|
@@ -32343,7 +31967,7 @@ function TouchBoard({
|
|
|
32343
31967
|
}
|
|
32344
31968
|
|
|
32345
31969
|
// src/components/features/board/board.tsx
|
|
32346
|
-
import { jsx as
|
|
31970
|
+
import { jsx as jsx280, jsxs as jsxs222 } from "react/jsx-runtime";
|
|
32347
31971
|
var PENDING_MOVE_TIMEOUT_MS = 2e3;
|
|
32348
31972
|
var DROP_MS = 160;
|
|
32349
31973
|
var DROP_EASING = "cubic-bezier(0.2, 0, 0, 1)";
|
|
@@ -32352,9 +31976,9 @@ var ARROW_KEYS = ["ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight"];
|
|
|
32352
31976
|
function Board(props) {
|
|
32353
31977
|
const dragAndDropEnabled = useMediaQuery(DRAG_AND_DROP_MEDIA_QUERY);
|
|
32354
31978
|
if (dragAndDropEnabled === void 0) {
|
|
32355
|
-
return /* @__PURE__ */
|
|
31979
|
+
return /* @__PURE__ */ jsx280("div", { "aria-hidden": true, className: cn("flex h-full min-h-0 flex-col", props.className) });
|
|
32356
31980
|
}
|
|
32357
|
-
return dragAndDropEnabled ? /* @__PURE__ */
|
|
31981
|
+
return dragAndDropEnabled ? /* @__PURE__ */ jsx280(DragBoard, { ...props }) : /* @__PURE__ */ jsx280(TouchBoard, { ...props });
|
|
32358
31982
|
}
|
|
32359
31983
|
function DragBoard({
|
|
32360
31984
|
columns,
|
|
@@ -32395,20 +32019,20 @@ function DragBoard({
|
|
|
32395
32019
|
},
|
|
32396
32020
|
[scrollRef]
|
|
32397
32021
|
);
|
|
32398
|
-
const [aim, setAim] =
|
|
32399
|
-
const [lifted, setLifted] =
|
|
32400
|
-
const [announcement, setAnnouncement] =
|
|
32022
|
+
const [aim, setAim] = useState82(null);
|
|
32023
|
+
const [lifted, setLifted] = useState82(null);
|
|
32024
|
+
const [announcement, setAnnouncement] = useState82("");
|
|
32401
32025
|
const dragGeometry = useRef45(null);
|
|
32402
|
-
const [landingPreview, setLandingPreview] =
|
|
32026
|
+
const [landingPreview, setLandingPreview] = useState82(null);
|
|
32403
32027
|
const previewRef = useRef45(null);
|
|
32404
|
-
const [reportedMove, setPendingMove] =
|
|
32028
|
+
const [reportedMove, setPendingMove] = useState82(null);
|
|
32405
32029
|
const pendingMove = reportedMove && !hasMoveSettled(columns, reportedMove) ? reportedMove : null;
|
|
32406
32030
|
const view = useMemo25(() => pendingMove ? applyPendingMove(columns, pendingMove) : columns, [columns, pendingMove]);
|
|
32407
32031
|
useEffect50(() => {
|
|
32408
32032
|
columnsRef.current = view;
|
|
32409
32033
|
onChangeRef.current = onChange;
|
|
32410
32034
|
});
|
|
32411
|
-
const [landing, setLanding] =
|
|
32035
|
+
const [landing, setLanding] = useState82(null);
|
|
32412
32036
|
const landingTimer = useRef45(null);
|
|
32413
32037
|
const pointRef = useRef45({ x: 0, y: 0 });
|
|
32414
32038
|
const laneLabel = useCallback29((columnId) => view.find((c) => c.id === columnId)?.label ?? columnId, [view]);
|
|
@@ -32607,7 +32231,7 @@ function DragBoard({
|
|
|
32607
32231
|
};
|
|
32608
32232
|
}, [landing, landingPreview]);
|
|
32609
32233
|
const preview = landingPreview && createPortal(
|
|
32610
|
-
/* @__PURE__ */
|
|
32234
|
+
/* @__PURE__ */ jsx280(
|
|
32611
32235
|
"div",
|
|
32612
32236
|
{
|
|
32613
32237
|
ref: previewRef,
|
|
@@ -32620,7 +32244,7 @@ function DragBoard({
|
|
|
32620
32244
|
// translate in pointer coordinates and nothing else.
|
|
32621
32245
|
margin: `${-landingPreview.grabY}px 0 0 ${-landingPreview.grabX}px`
|
|
32622
32246
|
},
|
|
32623
|
-
children: /* @__PURE__ */
|
|
32247
|
+
children: /* @__PURE__ */ jsx280(
|
|
32624
32248
|
TicketCardView,
|
|
32625
32249
|
{
|
|
32626
32250
|
ticket: landingPreview.ticket,
|
|
@@ -32633,10 +32257,10 @@ function DragBoard({
|
|
|
32633
32257
|
),
|
|
32634
32258
|
document.body
|
|
32635
32259
|
);
|
|
32636
|
-
return /* @__PURE__ */
|
|
32260
|
+
return /* @__PURE__ */ jsx280(LandingCardContext.Provider, { value: landing, children: /* @__PURE__ */ jsx280(DropAimContext.Provider, { value: aim ?? keyboardAim, children: /* @__PURE__ */ jsxs222(BoardLiftContext.Provider, { value: lift, children: [
|
|
32637
32261
|
preview,
|
|
32638
|
-
/* @__PURE__ */
|
|
32639
|
-
/* @__PURE__ */
|
|
32262
|
+
/* @__PURE__ */ jsxs222("div", { ref: boardRef, className: cn("flex h-full flex-col", className), children: [
|
|
32263
|
+
/* @__PURE__ */ jsx280(
|
|
32640
32264
|
"div",
|
|
32641
32265
|
{
|
|
32642
32266
|
ref: setScroller,
|
|
@@ -32648,9 +32272,9 @@ function DragBoard({
|
|
|
32648
32272
|
const joinLeft = !!(column.system && prev?.system);
|
|
32649
32273
|
const joinRight = !!(column.system && next?.system);
|
|
32650
32274
|
const showGap = i > 0 && !joinLeft;
|
|
32651
|
-
return /* @__PURE__ */
|
|
32652
|
-
showGap && /* @__PURE__ */
|
|
32653
|
-
/* @__PURE__ */
|
|
32275
|
+
return /* @__PURE__ */ jsxs222(Fragment50, { children: [
|
|
32276
|
+
showGap && /* @__PURE__ */ jsx280("div", { "aria-hidden": true, className: "w-[var(--spacing-system-mf)] shrink-0" }),
|
|
32277
|
+
/* @__PURE__ */ jsx280(
|
|
32654
32278
|
BoardColumn,
|
|
32655
32279
|
{
|
|
32656
32280
|
column,
|
|
@@ -32672,15 +32296,15 @@ function DragBoard({
|
|
|
32672
32296
|
})
|
|
32673
32297
|
}
|
|
32674
32298
|
),
|
|
32675
|
-
/* @__PURE__ */
|
|
32676
|
-
thumbRatio > 0 && /* @__PURE__ */
|
|
32299
|
+
/* @__PURE__ */ jsx280("p", { "aria-live": "polite", className: "sr-only", children: announcement }),
|
|
32300
|
+
thumbRatio > 0 && /* @__PURE__ */ jsx280(
|
|
32677
32301
|
"div",
|
|
32678
32302
|
{
|
|
32679
32303
|
ref: trackRef,
|
|
32680
32304
|
onClick: onTrackClick,
|
|
32681
32305
|
onWheel: onTrackWheel,
|
|
32682
32306
|
className: "relative mt-[var(--spacing-system-mf)] h-2 shrink-0 cursor-pointer rounded-full bg-ods-border",
|
|
32683
|
-
children: /* @__PURE__ */
|
|
32307
|
+
children: /* @__PURE__ */ jsx280(
|
|
32684
32308
|
"div",
|
|
32685
32309
|
{
|
|
32686
32310
|
ref: thumbRef,
|
|
@@ -32799,9 +32423,9 @@ import {
|
|
|
32799
32423
|
useId as useId6,
|
|
32800
32424
|
useMemo as useMemo26,
|
|
32801
32425
|
useRef as useRef46,
|
|
32802
|
-
useState as
|
|
32426
|
+
useState as useState83
|
|
32803
32427
|
} from "react";
|
|
32804
|
-
import { jsx as
|
|
32428
|
+
import { jsx as jsx281, jsxs as jsxs223 } from "react/jsx-runtime";
|
|
32805
32429
|
var SORTABLE_ITEM_ATTRIBUTE = "data-sortable-item";
|
|
32806
32430
|
var SHIFT_MS = 200;
|
|
32807
32431
|
var DROP_MS2 = 150;
|
|
@@ -32816,7 +32440,7 @@ function SortableList({ onReorder, getItemLabel, disabled = false, className, ch
|
|
|
32816
32440
|
const listRef = useRef46(null);
|
|
32817
32441
|
const dragAndDropEnabled = useDragAndDropEnabled();
|
|
32818
32442
|
const dragType = useId6();
|
|
32819
|
-
const [announcement, setAnnouncement] =
|
|
32443
|
+
const [announcement, setAnnouncement] = useState83("");
|
|
32820
32444
|
const onReorderRef = useRef46(onReorder);
|
|
32821
32445
|
const getItemLabelRef = useRef46(getItemLabel);
|
|
32822
32446
|
useEffect51(() => {
|
|
@@ -32824,7 +32448,7 @@ function SortableList({ onReorder, getItemLabel, disabled = false, className, ch
|
|
|
32824
32448
|
getItemLabelRef.current = getItemLabel;
|
|
32825
32449
|
});
|
|
32826
32450
|
const flipFrom = useRef46(null);
|
|
32827
|
-
const [flipTick, setFlipTick] =
|
|
32451
|
+
const [flipTick, setFlipTick] = useState83(0);
|
|
32828
32452
|
const flipTimer = useRef46(null);
|
|
32829
32453
|
const readItems = useCallback30(
|
|
32830
32454
|
() => [...listRef.current?.querySelectorAll(`[${SORTABLE_ITEM_ATTRIBUTE}]`) ?? []],
|
|
@@ -32940,15 +32564,15 @@ function SortableList({ onReorder, getItemLabel, disabled = false, className, ch
|
|
|
32940
32564
|
() => ({ dragType, disabled, dragAndDropEnabled, reorder, readItems }),
|
|
32941
32565
|
[dragType, disabled, dragAndDropEnabled, reorder, readItems]
|
|
32942
32566
|
);
|
|
32943
|
-
return /* @__PURE__ */
|
|
32567
|
+
return /* @__PURE__ */ jsx281(SortableListContext.Provider, { value: context, children: /* @__PURE__ */ jsxs223("div", { ref: listRef, className, children: [
|
|
32944
32568
|
children,
|
|
32945
|
-
/* @__PURE__ */
|
|
32569
|
+
/* @__PURE__ */ jsx281("p", { "aria-live": "polite", className: "sr-only", children: announcement })
|
|
32946
32570
|
] }) });
|
|
32947
32571
|
}
|
|
32948
32572
|
|
|
32949
32573
|
// src/components/features/sortable-list/sortable-move-buttons.tsx
|
|
32950
32574
|
import { useRef as useRef47 } from "react";
|
|
32951
|
-
import { jsx as
|
|
32575
|
+
import { jsx as jsx282, jsxs as jsxs224 } from "react/jsx-runtime";
|
|
32952
32576
|
function SortableMoveButtons({ index, count, label, className }) {
|
|
32953
32577
|
const { disabled, reorder } = useSortableListContext();
|
|
32954
32578
|
const upRef = useRef47(null);
|
|
@@ -32963,8 +32587,8 @@ function SortableMoveButtons({ index, count, label, className }) {
|
|
|
32963
32587
|
});
|
|
32964
32588
|
};
|
|
32965
32589
|
const subject = label ?? "item";
|
|
32966
|
-
return /* @__PURE__ */
|
|
32967
|
-
/* @__PURE__ */
|
|
32590
|
+
return /* @__PURE__ */ jsxs224("div", { className: cn("inline-flex shrink-0", className), children: [
|
|
32591
|
+
/* @__PURE__ */ jsx282(
|
|
32968
32592
|
Button,
|
|
32969
32593
|
{
|
|
32970
32594
|
ref: upRef,
|
|
@@ -32975,10 +32599,10 @@ function SortableMoveButtons({ index, count, label, className }) {
|
|
|
32975
32599
|
disabled: disabled || index <= 0,
|
|
32976
32600
|
onClick: () => move(-1),
|
|
32977
32601
|
className: "rounded-r-none border-r-0",
|
|
32978
|
-
children: /* @__PURE__ */
|
|
32602
|
+
children: /* @__PURE__ */ jsx282(Arrow01UpIcon, {})
|
|
32979
32603
|
}
|
|
32980
32604
|
),
|
|
32981
|
-
/* @__PURE__ */
|
|
32605
|
+
/* @__PURE__ */ jsx282(
|
|
32982
32606
|
Button,
|
|
32983
32607
|
{
|
|
32984
32608
|
ref: downRef,
|
|
@@ -32989,7 +32613,7 @@ function SortableMoveButtons({ index, count, label, className }) {
|
|
|
32989
32613
|
disabled: disabled || index >= count - 1,
|
|
32990
32614
|
onClick: () => move(1),
|
|
32991
32615
|
className: "rounded-l-none",
|
|
32992
|
-
children: /* @__PURE__ */
|
|
32616
|
+
children: /* @__PURE__ */ jsx282(Arrow01DownIcon, {})
|
|
32993
32617
|
}
|
|
32994
32618
|
)
|
|
32995
32619
|
] });
|
|
@@ -32999,13 +32623,13 @@ function SortableMoveButtons({ index, count, label, className }) {
|
|
|
32999
32623
|
import { combine as combine5 } from "@atlaskit/pragmatic-drag-and-drop/combine";
|
|
33000
32624
|
import { draggable as draggable2 } from "@atlaskit/pragmatic-drag-and-drop/element/adapter";
|
|
33001
32625
|
import { disableNativeDragPreview } from "@atlaskit/pragmatic-drag-and-drop/element/disable-native-drag-preview";
|
|
33002
|
-
import { useCallback as useCallback31, useEffect as useEffect52, useState as
|
|
32626
|
+
import { useCallback as useCallback31, useEffect as useEffect52, useState as useState84 } from "react";
|
|
33003
32627
|
function useSortableItem() {
|
|
33004
32628
|
const { dragType, disabled, dragAndDropEnabled, reorder, readItems } = useSortableListContext();
|
|
33005
32629
|
const inert = disabled || !dragAndDropEnabled;
|
|
33006
|
-
const [item, setItem] =
|
|
33007
|
-
const [handle, setHandle] =
|
|
33008
|
-
const [isDragging, setIsDragging] =
|
|
32630
|
+
const [item, setItem] = useState84(null);
|
|
32631
|
+
const [handle, setHandle] = useState84(null);
|
|
32632
|
+
const [isDragging, setIsDragging] = useState84(false);
|
|
33009
32633
|
const itemRef = useCallback31((node) => {
|
|
33010
32634
|
node?.setAttribute(SORTABLE_ITEM_ATTRIBUTE, "");
|
|
33011
32635
|
setItem(node);
|
|
@@ -33045,7 +32669,7 @@ function useSortableItem() {
|
|
|
33045
32669
|
}
|
|
33046
32670
|
|
|
33047
32671
|
// src/components/features/ticket-status-config-list/ticket-status-config-list.tsx
|
|
33048
|
-
import { jsx as
|
|
32672
|
+
import { jsx as jsx283 } from "react/jsx-runtime";
|
|
33049
32673
|
function TicketStatusConfigList({
|
|
33050
32674
|
items,
|
|
33051
32675
|
onReorder,
|
|
@@ -33053,13 +32677,13 @@ function TicketStatusConfigList({
|
|
|
33053
32677
|
getItemLabel,
|
|
33054
32678
|
className
|
|
33055
32679
|
}) {
|
|
33056
|
-
return /* @__PURE__ */
|
|
32680
|
+
return /* @__PURE__ */ jsx283(
|
|
33057
32681
|
SortableList,
|
|
33058
32682
|
{
|
|
33059
32683
|
onReorder,
|
|
33060
32684
|
getItemLabel,
|
|
33061
32685
|
className: cn("flex w-full flex-col gap-[var(--spacing-system-xs)]", className),
|
|
33062
|
-
children: items.map((item, index) => /* @__PURE__ */
|
|
32686
|
+
children: items.map((item, index) => /* @__PURE__ */ jsx283(SortableRow, { index, count: items.length, label: getItemLabel?.(index), children: (args) => renderRow(item, args) }, item.id))
|
|
33063
32687
|
}
|
|
33064
32688
|
);
|
|
33065
32689
|
}
|
|
@@ -33070,7 +32694,7 @@ function SortableRow({
|
|
|
33070
32694
|
children
|
|
33071
32695
|
}) {
|
|
33072
32696
|
const { itemRef, dragHandleProps, isDragging, dragAndDropEnabled } = useSortableItem();
|
|
33073
|
-
return /* @__PURE__ */
|
|
32697
|
+
return /* @__PURE__ */ jsx283(
|
|
33074
32698
|
"div",
|
|
33075
32699
|
{
|
|
33076
32700
|
ref: itemRef,
|
|
@@ -33078,18 +32702,18 @@ function SortableRow({
|
|
|
33078
32702
|
children: children({
|
|
33079
32703
|
dragHandleProps,
|
|
33080
32704
|
isDragging,
|
|
33081
|
-
moveButtons: dragAndDropEnabled ? null : /* @__PURE__ */
|
|
32705
|
+
moveButtons: dragAndDropEnabled ? null : /* @__PURE__ */ jsx283(SortableMoveButtons, { index, count, label })
|
|
33082
32706
|
})
|
|
33083
32707
|
}
|
|
33084
32708
|
);
|
|
33085
32709
|
}
|
|
33086
32710
|
|
|
33087
32711
|
// src/components/features/conversation-card.tsx
|
|
33088
|
-
import { jsx as
|
|
32712
|
+
import { jsx as jsx284, jsxs as jsxs225 } from "react/jsx-runtime";
|
|
33089
32713
|
function Who({ speaker }) {
|
|
33090
|
-
return /* @__PURE__ */
|
|
32714
|
+
return /* @__PURE__ */ jsxs225("div", { className: "flex items-baseline gap-2 text-ods-text-primary text-h4", children: [
|
|
33091
32715
|
speaker.name,
|
|
33092
|
-
speaker.meta && /* @__PURE__ */
|
|
32716
|
+
speaker.meta && /* @__PURE__ */ jsx284("span", { className: "text-ods-text-secondary text-h6", children: speaker.meta })
|
|
33093
32717
|
] });
|
|
33094
32718
|
}
|
|
33095
32719
|
function ConversationCard({
|
|
@@ -33103,36 +32727,36 @@ function ConversationCard({
|
|
|
33103
32727
|
footerTone = "default",
|
|
33104
32728
|
className
|
|
33105
32729
|
}) {
|
|
33106
|
-
return /* @__PURE__ */
|
|
32730
|
+
return /* @__PURE__ */ jsxs225(
|
|
33107
32731
|
"div",
|
|
33108
32732
|
{
|
|
33109
32733
|
className: cn("flex h-full flex-col gap-4 rounded-xl border border-ods-border bg-ods-card p-5 md:p-7", className),
|
|
33110
32734
|
children: [
|
|
33111
|
-
/* @__PURE__ */
|
|
33112
|
-
/* @__PURE__ */
|
|
33113
|
-
/* @__PURE__ */
|
|
33114
|
-
/* @__PURE__ */
|
|
33115
|
-
/* @__PURE__ */
|
|
32735
|
+
/* @__PURE__ */ jsxs225("div", { className: "flex items-start gap-3", children: [
|
|
32736
|
+
/* @__PURE__ */ jsx284("span", { className: "shrink-0", children: requester.avatar }),
|
|
32737
|
+
/* @__PURE__ */ jsxs225("div", { className: "min-w-0 flex-1", children: [
|
|
32738
|
+
/* @__PURE__ */ jsx284(Who, { speaker: requester }),
|
|
32739
|
+
/* @__PURE__ */ jsxs225("p", { className: "m-0 mt-1 line-clamp-2 min-h-[2lh] text-ods-text-primary text-h3", title: request, children: [
|
|
33116
32740
|
"\u201C",
|
|
33117
32741
|
request,
|
|
33118
32742
|
"\u201D"
|
|
33119
32743
|
] })
|
|
33120
32744
|
] })
|
|
33121
32745
|
] }),
|
|
33122
|
-
/* @__PURE__ */
|
|
33123
|
-
/* @__PURE__ */
|
|
33124
|
-
/* @__PURE__ */
|
|
33125
|
-
/* @__PURE__ */
|
|
33126
|
-
/* @__PURE__ */
|
|
33127
|
-
/* @__PURE__ */
|
|
33128
|
-
/* @__PURE__ */
|
|
32746
|
+
/* @__PURE__ */ jsxs225("div", { className: "flex items-start gap-3 rounded-md border border-ods-border bg-ods-bg p-3.5", children: [
|
|
32747
|
+
/* @__PURE__ */ jsx284("span", { className: "shrink-0", children: responder.avatar }),
|
|
32748
|
+
/* @__PURE__ */ jsxs225("div", { className: "min-w-0 flex-1", children: [
|
|
32749
|
+
/* @__PURE__ */ jsx284(Who, { speaker: responder }),
|
|
32750
|
+
/* @__PURE__ */ jsxs225("div", { className: "mt-1 flex items-start gap-2 text-ods-text-secondary text-h4", children: [
|
|
32751
|
+
/* @__PURE__ */ jsx284(CheckCircleIcon, { size: 16, className: "mt-1 shrink-0 text-ods-success", "aria-hidden": true }),
|
|
32752
|
+
/* @__PURE__ */ jsx284("span", { className: "line-clamp-3 min-h-[3lh] min-w-0 flex-1", title: outcome, children: outcome }),
|
|
33129
32753
|
outcomeAside
|
|
33130
32754
|
] })
|
|
33131
32755
|
] })
|
|
33132
32756
|
] }),
|
|
33133
|
-
/* @__PURE__ */
|
|
33134
|
-
/* @__PURE__ */
|
|
33135
|
-
/* @__PURE__ */
|
|
32757
|
+
/* @__PURE__ */ jsxs225("div", { className: "mt-auto flex items-center justify-between gap-3 border-t border-ods-border pt-3.5 text-ods-text-secondary text-h6", children: [
|
|
32758
|
+
/* @__PURE__ */ jsx284("span", { children: footerLabel }),
|
|
32759
|
+
/* @__PURE__ */ jsx284(
|
|
33136
32760
|
"span",
|
|
33137
32761
|
{
|
|
33138
32762
|
className: cn(
|
|
@@ -33722,7 +33346,6 @@ export {
|
|
|
33722
33346
|
UnreadCountBadge,
|
|
33723
33347
|
HeaderButton,
|
|
33724
33348
|
TimeTrackerHeaderButton,
|
|
33725
|
-
RemoteSessionViewers,
|
|
33726
33349
|
RemoteSessionScope,
|
|
33727
33350
|
RemoteSessionOrgLogo,
|
|
33728
33351
|
RemoteSessionRecordingTag,
|
|
@@ -33739,15 +33362,6 @@ export {
|
|
|
33739
33362
|
RemoteSessionDialog,
|
|
33740
33363
|
RemoteSessionBorder,
|
|
33741
33364
|
RemoteSessionPill,
|
|
33742
|
-
REMOTE_SESSION_KEEP_REASON_LABELS,
|
|
33743
|
-
KeepRecordingModal,
|
|
33744
|
-
ReleaseKeepingModal,
|
|
33745
|
-
formatRemoteSessionOffset,
|
|
33746
|
-
RemoteSessionEventList,
|
|
33747
|
-
RemoteSessionTimelineMarkers,
|
|
33748
|
-
RemoteSessionStatusTag,
|
|
33749
|
-
RemoteSessionExpiry,
|
|
33750
|
-
RemoteSessionStorageAlert,
|
|
33751
33365
|
BoardColumnHeader,
|
|
33752
33366
|
tintOnDark,
|
|
33753
33367
|
BoardTicketApproval,
|