@inkeep/agents-ui 0.15.28 → 0.15.30

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.
Files changed (52) hide show
  1. package/dist/index.cjs +1 -1
  2. package/dist/index.js +156 -158
  3. package/dist/primitives/components/embedded-chat.cjs +4 -4
  4. package/dist/primitives/components/embedded-chat.d.ts +6 -16
  5. package/dist/primitives/components/embedded-chat.js +809 -859
  6. package/dist/primitives/components/embedded-search.cjs +1 -1
  7. package/dist/primitives/components/embedded-search.d.ts +3 -4
  8. package/dist/primitives/components/embedded-search.js +290 -294
  9. package/dist/primitives/components/tagline-logo-icon.cjs +1 -1
  10. package/dist/primitives/components/tagline-logo-icon.js +11 -21
  11. package/dist/primitives/hooks/use-feedback-api.cjs +1 -0
  12. package/dist/primitives/hooks/use-feedback-api.d.ts +19 -0
  13. package/dist/primitives/hooks/use-feedback-api.js +37 -0
  14. package/dist/primitives/index.cjs +1 -1
  15. package/dist/primitives/index.js +134 -137
  16. package/dist/primitives/providers/base-events-provider.cjs +1 -1
  17. package/dist/primitives/providers/base-events-provider.js +1 -1
  18. package/dist/primitives/providers/feedback-provider.cjs +1 -1
  19. package/dist/primitives/providers/feedback-provider.d.ts +1 -1
  20. package/dist/primitives/providers/feedback-provider.js +57 -64
  21. package/dist/primitives/providers/index.cjs +1 -1
  22. package/dist/primitives/providers/index.d.ts +0 -1
  23. package/dist/primitives/providers/index.js +42 -45
  24. package/dist/primitives/utils/component-ids.cjs +1 -1
  25. package/dist/primitives/utils/component-ids.d.ts +2 -10
  26. package/dist/primitives/utils/component-ids.js +2 -6
  27. package/dist/react/embedded-chat.cjs +1 -1
  28. package/dist/react/embedded-chat.js +249 -265
  29. package/dist/react/embedded-search.cjs +1 -1
  30. package/dist/react/embedded-search.js +63 -64
  31. package/dist/react/index.cjs +1 -1
  32. package/dist/react/index.js +156 -158
  33. package/dist/styled/components/embedded-chat.cjs +1 -1
  34. package/dist/styled/components/embedded-chat.d.ts +2 -5
  35. package/dist/styled/components/embedded-chat.js +397 -441
  36. package/dist/styled/components/embedded-search.cjs +1 -1
  37. package/dist/styled/components/embedded-search.d.ts +1 -2
  38. package/dist/styled/components/embedded-search.js +119 -133
  39. package/dist/styled/components/index.cjs +1 -1
  40. package/dist/styled/components/index.js +12 -11
  41. package/dist/styled/components/message.cjs +1 -1
  42. package/dist/styled/components/message.d.ts +20 -0
  43. package/dist/styled/components/message.js +304 -228
  44. package/dist/styled/index.cjs +1 -1
  45. package/dist/styled/index.js +152 -154
  46. package/dist/styled/inkeep.css.cjs +82 -15
  47. package/dist/styled/inkeep.css.js +82 -15
  48. package/dist/types/events.d.ts +3 -17
  49. package/package.json +1 -1
  50. package/dist/primitives/providers/feedback-item-provider.cjs +0 -1
  51. package/dist/primitives/providers/feedback-item-provider.d.ts +0 -10
  52. package/dist/primitives/providers/feedback-item-provider.js +0 -16
@@ -1,20 +1,20 @@
1
1
  "use client";
2
- import { jsx as e, jsxs as i, Fragment as oe } from "react/jsx-runtime";
3
- import { useBaseEvents as se } from "../../primitives/providers/base-events-provider.js";
4
- import { useInkeepConfig as ie } from "../../primitives/providers/config-provider.js";
5
- import { useMessage as le } from "../../primitives/providers/message-provider.js";
6
- import { EmbeddedChatPrimitiveMarkdown as pe, PrimitiveMessagePart as S } from "../../primitives/components/embedded-chat.js";
7
- import { useChat as ce } from "../../primitives/components/embedded-chat/chat-provider.js";
8
- import { merge as de } from "merge-anything";
9
- import { cn as T } from "../utils.js";
10
- import { markdownStyles as ue } from "./ui/markdown-styles.js";
11
- import { useStreamProcessor as me } from "../../primitives/components/embedded-chat/use-stream-processor.js";
12
- import { DataSummaryGroup as he } from "./data-summary-group.js";
13
- import { useState as j, useRef as D, useEffect as $, useMemo as L, useCallback as P } from "react";
14
- import { DynamicComponent as R, MessageLoading as fe } from "./embedded-chat.js";
15
- import { Library as xe, ComponentIcon as ge, Hammer as ye, ChevronDown as we, Check as F, X as ve, XCircle as K, CheckCircle as W, Clock as be, Loader2 as Ce, Circle as ke } from "lucide-react";
16
- import { button as X } from "./ui/recipes/button.js";
17
- const Ne = {
2
+ import { jsx as e, jsxs as o, Fragment as ie } from "react/jsx-runtime";
3
+ import { useBaseEvents as le } from "../../primitives/providers/base-events-provider.js";
4
+ import { useInkeepConfig as de } from "../../primitives/providers/config-provider.js";
5
+ import { useMessage as pe } from "../../primitives/providers/message-provider.js";
6
+ import { EmbeddedChatPrimitiveMarkdown as ce, PrimitiveMessagePart as D } from "../../primitives/components/embedded-chat.js";
7
+ import { useChat as me } from "../../primitives/components/embedded-chat/chat-provider.js";
8
+ import { merge as ue } from "merge-anything";
9
+ import { cn as y } from "../utils.js";
10
+ import { markdownStyles as he } from "./ui/markdown-styles.js";
11
+ import { useStreamProcessor as xe } from "../../primitives/components/embedded-chat/use-stream-processor.js";
12
+ import { DataSummaryGroup as fe } from "./data-summary-group.js";
13
+ import { useState as L, useRef as T, useEffect as $, useMemo as A, useCallback as E } from "react";
14
+ import { DynamicComponent as M, MessageLoading as ge } from "./embedded-chat.js";
15
+ import { Hammer as ye, ChevronDown as X, Check as F, X as be, Library as we, ComponentIcon as ke, XCircle as Ne, TriangleAlert as ve, CheckCircle as K, Clock as Ce, Loader2 as Se, Circle as De } from "lucide-react";
16
+ import { button as W } from "./ui/recipes/button.js";
17
+ const Te = {
18
18
  "input-streaming": "Pending",
19
19
  "input-available": "Running",
20
20
  "approval-requested": "Awaiting Approval",
@@ -23,312 +23,388 @@ const Ne = {
23
23
  "output-error": "Error",
24
24
  "output-denied": "Denied"
25
25
  };
26
- function Se(a) {
27
- if (!a || typeof a != "object") return !1;
28
- const r = a;
29
- return typeof r.type == "string" && r.type.startsWith("tool-");
26
+ function Ae(t) {
27
+ if (!t || typeof t != "object") return !1;
28
+ const a = t;
29
+ return typeof a.type == "string" && a.type.startsWith("tool-");
30
30
  }
31
- const Te = (a) => {
32
- if (!a || typeof a != "object" || !("status" in a)) return;
33
- const r = a.status;
34
- return typeof r == "string" ? r : void 0;
35
- }, De = () => /* @__PURE__ */ e("div", { className: "flex space-x-1", children: [0, 1, 2].map((a) => /* @__PURE__ */ e(
31
+ const Ee = (t) => {
32
+ if (!t || typeof t != "object" || !("status" in t)) return;
33
+ const a = t.status;
34
+ return typeof a == "string" ? a : void 0;
35
+ }, Le = () => /* @__PURE__ */ e("div", { className: "flex space-x-1", children: [0, 1, 2].map((t) => /* @__PURE__ */ e(
36
36
  "span",
37
37
  {
38
38
  className: "animate-bounce-dot opacity-30",
39
39
  style: {
40
- animationDelay: `${a * 0.2}s`
40
+ animationDelay: `${t * 0.2}s`
41
41
  },
42
42
  children: "."
43
43
  },
44
- a
45
- )) }), G = ({ name: a, Icon: r, props: n, componentType: l }) => /* @__PURE__ */ i("div", { className: "border rounded-lg bg-gray-50 dark:bg-gray-dark-800 mb-3", children: [
46
- /* @__PURE__ */ i("div", { className: "flex justify-between px-4 py-2 text-xs", children: [
47
- /* @__PURE__ */ i("div", { className: "font-medium flex items-center gap-2", children: [
48
- /* @__PURE__ */ e(r, { className: "w-3 h-3 text-gray-600 dark:text-white-alpha-600" }),
49
- /* @__PURE__ */ e("span", { children: a })
44
+ t
45
+ )) }), G = ({ name: t, Icon: a, props: i, componentType: s }) => /* @__PURE__ */ o("div", { className: "border rounded-lg bg-gray-50 dark:bg-gray-dark-800 mb-3", children: [
46
+ /* @__PURE__ */ o("div", { className: "flex justify-between px-4 py-2 text-xs", children: [
47
+ /* @__PURE__ */ o("div", { className: "font-medium flex items-center gap-2", children: [
48
+ /* @__PURE__ */ e(a, { className: "w-3 h-3 text-gray-600 dark:text-white-alpha-600" }),
49
+ /* @__PURE__ */ e("span", { children: t })
50
50
  ] }),
51
- /* @__PURE__ */ e("div", { className: "flex items-center px-1.5 py-0.5 rounded-md text-2xs uppercase tracking-wider bg-gray-200 dark:bg-white-alpha-200 font-medium text-gray-700 dark:text-white-alpha-700 font-mono", children: l })
51
+ /* @__PURE__ */ e("div", { className: "flex items-center px-1.5 py-0.5 rounded-md text-2xs uppercase tracking-wider bg-gray-200 dark:bg-white-alpha-200 font-medium text-gray-700 dark:text-white-alpha-700 font-mono", children: s })
52
52
  ] }),
53
- /* @__PURE__ */ e("pre", { className: "whitespace-pre-wrap text-xs text-gray-700 dark:text-white-alpha-700 font-mono px-4 py-2", children: JSON.stringify(n, null, 2) })
54
- ] }), Le = ({ name: a, props: r }) => /* @__PURE__ */ e(G, { name: a, Icon: ge, props: r, componentType: "component" }), Pe = ({ name: a, props: r }) => /* @__PURE__ */ e(G, { name: a, Icon: xe, props: r, componentType: "artifact" }), Ee = ({
55
- tool: a,
56
- componentDef: r,
57
- renderText: n,
58
- approvalId: l,
59
- messagePartsLength: h,
60
- setApprovalDelayPending: o,
61
- addToolApprovalResponse: s,
62
- sendMessage: c,
63
- conversationId: d
53
+ /* @__PURE__ */ e("pre", { className: "whitespace-pre-wrap text-xs text-gray-700 dark:text-white-alpha-700 font-mono px-4 py-2", children: JSON.stringify(i, null, 2) })
54
+ ] }), Pe = ({ name: t, props: a }) => /* @__PURE__ */ e(G, { name: t, Icon: ke, props: a, componentType: "component" }), je = ({ name: t, props: a }) => /* @__PURE__ */ e(G, { name: t, Icon: we, props: a, componentType: "artifact" }), Ie = ({
55
+ tool: t,
56
+ componentDef: a,
57
+ renderText: i,
58
+ approvalId: s,
59
+ messagePartsLength: u,
60
+ setApprovalDelayPending: n,
61
+ addToolApprovalResponse: c,
62
+ sendMessage: d,
63
+ conversationId: f
64
64
  }) => {
65
- const f = D(c);
66
- f.current = c;
67
- const x = D(s);
68
- x.current = s;
69
- const u = D(o);
70
- u.current = o;
71
- const v = P(
72
- async (A = !0) => {
73
- l && (u.current({ partCount: h }), x.current({ id: l, approved: A }), await f.current(void 0, { body: { conversationId: d } }));
65
+ const l = T(d);
66
+ l.current = d;
67
+ const m = T(c);
68
+ m.current = c;
69
+ const p = T(n);
70
+ p.current = n;
71
+ const h = E(
72
+ async (P = !0) => {
73
+ s && (p.current({ partCount: u }), m.current({ id: s, approved: P }), await l.current(void 0, { body: { conversationId: f } }));
74
74
  },
75
- [l, h, d]
76
- ), g = L(() => ({ tool: a, approve: v, renderMarkdown: n }), [a]);
77
- return /* @__PURE__ */ e(r ? R : Ae, { name: a.type, props: g, componentDef: r });
78
- }, Ae = ({ props: a, isDebug: r = !1 }) => {
79
- const { tool: n, approve: l } = a, h = n.type, o = h.startsWith("tool-") ? h.slice(5) : h, s = n.state, c = n.approval?.id, d = !!c, f = s === "approval-requested", x = Te(n.output), [u, v] = j(d || r), g = s ? Ne[s] ?? s : "tool";
75
+ [s, u, f]
76
+ ), v = A(() => ({ tool: t, approve: h, renderMarkdown: i }), [t]);
77
+ return /* @__PURE__ */ e(a ? M : $e, { name: t.type, props: v, componentDef: a });
78
+ };
79
+ function H(t) {
80
+ return t === null ? /* @__PURE__ */ e("span", { className: "text-gray-500 dark:text-white-alpha-500 font-mono font-medium text-1xs", children: "null" }) : t === void 0 ? /* @__PURE__ */ e("span", { className: "text-gray-400 dark:text-white-alpha-400 italic text-xs font-medium", children: "undefined" }) : typeof t == "boolean" ? /* @__PURE__ */ e(
81
+ "span",
82
+ {
83
+ className: y(
84
+ "inline-flex font-mono font-semibold items-center px-1 py-0.5 text-1xs rounded-md border",
85
+ t ? "bg-inkeep-expanded-primary-50 border-inkeep-expanded-primary-200 text-inkeep-expanded-primary-600 dark:bg-inkeep-expanded-primary-950 dark:border-inkeep-expanded-primary-600 dark:text-inkeep-expanded-primary-200" : "bg-gray-100 dark:bg-white-alpha-50 text-gray-700 dark:text-white-alpha-700"
86
+ ),
87
+ children: t ? "true" : "false"
88
+ }
89
+ ) : typeof t == "number" ? /* @__PURE__ */ e("span", { className: "tabular-nums font-medium text-inkeep-expanded-primary-600 dark:text-inkeep-expanded-primary-200", children: t.toLocaleString() }) : typeof t == "string" ? /* @__PURE__ */ e("span", { className: "text-gray-800 dark:text-white-alpha-800 break-words", children: t }) : /* @__PURE__ */ e("span", { children: String(t) });
90
+ }
91
+ const J = ({
92
+ name: t,
93
+ value: a,
94
+ isArrayIndex: i,
95
+ depth: s = 0
96
+ }) => {
97
+ const [u, n] = L(s < 1), c = a !== null && typeof a == "object" && !Array.isArray(a), d = Array.isArray(a);
98
+ if (!(c || d))
99
+ return /* @__PURE__ */ o("div", { className: "flex items-baseline gap-2 py-1 text-xs", children: [
100
+ /* @__PURE__ */ e(
101
+ "span",
102
+ {
103
+ className: y(
104
+ "font-medium shrink-0",
105
+ i ? "text-gray-300 dark:text-white-alpha-300" : "text-gray-500 dark:text-white-alpha-500"
106
+ ),
107
+ children: i ? "—" : t
108
+ }
109
+ ),
110
+ /* @__PURE__ */ e("span", { children: H(a) })
111
+ ] });
112
+ const l = d ? a.map((p, h) => [String(h), p]) : Object.entries(a);
113
+ return l.length === 0 ? /* @__PURE__ */ o("div", { className: "flex items-baseline gap-2 py-1 text-xs", children: [
114
+ /* @__PURE__ */ e("span", { className: "font-medium text-gray-500 dark:text-white-alpha-500 shrink-0", children: t }),
115
+ /* @__PURE__ */ e("span", { className: "text-gray-400 dark:text-white-alpha-400 italic", children: d ? "empty list" : "empty" })
116
+ ] }) : /* @__PURE__ */ o("div", { children: [
117
+ /* @__PURE__ */ o(
118
+ "button",
119
+ {
120
+ type: "button",
121
+ onClick: (p) => {
122
+ p.stopPropagation(), n(!u);
123
+ },
124
+ className: "flex items-center gap-1.5 py-1 text-xs hover:bg-gray-50 dark:hover:bg-white-alpha-50 -mx-1.5 px-1.5 rounded transition-colors w-full text-left",
125
+ children: [
126
+ /* @__PURE__ */ e(
127
+ X,
128
+ {
129
+ className: y(
130
+ "h-3.5 w-3.5 text-gray-400 dark:text-white-alpha-400 shrink-0 transition-transform",
131
+ !u && "-rotate-90"
132
+ )
133
+ }
134
+ ),
135
+ /* @__PURE__ */ e("span", { className: "font-medium text-gray-500 dark:text-white-alpha-500", children: t }),
136
+ !u && /* @__PURE__ */ e("span", { className: "text-gray-400 dark:text-white-alpha-400 text-1xs ml-1", children: d ? `${l.length} item${l.length !== 1 ? "s" : ""}` : `${l.length} field${l.length !== 1 ? "s" : ""}` })
137
+ ]
138
+ }
139
+ ),
140
+ u && /* @__PURE__ */ e("div", { className: "border-l-2 border-gray-200 dark:border-white-alpha-200 ml-1.5 pl-3", children: l.map(([p, h]) => /* @__PURE__ */ e(J, { name: p, value: h, isArrayIndex: d, depth: s + 1 }, p)) })
141
+ ] });
142
+ }, _e = ({ value: t }) => {
143
+ if (t == null || typeof t != "object")
144
+ return /* @__PURE__ */ e("span", { className: "text-xs", children: H(t) });
145
+ const a = Array.isArray(t) ? t.map((i, s) => [String(s), i]) : Object.entries(t);
146
+ return a.length === 0 ? /* @__PURE__ */ e("div", { className: "text-xs text-gray-400 dark:text-white-alpha-400 italic", children: "No arguments" }) : /* @__PURE__ */ e("div", { className: "space-y-1", children: a.map(([i, s]) => /* @__PURE__ */ e(J, { name: i, value: s, isArrayIndex: Array.isArray(t) }, i)) });
147
+ }, $e = ({ props: t }) => {
148
+ const { tool: a, approve: i } = t, s = a.type, u = s.startsWith("tool-") ? s.slice(5) : s, n = a.state, c = a.approval?.id, d = !!c, f = n === "approval-requested", l = Ee(a.output), [m, p] = L(d), h = n ? Te[n] ?? n : "tool";
80
149
  return $(() => {
81
- f && v(!0);
82
- }, [f]), /* @__PURE__ */ i("div", { className: "border rounded-lg mb-3 overflow-hidden", children: [
83
- (!d || r) && /* @__PURE__ */ i(
150
+ f && p(!0);
151
+ }, [f]), /* @__PURE__ */ o("div", { className: "border rounded-lg mb-3 overflow-hidden", children: [
152
+ /* @__PURE__ */ o(
84
153
  "button",
85
154
  {
86
155
  type: "button",
87
- className: "inline-flex items-center group gap-2 text-xs text-gray-700 dark:text-white-alpha-700 hover:text-gray-800 dark:hover:text-white-alpha-800 transition-colors cursor-pointer w-full justify-between px-4 py-2",
88
- onClick: () => v(!u),
89
- "data-expanded": u,
156
+ className: "inline-flex items-center group gap-2 text-xs text-gray-700 dark:text-white-alpha-700 hover:text-gray-800 dark:hover:text-white-alpha-800 transition-colors cursor-pointer w-full justify-between px-4 py-2 data-[expanded=true]:border-b",
157
+ onClick: () => p(!m),
158
+ "aria-expanded": m,
159
+ "data-expanded": m,
90
160
  children: [
91
- /* @__PURE__ */ e("div", { className: "flex items-center gap-2", children: /* @__PURE__ */ i("div", { className: "font-medium flex items-center gap-2", children: [
161
+ /* @__PURE__ */ e("div", { className: "flex items-center gap-2", children: /* @__PURE__ */ o("div", { className: "font-medium flex items-center gap-2", children: [
92
162
  /* @__PURE__ */ e(ye, { className: "w-3 h-3 text-gray-600 dark:text-white-alpha-600" }),
93
- /* @__PURE__ */ e("span", { children: o })
163
+ /* @__PURE__ */ e("span", { children: u })
94
164
  ] }) }),
95
- /* @__PURE__ */ i("div", { className: "flex items-center gap-2", children: [
96
- /* @__PURE__ */ i("div", { className: "flex items-center gap-1.5 px-1.5 py-0.5 rounded-md text-2xs uppercase tracking-wider bg-gray-100 dark:bg-white-alpha-100 font-medium text-gray-700 dark:text-white-alpha-700 font-mono", children: [
165
+ /* @__PURE__ */ o("div", { className: "flex items-center gap-2", children: [
166
+ /* @__PURE__ */ o("div", { className: "flex items-center gap-1.5 px-1.5 py-0.5 rounded-md text-2xs uppercase tracking-wider bg-gray-100 dark:bg-white-alpha-100 font-medium text-gray-700 dark:text-white-alpha-700 font-mono", children: [
97
167
  (() => {
98
- switch (s) {
168
+ switch (n) {
99
169
  case "input-streaming":
100
- return /* @__PURE__ */ e(ke, { className: "w-3 h-3" });
170
+ return /* @__PURE__ */ e(De, { className: "w-3 h-3" });
101
171
  case "input-available":
102
- return /* @__PURE__ */ e(Ce, { className: "w-3 h-3 animate-spin" });
172
+ return /* @__PURE__ */ e(Se, { className: "w-3 h-3 animate-spin" });
103
173
  case "approval-requested":
104
- return /* @__PURE__ */ e(be, { className: "w-3 h-3" });
174
+ return /* @__PURE__ */ e(Ce, { className: "w-3 h-3" });
105
175
  case "approval-responded":
106
- return /* @__PURE__ */ e(W, { className: "w-3 h-3" });
176
+ return /* @__PURE__ */ e(K, { className: "w-3 h-3" });
107
177
  case "output-available":
108
- return /* @__PURE__ */ e(W, { className: "w-3 h-3" });
109
- case "output-error":
110
178
  return /* @__PURE__ */ e(K, { className: "w-3 h-3" });
179
+ case "output-error":
180
+ return /* @__PURE__ */ e(ve, { className: "w-3 h-3" });
111
181
  case "output-denied":
112
- return /* @__PURE__ */ e(K, { className: "w-3 h-3" });
182
+ return /* @__PURE__ */ e(Ne, { className: "w-3 h-3" });
113
183
  default:
114
184
  return null;
115
185
  }
116
186
  })(),
117
- g
187
+ h
118
188
  ] }),
119
- /* @__PURE__ */ e(we, { className: "w-3 h-3 text-gray-500 dark:text-white-alpha-500 transition-all duration-200 transform rotate-0 group-data-[expanded=true]:rotate-180" })
189
+ /* @__PURE__ */ e(X, { className: "w-3.5 h-3.5 text-gray-500 dark:text-white-alpha-500 transition-all duration-200 transform rotate-0 group-data-[expanded=true]:rotate-180" })
120
190
  ] })
121
191
  ]
122
192
  }
123
193
  ),
124
- /* @__PURE__ */ e(
194
+ /* @__PURE__ */ o(
125
195
  "div",
126
196
  {
127
- "data-expanded": u,
128
- className: T(
129
- "relative",
130
- 'before:content-[""] before:absolute before:inset-x-0 before:-top-px before:h-3 before:pointer-events-none before:z-10',
131
- 'after:content-[""] after:absolute after:inset-x-0 after:bottom-0 after:h-3 after:pointer-events-none after:z-10',
132
- "before:bg-[linear-gradient(white,_transparent)] after:bg-[linear-gradient(transparent,_white)]",
133
- "dark:before:bg-[linear-gradient(var(--ikp-color-gray-dark-950),_transparent)] dark:after:bg-[linear-gradient(transparent,_var(--ikp-color-gray-dark-950))]",
134
- "data-[expanded=false]:before:opacity-0 data-[expanded=false]:after:opacity-0"
197
+ "data-expanded": m,
198
+ className: y(
199
+ "overflow-hidden transition-all duration-300 ease-in-out data-[expanded=true]:opacity-100 data-[expanded=false]:max-h-0 data-[expanded=false]:opacity-0 max-w-full"
135
200
  ),
136
- children: /* @__PURE__ */ i(
137
- "div",
138
- {
139
- "data-expanded": u,
140
- className: T(
141
- "px-4 data-[expanded=true]:pb-3 [scrollbar-width:thin] overflow-hidden transition-all duration-300 ease-in-out data-[expanded=true]:opacity-100 data-[expanded=false]:max-h-0 data-[expanded=false]:opacity-0 max-w-full",
142
- d ? "" : "data-[expanded=true]:max-h-48 data-[expanded=true]:overflow-y-auto"
201
+ children: [
202
+ /* @__PURE__ */ e(
203
+ "div",
204
+ {
205
+ "data-expanded": m,
206
+ className: y(
207
+ "relative",
208
+ 'before:content-[""] before:absolute before:inset-x-0 before:top-0 before:h-3 before:pointer-events-none before:z-10',
209
+ 'after:content-[""] after:absolute after:inset-x-0 after:bottom-0 after:h-3 after:pointer-events-none after:z-10',
210
+ "before:bg-[linear-gradient(white,_transparent)] after:bg-[linear-gradient(transparent,_white)]",
211
+ "dark:before:bg-[linear-gradient(var(--ikp-color-gray-dark-950),_transparent)] dark:after:bg-[linear-gradient(transparent,_var(--ikp-color-gray-dark-950))]",
212
+ "data-[expanded=false]:before:opacity-0 data-[expanded=false]:after:opacity-0"
213
+ ),
214
+ children: /* @__PURE__ */ e(
215
+ "div",
216
+ {
217
+ "data-expanded": m,
218
+ className: y(
219
+ "[scrollbar-width:thin] px-4",
220
+ "data-[expanded=true]:max-h-48 data-[expanded=true]:overflow-y-auto"
221
+ ),
222
+ children: a.input != null && /* @__PURE__ */ e("div", { className: "text-xs py-2", children: /* @__PURE__ */ e(_e, { value: a.input }) })
223
+ }
224
+ )
225
+ }
226
+ ),
227
+ f && c && /* @__PURE__ */ o("div", { className: "flex justify-end gap-2 pt-1 pb-3 px-4", children: [
228
+ /* @__PURE__ */ e(
229
+ "button",
230
+ {
231
+ type: "button",
232
+ className: y(
233
+ W({ size: "xs", variant: "outline" }),
234
+ "px-2 py-1 rounded-md text-xs text-gray-700 dark:text-white-alpha-700"
235
+ ),
236
+ onClick: () => i(!1),
237
+ children: "Deny"
238
+ }
143
239
  ),
144
- children: [
145
- n.input != null && /* @__PURE__ */ e("pre", { className: "whitespace-pre-wrap text-xs text-gray-700 dark:text-white-alpha-700 font-mono py-2", children: JSON.stringify(n.input, null, 2) }),
146
- !r && d && /* @__PURE__ */ i("div", { className: "whitespace-pre-wrap text-sm text-gray-700 dark:text-white-alpha-700 py-2", children: [
147
- "Approval is needed to run ",
148
- /* @__PURE__ */ e("strong", { children: o }),
149
- "."
150
- ] }),
151
- f && c && /* @__PURE__ */ i("div", { className: "flex justify-end gap-2 pt-1", children: [
152
- /* @__PURE__ */ e(
153
- "button",
154
- {
155
- type: "button",
156
- className: T(
157
- X({ size: "xs", variant: "outline" }),
158
- "px-2 py-1 rounded-md text-xs text-gray-700 dark:text-white-alpha-700"
159
- ),
160
- onClick: () => l(!1),
161
- children: "Deny"
162
- }
240
+ /* @__PURE__ */ o(
241
+ "button",
242
+ {
243
+ type: "button",
244
+ className: y(
245
+ W({ size: "xs", variant: "primaryFilled" }),
246
+ "px-2 py-1 rounded-md text-xs gap-1"
163
247
  ),
164
- /* @__PURE__ */ i(
165
- "button",
166
- {
167
- type: "button",
168
- className: T(
169
- X({ size: "xs", variant: "primaryFilled" }),
170
- "px-2 py-1 rounded-md text-xs gap-1"
171
- ),
172
- onClick: () => l(!0),
173
- children: [
174
- /* @__PURE__ */ e(F, { className: "w-3 h-3" }),
175
- "Approve"
176
- ]
177
- }
178
- )
179
- ] }),
180
- s === "output-available" && n.output != null && !r && /* @__PURE__ */ i("div", { className: "flex justify-end items-center gap-1 whitespace-pre-wrap text-xs text-gray-700 dark:text-white-alpha-700 capitalize", children: [
181
- x === "approved" && /* @__PURE__ */ e(F, { className: "w-3 h-3" }),
182
- x
183
- ] }),
184
- s === "output-denied" && !r && /* @__PURE__ */ i("div", { className: "flex justify-end items-center gap-1 whitespace-pre-wrap text-xs text-gray-700 dark:text-white-alpha-700 capitalize", children: [
185
- /* @__PURE__ */ e(ve, { className: "w-3 h-3" }),
186
- g
187
- ] }),
188
- s === "output-available" && n.output != null && r && /* @__PURE__ */ e("pre", { className: "whitespace-pre-wrap text-xs text-gray-700 dark:text-white-alpha-700 font-mono py-2", children: typeof n.output == "string" ? n.output : JSON.stringify(n.output, null, 2) })
189
- ]
190
- }
191
- )
248
+ onClick: () => i(!0),
249
+ children: [
250
+ /* @__PURE__ */ e(F, { className: "w-3 h-3" }),
251
+ "Approve"
252
+ ]
253
+ }
254
+ )
255
+ ] }),
256
+ n === "output-available" && l && a.output != null && /* @__PURE__ */ o("div", { className: "flex justify-end items-center gap-1 whitespace-pre-wrap text-xs text-gray-700 dark:text-white-alpha-700 capitalize pb-3 px-4", children: [
257
+ l === "approved" && /* @__PURE__ */ e(F, { className: "w-3 h-3" }),
258
+ l
259
+ ] }),
260
+ n === "output-denied" && /* @__PURE__ */ o("div", { className: "flex justify-end items-center gap-1 whitespace-pre-wrap text-xs text-gray-700 dark:text-white-alpha-700 capitalize pb-3 px-4", children: [
261
+ /* @__PURE__ */ e(be, { className: "w-3 h-3" }),
262
+ h
263
+ ] })
264
+ ]
192
265
  }
193
266
  )
194
267
  ] });
195
- }, Xe = ({
196
- className: a,
197
- componentStyles: r,
198
- children: n,
199
- isLast: l,
200
- ...h
268
+ }, Qe = ({
269
+ className: t,
270
+ componentStyles: a,
271
+ children: i,
272
+ isLast: s,
273
+ ...u
201
274
  }) => {
202
- const { message: o } = le(), { logEvent: s } = se(), { conversationId: c, isStreaming: d, isLoading: f, setError: x, addToolApprovalResponse: u, sendMessage: v } = ce(), {
203
- aiChatSettings: { components: g, artifacts: E, headers: A }
204
- } = ie(), H = A?.["x-emit-operations"] === "true", O = o.role === "user", V = (d || f) && l && o.role === "assistant", { processedParts: Q, summaryTimings: Y, shouldShowInitialLoading: Z, shouldShowStreamDelayLoading: ee } = me(o.parts, V, x), [k, z] = j(null), [te, _] = j(!1), m = D(null);
275
+ const { message: n } = pe(), { logEvent: c } = le(), { conversationId: d, isStreaming: f, isLoading: l, setError: m, addToolApprovalResponse: p, sendMessage: h } = me(), {
276
+ aiChatSettings: { components: v, artifacts: R, headers: P }
277
+ } = de(), Q = P?.["x-emit-operations"] === "true", O = n.role === "user", Y = (f || l) && s && n.role === "assistant", { processedParts: Z, summaryTimings: ee, shouldShowInitialLoading: te, shouldShowStreamDelayLoading: ae } = xe(n.parts, Y, m), [C, z] = L(null), [re, j] = L(!1), g = T(null);
205
278
  $(() => {
206
- if (!k) {
207
- _(!1), m.current && (clearTimeout(m.current), m.current = null);
279
+ if (!C) {
280
+ j(!1), g.current && (clearTimeout(g.current), g.current = null);
208
281
  return;
209
282
  }
210
- return _(!1), m.current && clearTimeout(m.current), m.current = window.setTimeout(() => {
211
- _(!0);
283
+ return j(!1), g.current && clearTimeout(g.current), g.current = window.setTimeout(() => {
284
+ j(!0);
212
285
  }, 1e3), () => {
213
- m.current && (clearTimeout(m.current), m.current = null);
286
+ g.current && (clearTimeout(g.current), g.current = null);
214
287
  };
215
- }, [k]), $(() => {
216
- k && (!l || o.parts.length > k.partCount) && z(null);
217
- }, [k, l, o.parts.length]);
218
- const q = L(
219
- () => o.parts.filter(
220
- (t) => t.type === "data-artifact" && t.data?.type?.toLowerCase() === "citation"
288
+ }, [C]), $(() => {
289
+ C && (!s || n.parts.length > C.partCount) && z(null);
290
+ }, [C, s, n.parts.length]);
291
+ const q = A(
292
+ () => n.parts.filter(
293
+ (r) => r.type === "data-artifact" && r.data?.type?.toLowerCase() === "citation"
221
294
  ),
222
- [o.parts]
223
- ), J = L(
224
- () => de(ue, r ?? {}),
225
- [r]
226
- ), U = P(
227
- (t, p) => {
228
- s({
295
+ [n.parts]
296
+ ), U = A(
297
+ () => ue(he, a ?? {}),
298
+ [a]
299
+ ), V = E(
300
+ (r, x) => {
301
+ c({
229
302
  eventName: "assistant_message_inline_link_opened",
230
303
  properties: {
231
- title: p?.toString(),
232
- url: t
304
+ title: x?.toString(),
305
+ url: r
233
306
  }
234
307
  });
235
308
  },
236
- [s]
237
- ), B = P(
238
- (t, p) => {
239
- s({
309
+ [c]
310
+ ), B = E(
311
+ (r, x) => {
312
+ c({
240
313
  eventName: "assistant_code_block_copied",
241
314
  properties: {
242
- conversationId: c,
243
- language: t,
244
- code: p
315
+ conversationId: d,
316
+ language: r,
317
+ code: x
245
318
  }
246
319
  });
247
320
  },
248
- [s, c]
249
- ), I = P(
250
- (t) => /* @__PURE__ */ e(
251
- pe,
321
+ [c, d]
322
+ ), I = E(
323
+ (r) => /* @__PURE__ */ e(
324
+ ce,
252
325
  {
253
- text: t,
254
- componentStyles: J,
255
- onLinkClick: U,
326
+ text: r,
327
+ componentStyles: U,
328
+ onLinkClick: V,
256
329
  onCodeCopy: B,
257
330
  artifacts: q
258
331
  }
259
332
  ),
260
- [J, U, B, q]
261
- ), ae = L(
262
- () => T(
333
+ [U, V, B, q]
334
+ ), ne = A(
335
+ () => y(
263
336
  "data-[role=user]:whitespace-pre-wrap mb-3 data-[role=user]:mb-0 [&[data-role=user]>p]:mb-0 max-w-full",
264
- a
337
+ t
265
338
  ),
266
- [a]
267
- ), re = !O || o.parts.some((t) => t.type === "text" && t.text?.trim());
268
- return /* @__PURE__ */ i(oe, { children: [
269
- !re && /* @__PURE__ */ e("span", { className: "text-gray-500 dark:text-white-alpha-500", children: "No message content" }),
270
- Q.map((t, p) => {
271
- const b = {
272
- "data-role": o.role,
273
- "data-type": t?.type === "data-component" ? t.data.type : t?.type,
274
- ...h,
275
- className: ae
339
+ [t]
340
+ ), se = !O || n.parts.some(
341
+ (r) => r.type === "text" && r.text?.trim()
342
+ );
343
+ return /* @__PURE__ */ o(ie, { children: [
344
+ !se && /* @__PURE__ */ e("span", { className: "text-gray-500 dark:text-white-alpha-500", children: "No message content" }),
345
+ Z.map((r, x) => {
346
+ const k = {
347
+ "data-role": n.role,
348
+ "data-type": r?.type === "data-component" ? r.data.type : r?.type,
349
+ ...u,
350
+ className: ne
276
351
  };
277
- switch (t?.type) {
352
+ switch (r?.type) {
278
353
  case "text":
279
- return /* @__PURE__ */ e(S, { ...b, children: O ? t.text : I(t.text || "") }, p);
354
+ return /* @__PURE__ */ e(D, { ...k, children: O ? r.text : I(r.text || "") }, x);
280
355
  case "data-component": {
281
- const { type: y } = t.data;
282
- switch (y) {
356
+ const { type: b } = r.data;
357
+ switch (b) {
283
358
  case "text":
284
- return /* @__PURE__ */ e("div", { ...b, children: I(t.data.text || "") }, p);
359
+ return /* @__PURE__ */ e("div", { ...k, children: I(r.data.text || "") }, x);
285
360
  default: {
286
- const C = t.data, { name: w, props: M } = C, N = g?.[w];
287
- return /* @__PURE__ */ e(S, { ...b, children: /* @__PURE__ */ e(N ? R : Le, { name: w, props: M, componentDef: N }) }, `${w}-${p}`);
361
+ const N = r.data, { name: w, props: _ } = N, S = v?.[w];
362
+ return /* @__PURE__ */ e(D, { ...k, children: /* @__PURE__ */ e(S ? M : Pe, { name: w, props: _, componentDef: S }) }, `${w}-${x}`);
288
363
  }
289
364
  }
290
365
  }
291
366
  case "data-artifact": {
292
- const y = t.data, { name: C, type: w, artifactSummary: M } = y, N = E?.[w];
293
- return /* @__PURE__ */ e(S, { ...b, children: /* @__PURE__ */ e(N ? R : Pe, { name: w, props: M, componentDef: N }) }, `${C}-${p}`);
367
+ const b = r.data, { name: N, type: w, artifactSummary: _ } = b, S = R?.[w];
368
+ return /* @__PURE__ */ e(D, { ...k, children: /* @__PURE__ */ e(S ? M : je, { name: w, props: _, componentDef: S }) }, `${N}-${x}`);
294
369
  }
295
370
  case "summary-group": {
296
- const y = Y.get(t.groupKey) || {
371
+ const b = ee.get(r.groupKey) || {
297
372
  isCompleted: !1
298
373
  };
299
- return /* @__PURE__ */ e(S, { ...b, children: /* @__PURE__ */ e(
300
- he,
374
+ return /* @__PURE__ */ e(D, { ...k, children: /* @__PURE__ */ e(
375
+ fe,
301
376
  {
302
- summaries: t.summaries || [],
303
- isCompleted: y.isCompleted
377
+ summaries: r.summaries || [],
378
+ isCompleted: b.isCompleted
304
379
  }
305
- ) }, `${t.groupKey}-${p}`);
380
+ ) }, `${r.groupKey}-${x}`);
306
381
  }
307
382
  default: {
308
- if (!Se(t))
383
+ if (!Ae(r))
309
384
  return null;
310
- const y = t, C = t.approval?.id;
311
- return H || C ? /* @__PURE__ */ e(S, { ...b, children: /* @__PURE__ */ e(
312
- Ee,
385
+ const b = r, N = r.approval?.id;
386
+ return Q || N ? /* @__PURE__ */ e(D, { ...k, children: /* @__PURE__ */ e(
387
+ Ie,
313
388
  {
314
- tool: y,
315
- componentDef: g?.IkpTool,
389
+ tool: b,
390
+ componentDef: v?.IkpTool,
316
391
  renderText: I,
317
- approvalId: C,
318
- messagePartsLength: o.parts.length,
392
+ approvalId: N,
393
+ messagePartsLength: n.parts.length,
319
394
  setApprovalDelayPending: z,
320
- addToolApprovalResponse: u,
321
- sendMessage: v,
322
- conversationId: c
395
+ addToolApprovalResponse: p,
396
+ sendMessage: h,
397
+ conversationId: d
323
398
  }
324
- ) }, t.toolCallId ?? `${t.type}-${p}`) : null;
399
+ ) }, r.toolCallId ?? `${r.type}-${x}`) : null;
325
400
  }
326
401
  }
327
402
  }),
328
- Z && /* @__PURE__ */ e(fe, {}),
329
- (ee || te) && /* @__PURE__ */ e(De, {})
403
+ te && /* @__PURE__ */ e(ge, {}),
404
+ (ae || re) && /* @__PURE__ */ e(Le, {})
330
405
  ] });
331
406
  };
332
407
  export {
333
- Xe as EmbeddedChatMessagePart
408
+ $e as DefaultToolComponent,
409
+ Qe as EmbeddedChatMessagePart
334
410
  };