@epam/ai-dial-conversation-panel 1.2.0-dev.217 → 1.2.0-dev.219
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/components/ConversationPanel/ConversationPanel.d.ts.map +1 -1
- package/components/ConversationRow/ConversationRow.d.ts +1 -2
- package/components/ConversationRow/ConversationRow.d.ts.map +1 -1
- package/index.js +206 -202
- package/package.json +3 -3
- package/utils/conversation-row.d.ts +2 -0
- package/utils/conversation-row.d.ts.map +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ConversationPanel.d.ts","sourceRoot":"","sources":["../../../src/components/ConversationPanel/ConversationPanel.tsx"],"names":[],"mappings":"AAYA,OAAO,EACL,KAAK,EAAE,EAQR,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"ConversationPanel.d.ts","sourceRoot":"","sources":["../../../src/components/ConversationPanel/ConversationPanel.tsx"],"names":[],"mappings":"AAYA,OAAO,EACL,KAAK,EAAE,EAQR,MAAM,OAAO,CAAC;AAGf,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AA0BlE,sEAAsE;AACtE,eAAO,MAAM,iBAAiB,EAAE,EAAE,CAAC,sBAAsB,CAkdxD,CAAC"}
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import { FilterTab } from '@epam/ai-dial-chat-shared';
|
|
2
2
|
import { DropdownItem } from '@epam/ai-dial-ui-kit';
|
|
3
|
-
import { FC } from 'react';
|
|
4
3
|
import { ConversationItem } from '../../models/panel-props';
|
|
5
4
|
import { VirtualRow } from '../../models/virtual-row';
|
|
6
5
|
/** Props for `ConversationRow`. */
|
|
@@ -47,5 +46,5 @@ export interface ConversationRowProps {
|
|
|
47
46
|
onDrop?: (targetId: string, targetGroupKey: FilterTab, afterId: string | null) => void;
|
|
48
47
|
}
|
|
49
48
|
/** Single draggable conversation row rendered inside the virtualised list or a static `ConversationGroup`. */
|
|
50
|
-
export declare const ConversationRow:
|
|
49
|
+
export declare const ConversationRow: import('react').NamedExoticComponent<ConversationRowProps>;
|
|
51
50
|
//# sourceMappingURL=ConversationRow.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ConversationRow.d.ts","sourceRoot":"","sources":["../../../src/components/ConversationRow/ConversationRow.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,SAAS,EAEV,MAAM,2BAA2B,CAAC;AACnC,OAAO,EAUL,KAAK,YAAY,EAClB,MAAM,sBAAsB,CAAC;
|
|
1
|
+
{"version":3,"file":"ConversationRow.d.ts","sourceRoot":"","sources":["../../../src/components/ConversationRow/ConversationRow.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,SAAS,EAEV,MAAM,2BAA2B,CAAC;AACnC,OAAO,EAUL,KAAK,YAAY,EAClB,MAAM,sBAAsB,CAAC;AAW9B,OAAO,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAC;AAC5D,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC;AAK3D,mCAAmC;AACnC,MAAM,WAAW,oBAAoB;IACnC,wCAAwC;IACxC,IAAI,EAAE,gBAAgB,CAAC;IACvB,qDAAqD;IACrD,QAAQ,EAAE,OAAO,CAAC;IAClB,sEAAsE;IACtE,oBAAoB,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3C,uEAAuE;IACvE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,sGAAsG;IACtG,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,gBAAgB,KAAK,YAAY,EAAE,CAAC;IACxD,gDAAgD;IAChD,gBAAgB,CAAC,EAAE,CACjB,IAAI,EAAE,gBAAgB,EACtB,OAAO,EAAE,iBAAiB,KACvB,IAAI,CAAC;IACV,qFAAqF;IACrF,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,yFAAyF;IACzF,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,yEAAyE;IACzE,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,yGAAyG;IACzG,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,oEAAoE;IACpE,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,mEAAmE;IACnE,IAAI,CAAC,EAAE,UAAU,EAAE,CAAC;IACpB,qFAAqF;IACrF,UAAU,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC3B,qDAAqD;IACrD,UAAU,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC3B,8FAA8F;IAC9F,iBAAiB,CAAC,EAAE,GAAG,CAAC,SAAS,CAAC,GAAG,IAAI,CAAC;IAC1C,qDAAqD;IACrD,WAAW,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,kDAAkD;IAClD,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,mDAAmD;IACnD,UAAU,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,mDAAmD;IACnD,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,gDAAgD;IAChD,MAAM,CAAC,EAAE,CACP,QAAQ,EAAE,MAAM,EAChB,cAAc,EAAE,SAAS,EACzB,OAAO,EAAE,MAAM,GAAG,IAAI,KACnB,IAAI,CAAC;CACX;AA+ND,8GAA8G;AAC9G,eAAO,MAAM,eAAe,4DAAiC,CAAC"}
|
package/index.js
CHANGED
|
@@ -1,15 +1,15 @@
|
|
|
1
1
|
import { DeploymentIcon as e, FilterTab as t, buildCssVars as n, getUtf8ByteLength as r, mergeClasses as i, sanitizeConversationName as a, stripTrailingDots as o } from "@epam/ai-dial-chat-shared";
|
|
2
2
|
import { PanelEmpty as s, PanelNoResults as c, SidebarOrientation as l, SidebarPanel as u } from "@epam/ai-dial-sidebar";
|
|
3
3
|
import { Button as d, ButtonVariant as f, DIAL_ICON_SIZE as p, DIAL_KIT_ICON_STROKE as m, Dropdown as h, ElementSize as g, EllipsisTooltip as _, FilterChips as v, GhostIconButton as y, Highlight as b, Input as x, Popup as S, PopupSize as C, Search as w, Skeleton as T, SkeletonVariant as ee, Spinner as E, mergeClasses as D } from "@epam/ai-dial-ui-kit";
|
|
4
|
-
import { createElement as O, memo as k, useCallback as A, useEffect as j, useId as
|
|
5
|
-
import { jsx as
|
|
6
|
-
import { IconCaretDownFilled as
|
|
4
|
+
import { createElement as O, memo as k, useCallback as A, useEffect as j, useId as te, useImperativeHandle as M, useLayoutEffect as ne, useMemo as N, useRef as P, useState as F } from "react";
|
|
5
|
+
import { jsx as I, jsxs as re } from "react/jsx-runtime";
|
|
6
|
+
import { IconCaretDownFilled as L, IconCaretRightFilled as R, IconDotsVertical as ie, IconPlus as ae, IconSparkles as oe } from "@tabler/icons-react";
|
|
7
7
|
//#region src/constants/public-class-names.ts
|
|
8
|
-
var
|
|
8
|
+
var se = {
|
|
9
9
|
newChatButton: "dial-cp-new-chat-button",
|
|
10
10
|
search: "dial-cp-search"
|
|
11
|
-
},
|
|
12
|
-
function
|
|
11
|
+
}, z = typeof window < "u" ? ne : j;
|
|
12
|
+
function ce(e) {
|
|
13
13
|
if (e !== void 0) switch (typeof e) {
|
|
14
14
|
case "number": return e;
|
|
15
15
|
case "string":
|
|
@@ -17,15 +17,15 @@ function oe(e) {
|
|
|
17
17
|
break;
|
|
18
18
|
}
|
|
19
19
|
}
|
|
20
|
-
function
|
|
21
|
-
let { styleHeight: s, styleWidth: c } =
|
|
22
|
-
styleHeight:
|
|
23
|
-
styleWidth:
|
|
24
|
-
}), [o?.height, o?.width]), [l, u] =
|
|
20
|
+
function B({ box: e, defaultHeight: t, defaultWidth: n, disabled: r, element: i, mode: a, style: o }) {
|
|
21
|
+
let { styleHeight: s, styleWidth: c } = N(() => ({
|
|
22
|
+
styleHeight: ce(o?.height),
|
|
23
|
+
styleWidth: ce(o?.width)
|
|
24
|
+
}), [o?.height, o?.width]), [l, u] = F({
|
|
25
25
|
height: t,
|
|
26
26
|
width: n
|
|
27
27
|
}), d = r || a === "only-height" && s !== void 0 || a === "only-width" && c !== void 0 || s !== void 0 && c !== void 0;
|
|
28
|
-
return
|
|
28
|
+
return z(() => {
|
|
29
29
|
if (i === null || d) return;
|
|
30
30
|
let t = new ResizeObserver((e) => {
|
|
31
31
|
for (let t of e) {
|
|
@@ -45,7 +45,7 @@ function se({ box: e, defaultHeight: t, defaultWidth: n, disabled: r, element: i
|
|
|
45
45
|
i,
|
|
46
46
|
s,
|
|
47
47
|
c
|
|
48
|
-
]),
|
|
48
|
+
]), N(() => ({
|
|
49
49
|
height: s ?? l.height,
|
|
50
50
|
width: c ?? l.width
|
|
51
51
|
}), [
|
|
@@ -54,26 +54,26 @@ function se({ box: e, defaultHeight: t, defaultWidth: n, disabled: r, element: i
|
|
|
54
54
|
c
|
|
55
55
|
]);
|
|
56
56
|
}
|
|
57
|
-
function
|
|
58
|
-
let t =
|
|
57
|
+
function le(e) {
|
|
58
|
+
let t = P(() => {
|
|
59
59
|
throw Error("Cannot call during render.");
|
|
60
60
|
});
|
|
61
|
-
return
|
|
61
|
+
return z(() => {
|
|
62
62
|
t.current = e;
|
|
63
63
|
}, [e]), A((e) => t.current?.(e), [t]);
|
|
64
64
|
}
|
|
65
|
-
var
|
|
66
|
-
function
|
|
67
|
-
if (
|
|
65
|
+
var V = null;
|
|
66
|
+
function H(e = !1) {
|
|
67
|
+
if (V === null || e) {
|
|
68
68
|
let e = document.createElement("div"), t = e.style;
|
|
69
69
|
t.width = "50px", t.height = "50px", t.overflow = "scroll", t.direction = "rtl";
|
|
70
70
|
let n = document.createElement("div"), r = n.style;
|
|
71
|
-
return r.width = "100px", r.height = "100px", e.appendChild(n), document.body.appendChild(e), e.scrollLeft > 0 ?
|
|
71
|
+
return r.width = "100px", r.height = "100px", e.appendChild(n), document.body.appendChild(e), e.scrollLeft > 0 ? V = "positive-descending" : (e.scrollLeft = 1, V = e.scrollLeft === 0 ? "negative" : "positive-ascending"), document.body.removeChild(e), V;
|
|
72
72
|
}
|
|
73
|
-
return
|
|
73
|
+
return V;
|
|
74
74
|
}
|
|
75
|
-
function
|
|
76
|
-
if (t === "horizontal" && n) switch (
|
|
75
|
+
function U({ containerElement: e, direction: t, isRtl: n, scrollOffset: r }) {
|
|
76
|
+
if (t === "horizontal" && n) switch (H()) {
|
|
77
77
|
case "negative": return -r;
|
|
78
78
|
case "positive-descending":
|
|
79
79
|
if (e) {
|
|
@@ -172,7 +172,7 @@ function de({ itemCount: e, itemProps: t, itemSize: n }) {
|
|
|
172
172
|
};
|
|
173
173
|
}
|
|
174
174
|
function J({ itemCount: e, itemProps: t, itemSize: n }) {
|
|
175
|
-
return
|
|
175
|
+
return N(() => de({
|
|
176
176
|
itemCount: e,
|
|
177
177
|
itemProps: t,
|
|
178
178
|
itemSize: n
|
|
@@ -195,20 +195,20 @@ function Y({ containerSize: e, itemSize: t }) {
|
|
|
195
195
|
return n;
|
|
196
196
|
}
|
|
197
197
|
function fe({ containerElement: e, containerStyle: t, defaultContainerSize: n = 0, direction: r, isRtl: i = !1, itemCount: a, itemProps: o, itemSize: s, onResize: c, overscanCount: l }) {
|
|
198
|
-
let { height: u = n, width: d = n } =
|
|
198
|
+
let { height: u = n, width: d = n } = B({
|
|
199
199
|
defaultHeight: r === "vertical" ? n : void 0,
|
|
200
200
|
defaultWidth: r === "horizontal" ? n : void 0,
|
|
201
201
|
element: e,
|
|
202
202
|
mode: r === "vertical" ? "only-height" : "only-width",
|
|
203
203
|
style: t
|
|
204
|
-
}), f =
|
|
204
|
+
}), f = P({
|
|
205
205
|
height: 0,
|
|
206
206
|
width: 0
|
|
207
207
|
}), p = r === "vertical" ? u : d, m = Y({
|
|
208
208
|
containerSize: p,
|
|
209
209
|
itemSize: s
|
|
210
210
|
});
|
|
211
|
-
|
|
211
|
+
ne(() => {
|
|
212
212
|
if (typeof c == "function") {
|
|
213
213
|
let e = f.current;
|
|
214
214
|
(e.height !== u || e.width !== d) && (c({
|
|
@@ -225,7 +225,7 @@ function fe({ containerElement: e, containerStyle: t, defaultContainerSize: n =
|
|
|
225
225
|
itemCount: a,
|
|
226
226
|
itemProps: o,
|
|
227
227
|
itemSize: m
|
|
228
|
-
}), g = A((e) => h.get(e), [h]), [_, v] =
|
|
228
|
+
}), g = A((e) => h.get(e), [h]), [_, v] = F(() => q({
|
|
229
229
|
cachedBounds: h,
|
|
230
230
|
containerScrollOffset: 0,
|
|
231
231
|
containerSize: p,
|
|
@@ -246,7 +246,7 @@ function fe({ containerElement: e, containerStyle: t, defaultContainerSize: n =
|
|
|
246
246
|
m
|
|
247
247
|
]), w = A((t) => q({
|
|
248
248
|
cachedBounds: h,
|
|
249
|
-
containerScrollOffset:
|
|
249
|
+
containerScrollOffset: U({
|
|
250
250
|
containerElement: e,
|
|
251
251
|
direction: r,
|
|
252
252
|
isRtl: i,
|
|
@@ -264,19 +264,19 @@ function fe({ containerElement: e, containerStyle: t, defaultContainerSize: n =
|
|
|
264
264
|
a,
|
|
265
265
|
l
|
|
266
266
|
]);
|
|
267
|
-
return
|
|
267
|
+
return z(() => {
|
|
268
268
|
v(w((r === "vertical" ? e?.scrollTop : e?.scrollLeft) ?? 0));
|
|
269
269
|
}, [
|
|
270
270
|
e,
|
|
271
271
|
r,
|
|
272
272
|
w
|
|
273
|
-
]),
|
|
273
|
+
]), z(() => {
|
|
274
274
|
if (!e) return;
|
|
275
275
|
let t = () => {
|
|
276
276
|
v((t) => {
|
|
277
277
|
let { scrollLeft: n, scrollTop: o } = e, s = q({
|
|
278
278
|
cachedBounds: h,
|
|
279
|
-
containerScrollOffset:
|
|
279
|
+
containerScrollOffset: U({
|
|
280
280
|
containerElement: e,
|
|
281
281
|
direction: r,
|
|
282
282
|
isRtl: i,
|
|
@@ -302,7 +302,7 @@ function fe({ containerElement: e, containerStyle: t, defaultContainerSize: n =
|
|
|
302
302
|
]), {
|
|
303
303
|
getCellBounds: g,
|
|
304
304
|
getEstimatedSize: C,
|
|
305
|
-
scrollToIndex:
|
|
305
|
+
scrollToIndex: le(({ align: t = "auto", containerScrollOffset: n, index: o }) => {
|
|
306
306
|
let s = ue({
|
|
307
307
|
align: t,
|
|
308
308
|
cachedBounds: h,
|
|
@@ -313,7 +313,7 @@ function fe({ containerElement: e, containerStyle: t, defaultContainerSize: n =
|
|
|
313
313
|
itemSize: m
|
|
314
314
|
});
|
|
315
315
|
if (e) {
|
|
316
|
-
if (s =
|
|
316
|
+
if (s = U({
|
|
317
317
|
containerElement: e,
|
|
318
318
|
direction: r,
|
|
319
319
|
isRtl: i,
|
|
@@ -332,7 +332,7 @@ function fe({ containerElement: e, containerStyle: t, defaultContainerSize: n =
|
|
|
332
332
|
};
|
|
333
333
|
}
|
|
334
334
|
function pe(e) {
|
|
335
|
-
return
|
|
335
|
+
return N(() => e, Object.values(e));
|
|
336
336
|
}
|
|
337
337
|
function me(e, t) {
|
|
338
338
|
let { ariaAttributes: n, style: r, ...i } = e, { ariaAttributes: a, style: o, ...s } = t;
|
|
@@ -343,18 +343,18 @@ function he(e) {
|
|
|
343
343
|
}
|
|
344
344
|
var ge = "data-react-window-index";
|
|
345
345
|
function _e({ children: e, className: t, defaultHeight: n = 0, listRef: r, onResize: i, onRowsRendered: a, overscanCount: o = 3, rowComponent: s, rowCount: c, rowHeight: l, rowProps: u, tagName: d = "div", style: f, ...p }) {
|
|
346
|
-
let m = pe(u), h =
|
|
346
|
+
let m = pe(u), h = N(() => k(s, me), [s]), [g, _] = F(null), v = he(l), { getCellBounds: y, getEstimatedSize: b, scrollToIndex: x, startIndexOverscan: S, startIndexVisible: C, stopIndexOverscan: w, stopIndexVisible: T } = fe({
|
|
347
347
|
containerElement: g,
|
|
348
348
|
containerStyle: f,
|
|
349
349
|
defaultContainerSize: n,
|
|
350
350
|
direction: "vertical",
|
|
351
351
|
itemCount: c,
|
|
352
352
|
itemProps: m,
|
|
353
|
-
itemSize:
|
|
353
|
+
itemSize: N(() => v ? (e) => l.getRowHeight(e) ?? l.getAverageRowHeight() : l, [v, l]),
|
|
354
354
|
onResize: i,
|
|
355
355
|
overscanCount: o
|
|
356
356
|
});
|
|
357
|
-
|
|
357
|
+
M(r, () => ({
|
|
358
358
|
get element() {
|
|
359
359
|
return g;
|
|
360
360
|
},
|
|
@@ -369,7 +369,7 @@ function _e({ children: e, className: t, defaultHeight: n = 0, listRef: r, onRes
|
|
|
369
369
|
top: r
|
|
370
370
|
});
|
|
371
371
|
}
|
|
372
|
-
}), [g, x]),
|
|
372
|
+
}), [g, x]), z(() => {
|
|
373
373
|
if (!g) return;
|
|
374
374
|
let e = Array.from(g.children).filter((e, t) => {
|
|
375
375
|
if (e.hasAttribute("aria-hidden")) return !1;
|
|
@@ -398,7 +398,7 @@ function _e({ children: e, className: t, defaultHeight: n = 0, listRef: r, onRes
|
|
|
398
398
|
w,
|
|
399
399
|
T
|
|
400
400
|
]);
|
|
401
|
-
let ee =
|
|
401
|
+
let ee = N(() => {
|
|
402
402
|
let e = [];
|
|
403
403
|
if (c > 0) for (let t = S; t <= w; t++) {
|
|
404
404
|
let n = y(t);
|
|
@@ -429,7 +429,7 @@ function _e({ children: e, className: t, defaultHeight: n = 0, listRef: r, onRes
|
|
|
429
429
|
m,
|
|
430
430
|
S,
|
|
431
431
|
w
|
|
432
|
-
]), E = /* @__PURE__ */
|
|
432
|
+
]), E = /* @__PURE__ */ I("div", {
|
|
433
433
|
"aria-hidden": !0,
|
|
434
434
|
style: {
|
|
435
435
|
height: b(),
|
|
@@ -455,25 +455,25 @@ function _e({ children: e, className: t, defaultHeight: n = 0, listRef: r, onRes
|
|
|
455
455
|
//#region src/types/virtual-row.ts
|
|
456
456
|
var X = /* @__PURE__ */ function(e) {
|
|
457
457
|
return e.Header = "header", e.Item = "item", e;
|
|
458
|
-
}({}), ve = (e) => `${60 + e * 23 % 35}%`, ye = (e, t) => e ? t ? "pe-9" : "pe-2 group-focus-within/conversation:pe-9 group-hover/conversation:pe-9" : "pe-3", be = (e, t) => t.rows[e].kind === X.Item ? 36 : e === 0 ? 24 : 56, xe = (e) => {
|
|
458
|
+
}({}), ve = (e) => `${60 + e * 23 % 35}%`, ye = (e, t) => e ? t ? "pe-9" : "pe-2 group-focus-within/conversation:pe-9 group-hover/conversation:pe-9" : "pe-3", be = (e, t) => t.rows[e].kind === X.Item ? 36 : e === 0 ? 24 : 56, xe = 5, Se = (e) => Math.max(xe, Math.ceil(Math.ceil(e / 36) / 2)), Ce = (e) => {
|
|
459
459
|
switch (e) {
|
|
460
460
|
case t.Shared: return t.Shared;
|
|
461
461
|
case t.Organization: return t.Organization;
|
|
462
462
|
default: return t.MyChats;
|
|
463
463
|
}
|
|
464
|
-
},
|
|
464
|
+
}, we = (e, t) => {
|
|
465
465
|
let n = null;
|
|
466
466
|
for (let r of e) if (r.kind === X.Header) n = r.groupKey;
|
|
467
467
|
else if (r.item.id === t) return n;
|
|
468
468
|
return null;
|
|
469
|
-
},
|
|
469
|
+
}, Te = (e, n, r) => {
|
|
470
470
|
let i = /* @__PURE__ */ new Set();
|
|
471
471
|
if (n != null && i.add(n), n === t.Pinned) {
|
|
472
472
|
let t = r.find((t) => t.id === e);
|
|
473
|
-
t && i.add(
|
|
473
|
+
t && i.add(Ce(t.source));
|
|
474
474
|
} else i.add(t.Pinned);
|
|
475
475
|
return i;
|
|
476
|
-
},
|
|
476
|
+
}, Ee = (e, t, n, r) => {
|
|
477
477
|
let i = e.currentTarget.getBoundingClientRect();
|
|
478
478
|
if (e.clientY >= i.top + i.height / 2) return t;
|
|
479
479
|
let a = null, o = !1;
|
|
@@ -483,7 +483,7 @@ var X = /* @__PURE__ */ function(e) {
|
|
|
483
483
|
a = e.item.id;
|
|
484
484
|
}
|
|
485
485
|
return null;
|
|
486
|
-
},
|
|
486
|
+
}, De = [
|
|
487
487
|
{
|
|
488
488
|
value: t.All,
|
|
489
489
|
labelKey: "all"
|
|
@@ -500,8 +500,8 @@ var X = /* @__PURE__ */ function(e) {
|
|
|
500
500
|
value: t.Organization,
|
|
501
501
|
labelKey: "organization"
|
|
502
502
|
}
|
|
503
|
-
],
|
|
504
|
-
items:
|
|
503
|
+
], Oe = k(({ activeTab: e, labels: t, onChange: n, tabClassName: r = "dial-tiny-semi-text", hiddenSources: i }) => /* @__PURE__ */ I(v, {
|
|
504
|
+
items: N(() => De.filter(({ value: e }) => !i?.includes(e)).map(({ value: e, labelKey: n }) => ({
|
|
505
505
|
value: e,
|
|
506
506
|
label: t[n]
|
|
507
507
|
})), [t, i]),
|
|
@@ -511,24 +511,24 @@ var X = /* @__PURE__ */ function(e) {
|
|
|
511
511
|
"aria-label": t.groupAriaLabel ?? "Filter chats",
|
|
512
512
|
className: "px-3 py-2",
|
|
513
513
|
chipClassName: D("!px-2", r)
|
|
514
|
-
})),
|
|
514
|
+
})), ke = { button: "_button_1pnt8_1" }, Ae = k(({ label: e, onClick: t, labelClassName: r = "dial-small-semi-text", colors: a, className: o }) => /* @__PURE__ */ I("div", {
|
|
515
515
|
className: "px-3 py-2",
|
|
516
516
|
style: n({
|
|
517
517
|
"--cp-new-chat-bg": a?.background,
|
|
518
518
|
"--cp-new-chat-text": a?.text,
|
|
519
519
|
"--cp-new-chat-focus-outline": a?.focusOutline
|
|
520
520
|
}),
|
|
521
|
-
children: /* @__PURE__ */
|
|
521
|
+
children: /* @__PURE__ */ I(d, {
|
|
522
522
|
label: e,
|
|
523
523
|
textClassName: r,
|
|
524
|
-
iconBefore: /* @__PURE__ */
|
|
524
|
+
iconBefore: /* @__PURE__ */ I(ae, {
|
|
525
525
|
size: 18,
|
|
526
526
|
stroke: m,
|
|
527
527
|
className: "shrink-0",
|
|
528
528
|
"aria-hidden": !0
|
|
529
529
|
}),
|
|
530
530
|
onClick: t,
|
|
531
|
-
className: i("h-[36px] w-full gap-2 px-3 py-1 shadow-chat-button hover:shadow-xs focus-visible:shadow-xs active:shadow-xs",
|
|
531
|
+
className: i("h-[36px] w-full gap-2 px-3 py-1 shadow-chat-button hover:shadow-xs focus-visible:shadow-xs active:shadow-xs", ke.button, o, se.newChatButton)
|
|
532
532
|
})
|
|
533
533
|
})), Z = {
|
|
534
534
|
skeletonColor: "var(--cp-skeleton-color, var(--bg-control-disable-primary, #dce0e8))",
|
|
@@ -540,9 +540,9 @@ var X = /* @__PURE__ */ function(e) {
|
|
|
540
540
|
triggerIcon: "_triggerIcon_j0zft_32",
|
|
541
541
|
unreadDot: "_unreadDot_j0zft_40",
|
|
542
542
|
search: "_search_j0zft_48"
|
|
543
|
-
},
|
|
543
|
+
}, je = ({ label: e, isExpanded: t, onToggle: n, listId: r, className: a = "dial-tiny-lead-text", dropZoneGroupKey: o, isDragOver: s, onDragOver: c, onDragLeave: l, onDrop: u }) => {
|
|
544
544
|
let d = o != null;
|
|
545
|
-
return /* @__PURE__ */
|
|
545
|
+
return /* @__PURE__ */ re("button", {
|
|
546
546
|
type: "button",
|
|
547
547
|
"aria-expanded": t,
|
|
548
548
|
"aria-controls": r,
|
|
@@ -557,97 +557,97 @@ var X = /* @__PURE__ */ function(e) {
|
|
|
557
557
|
d && (e.preventDefault(), u?.(o, o, null));
|
|
558
558
|
} : void 0,
|
|
559
559
|
className: i("group flex h-6 w-full items-center gap-1 rounded py-1 pe-3 text-start", a, Z.groupHeader, s && Z.dropZoneActive),
|
|
560
|
-
children: [t ? /* @__PURE__ */ L
|
|
560
|
+
children: [t ? /* @__PURE__ */ I(L, {
|
|
561
561
|
size: 12,
|
|
562
562
|
className: "shrink-0 opacity-0 transition-opacity duration-150 group-hover:opacity-100 group-focus-visible:opacity-100",
|
|
563
563
|
"aria-hidden": !0
|
|
564
|
-
}) : /* @__PURE__ */
|
|
564
|
+
}) : /* @__PURE__ */ I(R, {
|
|
565
565
|
size: 12,
|
|
566
566
|
className: "shrink-0 opacity-0 transition-opacity duration-150 group-hover:opacity-100 group-focus-visible:opacity-100 rtl:scale-x-[-1]",
|
|
567
567
|
"aria-hidden": !0
|
|
568
|
-
}), /* @__PURE__ */
|
|
568
|
+
}), /* @__PURE__ */ I(_, { text: e })]
|
|
569
569
|
});
|
|
570
|
-
},
|
|
571
|
-
let [j,
|
|
572
|
-
|
|
573
|
-
}, [t, s]),
|
|
570
|
+
}, Me = k(({ item: t, isActive: n, onSelectConversation: r, searchQuery: a = "", getActions: o, onActionMenuOpen: s, actionsLabel: c = "More actions", itemTitleClassName: l = "dial-small-text", itemIconBadgeClassName: u, unreadIndicatorLabel: f = "Unread", rowGroupKey: _, rows: v, draggingId: x, dragOverId: S, allowedDropGroups: C, onDragStart: w, onDragEnd: E, onDragOver: D, onDragLeave: O, onDrop: k }) => {
|
|
571
|
+
let [j, te] = F(!1), M = P(null), ne = A((e) => {
|
|
572
|
+
te(e), e && M.current && s?.(t, M.current);
|
|
573
|
+
}, [t, s]), L = N(() => o?.(t) ?? [], [o, t]), R = L.length > 0, ae = N(() => ({ tooltip: t.iconTooltip }), [t.iconTooltip]), oe = N(() => ({ badgeClassName: u }), [u]), se = t.leadingIcon ? /* @__PURE__ */ I("span", {
|
|
574
574
|
className: "flex size-6 shrink-0 items-center justify-center",
|
|
575
575
|
children: t.leadingIcon
|
|
576
|
-
}) : t.isIconLoading ? /* @__PURE__ */
|
|
576
|
+
}) : t.isIconLoading ? /* @__PURE__ */ I(T, {
|
|
577
577
|
variant: ee.Circular,
|
|
578
578
|
width: p.LG,
|
|
579
579
|
height: p.LG,
|
|
580
580
|
color: Z.skeletonColor,
|
|
581
581
|
"aria-hidden": !0
|
|
582
|
-
}) : /* @__PURE__ */
|
|
582
|
+
}) : /* @__PURE__ */ I(e, {
|
|
583
583
|
src: t.iconUrl,
|
|
584
584
|
size: p.LG,
|
|
585
585
|
initialsName: t.iconTooltip ?? "",
|
|
586
|
-
labels:
|
|
587
|
-
styles:
|
|
588
|
-
}),
|
|
586
|
+
labels: ae,
|
|
587
|
+
styles: oe
|
|
588
|
+
}), z = ye(R, j), ce = t.isUnread ? /* @__PURE__ */ re("span", {
|
|
589
589
|
className: "flex size-6 shrink-0 items-center justify-center",
|
|
590
|
-
children: [/* @__PURE__ */
|
|
591
|
-
className: i("size-[7.11px] rounded-full", Z.unreadDot,
|
|
590
|
+
children: [/* @__PURE__ */ I("span", {
|
|
591
|
+
className: i("size-[7.11px] rounded-full", Z.unreadDot, R && (j ? "opacity-0" : "group-focus-within/conversation:opacity-0 group-hover/conversation:opacity-0")),
|
|
592
592
|
"aria-hidden": !0
|
|
593
|
-
}), /* @__PURE__ */
|
|
593
|
+
}), /* @__PURE__ */ I("span", {
|
|
594
594
|
className: "sr-only",
|
|
595
595
|
children: f
|
|
596
596
|
})]
|
|
597
|
-
}) : void 0, B = _ != null,
|
|
597
|
+
}) : void 0, B = _ != null, le = A((e) => {
|
|
598
598
|
e.currentTarget.contains(e.relatedTarget) || O?.();
|
|
599
|
-
}, [O]),
|
|
599
|
+
}, [O]), V = A((e) => {
|
|
600
600
|
if (!_ || !v || !k) return;
|
|
601
601
|
e.preventDefault();
|
|
602
|
-
let n =
|
|
602
|
+
let n = Ee(e, t.id, v, _);
|
|
603
603
|
k(t.id, _, n);
|
|
604
604
|
}, [
|
|
605
605
|
t.id,
|
|
606
606
|
v,
|
|
607
607
|
_,
|
|
608
608
|
k
|
|
609
|
-
]),
|
|
610
|
-
return /* @__PURE__ */
|
|
611
|
-
className: i("group/conversation relative",
|
|
609
|
+
]), H = t.id === x, U = t.id === S, W = _ != null && (C?.has(_) ?? !1), G = x != null;
|
|
610
|
+
return /* @__PURE__ */ re("li", {
|
|
611
|
+
className: i("group/conversation relative", H && "cursor-grabbing opacity-50", U && W && "rounded", U && W && Z.dropZoneActive, G && !H && !W && "cursor-not-allowed"),
|
|
612
612
|
draggable: B || void 0,
|
|
613
613
|
onDragStart: B ? () => w?.(t.id) : void 0,
|
|
614
614
|
onDragEnd: B ? E : void 0,
|
|
615
615
|
onDragOver: B ? (e) => {
|
|
616
616
|
e.preventDefault(), D?.(t.id);
|
|
617
617
|
} : void 0,
|
|
618
|
-
onDragLeave: B ?
|
|
619
|
-
onDrop: B ?
|
|
620
|
-
children: [/* @__PURE__ */
|
|
618
|
+
onDragLeave: B ? le : void 0,
|
|
619
|
+
onDrop: B ? V : void 0,
|
|
620
|
+
children: [/* @__PURE__ */ I("a", {
|
|
621
621
|
href: t.href,
|
|
622
622
|
className: "contents",
|
|
623
623
|
onClick: (e) => {
|
|
624
624
|
t.href && (e.preventDefault(), r(t.id));
|
|
625
625
|
},
|
|
626
|
-
children: /* @__PURE__ */
|
|
627
|
-
iconBefore:
|
|
628
|
-
label: /* @__PURE__ */
|
|
626
|
+
children: /* @__PURE__ */ I(d, {
|
|
627
|
+
iconBefore: se,
|
|
628
|
+
label: /* @__PURE__ */ I(b, {
|
|
629
629
|
text: t.title,
|
|
630
630
|
query: a,
|
|
631
631
|
className: t.isUnread ? "dial-small-semi-text" : l,
|
|
632
632
|
maxLines: 1
|
|
633
633
|
}),
|
|
634
|
-
iconAfter:
|
|
634
|
+
iconAfter: ce,
|
|
635
635
|
textClassName: "min-w-0 flex-1",
|
|
636
636
|
"aria-current": n ? "page" : void 0,
|
|
637
637
|
onClick: t.href ? void 0 : () => r(t.id),
|
|
638
638
|
tabIndex: t.href ? -1 : void 0,
|
|
639
|
-
className: i("h-8 w-full justify-start gap-2 py-2 ps-3 after:pointer-events-none",
|
|
639
|
+
className: i("h-8 w-full justify-start gap-2 py-2 ps-3 after:pointer-events-none", z, Z.item, n && Z.itemActive, j && Z.itemActive)
|
|
640
640
|
})
|
|
641
|
-
}),
|
|
641
|
+
}), R && /* @__PURE__ */ I("div", {
|
|
642
642
|
className: i("absolute inset-y-0 end-1 flex items-center", j ? "opacity-100" : "opacity-0 group-focus-within/conversation:opacity-100 group-hover/conversation:opacity-100"),
|
|
643
|
-
children: /* @__PURE__ */
|
|
644
|
-
items:
|
|
645
|
-
onOpenChange:
|
|
643
|
+
children: /* @__PURE__ */ I(h, {
|
|
644
|
+
items: L,
|
|
645
|
+
onOpenChange: ne,
|
|
646
646
|
matchReferenceWidth: !1,
|
|
647
647
|
listClassName: "w-[200px]",
|
|
648
|
-
children: /* @__PURE__ */
|
|
649
|
-
ref:
|
|
650
|
-
icon: /* @__PURE__ */
|
|
648
|
+
children: /* @__PURE__ */ I(y, {
|
|
649
|
+
ref: M,
|
|
650
|
+
icon: /* @__PURE__ */ I(ie, {
|
|
651
651
|
size: p.SM,
|
|
652
652
|
className: Z.triggerIcon,
|
|
653
653
|
"aria-hidden": !0,
|
|
@@ -660,15 +660,15 @@ var X = /* @__PURE__ */ function(e) {
|
|
|
660
660
|
})
|
|
661
661
|
})]
|
|
662
662
|
});
|
|
663
|
-
},
|
|
663
|
+
}), Ne = ({ index: e, style: n, rows: r, expandedGroups: i, onToggleGroup: a, listId: o, activeConversationId: s, searchQuery: c, onSelectConversation: l, getActions: u, onActionMenuOpen: d, actionsLabel: f, unreadIndicatorLabel: p, styles: m, draggingId: h, dragOverId: g, allowedDropGroups: _, onDragStart: v, onDragEnd: y, onDragOver: b, onDragLeave: x, onDrop: S }) => {
|
|
664
664
|
let C = r[e];
|
|
665
665
|
if (C.kind === X.Header) {
|
|
666
666
|
let r = C.groupKey === t.Pinned;
|
|
667
|
-
return /* @__PURE__ */
|
|
667
|
+
return /* @__PURE__ */ I("div", {
|
|
668
668
|
role: "presentation",
|
|
669
669
|
style: n,
|
|
670
670
|
className: e === 0 ? "pt-0" : "pt-8",
|
|
671
|
-
children: /* @__PURE__ */
|
|
671
|
+
children: /* @__PURE__ */ I(je, {
|
|
672
672
|
label: C.label,
|
|
673
673
|
isExpanded: i.has(C.groupKey),
|
|
674
674
|
onToggle: () => a(C.groupKey),
|
|
@@ -682,11 +682,11 @@ var X = /* @__PURE__ */ function(e) {
|
|
|
682
682
|
})
|
|
683
683
|
});
|
|
684
684
|
}
|
|
685
|
-
return /* @__PURE__ */
|
|
685
|
+
return /* @__PURE__ */ I("div", {
|
|
686
686
|
role: "presentation",
|
|
687
687
|
style: n,
|
|
688
688
|
className: "pt-1",
|
|
689
|
-
children: /* @__PURE__ */
|
|
689
|
+
children: /* @__PURE__ */ I(Me, {
|
|
690
690
|
item: C.item,
|
|
691
691
|
isActive: C.item.id === s,
|
|
692
692
|
searchQuery: c,
|
|
@@ -709,44 +709,44 @@ var X = /* @__PURE__ */ function(e) {
|
|
|
709
709
|
onDrop: S
|
|
710
710
|
})
|
|
711
711
|
});
|
|
712
|
-
},
|
|
712
|
+
}, Pe = (e, n) => n === t.All ? !0 : e.source === n, Fe = (e, t) => t ? e.title.toLowerCase().includes(t.toLowerCase()) : !0, Ie = new Set([
|
|
713
713
|
t.Pinned,
|
|
714
714
|
t.MyChats,
|
|
715
715
|
t.Shared,
|
|
716
716
|
t.Organization
|
|
717
|
-
]),
|
|
718
|
-
let { colors: D, typography: O, newChatButton: k, searchWrapperClassName:
|
|
717
|
+
]), Le = k(({ conversations: e, isLoading: r, isOpen: a, onSelectConversation: o, activeConversationId: d, labels: f, onNewChat: p, styles: m, className: h, isOverlay: g = !1, getActions: _, onActionMenuOpen: v, onToggle: y, headerActions: b, onMoveConversation: x, activeFilter: S, onActiveFilterChange: C, isFilterTabsHidden: ee = !1, hiddenSources: E }) => {
|
|
718
|
+
let { colors: D, typography: O, newChatButton: k, searchWrapperClassName: M, headerClassName: ne, headerActionsClassName: L, newChatButtonClassName: R } = m ?? {}, { title: ie, emptyLabel: ae, noResultsLabel: oe, loadingLabel: z = "Loading conversations", newChatLabel: ce, searchPlaceholder: B, searchClearLabel: le, filterLabels: V, groupLabels: H, actionsLabel: U, unreadIndicatorLabel: W, closeAriaLabel: G } = f, [K, ue] = F(""), [q, de] = F(t.All);
|
|
719
719
|
j(() => {
|
|
720
720
|
S != null && de(S);
|
|
721
721
|
}, [S]);
|
|
722
|
-
let J =
|
|
723
|
-
me(
|
|
724
|
-
}, []), Re = A((e) => {
|
|
725
|
-
ue(e ?? "");
|
|
722
|
+
let J = N(() => E?.length ? e.filter((e) => e.source == null || !E.includes(e.source)) : e, [e, E]), [Y, fe] = F(() => Ie), [pe, me] = F(5), he = te(), ge = P(null), ye = P(null), [xe, Ce] = F(null), [Ee, De] = F(null), [ke, je] = F(null), Me = P(null), Le = P(null), Re = A(({ height: e }) => {
|
|
723
|
+
me(Se(e));
|
|
726
724
|
}, []), ze = A((e) => {
|
|
725
|
+
ue(e ?? "");
|
|
726
|
+
}, []), Be = A((e) => {
|
|
727
727
|
fe((t) => {
|
|
728
728
|
let n = new Set(t);
|
|
729
729
|
return n.has(e) ? n.delete(e) : n.add(e), n;
|
|
730
730
|
});
|
|
731
|
-
}, []),
|
|
732
|
-
|
|
733
|
-
}, []),
|
|
734
|
-
let n =
|
|
735
|
-
|
|
736
|
-
}, [J]),
|
|
737
|
-
|
|
738
|
-
}, [
|
|
731
|
+
}, []), Ve = A(() => {
|
|
732
|
+
Me.current = null, Le.current = null, Ce(null), De(null), je(null);
|
|
733
|
+
}, []), He = A((e, t) => {
|
|
734
|
+
let n = Te(e, we(t, e), J);
|
|
735
|
+
Me.current = e, Le.current = n, Ce(e), je(n);
|
|
736
|
+
}, [J]), Ue = A(() => {
|
|
737
|
+
Ve();
|
|
738
|
+
}, [Ve]), We = A((e) => {
|
|
739
739
|
De(e);
|
|
740
|
-
}, []),
|
|
740
|
+
}, []), Ge = A(() => {
|
|
741
741
|
De(null);
|
|
742
|
-
}, []),
|
|
743
|
-
let r =
|
|
744
|
-
|
|
742
|
+
}, []), Ke = A((e, t, n) => {
|
|
743
|
+
let r = Me.current, i = Le.current;
|
|
744
|
+
Ve(), r != null && r !== e && i?.has(t) && x?.({
|
|
745
745
|
draggedId: r,
|
|
746
746
|
targetGroupKey: t,
|
|
747
747
|
afterId: n
|
|
748
748
|
});
|
|
749
|
-
}, [
|
|
749
|
+
}, [Ve, x]), qe = n({
|
|
750
750
|
"--cp-item-hover": D?.itemHover,
|
|
751
751
|
"--cp-item-active": D?.itemActive,
|
|
752
752
|
"--cp-text": D?.text,
|
|
@@ -760,40 +760,40 @@ var X = /* @__PURE__ */ function(e) {
|
|
|
760
760
|
"--cp-trigger-icon-idle": D?.triggerIconIdle,
|
|
761
761
|
"--cp-skeleton-color": D?.skeletonColor,
|
|
762
762
|
"--cp-unread-dot": D?.unreadDot
|
|
763
|
-
}), Q =
|
|
763
|
+
}), Q = N(() => J.filter((e) => Pe(e, q) && Fe(e, K)), [
|
|
764
764
|
J,
|
|
765
765
|
q,
|
|
766
766
|
K
|
|
767
|
-
]),
|
|
767
|
+
]), Je = N(() => Q.filter((e) => e.isPinned), [Q]), Ye = N(() => Q.filter((e) => !e.isPinned && e.source !== t.Shared && e.source !== t.Organization), [Q]), Xe = N(() => Q.filter((e) => !e.isPinned && e.source === t.Shared), [Q]), Ze = N(() => Q.filter((e) => !e.isPinned && e.source === t.Organization), [Q]), Qe = N(() => [
|
|
768
768
|
{
|
|
769
769
|
key: t.Pinned,
|
|
770
|
-
label:
|
|
771
|
-
items:
|
|
770
|
+
label: H?.pinned ?? "Pinned",
|
|
771
|
+
items: Je
|
|
772
772
|
},
|
|
773
773
|
{
|
|
774
774
|
key: t.MyChats,
|
|
775
|
-
label:
|
|
776
|
-
items:
|
|
775
|
+
label: H?.myChats ?? "My chats",
|
|
776
|
+
items: Ye
|
|
777
777
|
},
|
|
778
778
|
{
|
|
779
779
|
key: t.Shared,
|
|
780
|
-
label:
|
|
781
|
-
items:
|
|
780
|
+
label: H?.shared ?? "Shared",
|
|
781
|
+
items: Xe
|
|
782
782
|
},
|
|
783
783
|
{
|
|
784
784
|
key: t.Organization,
|
|
785
|
-
label:
|
|
786
|
-
items:
|
|
785
|
+
label: H?.organization ?? "Organization",
|
|
786
|
+
items: Ze
|
|
787
787
|
}
|
|
788
788
|
], [
|
|
789
|
-
|
|
790
|
-
qe,
|
|
789
|
+
H,
|
|
791
790
|
Je,
|
|
792
791
|
Ye,
|
|
793
|
-
Xe
|
|
794
|
-
|
|
792
|
+
Xe,
|
|
793
|
+
Ze
|
|
794
|
+
]), $ = N(() => {
|
|
795
795
|
let e = [];
|
|
796
|
-
for (let t of
|
|
796
|
+
for (let t of Qe) if (t.items.length !== 0 && (e.push({
|
|
797
797
|
kind: X.Header,
|
|
798
798
|
groupKey: t.key,
|
|
799
799
|
label: t.label
|
|
@@ -803,7 +803,7 @@ var X = /* @__PURE__ */ function(e) {
|
|
|
803
803
|
groupKey: t.key
|
|
804
804
|
});
|
|
805
805
|
return e;
|
|
806
|
-
}, [
|
|
806
|
+
}, [Qe, Y]);
|
|
807
807
|
j(() => {
|
|
808
808
|
if (!d || ye.current === d) return;
|
|
809
809
|
let e = $.findIndex((e) => e.kind === X.Item && e.item.id === d);
|
|
@@ -814,21 +814,25 @@ var X = /* @__PURE__ */ function(e) {
|
|
|
814
814
|
}), ye.current = d);
|
|
815
815
|
}, [
|
|
816
816
|
d,
|
|
817
|
-
|
|
817
|
+
Qe,
|
|
818
818
|
Y,
|
|
819
819
|
$
|
|
820
820
|
]);
|
|
821
|
-
let
|
|
821
|
+
let $e = P($);
|
|
822
|
+
j(() => {
|
|
823
|
+
$e.current = $;
|
|
824
|
+
}, [$]);
|
|
825
|
+
let et = A((e) => He(e, $e.current), [He]), tt = N(() => ({
|
|
822
826
|
rows: $,
|
|
823
827
|
expandedGroups: Y,
|
|
824
|
-
onToggleGroup:
|
|
828
|
+
onToggleGroup: Be,
|
|
825
829
|
listId: he,
|
|
826
830
|
activeConversationId: d,
|
|
827
831
|
searchQuery: K,
|
|
828
832
|
onSelectConversation: o,
|
|
829
833
|
getActions: _,
|
|
830
834
|
onActionMenuOpen: v,
|
|
831
|
-
actionsLabel:
|
|
835
|
+
actionsLabel: U,
|
|
832
836
|
unreadIndicatorLabel: W,
|
|
833
837
|
styles: {
|
|
834
838
|
groupHeaderClassName: O?.groupHeaderClassName,
|
|
@@ -836,44 +840,44 @@ var X = /* @__PURE__ */ function(e) {
|
|
|
836
840
|
itemIconBadgeClassName: m?.itemIconBadgeClassName
|
|
837
841
|
},
|
|
838
842
|
draggingId: xe,
|
|
839
|
-
dragOverId:
|
|
843
|
+
dragOverId: Ee,
|
|
840
844
|
allowedDropGroups: ke,
|
|
841
|
-
onDragStart:
|
|
842
|
-
onDragEnd:
|
|
843
|
-
onDragOver:
|
|
844
|
-
onDragLeave:
|
|
845
|
-
onDrop:
|
|
845
|
+
onDragStart: et,
|
|
846
|
+
onDragEnd: Ue,
|
|
847
|
+
onDragOver: We,
|
|
848
|
+
onDragLeave: Ge,
|
|
849
|
+
onDrop: Ke
|
|
846
850
|
}), [
|
|
847
851
|
$,
|
|
848
852
|
Y,
|
|
849
|
-
|
|
853
|
+
Be,
|
|
850
854
|
he,
|
|
851
855
|
d,
|
|
852
856
|
K,
|
|
853
857
|
o,
|
|
854
858
|
_,
|
|
855
859
|
v,
|
|
856
|
-
|
|
860
|
+
U,
|
|
857
861
|
W,
|
|
858
862
|
O?.groupHeaderClassName,
|
|
859
863
|
O?.itemTitleClassName,
|
|
860
864
|
m?.itemIconBadgeClassName,
|
|
861
865
|
xe,
|
|
862
|
-
|
|
866
|
+
Ee,
|
|
863
867
|
ke,
|
|
864
|
-
|
|
865
|
-
He,
|
|
868
|
+
et,
|
|
866
869
|
Ue,
|
|
867
870
|
We,
|
|
868
|
-
Ge
|
|
869
|
-
|
|
870
|
-
|
|
871
|
+
Ge,
|
|
872
|
+
Ke
|
|
873
|
+
]), nt = J.length === 0, rt = J.length > 0 && Q.length === 0;
|
|
874
|
+
return /* @__PURE__ */ re(u, {
|
|
871
875
|
isOpen: a,
|
|
872
876
|
isOverlay: g,
|
|
873
877
|
orientation: l.Left,
|
|
874
|
-
title:
|
|
878
|
+
title: ie,
|
|
875
879
|
labels: {
|
|
876
|
-
ariaLabel:
|
|
880
|
+
ariaLabel: ie,
|
|
877
881
|
closeLabel: G
|
|
878
882
|
},
|
|
879
883
|
onClose: y,
|
|
@@ -884,76 +888,76 @@ var X = /* @__PURE__ */ function(e) {
|
|
|
884
888
|
},
|
|
885
889
|
typography: { fontClassName: O?.fontClassName },
|
|
886
890
|
bodyClassName: "flex flex-col overflow-hidden p-0 gap-3",
|
|
887
|
-
cssVars:
|
|
891
|
+
cssVars: qe,
|
|
888
892
|
titleClassName: O?.fontClassName,
|
|
889
|
-
headerClassName: i("h-[64px]",
|
|
890
|
-
headerActionsClassName:
|
|
893
|
+
headerClassName: i("h-[64px]", ne),
|
|
894
|
+
headerActionsClassName: L,
|
|
891
895
|
className: i(a ? "w-[324px] mobile:w-full" : "w-0", h)
|
|
892
896
|
},
|
|
893
897
|
rightActions: b,
|
|
894
898
|
children: [
|
|
895
|
-
/* @__PURE__ */
|
|
896
|
-
label:
|
|
899
|
+
/* @__PURE__ */ I(Ae, {
|
|
900
|
+
label: ce,
|
|
897
901
|
onClick: p,
|
|
898
902
|
labelClassName: O?.newChatLabelClassName,
|
|
899
903
|
colors: k,
|
|
900
|
-
className:
|
|
904
|
+
className: R
|
|
901
905
|
}),
|
|
902
|
-
/* @__PURE__ */
|
|
906
|
+
/* @__PURE__ */ I("div", {
|
|
903
907
|
role: "search",
|
|
904
|
-
className: i("px-3 py-2",
|
|
905
|
-
children: /* @__PURE__ */
|
|
906
|
-
wrapperClassName: i(Z.search,
|
|
908
|
+
className: i("px-3 py-2", se.search),
|
|
909
|
+
children: /* @__PURE__ */ I(w, {
|
|
910
|
+
wrapperClassName: i(Z.search, M),
|
|
907
911
|
value: K,
|
|
908
|
-
onChange:
|
|
909
|
-
placeholder:
|
|
910
|
-
clearLabel:
|
|
911
|
-
"aria-label":
|
|
912
|
+
onChange: ze,
|
|
913
|
+
placeholder: B,
|
|
914
|
+
clearLabel: le,
|
|
915
|
+
"aria-label": B
|
|
912
916
|
})
|
|
913
917
|
}),
|
|
914
|
-
!ee && /* @__PURE__ */
|
|
918
|
+
!ee && /* @__PURE__ */ I(Oe, {
|
|
915
919
|
activeTab: q,
|
|
916
|
-
labels:
|
|
920
|
+
labels: V,
|
|
917
921
|
onChange: (e) => {
|
|
918
922
|
de(e), C?.(e);
|
|
919
923
|
},
|
|
920
924
|
tabClassName: O?.tabClassName,
|
|
921
925
|
hiddenSources: E
|
|
922
926
|
}),
|
|
923
|
-
/* @__PURE__ */
|
|
927
|
+
/* @__PURE__ */ I("span", {
|
|
924
928
|
role: "status",
|
|
925
929
|
"aria-live": "polite",
|
|
926
930
|
className: "sr-only",
|
|
927
|
-
children: r ?
|
|
931
|
+
children: r ? z : nt ? ae : rt ? oe : ""
|
|
928
932
|
}),
|
|
929
|
-
/* @__PURE__ */
|
|
933
|
+
/* @__PURE__ */ I("div", {
|
|
930
934
|
className: "flex-1 overflow-hidden px-3 py-1",
|
|
931
|
-
children: r ? /* @__PURE__ */
|
|
935
|
+
children: r ? /* @__PURE__ */ I("div", {
|
|
932
936
|
className: "flex flex-col gap-3 px-2 py-3",
|
|
933
|
-
children: Array.from({ length: 15 }, (e, t) => /* @__PURE__ */
|
|
937
|
+
children: Array.from({ length: 15 }, (e, t) => /* @__PURE__ */ I(T, {
|
|
934
938
|
avatar: { size: 24 },
|
|
935
939
|
showTitle: { width: ve(t) },
|
|
936
940
|
paragraph: !1,
|
|
937
941
|
active: !0,
|
|
938
942
|
color: Z.skeletonColor
|
|
939
943
|
}, t))
|
|
940
|
-
}) :
|
|
944
|
+
}) : nt ? /* @__PURE__ */ I(s, { label: ae }) : rt ? /* @__PURE__ */ I(c, { label: oe }) : /* @__PURE__ */ I(_e, {
|
|
941
945
|
listRef: ge,
|
|
942
946
|
id: he,
|
|
943
947
|
role: "list",
|
|
944
948
|
style: { height: "100%" },
|
|
945
|
-
rowComponent:
|
|
949
|
+
rowComponent: Ne,
|
|
946
950
|
rowCount: $.length,
|
|
947
951
|
rowHeight: be,
|
|
948
952
|
overscanCount: pe,
|
|
949
|
-
onResize:
|
|
950
|
-
rowProps:
|
|
953
|
+
onResize: Re,
|
|
954
|
+
rowProps: tt
|
|
951
955
|
})
|
|
952
956
|
})
|
|
953
957
|
]
|
|
954
958
|
});
|
|
955
|
-
}),
|
|
956
|
-
let [h, g] =
|
|
959
|
+
}), Re = k(({ isOpen: e, currentTitle: t, isSaving: n, error: i, onSave: s, onCancel: c, onGenerateWithAi: l, labels: u, styles: d }) => {
|
|
960
|
+
let [h, g] = F(t), [_, v] = F(!1), [b, w] = F(null), T = P(null), ee = P(!1), D = P(0);
|
|
957
961
|
j(() => {
|
|
958
962
|
let n = e && !ee.current;
|
|
959
963
|
if (ee.current = e, !e) {
|
|
@@ -967,15 +971,15 @@ var X = /* @__PURE__ */ function(e) {
|
|
|
967
971
|
}, [e, t]), j(() => () => {
|
|
968
972
|
D.current += 1;
|
|
969
973
|
}, []);
|
|
970
|
-
let O = o(h.trim()), k = r(O) > 255,
|
|
971
|
-
|
|
974
|
+
let O = o(h.trim()), k = r(O) > 255, te = n || O === "" || O === t.trim() || k, M = A(() => {
|
|
975
|
+
te || s(O);
|
|
972
976
|
}, [
|
|
973
|
-
|
|
977
|
+
te,
|
|
974
978
|
s,
|
|
975
979
|
O
|
|
976
|
-
]),
|
|
977
|
-
e.key === "Enter" &&
|
|
978
|
-
}, [
|
|
980
|
+
]), ne = A((e) => {
|
|
981
|
+
e.key === "Enter" && M();
|
|
982
|
+
}, [M]), N = A(async () => {
|
|
979
983
|
if (_) return;
|
|
980
984
|
let e = ++D.current;
|
|
981
985
|
v(!0), w(null);
|
|
@@ -993,8 +997,8 @@ var X = /* @__PURE__ */ function(e) {
|
|
|
993
997
|
_,
|
|
994
998
|
l,
|
|
995
999
|
u.renameWithAiError
|
|
996
|
-
]),
|
|
997
|
-
return
|
|
1000
|
+
]), L;
|
|
1001
|
+
return L = k ? u.nameTooLongError : b ?? i ?? void 0, /* @__PURE__ */ I(S, {
|
|
998
1002
|
open: e,
|
|
999
1003
|
header: u.popupTitle,
|
|
1000
1004
|
size: C.Sm,
|
|
@@ -1005,33 +1009,33 @@ var X = /* @__PURE__ */ function(e) {
|
|
|
1005
1009
|
}, {
|
|
1006
1010
|
label: u.saveLabel,
|
|
1007
1011
|
variant: f.Primary,
|
|
1008
|
-
disabled:
|
|
1009
|
-
onClick:
|
|
1012
|
+
disabled: te,
|
|
1013
|
+
onClick: M
|
|
1010
1014
|
}],
|
|
1011
|
-
children: /* @__PURE__ */
|
|
1015
|
+
children: /* @__PURE__ */ I("div", {
|
|
1012
1016
|
className: d?.bodyClassName,
|
|
1013
1017
|
style: d?.cssVars,
|
|
1014
|
-
children: n ? /* @__PURE__ */
|
|
1018
|
+
children: n ? /* @__PURE__ */ I("div", {
|
|
1015
1019
|
className: "h-[120px] px-6 py-4",
|
|
1016
|
-
children: /* @__PURE__ */
|
|
1017
|
-
}) : /* @__PURE__ */
|
|
1020
|
+
children: /* @__PURE__ */ I(E, { size: 50 })
|
|
1021
|
+
}) : /* @__PURE__ */ re("div", {
|
|
1018
1022
|
className: "flex items-start gap-2 px-6 py-3",
|
|
1019
|
-
children: [/* @__PURE__ */
|
|
1023
|
+
children: [/* @__PURE__ */ I("div", {
|
|
1020
1024
|
className: "min-w-0 flex-1",
|
|
1021
|
-
children: /* @__PURE__ */
|
|
1025
|
+
children: /* @__PURE__ */ I(x, {
|
|
1022
1026
|
inputRef: T,
|
|
1023
1027
|
value: h,
|
|
1024
1028
|
placeholder: u.inputPlaceholder,
|
|
1025
|
-
error:
|
|
1029
|
+
error: L,
|
|
1026
1030
|
onChange: (e) => g(a(e ?? "")),
|
|
1027
|
-
onKeyDown:
|
|
1031
|
+
onKeyDown: ne
|
|
1028
1032
|
})
|
|
1029
|
-
}), /* @__PURE__ */
|
|
1033
|
+
}), /* @__PURE__ */ I(y, {
|
|
1030
1034
|
"aria-label": u.renameWithAiLabel,
|
|
1031
1035
|
tooltipProps: { tooltip: u.renameWithAiLabel },
|
|
1032
1036
|
disabled: _ || n,
|
|
1033
|
-
onClick:
|
|
1034
|
-
icon: _ ? /* @__PURE__ */
|
|
1037
|
+
onClick: N,
|
|
1038
|
+
icon: _ ? /* @__PURE__ */ I(E, { size: p.MD }) : /* @__PURE__ */ I(oe, {
|
|
1035
1039
|
size: p.MD,
|
|
1036
1040
|
stroke: m
|
|
1037
1041
|
})
|
|
@@ -1040,6 +1044,6 @@ var X = /* @__PURE__ */ function(e) {
|
|
|
1040
1044
|
})
|
|
1041
1045
|
});
|
|
1042
1046
|
});
|
|
1043
|
-
|
|
1047
|
+
Re.displayName = "RenameConversationPopup";
|
|
1044
1048
|
//#endregion
|
|
1045
|
-
export {
|
|
1049
|
+
export { se as CONVERSATION_PANEL_CLASS, Le as ConversationPanel, Re as RenameConversationPopup };
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@epam/ai-dial-conversation-panel",
|
|
3
3
|
"description": "Virtualized sidebar panel for browsing conversation history with grouping, tabs, and search",
|
|
4
|
-
"version": "1.2.0-dev.
|
|
4
|
+
"version": "1.2.0-dev.219",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"type": "module",
|
|
7
7
|
"main": "./index.js",
|
|
@@ -19,11 +19,11 @@
|
|
|
19
19
|
"dependencies": {
|
|
20
20
|
"react-window": "^2.2.7",
|
|
21
21
|
"@tabler/icons-react": "^3.44.0",
|
|
22
|
-
"@epam/ai-dial-sidebar": "1.2.0-dev.
|
|
22
|
+
"@epam/ai-dial-sidebar": "1.2.0-dev.219"
|
|
23
23
|
},
|
|
24
24
|
"peerDependencies": {
|
|
25
25
|
"react": "^19.2.8",
|
|
26
|
-
"@epam/ai-dial-chat-shared": "1.2.0-dev.
|
|
26
|
+
"@epam/ai-dial-chat-shared": "1.2.0-dev.219",
|
|
27
27
|
"@epam/ai-dial-ui-kit": "^0.15.0-dev.27"
|
|
28
28
|
},
|
|
29
29
|
"repository": {
|
|
@@ -14,4 +14,6 @@ export declare const getSkeletonWidth: (i: number) => string;
|
|
|
14
14
|
export declare const getButtonPaddingEnd: (hasActions: boolean, isMenuOpen: boolean) => string;
|
|
15
15
|
/** Returns the pixel height for a virtual list row (item, first group header, or subsequent group header). */
|
|
16
16
|
export declare const getRowHeight: (index: number, rowProps: RowRendererData) => number;
|
|
17
|
+
/** Returns how many rows to render beyond each edge of a viewport `height` pixels tall: half a viewport, at least 5. */
|
|
18
|
+
export declare const getOverscanCount: (height: number) => number;
|
|
17
19
|
//# sourceMappingURL=conversation-row.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"conversation-row.d.ts","sourceRoot":"","sources":["../../src/utils/conversation-row.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAG7D,iFAAiF;AACjF,eAAO,MAAM,kBAAkB,KAAK,CAAC;AAErC,4FAA4F;AAC5F,eAAO,MAAM,gBAAgB,GAAI,GAAG,MAAM,WAA+B,CAAC;AAE1E;;;;;;;GAOG;AACH,eAAO,MAAM,mBAAmB,GAC9B,YAAY,OAAO,EACnB,YAAY,OAAO,KAClB,MAIF,CAAC;AAEF,8GAA8G;AAC9G,eAAO,MAAM,YAAY,GACvB,OAAO,MAAM,EACb,UAAU,eAAe,KACxB,MAIF,CAAC"}
|
|
1
|
+
{"version":3,"file":"conversation-row.d.ts","sourceRoot":"","sources":["../../src/utils/conversation-row.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAG7D,iFAAiF;AACjF,eAAO,MAAM,kBAAkB,KAAK,CAAC;AAErC,4FAA4F;AAC5F,eAAO,MAAM,gBAAgB,GAAI,GAAG,MAAM,WAA+B,CAAC;AAE1E;;;;;;;GAOG;AACH,eAAO,MAAM,mBAAmB,GAC9B,YAAY,OAAO,EACnB,YAAY,OAAO,KAClB,MAIF,CAAC;AAEF,8GAA8G;AAC9G,eAAO,MAAM,YAAY,GACvB,OAAO,MAAM,EACb,UAAU,eAAe,KACxB,MAIF,CAAC;AAKF,wHAAwH;AACxH,eAAO,MAAM,gBAAgB,GAAI,QAAQ,MAAM,KAAG,MAI/C,CAAC"}
|