@epam/ai-dial-source-panel 1.0.0-dev.471 → 1.0.0-dev.475
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.
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ConversationSourcesPanel.d.ts","sourceRoot":"","sources":["../../../src/components/ConversationSourcesPanel/ConversationSourcesPanel.tsx"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,6BAA6B,EAAE,MAAM,+CAA+C,CAAC;AAGnG,YAAY,EACV,8BAA8B,EAC9B,6BAA6B,EAC7B,8BAA8B,GAC/B,MAAM,+CAA+C,CAAC;;
|
|
1
|
+
{"version":3,"file":"ConversationSourcesPanel.d.ts","sourceRoot":"","sources":["../../../src/components/ConversationSourcesPanel/ConversationSourcesPanel.tsx"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,6BAA6B,EAAE,MAAM,+CAA+C,CAAC;AAGnG,YAAY,EACV,8BAA8B,EAC9B,6BAA6B,EAC7B,8BAA8B,GAC/B,MAAM,+CAA+C,CAAC;;AAgJvD,wBAA8C"}
|
|
@@ -1,4 +1,11 @@
|
|
|
1
1
|
import { QuotationSource } from '../../models/quotation-source';
|
|
2
|
+
/** CSS custom-property overrides for the `SourcesSection` component. */
|
|
3
|
+
interface SourcesSectionColors {
|
|
4
|
+
/** Source link color. */
|
|
5
|
+
link?: string;
|
|
6
|
+
/** Source quote text color. */
|
|
7
|
+
quote?: string;
|
|
8
|
+
}
|
|
2
9
|
interface SourcesSectionProps {
|
|
3
10
|
/** Heading text for the sources section. */
|
|
4
11
|
title: string;
|
|
@@ -6,6 +13,8 @@ interface SourcesSectionProps {
|
|
|
6
13
|
sources: QuotationSource[];
|
|
7
14
|
/** Accessible label for each source's copy-URL button. */
|
|
8
15
|
copyLabel: string;
|
|
16
|
+
/** Status message announced to assistive tech after a source URL is copied. Defaults to `'Link copied to clipboard'`. */
|
|
17
|
+
copiedLabel?: string;
|
|
9
18
|
/** Current search query — used to highlight matches in source titles and quotes. */
|
|
10
19
|
searchQuery?: string;
|
|
11
20
|
/** CSS class applied to the section heading. Defaults to `'dial-body-semi-text'`. */
|
|
@@ -14,6 +23,8 @@ interface SourcesSectionProps {
|
|
|
14
23
|
linkClassName?: string;
|
|
15
24
|
/** CSS class applied to the quote text. Defaults to `'dial-tiny-text'`. */
|
|
16
25
|
quoteClassName?: string;
|
|
26
|
+
/** Color overrides applied as CSS custom properties. */
|
|
27
|
+
colors?: SourcesSectionColors;
|
|
17
28
|
/** When provided, called on source link click instead of following the href. */
|
|
18
29
|
onSourceClick?: (source: QuotationSource) => void;
|
|
19
30
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SourcesSection.d.ts","sourceRoot":"","sources":["../../../src/components/SourcesSection/SourcesSection.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"SourcesSection.d.ts","sourceRoot":"","sources":["../../../src/components/SourcesSection/SourcesSection.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,+BAA+B,CAAC;AAGrE,wEAAwE;AACxE,UAAU,oBAAoB;IAC5B,yBAAyB;IACzB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,+BAA+B;IAC/B,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,UAAU,mBAAmB;IAC3B,4CAA4C;IAC5C,KAAK,EAAE,MAAM,CAAC;IACd,kCAAkC;IAClC,OAAO,EAAE,eAAe,EAAE,CAAC;IAC3B,0DAA0D;IAC1D,SAAS,EAAE,MAAM,CAAC;IAClB,yHAAyH;IACzH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,oFAAoF;IACpF,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,qFAAqF;IACrF,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,8EAA8E;IAC9E,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,2EAA2E;IAC3E,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,wDAAwD;IACxD,MAAM,CAAC,EAAE,oBAAoB,CAAC;IAC9B,gFAAgF;IAChF,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,eAAe,KAAK,IAAI,CAAC;CACnD;;AAmGD,wBAAoC"}
|
package/index.css
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
.
|
|
1
|
+
._link_1f4sp_1{color:var(--sp-source-link,var(--text-accent-primary,#124ace))}._quote_1f4sp_5{color:var(--sp-source-quote,var(--text-primary,#161b2d))}
|
|
2
2
|
/*$vite$:1*/
|
package/index.js
CHANGED
|
@@ -2,21 +2,21 @@ import { PanelEmpty as e, PanelNoResults as t, SearchInput as n, SidebarOrientat
|
|
|
2
2
|
import { DIAL_ICON_SIZE as a, DialGhostIconButton as o, ElementSize as s } from "@epam/ai-dial-ui-kit";
|
|
3
3
|
import { IconCopy as c, IconDownload as l } from "@tabler/icons-react";
|
|
4
4
|
import { memo as u, useLayoutEffect as d, useMemo as f, useState as p } from "react";
|
|
5
|
-
import { AttachmentType as m, Highlight as h,
|
|
6
|
-
import { AttachmentCard as
|
|
7
|
-
import { Fragment as
|
|
8
|
-
var
|
|
5
|
+
import { AttachmentType as m, Highlight as h, buildCssVars as g, mergeClasses as _ } from "@epam/ai-dial-chat-shared";
|
|
6
|
+
import { AttachmentCard as v } from "@epam/ai-dial-conversation-input";
|
|
7
|
+
import { Fragment as y, jsx as b, jsxs as x } from "react/jsx-runtime";
|
|
8
|
+
var S = u(({ attachments: e, title: t, searchQuery: n, titleClassName: r = "dial-body-semi-text", onAttachmentClick: i, attachmentClickLabel: a }) => e.length === 0 ? null : /* @__PURE__ */ x("section", {
|
|
9
9
|
className: "mb-6",
|
|
10
|
-
children: [/* @__PURE__ */
|
|
11
|
-
className:
|
|
10
|
+
children: [/* @__PURE__ */ b("h2", {
|
|
11
|
+
className: _(r, "mb-3"),
|
|
12
12
|
children: t
|
|
13
|
-
}), /* @__PURE__ */
|
|
13
|
+
}), /* @__PURE__ */ b("div", {
|
|
14
14
|
role: "list",
|
|
15
15
|
className: "grid grid-cols-[repeat(auto-fill,minmax(100px,1fr))] gap-3",
|
|
16
|
-
children: e.map((e) => /* @__PURE__ */
|
|
16
|
+
children: e.map((e) => /* @__PURE__ */ b("div", {
|
|
17
17
|
role: "listitem",
|
|
18
18
|
className: e.type === m.Audio ? "col-span-full" : void 0,
|
|
19
|
-
children: /* @__PURE__ */
|
|
19
|
+
children: /* @__PURE__ */ b(v, {
|
|
20
20
|
attachment: e,
|
|
21
21
|
searchQuery: n,
|
|
22
22
|
className: "w-full",
|
|
@@ -25,112 +25,144 @@ var x = u(({ attachments: e, title: t, searchQuery: n, titleClassName: r = "dial
|
|
|
25
25
|
})
|
|
26
26
|
}, e.id))
|
|
27
27
|
})]
|
|
28
|
-
})),
|
|
29
|
-
link: "
|
|
30
|
-
quote: "
|
|
31
|
-
},
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
28
|
+
})), C = {
|
|
29
|
+
link: "_link_1f4sp_1",
|
|
30
|
+
quote: "_quote_1f4sp_5"
|
|
31
|
+
}, w = u(({ title: e, sources: t, copyLabel: n, copiedLabel: r = "Link copied to clipboard", searchQuery: i = "", titleClassName: l = "dial-body-semi-text", linkClassName: u = "dial-small-text", quoteClassName: d = "dial-tiny-text", colors: m, onSourceClick: v }) => {
|
|
32
|
+
let [y, S] = p(""), w = f(() => g({
|
|
33
|
+
"--sp-source-link": m?.link,
|
|
34
|
+
"--sp-source-quote": m?.quote
|
|
35
|
+
}), [m]);
|
|
36
|
+
if (t.length === 0) return null;
|
|
37
|
+
let T = async (e) => {
|
|
38
|
+
await navigator.clipboard.writeText(e), S(r);
|
|
39
|
+
};
|
|
40
|
+
return /* @__PURE__ */ x("section", {
|
|
41
|
+
className: "mb-6",
|
|
42
|
+
style: w,
|
|
43
|
+
children: [
|
|
44
|
+
/* @__PURE__ */ b("h2", {
|
|
45
|
+
className: _(l, "mb-3"),
|
|
46
|
+
children: e
|
|
47
|
+
}),
|
|
48
|
+
/* @__PURE__ */ b("ul", {
|
|
49
|
+
className: "flex flex-col gap-3",
|
|
50
|
+
children: t.map((e) => /* @__PURE__ */ x("li", {
|
|
51
|
+
className: "flex flex-col gap-1",
|
|
52
|
+
children: [/* @__PURE__ */ x("div", {
|
|
53
|
+
className: "flex min-w-0 items-center justify-between gap-2",
|
|
54
|
+
children: [/* @__PURE__ */ b("a", {
|
|
55
|
+
href: e.url,
|
|
56
|
+
target: "_blank",
|
|
57
|
+
rel: "noopener noreferrer",
|
|
58
|
+
className: _(u, C.link, "min-w-0 flex-1 truncate"),
|
|
59
|
+
onClick: v ? (t) => {
|
|
60
|
+
t.preventDefault(), v(e);
|
|
61
|
+
} : void 0,
|
|
62
|
+
children: i ? /* @__PURE__ */ b(h, {
|
|
63
|
+
text: e.title,
|
|
64
|
+
query: i,
|
|
65
|
+
maxLines: 1
|
|
66
|
+
}) : e.title
|
|
67
|
+
}), /* @__PURE__ */ b(o, {
|
|
68
|
+
size: s.Small,
|
|
69
|
+
icon: /* @__PURE__ */ b(c, {
|
|
70
|
+
size: a.SM,
|
|
71
|
+
stroke: 1.5,
|
|
72
|
+
"aria-hidden": !0
|
|
73
|
+
}),
|
|
74
|
+
"aria-label": n,
|
|
75
|
+
onClick: () => void T(e.url)
|
|
76
|
+
})]
|
|
77
|
+
}), e.quote && /* @__PURE__ */ b("p", {
|
|
78
|
+
className: _(d, C.quote, "line-clamp-5 max-h-[80px] overflow-hidden"),
|
|
79
|
+
children: e.quote
|
|
80
|
+
})]
|
|
81
|
+
}, e.url))
|
|
82
|
+
}),
|
|
83
|
+
/* @__PURE__ */ b("span", {
|
|
84
|
+
role: "status",
|
|
85
|
+
"aria-live": "polite",
|
|
86
|
+
className: "sr-only",
|
|
87
|
+
children: y
|
|
88
|
+
})
|
|
89
|
+
]
|
|
90
|
+
});
|
|
91
|
+
}), T = (e, t) => e.toLowerCase().includes(t.toLowerCase()), E = u(({ isOpen: s, onClose: c, uploaded: u, generated: m, sources: h, onAttachmentClick: g, onSourceClick: _, isMobile: v, defaultWidth: C, minWidth: E, maxWidth: D, onResizeStop: O, labels: k, styles: A }) => {
|
|
71
92
|
let [j, M] = p("");
|
|
72
93
|
d(() => {
|
|
73
94
|
s || M("");
|
|
74
95
|
}, [s]);
|
|
75
|
-
let N = f(() => j ? u.filter((e) =>
|
|
76
|
-
return /* @__PURE__ */
|
|
96
|
+
let N = f(() => j ? u.filter((e) => T(e.name, j)) : u, [u, j]), P = f(() => j ? m.filter((e) => T(e.name, j)) : m, [m, j]), F = f(() => j ? h.filter((e) => T(e.title, j) || T(e.url, j) || e.quote != null && T(e.quote, j)) : h, [h, j]), I = u.length === 0 && m.length === 0 && h.length === 0, L = j !== "" && N.length === 0 && P.length === 0 && F.length === 0;
|
|
97
|
+
return /* @__PURE__ */ x(i, {
|
|
77
98
|
isOpen: s,
|
|
78
99
|
orientation: r.Right,
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
100
|
+
styles: {
|
|
101
|
+
className: s ? "mobile:w-full" : "w-0",
|
|
102
|
+
bodyClassName: "flex flex-col overflow-hidden p-0"
|
|
103
|
+
},
|
|
104
|
+
labels: k,
|
|
83
105
|
onClose: c,
|
|
84
|
-
resizable: !
|
|
85
|
-
defaultWidth:
|
|
106
|
+
resizable: !v,
|
|
107
|
+
defaultWidth: C,
|
|
86
108
|
minWidth: E,
|
|
87
109
|
maxWidth: D,
|
|
88
110
|
onResizeStop: O,
|
|
89
|
-
rightActions: !I && /* @__PURE__ */
|
|
90
|
-
icon: /* @__PURE__ */
|
|
111
|
+
rightActions: !I && /* @__PURE__ */ b(o, {
|
|
112
|
+
icon: /* @__PURE__ */ b(l, {
|
|
91
113
|
size: a.LG,
|
|
92
|
-
stroke: 1.5
|
|
114
|
+
stroke: 1.5,
|
|
115
|
+
"aria-hidden": !0
|
|
93
116
|
}),
|
|
94
117
|
"aria-label": k.downloadAllLabel,
|
|
95
118
|
disabled: !0
|
|
96
119
|
}),
|
|
97
|
-
children: [
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
}),
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
120
|
+
children: [
|
|
121
|
+
!I && /* @__PURE__ */ b(n, {
|
|
122
|
+
placeholder: k.searchPlaceholder,
|
|
123
|
+
value: j,
|
|
124
|
+
onChange: M,
|
|
125
|
+
clearLabel: k.searchClearLabel
|
|
126
|
+
}),
|
|
127
|
+
/* @__PURE__ */ b("span", {
|
|
128
|
+
role: "status",
|
|
129
|
+
"aria-live": "polite",
|
|
130
|
+
className: "sr-only",
|
|
131
|
+
children: L ? k.noResultsLabel : ""
|
|
132
|
+
}),
|
|
133
|
+
/* @__PURE__ */ b("div", {
|
|
134
|
+
className: "flex-1 overflow-y-auto p-4",
|
|
135
|
+
children: I ? /* @__PURE__ */ b(e, { label: k.emptyLabel }) : L ? /* @__PURE__ */ b(t, { label: k.noResultsLabel }) : /* @__PURE__ */ x(y, { children: [
|
|
136
|
+
/* @__PURE__ */ b(S, {
|
|
137
|
+
attachments: N,
|
|
138
|
+
title: k.uploadedSectionTitle,
|
|
139
|
+
searchQuery: j,
|
|
140
|
+
titleClassName: A?.sectionTitleClassName,
|
|
141
|
+
onAttachmentClick: g,
|
|
142
|
+
attachmentClickLabel: k.attachmentClickLabel
|
|
143
|
+
}),
|
|
144
|
+
/* @__PURE__ */ b(S, {
|
|
145
|
+
attachments: P,
|
|
146
|
+
title: k.generatedSectionTitle,
|
|
147
|
+
searchQuery: j,
|
|
148
|
+
titleClassName: A?.sectionTitleClassName,
|
|
149
|
+
onAttachmentClick: g,
|
|
150
|
+
attachmentClickLabel: k.attachmentClickLabel
|
|
151
|
+
}),
|
|
152
|
+
/* @__PURE__ */ b(w, {
|
|
153
|
+
sources: F,
|
|
154
|
+
title: k.sourcesSectionTitle,
|
|
155
|
+
searchQuery: j,
|
|
156
|
+
titleClassName: A?.sectionTitleClassName,
|
|
157
|
+
linkClassName: A?.sourceLinkClassName,
|
|
158
|
+
quoteClassName: A?.sourceQuoteClassName,
|
|
159
|
+
copyLabel: k.copySourceLabel,
|
|
160
|
+
onSourceClick: _
|
|
161
|
+
})
|
|
162
|
+
] })
|
|
163
|
+
})
|
|
164
|
+
]
|
|
133
165
|
});
|
|
134
166
|
});
|
|
135
167
|
//#endregion
|
|
136
|
-
export {
|
|
168
|
+
export { E as ConversationSourcesPanel };
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@epam/ai-dial-source-panel",
|
|
3
3
|
"description": "Panel for displaying conversation sources — uploaded files and generated citations",
|
|
4
|
-
"version": "1.0.0-dev.
|
|
4
|
+
"version": "1.0.0-dev.475",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"type": "module",
|
|
7
7
|
"main": "./index.js",
|
|
@@ -19,10 +19,10 @@
|
|
|
19
19
|
"peerDependencies": {
|
|
20
20
|
"react": "^19.0.0",
|
|
21
21
|
"@tabler/icons-react": "^3.0.0",
|
|
22
|
-
"@epam/ai-dial-chat-shared": "1.0.0-dev.
|
|
22
|
+
"@epam/ai-dial-chat-shared": "1.0.0-dev.475",
|
|
23
23
|
"@epam/ai-dial-ui-kit": "0.12.0-dev.28",
|
|
24
|
-
"@epam/ai-dial-sidebar": "1.0.0-dev.
|
|
25
|
-
"@epam/ai-dial-conversation-input": "1.0.0-dev.
|
|
24
|
+
"@epam/ai-dial-sidebar": "1.0.0-dev.475",
|
|
25
|
+
"@epam/ai-dial-conversation-input": "1.0.0-dev.475"
|
|
26
26
|
},
|
|
27
27
|
"repository": {
|
|
28
28
|
"type": "git",
|