@epam/ai-dial-source-panel 1.2.0-dev.48 → 1.2.0-dev.50

package/components/ConversationSourcesPanel/ConversationSourcesPanel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ConversationSourcesPanel.d.ts","sourceRoot":"","sources":["../../../src/components/ConversationSourcesPanel/ConversationSourcesPanel.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAAK,EAAE,6BAA6B,EAAE,MAAM,+CAA+C,CAAC;;AAiLnG,wBAA8C"}
+{"version":3,"file":"ConversationSourcesPanel.d.ts","sourceRoot":"","sources":["../../../src/components/ConversationSourcesPanel/ConversationSourcesPanel.tsx"],"names":[],"mappings":"AAsBA,OAAO,KAAK,EAAE,6BAA6B,EAAE,MAAM,+CAA+C,CAAC;;AAoLnG,wBAA8C"}

package/constants/public-class-names.d.ts

@@ -0,0 +1,11 @@
+export declare const SOURCE_PANEL_CLASS: {
+    /**
+     * The panel wrapper — the element `@epam/ai-dial-sidebar` gives the panel's
+     * width and slide transition, which is the outer box a host sizes or
+     * positions. It is **not** the `aside` inside it: that one carries
+     * `dial-sb-aside`, so a host targeting the region itself descends from this
+     * class.
+     */
+    readonly panel: "dial-source-panel-panel";
+};
+//# sourceMappingURL=public-class-names.d.ts.map

package/constants/public-class-names.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"public-class-names.d.ts","sourceRoot":"","sources":["../../src/constants/public-class-names.ts"],"names":[],"mappings":"AAUA,eAAO,MAAM,kBAAkB;IAC7B;;;;;;OAMG;;CAEK,CAAC"}

package/index.css

@@ -1,2 +1,2 @@
 ._link_12icw_1{color:var(--sp-source-link,var(--text-info,#1d4ed8))}._quote_12icw_5{color:var(--sp-source-quote,var(--text-primary,#161b2d))}
-/*$vite$:1*/.sr-only{height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;clip:rect(0,0,0,0);border-width:0;white-space:nowrap}.visible{visibility:visible}.mb-3{margin-bottom:.75rem}.mb-6{margin-bottom:1.5rem}.line-clamp-5{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:5}.flex{display:flex}.grid{display:grid}.h-full{height:100%}.w-full{width:100%}.min-w-0{min-width:0}.flex-1{flex:1 1 0%}.resize{resize:both}.grid-cols-\[repeat\(auto-fill\2c minmax\(84px\2c 1fr\)\)\]{grid-template-columns:repeat(auto-fill,minmax(84px,1fr))}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-start{justify-content:flex-start}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-1{gap:.25rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.overflow-hidden{overflow:hidden}.overflow-y-auto{overflow-y:auto}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.p-0{padding:0}.p-4{padding:1rem}.px-3{padding-left:.75rem;padding-right:.75rem}.py-2{padding-bottom:.5rem;padding-top:.5rem}.pt-0{padding-top:0}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.\[\&\>div\>\*\+\*\]\:mt-1>div>*+*{margin-top:.25rem}
+/*$vite$:1*/.sr-only{height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;clip:rect(0,0,0,0);border-width:0;white-space:nowrap}.visible{visibility:visible}.mb-3{margin-bottom:.75rem}.mb-6{margin-bottom:1.5rem}.line-clamp-5{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:5}.flex{display:flex}.grid{display:grid}.h-full{height:100%}.w-full{width:100%}.min-w-0{min-width:0}.flex-1{flex:1 1 0%}.resize{resize:both}.grid-cols-\[repeat\(auto-fill\2c minmax\(84px\2c 1fr\)\)\]{grid-template-columns:repeat(auto-fill,minmax(84px,1fr))}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-start{justify-content:flex-start}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-1{gap:.25rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.overflow-hidden{overflow:hidden}.overflow-y-auto{overflow-y:auto}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.p-0{padding:0}.p-4{padding:1rem}.px-3{padding-left:.75rem;padding-right:.75rem}.py-2{padding-bottom:.5rem;padding-top:.5rem}.pt-0{padding-top:0}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.transition{transition-duration:.15s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1)}.\[\&\>div\>\*\+\*\]\:mt-1>div>*+*{margin-top:.25rem}

package/index.d.ts

@@ -1,4 +1,5 @@
 export { default as ConversationSourcesPanel } from './components/ConversationSourcesPanel/ConversationSourcesPanel';
 export type { ConversationSourcesPanelColors, ConversationSourcesPanelLabels, ConversationSourcesPanelProps, ConversationSourcesPanelStyles, ConversationSourcesPanelTypography, } from './models/conversation-sources-panel-props';
 export type { QuotationSource } from './models/quotation-source';
+export { SOURCE_PANEL_CLASS } from './constants/public-class-names';
 //# sourceMappingURL=index.d.ts.map

package/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,wBAAwB,EAAE,MAAM,gEAAgE,CAAC;AACrH,YAAY,EACV,8BAA8B,EAC9B,8BAA8B,EAC9B,6BAA6B,EAC7B,8BAA8B,EAC9B,kCAAkC,GACnC,MAAM,2CAA2C,CAAC;AACnD,YAAY,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,wBAAwB,EAAE,MAAM,gEAAgE,CAAC;AACrH,YAAY,EACV,8BAA8B,EAC9B,8BAA8B,EAC9B,6BAA6B,EAC7B,8BAA8B,EAC9B,kCAAkC,GACnC,MAAM,2CAA2C,CAAC;AACnD,YAAY,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAC;AACjE,OAAO,EAAE,kBAAkB,EAAE,MAAM,gCAAgC,CAAC"}

package/index.js

@@ -1,21 +1,22 @@
 import { BASE_LG_ICON_PROPS as e, MarkdownRenderer as t, buildCssVars as n, mergeClasses as r } from "@epam/ai-dial-chat-shared";
 import { PanelNoResults as i, SidebarOrientation as a, SidebarPanel as o } from "@epam/ai-dial-sidebar";
-import { DIAL_ICON_SIZE as s, DIAL_KIT_ICON_STROKE as c, ElementSize as l, GhostIconButton as u, Highlight as d, LinkButton as f, NoDataContent as p, Search as m } from "@epam/ai-dial-ui-kit";
-import { IconCopy as h, IconDownload as g } from "@tabler/icons-react";
-import { memo as _, useLayoutEffect as v, useMemo as y, useState as b } from "react";
-import { AttachmentCard as x } from "@epam/ai-dial-attachment-input";
-import { Fragment as S, jsx as C, jsxs as w } from "react/jsx-runtime";
-var T = _(({ attachments: e, title: t, searchQuery: n, titleClassName: i = "dial-body-semi-text", onAttachmentClick: a, attachmentClickLabel: o }) => e.length === 0 ? null : /* @__PURE__ */ w("section", {
+import { DIAL_ICON_SIZE as s, DIAL_KIT_ICON_STROKE as c, ElementSize as l, GhostIconButton as u, Highlight as d, LinkButton as f, NoDataContent as p, Search as m, mergeClasses as h } from "@epam/ai-dial-ui-kit";
+import { IconCopy as g, IconDownload as _ } from "@tabler/icons-react";
+import { memo as v, useLayoutEffect as y, useMemo as b, useState as x } from "react";
+import { AttachmentCard as S } from "@epam/ai-dial-attachment-input";
+import { Fragment as C, jsx as w, jsxs as T } from "react/jsx-runtime";
+//#region src/constants/public-class-names.ts
+var E = { panel: "dial-source-panel-panel" }, D = v(({ attachments: e, title: t, searchQuery: n, titleClassName: i = "dial-body-semi-text", onAttachmentClick: a, attachmentClickLabel: o }) => e.length === 0 ? null : /* @__PURE__ */ T("section", {
 	className: "mb-6",
-	children: [/* @__PURE__ */ C("h2", {
+	children: [/* @__PURE__ */ w("h2", {
 		className: r(i, "mb-3"),
 		children: t
-	}), /* @__PURE__ */ C("div", {
+	}), /* @__PURE__ */ w("div", {
 		role: "list",
 		className: "grid grid-cols-[repeat(auto-fill,minmax(84px,1fr))] gap-3",
-		children: e.map((e, t) => /* @__PURE__ */ C("div", {
+		children: e.map((e, t) => /* @__PURE__ */ w("div", {
 			role: "listitem",
-			children: /* @__PURE__ */ C(x, {
+			children: /* @__PURE__ */ w(S, {
 				attachment: e,
 				searchQuery: n,
 				onClick: a ? () => a(e) : void 0,
@@ -23,39 +24,39 @@ var T = _(({ attachments: e, title: t, searchQuery: n, titleClassName: i = "dial
 			})
 		}, `${e.id}-${t}`))
 	})]
-})), E = {
+})), O = {
 	link: "_link_12icw_1",
 	quote: "_quote_12icw_5"
-}, D = _(({ title: e, sources: i, copyLabel: a, copiedLabel: o = "Link copied to clipboard", searchQuery: p = "", typography: m, colors: g, onSourceClick: _ }) => {
-	let [v, x] = b(""), S = m?.sectionTitleClassName ?? "dial-body-semi-text", T = m?.sourceLinkClassName ?? "dial-small-text", D = m?.sourceQuoteClassName ?? "dial-tiny-text", O = y(() => n({
-		"--sp-source-link": g?.sourceLink,
-		"--sp-source-quote": g?.sourceQuote
-	}), [g]);
+}, k = v(({ title: e, sources: i, copyLabel: a, copiedLabel: o = "Link copied to clipboard", searchQuery: p = "", typography: m, colors: h, onSourceClick: _ }) => {
+	let [v, y] = x(""), S = m?.sectionTitleClassName ?? "dial-body-semi-text", C = m?.sourceLinkClassName ?? "dial-small-text", E = m?.sourceQuoteClassName ?? "dial-tiny-text", D = b(() => n({
+		"--sp-source-link": h?.sourceLink,
+		"--sp-source-quote": h?.sourceQuote
+	}), [h]);
 	if (i.length === 0) return null;
 	let k = async (e) => {
-		await navigator.clipboard.writeText(e), x(o);
+		await navigator.clipboard.writeText(e), y(o);
 	};
-	return /* @__PURE__ */ w("section", {
+	return /* @__PURE__ */ T("section", {
 		className: "mb-6",
-		style: O,
+		style: D,
 		children: [
-			/* @__PURE__ */ C("h2", {
+			/* @__PURE__ */ w("h2", {
 				className: r(S, "mb-3"),
 				children: e
 			}),
-			/* @__PURE__ */ C("ul", {
+			/* @__PURE__ */ w("ul", {
 				className: "flex flex-col gap-3",
-				children: i.map((e) => /* @__PURE__ */ w("li", {
+				children: i.map((e) => /* @__PURE__ */ T("li", {
 					className: "flex flex-col gap-1",
-					children: [/* @__PURE__ */ w("div", {
+					children: [/* @__PURE__ */ T("div", {
 						className: "flex min-w-0 items-center justify-between gap-2",
-						children: [/* @__PURE__ */ C(f, {
+						children: [/* @__PURE__ */ w(f, {
 							href: e.url,
 							target: "_blank",
 							size: l.Small,
-							className: r(E.link, "min-w-0 flex-1 justify-start"),
-							textClassName: r(T, "min-w-0 truncate"),
-							label: p ? /* @__PURE__ */ C(d, {
+							className: r(O.link, "min-w-0 flex-1 justify-start"),
+							textClassName: r(C, "min-w-0 truncate"),
+							label: p ? /* @__PURE__ */ w(d, {
 								text: e.title,
 								query: p,
 								maxLines: 1
@@ -64,9 +65,9 @@ var T = _(({ attachments: e, title: t, searchQuery: n, titleClassName: i = "dial
 							onClick: _ ? (t) => {
 								t.preventDefault(), _(e);
 							} : void 0
-						}), /* @__PURE__ */ C(u, {
+						}), /* @__PURE__ */ w(u, {
 							size: l.Small,
-							icon: /* @__PURE__ */ C(h, {
+							icon: /* @__PURE__ */ w(g, {
 								size: s.SM,
 								stroke: c,
 								"aria-hidden": !0
@@ -74,13 +75,13 @@ var T = _(({ attachments: e, title: t, searchQuery: n, titleClassName: i = "dial
 							"aria-label": a,
 							onClick: () => void k(e.url)
 						})]
-					}), e.quote && /* @__PURE__ */ C("div", {
-						className: r(D, E.quote, "line-clamp-5 [&>div>*+*]:mt-1"),
-						children: /* @__PURE__ */ C(t, { content: e.quote })
+					}), e.quote && /* @__PURE__ */ w("div", {
+						className: r(E, O.quote, "line-clamp-5 [&>div>*+*]:mt-1"),
+						children: /* @__PURE__ */ w(t, { content: e.quote })
 					})]
 				}, e.url))
 			}),
-			/* @__PURE__ */ C("span", {
+			/* @__PURE__ */ w("span", {
 				role: "status",
 				"aria-live": "polite",
 				className: "sr-only",
@@ -88,90 +89,90 @@ var T = _(({ attachments: e, title: t, searchQuery: n, titleClassName: i = "dial
 			})
 		]
 	});
-}), O = (e, t) => e.toLowerCase().includes(t.toLowerCase()), k = _(({ isOpen: t, onClose: n, uploaded: r, generated: s, sources: c, onAttachmentClick: l, onSourceClick: d, onDownloadAll: f, isMobile: h, defaultWidth: _, minWidth: x, maxWidth: E, onResizeStop: k, labels: A, styles: j, title: M, additionalSections: N }) => {
-	let [P, F] = b(""), I = (e) => {
-		F(e ?? "");
+}), A = (e, t) => e.toLowerCase().includes(t.toLowerCase()), j = v(({ isOpen: t, onClose: n, uploaded: r, generated: s, sources: c, onAttachmentClick: l, onSourceClick: d, onDownloadAll: f, isMobile: g, defaultWidth: v, minWidth: S, maxWidth: O, onResizeStop: j, labels: M, styles: N, title: P, additionalSections: F }) => {
+	let [I, L] = x(""), R = (e) => {
+		L(e ?? "");
 	};
-	v(() => {
-		t || F("");
+	y(() => {
+		t || L("");
 	}, [t]);
-	let L = y(() => P ? r.filter((e) => O(e.name, P)) : r, [r, P]), R = y(() => P ? s.filter((e) => O(e.name, P)) : s, [s, P]), z = y(() => P ? c.filter((e) => O(e.title, P) || O(e.url, P) || e.quote != null && O(e.quote, P)) : c, [c, P]), B = r.length > 0 || s.length > 0 || c.length > 0, V = !B && !N, H = P !== "" && L.length === 0 && R.length === 0 && z.length === 0, U;
-	return U = V ? /* @__PURE__ */ C("div", {
+	let z = b(() => I ? r.filter((e) => A(e.name, I)) : r, [r, I]), B = b(() => I ? s.filter((e) => A(e.name, I)) : s, [s, I]), V = b(() => I ? c.filter((e) => A(e.title, I) || A(e.url, I) || e.quote != null && A(e.quote, I)) : c, [c, I]), H = r.length > 0 || s.length > 0 || c.length > 0, U = !H && !F, W = I !== "" && z.length === 0 && B.length === 0 && V.length === 0, G;
+	return G = U ? /* @__PURE__ */ w("div", {
 		className: "flex h-full items-center justify-center",
-		children: /* @__PURE__ */ C(p, { title: A.noDataLabel })
-	}) : /* @__PURE__ */ w(S, { children: [N, H ? /* @__PURE__ */ C(i, { label: A.noResultsLabel }) : /* @__PURE__ */ w(S, { children: [
-		/* @__PURE__ */ C(T, {
-			attachments: L,
-			title: A.uploadedSectionTitle,
-			searchQuery: P,
-			titleClassName: j?.typography?.sectionTitleClassName,
+		children: /* @__PURE__ */ w(p, { title: M.noDataLabel })
+	}) : /* @__PURE__ */ T(C, { children: [F, W ? /* @__PURE__ */ w(i, { label: M.noResultsLabel }) : /* @__PURE__ */ T(C, { children: [
+		/* @__PURE__ */ w(D, {
+			attachments: z,
+			title: M.uploadedSectionTitle,
+			searchQuery: I,
+			titleClassName: N?.typography?.sectionTitleClassName,
 			onAttachmentClick: l,
-			attachmentClickLabel: A.attachmentClickLabel
+			attachmentClickLabel: M.attachmentClickLabel
 		}),
-		/* @__PURE__ */ C(T, {
-			attachments: R,
-			title: A.generatedSectionTitle,
-			searchQuery: P,
-			titleClassName: j?.typography?.sectionTitleClassName,
+		/* @__PURE__ */ w(D, {
+			attachments: B,
+			title: M.generatedSectionTitle,
+			searchQuery: I,
+			titleClassName: N?.typography?.sectionTitleClassName,
 			onAttachmentClick: l,
-			attachmentClickLabel: A.attachmentClickLabel
+			attachmentClickLabel: M.attachmentClickLabel
 		}),
-		/* @__PURE__ */ C(D, {
-			sources: z,
-			title: A.sourcesSectionTitle,
-			searchQuery: P,
-			typography: j?.typography,
-			colors: j?.colors,
-			copyLabel: A.copySourceLabel,
-			copiedLabel: A.sourceCopiedLabel,
+		/* @__PURE__ */ w(k, {
+			sources: V,
+			title: M.sourcesSectionTitle,
+			searchQuery: I,
+			typography: N?.typography,
+			colors: N?.colors,
+			copyLabel: M.copySourceLabel,
+			copiedLabel: M.sourceCopiedLabel,
 			onSourceClick: d
 		})
-	] })] }), /* @__PURE__ */ w(o, {
+	] })] }), /* @__PURE__ */ T(o, {
 		isOpen: t,
 		orientation: a.Right,
 		styles: {
-			className: h && t ? "w-full" : void 0,
+			className: h(g && t && "w-full", E.panel),
 			bodyClassName: "flex flex-col overflow-hidden p-0"
 		},
-		labels: A,
-		title: M,
+		labels: M,
+		title: P,
 		onClose: n,
-		resizable: !h,
-		defaultWidth: _,
-		minWidth: x,
-		maxWidth: E,
-		onResizeStop: k,
-		rightActions: B && /* @__PURE__ */ C(u, {
-			icon: /* @__PURE__ */ C(g, { ...e }),
-			"aria-label": A.downloadAllLabel,
-			tooltipProps: { tooltip: A.downloadAllLabel },
+		resizable: !g,
+		defaultWidth: v,
+		minWidth: S,
+		maxWidth: O,
+		onResizeStop: j,
+		rightActions: H && /* @__PURE__ */ w(u, {
+			icon: /* @__PURE__ */ w(_, { ...e }),
+			"aria-label": M.downloadAllLabel,
+			tooltipProps: { tooltip: M.downloadAllLabel },
 			onClick: f,
 			disabled: !f
 		}),
 		children: [
-			B && /* @__PURE__ */ C("div", {
+			H && /* @__PURE__ */ w("div", {
 				role: "search",
 				className: "px-3 py-2",
-				children: /* @__PURE__ */ C(m, {
-					value: P,
-					onChange: I,
-					placeholder: A.searchPlaceholder,
-					clearLabel: A.searchClearLabel,
-					"aria-label": A.searchPlaceholder
+				children: /* @__PURE__ */ w(m, {
+					value: I,
+					onChange: R,
+					placeholder: M.searchPlaceholder,
+					clearLabel: M.searchClearLabel,
+					"aria-label": M.searchPlaceholder
 				})
 			}),
-			/* @__PURE__ */ C("span", {
+			/* @__PURE__ */ w("span", {
 				role: "status",
 				"aria-live": "polite",
 				className: "sr-only",
-				children: H ? A.noResultsLabel : ""
+				children: W ? M.noResultsLabel : ""
 			}),
-			/* @__PURE__ */ C("div", {
+			/* @__PURE__ */ w("div", {
 				className: "flex-1 overflow-y-auto p-4 pt-0",
-				children: U
+				children: G
 			})
 		]
 	});
 });
 //#endregion
-export { k as ConversationSourcesPanel };
+export { j as ConversationSourcesPanel, E as SOURCE_PANEL_CLASS };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@epam/ai-dial-source-panel",
   "description": "Panel for displaying conversation sources — uploaded files and generated citations",
-  "version": "1.2.0-dev.48",
+  "version": "1.2.0-dev.50",
   "license": "Apache-2.0",
   "type": "module",
   "main": "./index.js",
@@ -18,12 +18,12 @@
   },
   "dependencies": {
     "@tabler/icons-react": "^3.44.0",
-    "@epam/ai-dial-attachment-input": "1.2.0-dev.48",
-    "@epam/ai-dial-sidebar": "1.2.0-dev.48"
+    "@epam/ai-dial-attachment-input": "1.2.0-dev.50",
+    "@epam/ai-dial-sidebar": "1.2.0-dev.50"
   },
   "peerDependencies": {
     "react": "^19.2.8",
-    "@epam/ai-dial-chat-shared": "1.2.0-dev.48",
+    "@epam/ai-dial-chat-shared": "1.2.0-dev.50",
     "@epam/ai-dial-ui-kit": "^0.15.0-dev.7"
   },
   "repository": {