@flamingo-stack/openframe-frontend-core 0.0.690 → 0.0.691-snapshot.20261001154617
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-22RSJ57Z.js → chunk-2YVTGPM7.js} +2 -2
- package/dist/{chunk-QNWQQ4RT.cjs → chunk-53O6PQ3F.cjs} +7 -7
- package/dist/{chunk-QNWQQ4RT.cjs.map → chunk-53O6PQ3F.cjs.map} +1 -1
- package/dist/{chunk-54X75QTC.cjs → chunk-5XPK2QGU.cjs} +14 -14
- package/dist/{chunk-54X75QTC.cjs.map → chunk-5XPK2QGU.cjs.map} +1 -1
- package/dist/{chunk-4HBYEZ3I.cjs → chunk-7BNWMOPM.cjs} +82 -82
- package/dist/{chunk-4HBYEZ3I.cjs.map → chunk-7BNWMOPM.cjs.map} +1 -1
- package/dist/{chunk-HLEXYTOE.js → chunk-7EPGJOKN.js} +4 -4
- package/dist/{chunk-XRSJER2B.js → chunk-A5NHAHV6.js} +4 -4
- package/dist/{chunk-P27OGSQL.cjs → chunk-ATREVNIN.cjs} +37 -37
- package/dist/{chunk-P27OGSQL.cjs.map → chunk-ATREVNIN.cjs.map} +1 -1
- package/dist/{chunk-S5M5SEW2.js → chunk-AVAZ6BD6.js} +5 -5
- package/dist/{chunk-DLRE5Y3G.js → chunk-C2SVJVEB.js} +2 -2
- package/dist/{chunk-KZXKT5AX.cjs → chunk-CG7OWW7X.cjs} +14 -14
- package/dist/{chunk-KZXKT5AX.cjs.map → chunk-CG7OWW7X.cjs.map} +1 -1
- package/dist/{chunk-AIXPQT3G.js → chunk-CKO6NKNE.js} +801 -222
- package/dist/chunk-CKO6NKNE.js.map +1 -0
- package/dist/{chunk-UFXV64WQ.cjs → chunk-CKUPANVU.cjs} +9 -9
- package/dist/{chunk-UFXV64WQ.cjs.map → chunk-CKUPANVU.cjs.map} +1 -1
- package/dist/{chunk-3ZAIHRQH.cjs → chunk-DKJDO7YM.cjs} +35 -35
- package/dist/{chunk-3ZAIHRQH.cjs.map → chunk-DKJDO7YM.cjs.map} +1 -1
- package/dist/{chunk-D7BFS7N6.cjs → chunk-DUURFYGS.cjs} +3 -3
- package/dist/{chunk-D7BFS7N6.cjs.map → chunk-DUURFYGS.cjs.map} +1 -1
- package/dist/{chunk-NMXL34Z2.cjs → chunk-DVSPRY2V.cjs} +3 -3
- package/dist/{chunk-NMXL34Z2.cjs.map → chunk-DVSPRY2V.cjs.map} +1 -1
- package/dist/{chunk-VLWUKFQE.cjs → chunk-EXWS2QSD.cjs} +1301 -722
- package/dist/chunk-EXWS2QSD.cjs.map +1 -0
- package/dist/{chunk-5CBQBTGN.cjs → chunk-F6LXGP6S.cjs} +7 -7
- package/dist/{chunk-5CBQBTGN.cjs.map → chunk-F6LXGP6S.cjs.map} +1 -1
- package/dist/{chunk-MDYTAKJ5.cjs → chunk-FTK3S57R.cjs} +22 -22
- package/dist/{chunk-MDYTAKJ5.cjs.map → chunk-FTK3S57R.cjs.map} +1 -1
- package/dist/{chunk-UAKWSR3U.js → chunk-GDZ7IC5B.js} +2 -2
- package/dist/{chunk-OD2WMUAO.cjs → chunk-GZRU2A4L.cjs} +197 -197
- package/dist/{chunk-OD2WMUAO.cjs.map → chunk-GZRU2A4L.cjs.map} +1 -1
- package/dist/{chunk-Q76YVNCQ.js → chunk-HM7ZGABI.js} +2 -2
- package/dist/{chunk-YCKGUQA2.cjs → chunk-I27PWVWE.cjs} +17 -12
- package/dist/chunk-I27PWVWE.cjs.map +1 -0
- package/dist/{chunk-TSENCZUL.js → chunk-IQTQIBZ3.js} +11 -11
- package/dist/{chunk-QUGV2GT3.cjs → chunk-KDCIYRZV.cjs} +34 -34
- package/dist/{chunk-QUGV2GT3.cjs.map → chunk-KDCIYRZV.cjs.map} +1 -1
- package/dist/{chunk-2MGTNYHW.cjs → chunk-KQZMM3QJ.cjs} +100 -100
- package/dist/{chunk-2MGTNYHW.cjs.map → chunk-KQZMM3QJ.cjs.map} +1 -1
- package/dist/{chunk-BJHM2OEY.cjs → chunk-LNKLB7GM.cjs} +17 -17
- package/dist/{chunk-BJHM2OEY.cjs.map → chunk-LNKLB7GM.cjs.map} +1 -1
- package/dist/{chunk-Z622ACFD.js → chunk-LYJJH4D6.js} +5 -5
- package/dist/{chunk-42RQ4NIL.js → chunk-LYQULSK4.js} +6 -6
- package/dist/{chunk-TBJWPNHU.js → chunk-MCNQKS6I.js} +4 -4
- package/dist/chunk-MCNQKS6I.js.map +1 -0
- package/dist/{chunk-JGVJRUGB.cjs → chunk-MIZU2OTO.cjs} +4 -4
- package/dist/{chunk-JGVJRUGB.cjs.map → chunk-MIZU2OTO.cjs.map} +1 -1
- package/dist/{chunk-BOM6MMWB.cjs → chunk-N3526CTH.cjs} +3 -3
- package/dist/{chunk-BOM6MMWB.cjs.map → chunk-N3526CTH.cjs.map} +1 -1
- package/dist/{chunk-2PQKZWWP.js → chunk-PKZGXRU2.js} +6 -6
- package/dist/{chunk-FCQR6VY4.cjs → chunk-Q25VYAEL.cjs} +26 -26
- package/dist/{chunk-FCQR6VY4.cjs.map → chunk-Q25VYAEL.cjs.map} +1 -1
- package/dist/{chunk-25X43LSD.js → chunk-RK47E3PP.js} +4 -4
- package/dist/{chunk-V5NOURSR.js → chunk-RLNNV46K.js} +5 -5
- package/dist/{chunk-ZBQZJAC7.cjs → chunk-RTKF5AYA.cjs} +7 -7
- package/dist/chunk-RTKF5AYA.cjs.map +1 -0
- package/dist/{chunk-RF2EYX3B.js → chunk-SC44YJCF.js} +2 -2
- package/dist/{chunk-2OD2PPNO.cjs → chunk-SDORFSFK.cjs} +37 -37
- package/dist/{chunk-2OD2PPNO.cjs.map → chunk-SDORFSFK.cjs.map} +1 -1
- package/dist/{chunk-5A3WSWZD.js → chunk-TEIHEFXP.js} +8 -8
- package/dist/{chunk-U4OJCJTH.js → chunk-TXFGG47A.js} +4 -4
- package/dist/{chunk-DMXI5D2Q.cjs → chunk-USKQURNF.cjs} +3 -3
- package/dist/{chunk-DMXI5D2Q.cjs.map → chunk-USKQURNF.cjs.map} +1 -1
- package/dist/{chunk-2KILTCND.js → chunk-UVUNBXS6.js} +6 -1
- package/dist/chunk-UVUNBXS6.js.map +1 -0
- package/dist/{chunk-X4WBGDNW.cjs → chunk-WTYQCT4A.cjs} +18 -18
- package/dist/{chunk-X4WBGDNW.cjs.map → chunk-WTYQCT4A.cjs.map} +1 -1
- package/dist/{chunk-OC3QH5WG.js → chunk-X5XFKI6N.js} +2 -2
- package/dist/{chunk-2V4KPBNZ.js → chunk-XAOAYDGR.js} +3 -3
- package/dist/{chunk-4BUPMSLY.js → chunk-Y7ZEVTLC.js} +3 -3
- package/dist/{chunk-DOUG4UEZ.js → chunk-Z7QCNCBN.js} +11 -11
- package/dist/{chunk-OQVHGPHA.js → chunk-ZAV2F4VX.js} +3 -3
- package/dist/components/case-studies/index.cjs +20 -20
- package/dist/components/case-studies/index.js +7 -7
- package/dist/components/chat/index.cjs +4 -4
- package/dist/components/chat/index.js +3 -3
- package/dist/components/contact/index.cjs +8 -8
- package/dist/components/contact/index.js +7 -7
- package/dist/components/docs/index.cjs +11 -11
- package/dist/components/docs/index.js +10 -10
- package/dist/components/embeds/index.cjs +8 -8
- package/dist/components/embeds/index.js +7 -7
- package/dist/components/faq/index.cjs +9 -9
- package/dist/components/faq/index.js +8 -8
- package/dist/components/features/index.cjs +39 -7
- package/dist/components/features/index.cjs.map +1 -1
- package/dist/components/features/index.d.ts +1 -0
- package/dist/components/features/index.d.ts.map +1 -1
- package/dist/components/features/index.js +38 -6
- package/dist/components/features/remote-session/index.d.ts +13 -0
- package/dist/components/features/remote-session/index.d.ts.map +1 -0
- package/dist/components/features/remote-session/remote-access-request-card.d.ts +19 -0
- package/dist/components/features/remote-session/remote-access-request-card.d.ts.map +1 -0
- package/dist/components/features/remote-session/remote-session-block.d.ts +41 -0
- package/dist/components/features/remote-session/remote-session-block.d.ts.map +1 -0
- package/dist/components/features/remote-session/remote-session-chat-panel.d.ts +23 -0
- package/dist/components/features/remote-session/remote-session-chat-panel.d.ts.map +1 -0
- package/dist/components/features/remote-session/remote-session-dialog.d.ts +15 -0
- package/dist/components/features/remote-session/remote-session-dialog.d.ts.map +1 -0
- package/dist/components/features/remote-session/remote-session-overlay.d.ts +12 -0
- package/dist/components/features/remote-session/remote-session-overlay.d.ts.map +1 -0
- package/dist/components/features/remote-session/remote-session-parts.d.ts +34 -0
- package/dist/components/features/remote-session/remote-session-parts.d.ts.map +1 -0
- package/dist/components/features/remote-session/types.d.ts +33 -0
- package/dist/components/features/remote-session/types.d.ts.map +1 -0
- package/dist/components/help-center-pages/index.cjs +101 -101
- package/dist/components/help-center-pages/index.js +21 -21
- package/dist/components/index.cjs +97 -65
- package/dist/components/index.cjs.map +1 -1
- package/dist/components/index.js +53 -21
- package/dist/components/index.js.map +1 -1
- package/dist/components/meeting-scheduler/index.cjs +58 -58
- package/dist/components/meeting-scheduler/index.js +8 -8
- package/dist/components/navigation/index.cjs +10 -10
- package/dist/components/navigation/index.js +9 -9
- package/dist/components/onboarding-guides/index.cjs +11 -11
- package/dist/components/onboarding-guides/index.js +10 -10
- package/dist/components/related-content/index.cjs +6 -6
- package/dist/components/related-content/index.js +5 -5
- package/dist/components/tickets/index.cjs +12 -12
- package/dist/components/tickets/index.js +11 -11
- package/dist/components/tickets/ticket-live-provider.d.ts.map +1 -1
- package/dist/components/ui/index.cjs +7 -7
- package/dist/components/ui/index.js +6 -6
- package/dist/hooks/index.cjs +4 -4
- package/dist/hooks/index.js +3 -3
- package/dist/index.cjs +44 -12
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +42 -10
- package/dist/index.js.map +1 -1
- package/dist/utils/embed-authed-fetch.d.ts +18 -0
- package/dist/utils/embed-authed-fetch.d.ts.map +1 -1
- package/dist/utils/index.cjs +50 -6
- package/dist/utils/index.cjs.map +1 -1
- package/dist/utils/index.js +50 -6
- package/dist/utils/index.js.map +1 -1
- package/dist/utils/sse-subscription.d.ts +29 -11
- package/dist/utils/sse-subscription.d.ts.map +1 -1
- package/package.json +1 -1
- package/src/components/features/__tests__/remote-session.test.tsx +97 -0
- package/src/components/features/index.ts +1 -0
- package/src/components/features/remote-session/index.ts +36 -0
- package/src/components/features/remote-session/remote-access-request-card.tsx +102 -0
- package/src/components/features/remote-session/remote-session-block.tsx +182 -0
- package/src/components/features/remote-session/remote-session-chat-panel.tsx +178 -0
- package/src/components/features/remote-session/remote-session-dialog.tsx +77 -0
- package/src/components/features/remote-session/remote-session-overlay.tsx +33 -0
- package/src/components/features/remote-session/remote-session-parts.tsx +138 -0
- package/src/components/features/remote-session/types.ts +41 -0
- package/src/components/tickets/ticket-live-provider.tsx +14 -12
- package/src/stories/RemoteSessionAccessRequest.stories.tsx +71 -0
- package/src/stories/RemoteSessionBlock.stories.tsx +164 -0
- package/src/stories/RemoteSessionDialog.stories.tsx +49 -0
- package/src/stories/RemoteSessionIndicator.stories.tsx +44 -0
- package/src/utils/embed-authed-fetch.ts +21 -0
- package/src/utils/sse-subscription.ts +107 -20
- package/dist/chunk-2KILTCND.js.map +0 -1
- package/dist/chunk-AIXPQT3G.js.map +0 -1
- package/dist/chunk-TBJWPNHU.js.map +0 -1
- package/dist/chunk-VLWUKFQE.cjs.map +0 -1
- package/dist/chunk-YCKGUQA2.cjs.map +0 -1
- package/dist/chunk-ZBQZJAC7.cjs.map +0 -1
- /package/dist/{chunk-22RSJ57Z.js.map → chunk-2YVTGPM7.js.map} +0 -0
- /package/dist/{chunk-HLEXYTOE.js.map → chunk-7EPGJOKN.js.map} +0 -0
- /package/dist/{chunk-XRSJER2B.js.map → chunk-A5NHAHV6.js.map} +0 -0
- /package/dist/{chunk-S5M5SEW2.js.map → chunk-AVAZ6BD6.js.map} +0 -0
- /package/dist/{chunk-DLRE5Y3G.js.map → chunk-C2SVJVEB.js.map} +0 -0
- /package/dist/{chunk-UAKWSR3U.js.map → chunk-GDZ7IC5B.js.map} +0 -0
- /package/dist/{chunk-Q76YVNCQ.js.map → chunk-HM7ZGABI.js.map} +0 -0
- /package/dist/{chunk-TSENCZUL.js.map → chunk-IQTQIBZ3.js.map} +0 -0
- /package/dist/{chunk-Z622ACFD.js.map → chunk-LYJJH4D6.js.map} +0 -0
- /package/dist/{chunk-42RQ4NIL.js.map → chunk-LYQULSK4.js.map} +0 -0
- /package/dist/{chunk-2PQKZWWP.js.map → chunk-PKZGXRU2.js.map} +0 -0
- /package/dist/{chunk-25X43LSD.js.map → chunk-RK47E3PP.js.map} +0 -0
- /package/dist/{chunk-V5NOURSR.js.map → chunk-RLNNV46K.js.map} +0 -0
- /package/dist/{chunk-RF2EYX3B.js.map → chunk-SC44YJCF.js.map} +0 -0
- /package/dist/{chunk-5A3WSWZD.js.map → chunk-TEIHEFXP.js.map} +0 -0
- /package/dist/{chunk-U4OJCJTH.js.map → chunk-TXFGG47A.js.map} +0 -0
- /package/dist/{chunk-OC3QH5WG.js.map → chunk-X5XFKI6N.js.map} +0 -0
- /package/dist/{chunk-2V4KPBNZ.js.map → chunk-XAOAYDGR.js.map} +0 -0
- /package/dist/{chunk-4BUPMSLY.js.map → chunk-Y7ZEVTLC.js.map} +0 -0
- /package/dist/{chunk-DOUG4UEZ.js.map → chunk-Z7QCNCBN.js.map} +0 -0
- /package/dist/{chunk-OQVHGPHA.js.map → chunk-ZAV2F4VX.js.map} +0 -0
|
@@ -23,7 +23,7 @@ import {
|
|
|
23
23
|
useLocalStorage,
|
|
24
24
|
useNotificationPermission,
|
|
25
25
|
useToast
|
|
26
|
-
} from "./chunk-
|
|
26
|
+
} from "./chunk-XAOAYDGR.js";
|
|
27
27
|
import {
|
|
28
28
|
Pagination
|
|
29
29
|
} from "./chunk-GRBZC5N3.js";
|
|
@@ -97,7 +97,7 @@ import {
|
|
|
97
97
|
useCollapsible,
|
|
98
98
|
useIsHydrated,
|
|
99
99
|
useScrollFade
|
|
100
|
-
} from "./chunk-
|
|
100
|
+
} from "./chunk-Y7ZEVTLC.js";
|
|
101
101
|
import {
|
|
102
102
|
NEAR_VIEWPORT_ROOT_MARGIN,
|
|
103
103
|
ToolIcon,
|
|
@@ -164,12 +164,15 @@ import {
|
|
|
164
164
|
ArrowRightUpIcon,
|
|
165
165
|
BellOffIcon,
|
|
166
166
|
BoxArchiveIcon,
|
|
167
|
+
ChatsIcon,
|
|
167
168
|
CheckCircleIcon,
|
|
168
169
|
CheckIcon,
|
|
169
170
|
Chevron02DownIcon,
|
|
170
171
|
Chevron02LeftIcon,
|
|
171
172
|
Chevron02RightIcon,
|
|
172
173
|
Chevron02UpIcon,
|
|
174
|
+
Chevrons03LeftIcon,
|
|
175
|
+
Chevrons03RightIcon,
|
|
173
176
|
ClockHistoryIcon,
|
|
174
177
|
ClockIcon,
|
|
175
178
|
CmmcLogoIcon,
|
|
@@ -181,6 +184,7 @@ import {
|
|
|
181
184
|
DraggerIcon,
|
|
182
185
|
Ellipsis01Icon,
|
|
183
186
|
EuLogoIcon,
|
|
187
|
+
ExternalLinkIcon,
|
|
184
188
|
EyeIcon as EyeIcon2,
|
|
185
189
|
EyeOffIcon,
|
|
186
190
|
FigmaIcon,
|
|
@@ -199,8 +203,10 @@ import {
|
|
|
199
203
|
IsoLogoIcon,
|
|
200
204
|
LinkedinIcon,
|
|
201
205
|
LinuxLogoIcon,
|
|
206
|
+
MessageOffIcon,
|
|
202
207
|
MessagesIcon,
|
|
203
208
|
MicrosoftLogoIcon,
|
|
209
|
+
MonitorOffIcon,
|
|
204
210
|
NistLogoIcon,
|
|
205
211
|
PauseIcon,
|
|
206
212
|
PenEditIcon,
|
|
@@ -211,6 +217,7 @@ import {
|
|
|
211
217
|
PowershellLogoIcon,
|
|
212
218
|
PythonLogoIcon,
|
|
213
219
|
QuestionCircleIcon,
|
|
220
|
+
RecordingIcon,
|
|
214
221
|
Refresh02VrIcon,
|
|
215
222
|
Send03Icon,
|
|
216
223
|
ShieldCheckIcon,
|
|
@@ -248,16 +255,17 @@ import {
|
|
|
248
255
|
isVideoMedia,
|
|
249
256
|
personFirstName,
|
|
250
257
|
personInitials
|
|
251
|
-
} from "./chunk-
|
|
258
|
+
} from "./chunk-2YVTGPM7.js";
|
|
252
259
|
import {
|
|
253
260
|
next_image_default
|
|
254
261
|
} from "./chunk-MDKCTSDS.js";
|
|
255
262
|
import {
|
|
256
263
|
createLocalStorageAdapter,
|
|
257
264
|
embedAuthedFetch,
|
|
265
|
+
subscribeEmbedCredentialChange,
|
|
258
266
|
useAuthedImageSrc,
|
|
259
267
|
useImageEdgeColor
|
|
260
|
-
} from "./chunk-
|
|
268
|
+
} from "./chunk-UVUNBXS6.js";
|
|
261
269
|
import {
|
|
262
270
|
OpenFrameLogo
|
|
263
271
|
} from "./chunk-OTX6XNSA.js";
|
|
@@ -6435,7 +6443,7 @@ function getDomain(urlStr) {
|
|
|
6435
6443
|
function domainToTitle(domain) {
|
|
6436
6444
|
return domain.split(".")[0].replace(/-/g, " ").replace(/\b\w/g, (c) => c.toUpperCase());
|
|
6437
6445
|
}
|
|
6438
|
-
var
|
|
6446
|
+
var ExternalLinkIcon2 = ({ size = 16 }) => /* @__PURE__ */ jsx60(
|
|
6439
6447
|
"svg",
|
|
6440
6448
|
{
|
|
6441
6449
|
width: size,
|
|
@@ -6617,7 +6625,7 @@ var OGLinkPreview = ({
|
|
|
6617
6625
|
className: "inline-flex items-center gap-2 text-ods-accent transition-colors hover:text-ods-accent-hover",
|
|
6618
6626
|
children: [
|
|
6619
6627
|
/* @__PURE__ */ jsx60("span", { className: "underline", children: url }),
|
|
6620
|
-
/* @__PURE__ */ jsx60(
|
|
6628
|
+
/* @__PURE__ */ jsx60(ExternalLinkIcon2, { size: 14 })
|
|
6621
6629
|
]
|
|
6622
6630
|
}
|
|
6623
6631
|
) });
|
|
@@ -6680,7 +6688,7 @@ var OGLinkPreview = ({
|
|
|
6680
6688
|
/* @__PURE__ */ jsx60("h3", { className: "truncate font-semibold text-ods-text-primary transition-colors text-h6 group-hover:text-ods-accent", children: title }),
|
|
6681
6689
|
description && /* @__PURE__ */ jsx60("p", { className: "truncate text-ods-text-secondary text-h6", children: description })
|
|
6682
6690
|
] }),
|
|
6683
|
-
/* @__PURE__ */ jsx60(
|
|
6691
|
+
/* @__PURE__ */ jsx60(ExternalLinkIcon2, { size: 14 })
|
|
6684
6692
|
]
|
|
6685
6693
|
}
|
|
6686
6694
|
) });
|
|
@@ -6738,7 +6746,7 @@ var OGLinkPreview = ({
|
|
|
6738
6746
|
/* @__PURE__ */ jsx60("h3", { className: "truncate font-semibold text-ods-text-primary transition-colors text-h6 group-hover:text-ods-accent", children: title }),
|
|
6739
6747
|
description && /* @__PURE__ */ jsx60("p", { className: "truncate text-ods-text-secondary text-h6", children: description })
|
|
6740
6748
|
] }),
|
|
6741
|
-
/* @__PURE__ */ jsx60(
|
|
6749
|
+
/* @__PURE__ */ jsx60(ExternalLinkIcon2, {})
|
|
6742
6750
|
]
|
|
6743
6751
|
}
|
|
6744
6752
|
) });
|
|
@@ -7110,7 +7118,7 @@ var MediaCarousel = memo2(function MediaCarouselImpl({
|
|
|
7110
7118
|
// src/components/embeds/reddit-embed-client.tsx
|
|
7111
7119
|
import { jsx as jsx62, jsxs as jsxs46 } from "react/jsx-runtime";
|
|
7112
7120
|
var MessageCircleIcon2 = () => /* @__PURE__ */ jsx62("svg", { width: "16", height: "16", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx62("path", { d: "M21 15a2 2 0 01-2 2H7l-4 4V5a2 2 0 012-2h14a2 2 0 012 2z" }) });
|
|
7113
|
-
var
|
|
7121
|
+
var ExternalLinkIcon3 = () => /* @__PURE__ */ jsxs46("svg", { width: "16", height: "16", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: [
|
|
7114
7122
|
/* @__PURE__ */ jsx62("path", { d: "M18 13v6a2 2 0 01-2 2H5a2 2 0 01-2-2V8a2 2 0 012-2h6" }),
|
|
7115
7123
|
/* @__PURE__ */ jsx62("polyline", { points: "15,3 21,3 21,9" }),
|
|
7116
7124
|
/* @__PURE__ */ jsx62("line", { x1: "10", y1: "14", x2: "21", y2: "3" })
|
|
@@ -7446,7 +7454,7 @@ function RedditEmbedClient({ url, maxWidth = 700 }) {
|
|
|
7446
7454
|
rel: "noopener noreferrer",
|
|
7447
7455
|
className: "inline-flex items-center space-x-2 text-ods-accent transition-colors text-h6 hover:opacity-80",
|
|
7448
7456
|
children: [
|
|
7449
|
-
/* @__PURE__ */ jsx62(
|
|
7457
|
+
/* @__PURE__ */ jsx62(ExternalLinkIcon3, {}),
|
|
7450
7458
|
/* @__PURE__ */ jsx62("span", { children: "View on Reddit" })
|
|
7451
7459
|
]
|
|
7452
7460
|
}
|
|
@@ -7458,7 +7466,7 @@ function RedditEmbedClient({ url, maxWidth = 700 }) {
|
|
|
7458
7466
|
import { useState as useState24, useEffect as useEffect13, useRef as useRef13 } from "react";
|
|
7459
7467
|
import { jsx as jsx63, jsxs as jsxs47 } from "react/jsx-runtime";
|
|
7460
7468
|
var MessageCircleIcon3 = () => /* @__PURE__ */ jsx63("svg", { width: "16", height: "16", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx63("path", { d: "M21 15a2 2 0 01-2 2H7l-4 4V5a2 2 0 012-2h14a2 2 0 012 2z" }) });
|
|
7461
|
-
var
|
|
7469
|
+
var ExternalLinkIcon4 = () => /* @__PURE__ */ jsxs47("svg", { width: "16", height: "16", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: [
|
|
7462
7470
|
/* @__PURE__ */ jsx63("path", { d: "M18 13v6a2 2 0 01-2 2H5a2 2 0 01-2-2V8a2 2 0 012-2h6" }),
|
|
7463
7471
|
/* @__PURE__ */ jsx63("polyline", { points: "15,3 21,3 21,9" }),
|
|
7464
7472
|
/* @__PURE__ */ jsx63("line", { x1: "10", y1: "14", x2: "21", y2: "3" })
|
|
@@ -7564,7 +7572,7 @@ function TwitterEmbedClient({ url, tweetId, maxWidth = 700 }) {
|
|
|
7564
7572
|
url: link.href,
|
|
7565
7573
|
text: link.textContent || link.href
|
|
7566
7574
|
})).filter((link) => !link.url.includes("twitter.com") && !link.url.includes("x.com"));
|
|
7567
|
-
const
|
|
7575
|
+
const formatTime3 = () => {
|
|
7568
7576
|
return "on X";
|
|
7569
7577
|
};
|
|
7570
7578
|
const truncateText = (text, maxLength = 600) => {
|
|
@@ -7601,7 +7609,7 @@ function TwitterEmbedClient({ url, tweetId, maxWidth = 700 }) {
|
|
|
7601
7609
|
/* @__PURE__ */ jsx63(UserIcon3, {}),
|
|
7602
7610
|
/* @__PURE__ */ jsx63("span", { children: tweetData.author_name }),
|
|
7603
7611
|
/* @__PURE__ */ jsx63(ClockIcon3, {}),
|
|
7604
|
-
/* @__PURE__ */ jsx63("span", { children:
|
|
7612
|
+
/* @__PURE__ */ jsx63("span", { children: formatTime3() })
|
|
7605
7613
|
] })
|
|
7606
7614
|
] })
|
|
7607
7615
|
] }) }) }),
|
|
@@ -7622,7 +7630,7 @@ function TwitterEmbedClient({ url, tweetId, maxWidth = 700 }) {
|
|
|
7622
7630
|
rel: "noopener noreferrer",
|
|
7623
7631
|
className: "inline-flex items-center space-x-2 text-[#1DA1F2] transition-colors text-h6 hover:text-ods-accent",
|
|
7624
7632
|
children: [
|
|
7625
|
-
/* @__PURE__ */ jsx63(
|
|
7633
|
+
/* @__PURE__ */ jsx63(ExternalLinkIcon4, {}),
|
|
7626
7634
|
/* @__PURE__ */ jsx63("span", { className: "underline", children: link.text })
|
|
7627
7635
|
]
|
|
7628
7636
|
},
|
|
@@ -7651,7 +7659,7 @@ function TwitterEmbedClient({ url, tweetId, maxWidth = 700 }) {
|
|
|
7651
7659
|
rel: "noopener noreferrer",
|
|
7652
7660
|
className: "inline-flex items-center space-x-2 text-ods-accent transition-colors text-h6 hover:opacity-80",
|
|
7653
7661
|
children: [
|
|
7654
|
-
/* @__PURE__ */ jsx63(
|
|
7662
|
+
/* @__PURE__ */ jsx63(ExternalLinkIcon4, {}),
|
|
7655
7663
|
/* @__PURE__ */ jsx63("span", { children: "View on X" })
|
|
7656
7664
|
]
|
|
7657
7665
|
}
|
|
@@ -10908,6 +10916,9 @@ var SUBSCRIBE_CONFIRM_TIMEOUT_MS = 15e3;
|
|
|
10908
10916
|
var SERVER_RETRY_GRACE_MS = 9e4;
|
|
10909
10917
|
var FAILED_RECONNECT_DELAY_MS = 3e4;
|
|
10910
10918
|
var HIDDEN_GRACE_MS = 45e3;
|
|
10919
|
+
var AUTH_RETRY_INITIAL_MS = 3e4;
|
|
10920
|
+
var AUTH_RETRY_MAX_MS = 3e5;
|
|
10921
|
+
var PRESENCE_RETRY_MIN_INTERVAL_MS = 3e4;
|
|
10911
10922
|
function createSseSubscription(options) {
|
|
10912
10923
|
const {
|
|
10913
10924
|
url,
|
|
@@ -10923,6 +10934,10 @@ function createSseSubscription(options) {
|
|
|
10923
10934
|
let closed = false;
|
|
10924
10935
|
let suspended = false;
|
|
10925
10936
|
let attempt = 0;
|
|
10937
|
+
let authAttempt = 0;
|
|
10938
|
+
let stalled = false;
|
|
10939
|
+
let awaitingAuth = false;
|
|
10940
|
+
let lastConnectAt = 0;
|
|
10926
10941
|
let generation = 0;
|
|
10927
10942
|
let abortController = null;
|
|
10928
10943
|
let retryTimerId = null;
|
|
@@ -11003,7 +11018,6 @@ function createSseSubscription(options) {
|
|
|
11003
11018
|
confirmTimerId = clearLifecycleTimer(confirmTimerId);
|
|
11004
11019
|
serverGraceTimerId = clearLifecycleTimer(serverGraceTimerId);
|
|
11005
11020
|
failedDelayTimerId = clearLifecycleTimer(failedDelayTimerId);
|
|
11006
|
-
hiddenGraceTimerId = clearLifecycleTimer(hiddenGraceTimerId);
|
|
11007
11021
|
};
|
|
11008
11022
|
const armSilenceTimer = () => {
|
|
11009
11023
|
if (silenceTimerId) clearTimeout(silenceTimerId);
|
|
@@ -11011,16 +11025,23 @@ function createSseSubscription(options) {
|
|
|
11011
11025
|
abortController?.abort();
|
|
11012
11026
|
}, silenceTimeoutMs);
|
|
11013
11027
|
};
|
|
11014
|
-
const scheduleReconnect = () => {
|
|
11028
|
+
const scheduleReconnect = (delayMs) => {
|
|
11015
11029
|
if (closed || suspended || retryTimerId) return;
|
|
11016
|
-
|
|
11017
|
-
|
|
11030
|
+
if (failedDelayTimerId) {
|
|
11031
|
+
setStatus("reconnecting");
|
|
11032
|
+
return;
|
|
11033
|
+
}
|
|
11034
|
+
let backoff = delayMs;
|
|
11035
|
+
if (backoff === void 0) {
|
|
11036
|
+
backoff = Math.min(maxBackoffMs, initialBackoffMs * 2 ** attempt);
|
|
11037
|
+
attempt += 1;
|
|
11038
|
+
}
|
|
11018
11039
|
const jitter = backoff * 0.25 * Math.random();
|
|
11019
|
-
attempt += 1;
|
|
11020
11040
|
retryTimerId = setTimeout(() => {
|
|
11021
11041
|
retryTimerId = null;
|
|
11022
11042
|
void connect();
|
|
11023
11043
|
}, backoff + jitter);
|
|
11044
|
+
setStatus("reconnecting");
|
|
11024
11045
|
};
|
|
11025
11046
|
const parseFrame = (rawFrame) => {
|
|
11026
11047
|
let eventName = "message";
|
|
@@ -11052,6 +11073,9 @@ function createSseSubscription(options) {
|
|
|
11052
11073
|
async function connect() {
|
|
11053
11074
|
if (closed || suspended) return;
|
|
11054
11075
|
const gen = ++generation;
|
|
11076
|
+
stalled = false;
|
|
11077
|
+
awaitingAuth = false;
|
|
11078
|
+
lastConnectAt = Date.now();
|
|
11055
11079
|
setStatus("connecting");
|
|
11056
11080
|
abortController = new AbortController();
|
|
11057
11081
|
let response;
|
|
@@ -11079,9 +11103,19 @@ function createSseSubscription(options) {
|
|
|
11079
11103
|
return;
|
|
11080
11104
|
}
|
|
11081
11105
|
const blockLayer = response.headers.get("x-block-layer");
|
|
11106
|
+
const blockNote = blockLayer ? ` (x-block-layer: ${blockLayer})` : "";
|
|
11107
|
+
if (response.status === 401 && pauseWhenHidden) {
|
|
11108
|
+
const delayMs = Math.min(AUTH_RETRY_MAX_MS, AUTH_RETRY_INITIAL_MS * 2 ** authAttempt);
|
|
11109
|
+
authAttempt += 1;
|
|
11110
|
+
console.warn(`[sse-subscription] 401 for ${url}${blockNote} \u2014 retrying in ~${Math.round(delayMs / 1e3)}s`);
|
|
11111
|
+
awaitingAuth = true;
|
|
11112
|
+
scheduleReconnect(delayMs);
|
|
11113
|
+
return;
|
|
11114
|
+
}
|
|
11082
11115
|
console.warn(
|
|
11083
|
-
`[sse-subscription] terminal ${response.status} for ${url}${
|
|
11116
|
+
`[sse-subscription] terminal ${response.status} for ${url}${blockNote} \u2014 ${pauseWhenHidden ? "retrying on presence" : "not retrying"}`
|
|
11084
11117
|
);
|
|
11118
|
+
stalled = pauseWhenHidden;
|
|
11085
11119
|
setStatus("terminal");
|
|
11086
11120
|
return;
|
|
11087
11121
|
}
|
|
@@ -11090,6 +11124,7 @@ function createSseSubscription(options) {
|
|
|
11090
11124
|
return;
|
|
11091
11125
|
}
|
|
11092
11126
|
attempt = 0;
|
|
11127
|
+
authAttempt = 0;
|
|
11093
11128
|
setStatus("open");
|
|
11094
11129
|
armSilenceTimer();
|
|
11095
11130
|
confirmTimerId = clearLifecycleTimer(confirmTimerId);
|
|
@@ -11151,6 +11186,10 @@ function createSseSubscription(options) {
|
|
|
11151
11186
|
abortController?.abort();
|
|
11152
11187
|
setStatus("suspended");
|
|
11153
11188
|
};
|
|
11189
|
+
const retryIfStalled = () => {
|
|
11190
|
+
if (!stalled || Date.now() - lastConnectAt < PRESENCE_RETRY_MIN_INTERVAL_MS) return;
|
|
11191
|
+
doReconnect();
|
|
11192
|
+
};
|
|
11154
11193
|
const onVisibilityChange = () => {
|
|
11155
11194
|
if (document.visibilityState === "hidden") {
|
|
11156
11195
|
if (!hiddenGraceTimerId) {
|
|
@@ -11165,15 +11204,21 @@ function createSseSubscription(options) {
|
|
|
11165
11204
|
if (suspended) {
|
|
11166
11205
|
suspended = false;
|
|
11167
11206
|
void connect();
|
|
11207
|
+
return;
|
|
11168
11208
|
}
|
|
11209
|
+
retryIfStalled();
|
|
11169
11210
|
};
|
|
11170
11211
|
const onOnline = () => {
|
|
11171
11212
|
if (!suspended) doReconnect();
|
|
11172
11213
|
};
|
|
11214
|
+
const unsubscribeCredentials = pauseWhenHidden && fetchImpl === embedAuthedFetch ? subscribeEmbedCredentialChange(() => {
|
|
11215
|
+
if (awaitingAuth) doReconnect();
|
|
11216
|
+
}) : null;
|
|
11173
11217
|
const listenersActive = pauseWhenHidden && typeof document !== "undefined" && typeof window !== "undefined";
|
|
11174
11218
|
if (listenersActive) {
|
|
11175
11219
|
document.addEventListener("visibilitychange", onVisibilityChange);
|
|
11176
11220
|
window.addEventListener("online", onOnline);
|
|
11221
|
+
window.addEventListener("focus", retryIfStalled);
|
|
11177
11222
|
}
|
|
11178
11223
|
void connect();
|
|
11179
11224
|
return {
|
|
@@ -11182,11 +11227,14 @@ function createSseSubscription(options) {
|
|
|
11182
11227
|
closed = true;
|
|
11183
11228
|
generation += 1;
|
|
11184
11229
|
clearTimers();
|
|
11230
|
+
hiddenGraceTimerId = clearLifecycleTimer(hiddenGraceTimerId);
|
|
11185
11231
|
abortController?.abort();
|
|
11186
11232
|
if (listenersActive) {
|
|
11187
11233
|
document.removeEventListener("visibilitychange", onVisibilityChange);
|
|
11188
11234
|
window.removeEventListener("online", onOnline);
|
|
11235
|
+
window.removeEventListener("focus", retryIfStalled);
|
|
11189
11236
|
}
|
|
11237
|
+
unsubscribeCredentials?.();
|
|
11190
11238
|
setConnected(false);
|
|
11191
11239
|
onStatusChange?.("closed");
|
|
11192
11240
|
},
|
|
@@ -29465,11 +29513,526 @@ function TimeTrackerHeaderButton({ className, disabled }) {
|
|
|
29465
29513
|
] });
|
|
29466
29514
|
}
|
|
29467
29515
|
|
|
29516
|
+
// src/components/features/remote-session/remote-session-parts.tsx
|
|
29517
|
+
import { useEffect as useEffect41, useState as useState74 } from "react";
|
|
29518
|
+
import { jsx as jsx260, jsxs as jsxs207 } from "react/jsx-runtime";
|
|
29519
|
+
var DESKTOP_SCALE = {
|
|
29520
|
+
"--spacing-system-xs": "0.5rem",
|
|
29521
|
+
"--spacing-system-s": "0.75rem",
|
|
29522
|
+
"--spacing-system-m": "1rem",
|
|
29523
|
+
"--spacing-system-l": "1.5rem",
|
|
29524
|
+
"--spacing-system-xl": "2.5rem",
|
|
29525
|
+
"--font-size-h1-title": "3.5rem",
|
|
29526
|
+
"--font-size-h2-sub-title": "2rem",
|
|
29527
|
+
"--font-size-h3-body": "1.125rem",
|
|
29528
|
+
"--font-size-h4-body": "1.125rem",
|
|
29529
|
+
"--font-size-h5-caption": "0.875rem",
|
|
29530
|
+
"--font-size-h6-caption": "0.875rem",
|
|
29531
|
+
"--font-line-space-h1-main-title": "4rem",
|
|
29532
|
+
"--font-line-space-h2-sub-title": "2.5rem",
|
|
29533
|
+
"--font-line-space-h3-body": "1.5rem",
|
|
29534
|
+
"--font-line-space-h4-body": "1.5rem",
|
|
29535
|
+
"--font-line-space-h5-caption": "1.25rem",
|
|
29536
|
+
"--font-line-space-h6-caption": "1.25rem"
|
|
29537
|
+
};
|
|
29538
|
+
function RemoteSessionScope({ children, className }) {
|
|
29539
|
+
return /* @__PURE__ */ jsx260("div", { "data-app-type": "openframe", style: DESKTOP_SCALE, className, children });
|
|
29540
|
+
}
|
|
29541
|
+
function RemoteSessionOrgLogo({ name, logoUrl, sizePx, className }) {
|
|
29542
|
+
if (logoUrl) {
|
|
29543
|
+
return /* @__PURE__ */ jsx260(
|
|
29544
|
+
SquareAvatar,
|
|
29545
|
+
{
|
|
29546
|
+
variant: "square",
|
|
29547
|
+
fit: "contain",
|
|
29548
|
+
sizePx,
|
|
29549
|
+
src: logoUrl,
|
|
29550
|
+
alt: name,
|
|
29551
|
+
fallback: name,
|
|
29552
|
+
className: cn("shrink-0 rounded-md border border-ods-border bg-ods-card", className)
|
|
29553
|
+
}
|
|
29554
|
+
);
|
|
29555
|
+
}
|
|
29556
|
+
return /* @__PURE__ */ jsx260(
|
|
29557
|
+
"div",
|
|
29558
|
+
{
|
|
29559
|
+
role: "img",
|
|
29560
|
+
"aria-label": name,
|
|
29561
|
+
style: { width: sizePx, height: sizePx },
|
|
29562
|
+
className: cn(
|
|
29563
|
+
"flex shrink-0 items-center justify-center rounded-md border border-ods-border bg-ods-card",
|
|
29564
|
+
className
|
|
29565
|
+
),
|
|
29566
|
+
children: /* @__PURE__ */ jsx260(OpenFrameLogo, { className: "size-1/2" })
|
|
29567
|
+
}
|
|
29568
|
+
);
|
|
29569
|
+
}
|
|
29570
|
+
function RemoteSessionRecordingTag() {
|
|
29571
|
+
return /* @__PURE__ */ jsxs207("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: [
|
|
29572
|
+
/* @__PURE__ */ jsx260(RecordingIcon, { size: 16, color: "currentColor", className: "text-ods-success" }),
|
|
29573
|
+
/* @__PURE__ */ jsx260("span", { className: "text-ods-success text-h5", children: "Session Recording" })
|
|
29574
|
+
] });
|
|
29575
|
+
}
|
|
29576
|
+
var REMOTE_SESSION_DRAG_HANDLE_CLASS = "cursor-grab active:cursor-grabbing";
|
|
29577
|
+
function RemoteSessionDragger({ dragHandlers }) {
|
|
29578
|
+
return /* @__PURE__ */ jsx260(
|
|
29579
|
+
"span",
|
|
29580
|
+
{
|
|
29581
|
+
"aria-hidden": true,
|
|
29582
|
+
className: cn(
|
|
29583
|
+
"absolute right-[var(--spacing-system-xsf)] top-[var(--spacing-system-xsf)] text-ods-text-secondary",
|
|
29584
|
+
dragHandlers && REMOTE_SESSION_DRAG_HANDLE_CLASS
|
|
29585
|
+
),
|
|
29586
|
+
...dragHandlers,
|
|
29587
|
+
children: /* @__PURE__ */ jsx260(DraggerIcon, { size: 24, color: "currentColor" })
|
|
29588
|
+
}
|
|
29589
|
+
);
|
|
29590
|
+
}
|
|
29591
|
+
function formatRemoteSessionElapsed(elapsedMs) {
|
|
29592
|
+
const total = Math.max(0, Math.floor(elapsedMs / 1e3));
|
|
29593
|
+
const hours = Math.floor(total / 3600);
|
|
29594
|
+
const minutes = Math.floor(total % 3600 / 60);
|
|
29595
|
+
const seconds = String(total % 60).padStart(2, "0");
|
|
29596
|
+
return hours > 0 ? `${hours}:${String(minutes).padStart(2, "0")}:${seconds}` : `${minutes}:${seconds}`;
|
|
29597
|
+
}
|
|
29598
|
+
function useRemoteSessionTimer(startedAt) {
|
|
29599
|
+
const [nowMs, setNowMs] = useState74(() => Date.now());
|
|
29600
|
+
useEffect41(() => {
|
|
29601
|
+
const timer = setInterval(() => setNowMs(Date.now()), 1e3);
|
|
29602
|
+
return () => clearInterval(timer);
|
|
29603
|
+
}, []);
|
|
29604
|
+
return formatRemoteSessionElapsed(nowMs - Date.parse(startedAt));
|
|
29605
|
+
}
|
|
29606
|
+
|
|
29607
|
+
// src/components/features/remote-session/remote-access-request-card.tsx
|
|
29608
|
+
import { jsx as jsx261, jsxs as jsxs208 } from "react/jsx-runtime";
|
|
29609
|
+
function displaySiteUrl(url) {
|
|
29610
|
+
return url.replace(/^https?:\/\//, "").replace(/\/$/, "");
|
|
29611
|
+
}
|
|
29612
|
+
function RemoteAccessRequestCard({
|
|
29613
|
+
party,
|
|
29614
|
+
showRecordingNotice = false,
|
|
29615
|
+
deciding = null,
|
|
29616
|
+
error,
|
|
29617
|
+
onDecide,
|
|
29618
|
+
onOpenSite
|
|
29619
|
+
}) {
|
|
29620
|
+
const { organizationName } = party;
|
|
29621
|
+
const siteUrl = party.organizationSiteUrl ?? void 0;
|
|
29622
|
+
const openableSite = siteUrl?.startsWith("https://") ? siteUrl : void 0;
|
|
29623
|
+
return /* @__PURE__ */ jsxs208("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: [
|
|
29624
|
+
/* @__PURE__ */ jsx261("h1", { className: "w-full text-ods-text-primary text-h2", children: "Your IT support team is requesting remote access" }),
|
|
29625
|
+
/* @__PURE__ */ jsxs208("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: [
|
|
29626
|
+
/* @__PURE__ */ jsx261(RemoteSessionOrgLogo, { name: organizationName, logoUrl: party.organizationLogoUrl, sizePx: 64 }),
|
|
29627
|
+
/* @__PURE__ */ jsxs208("div", { className: "flex min-w-0 flex-1 flex-col", children: [
|
|
29628
|
+
/* @__PURE__ */ jsx261("p", { className: "w-full truncate text-ods-text-primary text-h3", children: organizationName }),
|
|
29629
|
+
siteUrl && /* @__PURE__ */ jsx261("p", { className: "w-full truncate text-ods-text-secondary text-h4", children: displaySiteUrl(siteUrl) })
|
|
29630
|
+
] }),
|
|
29631
|
+
openableSite && onOpenSite && /* @__PURE__ */ jsx261(Button, { variant: "outline", size: "icon", "aria-label": "Open website", onClick: () => onOpenSite(openableSite), children: /* @__PURE__ */ jsx261(ExternalLinkIcon, { size: 24, color: "currentColor" }) })
|
|
29632
|
+
] }),
|
|
29633
|
+
/* @__PURE__ */ jsxs208("p", { className: "w-full text-ods-text-primary text-h4", children: [
|
|
29634
|
+
"A technician from ",
|
|
29635
|
+
/* @__PURE__ */ jsx261("span", { className: "text-ods-accent", children: organizationName }),
|
|
29636
|
+
" will be able to view your screen and control your mouse and keyboard during this session."
|
|
29637
|
+
] }),
|
|
29638
|
+
/* @__PURE__ */ jsxs208("div", { className: "flex w-full flex-col gap-[var(--spacing-system-xs)]", children: [
|
|
29639
|
+
showRecordingNotice && /* @__PURE__ */ jsxs208("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: [
|
|
29640
|
+
/* @__PURE__ */ jsx261(InfoCircleIcon, { size: 24, color: "currentColor", className: "shrink-0 text-ods-accent" }),
|
|
29641
|
+
/* @__PURE__ */ jsx261("p", { className: "min-w-0 flex-1 text-ods-text-primary text-h6", children: "This session will be recorded and available upon request." })
|
|
29642
|
+
] }),
|
|
29643
|
+
error ? /* @__PURE__ */ jsx261("p", { className: "w-full text-ods-text-primary text-h6", children: error }) : /* @__PURE__ */ jsx261("p", { className: "w-full text-ods-text-secondary text-h6", children: "You can end the session at any time." })
|
|
29644
|
+
] }),
|
|
29645
|
+
/* @__PURE__ */ jsxs208("div", { className: "flex w-full items-stretch gap-[var(--spacing-system-l)]", children: [
|
|
29646
|
+
/* @__PURE__ */ jsx261(
|
|
29647
|
+
Button,
|
|
29648
|
+
{
|
|
29649
|
+
variant: "outline",
|
|
29650
|
+
fullWidth: true,
|
|
29651
|
+
loading: deciding === "DENIED",
|
|
29652
|
+
disabled: deciding !== null,
|
|
29653
|
+
onClick: () => onDecide("DENIED"),
|
|
29654
|
+
children: "Decline"
|
|
29655
|
+
}
|
|
29656
|
+
),
|
|
29657
|
+
/* @__PURE__ */ jsx261(
|
|
29658
|
+
Button,
|
|
29659
|
+
{
|
|
29660
|
+
variant: "accent",
|
|
29661
|
+
fullWidth: true,
|
|
29662
|
+
loading: deciding === "APPROVED",
|
|
29663
|
+
disabled: deciding !== null,
|
|
29664
|
+
onClick: () => onDecide("APPROVED"),
|
|
29665
|
+
children: "Allow Access"
|
|
29666
|
+
}
|
|
29667
|
+
)
|
|
29668
|
+
] })
|
|
29669
|
+
] });
|
|
29670
|
+
}
|
|
29671
|
+
|
|
29672
|
+
// src/components/features/remote-session/remote-session-block.tsx
|
|
29673
|
+
import { forwardRef as forwardRef31 } from "react";
|
|
29674
|
+
import { jsx as jsx262, jsxs as jsxs209 } from "react/jsx-runtime";
|
|
29675
|
+
var RemoteSessionBlockFrame = forwardRef31(
|
|
29676
|
+
({ children, expanded = false, onHide, className }, ref) => {
|
|
29677
|
+
return /* @__PURE__ */ jsxs209(
|
|
29678
|
+
"div",
|
|
29679
|
+
{
|
|
29680
|
+
ref,
|
|
29681
|
+
className: cn(
|
|
29682
|
+
"flex w-[440px] shrink-0 flex-col overflow-hidden rounded-md border border-ods-border bg-ods-bg",
|
|
29683
|
+
expanded && "h-[680px]",
|
|
29684
|
+
className
|
|
29685
|
+
),
|
|
29686
|
+
children: [
|
|
29687
|
+
children,
|
|
29688
|
+
/* @__PURE__ */ jsxs209(
|
|
29689
|
+
"button",
|
|
29690
|
+
{
|
|
29691
|
+
type: "button",
|
|
29692
|
+
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)]",
|
|
29693
|
+
onClick: onHide,
|
|
29694
|
+
children: [
|
|
29695
|
+
/* @__PURE__ */ jsx262(Chevrons03RightIcon, { size: 24 }),
|
|
29696
|
+
/* @__PURE__ */ jsx262("span", { className: "min-w-0 flex-1 truncate text-left text-ods-text-secondary text-h4", children: "Hide this Block" }),
|
|
29697
|
+
/* @__PURE__ */ jsx262(OpenFrameLogo, { className: "size-6 shrink-0" })
|
|
29698
|
+
]
|
|
29699
|
+
}
|
|
29700
|
+
)
|
|
29701
|
+
]
|
|
29702
|
+
}
|
|
29703
|
+
);
|
|
29704
|
+
}
|
|
29705
|
+
);
|
|
29706
|
+
RemoteSessionBlockFrame.displayName = "RemoteSessionBlockFrame";
|
|
29707
|
+
function RemoteSessionEndButton({ onEndSession }) {
|
|
29708
|
+
return /* @__PURE__ */ jsx262(
|
|
29709
|
+
Button,
|
|
29710
|
+
{
|
|
29711
|
+
variant: "outline",
|
|
29712
|
+
fullWidth: true,
|
|
29713
|
+
leftIcon: /* @__PURE__ */ jsx262(MonitorOffIcon, { size: 24, color: "currentColor", className: "text-ods-error" }),
|
|
29714
|
+
onClick: onEndSession,
|
|
29715
|
+
children: "End Session"
|
|
29716
|
+
}
|
|
29717
|
+
);
|
|
29718
|
+
}
|
|
29719
|
+
function RemoteSessionSummary({
|
|
29720
|
+
party,
|
|
29721
|
+
elapsed,
|
|
29722
|
+
showRecordingTag = false,
|
|
29723
|
+
onOpenChat,
|
|
29724
|
+
onEndSession,
|
|
29725
|
+
dragHandlers
|
|
29726
|
+
}) {
|
|
29727
|
+
const technician = party.technicianName;
|
|
29728
|
+
return /* @__PURE__ */ jsxs209("div", { className: "relative flex flex-col gap-[var(--spacing-system-m)] p-[var(--spacing-system-m)]", children: [
|
|
29729
|
+
/* @__PURE__ */ jsx262(RemoteSessionDragger, { dragHandlers }),
|
|
29730
|
+
/* @__PURE__ */ jsxs209(
|
|
29731
|
+
"div",
|
|
29732
|
+
{
|
|
29733
|
+
className: cn(
|
|
29734
|
+
"flex w-full items-center gap-[var(--spacing-system-xs)] pr-[var(--spacing-system-mf)]",
|
|
29735
|
+
dragHandlers && REMOTE_SESSION_DRAG_HANDLE_CLASS
|
|
29736
|
+
),
|
|
29737
|
+
...dragHandlers,
|
|
29738
|
+
children: [
|
|
29739
|
+
technician ? /* @__PURE__ */ jsx262(
|
|
29740
|
+
SquareAvatar,
|
|
29741
|
+
{
|
|
29742
|
+
variant: "round",
|
|
29743
|
+
sizePx: 48,
|
|
29744
|
+
src: party.technicianAvatarUrl ?? void 0,
|
|
29745
|
+
fallback: technician
|
|
29746
|
+
}
|
|
29747
|
+
) : /* @__PURE__ */ jsx262(RemoteSessionOrgLogo, { name: party.organizationName, logoUrl: party.organizationLogoUrl, sizePx: 48 }),
|
|
29748
|
+
/* @__PURE__ */ jsxs209("div", { className: "flex min-w-0 flex-1 flex-col", children: [
|
|
29749
|
+
/* @__PURE__ */ jsxs209("p", { className: "w-full truncate text-ods-text-primary text-h4", children: [
|
|
29750
|
+
technician ? `${technician} connected` : "IT support team is connected",
|
|
29751
|
+
" ",
|
|
29752
|
+
/* @__PURE__ */ jsxs209("span", { className: "text-ods-text-secondary", children: [
|
|
29753
|
+
"(",
|
|
29754
|
+
elapsed,
|
|
29755
|
+
")"
|
|
29756
|
+
] })
|
|
29757
|
+
] }),
|
|
29758
|
+
/* @__PURE__ */ jsx262("p", { className: "w-full truncate text-ods-text-secondary text-h4", children: party.organizationName })
|
|
29759
|
+
] })
|
|
29760
|
+
]
|
|
29761
|
+
}
|
|
29762
|
+
),
|
|
29763
|
+
showRecordingTag && /* @__PURE__ */ jsx262(RemoteSessionRecordingTag, {}),
|
|
29764
|
+
/* @__PURE__ */ jsxs209("div", { className: "flex w-full items-stretch gap-[var(--spacing-system-m)]", children: [
|
|
29765
|
+
/* @__PURE__ */ jsx262(
|
|
29766
|
+
Button,
|
|
29767
|
+
{
|
|
29768
|
+
variant: "outline",
|
|
29769
|
+
fullWidth: true,
|
|
29770
|
+
leftIcon: /* @__PURE__ */ jsx262(ChatsIcon, { size: 24, color: "currentColor" }),
|
|
29771
|
+
onClick: onOpenChat,
|
|
29772
|
+
children: "Open Chat"
|
|
29773
|
+
}
|
|
29774
|
+
),
|
|
29775
|
+
/* @__PURE__ */ jsx262(RemoteSessionEndButton, { onEndSession })
|
|
29776
|
+
] })
|
|
29777
|
+
] });
|
|
29778
|
+
}
|
|
29779
|
+
var RemoteSessionMinimizedChip = forwardRef31(
|
|
29780
|
+
({ party, onExpand, dragHandlers }, ref) => {
|
|
29781
|
+
const technician = party.technicianName;
|
|
29782
|
+
return /* @__PURE__ */ jsxs209(
|
|
29783
|
+
"button",
|
|
29784
|
+
{
|
|
29785
|
+
ref,
|
|
29786
|
+
type: "button",
|
|
29787
|
+
"aria-label": "Show session block",
|
|
29788
|
+
className: cn(
|
|
29789
|
+
"flex shrink-0 flex-col overflow-hidden rounded-md border border-ods-border",
|
|
29790
|
+
dragHandlers && REMOTE_SESSION_DRAG_HANDLE_CLASS
|
|
29791
|
+
),
|
|
29792
|
+
onClick: onExpand,
|
|
29793
|
+
...dragHandlers,
|
|
29794
|
+
children: [
|
|
29795
|
+
technician ? /* @__PURE__ */ jsx262(
|
|
29796
|
+
SquareAvatar,
|
|
29797
|
+
{
|
|
29798
|
+
sizePx: 48,
|
|
29799
|
+
src: party.technicianAvatarUrl ?? void 0,
|
|
29800
|
+
fallback: technician,
|
|
29801
|
+
className: "rounded-none"
|
|
29802
|
+
}
|
|
29803
|
+
) : /* @__PURE__ */ jsx262(
|
|
29804
|
+
RemoteSessionOrgLogo,
|
|
29805
|
+
{
|
|
29806
|
+
name: party.organizationName,
|
|
29807
|
+
logoUrl: party.organizationLogoUrl,
|
|
29808
|
+
sizePx: 48,
|
|
29809
|
+
className: "rounded-none border-0"
|
|
29810
|
+
}
|
|
29811
|
+
),
|
|
29812
|
+
/* @__PURE__ */ jsx262("span", { className: "flex h-9 w-12 items-center justify-center border-t border-ods-border bg-ods-card", children: /* @__PURE__ */ jsx262(Chevrons03LeftIcon, { size: 24 }) })
|
|
29813
|
+
]
|
|
29814
|
+
}
|
|
29815
|
+
);
|
|
29816
|
+
}
|
|
29817
|
+
);
|
|
29818
|
+
RemoteSessionMinimizedChip.displayName = "RemoteSessionMinimizedChip";
|
|
29819
|
+
|
|
29820
|
+
// src/components/features/remote-session/remote-session-chat-panel.tsx
|
|
29821
|
+
import { useEffect as useEffect42, useRef as useRef39 } from "react";
|
|
29822
|
+
import { jsx as jsx263, jsxs as jsxs210 } from "react/jsx-runtime";
|
|
29823
|
+
function formatTime2(at) {
|
|
29824
|
+
return at.toLocaleTimeString([], { hour: "numeric", minute: "2-digit" });
|
|
29825
|
+
}
|
|
29826
|
+
function RemoteSessionChatPanel({
|
|
29827
|
+
party,
|
|
29828
|
+
elapsed,
|
|
29829
|
+
messages,
|
|
29830
|
+
showRecordingTag = false,
|
|
29831
|
+
draft,
|
|
29832
|
+
onDraftChange,
|
|
29833
|
+
onSend,
|
|
29834
|
+
ready = true,
|
|
29835
|
+
error,
|
|
29836
|
+
onCloseChat,
|
|
29837
|
+
onEndSession,
|
|
29838
|
+
dragHandlers
|
|
29839
|
+
}) {
|
|
29840
|
+
const listRef = useRef39(null);
|
|
29841
|
+
useEffect42(() => {
|
|
29842
|
+
const list = listRef.current;
|
|
29843
|
+
if (list) list.scrollTop = list.scrollHeight;
|
|
29844
|
+
}, [messages]);
|
|
29845
|
+
const handleSend = () => {
|
|
29846
|
+
const text = draft.trim();
|
|
29847
|
+
if (!text) return;
|
|
29848
|
+
onSend(text);
|
|
29849
|
+
onDraftChange("");
|
|
29850
|
+
};
|
|
29851
|
+
return /* @__PURE__ */ jsxs210("div", { className: "flex min-h-0 flex-1 flex-col", children: [
|
|
29852
|
+
/* @__PURE__ */ jsxs210("div", { className: "relative flex flex-col gap-[var(--spacing-system-m)] p-[var(--spacing-system-m)]", children: [
|
|
29853
|
+
/* @__PURE__ */ jsx263(RemoteSessionDragger, { dragHandlers }),
|
|
29854
|
+
/* @__PURE__ */ jsxs210(
|
|
29855
|
+
"div",
|
|
29856
|
+
{
|
|
29857
|
+
className: cn(
|
|
29858
|
+
"flex w-full flex-col pr-[var(--spacing-system-mf)]",
|
|
29859
|
+
dragHandlers && REMOTE_SESSION_DRAG_HANDLE_CLASS
|
|
29860
|
+
),
|
|
29861
|
+
...dragHandlers,
|
|
29862
|
+
children: [
|
|
29863
|
+
/* @__PURE__ */ jsxs210("p", { className: "w-full truncate text-ods-text-primary text-h4", children: [
|
|
29864
|
+
"Your IT support team is connected ",
|
|
29865
|
+
/* @__PURE__ */ jsxs210("span", { className: "text-ods-text-secondary", children: [
|
|
29866
|
+
"(",
|
|
29867
|
+
elapsed,
|
|
29868
|
+
")"
|
|
29869
|
+
] })
|
|
29870
|
+
] }),
|
|
29871
|
+
/* @__PURE__ */ jsx263("p", { className: "w-full truncate text-ods-text-secondary text-h4", children: "You can end this session at any time" })
|
|
29872
|
+
]
|
|
29873
|
+
}
|
|
29874
|
+
),
|
|
29875
|
+
showRecordingTag && /* @__PURE__ */ jsx263(RemoteSessionRecordingTag, {}),
|
|
29876
|
+
/* @__PURE__ */ jsxs210("div", { className: "flex w-full items-stretch gap-[var(--spacing-system-m)]", children: [
|
|
29877
|
+
/* @__PURE__ */ jsx263(
|
|
29878
|
+
Button,
|
|
29879
|
+
{
|
|
29880
|
+
variant: "outline",
|
|
29881
|
+
fullWidth: true,
|
|
29882
|
+
leftIcon: /* @__PURE__ */ jsx263(MessageOffIcon, { size: 24, color: "currentColor" }),
|
|
29883
|
+
onClick: onCloseChat,
|
|
29884
|
+
children: "Close Chat"
|
|
29885
|
+
}
|
|
29886
|
+
),
|
|
29887
|
+
/* @__PURE__ */ jsx263(RemoteSessionEndButton, { onEndSession })
|
|
29888
|
+
] })
|
|
29889
|
+
] }),
|
|
29890
|
+
/* @__PURE__ */ jsx263(
|
|
29891
|
+
"div",
|
|
29892
|
+
{
|
|
29893
|
+
ref: listRef,
|
|
29894
|
+
className: "flex min-h-0 flex-1 flex-col overflow-y-auto bg-ods-card p-[var(--spacing-system-m)]",
|
|
29895
|
+
children: /* @__PURE__ */ jsx263("div", { className: "mt-auto flex flex-col gap-[var(--spacing-system-s)]", children: messages.map(
|
|
29896
|
+
(message) => message.author === "system" ? /* @__PURE__ */ jsx263("p", { className: "w-full text-center text-ods-text-secondary text-h6", children: message.text }, message.id) : /* @__PURE__ */ jsx263(RemoteSessionChatMessageRow, { message, party }, message.id)
|
|
29897
|
+
) })
|
|
29898
|
+
}
|
|
29899
|
+
),
|
|
29900
|
+
error && /* @__PURE__ */ jsx263("p", { className: "bg-ods-card px-[var(--spacing-system-m)] text-ods-error text-h6", children: error }),
|
|
29901
|
+
/* @__PURE__ */ jsxs210(
|
|
29902
|
+
"form",
|
|
29903
|
+
{
|
|
29904
|
+
className: "flex items-center gap-[var(--spacing-system-xs)] bg-ods-card px-[var(--spacing-system-m)] pb-[var(--spacing-system-m)]",
|
|
29905
|
+
onSubmit: (event) => {
|
|
29906
|
+
event.preventDefault();
|
|
29907
|
+
handleSend();
|
|
29908
|
+
},
|
|
29909
|
+
children: [
|
|
29910
|
+
/* @__PURE__ */ jsx263(
|
|
29911
|
+
"input",
|
|
29912
|
+
{
|
|
29913
|
+
value: draft,
|
|
29914
|
+
onChange: (event) => onDraftChange(event.target.value),
|
|
29915
|
+
disabled: !ready,
|
|
29916
|
+
placeholder: ready ? "Enter your Message..." : "Loading chat...",
|
|
29917
|
+
"aria-label": "Message",
|
|
29918
|
+
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"
|
|
29919
|
+
}
|
|
29920
|
+
),
|
|
29921
|
+
/* @__PURE__ */ jsx263(
|
|
29922
|
+
"button",
|
|
29923
|
+
{
|
|
29924
|
+
type: "submit",
|
|
29925
|
+
"aria-label": "Send message",
|
|
29926
|
+
disabled: !ready,
|
|
29927
|
+
className: "flex size-12 shrink-0 items-center justify-center",
|
|
29928
|
+
children: /* @__PURE__ */ jsx263(Send03Icon, { size: 24, color: "currentColor", className: "text-ods-text-primary" })
|
|
29929
|
+
}
|
|
29930
|
+
)
|
|
29931
|
+
]
|
|
29932
|
+
}
|
|
29933
|
+
)
|
|
29934
|
+
] });
|
|
29935
|
+
}
|
|
29936
|
+
function RemoteSessionChatMessageRow({
|
|
29937
|
+
message,
|
|
29938
|
+
party
|
|
29939
|
+
}) {
|
|
29940
|
+
const isTechnician = message.author === "technician";
|
|
29941
|
+
const technician = message.name ?? party.technicianName ?? "Technician";
|
|
29942
|
+
return /* @__PURE__ */ jsxs210("div", { className: "flex w-full flex-col", children: [
|
|
29943
|
+
/* @__PURE__ */ jsxs210("div", { className: "flex w-full items-center gap-[var(--spacing-system-xs)]", children: [
|
|
29944
|
+
isTechnician && /* @__PURE__ */ jsx263(
|
|
29945
|
+
SquareAvatar,
|
|
29946
|
+
{
|
|
29947
|
+
variant: "round",
|
|
29948
|
+
sizePx: 16,
|
|
29949
|
+
src: party.technicianAvatarUrl ?? void 0,
|
|
29950
|
+
fallback: technician
|
|
29951
|
+
}
|
|
29952
|
+
),
|
|
29953
|
+
/* @__PURE__ */ jsx263(
|
|
29954
|
+
"span",
|
|
29955
|
+
{
|
|
29956
|
+
className: cn(
|
|
29957
|
+
"min-w-0 flex-1 truncate text-code",
|
|
29958
|
+
isTechnician ? "text-ods-accent" : "text-ods-text-secondary"
|
|
29959
|
+
),
|
|
29960
|
+
children: isTechnician ? technician : "User"
|
|
29961
|
+
}
|
|
29962
|
+
),
|
|
29963
|
+
/* @__PURE__ */ jsx263("span", { className: "shrink-0 text-ods-text-secondary text-h6", children: formatTime2(message.at) })
|
|
29964
|
+
] }),
|
|
29965
|
+
/* @__PURE__ */ jsx263("p", { className: "w-full break-words text-ods-text-primary text-h6", children: message.text })
|
|
29966
|
+
] });
|
|
29967
|
+
}
|
|
29968
|
+
|
|
29969
|
+
// src/components/features/remote-session/remote-session-dialog.tsx
|
|
29970
|
+
import { jsx as jsx264, jsxs as jsxs211 } from "react/jsx-runtime";
|
|
29971
|
+
var NOTICE_COPY = {
|
|
29972
|
+
"session-ended": { title: "Remote session ended", suffix: "has disconnected from your device." },
|
|
29973
|
+
"connection-lost": { title: "Connection lost", suffix: "lost the connection to your device." }
|
|
29974
|
+
};
|
|
29975
|
+
function RemoteSessionDialog({
|
|
29976
|
+
variant,
|
|
29977
|
+
organizationName,
|
|
29978
|
+
ending = false,
|
|
29979
|
+
onEndSession,
|
|
29980
|
+
onClose
|
|
29981
|
+
}) {
|
|
29982
|
+
if (variant === "end-confirm") {
|
|
29983
|
+
return /* @__PURE__ */ jsxs211(DialogCard, { children: [
|
|
29984
|
+
/* @__PURE__ */ jsxs211("div", { className: "flex w-full flex-col gap-[var(--spacing-system-xs)]", children: [
|
|
29985
|
+
/* @__PURE__ */ jsx264("h1", { className: "w-full text-ods-text-primary text-h2", children: "End remote session?" }),
|
|
29986
|
+
/* @__PURE__ */ jsx264("p", { className: "w-full text-ods-text-primary text-h4", children: "The technician will lose access to your device immediately." })
|
|
29987
|
+
] }),
|
|
29988
|
+
/* @__PURE__ */ jsxs211("div", { className: "flex w-full items-stretch gap-[var(--spacing-system-l)]", children: [
|
|
29989
|
+
/* @__PURE__ */ jsx264(Button, { variant: "outline", fullWidth: true, disabled: ending, onClick: onClose, children: "Cancel" }),
|
|
29990
|
+
/* @__PURE__ */ jsx264(Button, { variant: "destructive", fullWidth: true, loading: ending, onClick: onEndSession, children: "End Session" })
|
|
29991
|
+
] })
|
|
29992
|
+
] });
|
|
29993
|
+
}
|
|
29994
|
+
const copy = NOTICE_COPY[variant];
|
|
29995
|
+
return /* @__PURE__ */ jsxs211(DialogCard, { children: [
|
|
29996
|
+
/* @__PURE__ */ jsxs211("div", { className: "flex w-full flex-col gap-[var(--spacing-system-xs)]", children: [
|
|
29997
|
+
/* @__PURE__ */ jsx264("h1", { className: "w-full text-ods-text-primary text-h2", children: copy.title }),
|
|
29998
|
+
/* @__PURE__ */ jsxs211("p", { className: "w-full text-ods-text-primary text-h4", children: [
|
|
29999
|
+
/* @__PURE__ */ jsx264("span", { className: "text-ods-accent", children: organizationName }),
|
|
30000
|
+
" ",
|
|
30001
|
+
copy.suffix
|
|
30002
|
+
] })
|
|
30003
|
+
] }),
|
|
30004
|
+
/* @__PURE__ */ jsx264("div", { className: "flex w-full justify-end", children: /* @__PURE__ */ jsx264(Button, { variant: "outline", className: "w-1/2", onClick: onClose, children: "Close" }) })
|
|
30005
|
+
] });
|
|
30006
|
+
}
|
|
30007
|
+
function DialogCard({ children }) {
|
|
30008
|
+
return /* @__PURE__ */ jsx264("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 });
|
|
30009
|
+
}
|
|
30010
|
+
|
|
30011
|
+
// src/components/features/remote-session/remote-session-overlay.tsx
|
|
30012
|
+
import { jsx as jsx265, jsxs as jsxs212 } from "react/jsx-runtime";
|
|
30013
|
+
function RemoteSessionBorder({ className }) {
|
|
30014
|
+
return /* @__PURE__ */ jsx265("div", { className: cn("pointer-events-none size-full border-4 border-ods-warning", className) });
|
|
30015
|
+
}
|
|
30016
|
+
function RemoteSessionPill({ onEndSession }) {
|
|
30017
|
+
return /* @__PURE__ */ jsxs212(
|
|
30018
|
+
"button",
|
|
30019
|
+
{
|
|
30020
|
+
type: "button",
|
|
30021
|
+
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",
|
|
30022
|
+
onClick: onEndSession,
|
|
30023
|
+
children: [
|
|
30024
|
+
/* @__PURE__ */ jsx265(MonitorOffIcon, { size: 24, color: "currentColor" }),
|
|
30025
|
+
/* @__PURE__ */ jsx265("span", { className: "whitespace-nowrap text-h3", children: "End Session" })
|
|
30026
|
+
]
|
|
30027
|
+
}
|
|
30028
|
+
);
|
|
30029
|
+
}
|
|
30030
|
+
|
|
29468
30031
|
// src/components/features/board/board.tsx
|
|
29469
30032
|
import { combine as combine3 } from "@atlaskit/pragmatic-drag-and-drop/combine";
|
|
29470
30033
|
import { monitorForElements } from "@atlaskit/pragmatic-drag-and-drop/element/adapter";
|
|
29471
30034
|
import { preventUnhandled } from "@atlaskit/pragmatic-drag-and-drop/utils/prevent-unhandled";
|
|
29472
|
-
import { Fragment as Fragment46, useCallback as useCallback28, useEffect as
|
|
30035
|
+
import { Fragment as Fragment46, useCallback as useCallback28, useEffect as useEffect46, useMemo as useMemo23, useRef as useRef44, useState as useState79 } from "react";
|
|
29473
30036
|
import { createPortal } from "react-dom";
|
|
29474
30037
|
|
|
29475
30038
|
// src/utils/auto-scroll-ancestors.ts
|
|
@@ -29582,10 +30145,10 @@ function aimToChange(columns, ticketId, aim) {
|
|
|
29582
30145
|
// src/components/features/board/board-column.tsx
|
|
29583
30146
|
import { attachClosestEdge as attachClosestEdge2 } from "@atlaskit/pragmatic-drag-and-drop-hitbox/closest-edge";
|
|
29584
30147
|
import { dropTargetForElements as dropTargetForElements2 } from "@atlaskit/pragmatic-drag-and-drop/element/adapter";
|
|
29585
|
-
import { memo as memo6, useCallback as useCallback26, useEffect as
|
|
30148
|
+
import { memo as memo6, useCallback as useCallback26, useEffect as useEffect44, useRef as useRef42, useState as useState77 } from "react";
|
|
29586
30149
|
|
|
29587
30150
|
// src/components/features/board/board-column-header.tsx
|
|
29588
|
-
import { jsx as
|
|
30151
|
+
import { jsx as jsx266, jsxs as jsxs213 } from "react/jsx-runtime";
|
|
29589
30152
|
function BoardColumnHeader({
|
|
29590
30153
|
column,
|
|
29591
30154
|
collapsed = false,
|
|
@@ -29598,8 +30161,8 @@ function BoardColumnHeader({
|
|
|
29598
30161
|
const useStatusVariant = resolveTicketStatus(tagStatus) !== null;
|
|
29599
30162
|
const actionClass = "h-8 w-8 p-0 md:h-8 md:w-8";
|
|
29600
30163
|
if (collapsed) {
|
|
29601
|
-
return /* @__PURE__ */
|
|
29602
|
-
onToggleCollapse && /* @__PURE__ */
|
|
30164
|
+
return /* @__PURE__ */ jsxs213("div", { className: "flex h-full flex-col items-center gap-[var(--spacing-system-xsf)]", children: [
|
|
30165
|
+
onToggleCollapse && /* @__PURE__ */ jsx266(
|
|
29603
30166
|
Button,
|
|
29604
30167
|
{
|
|
29605
30168
|
variant: "transparent",
|
|
@@ -29607,10 +30170,10 @@ function BoardColumnHeader({
|
|
|
29607
30170
|
className: actionClass,
|
|
29608
30171
|
onClick: onToggleCollapse,
|
|
29609
30172
|
"aria-label": "Expand column",
|
|
29610
|
-
children: /* @__PURE__ */
|
|
30173
|
+
children: /* @__PURE__ */ jsx266(Arrow02RightIcon, { className: "h-6 w-6 text-ods-text-secondary" })
|
|
29611
30174
|
}
|
|
29612
30175
|
),
|
|
29613
|
-
/* @__PURE__ */
|
|
30176
|
+
/* @__PURE__ */ jsx266(
|
|
29614
30177
|
TicketStatusTag,
|
|
29615
30178
|
{
|
|
29616
30179
|
status: tagStatus,
|
|
@@ -29619,17 +30182,17 @@ function BoardColumnHeader({
|
|
|
29619
30182
|
className: "h-auto [writing-mode:vertical-rl]"
|
|
29620
30183
|
}
|
|
29621
30184
|
),
|
|
29622
|
-
/* @__PURE__ */
|
|
30185
|
+
/* @__PURE__ */ jsx266("span", { className: "text-h5", style: { color: column.color }, children: count })
|
|
29623
30186
|
] });
|
|
29624
30187
|
}
|
|
29625
|
-
return /* @__PURE__ */
|
|
29626
|
-
/* @__PURE__ */
|
|
29627
|
-
/* @__PURE__ */
|
|
29628
|
-
/* @__PURE__ */
|
|
30188
|
+
return /* @__PURE__ */ jsxs213("div", { className: "flex items-center gap-[var(--spacing-system-xsf)]", children: [
|
|
30189
|
+
/* @__PURE__ */ jsxs213("div", { className: "flex min-w-0 flex-1 items-center gap-[var(--spacing-system-xsf)]", children: [
|
|
30190
|
+
/* @__PURE__ */ jsx266(TicketStatusTag, { status: tagStatus, label: column.label, color: useStatusVariant ? void 0 : column.color }),
|
|
30191
|
+
/* @__PURE__ */ jsx266("span", { className: "text-h5", style: useStatusVariant ? void 0 : { color: column.color }, children: count })
|
|
29629
30192
|
] }),
|
|
29630
|
-
/* @__PURE__ */
|
|
29631
|
-
column.tooltip && /* @__PURE__ */
|
|
29632
|
-
onToggleCollapse && /* @__PURE__ */
|
|
30193
|
+
/* @__PURE__ */ jsxs213("div", { className: "flex shrink-0 items-center gap-[var(--spacing-system-xxs)]", children: [
|
|
30194
|
+
column.tooltip && /* @__PURE__ */ jsx266(TouchFriendlyTooltip, { content: column.tooltip, side: "bottom", children: /* @__PURE__ */ jsx266(Button, { variant: "transparent", size: "icon", className: actionClass, "aria-label": column.tooltip, children: /* @__PURE__ */ jsx266(InfoCircleIcon, { className: "h-6 w-6 text-ods-text-secondary" }) }) }),
|
|
30195
|
+
onToggleCollapse && /* @__PURE__ */ jsx266(
|
|
29633
30196
|
Button,
|
|
29634
30197
|
{
|
|
29635
30198
|
variant: "transparent",
|
|
@@ -29637,10 +30200,10 @@ function BoardColumnHeader({
|
|
|
29637
30200
|
className: actionClass,
|
|
29638
30201
|
onClick: onToggleCollapse,
|
|
29639
30202
|
"aria-label": "Collapse column",
|
|
29640
|
-
children: /* @__PURE__ */
|
|
30203
|
+
children: /* @__PURE__ */ jsx266(Arrow02LeftIcon, { className: "h-6 w-6 text-ods-text-secondary" })
|
|
29641
30204
|
}
|
|
29642
30205
|
),
|
|
29643
|
-
onArchive && /* @__PURE__ */
|
|
30206
|
+
onArchive && /* @__PURE__ */ jsx266(
|
|
29644
30207
|
Button,
|
|
29645
30208
|
{
|
|
29646
30209
|
variant: "transparent",
|
|
@@ -29648,10 +30211,10 @@ function BoardColumnHeader({
|
|
|
29648
30211
|
className: actionClass,
|
|
29649
30212
|
onClick: onArchive,
|
|
29650
30213
|
"aria-label": "Archive resolved tickets",
|
|
29651
|
-
children: /* @__PURE__ */
|
|
30214
|
+
children: /* @__PURE__ */ jsx266(BoxArchiveIcon, { className: "h-6 w-6 text-ods-text-secondary" })
|
|
29652
30215
|
}
|
|
29653
30216
|
),
|
|
29654
|
-
onAddTicket && /* @__PURE__ */
|
|
30217
|
+
onAddTicket && /* @__PURE__ */ jsx266(
|
|
29655
30218
|
Button,
|
|
29656
30219
|
{
|
|
29657
30220
|
variant: "transparent",
|
|
@@ -29659,7 +30222,7 @@ function BoardColumnHeader({
|
|
|
29659
30222
|
className: actionClass,
|
|
29660
30223
|
onClick: onAddTicket,
|
|
29661
30224
|
"aria-label": "Add ticket",
|
|
29662
|
-
children: /* @__PURE__ */
|
|
30225
|
+
children: /* @__PURE__ */ jsx266(PlusIcon, { className: "h-6 w-6 text-ods-text-secondary" })
|
|
29663
30226
|
}
|
|
29664
30227
|
)
|
|
29665
30228
|
] })
|
|
@@ -29694,7 +30257,7 @@ function isSameAim(a, b) {
|
|
|
29694
30257
|
}
|
|
29695
30258
|
|
|
29696
30259
|
// src/components/features/board/use-lane-scroll-anchor.ts
|
|
29697
|
-
import { useRef as
|
|
30260
|
+
import { useRef as useRef40 } from "react";
|
|
29698
30261
|
var TICKET_ID_ATTRIBUTE = "data-ticket-id";
|
|
29699
30262
|
function cardPositions(root) {
|
|
29700
30263
|
return Array.from(root.querySelectorAll(`[${TICKET_ID_ATTRIBUTE}]`)).map((element) => ({
|
|
@@ -29703,7 +30266,7 @@ function cardPositions(root) {
|
|
|
29703
30266
|
}));
|
|
29704
30267
|
}
|
|
29705
30268
|
function useLaneScrollAnchor(scrollRef, tickets) {
|
|
29706
|
-
const positionsRef =
|
|
30269
|
+
const positionsRef = useRef40([]);
|
|
29707
30270
|
useIsomorphicLayoutEffect(() => {
|
|
29708
30271
|
const root = scrollRef.current;
|
|
29709
30272
|
if (!root) return;
|
|
@@ -29755,10 +30318,10 @@ import { setCustomNativeDragPreview } from "@atlaskit/pragmatic-drag-and-drop/el
|
|
|
29755
30318
|
import {
|
|
29756
30319
|
memo as memo5,
|
|
29757
30320
|
useCallback as useCallback25,
|
|
29758
|
-
useEffect as
|
|
30321
|
+
useEffect as useEffect43,
|
|
29759
30322
|
useMemo as useMemo22,
|
|
29760
|
-
useRef as
|
|
29761
|
-
useState as
|
|
30323
|
+
useRef as useRef41,
|
|
30324
|
+
useState as useState76
|
|
29762
30325
|
} from "react";
|
|
29763
30326
|
|
|
29764
30327
|
// src/utils/drag-effect.ts
|
|
@@ -29772,14 +30335,14 @@ function holdMoveDragEffect(element) {
|
|
|
29772
30335
|
}
|
|
29773
30336
|
|
|
29774
30337
|
// src/components/features/board/board-ticket-approval.tsx
|
|
29775
|
-
import { useState as
|
|
29776
|
-
import { jsx as
|
|
30338
|
+
import { useState as useState75 } from "react";
|
|
30339
|
+
import { jsx as jsx267, jsxs as jsxs214 } from "react/jsx-runtime";
|
|
29777
30340
|
function BoardTicketApproval({ pendingApproval, onApprove, onReject }) {
|
|
29778
|
-
const [expanded, setExpanded] =
|
|
30341
|
+
const [expanded, setExpanded] = useState75(false);
|
|
29779
30342
|
const { innerRef, containerStyle } = useCollapsible({ expanded });
|
|
29780
30343
|
const isAdmin = pendingApproval.approvalType === "ADMIN";
|
|
29781
|
-
return /* @__PURE__ */
|
|
29782
|
-
/* @__PURE__ */
|
|
30344
|
+
return /* @__PURE__ */ jsxs214("div", { className: "pointer-events-auto flex flex-col", children: [
|
|
30345
|
+
/* @__PURE__ */ jsxs214(
|
|
29783
30346
|
"button",
|
|
29784
30347
|
{
|
|
29785
30348
|
type: "button",
|
|
@@ -29787,7 +30350,7 @@ function BoardTicketApproval({ pendingApproval, onApprove, onReject }) {
|
|
|
29787
30350
|
"aria-expanded": expanded,
|
|
29788
30351
|
className: "flex w-full cursor-pointer items-center gap-[var(--spacing-system-xxs)] text-h6",
|
|
29789
30352
|
children: [
|
|
29790
|
-
/* @__PURE__ */
|
|
30353
|
+
/* @__PURE__ */ jsxs214(
|
|
29791
30354
|
"span",
|
|
29792
30355
|
{
|
|
29793
30356
|
className: cn(
|
|
@@ -29795,16 +30358,16 @@ function BoardTicketApproval({ pendingApproval, onApprove, onReject }) {
|
|
|
29795
30358
|
isAdmin ? "text-ods-open-yellow" : "text-ods-text-secondary"
|
|
29796
30359
|
),
|
|
29797
30360
|
children: [
|
|
29798
|
-
isAdmin ? /* @__PURE__ */
|
|
29799
|
-
/* @__PURE__ */
|
|
30361
|
+
isAdmin ? /* @__PURE__ */ jsx267(ShieldCheckIcon, { className: "size-4 shrink-0" }) : /* @__PURE__ */ jsx267(DotsLoaderIcon, { size: 16, className: "shrink-0" }),
|
|
30362
|
+
/* @__PURE__ */ jsx267("span", { className: "flex-1 truncate text-left", children: isAdmin ? "Technician approval required" : "Pending client approval" })
|
|
29800
30363
|
]
|
|
29801
30364
|
}
|
|
29802
30365
|
),
|
|
29803
|
-
expanded ? /* @__PURE__ */
|
|
30366
|
+
expanded ? /* @__PURE__ */ jsx267(Chevron02UpIcon, { className: "size-4 shrink-0 text-ods-text-secondary" }) : /* @__PURE__ */ jsx267(Chevron02DownIcon, { className: "size-4 shrink-0 text-ods-text-secondary" })
|
|
29804
30367
|
]
|
|
29805
30368
|
}
|
|
29806
30369
|
),
|
|
29807
|
-
/* @__PURE__ */
|
|
30370
|
+
/* @__PURE__ */ jsx267("div", { style: containerStyle, children: /* @__PURE__ */ jsx267("div", { ref: innerRef, className: "pt-[var(--spacing-system-xs)]", children: /* @__PURE__ */ jsx267(
|
|
29808
30371
|
ApprovalBatchMessage,
|
|
29809
30372
|
{
|
|
29810
30373
|
className: "mb-0",
|
|
@@ -29857,7 +30420,7 @@ function hasMoveSettled(columns, move) {
|
|
|
29857
30420
|
}
|
|
29858
30421
|
|
|
29859
30422
|
// src/components/features/board/ticket-card.tsx
|
|
29860
|
-
import { Fragment as Fragment44, jsx as
|
|
30423
|
+
import { Fragment as Fragment44, jsx as jsx268, jsxs as jsxs215 } from "react/jsx-runtime";
|
|
29861
30424
|
var PRIORITY_COLOR_CLASS = {
|
|
29862
30425
|
low: "text-ods-text-secondary",
|
|
29863
30426
|
medium: "text-ods-info",
|
|
@@ -29889,24 +30452,24 @@ function TicketCardBody({
|
|
|
29889
30452
|
const showDeviceRow = !!(ticket.deviceHostnames?.length || ticket.organizationName);
|
|
29890
30453
|
const deviceText = [ticket.deviceHostnames?.join(", "), ticket.organizationName].filter(Boolean).join(", ");
|
|
29891
30454
|
const hasRightSection = !!(ticket.priority || ticket.assignees?.length || renderAssignSlot);
|
|
29892
|
-
const rightSection = hasRightSection ? /* @__PURE__ */
|
|
29893
|
-
ticket.priority && /* @__PURE__ */
|
|
30455
|
+
const rightSection = hasRightSection ? /* @__PURE__ */ jsxs215("div", { className: "pointer-events-auto flex shrink-0 items-center gap-[var(--spacing-system-xsf)]", children: [
|
|
30456
|
+
ticket.priority && /* @__PURE__ */ jsx268(
|
|
29894
30457
|
Flag02Icon,
|
|
29895
30458
|
{
|
|
29896
30459
|
className: cn("size-4", PRIORITY_COLOR_CLASS[ticket.priority]),
|
|
29897
30460
|
"aria-label": `Priority: ${ticket.priority}`
|
|
29898
30461
|
}
|
|
29899
30462
|
),
|
|
29900
|
-
renderAssignSlot ? renderAssignSlot(ticket) : ticket.assignees?.length ? /* @__PURE__ */
|
|
30463
|
+
renderAssignSlot ? renderAssignSlot(ticket) : ticket.assignees?.length ? /* @__PURE__ */ jsxs215("div", { className: "flex -space-x-2", children: [
|
|
29901
30464
|
ticket.assignees.slice(0, MAX_VISIBLE_ASSIGNEES).map(
|
|
29902
|
-
(a) => a.deleted ? /* @__PURE__ */
|
|
30465
|
+
(a) => a.deleted ? /* @__PURE__ */ jsx268(
|
|
29903
30466
|
DeletedUserAvatar,
|
|
29904
30467
|
{
|
|
29905
30468
|
size: "sm",
|
|
29906
30469
|
accessibleLabel: `Deleted user: ${a.name ?? a.initials ?? a.id}`
|
|
29907
30470
|
},
|
|
29908
30471
|
a.id
|
|
29909
|
-
) : /* @__PURE__ */
|
|
30472
|
+
) : /* @__PURE__ */ jsx268(
|
|
29910
30473
|
SquareAvatar,
|
|
29911
30474
|
{
|
|
29912
30475
|
src: a.avatarUrl,
|
|
@@ -29918,7 +30481,7 @@ function TicketCardBody({
|
|
|
29918
30481
|
a.id
|
|
29919
30482
|
)
|
|
29920
30483
|
),
|
|
29921
|
-
ticket.assignees.length > MAX_VISIBLE_ASSIGNEES && /* @__PURE__ */
|
|
30484
|
+
ticket.assignees.length > MAX_VISIBLE_ASSIGNEES && /* @__PURE__ */ jsxs215("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: [
|
|
29922
30485
|
"+",
|
|
29923
30486
|
ticket.assignees.length - MAX_VISIBLE_ASSIGNEES
|
|
29924
30487
|
] })
|
|
@@ -29928,7 +30491,7 @@ function TicketCardBody({
|
|
|
29928
30491
|
const tooltipLabel = ticket.createdAt ? formatTicketFullTimestamp(ticket.createdAt) : null;
|
|
29929
30492
|
const metaLabel = [ticket.ticketNumber || null, timestampLabel].filter(Boolean).join(" \u2022 ");
|
|
29930
30493
|
const metaClass = "truncate text-ods-text-secondary text-h6";
|
|
29931
|
-
const meta = href ? /* @__PURE__ */
|
|
30494
|
+
const meta = href ? /* @__PURE__ */ jsx268(
|
|
29932
30495
|
next_link_default,
|
|
29933
30496
|
{
|
|
29934
30497
|
href,
|
|
@@ -29939,28 +30502,28 @@ function TicketCardBody({
|
|
|
29939
30502
|
className: cn("pointer-events-auto block", metaClass),
|
|
29940
30503
|
children: metaLabel
|
|
29941
30504
|
}
|
|
29942
|
-
) : /* @__PURE__ */
|
|
29943
|
-
return /* @__PURE__ */
|
|
29944
|
-
/* @__PURE__ */
|
|
29945
|
-
/* @__PURE__ */
|
|
29946
|
-
/* @__PURE__ */
|
|
29947
|
-
showDeviceRow && /* @__PURE__ */
|
|
29948
|
-
/* @__PURE__ */
|
|
29949
|
-
/* @__PURE__ */
|
|
30505
|
+
) : /* @__PURE__ */ jsx268("p", { className: cn(tooltipLabel && "pointer-events-auto", metaClass), children: metaLabel });
|
|
30506
|
+
return /* @__PURE__ */ jsxs215(Fragment44, { children: [
|
|
30507
|
+
/* @__PURE__ */ jsxs215("div", { className: "flex items-start gap-[var(--spacing-system-sf)]", children: [
|
|
30508
|
+
/* @__PURE__ */ jsxs215("div", { className: "flex min-w-0 flex-1 flex-col gap-[var(--spacing-system-zero)]", title: ticket.title, children: [
|
|
30509
|
+
/* @__PURE__ */ jsx268("p", { className: "truncate text-ods-text-primary text-h3", children: ticket.title }),
|
|
30510
|
+
showDeviceRow && /* @__PURE__ */ jsxs215("div", { className: "flex min-w-0 items-center gap-[var(--spacing-system-xxs)] text-ods-text-secondary text-h6", children: [
|
|
30511
|
+
/* @__PURE__ */ jsx268(LaptopIcon, { className: "size-4 shrink-0" }),
|
|
30512
|
+
/* @__PURE__ */ jsx268("span", { className: "truncate", title: deviceText, children: deviceText })
|
|
29950
30513
|
] })
|
|
29951
30514
|
] }),
|
|
29952
30515
|
rightSection
|
|
29953
30516
|
] }),
|
|
29954
|
-
ticket.tags?.length ? /* @__PURE__ */
|
|
29955
|
-
metaLabel && (tooltipLabel ? /* @__PURE__ */
|
|
29956
|
-
/* @__PURE__ */
|
|
29957
|
-
/* @__PURE__ */
|
|
30517
|
+
ticket.tags?.length ? /* @__PURE__ */ jsx268(TicketTagRow, { tags: ticket.tags }) : null,
|
|
30518
|
+
metaLabel && (tooltipLabel ? /* @__PURE__ */ jsx268(TooltipProvider, { children: /* @__PURE__ */ jsxs215(Tooltip, { children: [
|
|
30519
|
+
/* @__PURE__ */ jsx268(TooltipTrigger, { asChild: true, children: meta }),
|
|
30520
|
+
/* @__PURE__ */ jsx268(TooltipContent, { children: tooltipLabel })
|
|
29958
30521
|
] }) }) : meta),
|
|
29959
|
-
ticket.escalatedByUser && /* @__PURE__ */
|
|
29960
|
-
/* @__PURE__ */
|
|
29961
|
-
/* @__PURE__ */
|
|
30522
|
+
ticket.escalatedByUser && /* @__PURE__ */ jsxs215("div", { className: "flex items-center gap-[var(--spacing-system-xxs)] text-ods-open-yellow text-h6", children: [
|
|
30523
|
+
/* @__PURE__ */ jsx268(UserCheckIcon, { className: "size-4 shrink-0" }),
|
|
30524
|
+
/* @__PURE__ */ jsx268("span", { className: "truncate", children: "Escalated by User" })
|
|
29962
30525
|
] }),
|
|
29963
|
-
ticket.activity && /* @__PURE__ */
|
|
30526
|
+
ticket.activity && /* @__PURE__ */ jsxs215(
|
|
29964
30527
|
"div",
|
|
29965
30528
|
{
|
|
29966
30529
|
className: cn(
|
|
@@ -29968,32 +30531,32 @@ function TicketCardBody({
|
|
|
29968
30531
|
ticket.activity.kind === "stale" ? "text-ods-open-yellow" : "text-ods-text-secondary"
|
|
29969
30532
|
),
|
|
29970
30533
|
children: [
|
|
29971
|
-
ticket.activity.kind === "stale" ? /* @__PURE__ */
|
|
29972
|
-
/* @__PURE__ */
|
|
30534
|
+
ticket.activity.kind === "stale" ? /* @__PURE__ */ jsx268(ClockIcon, { className: "size-4 shrink-0" }) : /* @__PURE__ */ jsx268(DotsLoaderIcon, { className: "size-4 shrink-0" }),
|
|
30535
|
+
/* @__PURE__ */ jsx268("span", { className: "truncate", children: ticket.activity.label ?? ACTIVITY_DEFAULT_LABEL[ticket.activity.kind] })
|
|
29973
30536
|
]
|
|
29974
30537
|
}
|
|
29975
30538
|
),
|
|
29976
|
-
showNewMessage && /* @__PURE__ */
|
|
30539
|
+
showNewMessage && /* @__PURE__ */ jsx268(
|
|
29977
30540
|
Tag,
|
|
29978
30541
|
{
|
|
29979
30542
|
label: "New Message",
|
|
29980
|
-
icon: /* @__PURE__ */
|
|
30543
|
+
icon: /* @__PURE__ */ jsx268(MessagesIcon, { size: 16, color: newMessageTextColor }),
|
|
29981
30544
|
className: "w-fit shrink-0",
|
|
29982
30545
|
style: { backgroundColor: columnColor, color: newMessageTextColor }
|
|
29983
30546
|
}
|
|
29984
30547
|
),
|
|
29985
|
-
ticket.pendingApproval && /* @__PURE__ */
|
|
30548
|
+
ticket.pendingApproval && /* @__PURE__ */ jsx268(BoardTicketApproval, { pendingApproval: ticket.pendingApproval, onApprove, onReject })
|
|
29986
30549
|
] });
|
|
29987
30550
|
}
|
|
29988
30551
|
function TicketCardView({ className, style, ...bodyProps }) {
|
|
29989
30552
|
const { ticket, columnColor } = bodyProps;
|
|
29990
30553
|
const showNewMessage = !!ticket.hasNewMessage && !!columnColor;
|
|
29991
|
-
return /* @__PURE__ */
|
|
30554
|
+
return /* @__PURE__ */ jsx268(
|
|
29992
30555
|
"div",
|
|
29993
30556
|
{
|
|
29994
30557
|
className: cn(TICKET_CARD_SHELL, className),
|
|
29995
30558
|
style: showNewMessage ? { borderColor: columnColor, ...style } : style,
|
|
29996
|
-
children: /* @__PURE__ */
|
|
30559
|
+
children: /* @__PURE__ */ jsx268("div", { className: "relative z-10 flex flex-col gap-[var(--spacing-system-sf)]", children: /* @__PURE__ */ jsx268(TicketCardBody, { ...bodyProps }) })
|
|
29997
30560
|
}
|
|
29998
30561
|
);
|
|
29999
30562
|
}
|
|
@@ -30009,12 +30572,12 @@ var TicketCard = memo5(function TicketCardImpl({
|
|
|
30009
30572
|
onApprove,
|
|
30010
30573
|
onReject
|
|
30011
30574
|
}) {
|
|
30012
|
-
const ref =
|
|
30013
|
-
const ticketRef =
|
|
30014
|
-
|
|
30575
|
+
const ref = useRef41(null);
|
|
30576
|
+
const ticketRef = useRef41(ticket);
|
|
30577
|
+
useEffect43(() => {
|
|
30015
30578
|
ticketRef.current = ticket;
|
|
30016
30579
|
});
|
|
30017
|
-
const [isDragging, setIsDragging] =
|
|
30580
|
+
const [isDragging, setIsDragging] = useState76(false);
|
|
30018
30581
|
const isLanding = useIsLanding(ticket.id);
|
|
30019
30582
|
const aim = useDropAim();
|
|
30020
30583
|
const closestEdge = aim && aim.columnId === columnId && aim.ticketId === ticket.id ? aim.edge : null;
|
|
@@ -30026,7 +30589,7 @@ var TicketCard = memo5(function TicketCardImpl({
|
|
|
30026
30589
|
lift(ticket.id);
|
|
30027
30590
|
};
|
|
30028
30591
|
const keyShortcuts = dragDisabled || !lift ? void 0 : "Space";
|
|
30029
|
-
|
|
30592
|
+
useEffect43(() => {
|
|
30030
30593
|
const element = ref.current;
|
|
30031
30594
|
if (!element || dragDisabled) return void 0;
|
|
30032
30595
|
const identity = { type: "ticket", ticketId: ticket.id, columnId };
|
|
@@ -30108,7 +30671,7 @@ var TicketCard = memo5(function TicketCardImpl({
|
|
|
30108
30671
|
[isDragging]
|
|
30109
30672
|
);
|
|
30110
30673
|
const body = useMemo22(
|
|
30111
|
-
() => /* @__PURE__ */
|
|
30674
|
+
() => /* @__PURE__ */ jsx268(
|
|
30112
30675
|
TicketCardBody,
|
|
30113
30676
|
{
|
|
30114
30677
|
ticket,
|
|
@@ -30137,7 +30700,7 @@ var TicketCard = memo5(function TicketCardImpl({
|
|
|
30137
30700
|
} else if (isLanding) {
|
|
30138
30701
|
style.visibility = "hidden";
|
|
30139
30702
|
}
|
|
30140
|
-
const insertionLine = closestEdge ? /* @__PURE__ */
|
|
30703
|
+
const insertionLine = closestEdge ? /* @__PURE__ */ jsx268(
|
|
30141
30704
|
"span",
|
|
30142
30705
|
{
|
|
30143
30706
|
"aria-hidden": true,
|
|
@@ -30156,9 +30719,9 @@ var TicketCard = memo5(function TicketCardImpl({
|
|
|
30156
30719
|
}
|
|
30157
30720
|
) : null;
|
|
30158
30721
|
if (href) {
|
|
30159
|
-
return /* @__PURE__ */
|
|
30722
|
+
return /* @__PURE__ */ jsxs215("div", { ...outerProps, children: [
|
|
30160
30723
|
insertionLine,
|
|
30161
|
-
/* @__PURE__ */
|
|
30724
|
+
/* @__PURE__ */ jsx268(
|
|
30162
30725
|
next_link_default,
|
|
30163
30726
|
{
|
|
30164
30727
|
href,
|
|
@@ -30171,12 +30734,12 @@ var TicketCard = memo5(function TicketCardImpl({
|
|
|
30171
30734
|
className: "absolute inset-0 z-0 rounded-md focus-visible:outline-none"
|
|
30172
30735
|
}
|
|
30173
30736
|
),
|
|
30174
|
-
/* @__PURE__ */
|
|
30737
|
+
/* @__PURE__ */ jsx268("div", { className: cn("pointer-events-none", innerWrapperClass), children: body })
|
|
30175
30738
|
] });
|
|
30176
30739
|
}
|
|
30177
|
-
return /* @__PURE__ */
|
|
30740
|
+
return /* @__PURE__ */ jsxs215("div", { ...outerProps, children: [
|
|
30178
30741
|
insertionLine,
|
|
30179
|
-
/* @__PURE__ */
|
|
30742
|
+
/* @__PURE__ */ jsx268(
|
|
30180
30743
|
"button",
|
|
30181
30744
|
{
|
|
30182
30745
|
type: "button",
|
|
@@ -30187,23 +30750,23 @@ var TicketCard = memo5(function TicketCardImpl({
|
|
|
30187
30750
|
className: "absolute inset-0 z-0 cursor-pointer rounded-md focus-visible:outline-none"
|
|
30188
30751
|
}
|
|
30189
30752
|
),
|
|
30190
|
-
/* @__PURE__ */
|
|
30753
|
+
/* @__PURE__ */ jsx268("div", { className: cn("pointer-events-none", innerWrapperClass), children: body })
|
|
30191
30754
|
] });
|
|
30192
30755
|
});
|
|
30193
30756
|
function TicketTagRow({ tags }) {
|
|
30194
30757
|
const visible = tags.slice(0, MAX_VISIBLE_TAGS);
|
|
30195
30758
|
const hidden = tags.length - visible.length;
|
|
30196
|
-
return /* @__PURE__ */
|
|
30197
|
-
visible.map((tag) => /* @__PURE__ */
|
|
30198
|
-
hidden > 0 && /* @__PURE__ */
|
|
30759
|
+
return /* @__PURE__ */ jsxs215("div", { className: "flex h-8 flex-wrap items-start gap-[var(--spacing-system-xxs)] overflow-clip", children: [
|
|
30760
|
+
visible.map((tag) => /* @__PURE__ */ jsx268(Tag, { variant: "outline", label: tag }, tag)),
|
|
30761
|
+
hidden > 0 && /* @__PURE__ */ jsx268(Tag, { variant: "outline", label: `+${hidden}` })
|
|
30199
30762
|
] });
|
|
30200
30763
|
}
|
|
30201
30764
|
|
|
30202
30765
|
// src/components/features/board/ticket-card-skeleton.tsx
|
|
30203
|
-
import { forwardRef as
|
|
30204
|
-
import { jsx as
|
|
30205
|
-
var TicketCardSkeleton =
|
|
30206
|
-
({ className, ...props }, ref) => /* @__PURE__ */
|
|
30766
|
+
import { forwardRef as forwardRef32 } from "react";
|
|
30767
|
+
import { jsx as jsx269, jsxs as jsxs216 } from "react/jsx-runtime";
|
|
30768
|
+
var TicketCardSkeleton = forwardRef32(
|
|
30769
|
+
({ className, ...props }, ref) => /* @__PURE__ */ jsxs216(
|
|
30207
30770
|
"div",
|
|
30208
30771
|
{
|
|
30209
30772
|
ref,
|
|
@@ -30213,22 +30776,22 @@ var TicketCardSkeleton = forwardRef31(
|
|
|
30213
30776
|
),
|
|
30214
30777
|
...props,
|
|
30215
30778
|
children: [
|
|
30216
|
-
/* @__PURE__ */
|
|
30217
|
-
/* @__PURE__ */
|
|
30218
|
-
/* @__PURE__ */
|
|
30219
|
-
/* @__PURE__ */
|
|
30220
|
-
/* @__PURE__ */
|
|
30221
|
-
/* @__PURE__ */
|
|
30779
|
+
/* @__PURE__ */ jsxs216("div", { className: "flex items-start gap-[var(--spacing-system-sf)]", children: [
|
|
30780
|
+
/* @__PURE__ */ jsxs216("div", { className: "flex min-w-0 flex-1 flex-col gap-[var(--spacing-system-xxs)]", children: [
|
|
30781
|
+
/* @__PURE__ */ jsx269("div", { className: "flex items-center text-h3", children: /* @__PURE__ */ jsx269(Skeleton, { className: "h-4 w-3/4" }) }),
|
|
30782
|
+
/* @__PURE__ */ jsxs216("div", { className: "flex items-center gap-[var(--spacing-system-xxs)] text-h6", children: [
|
|
30783
|
+
/* @__PURE__ */ jsx269(Skeleton, { className: "size-4 shrink-0 rounded-sm" }),
|
|
30784
|
+
/* @__PURE__ */ jsx269(Skeleton, { className: "h-3 w-1/2" })
|
|
30222
30785
|
] })
|
|
30223
30786
|
] }),
|
|
30224
|
-
/* @__PURE__ */
|
|
30225
|
-
/* @__PURE__ */
|
|
30226
|
-
/* @__PURE__ */
|
|
30787
|
+
/* @__PURE__ */ jsxs216("div", { className: "flex shrink-0 items-center gap-[var(--spacing-system-xsf)]", children: [
|
|
30788
|
+
/* @__PURE__ */ jsx269(Skeleton, { className: "size-4 rounded-sm" }),
|
|
30789
|
+
/* @__PURE__ */ jsx269(Skeleton, { className: "size-8 rounded-full" })
|
|
30227
30790
|
] })
|
|
30228
30791
|
] }),
|
|
30229
|
-
/* @__PURE__ */
|
|
30230
|
-
/* @__PURE__ */
|
|
30231
|
-
/* @__PURE__ */
|
|
30792
|
+
/* @__PURE__ */ jsxs216("div", { className: "flex h-8 items-center gap-[var(--spacing-system-xxs)]", children: [
|
|
30793
|
+
/* @__PURE__ */ jsx269(Skeleton, { className: "h-8 w-16 rounded-md" }),
|
|
30794
|
+
/* @__PURE__ */ jsx269(Skeleton, { className: "h-8 w-12 rounded-md" })
|
|
30232
30795
|
] })
|
|
30233
30796
|
]
|
|
30234
30797
|
}
|
|
@@ -30237,7 +30800,7 @@ var TicketCardSkeleton = forwardRef31(
|
|
|
30237
30800
|
TicketCardSkeleton.displayName = "TicketCardSkeleton";
|
|
30238
30801
|
|
|
30239
30802
|
// src/components/features/board/board-column.tsx
|
|
30240
|
-
import { Fragment as Fragment45, jsx as
|
|
30803
|
+
import { Fragment as Fragment45, jsx as jsx270, jsxs as jsxs217 } from "react/jsx-runtime";
|
|
30241
30804
|
var BoardColumn = memo6(function BoardColumnImpl({
|
|
30242
30805
|
column,
|
|
30243
30806
|
collapsed = false,
|
|
@@ -30255,9 +30818,9 @@ var BoardColumn = memo6(function BoardColumnImpl({
|
|
|
30255
30818
|
touchMode = false,
|
|
30256
30819
|
className
|
|
30257
30820
|
}) {
|
|
30258
|
-
const laneRef =
|
|
30259
|
-
const [isOver, setIsOver] =
|
|
30260
|
-
|
|
30821
|
+
const laneRef = useRef42(null);
|
|
30822
|
+
const [isOver, setIsOver] = useState77(false);
|
|
30823
|
+
useEffect44(() => {
|
|
30261
30824
|
const element = laneRef.current;
|
|
30262
30825
|
if (!element || collapsed || touchMode || column.dropDisabled) return void 0;
|
|
30263
30826
|
return dropTargetForElements2({
|
|
@@ -30289,7 +30852,7 @@ var BoardColumn = memo6(function BoardColumnImpl({
|
|
|
30289
30852
|
});
|
|
30290
30853
|
}, [column.id, column.dropDisabled, column.allowedFromColumns, collapsed, touchMode]);
|
|
30291
30854
|
const handleToggleCollapse = useCallback26(() => onToggleCollapse?.(column.id), [onToggleCollapse, column.id]);
|
|
30292
|
-
return /* @__PURE__ */
|
|
30855
|
+
return /* @__PURE__ */ jsxs217(
|
|
30293
30856
|
"div",
|
|
30294
30857
|
{
|
|
30295
30858
|
ref: laneRef,
|
|
@@ -30305,7 +30868,7 @@ var BoardColumn = memo6(function BoardColumnImpl({
|
|
|
30305
30868
|
),
|
|
30306
30869
|
style: column.system ? void 0 : { backgroundColor: tintOnDark(column.color) },
|
|
30307
30870
|
children: [
|
|
30308
|
-
/* @__PURE__ */
|
|
30871
|
+
/* @__PURE__ */ jsx270(
|
|
30309
30872
|
BoardColumnHeader,
|
|
30310
30873
|
{
|
|
30311
30874
|
column,
|
|
@@ -30315,9 +30878,9 @@ var BoardColumn = memo6(function BoardColumnImpl({
|
|
|
30315
30878
|
onArchive: !collapsed && column.archivable && onArchive ? () => onArchive(column.id) : void 0
|
|
30316
30879
|
}
|
|
30317
30880
|
),
|
|
30318
|
-
!collapsed && /* @__PURE__ */
|
|
30319
|
-
/* @__PURE__ */
|
|
30320
|
-
/* @__PURE__ */
|
|
30881
|
+
!collapsed && /* @__PURE__ */ jsxs217(Fragment45, { children: [
|
|
30882
|
+
/* @__PURE__ */ jsx270("div", { "aria-hidden": true, className: "-mx-[var(--spacing-system-sf)] h-px shrink-0 bg-ods-border" }),
|
|
30883
|
+
/* @__PURE__ */ jsx270(
|
|
30321
30884
|
ColumnBody,
|
|
30322
30885
|
{
|
|
30323
30886
|
column,
|
|
@@ -30345,21 +30908,21 @@ function ColumnBody({
|
|
|
30345
30908
|
loadMoreRootMargin,
|
|
30346
30909
|
touchMode
|
|
30347
30910
|
}) {
|
|
30348
|
-
const scrollRef =
|
|
30349
|
-
const sentinelRef =
|
|
30911
|
+
const scrollRef = useRef42(null);
|
|
30912
|
+
const sentinelRef = useRef42(null);
|
|
30350
30913
|
useLaneScrollAnchor(scrollRef, column.tickets);
|
|
30351
|
-
|
|
30914
|
+
useEffect44(() => {
|
|
30352
30915
|
const element = scrollRef.current;
|
|
30353
30916
|
if (!element || touchMode) return void 0;
|
|
30354
30917
|
return autoScrollColumn(element);
|
|
30355
30918
|
}, [touchMode]);
|
|
30356
|
-
const loadMoreRef =
|
|
30357
|
-
const columnIdRef =
|
|
30358
|
-
|
|
30919
|
+
const loadMoreRef = useRef42(onLoadMore);
|
|
30920
|
+
const columnIdRef = useRef42(column.id);
|
|
30921
|
+
useEffect44(() => {
|
|
30359
30922
|
loadMoreRef.current = onLoadMore;
|
|
30360
30923
|
columnIdRef.current = column.id;
|
|
30361
30924
|
});
|
|
30362
|
-
|
|
30925
|
+
useEffect44(() => {
|
|
30363
30926
|
if (!column.hasMore || column.isLoadingMore) return void 0;
|
|
30364
30927
|
const sentinel = sentinelRef.current;
|
|
30365
30928
|
const root = scrollRef.current;
|
|
@@ -30380,13 +30943,13 @@ function ColumnBody({
|
|
|
30380
30943
|
// wholesale. The browser's own anchoring is unusable here — it silently
|
|
30381
30944
|
// skips transformed elements, so it works between drags and does nothing
|
|
30382
30945
|
// during one — and leaving both on double-corrects every insertion.
|
|
30383
|
-
/* @__PURE__ */
|
|
30946
|
+
/* @__PURE__ */ jsxs217(
|
|
30384
30947
|
"div",
|
|
30385
30948
|
{
|
|
30386
30949
|
ref: scrollRef,
|
|
30387
30950
|
className: "flex min-h-0 flex-1 flex-col gap-[var(--spacing-system-xs)] overflow-y-auto py-[5px] [overflow-anchor:none]",
|
|
30388
30951
|
children: [
|
|
30389
|
-
column.isLoading ? /* @__PURE__ */
|
|
30952
|
+
column.isLoading ? /* @__PURE__ */ jsx270(SkeletonStack, {}) : column.tickets.length === 0 ? /* @__PURE__ */ jsx270(EmptyState2, { columnId: column.id, touchMode }) : column.tickets.map((t) => /* @__PURE__ */ jsx270(
|
|
30390
30953
|
TicketCard,
|
|
30391
30954
|
{
|
|
30392
30955
|
ticket: t,
|
|
@@ -30402,26 +30965,26 @@ function ColumnBody({
|
|
|
30402
30965
|
},
|
|
30403
30966
|
t.id
|
|
30404
30967
|
)),
|
|
30405
|
-
column.isLoadingMore && !column.isLoading && /* @__PURE__ */
|
|
30406
|
-
column.hasMore && /* @__PURE__ */
|
|
30968
|
+
column.isLoadingMore && !column.isLoading && /* @__PURE__ */ jsx270(TicketCardSkeleton, {}),
|
|
30969
|
+
column.hasMore && /* @__PURE__ */ jsx270("div", { ref: sentinelRef, "aria-hidden": true, className: "h-1 shrink-0" })
|
|
30407
30970
|
]
|
|
30408
30971
|
}
|
|
30409
30972
|
)
|
|
30410
30973
|
);
|
|
30411
30974
|
}
|
|
30412
30975
|
function SkeletonStack({ count = 4 }) {
|
|
30413
|
-
return /* @__PURE__ */
|
|
30976
|
+
return /* @__PURE__ */ jsx270(Fragment45, { children: Array.from({ length: count }, (_, i) => /* @__PURE__ */ jsx270(TicketCardSkeleton, {}, `skeleton-${i}`)) });
|
|
30414
30977
|
}
|
|
30415
30978
|
function EmptyState2({ columnId, touchMode }) {
|
|
30416
30979
|
const aim = useDropAim();
|
|
30417
30980
|
if (aim && aim.columnId === columnId) {
|
|
30418
|
-
return /* @__PURE__ */
|
|
30981
|
+
return /* @__PURE__ */ jsx270("div", { "aria-hidden": true, ...{ [DROP_LINE_ATTRIBUTE]: "" }, className: "h-0.5 shrink-0 rounded-full bg-ods-accent" });
|
|
30419
30982
|
}
|
|
30420
|
-
return /* @__PURE__ */
|
|
30421
|
-
/* @__PURE__ */
|
|
30422
|
-
/* @__PURE__ */
|
|
30423
|
-
/* @__PURE__ */
|
|
30424
|
-
/* @__PURE__ */
|
|
30983
|
+
return /* @__PURE__ */ jsxs217("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: [
|
|
30984
|
+
/* @__PURE__ */ jsx270(TagIcon, { className: "h-6 w-6 shrink-0" }),
|
|
30985
|
+
/* @__PURE__ */ jsxs217("div", { className: "flex w-full flex-col", children: [
|
|
30986
|
+
/* @__PURE__ */ jsx270("p", { className: "text-h4", children: "No tickets here" }),
|
|
30987
|
+
/* @__PURE__ */ jsx270("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" })
|
|
30425
30988
|
] })
|
|
30426
30989
|
] });
|
|
30427
30990
|
}
|
|
@@ -30435,14 +30998,14 @@ function resolveBoardDrop(columns, { source, target }) {
|
|
|
30435
30998
|
}
|
|
30436
30999
|
|
|
30437
31000
|
// src/components/features/board/use-board-collapse.ts
|
|
30438
|
-
import { useCallback as useCallback27, useEffect as
|
|
31001
|
+
import { useCallback as useCallback27, useEffect as useEffect45, useRef as useRef43, useState as useState78 } from "react";
|
|
30439
31002
|
function useBoardCollapse(storageKey) {
|
|
30440
31003
|
const [persisted, setPersisted] = useLocalStorage(storageKey ?? "__board_collapse_unused__", {});
|
|
30441
|
-
const [memory, setMemory] =
|
|
31004
|
+
const [memory, setMemory] = useState78({});
|
|
30442
31005
|
const collapsed = storageKey ? persisted : memory;
|
|
30443
31006
|
const setMap = storageKey ? setPersisted : setMemory;
|
|
30444
|
-
const setMapRef =
|
|
30445
|
-
|
|
31007
|
+
const setMapRef = useRef43(setMap);
|
|
31008
|
+
useEffect45(() => {
|
|
30446
31009
|
setMapRef.current = setMap;
|
|
30447
31010
|
});
|
|
30448
31011
|
const toggle = useCallback27((columnId) => {
|
|
@@ -30455,7 +31018,7 @@ function useBoardCollapse(storageKey) {
|
|
|
30455
31018
|
}
|
|
30456
31019
|
|
|
30457
31020
|
// src/components/features/board/touch-board.tsx
|
|
30458
|
-
import { jsx as
|
|
31021
|
+
import { jsx as jsx271 } from "react/jsx-runtime";
|
|
30459
31022
|
function TouchBoard({
|
|
30460
31023
|
columns,
|
|
30461
31024
|
onLoadMore,
|
|
@@ -30470,11 +31033,11 @@ function TouchBoard({
|
|
|
30470
31033
|
className
|
|
30471
31034
|
}) {
|
|
30472
31035
|
const { collapsed, toggle } = useBoardCollapse(collapseStorageKey);
|
|
30473
|
-
return /* @__PURE__ */
|
|
31036
|
+
return /* @__PURE__ */ jsx271("div", { className: cn("flex h-full min-h-0 flex-col", className), children: /* @__PURE__ */ jsx271(
|
|
30474
31037
|
"div",
|
|
30475
31038
|
{
|
|
30476
31039
|
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",
|
|
30477
|
-
children: columns.map((column) => /* @__PURE__ */
|
|
31040
|
+
children: columns.map((column) => /* @__PURE__ */ jsx271(
|
|
30478
31041
|
BoardColumn,
|
|
30479
31042
|
{
|
|
30480
31043
|
column,
|
|
@@ -30501,7 +31064,7 @@ function TouchBoard({
|
|
|
30501
31064
|
}
|
|
30502
31065
|
|
|
30503
31066
|
// src/components/features/board/board.tsx
|
|
30504
|
-
import { jsx as
|
|
31067
|
+
import { jsx as jsx272, jsxs as jsxs218 } from "react/jsx-runtime";
|
|
30505
31068
|
var PENDING_MOVE_TIMEOUT_MS = 2e3;
|
|
30506
31069
|
var DROP_MS = 160;
|
|
30507
31070
|
var DROP_EASING = "cubic-bezier(0.2, 0, 0, 1)";
|
|
@@ -30510,9 +31073,9 @@ var ARROW_KEYS = ["ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight"];
|
|
|
30510
31073
|
function Board(props) {
|
|
30511
31074
|
const dragAndDropEnabled = useMediaQuery(DRAG_AND_DROP_MEDIA_QUERY);
|
|
30512
31075
|
if (dragAndDropEnabled === void 0) {
|
|
30513
|
-
return /* @__PURE__ */
|
|
31076
|
+
return /* @__PURE__ */ jsx272("div", { "aria-hidden": true, className: cn("flex h-full min-h-0 flex-col", props.className) });
|
|
30514
31077
|
}
|
|
30515
|
-
return dragAndDropEnabled ? /* @__PURE__ */
|
|
31078
|
+
return dragAndDropEnabled ? /* @__PURE__ */ jsx272(DragBoard, { ...props }) : /* @__PURE__ */ jsx272(TouchBoard, { ...props });
|
|
30516
31079
|
}
|
|
30517
31080
|
function DragBoard({
|
|
30518
31081
|
columns,
|
|
@@ -30542,10 +31105,10 @@ function DragBoard({
|
|
|
30542
31105
|
onThumbPointerUp,
|
|
30543
31106
|
onThumbPointerCancel
|
|
30544
31107
|
} = useHorizontalScrollbar();
|
|
30545
|
-
const columnsRef =
|
|
30546
|
-
const onChangeRef =
|
|
30547
|
-
const boardRef =
|
|
30548
|
-
const scrollerRef =
|
|
31108
|
+
const columnsRef = useRef44(columns);
|
|
31109
|
+
const onChangeRef = useRef44(onChange);
|
|
31110
|
+
const boardRef = useRef44(null);
|
|
31111
|
+
const scrollerRef = useRef44(null);
|
|
30549
31112
|
const setScroller = useCallback28(
|
|
30550
31113
|
(node) => {
|
|
30551
31114
|
scrollerRef.current = node;
|
|
@@ -30553,22 +31116,22 @@ function DragBoard({
|
|
|
30553
31116
|
},
|
|
30554
31117
|
[scrollRef]
|
|
30555
31118
|
);
|
|
30556
|
-
const [aim, setAim] =
|
|
30557
|
-
const [lifted, setLifted] =
|
|
30558
|
-
const [announcement, setAnnouncement] =
|
|
30559
|
-
const dragGeometry =
|
|
30560
|
-
const [landingPreview, setLandingPreview] =
|
|
30561
|
-
const previewRef =
|
|
30562
|
-
const [reportedMove, setPendingMove] =
|
|
31119
|
+
const [aim, setAim] = useState79(null);
|
|
31120
|
+
const [lifted, setLifted] = useState79(null);
|
|
31121
|
+
const [announcement, setAnnouncement] = useState79("");
|
|
31122
|
+
const dragGeometry = useRef44(null);
|
|
31123
|
+
const [landingPreview, setLandingPreview] = useState79(null);
|
|
31124
|
+
const previewRef = useRef44(null);
|
|
31125
|
+
const [reportedMove, setPendingMove] = useState79(null);
|
|
30563
31126
|
const pendingMove = reportedMove && !hasMoveSettled(columns, reportedMove) ? reportedMove : null;
|
|
30564
31127
|
const view = useMemo23(() => pendingMove ? applyPendingMove(columns, pendingMove) : columns, [columns, pendingMove]);
|
|
30565
|
-
|
|
31128
|
+
useEffect46(() => {
|
|
30566
31129
|
columnsRef.current = view;
|
|
30567
31130
|
onChangeRef.current = onChange;
|
|
30568
31131
|
});
|
|
30569
|
-
const [landing, setLanding] =
|
|
30570
|
-
const landingTimer =
|
|
30571
|
-
const pointRef =
|
|
31132
|
+
const [landing, setLanding] = useState79(null);
|
|
31133
|
+
const landingTimer = useRef44(null);
|
|
31134
|
+
const pointRef = useRef44({ x: 0, y: 0 });
|
|
30572
31135
|
const laneLabel = useCallback28((columnId) => view.find((c) => c.id === columnId)?.label ?? columnId, [view]);
|
|
30573
31136
|
const acceptsLifted = useCallback28(
|
|
30574
31137
|
(fromColumnId) => (column) => {
|
|
@@ -30619,7 +31182,7 @@ function DragBoard({
|
|
|
30619
31182
|
},
|
|
30620
31183
|
[lifted, view, acceptsLifted, laneLabel]
|
|
30621
31184
|
);
|
|
30622
|
-
|
|
31185
|
+
useEffect46(() => {
|
|
30623
31186
|
if (!lifted) return void 0;
|
|
30624
31187
|
const onKeyDown = (event) => {
|
|
30625
31188
|
if (event.key === "Escape") {
|
|
@@ -30637,7 +31200,7 @@ function DragBoard({
|
|
|
30637
31200
|
window.addEventListener("keydown", onKeyDown);
|
|
30638
31201
|
return () => window.removeEventListener("keydown", onKeyDown);
|
|
30639
31202
|
}, [lifted, drop, walk]);
|
|
30640
|
-
|
|
31203
|
+
useEffect46(() => {
|
|
30641
31204
|
if (!lifted) return;
|
|
30642
31205
|
boardRef.current?.querySelector(`[${DROP_LINE_ATTRIBUTE}]`)?.scrollIntoView({ block: "nearest", inline: "nearest" });
|
|
30643
31206
|
}, [lifted]);
|
|
@@ -30648,12 +31211,12 @@ function DragBoard({
|
|
|
30648
31211
|
const anchor = aimToChange(view, lifted.ticketId, lifted.aim) ? aimAnchor(view, lifted.ticketId, lifted.aim) : { ticketId: null, edge: null };
|
|
30649
31212
|
return { columnId: lifted.aim.columnId, ...anchor, ticket };
|
|
30650
31213
|
}, [lifted, view]);
|
|
30651
|
-
|
|
31214
|
+
useEffect46(() => {
|
|
30652
31215
|
if (!pendingMove) return void 0;
|
|
30653
31216
|
const timer = setTimeout(() => setPendingMove(null), PENDING_MOVE_TIMEOUT_MS);
|
|
30654
31217
|
return () => clearTimeout(timer);
|
|
30655
31218
|
}, [pendingMove]);
|
|
30656
|
-
|
|
31219
|
+
useEffect46(() => {
|
|
30657
31220
|
const scroller = scrollerRef.current;
|
|
30658
31221
|
const readAim = (source, target) => {
|
|
30659
31222
|
const ticket = source.data.ticket;
|
|
@@ -30765,7 +31328,7 @@ function DragBoard({
|
|
|
30765
31328
|
};
|
|
30766
31329
|
}, [landing, landingPreview]);
|
|
30767
31330
|
const preview = landingPreview && createPortal(
|
|
30768
|
-
/* @__PURE__ */
|
|
31331
|
+
/* @__PURE__ */ jsx272(
|
|
30769
31332
|
"div",
|
|
30770
31333
|
{
|
|
30771
31334
|
ref: previewRef,
|
|
@@ -30778,7 +31341,7 @@ function DragBoard({
|
|
|
30778
31341
|
// translate in pointer coordinates and nothing else.
|
|
30779
31342
|
margin: `${-landingPreview.grabY}px 0 0 ${-landingPreview.grabX}px`
|
|
30780
31343
|
},
|
|
30781
|
-
children: /* @__PURE__ */
|
|
31344
|
+
children: /* @__PURE__ */ jsx272(
|
|
30782
31345
|
TicketCardView,
|
|
30783
31346
|
{
|
|
30784
31347
|
ticket: landingPreview.ticket,
|
|
@@ -30791,10 +31354,10 @@ function DragBoard({
|
|
|
30791
31354
|
),
|
|
30792
31355
|
document.body
|
|
30793
31356
|
);
|
|
30794
|
-
return /* @__PURE__ */
|
|
31357
|
+
return /* @__PURE__ */ jsx272(LandingCardContext.Provider, { value: landing, children: /* @__PURE__ */ jsx272(DropAimContext.Provider, { value: aim ?? keyboardAim, children: /* @__PURE__ */ jsxs218(BoardLiftContext.Provider, { value: lift, children: [
|
|
30795
31358
|
preview,
|
|
30796
|
-
/* @__PURE__ */
|
|
30797
|
-
/* @__PURE__ */
|
|
31359
|
+
/* @__PURE__ */ jsxs218("div", { ref: boardRef, className: cn("flex h-full flex-col", className), children: [
|
|
31360
|
+
/* @__PURE__ */ jsx272(
|
|
30798
31361
|
"div",
|
|
30799
31362
|
{
|
|
30800
31363
|
ref: setScroller,
|
|
@@ -30806,9 +31369,9 @@ function DragBoard({
|
|
|
30806
31369
|
const joinLeft = !!(column.system && prev?.system);
|
|
30807
31370
|
const joinRight = !!(column.system && next?.system);
|
|
30808
31371
|
const showGap = i > 0 && !joinLeft;
|
|
30809
|
-
return /* @__PURE__ */
|
|
30810
|
-
showGap && /* @__PURE__ */
|
|
30811
|
-
/* @__PURE__ */
|
|
31372
|
+
return /* @__PURE__ */ jsxs218(Fragment46, { children: [
|
|
31373
|
+
showGap && /* @__PURE__ */ jsx272("div", { "aria-hidden": true, className: "w-[var(--spacing-system-mf)] shrink-0" }),
|
|
31374
|
+
/* @__PURE__ */ jsx272(
|
|
30812
31375
|
BoardColumn,
|
|
30813
31376
|
{
|
|
30814
31377
|
column,
|
|
@@ -30830,15 +31393,15 @@ function DragBoard({
|
|
|
30830
31393
|
})
|
|
30831
31394
|
}
|
|
30832
31395
|
),
|
|
30833
|
-
/* @__PURE__ */
|
|
30834
|
-
thumbRatio > 0 && /* @__PURE__ */
|
|
31396
|
+
/* @__PURE__ */ jsx272("p", { "aria-live": "polite", className: "sr-only", children: announcement }),
|
|
31397
|
+
thumbRatio > 0 && /* @__PURE__ */ jsx272(
|
|
30835
31398
|
"div",
|
|
30836
31399
|
{
|
|
30837
31400
|
ref: trackRef,
|
|
30838
31401
|
onClick: onTrackClick,
|
|
30839
31402
|
onWheel: onTrackWheel,
|
|
30840
31403
|
className: "relative mt-[var(--spacing-system-mf)] h-2 shrink-0 cursor-pointer rounded-full bg-ods-border",
|
|
30841
|
-
children: /* @__PURE__ */
|
|
31404
|
+
children: /* @__PURE__ */ jsx272(
|
|
30842
31405
|
"div",
|
|
30843
31406
|
{
|
|
30844
31407
|
ref: thumbRef,
|
|
@@ -30953,13 +31516,13 @@ import {
|
|
|
30953
31516
|
createContext as createContext13,
|
|
30954
31517
|
useCallback as useCallback29,
|
|
30955
31518
|
useContext as useContext13,
|
|
30956
|
-
useEffect as
|
|
31519
|
+
useEffect as useEffect47,
|
|
30957
31520
|
useId as useId5,
|
|
30958
31521
|
useMemo as useMemo24,
|
|
30959
|
-
useRef as
|
|
30960
|
-
useState as
|
|
31522
|
+
useRef as useRef45,
|
|
31523
|
+
useState as useState80
|
|
30961
31524
|
} from "react";
|
|
30962
|
-
import { jsx as
|
|
31525
|
+
import { jsx as jsx273, jsxs as jsxs219 } from "react/jsx-runtime";
|
|
30963
31526
|
var SORTABLE_ITEM_ATTRIBUTE = "data-sortable-item";
|
|
30964
31527
|
var SHIFT_MS = 200;
|
|
30965
31528
|
var DROP_MS2 = 150;
|
|
@@ -30971,19 +31534,19 @@ function useSortableListContext() {
|
|
|
30971
31534
|
return context;
|
|
30972
31535
|
}
|
|
30973
31536
|
function SortableList({ onReorder, getItemLabel, disabled = false, className, children }) {
|
|
30974
|
-
const listRef =
|
|
31537
|
+
const listRef = useRef45(null);
|
|
30975
31538
|
const dragAndDropEnabled = useDragAndDropEnabled();
|
|
30976
31539
|
const dragType = useId5();
|
|
30977
|
-
const [announcement, setAnnouncement] =
|
|
30978
|
-
const onReorderRef =
|
|
30979
|
-
const getItemLabelRef =
|
|
30980
|
-
|
|
31540
|
+
const [announcement, setAnnouncement] = useState80("");
|
|
31541
|
+
const onReorderRef = useRef45(onReorder);
|
|
31542
|
+
const getItemLabelRef = useRef45(getItemLabel);
|
|
31543
|
+
useEffect47(() => {
|
|
30981
31544
|
onReorderRef.current = onReorder;
|
|
30982
31545
|
getItemLabelRef.current = getItemLabel;
|
|
30983
31546
|
});
|
|
30984
|
-
const flipFrom =
|
|
30985
|
-
const [flipTick, setFlipTick] =
|
|
30986
|
-
const flipTimer =
|
|
31547
|
+
const flipFrom = useRef45(null);
|
|
31548
|
+
const [flipTick, setFlipTick] = useState80(0);
|
|
31549
|
+
const flipTimer = useRef45(null);
|
|
30987
31550
|
const readItems = useCallback29(
|
|
30988
31551
|
() => [...listRef.current?.querySelectorAll(`[${SORTABLE_ITEM_ATTRIBUTE}]`) ?? []],
|
|
30989
31552
|
[]
|
|
@@ -30997,7 +31560,7 @@ function SortableList({ onReorder, getItemLabel, disabled = false, className, ch
|
|
|
30997
31560
|
},
|
|
30998
31561
|
[readItems]
|
|
30999
31562
|
);
|
|
31000
|
-
|
|
31563
|
+
useEffect47(() => {
|
|
31001
31564
|
const list = listRef.current;
|
|
31002
31565
|
if (!list || disabled || !dragAndDropEnabled) return void 0;
|
|
31003
31566
|
let drag = null;
|
|
@@ -31088,7 +31651,7 @@ function SortableList({ onReorder, getItemLabel, disabled = false, className, ch
|
|
|
31088
31651
|
for (const item of moving) item.style.transition = "";
|
|
31089
31652
|
}, DROP_MS2);
|
|
31090
31653
|
}, [flipTick, readItems]);
|
|
31091
|
-
|
|
31654
|
+
useEffect47(
|
|
31092
31655
|
() => () => {
|
|
31093
31656
|
if (flipTimer.current) clearTimeout(flipTimer.current);
|
|
31094
31657
|
},
|
|
@@ -31098,19 +31661,19 @@ function SortableList({ onReorder, getItemLabel, disabled = false, className, ch
|
|
|
31098
31661
|
() => ({ dragType, disabled, dragAndDropEnabled, reorder, readItems }),
|
|
31099
31662
|
[dragType, disabled, dragAndDropEnabled, reorder, readItems]
|
|
31100
31663
|
);
|
|
31101
|
-
return /* @__PURE__ */
|
|
31664
|
+
return /* @__PURE__ */ jsx273(SortableListContext.Provider, { value: context, children: /* @__PURE__ */ jsxs219("div", { ref: listRef, className, children: [
|
|
31102
31665
|
children,
|
|
31103
|
-
/* @__PURE__ */
|
|
31666
|
+
/* @__PURE__ */ jsx273("p", { "aria-live": "polite", className: "sr-only", children: announcement })
|
|
31104
31667
|
] }) });
|
|
31105
31668
|
}
|
|
31106
31669
|
|
|
31107
31670
|
// src/components/features/sortable-list/sortable-move-buttons.tsx
|
|
31108
|
-
import { useRef as
|
|
31109
|
-
import { jsx as
|
|
31671
|
+
import { useRef as useRef46 } from "react";
|
|
31672
|
+
import { jsx as jsx274, jsxs as jsxs220 } from "react/jsx-runtime";
|
|
31110
31673
|
function SortableMoveButtons({ index, count, label, className }) {
|
|
31111
31674
|
const { disabled, reorder } = useSortableListContext();
|
|
31112
|
-
const upRef =
|
|
31113
|
-
const downRef =
|
|
31675
|
+
const upRef = useRef46(null);
|
|
31676
|
+
const downRef = useRef46(null);
|
|
31114
31677
|
const move = (step) => {
|
|
31115
31678
|
const to = index + step;
|
|
31116
31679
|
if (to < 0 || to >= count) return;
|
|
@@ -31121,8 +31684,8 @@ function SortableMoveButtons({ index, count, label, className }) {
|
|
|
31121
31684
|
});
|
|
31122
31685
|
};
|
|
31123
31686
|
const subject = label ?? "item";
|
|
31124
|
-
return /* @__PURE__ */
|
|
31125
|
-
/* @__PURE__ */
|
|
31687
|
+
return /* @__PURE__ */ jsxs220("div", { className: cn("inline-flex shrink-0", className), children: [
|
|
31688
|
+
/* @__PURE__ */ jsx274(
|
|
31126
31689
|
Button,
|
|
31127
31690
|
{
|
|
31128
31691
|
ref: upRef,
|
|
@@ -31133,10 +31696,10 @@ function SortableMoveButtons({ index, count, label, className }) {
|
|
|
31133
31696
|
disabled: disabled || index <= 0,
|
|
31134
31697
|
onClick: () => move(-1),
|
|
31135
31698
|
className: "rounded-r-none border-r-0",
|
|
31136
|
-
children: /* @__PURE__ */
|
|
31699
|
+
children: /* @__PURE__ */ jsx274(Arrow01UpIcon, {})
|
|
31137
31700
|
}
|
|
31138
31701
|
),
|
|
31139
|
-
/* @__PURE__ */
|
|
31702
|
+
/* @__PURE__ */ jsx274(
|
|
31140
31703
|
Button,
|
|
31141
31704
|
{
|
|
31142
31705
|
ref: downRef,
|
|
@@ -31147,7 +31710,7 @@ function SortableMoveButtons({ index, count, label, className }) {
|
|
|
31147
31710
|
disabled: disabled || index >= count - 1,
|
|
31148
31711
|
onClick: () => move(1),
|
|
31149
31712
|
className: "rounded-l-none",
|
|
31150
|
-
children: /* @__PURE__ */
|
|
31713
|
+
children: /* @__PURE__ */ jsx274(Arrow01DownIcon, {})
|
|
31151
31714
|
}
|
|
31152
31715
|
)
|
|
31153
31716
|
] });
|
|
@@ -31157,18 +31720,18 @@ function SortableMoveButtons({ index, count, label, className }) {
|
|
|
31157
31720
|
import { combine as combine5 } from "@atlaskit/pragmatic-drag-and-drop/combine";
|
|
31158
31721
|
import { draggable as draggable2 } from "@atlaskit/pragmatic-drag-and-drop/element/adapter";
|
|
31159
31722
|
import { disableNativeDragPreview } from "@atlaskit/pragmatic-drag-and-drop/element/disable-native-drag-preview";
|
|
31160
|
-
import { useCallback as useCallback30, useEffect as
|
|
31723
|
+
import { useCallback as useCallback30, useEffect as useEffect48, useState as useState81 } from "react";
|
|
31161
31724
|
function useSortableItem() {
|
|
31162
31725
|
const { dragType, disabled, dragAndDropEnabled, reorder, readItems } = useSortableListContext();
|
|
31163
31726
|
const inert = disabled || !dragAndDropEnabled;
|
|
31164
|
-
const [item, setItem] =
|
|
31165
|
-
const [handle, setHandle] =
|
|
31166
|
-
const [isDragging, setIsDragging] =
|
|
31727
|
+
const [item, setItem] = useState81(null);
|
|
31728
|
+
const [handle, setHandle] = useState81(null);
|
|
31729
|
+
const [isDragging, setIsDragging] = useState81(false);
|
|
31167
31730
|
const itemRef = useCallback30((node) => {
|
|
31168
31731
|
node?.setAttribute(SORTABLE_ITEM_ATTRIBUTE, "");
|
|
31169
31732
|
setItem(node);
|
|
31170
31733
|
}, []);
|
|
31171
|
-
|
|
31734
|
+
useEffect48(() => {
|
|
31172
31735
|
if (!item || !handle || inert) return void 0;
|
|
31173
31736
|
return combine5(
|
|
31174
31737
|
// The drag has to start as a "move", or its first frame is drawn with the
|
|
@@ -31203,7 +31766,7 @@ function useSortableItem() {
|
|
|
31203
31766
|
}
|
|
31204
31767
|
|
|
31205
31768
|
// src/components/features/ticket-status-config-list/ticket-status-config-list.tsx
|
|
31206
|
-
import { jsx as
|
|
31769
|
+
import { jsx as jsx275 } from "react/jsx-runtime";
|
|
31207
31770
|
function TicketStatusConfigList({
|
|
31208
31771
|
items,
|
|
31209
31772
|
onReorder,
|
|
@@ -31211,13 +31774,13 @@ function TicketStatusConfigList({
|
|
|
31211
31774
|
getItemLabel,
|
|
31212
31775
|
className
|
|
31213
31776
|
}) {
|
|
31214
|
-
return /* @__PURE__ */
|
|
31777
|
+
return /* @__PURE__ */ jsx275(
|
|
31215
31778
|
SortableList,
|
|
31216
31779
|
{
|
|
31217
31780
|
onReorder,
|
|
31218
31781
|
getItemLabel,
|
|
31219
31782
|
className: cn("flex w-full flex-col gap-[var(--spacing-system-xs)]", className),
|
|
31220
|
-
children: items.map((item, index) => /* @__PURE__ */
|
|
31783
|
+
children: items.map((item, index) => /* @__PURE__ */ jsx275(SortableRow, { index, count: items.length, label: getItemLabel?.(index), children: (args) => renderRow(item, args) }, item.id))
|
|
31221
31784
|
}
|
|
31222
31785
|
);
|
|
31223
31786
|
}
|
|
@@ -31228,7 +31791,7 @@ function SortableRow({
|
|
|
31228
31791
|
children
|
|
31229
31792
|
}) {
|
|
31230
31793
|
const { itemRef, dragHandleProps, isDragging, dragAndDropEnabled } = useSortableItem();
|
|
31231
|
-
return /* @__PURE__ */
|
|
31794
|
+
return /* @__PURE__ */ jsx275(
|
|
31232
31795
|
"div",
|
|
31233
31796
|
{
|
|
31234
31797
|
ref: itemRef,
|
|
@@ -31236,7 +31799,7 @@ function SortableRow({
|
|
|
31236
31799
|
children: children({
|
|
31237
31800
|
dragHandleProps,
|
|
31238
31801
|
isDragging,
|
|
31239
|
-
moveButtons: dragAndDropEnabled ? null : /* @__PURE__ */
|
|
31802
|
+
moveButtons: dragAndDropEnabled ? null : /* @__PURE__ */ jsx275(SortableMoveButtons, { index, count, label })
|
|
31240
31803
|
})
|
|
31241
31804
|
}
|
|
31242
31805
|
);
|
|
@@ -31806,6 +32369,22 @@ export {
|
|
|
31806
32369
|
UnreadCountBadge,
|
|
31807
32370
|
HeaderButton,
|
|
31808
32371
|
TimeTrackerHeaderButton,
|
|
32372
|
+
RemoteSessionScope,
|
|
32373
|
+
RemoteSessionOrgLogo,
|
|
32374
|
+
RemoteSessionRecordingTag,
|
|
32375
|
+
REMOTE_SESSION_DRAG_HANDLE_CLASS,
|
|
32376
|
+
RemoteSessionDragger,
|
|
32377
|
+
formatRemoteSessionElapsed,
|
|
32378
|
+
useRemoteSessionTimer,
|
|
32379
|
+
RemoteAccessRequestCard,
|
|
32380
|
+
RemoteSessionBlockFrame,
|
|
32381
|
+
RemoteSessionEndButton,
|
|
32382
|
+
RemoteSessionSummary,
|
|
32383
|
+
RemoteSessionMinimizedChip,
|
|
32384
|
+
RemoteSessionChatPanel,
|
|
32385
|
+
RemoteSessionDialog,
|
|
32386
|
+
RemoteSessionBorder,
|
|
32387
|
+
RemoteSessionPill,
|
|
31809
32388
|
BoardColumnHeader,
|
|
31810
32389
|
tintOnDark,
|
|
31811
32390
|
BoardTicketApproval,
|
|
@@ -31891,4 +32470,4 @@ export {
|
|
|
31891
32470
|
LazyMount,
|
|
31892
32471
|
IconTile
|
|
31893
32472
|
};
|
|
31894
|
-
//# sourceMappingURL=chunk-
|
|
32473
|
+
//# sourceMappingURL=chunk-CKO6NKNE.js.map
|