@epam/ai-dial-starter-buttons 1.1.0-dev.75 → 1.1.0-dev.78

package/components/StarterButtons/StarterButtons.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StarterButtons.d.ts","sourceRoot":"","sources":["../../../src/components/StarterButtons/StarterButtons.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,EAAE,EAAqD,MAAM,OAAO,CAAC;AAC9E,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,4BAA4B,CAAC;AAMtE,uIAAuI;AACvI,eAAO,MAAM,cAAc,EAAE,EAAE,CAAC,mBAAmB,CAgJlD,CAAC"}
+{"version":3,"file":"StarterButtons.d.ts","sourceRoot":"","sources":["../../../src/components/StarterButtons/StarterButtons.tsx"],"names":[],"mappings":"AASA,OAAO,EAAE,EAAE,EAAqD,MAAM,OAAO,CAAC;AAC9E,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,4BAA4B,CAAC;AAMtE,uIAAuI;AACvI,eAAO,MAAM,cAAc,EAAE,EAAE,CAAC,mBAAmB,CAkJlD,CAAC"}

package/index.js

@@ -1,74 +1,76 @@
 import { BASE_MD_ICON_PROPS as e } from "@epam/ai-dial-chat-shared";
-import { DialDropdown as t, NeutralButton as n } from "@epam/ai-dial-ui-kit";
-import { IconDots as r, IconDotsVertical as i } from "@tabler/icons-react";
-import { useCallback as a, useEffect as o, useMemo as s, useRef as c, useState as l } from "react";
-import { jsx as u, jsxs as d } from "react/jsx-runtime";
+import { ButtonAppearance as t, DialDropdown as n, NeutralButton as r, NeutralIconButton as i } from "@epam/ai-dial-ui-kit";
+import { IconDots as a, IconDotsVertical as o } from "@tabler/icons-react";
+import { useCallback as s, useEffect as c, useMemo as l, useRef as u, useState as d } from "react";
+import { jsx as f, jsxs as p } from "react/jsx-runtime";
 //#region src/components/StarterButtons/StarterButtons.tsx
-var f = 4, p = 8, m = ({ starters: m, onSelect: h, isMobile: g, labels: _, styles: v }) => {
-	let y = c(null), b = c([]), x = c([]), [S, C] = l(() => Math.min(m.length, f)), w = a((e) => {
-		let t = y.current;
+var m = 4, h = 8, g = ({ starters: g, onSelect: _, isMobile: v, labels: y, styles: b }) => {
+	let x = u(null), S = u([]), C = u([]), [w, T] = d(() => Math.min(g.length, m)), E = s((e) => {
+		let t = x.current;
 		if (!t) return;
 		let n = t.getBoundingClientRect().width;
 		if (n === 0) return;
-		let r = Math.min(e, f);
-		b.current.slice(0, r).every((e) => e != null) && (x.current = b.current.slice(0, r).map((e) => e?.getBoundingClientRect().width ?? 0));
-		let i = (e) => x.current[e] ?? 120, a = 0, o = 0;
+		let r = Math.min(e, m);
+		S.current.slice(0, r).every((e) => e != null) && (C.current = S.current.slice(0, r).map((e) => e?.getBoundingClientRect().width ?? 0));
+		let i = (e) => C.current[e] ?? 120, a = 0, o = 0;
 		for (let t = 0; t < r; t++) {
 			let r = i(t), s = e - (t + 1) > 0;
-			if (a + (t > 0 ? p : 0) + r + (s ? 64 : 0) > n) break;
-			a += (t > 0 ? p : 0) + r, o = t + 1;
+			if (a + (t > 0 ? h : 0) + r + (s ? 64 : 0) > n) break;
+			a += (t > 0 ? h : 0) + r, o = t + 1;
 		}
-		C(Math.max(1, o));
+		T(Math.max(1, o));
 	}, []);
-	o(() => {
-		x.current = [], C(Math.min(m.length, f));
-	}, [m.length]), o(() => {
-		let e = y.current;
+	c(() => {
+		C.current = [], T(Math.min(g.length, m));
+	}, [g.length]), c(() => {
+		let e = x.current;
 		if (!e) return;
 		let t = new ResizeObserver(() => {
-			w(m.length);
+			E(g.length);
 		});
 		return t.observe(e), () => t.disconnect();
-	}, [w, m.length]), o(() => {
-		w(m.length);
+	}, [E, g.length]), c(() => {
+		E(g.length);
 	});
-	let T = s(() => ({
+	let D = l(() => ({
 		...e,
-		stroke: v?.iconStrokeWidth ?? e.stroke,
-		size: v?.iconSize ?? e.size
-	}), [v?.iconStrokeWidth, v?.iconSize]);
-	if (m.length === 0) return null;
-	let E = Math.min(S, f), D = m.slice(0, E), O = m.slice(E), k = O.map((e, t) => ({
+		stroke: b?.iconStrokeWidth ?? e.stroke,
+		size: b?.iconSize ?? e.size
+	}), [b?.iconStrokeWidth, b?.iconSize]);
+	if (g.length === 0) return null;
+	let O = Math.min(w, m), k = g.slice(0, O), A = g.slice(O), j = A.map((e, t) => ({
 		key: String(t),
 		label: e.title,
-		onClick: () => h(e)
+		onClick: () => _(e)
 	}));
-	return /* @__PURE__ */ u("div", {
-		ref: y,
+	return /* @__PURE__ */ f("div", {
+		ref: x,
 		className: "mb-4 w-full",
-		children: /* @__PURE__ */ d("div", {
+		children: /* @__PURE__ */ p("div", {
 			role: "list",
-			"aria-label": _.list,
+			"aria-label": y.list,
 			className: "flex flex-wrap justify-center gap-2",
-			children: [D.map((e, t) => /* @__PURE__ */ u("div", {
+			children: [k.map((e, n) => /* @__PURE__ */ f("div", {
 				role: "listitem",
 				ref: (e) => {
-					b.current[t] = e;
+					S.current[n] = e;
 				},
-				children: /* @__PURE__ */ u(n, {
+				children: /* @__PURE__ */ f(r, {
 					label: e.title,
-					onClick: () => h(e)
+					appearance: t.Outlined,
+					onClick: () => _(e)
 				})
-			}, e.const)), O.length > 0 && /* @__PURE__ */ u("div", {
+			}, e.const)), A.length > 0 && /* @__PURE__ */ f("div", {
 				role: "listitem",
-				children: /* @__PURE__ */ u(t, {
-					items: k,
+				children: /* @__PURE__ */ f(n, {
+					items: j,
 					placement: "bottom-end",
 					matchReferenceWidth: !1,
 					listClassName: "cp-dropdown-overlay",
-					children: /* @__PURE__ */ u(n, {
-						iconAfter: u(g ? r : i, { ...T }),
-						"aria-label": _.overflow
+					children: /* @__PURE__ */ f(i, {
+						appearance: t.Outlined,
+						icon: f(v ? a : o, { ...D }),
+						"aria-label": y.overflow
 					})
 				})
 			})]
@@ -76,4 +78,4 @@ var f = 4, p = 8, m = ({ starters: m, onSelect: h, isMobile: g, labels: _, style
 	});
 };
 //#endregion
-export { m as StarterButtons };
+export { g as StarterButtons };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@epam/ai-dial-starter-buttons",
   "description": "Responsive starter prompt buttons that overflow into a dropdown when space is limited",
-  "version": "1.1.0-dev.75",
+  "version": "1.1.0-dev.78",
   "license": "Apache-2.0",
   "type": "module",
   "main": "./index.js",
@@ -16,10 +16,10 @@
     }
   },
   "peerDependencies": {
-    "@epam/ai-dial-chat-shared": "1.1.0-dev.75",
+    "@epam/ai-dial-chat-shared": "1.1.0-dev.78",
     "@tabler/icons-react": "^3.44.0",
     "react": "^19.0.0",
-    "@epam/ai-dial-ui-kit": "^0.13.0-dev.23"
+    "@epam/ai-dial-ui-kit": "^0.13.0-dev.25"
   },
   "repository": {
     "type": "git",