@epam/ai-dial-skills 1.2.0-dev.218 → 1.2.0-dev.225

package/components/ChatSkill/ChatSkill.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ChatSkill.d.ts","sourceRoot":"","sources":["../../../src/components/ChatSkill/ChatSkill.tsx"],"names":[],"mappings":"AAEA,OAAO,EAIL,KAAK,EAAE,EAER,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,+BAA+B,CAAC;AAGpE;;;;GAIG;AACH,eAAO,MAAM,SAAS,EAAE,EAAE,CAAC,cAAc,CA2IxC,CAAC"}
+{"version":3,"file":"ChatSkill.d.ts","sourceRoot":"","sources":["../../../src/components/ChatSkill/ChatSkill.tsx"],"names":[],"mappings":"AAEA,OAAO,EAIL,KAAK,EAAE,EAER,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,+BAA+B,CAAC;AAGpE;;;;GAIG;AACH,eAAO,MAAM,SAAS,EAAE,EAAE,CAAC,cAAc,CA4IxC,CAAC"}

package/hooks/useSkillMentions/useSkillMentions.d.ts

@@ -19,6 +19,8 @@ export interface UseSkillMentionsResult {
      * inserted.
      */
     insertMention: (url: string, name: string, atCaretIndex: number) => boolean;
+    /** Splices `/${name}` back into the draft at `atIndex` and re-tracks it as a mention, with no trailing-space logic — for restoring an exact previous mention, not inserting a new one. */
+    restoreMention: (url: string, name: string, atIndex: number) => void;
     /**
      * Looks up the mention whose run ends exactly at `caretPosition`, without
      * mutating `draft`/`anchors`. The caller (`Input.tsx`) uses the returned

package/hooks/useSkillMentions/useSkillMentions.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useSkillMentions.d.ts","sourceRoot":"","sources":["../../../src/hooks/useSkillMentions/useSkillMentions.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AAE9D,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,mCAAmC,CAAC;AAU5E,gDAAgD;AAChD,MAAM,WAAW,sBAAsB;IACrC,iFAAiF;IACjF,KAAK,EAAE,MAAM,CAAC;IACd,uEAAuE;IACvE,OAAO,EAAE,kBAAkB,EAAE,CAAC;IAC9B,yGAAyG;IACzG,aAAa,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3C;;;;;;;;;OASG;IACH,aAAa,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,YAAY,EAAE,MAAM,KAAK,OAAO,CAAC;IAC5E;;;;;;;;;OASG;IACH,kBAAkB,EAAE,CAAC,aAAa,EAAE,MAAM,KAAK,kBAAkB,GAAG,SAAS,CAAC;IAC9E,iIAAiI;IACjI,aAAa,EAAE,YAAY,EAAE,GAAG,SAAS,CAAC;IAC1C,sDAAsD;IACtD,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB;;;;;OAKG;IACH,eAAe,EAAE,CACf,IAAI,EAAE,MAAM,EACZ,MAAM,EAAE,YAAY,EAAE,GAAG,SAAS,EAClC,WAAW,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,MAAM,KACjC,IAAI,CAAC;CACX;AAED;;;GAGG;AACH,eAAO,MAAM,gBAAgB,QAAO,sBAkHnC,CAAC"}
+{"version":3,"file":"useSkillMentions.d.ts","sourceRoot":"","sources":["../../../src/hooks/useSkillMentions/useSkillMentions.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AAE9D,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,mCAAmC,CAAC;AAU5E,gDAAgD;AAChD,MAAM,WAAW,sBAAsB;IACrC,iFAAiF;IACjF,KAAK,EAAE,MAAM,CAAC;IACd,uEAAuE;IACvE,OAAO,EAAE,kBAAkB,EAAE,CAAC;IAC9B,yGAAyG;IACzG,aAAa,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3C;;;;;;;;;OASG;IACH,aAAa,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,YAAY,EAAE,MAAM,KAAK,OAAO,CAAC;IAC5E,0LAA0L;IAC1L,cAAc,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACrE;;;;;;;;;OASG;IACH,kBAAkB,EAAE,CAAC,aAAa,EAAE,MAAM,KAAK,kBAAkB,GAAG,SAAS,CAAC;IAC9E,iIAAiI;IACjI,aAAa,EAAE,YAAY,EAAE,GAAG,SAAS,CAAC;IAC1C,sDAAsD;IACtD,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB;;;;;OAKG;IACH,eAAe,EAAE,CACf,IAAI,EAAE,MAAM,EACZ,MAAM,EAAE,YAAY,EAAE,GAAG,SAAS,EAClC,WAAW,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,MAAM,KACjC,IAAI,CAAC;CACX;AAED;;;GAGG;AACH,eAAO,MAAM,gBAAgB,QAAO,sBAoInC,CAAC"}

package/hooks/useSkillSelectorOverlay/useSkillSelectorOverlay.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useSkillSelectorOverlay.d.ts","sourceRoot":"","sources":["../../../src/hooks/useSkillSelectorOverlay/useSkillSelectorOverlay.tsx"],"names":[],"mappings":"AAuBA,OAAO,KAAK,EACV,8BAA8B,EAC9B,6BAA6B,EAC9B,MAAM,qCAAqC,CAAC;AAmB7C;;;;;;;GAOG;AACH,eAAO,MAAM,uBAAuB,GAAI,6OAarC,8BAA8B,KAAG,6BAqcnC,CAAC"}
+{"version":3,"file":"useSkillSelectorOverlay.d.ts","sourceRoot":"","sources":["../../../src/hooks/useSkillSelectorOverlay/useSkillSelectorOverlay.tsx"],"names":[],"mappings":"AAuBA,OAAO,KAAK,EACV,8BAA8B,EAC9B,6BAA6B,EAC9B,MAAM,qCAAqC,CAAC;AAmB7C;;;;;;;GAOG;AACH,eAAO,MAAM,uBAAuB,GAAI,6OAarC,8BAA8B,KAAG,6BAugBnC,CAAC"}

package/index.js

@@ -1,7 +1,7 @@
 import { DeploymentIcon as e, buildCssVars as t, isSkillSelectionUnsupported as n, mergeClasses as r } from "@epam/ai-dial-chat-shared";
 import { BASE_ICON_SIZE as i, Button as a, ButtonAppearance as o, ButtonVariant as s, DIAL_ICON_SIZE as c, DIAL_KIT_ICON_STROKE as l, Dropdown as u, FileDropzone as d, GhostButton as f, Highlight as p, Input as m, InteractiveTooltip as h, Popup as g, PopupSize as _, Search as v, Spinner as y, ToggleIconButton as b, TooltipPlacement as x } from "@epam/ai-dial-ui-kit";
 import { Suspense as S, useCallback as C, useEffect as w, useId as T, useLayoutEffect as E, useMemo as D, useRef as O, useState as k } from "react";
-import { IconBlocks as ee, IconChevronDown as te, IconEye as A, IconLock as j, IconStarFilled as ne, IconTrash as M, IconX as N } from "@tabler/icons-react";
+import { IconBlocks as ee, IconChevronDown as te, IconEye as A, IconLock as j, IconStarFilled as M, IconTrash as N, IconX as ne } from "@tabler/icons-react";
 import { Fragment as P, jsx as F, jsxs as I } from "react/jsx-runtime";
 import { DialFileNodeType as L, DialFoldersTree as R } from "@epam/ai-dial-react-file-manager";
 import { CatalogContentNodeType as z, DetailsPanel as B } from "@epam/ai-dial-catalog";
@@ -14,7 +14,7 @@ var V = {
 	return e.Deleted = "deleted", e.NotShared = "not-shared", e;
 }({}), U = ({ description: e, unsupportedMessage: t, unresolvedReason: n, deletedMessage: r, notSharedMessage: i, viewDetailsLabel: u = "View details", onViewDetails: d, viewDetailsTabIndex: f }) => {
 	if (n != null) {
-		let e = n === H.Deleted, t = e ? M : j, a = e ? r : i;
+		let e = n === H.Deleted, t = e ? N : j, a = e ? r : i;
 		return /* @__PURE__ */ I("div", {
 			className: "flex flex-row items-center gap-2",
 			children: [/* @__PURE__ */ F(t, {
@@ -104,7 +104,7 @@ var V = {
 	rowFadeOut: "_rowFadeOut_1v431_1",
 	listContent: "_listContent_1v431_60"
 }, K = "px-3 pb-0.5 pt-2", re = 180, q = 288, J = ({ favorites: n, onSelect: i, onToggleFavorite: a, onBrowse: o, onViewDetails: s, className: l, rowClassName: u, searchQuery: d, listboxId: m, activeOptionId: g, isMenu: _ = !1, labels: v = {}, colors: y, nameClassName: x = "dial-small-text", headerClassName: S = "dial-tiny-lead-semi-text", emptyHintClassName: C = "dial-small-text" }) => {
-	let { myCollectionLabel: D = "My Collection", emptyHintLabel: ee = "Star a skill to pin it here", browseLabel: te = "Browse", removeFromFavoritesLabel: A = "Remove from favorites", viewDetailsLabel: j = "View details", noMatchingSkillsLabel: M = "No matching skills" } = v, N = t({
+	let { myCollectionLabel: D = "My Collection", emptyHintLabel: ee = "Star a skill to pin it here", browseLabel: te = "Browse", removeFromFavoritesLabel: A = "Remove from favorites", viewDetailsLabel: j = "View details", noMatchingSkillsLabel: N = "No matching skills" } = v, ne = t({
 		"--fs-row-hover-bg": y?.rowHoverBackground,
 		"--fs-header-text": y?.headerText,
 		"--fs-empty-hint-text": y?.emptyHintText,
@@ -137,7 +137,7 @@ var V = {
 	};
 	return /* @__PURE__ */ I("div", {
 		className: r("flex w-full flex-col desktop:w-[280px]", l, V.favoritesPanel),
-		style: N,
+		style: ne,
 		children: [
 			/* @__PURE__ */ F("p", {
 				id: J,
@@ -179,7 +179,7 @@ var V = {
 										className: r(x, "min-w-0 flex-1 text-start")
 									}),
 									a && /* @__PURE__ */ F(b, {
-										icon: /* @__PURE__ */ F(ne, {
+										icon: /* @__PURE__ */ F(M, {
 											size: c.SM,
 											className: G.star,
 											"aria-hidden": !0
@@ -213,7 +213,7 @@ var V = {
 						role: "status",
 						"aria-live": "polite",
 						className: r(C, "px-4 py-4 text-start", G.emptyHint),
-						children: M
+						children: N
 					}) : /* @__PURE__ */ F("p", {
 						className: r(C, "px-4 py-4 text-start", G.emptyHint),
 						children: ee
@@ -371,11 +371,14 @@ var V = {
 	}, []), s = C((e, n, a) => {
 		let o = i.current, s = !/^\s/.test(o.slice(a)), c = `/${n}${s ? " " : ""}`, l = o.slice(0, a) + c + o.slice(a);
 		return i.current = l, t(l), r((t) => ue(t, a, e, n, s)), s;
-	}, []), c = C((e) => de(a.current, e), []), l = D(() => {
+	}, []), c = C((e, n, a) => {
+		let o = i.current, s = `/${n}`, c = o.slice(0, a) + s + o.slice(a);
+		i.current = c, t(c), r((t) => ue(t, a, e, n, !1));
+	}, []), l = C((e) => de(a.current, e), []), u = D(() => {
 		if (n.length !== 0) return n.map((e) => ({ url: e.url }));
-	}, [n]), u = C(() => {
+	}, [n]), d = C(() => {
 		t(""), r([]);
-	}, []), d = C((e, n, i) => {
+	}, []), f = C((e, n, i) => {
 		let a = n ?? [], o = se(e, a, i);
 		t(e), r(o.map((e) => {
 			let t = a[e.skillIndex];
@@ -392,10 +395,11 @@ var V = {
 		anchors: n,
 		onDraftChange: o,
 		insertMention: s,
-		onBackspaceAtCaret: c,
-		orderedSkills: l,
-		reset: u,
-		seedFromMessage: d
+		restoreMention: c,
+		onBackspaceAtCaret: l,
+		orderedSkills: u,
+		reset: d,
+		seedFromMessage: f
 	}), [
 		e,
 		n,
@@ -404,7 +408,8 @@ var V = {
 		c,
 		l,
 		u,
-		d
+		d,
+		f
 	]);
 }, me = (e) => ({
 	id: e.url,
@@ -417,7 +422,7 @@ var V = {
 	let t = e.split("/").filter((e) => e.length > 0);
 	return t[0] !== "skills" || t.length < 3 ? null : t[1];
 }, _e = (e, t) => ge(e) === t ? H.Deleted : H.NotShared, ve = "/", ye = ({ isSkillsSupported: e, skills: t, sharedWithMe: n, publicSkills: r, favoriteIds: a, viewerBucket: o, onToggleFavorite: s, labels: c, historyChipLabelClassName: u, activeMentionDetailsTrigger: d, renderCatalogContent: f, detailsPanelComponent: p }) => {
-	let { addMenuLabel: m = "Skills", backLabel: h = "Back", catalogModalTitleLabel: g = "Use skill", emptyQueryHintLabel: _ = "Type to filter", deletedTooltipLabel: v, notSharedTooltipLabel: y, panelLabels: b } = c ?? {}, [x, w] = k(!1), [T, E] = k(null), [O, te] = k(0), [A, j] = k(0), [ne, M] = k(void 0), N = pe(), P = D(() => [
+	let { addMenuLabel: m = "Skills", backLabel: h = "Back", catalogModalTitleLabel: g = "Use skill", emptyQueryHintLabel: _ = "Type to filter", deletedTooltipLabel: v, notSharedTooltipLabel: y, panelLabels: b } = c ?? {}, [x, w] = k(!1), [T, E] = k(null), [O, te] = k(0), [A, j] = k(null), [M, N] = k(0), [ne, P] = k(void 0), I = pe(), L = D(() => [
 		...t,
 		...n ?? [],
 		...r ?? []
@@ -425,7 +430,7 @@ var V = {
 		t,
 		n,
 		r
-	]), I = D(() => new Map(P.map((e) => [e.url, e])), [P]), L = C((e) => I.get(e)?.name ?? he(e), [I]), R = D(() => P.filter((e) => a.has(e.url)).map((e) => me(e)), [P, a]), z = N.anchors.length > 0 && !e, B = D(() => N.anchors.map((t) => ({
+	]), R = D(() => new Map(L.map((e) => [e.url, e])), [L]), z = C((e) => R.get(e)?.name ?? he(e), [R]), B = D(() => L.filter((e) => a.has(e.url)).map((e) => me(e)), [L, a]), V = I.anchors.length > 0 && !e, H = D(() => I.anchors.map((t) => ({
 		start: t.start,
 		length: t.length,
 		isUnsupported: !e,
@@ -433,35 +438,44 @@ var V = {
 			name: t.name,
 			path: t.url,
 			labelClassName: u,
-			description: I.get(t.url)?.description,
+			description: R.get(t.url)?.description,
 			isUnsupported: !e,
 			detailsTrigger: d,
 			onViewDetails: E,
 			labels: { viewDetailsLabel: b?.viewDetailsLabel }
 		})
 	})), [
-		N.anchors,
+		I.anchors,
 		e,
-		I,
+		R,
 		u,
 		d,
 		b
-	]), V = C((e, t, n) => {
-		let r = N.insertMention(e, t, n);
-		j((e) => e + 1), M(n + 1 + t.length + +!!r);
-	}, [N]), H = C((e) => {
-		let t = fe(N.draft, e, ve);
-		return t == null ? e : (N.onDraftChange(N.draft.slice(0, t.start) + N.draft.slice(t.end)), t.start);
-	}, [N]), U = C(() => {
-		N.reset(), j((e) => e + 1), M(void 0);
-	}, [N]), G = C((e, t) => {
-		N.seedFromMessage(e, t, L), j((e) => e + 1), M(void 0);
-	}, [N, L]), K = C((e, t) => {
+	]), U = C((e, t, n) => {
+		let r = I.insertMention(e, t, n);
+		N((e) => e + 1), P(n + 1 + t.length + +!!r);
+	}, [I]), G = C((e) => {
+		let t = fe(I.draft, e, ve);
+		return t == null ? e : (I.onDraftChange(I.draft.slice(0, t.start) + I.draft.slice(t.end)), t.start);
+	}, [I]), K = C((e) => {
+		let t = fe(I.draft, e, ve);
+		if (t == null) return;
+		let n = I.anchors.find((e) => e.start === t.start && e.start + e.length === t.end);
+		return {
+			position: t.start,
+			text: I.draft.slice(t.start, t.end),
+			mentionUrl: n?.url
+		};
+	}, [I]), re = C(() => {
+		I.reset(), N((e) => e + 1), P(void 0);
+	}, [I]), q = C((e, t) => {
+		I.seedFromMessage(e, t, z), N((e) => e + 1), P(void 0);
+	}, [I, z]), Y = C((e, t) => {
 		if (t == null || t.length === 0) return null;
-		let n = se(e, t, L), r = [], i = 0;
+		let n = se(e, t, z), r = [], i = 0;
 		return n.forEach((n) => {
 			n.start > i && r.push(e.slice(i, n.start));
-			let a = t[n.skillIndex], s = I.get(a.url), c = s?.name ?? he(a.url), l = s == null ? _e(a.url, o) : void 0;
+			let a = t[n.skillIndex], s = R.get(a.url), c = s?.name ?? he(a.url), l = s == null ? _e(a.url, o) : void 0;
 			r.push(/* @__PURE__ */ F(W, {
 				name: c,
 				path: a.url,
@@ -477,15 +491,15 @@ var V = {
 			}, `${a.url}-${n.start}`)), i = n.start + n.length;
 		}), i < e.length && r.push(e.slice(i)), r;
 	}, [
-		L,
-		I,
+		z,
+		R,
 		u,
 		b,
 		o,
 		v,
 		y
-	]), re = C((e) => e == null || e.length === 0 ? null : e.map((e) => {
-		let t = I.get(e.url), n = t?.name ?? he(e.url), r = t == null ? _e(e.url, o) : void 0;
+	]), X = C((e) => e == null || e.length === 0 ? null : e.map((e) => {
+		let t = R.get(e.url), n = t?.name ?? he(e.url), r = t == null ? _e(e.url, o) : void 0;
 		return /* @__PURE__ */ F(W, {
 			name: n,
 			path: e.url,
@@ -500,30 +514,32 @@ var V = {
 			}
 		}, e.url);
 	}), [
-		I,
+		R,
 		u,
 		b,
 		o,
 		v,
 		y
-	]), q = C((e, t) => /* @__PURE__ */ F(J, {
-		favorites: R,
+	]), Q = C((e, t) => /* @__PURE__ */ F(J, {
+		favorites: B,
 		isMenu: !0,
 		onSelect: (n) => {
-			V(n.id, n.name, H(t)), e();
+			U(n.id, n.name, G(t)), e();
 		},
 		onToggleFavorite: s,
 		onBrowse: () => {
-			te(H(t)), e(), w(!0);
+			let n = K(t);
+			te(G(t)), j(n ?? null), e(), w(!0);
 		},
 		onViewDetails: (n) => {
-			H(t), e(), E(n.id);
+			G(t), e(), E(n.id);
 		},
 		labels: b
 	}), [
-		R,
-		V,
-		H,
+		B,
+		U,
+		G,
+		K,
 		s,
 		b
 	]);
@@ -536,29 +552,37 @@ var V = {
 				"aria-hidden": !0,
 				stroke: l
 			}),
-			renderOverlay: q,
+			renderOverlay: Q,
 			backLabel: h
 		} : void 0, [
 			e,
 			m,
 			h,
-			q
+			Q
 		]),
 		commandMenu: D(() => e ? {
 			triggerPrefix: ve,
 			menuLabel: m,
 			emptyQueryHint: _,
 			renderMenu: ({ query: e, caretPosition: t, close: n, listboxId: r, activeOptionId: i }) => /* @__PURE__ */ F(J, {
-				favorites: R,
+				favorites: B,
 				searchQuery: e,
 				listboxId: r,
 				activeOptionId: i,
 				onSelect: (e) => {
-					n({ consumeQuery: !0 }), V(e.id, e.name, t);
+					n({ consumeQuery: !0 }), U(e.id, e.name, t);
 				},
 				onToggleFavorite: s,
 				onBrowse: () => {
-					n({ consumeQuery: !0 }), te(t), w(!0);
+					let r = `${ve}${e}`, i = I.anchors.find((e) => e.start === t && e.length === r.length);
+					n({
+						consumeQuery: !0,
+						returnFocus: !1
+					}), te(t), j({
+						position: t,
+						text: r,
+						mentionUrl: i?.url
+					}), w(!0);
 				},
 				onViewDetails: (e) => {
 					n({ consumeQuery: !0 }), E(e.id);
@@ -569,16 +593,21 @@ var V = {
 			e,
 			m,
 			_,
-			R,
-			V,
+			B,
+			U,
+			I.anchors,
 			s,
 			b
 		]),
 		skillCatalogModal: /* @__PURE__ */ F(Z, {
 			isOpen: x,
-			onClose: () => w(!1),
+			onClose: C(() => {
+				if (w(!1), A == null) return;
+				let { position: e, text: t, mentionUrl: n } = A;
+				n == null ? I.onDraftChange(I.draft.slice(0, e) + t + I.draft.slice(e)) : I.restoreMention(n, t.slice(1), e), N((e) => e + 1), P(e + t.length), j(null);
+			}, [A, I]),
 			onSelect: (e) => {
-				V(e, L(e), O), w(!1);
+				U(e, z(e), O), j(null), w(!1);
 			},
 			title: g,
 			renderContent: f
@@ -590,18 +619,18 @@ var V = {
 				onClose: () => E(null)
 			})
 		}),
-		message: N.draft,
-		messageRevision: A,
-		activeMentions: B,
-		onDraftChange: N.onDraftChange,
-		onBackspaceAtCaret: N.onBackspaceAtCaret,
+		message: I.draft,
+		messageRevision: M,
+		activeMentions: H,
+		onDraftChange: I.onDraftChange,
+		onBackspaceAtCaret: I.onBackspaceAtCaret,
 		caretPositionOverride: ne,
-		isSkillUnsupported: z,
-		selectedSkills: N.orderedSkills,
-		resetSkillMentions: U,
-		seedSkillMentions: G,
-		renderHistorySkillSegments: K,
-		renderHistorySkills: re
+		isSkillUnsupported: V,
+		selectedSkills: I.orderedSkills,
+		resetSkillMentions: re,
+		seedSkillMentions: q,
+		renderHistorySkillSegments: Y,
+		renderHistorySkills: X
 	};
 }, $ = {
 	background: "_background_14zdf_1",
@@ -610,14 +639,14 @@ var V = {
 	clear: "_clear_14zdf_13",
 	invalid: "_invalid_14zdf_17"
 }, be = [], xe = ({ value: e, onChange: i, displayName: a, favorites: o = be, onToggleFavorite: s, onViewDetails: c, renderOverlay: d, isSkillsSupported: p, isDisabled: h = !1, isInvalid: g = !1, labelledById: _, describedById: y, labels: b, renderCatalogContent: x, className: S, styles: C }) => {
-	let [E, D] = k(!1), [ee, A] = k(!1), [j, ne] = k(""), M = O(null), L = T(), R = O(null), z = O(!1), B = n(e, p), H = p && !h, U = E && H, W = ee && H, G = () => {
-		R.current && !R.current.disabled ? R.current.focus() : M.current?.querySelector("button:not(:disabled)")?.focus();
+	let [E, D] = k(!1), [ee, A] = k(!1), [j, M] = k(""), N = O(null), L = T(), R = O(null), z = O(!1), B = n(e, p), H = p && !h, U = E && H, W = ee && H, G = () => {
+		R.current && !R.current.disabled ? R.current.focus() : N.current?.querySelector("button:not(:disabled)")?.focus();
 	};
 	w(() => {
-		z.current && !U && !W && ((document.activeElement === document.body || M.current?.contains(document.activeElement)) && G(), D(!1), A(!1)), z.current = U || W;
+		z.current && !U && !W && ((document.activeElement === document.body || N.current?.contains(document.activeElement)) && G(), D(!1), A(!1)), z.current = U || W;
 	}, [U, W]);
 	let K = (e) => {
-		e && !H || (ne(""), D(e));
+		e && !H || (M(""), D(e));
 	}, re = (e) => {
 		H && i(e), D(!1), A(!1);
 	}, q = {
@@ -635,7 +664,7 @@ var V = {
 			className: "p-2",
 			children: /* @__PURE__ */ F(v, {
 				value: j,
-				onChange: (e) => ne(e ?? ""),
+				onChange: (e) => M(e ?? ""),
 				placeholder: b.searchPlaceholder ?? "Search skills",
 				"aria-label": b.searchPlaceholder ?? "Search skills",
 				clearLabel: b.clearSearchLabel ?? "Clear search"
@@ -689,9 +718,9 @@ var V = {
 				"aria-label": b.removeSkillLabel,
 				onKeyDown: (e) => e.stopPropagation(),
 				onClick: (e) => {
-					e.stopPropagation(), i(void 0), D(!1), H ? R.current?.focus() : M.current?.focus();
+					e.stopPropagation(), i(void 0), D(!1), H ? R.current?.focus() : N.current?.focus();
 				},
-				iconBefore: /* @__PURE__ */ F(N, {
+				iconBefore: /* @__PURE__ */ F(ne, {
 					"aria-hidden": !0,
 					size: 18,
 					stroke: l
@@ -705,7 +734,7 @@ var V = {
 		})
 	});
 	return /* @__PURE__ */ I("div", {
-		ref: M,
+		ref: N,
 		role: "group",
 		"aria-labelledby": _,
 		tabIndex: -1,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@epam/ai-dial-skills",
   "description": "Host-agnostic UI for picking a favorite skill to attach to a chat input",
-  "version": "1.2.0-dev.218",
+  "version": "1.2.0-dev.225",
   "license": "Apache-2.0",
   "type": "module",
   "main": "./index.js",
@@ -18,11 +18,11 @@
   },
   "dependencies": {
     "@tabler/icons-react": "^3.44.0",
-    "@epam/ai-dial-catalog": "1.2.0-dev.218",
-    "@epam/ai-dial-conversation-input": "1.2.0-dev.218"
+    "@epam/ai-dial-catalog": "1.2.0-dev.225",
+    "@epam/ai-dial-conversation-input": "1.2.0-dev.225"
   },
   "peerDependencies": {
-    "@epam/ai-dial-chat-shared": "1.2.0-dev.218",
+    "@epam/ai-dial-chat-shared": "1.2.0-dev.225",
     "@epam/ai-dial-react-file-manager": "^0.3.0-dev.19",
     "@epam/ai-dial-ui-kit": "^0.15.0-dev.27",
     "react": "^19.2.8"