@bikdotai/bik-component-library 0.0.829 → 0.0.830-beta.1

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 (87) hide show
  1. package/dist/cjs/components/agent-builder/AgentBuilder.js +1 -1
  2. package/dist/cjs/components/agent-builder/AgentBuilder.js.map +1 -1
  3. package/dist/cjs/components/agent-builder/AgentBuilder.styled.js +17 -65
  4. package/dist/cjs/components/agent-builder/AgentBuilder.styled.js.map +1 -1
  5. package/dist/cjs/components/agent-builder/components/ConfigToolPanel.js +41 -0
  6. package/dist/cjs/components/agent-builder/components/ConfigToolPanel.js.map +1 -0
  7. package/dist/cjs/components/agent-builder/components/CreateSubAgentPanel.js +5 -5
  8. package/dist/cjs/components/agent-builder/components/CreateSubAgentPanel.js.map +1 -1
  9. package/dist/cjs/components/agent-builder/components/DrawerHeaderText.js +9 -0
  10. package/dist/cjs/components/agent-builder/components/DrawerHeaderText.js.map +1 -0
  11. package/dist/cjs/components/agent-builder/components/MentionEditor.js +1 -1
  12. package/dist/cjs/components/agent-builder/components/MentionEditor.js.map +1 -1
  13. package/dist/cjs/components/agent-builder/components/MentionField.js +1 -1
  14. package/dist/cjs/components/agent-builder/components/MentionField.js.map +1 -1
  15. package/dist/cjs/components/agent-builder/components/MentionPicker.js +20 -20
  16. package/dist/cjs/components/agent-builder/components/MentionPicker.js.map +1 -1
  17. package/dist/cjs/components/agent-builder/components/RestApiToolPanel.js +23 -0
  18. package/dist/cjs/components/agent-builder/components/RestApiToolPanel.js.map +1 -0
  19. package/dist/cjs/components/agent-builder/components/SelectableListSection.js +5 -5
  20. package/dist/cjs/components/agent-builder/components/SelectableListSection.js.map +1 -1
  21. package/dist/cjs/components/agent-builder/components/ToolInstructionsField.js +5 -0
  22. package/dist/cjs/components/agent-builder/components/ToolInstructionsField.js.map +1 -0
  23. package/dist/cjs/components/agent-builder/constants/tools.js +2 -0
  24. package/dist/cjs/components/agent-builder/constants/tools.js.map +1 -0
  25. package/dist/cjs/components/agent-builder/context/AgentBuilderContext.js +1 -1
  26. package/dist/cjs/components/agent-builder/context/AgentBuilderContext.js.map +1 -1
  27. package/dist/cjs/components/agent-builder/steps/Step3HowItResponds.js +1 -1
  28. package/dist/cjs/components/agent-builder/steps/Step3HowItResponds.js.map +1 -1
  29. package/dist/cjs/components/agent-builder/utils/mentionSerialization.js +3 -3
  30. package/dist/cjs/components/agent-builder/utils/mentionSerialization.js.map +1 -1
  31. package/dist/cjs/components/agent-builder/utils/sourceIcons.js +1 -1
  32. package/dist/cjs/components/agent-builder/utils/sourceIcons.js.map +1 -1
  33. package/dist/cjs/components/side-modal/SideModal.style.js +11 -10
  34. package/dist/cjs/components/side-modal/SideModal.style.js.map +1 -1
  35. package/dist/cjs/index.js +1 -1
  36. package/dist/esm/components/agent-builder/AgentBuilder.js +100 -96
  37. package/dist/esm/components/agent-builder/AgentBuilder.js.map +1 -1
  38. package/dist/esm/components/agent-builder/AgentBuilder.model.d.ts +144 -1
  39. package/dist/esm/components/agent-builder/AgentBuilder.styled.d.ts +0 -21
  40. package/dist/esm/components/agent-builder/AgentBuilder.styled.js +42 -111
  41. package/dist/esm/components/agent-builder/AgentBuilder.styled.js.map +1 -1
  42. package/dist/esm/components/agent-builder/components/ConfigToolPanel.d.ts +33 -0
  43. package/dist/esm/components/agent-builder/components/ConfigToolPanel.js +242 -0
  44. package/dist/esm/components/agent-builder/components/ConfigToolPanel.js.map +1 -0
  45. package/dist/esm/components/agent-builder/components/CreateSubAgentPanel.d.ts +9 -1
  46. package/dist/esm/components/agent-builder/components/CreateSubAgentPanel.js +318 -219
  47. package/dist/esm/components/agent-builder/components/CreateSubAgentPanel.js.map +1 -1
  48. package/dist/esm/components/agent-builder/components/DrawerHeaderText.d.ts +25 -0
  49. package/dist/esm/components/agent-builder/components/DrawerHeaderText.js +32 -0
  50. package/dist/esm/components/agent-builder/components/DrawerHeaderText.js.map +1 -0
  51. package/dist/esm/components/agent-builder/components/MentionEditor.d.ts +6 -0
  52. package/dist/esm/components/agent-builder/components/MentionEditor.js +38 -30
  53. package/dist/esm/components/agent-builder/components/MentionEditor.js.map +1 -1
  54. package/dist/esm/components/agent-builder/components/MentionField.js +77 -52
  55. package/dist/esm/components/agent-builder/components/MentionField.js.map +1 -1
  56. package/dist/esm/components/agent-builder/components/MentionPicker.d.ts +7 -0
  57. package/dist/esm/components/agent-builder/components/MentionPicker.js +139 -129
  58. package/dist/esm/components/agent-builder/components/MentionPicker.js.map +1 -1
  59. package/dist/esm/components/agent-builder/components/RestApiToolPanel.d.ts +27 -0
  60. package/dist/esm/components/agent-builder/components/RestApiToolPanel.js +267 -0
  61. package/dist/esm/components/agent-builder/components/RestApiToolPanel.js.map +1 -0
  62. package/dist/esm/components/agent-builder/components/SelectableListSection.d.ts +14 -0
  63. package/dist/esm/components/agent-builder/components/SelectableListSection.js +166 -140
  64. package/dist/esm/components/agent-builder/components/SelectableListSection.js.map +1 -1
  65. package/dist/esm/components/agent-builder/components/ToolInstructionsField.d.ts +19 -0
  66. package/dist/esm/components/agent-builder/components/ToolInstructionsField.js +66 -0
  67. package/dist/esm/components/agent-builder/components/ToolInstructionsField.js.map +1 -0
  68. package/dist/esm/components/agent-builder/constants/tools.d.ts +65 -0
  69. package/dist/esm/components/agent-builder/constants/tools.js +29 -0
  70. package/dist/esm/components/agent-builder/constants/tools.js.map +1 -0
  71. package/dist/esm/components/agent-builder/context/AgentBuilderContext.d.ts +19 -1
  72. package/dist/esm/components/agent-builder/context/AgentBuilderContext.js +169 -140
  73. package/dist/esm/components/agent-builder/context/AgentBuilderContext.js.map +1 -1
  74. package/dist/esm/components/agent-builder/index.d.ts +2 -1
  75. package/dist/esm/components/agent-builder/steps/Step3HowItResponds.js +241 -141
  76. package/dist/esm/components/agent-builder/steps/Step3HowItResponds.js.map +1 -1
  77. package/dist/esm/components/agent-builder/utils/mentionSerialization.d.ts +18 -3
  78. package/dist/esm/components/agent-builder/utils/mentionSerialization.js +81 -62
  79. package/dist/esm/components/agent-builder/utils/mentionSerialization.js.map +1 -1
  80. package/dist/esm/components/agent-builder/utils/sourceIcons.d.ts +15 -9
  81. package/dist/esm/components/agent-builder/utils/sourceIcons.js +16 -8
  82. package/dist/esm/components/agent-builder/utils/sourceIcons.js.map +1 -1
  83. package/dist/esm/components/side-modal/SideModal.style.js +1 -0
  84. package/dist/esm/components/side-modal/SideModal.style.js.map +1 -1
  85. package/dist/esm/index.js +97 -95
  86. package/dist/esm/index.js.map +1 -1
  87. package/package.json +2 -1
@@ -1,212 +1,222 @@
1
- import { jsxs as h, jsx as s, Fragment as q } from "react/jsx-runtime";
2
- import F from "../../../assets/icons/chevronRight.svg.js";
3
- import G from "../../../assets/icons/searchIcon.svg.js";
4
- import J from "../../../icons/Arrows/Normal arrows/ArrowLeft.js";
5
- import { useState as I, useMemo as m, useEffect as R, useRef as Q } from "react";
6
- import d from "styled-components";
7
- import { TitleSmall as V, BodySecondary as W } from "../../TypographyStyle.js";
8
- import { COLORS as n } from "../../../constants/Theme.js";
9
- import { toolSourceLabel as T } from "../utils/mentionSerialization.js";
10
- import { SOURCE_ICONS as O, renderSourceIcon as N } from "../utils/sourceIcons.js";
11
- const X = [
12
- { key: "tool", label: "Tools" },
13
- { key: "subagent", label: "Sub-agent" }
14
- ], k = (r) => r.meta, S = (r) => k(r)?.plainLabel ?? r.label, Y = "__bik_create_subagent__", ge = ({
15
- items: r,
16
- onSelect: C,
17
- registerKeyHandler: x,
18
- onClose: L,
1
+ import { jsxs as f, jsx as d, Fragment as F } from "react/jsx-runtime";
2
+ import G from "../../../assets/icons/chevronRight.svg.js";
3
+ import J from "../../../assets/icons/searchIcon.svg.js";
4
+ import Q from "../../../icons/Arrows/Normal arrows/ArrowLeft.js";
5
+ import { useState as S, useMemo as b, useEffect as P, useRef as V } from "react";
6
+ import u from "styled-components";
7
+ import { TitleSmall as W, BodySecondary as X } from "../../TypographyStyle.js";
8
+ import { COLORS as r } from "../../../constants/Theme.js";
9
+ import { CATEGORIES as Y } from "../constants/tools.js";
10
+ import { toolSourceLabel as z } from "../utils/mentionSerialization.js";
11
+ import { sourceIcon as M, renderSourceIcon as N } from "../utils/sourceIcons.js";
12
+ const x = (o) => o.meta, $ = (o) => x(o)?.plainLabel ?? o.label, Z = "__bik_create_subagent__", be = ({
13
+ items: o,
14
+ onSelect: A,
15
+ registerKeyHandler: k,
16
+ onClose: C,
19
17
  onCreateSubAgent: g,
20
- initialSource: z
18
+ initialSource: O,
19
+ toolActions: v
21
20
  }) => {
22
- const [M, A] = I(null), [a, $] = I(z ?? null), [y, p] = I(0), [b, _] = I(""), f = m(
23
- () => r.filter((t) => k(t)?.kind === "tool"),
24
- [r]
25
- ), v = m(
26
- () => r.filter((t) => k(t)?.kind === "subagent"),
27
- [r]
28
- ), P = m(() => {
21
+ const [j, R] = S(null), [c, B] = S(O ?? null), [y, p] = S(0), [m, _] = S(""), h = b(
22
+ () => o.filter((t) => x(t)?.kind === "tool"),
23
+ [o]
24
+ ), w = b(
25
+ () => o.filter((t) => x(t)?.kind === "subagent"),
26
+ [o]
27
+ ), D = b(() => {
29
28
  const t = [];
30
- return f.forEach((e) => {
31
- const u = k(e)?.source ?? "other";
32
- t.includes(u) || t.push(u);
29
+ return h.forEach((e) => {
30
+ const s = x(e)?.source ?? "other";
31
+ t.includes(s) || t.push(s);
33
32
  }), t;
34
- }, [f]), w = m(
35
- () => X.filter(
36
- (t) => t.key === "tool" ? f.length > 0 : v.length > 0 || !!g
33
+ }, [h]), I = b(
34
+ () => Y.filter(
35
+ (t) => t.key === "tool" ? h.length > 0 || (v?.length ?? 0) > 0 : w.length > 0 || !!g
37
36
  ),
38
- [f.length, v.length, g]
39
- ), B = w.length === 1 ? w[0].key : null, o = M ?? B, l = o ? o === "subagent" ? (
37
+ [h.length, w.length, g, v?.length]
38
+ ), E = I.length === 1 ? I[0].key : null, i = j ?? E, a = i ? i === "subagent" ? (
40
39
  // Always titled — with a back chevron only when the category chooser is above.
41
40
  {
42
41
  title: "Sub-agent",
43
- onBack: B ? void 0 : () => A(null)
42
+ onBack: E ? void 0 : () => R(null)
44
43
  }
45
- ) : a ? {
46
- title: T(a),
47
- onBack: () => $(null),
48
- icon: O[a]
49
- } : B ? null : { title: "Tools", onBack: () => A(null) } : null, i = m(() => {
50
- if (!o)
51
- return w.map((e) => ({
44
+ ) : c ? {
45
+ title: z(c),
46
+ onBack: () => B(null),
47
+ icon: M(c)
48
+ } : E ? null : { title: "Tools", onBack: () => R(null) } : null, l = b(() => {
49
+ if (!i)
50
+ return I.map((e) => ({
52
51
  id: e.key,
53
52
  label: e.label,
54
53
  drillsIn: !0,
55
54
  onActivate: () => {
56
- A(e.key), $(null);
55
+ R(e.key), B(null);
57
56
  }
58
57
  }));
59
- if (o === "subagent") {
60
- const e = b.trim().toLowerCase(), u = v.filter((c) => !e || S(c).toLowerCase().includes(e)).map((c) => ({
61
- id: String(c.id),
62
- label: S(c),
58
+ if (i === "subagent") {
59
+ const e = m.trim().toLowerCase(), s = w.filter((n) => !e || $(n).toLowerCase().includes(e)).map((n) => ({
60
+ id: String(n.id),
61
+ label: $(n),
63
62
  drillsIn: !1,
64
- onActivate: () => C(c)
63
+ onActivate: () => A(n)
65
64
  }));
66
- return g && u.push({
67
- id: Y,
65
+ return g && s.push({
66
+ id: Z,
68
67
  label: "Create new",
69
68
  drillsIn: !1,
70
69
  isCreate: !0,
71
70
  onActivate: () => {
72
- L?.(), g();
71
+ C?.(), g();
73
72
  }
74
- }), u;
73
+ }), s;
75
74
  }
76
- if (!a)
77
- return P.map((e) => ({
78
- id: e,
79
- label: T(e),
75
+ if (!c) {
76
+ const e = D.map((n) => ({
77
+ id: n,
78
+ label: z(n),
80
79
  drillsIn: !0,
81
- icon: O[e],
82
- onActivate: () => $(e)
80
+ icon: M(n),
81
+ onActivate: () => B(n)
82
+ })), s = (v ?? []).map((n) => ({
83
+ id: `action:${n.source}`,
84
+ label: n.label,
85
+ drillsIn: !0,
86
+ icon: n.icon,
87
+ onActivate: () => {
88
+ C?.(), n.onSelect();
89
+ }
83
90
  }));
84
- const t = b.trim().toLowerCase();
85
- return f.filter((e) => (k(e)?.source ?? "other") === a).filter((e) => !t || S(e).toLowerCase().includes(t)).map((e) => ({
91
+ return [...e, ...s];
92
+ }
93
+ const t = m.trim().toLowerCase();
94
+ return h.filter((e) => (x(e)?.source ?? "other") === c).filter((e) => !t || $(e).toLowerCase().includes(t)).map((e) => ({
86
95
  id: String(e.id),
87
- label: S(e),
96
+ label: $(e),
88
97
  drillsIn: !1,
89
- onActivate: () => C(e)
98
+ onActivate: () => A(e)
90
99
  }));
91
100
  }, [
92
- o,
101
+ i,
102
+ I,
103
+ c,
104
+ m,
105
+ h,
93
106
  w,
94
- a,
95
- b,
96
- f,
97
- v,
98
- P,
107
+ D,
108
+ A,
99
109
  C,
100
- L,
101
- g
110
+ g,
111
+ v
102
112
  ]);
103
- R(() => p(0), [o, a, b, r]), R(() => _(""), [o, a]);
104
- const D = Q({ rows: i, activeIndex: y, header: l });
105
- D.current = { rows: i, activeIndex: y, header: l }, R(() => {
106
- if (x)
107
- return x((t) => {
108
- const { rows: e, activeIndex: u, header: c } = D.current;
113
+ P(() => p(0), [i, c, m, o]), P(() => _(""), [i, c]);
114
+ const T = V({ rows: l, activeIndex: y, header: a });
115
+ T.current = { rows: l, activeIndex: y, header: a }, P(() => {
116
+ if (k)
117
+ return k((t) => {
118
+ const { rows: e, activeIndex: s, header: n } = T.current;
109
119
  switch (t.key) {
110
120
  case "ArrowDown":
111
- return e.length && p((E) => (E + 1) % e.length), !0;
121
+ return e.length && p((L) => (L + 1) % e.length), !0;
112
122
  case "ArrowUp":
113
- return e.length && p((E) => (E + e.length - 1) % e.length), !0;
123
+ return e.length && p((L) => (L + e.length - 1) % e.length), !0;
114
124
  case "ArrowRight":
115
125
  case "Enter":
116
- return e[u]?.onActivate(), !0;
126
+ return e[s]?.onActivate(), !0;
117
127
  case "ArrowLeft":
118
- return c?.onBack ? (c.onBack(), !0) : !1;
128
+ return n?.onBack ? (n.onBack(), !0) : !1;
119
129
  default:
120
130
  return !1;
121
131
  }
122
- }), () => x(null);
123
- }, [x]);
124
- const U = o ? i.length && !i[0].drillsIn ? "items" : "sources" : "categories", j = o === "tool" && !!a || o === "subagent";
125
- return /* @__PURE__ */ h(Z, { className: `bik-mention-picker bik-mention-picker--${U}`, children: [
126
- l && /* @__PURE__ */ h(
127
- re,
132
+ }), () => k(null);
133
+ }, [k]);
134
+ const U = i ? l.length && !l[0].drillsIn ? "items" : "sources" : "categories", q = i === "tool" && !!c || i === "subagent";
135
+ return /* @__PURE__ */ f(K, { className: `bik-mention-picker bik-mention-picker--${U}`, children: [
136
+ a && /* @__PURE__ */ f(
137
+ oe,
128
138
  {
129
139
  type: "button",
130
- onClick: l.onBack,
131
- disabled: !l.onBack,
140
+ onClick: a.onBack,
141
+ disabled: !a.onBack,
132
142
  style: {
133
- background: n.surface.subdued,
134
- cursor: l.onBack ? "pointer" : "default"
143
+ background: r.surface.subdued,
144
+ cursor: a.onBack ? "pointer" : "default"
135
145
  },
136
146
  children: [
137
- l.icon ? N(l.icon) : l.onBack ? /* @__PURE__ */ s(
138
- J,
147
+ a.icon ? N(a.icon) : a.onBack ? /* @__PURE__ */ d(
148
+ Q,
139
149
  {
140
150
  width: 20,
141
151
  height: 20,
142
- color: n.content.primary
152
+ color: r.content.primary
143
153
  }
144
154
  ) : null,
145
- /* @__PURE__ */ h(V, { children: [
155
+ /* @__PURE__ */ f(W, { children: [
146
156
  " ",
147
- l.title
157
+ a.title
148
158
  ] })
149
159
  ]
150
160
  }
151
161
  ),
152
- j && /* @__PURE__ */ h(K, { children: [
153
- /* @__PURE__ */ s(
154
- G,
162
+ q && /* @__PURE__ */ f(H, { children: [
163
+ /* @__PURE__ */ d(
164
+ J,
155
165
  {
156
166
  width: 20,
157
167
  height: 20,
158
- color: n.content.placeholder
168
+ color: r.content.placeholder
159
169
  }
160
170
  ),
161
- /* @__PURE__ */ s(
162
- H,
171
+ /* @__PURE__ */ d(
172
+ ee,
163
173
  {
164
174
  autoFocus: !0,
165
- value: b,
175
+ value: m,
166
176
  placeholder: "Search",
167
177
  "data-test": "mention-picker-search",
168
178
  onChange: (t) => _(t.target.value),
169
179
  onKeyDown: (t) => {
170
- i.length && (t.key === "ArrowDown" ? (t.preventDefault(), p((e) => (e + 1) % i.length)) : t.key === "ArrowUp" ? (t.preventDefault(), p((e) => (e + i.length - 1) % i.length)) : t.key === "Enter" && (t.preventDefault(), i[y]?.onActivate()));
180
+ l.length && (t.key === "ArrowDown" ? (t.preventDefault(), p((e) => (e + 1) % l.length)) : t.key === "ArrowUp" ? (t.preventDefault(), p((e) => (e + l.length - 1) % l.length)) : t.key === "Enter" && (t.preventDefault(), l[y]?.onActivate()));
171
181
  }
172
182
  }
173
183
  )
174
184
  ] }),
175
- i.length === 0 ? /* @__PURE__ */ s(oe, { children: o === "subagent" ? "No sub-agents available" : "No tools available" }) : i.map((t, e) => /* @__PURE__ */ s(
176
- ee,
185
+ l.length === 0 ? /* @__PURE__ */ d(ie, { children: i === "subagent" ? "No sub-agents available" : "No tools available" }) : l.map((t, e) => /* @__PURE__ */ d(
186
+ te,
177
187
  {
178
188
  type: "button",
179
189
  $active: e === y,
180
190
  onMouseEnter: () => p(e),
181
191
  onClick: t.onActivate,
182
- children: t.isCreate ? /* @__PURE__ */ s(ne, { children: t.label }) : /* @__PURE__ */ h(q, { children: [
183
- /* @__PURE__ */ h(te, { children: [
192
+ children: t.isCreate ? /* @__PURE__ */ d(re, { children: t.label }) : /* @__PURE__ */ f(F, { children: [
193
+ /* @__PURE__ */ f(ne, { children: [
184
194
  N(t.icon),
185
- /* @__PURE__ */ s(W, { color: n.content.primary, children: t.label })
195
+ /* @__PURE__ */ d(X, { color: r.content.primary, children: t.label })
186
196
  ] }),
187
- t.drillsIn && /* @__PURE__ */ s(F, { width: 12, height: 12 })
197
+ t.drillsIn && /* @__PURE__ */ d(G, { width: 12, height: 12 })
188
198
  ] })
189
199
  },
190
200
  t.id
191
201
  ))
192
202
  ] });
193
- }, Z = d.div`
203
+ }, K = u.div`
194
204
  display: flex;
195
205
  flex-direction: column;
196
206
  min-width: 240px;
197
207
  max-height: 301px;
198
208
  overflow-y: auto;
199
- background: ${n.surface.standard};
200
- border: 1px solid ${n.stroke.primary};
209
+ background: ${r.surface.standard};
210
+ border: 1px solid ${r.stroke.primary};
201
211
  border-radius: 4px;
202
212
  box-shadow: 0px -2px 8px 0px #0000001f;
203
- `, K = d.div`
213
+ `, H = u.div`
204
214
  display: flex;
205
215
  align-items: center;
206
216
  gap: 8px;
207
217
  padding: 10px 12px;
208
- border-bottom: 1px solid ${n.stroke.primary};
209
- `, H = d.input`
218
+ border-bottom: 1px solid ${r.stroke.primary};
219
+ `, ee = u.input`
210
220
  flex: 1;
211
221
  min-width: 0;
212
222
  border: none;
@@ -214,12 +224,12 @@ const X = [
214
224
  background: transparent;
215
225
  font-family: Inter;
216
226
  font-size: 14px;
217
- color: ${n.content.primary};
227
+ color: ${r.content.primary};
218
228
 
219
229
  &::placeholder {
220
- color: ${n.content.placeholder};
230
+ color: ${r.content.placeholder};
221
231
  }
222
- `, ee = d.button`
232
+ `, te = u.button`
223
233
  display: flex;
224
234
  justify-content: space-between;
225
235
  align-items: center;
@@ -228,32 +238,32 @@ const X = [
228
238
  padding: 8px 10px;
229
239
  height: 48px;
230
240
  border: none;
231
- border-bottom: 1px solid ${n.stroke.primary};
232
- background: ${(r) => r.$active ? n.surface.subdued : "transparent"};
241
+ border-bottom: 1px solid ${r.stroke.primary};
242
+ background: ${(o) => o.$active ? r.surface.subdued : "transparent"};
233
243
  cursor: pointer;
234
244
  text-align: left;
235
245
 
236
246
  &:hover {
237
- background: ${n.surface.subdued};
247
+ background: ${r.surface.subdued};
238
248
  }
239
- `, te = d.div`
249
+ `, ne = u.div`
240
250
  display: flex;
241
251
  align-items: center;
242
252
  gap: 12px;
243
253
  min-width: 0;
244
- `, ne = d.div`
254
+ `, re = u.div`
245
255
  width: 100%;
246
256
  text-align: center;
247
- color: ${n.content.brand};
257
+ color: ${r.content.brand};
248
258
  font-family: Inter;
249
259
  font-size: 14px;
250
260
  font-weight: 600;
251
- `, re = d.button`
261
+ `, oe = u.button`
252
262
  display: flex;
253
263
  align-items: center;
254
264
  padding: 12px 16px;
255
265
  border: none;
256
- border-bottom: 1px solid ${n.stroke.primary};
266
+ border-bottom: 1px solid ${r.stroke.primary};
257
267
  background: transparent;
258
268
  cursor: pointer;
259
269
  font-family: Inter;
@@ -261,13 +271,13 @@ const X = [
261
271
  font-weight: 600;
262
272
  height: 48px;
263
273
  gap: 4px;
264
- `, oe = d.div`
274
+ `, ie = u.div`
265
275
  padding: 12px 10px;
266
276
  font-family: Inter;
267
277
  font-size: 13px;
268
- color: ${n.content.secondary};
278
+ color: ${r.content.secondary};
269
279
  `;
270
280
  export {
271
- ge as MentionPicker
281
+ be as MentionPicker
272
282
  };
273
283
  //# sourceMappingURL=MentionPicker.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"MentionPicker.js","sources":["../../../../../src/components/agent-builder/components/MentionPicker.tsx"],"sourcesContent":["// import ChevronLeft from '@src/assets/icons/chevronLeft.svg';\nimport ChevronRight from '@src/assets/icons/chevronRight.svg';\nimport SearchIcon from '@src/assets/icons/searchIcon.svg';\nimport type { MentionDropdownRenderProps, MentionItem } from '@src/editor';\nimport SvgArrowLeft from '@src/icons/Arrows/Normal arrows/ArrowLeft';\nimport React, { useEffect, useMemo, useRef, useState } from 'react';\nimport styled from 'styled-components';\nimport { BodySecondary, TitleSmall } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport {\n\tMentionKindMeta,\n\ttoolSourceLabel,\n} from '../utils/mentionSerialization';\nimport {\n\trenderSourceIcon,\n\tSOURCE_ICONS,\n\tSourceIcon,\n} from '../utils/sourceIcons';\n\ntype Category = 'tool' | 'subagent';\n\nconst CATEGORIES: { key: Category; label: string }[] = [\n\t{ key: 'tool', label: 'Tools' },\n\t{ key: 'subagent', label: 'Sub-agent' },\n];\n\nconst metaOf = (item: MentionItem): MentionKindMeta | undefined =>\n\titem.meta as unknown as MentionKindMeta | undefined;\n\nconst rowLabel = (item: MentionItem): string =>\n\tmetaOf(item)?.plainLabel ?? item.label;\n\n/** One navigable row in the picker's current view. */\ntype PickerRowModel = {\n\tid: string;\n\tlabel: string;\n\t/** Drill-in rows show a chevron; leaf (selectable) rows do not. */\n\tdrillsIn: boolean;\n\t/** Leading brand glyph (source rows only). */\n\ticon?: SourceIcon;\n\t/** Brand-coloured \"Create new\" action row (not a selectable item). */\n\tisCreate?: boolean;\n\tonActivate: () => void;\n};\n\n/** Sentinel id for the sub-agent \"Create new\" row. */\nconst CREATE_SUBAGENT_ID = '__bik_create_subagent__';\n\ntype MentionPickerProps = MentionDropdownRenderProps & {\n\t/** Opens the create-sub-agent drawer (shows a \"Create new\" row in the Sub-agent view). */\n\tonCreateSubAgent?: () => void;\n\t/**\n\t * Open already drilled into this tool source (e.g. `'shopify'`) — its tool list\n\t * is shown immediately. */\n\tinitialSource?: string;\n};\n\n/**\n * `@` reference picker. Drills:\n * root → Tools → <source> (Manifest / Shopify / …) → tool\n * → Sub-agent → sub-agent\n * (\"Add condition\" and \"Variables\" are intentionally not shown yet.)\n *\n * Owns keyboard navigation (↑/↓ move, →/Enter activate, ← go back) over the\n * CURRENTLY visible rows — registered with the editor via `registerKeyHandler`.\n */\nexport const MentionPicker: React.FC<MentionPickerProps> = ({\n\titems,\n\tonSelect,\n\tregisterKeyHandler,\n\tonClose,\n\tonCreateSubAgent,\n\tinitialSource,\n}) => {\n\tconst [category, setCategory] = useState<Category | null>(null);\n\tconst [source, setSource] = useState<string | null>(initialSource ?? null);\n\tconst [activeIndex, setActiveIndex] = useState(0);\n\t// Search box shown inside a source's tool list (Manifest / Shopify); filters\n\t// that source's tools by name.\n\tconst [search, setSearch] = useState('');\n\n\tconst tools = useMemo(\n\t\t() => items.filter((i) => metaOf(i)?.kind === 'tool'),\n\t\t[items],\n\t);\n\tconst subAgents = useMemo(\n\t\t() => items.filter((i) => metaOf(i)?.kind === 'subagent'),\n\t\t[items],\n\t);\n\tconst sources = useMemo(() => {\n\t\tconst acc: string[] = [];\n\t\ttools.forEach((t) => {\n\t\t\tconst s = metaOf(t)?.source ?? 'other';\n\t\t\tif (!acc.includes(s)) {\n\t\t\t\tacc.push(s);\n\t\t\t}\n\t\t});\n\t\treturn acc;\n\t}, [tools]);\n\n\t// Show a category when it has items — and ALWAYS show Sub-agent when creating\n\t// one is possible, so an agent with no sub-agents yet still gets the root\n\t// \"Tools / Sub-agent\" choice (with a \"Create new\" inside). When only one is\n\t// available (e.g. the sub-agent drawer offers tools only) the selector is skipped.\n\tconst availableCategories = useMemo(\n\t\t() =>\n\t\t\tCATEGORIES.filter((c) =>\n\t\t\t\tc.key === 'tool'\n\t\t\t\t\t? tools.length > 0\n\t\t\t\t\t: subAgents.length > 0 || !!onCreateSubAgent,\n\t\t\t),\n\t\t[tools.length, subAgents.length, onCreateSubAgent],\n\t);\n\tconst soleCategory =\n\t\tavailableCategories.length === 1 ? availableCategories[0].key : null;\n\tconst activeCategory = category ?? soleCategory;\n\n\t// Title shown above the current view. `onBack` is omitted at a root level (a\n\t// sole category has nowhere to go back to) — the header then shows as a plain\n\t// title with no chevron. In a source detail view the leading glyph is the\n\t// source icon (per design), otherwise it's a back chevron.\n\tconst header: {\n\t\ttitle: string;\n\t\tonBack?: () => void;\n\t\ticon?: SourceIcon;\n\t} | null = !activeCategory\n\t\t? null\n\t\t: activeCategory === 'subagent'\n\t\t? // Always titled — with a back chevron only when the category chooser is above.\n\t\t {\n\t\t\t\ttitle: 'Sub-agent',\n\t\t\t\tonBack: soleCategory ? undefined : () => setCategory(null),\n\t\t }\n\t\t: source\n\t\t? {\n\t\t\t\ttitle: toolSourceLabel(source),\n\t\t\t\tonBack: () => setSource(null),\n\t\t\t\ticon: SOURCE_ICONS[source],\n\t\t }\n\t\t: soleCategory\n\t\t? null\n\t\t: { title: 'Tools', onBack: () => setCategory(null) };\n\n\t// Build the navigable rows for the current view.\n\tconst rows: PickerRowModel[] = useMemo(() => {\n\t\tif (!activeCategory) {\n\t\t\treturn availableCategories.map((c) => ({\n\t\t\t\tid: c.key,\n\t\t\t\tlabel: c.label,\n\t\t\t\tdrillsIn: true,\n\t\t\t\tonActivate: () => {\n\t\t\t\t\tsetCategory(c.key);\n\t\t\t\t\tsetSource(null);\n\t\t\t\t},\n\t\t\t}));\n\t\t}\n\t\tif (activeCategory === 'subagent') {\n\t\t\tconst sq = search.trim().toLowerCase();\n\t\t\tconst leaves: PickerRowModel[] = subAgents\n\t\t\t\t.filter((item) => !sq || rowLabel(item).toLowerCase().includes(sq))\n\t\t\t\t.map((item) => ({\n\t\t\t\t\tid: String(item.id),\n\t\t\t\t\tlabel: rowLabel(item),\n\t\t\t\t\tdrillsIn: false,\n\t\t\t\t\tonActivate: () => onSelect(item),\n\t\t\t\t}));\n\t\t\t// \"Create new\" opens the drawer — first dismiss the menu (strips the \"@\").\n\t\t\tif (onCreateSubAgent) {\n\t\t\t\tleaves.push({\n\t\t\t\t\tid: CREATE_SUBAGENT_ID,\n\t\t\t\t\tlabel: 'Create new',\n\t\t\t\t\tdrillsIn: false,\n\t\t\t\t\tisCreate: true,\n\t\t\t\t\tonActivate: () => {\n\t\t\t\t\t\tonClose?.();\n\t\t\t\t\t\tonCreateSubAgent();\n\t\t\t\t\t},\n\t\t\t\t});\n\t\t\t}\n\t\t\treturn leaves;\n\t\t}\n\t\tif (!source) {\n\t\t\treturn sources.map((s) => ({\n\t\t\t\tid: s,\n\t\t\t\tlabel: toolSourceLabel(s),\n\t\t\t\tdrillsIn: true,\n\t\t\t\ticon: SOURCE_ICONS[s],\n\t\t\t\tonActivate: () => setSource(s),\n\t\t\t}));\n\t\t}\n\t\tconst q = search.trim().toLowerCase();\n\t\treturn tools\n\t\t\t.filter((t) => (metaOf(t)?.source ?? 'other') === source)\n\t\t\t.filter((t) => !q || rowLabel(t).toLowerCase().includes(q))\n\t\t\t.map((item) => ({\n\t\t\t\tid: String(item.id),\n\t\t\t\tlabel: rowLabel(item),\n\t\t\t\tdrillsIn: false,\n\t\t\t\tonActivate: () => onSelect(item),\n\t\t\t}));\n\t}, [\n\t\tactiveCategory,\n\t\tavailableCategories,\n\t\tsource,\n\t\tsearch,\n\t\ttools,\n\t\tsubAgents,\n\t\tsources,\n\t\tonSelect,\n\t\tonClose,\n\t\tonCreateSubAgent,\n\t]);\n\n\t// Reset highlight whenever the view (or filtered result set) changes.\n\tuseEffect(() => setActiveIndex(0), [activeCategory, source, search, items]);\n\t// Clear the search box when leaving a source view.\n\tuseEffect(() => setSearch(''), [activeCategory, source]);\n\n\t// Keep the latest rows/index reachable from the stable key handler.\n\tconst navRef = useRef({ rows, activeIndex, header });\n\tnavRef.current = { rows, activeIndex, header };\n\n\tuseEffect(() => {\n\t\tif (!registerKeyHandler) {\n\t\t\treturn;\n\t\t}\n\t\tregisterKeyHandler((event) => {\n\t\t\tconst { rows: r, activeIndex: i, header: h } = navRef.current;\n\t\t\tswitch (event.key) {\n\t\t\t\tcase 'ArrowDown':\n\t\t\t\t\tif (r.length) setActiveIndex((p) => (p + 1) % r.length);\n\t\t\t\t\treturn true;\n\t\t\t\tcase 'ArrowUp':\n\t\t\t\t\tif (r.length) setActiveIndex((p) => (p + r.length - 1) % r.length);\n\t\t\t\t\treturn true;\n\t\t\t\tcase 'ArrowRight':\n\t\t\t\tcase 'Enter':\n\t\t\t\t\tr[i]?.onActivate();\n\t\t\t\t\treturn true;\n\t\t\t\tcase 'ArrowLeft':\n\t\t\t\t\tif (h?.onBack) {\n\t\t\t\t\t\th.onBack();\n\t\t\t\t\t\treturn true;\n\t\t\t\t\t}\n\t\t\t\t\treturn false;\n\t\t\t\tdefault:\n\t\t\t\t\treturn false;\n\t\t\t}\n\t\t});\n\t\treturn () => registerKeyHandler(null);\n\t}, [registerKeyHandler]);\n\n\tconst variant = !activeCategory\n\t\t? 'categories'\n\t\t: rows.length && !rows[0].drillsIn\n\t\t? 'items'\n\t\t: 'sources';\n\n\t// Search lives inside a source's tool list (Manifest / Shopify) and in the\n\t// sub-agent list.\n\tconst showSearch =\n\t\t(activeCategory === 'tool' && !!source) || activeCategory === 'subagent';\n\n\treturn (\n\t\t<PickerCard className={`bik-mention-picker bik-mention-picker--${variant}`}>\n\t\t\t{header && (\n\t\t\t\t<PickerBack\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\tonClick={header.onBack}\n\t\t\t\t\tdisabled={!header.onBack}\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tbackground: COLORS.surface.subdued,\n\t\t\t\t\t\tcursor: header.onBack ? 'pointer' : 'default',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{header.icon ? (\n\t\t\t\t\t\trenderSourceIcon(header.icon)\n\t\t\t\t\t) : header.onBack ? (\n\t\t\t\t\t\t<SvgArrowLeft\n\t\t\t\t\t\t\twidth={20}\n\t\t\t\t\t\t\theight={20}\n\t\t\t\t\t\t\tcolor={COLORS.content.primary}\n\t\t\t\t\t\t/>\n\t\t\t\t\t) : null}\n\t\t\t\t\t<TitleSmall> {header.title}</TitleSmall>\n\t\t\t\t</PickerBack>\n\t\t\t)}\n\t\t\t{showSearch && (\n\t\t\t\t<PickerSearchRow>\n\t\t\t\t\t<SearchIcon\n\t\t\t\t\t\twidth={20}\n\t\t\t\t\t\theight={20}\n\t\t\t\t\t\tcolor={COLORS.content.placeholder}\n\t\t\t\t\t/>\n\t\t\t\t\t<PickerSearchInput\n\t\t\t\t\t\t// Focus on open so the user can type immediately (appears only\n\t\t\t\t\t\t// after they drill into a source).\n\t\t\t\t\t\t// eslint-disable-next-line jsx-a11y/no-autofocus\n\t\t\t\t\t\tautoFocus\n\t\t\t\t\t\tvalue={search}\n\t\t\t\t\t\tplaceholder=\"Search\"\n\t\t\t\t\t\tdata-test=\"mention-picker-search\"\n\t\t\t\t\t\tonChange={(e) => setSearch(e.target.value)}\n\t\t\t\t\t\tonKeyDown={(e) => {\n\t\t\t\t\t\t\tif (!rows.length) {\n\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tif (e.key === 'ArrowDown') {\n\t\t\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\t\t\tsetActiveIndex((p) => (p + 1) % rows.length);\n\t\t\t\t\t\t\t} else if (e.key === 'ArrowUp') {\n\t\t\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\t\t\tsetActiveIndex((p) => (p + rows.length - 1) % rows.length);\n\t\t\t\t\t\t\t} else if (e.key === 'Enter') {\n\t\t\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\t\t\trows[activeIndex]?.onActivate();\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t</PickerSearchRow>\n\t\t\t)}\n\t\t\t{rows.length === 0 ? (\n\t\t\t\t<PickerEmpty>\n\t\t\t\t\t{activeCategory === 'subagent'\n\t\t\t\t\t\t? 'No sub-agents available'\n\t\t\t\t\t\t: 'No tools available'}\n\t\t\t\t</PickerEmpty>\n\t\t\t) : (\n\t\t\t\trows.map((row, i) => (\n\t\t\t\t\t<PickerRow\n\t\t\t\t\t\tkey={row.id}\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t$active={i === activeIndex}\n\t\t\t\t\t\tonMouseEnter={() => setActiveIndex(i)}\n\t\t\t\t\t\tonClick={row.onActivate}\n\t\t\t\t\t>\n\t\t\t\t\t\t{row.isCreate ? (\n\t\t\t\t\t\t\t<CreateRowText>{row.label}</CreateRowText>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t<PickerRowMain>\n\t\t\t\t\t\t\t\t\t{renderSourceIcon(row.icon)}\n\t\t\t\t\t\t\t\t\t<BodySecondary color={COLORS.content.primary}>\n\t\t\t\t\t\t\t\t\t\t{row.label}\n\t\t\t\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t\t\t\t</PickerRowMain>\n\t\t\t\t\t\t\t\t{row.drillsIn && <ChevronRight width={12} height={12} />}\n\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</PickerRow>\n\t\t\t\t))\n\t\t\t)}\n\t\t</PickerCard>\n\t);\n};\n\nconst PickerCard = styled.div`\n\tdisplay: flex;\n\tflex-direction: column;\n\tmin-width: 240px;\n\tmax-height: 301px;\n\toverflow-y: auto;\n\tbackground: ${COLORS.surface.standard};\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 4px;\n\tbox-shadow: 0px -2px 8px 0px #0000001f;\n`;\n\n// Search box at the top of a source's tool list (Manifest / Shopify).\nconst PickerSearchRow = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n\tpadding: 10px 12px;\n\tborder-bottom: 1px solid ${COLORS.stroke.primary};\n`;\n\nconst PickerSearchInput = styled.input`\n\tflex: 1;\n\tmin-width: 0;\n\tborder: none;\n\toutline: none;\n\tbackground: transparent;\n\tfont-family: Inter;\n\tfont-size: 14px;\n\tcolor: ${COLORS.content.primary};\n\n\t&::placeholder {\n\t\tcolor: ${COLORS.content.placeholder};\n\t}\n`;\n\nconst PickerRow = styled.button<{ $active?: boolean }>`\n\tdisplay: flex;\n\tjustify-content: space-between;\n\talign-items: center;\n\tgap: 2px;\n\twidth: 100%;\n\tpadding: 8px 10px;\n\theight: 48px;\n\tborder: none;\n\tborder-bottom: 1px solid ${COLORS.stroke.primary};\n\tbackground: ${(p) => (p.$active ? COLORS.surface.subdued : 'transparent')};\n\tcursor: pointer;\n\ttext-align: left;\n\n\t&:hover {\n\t\tbackground: ${COLORS.surface.subdued};\n\t}\n`;\n\n// Left cluster: leading source glyph + label (chevron stays right via PickerRow).\nconst PickerRowMain = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 12px;\n\tmin-width: 0;\n`;\n\n// \"Create new\" — centered brand text, no icon (matches the side-panel dropdown).\nconst CreateRowText = styled.div`\n\twidth: 100%;\n\ttext-align: center;\n\tcolor: ${COLORS.content.brand};\n\tfont-family: Inter;\n\tfont-size: 14px;\n\tfont-weight: 600;\n`;\n\nconst PickerBack = styled.button`\n\tdisplay: flex;\n\talign-items: center;\n\tpadding: 12px 16px;\n\tborder: none;\n\tborder-bottom: 1px solid ${COLORS.stroke.primary};\n\tbackground: transparent;\n\tcursor: pointer;\n\tfont-family: Inter;\n\tfont-size: 12px;\n\tfont-weight: 600;\n\theight: 48px;\n\tgap: 4px;\n`;\n\nconst PickerEmpty = styled.div`\n\tpadding: 12px 10px;\n\tfont-family: Inter;\n\tfont-size: 13px;\n\tcolor: ${COLORS.content.secondary};\n`;\n"],"names":["CATEGORIES","metaOf","item","rowLabel","CREATE_SUBAGENT_ID","MentionPicker","items","onSelect","registerKeyHandler","onClose","onCreateSubAgent","initialSource","category","setCategory","useState","source","setSource","activeIndex","setActiveIndex","search","setSearch","tools","useMemo","i","subAgents","sources","acc","t","s","availableCategories","c","soleCategory","activeCategory","header","toolSourceLabel","SOURCE_ICONS","rows","sq","leaves","q","useEffect","navRef","useRef","event","r","h","p","variant","showSearch","jsxs","PickerCard","PickerBack","COLORS","renderSourceIcon","jsx","SvgArrowLeft","TitleSmall","PickerSearchRow","SearchIcon","PickerSearchInput","e","PickerEmpty","row","PickerRow","CreateRowText","Fragment","PickerRowMain","BodySecondary","ChevronRight","styled"],"mappings":"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"}
1
+ {"version":3,"file":"MentionPicker.js","sources":["../../../../../src/components/agent-builder/components/MentionPicker.tsx"],"sourcesContent":["// import ChevronLeft from '@src/assets/icons/chevronLeft.svg';\nimport ChevronRight from '@src/assets/icons/chevronRight.svg';\nimport SearchIcon from '@src/assets/icons/searchIcon.svg';\nimport type { MentionDropdownRenderProps, MentionItem } from '@src/editor';\nimport SvgArrowLeft from '@src/icons/Arrows/Normal arrows/ArrowLeft';\nimport React, { useEffect, useMemo, useRef, useState } from 'react';\nimport styled from 'styled-components';\nimport { BodySecondary, TitleSmall } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport { CATEGORIES } from '../constants/tools';\nimport type { Category, ToolAction } from '../constants/tools';\nimport {\n\tMentionKindMeta,\n\ttoolSourceLabel,\n} from '../utils/mentionSerialization';\nimport { renderSourceIcon, sourceIcon, SourceIcon } from '../utils/sourceIcons';\n\nconst metaOf = (item: MentionItem): MentionKindMeta | undefined =>\n\titem.meta as unknown as MentionKindMeta | undefined;\n\nconst rowLabel = (item: MentionItem): string =>\n\tmetaOf(item)?.plainLabel ?? item.label;\n\n/** One navigable row in the picker's current view. */\ntype PickerRowModel = {\n\tid: string;\n\tlabel: string;\n\t/** Drill-in rows show a chevron; leaf (selectable) rows do not. */\n\tdrillsIn: boolean;\n\t/** Leading brand glyph (source rows only). */\n\ticon?: SourceIcon;\n\t/** Brand-coloured \"Create new\" action row (not a selectable item). */\n\tisCreate?: boolean;\n\tonActivate: () => void;\n};\n\n/** Sentinel id for the sub-agent \"Create new\" row. */\nconst CREATE_SUBAGENT_ID = '__bik_create_subagent__';\n\ntype MentionPickerProps = MentionDropdownRenderProps & {\n\t/** Opens the create-sub-agent drawer (shows a \"Create new\" row in the Sub-agent view). */\n\tonCreateSubAgent?: () => void;\n\t/**\n\t * Open already drilled into this tool source (e.g. `'shopify'`) — its tool list\n\t * is shown immediately. */\n\tinitialSource?: string;\n\t/**\n\t * Built-in tool actions (Rest API / Handover to email) shown in the Tools view.\n\t * Picking one opens its config drawer (via `onSelect`) and dismisses the picker\n\t * — it never inserts a mention into the text.\n\t */\n\ttoolActions?: ToolAction[];\n};\n\n/**\n * `@` reference picker. Drills:\n * root → Tools → <source> (Manifest / Shopify / …) → tool\n * → Sub-agent → sub-agent\n * (\"Add condition\" and \"Variables\" are intentionally not shown yet.)\n *\n * Owns keyboard navigation (↑/↓ move, →/Enter activate, ← go back) over the\n * CURRENTLY visible rows — registered with the editor via `registerKeyHandler`.\n */\nexport const MentionPicker: React.FC<MentionPickerProps> = ({\n\titems,\n\tonSelect,\n\tregisterKeyHandler,\n\tonClose,\n\tonCreateSubAgent,\n\tinitialSource,\n\ttoolActions,\n}) => {\n\tconst [category, setCategory] = useState<Category | null>(null);\n\tconst [source, setSource] = useState<string | null>(initialSource ?? null);\n\tconst [activeIndex, setActiveIndex] = useState(0);\n\t// Search box shown inside a source's tool list (Manifest / Shopify); filters\n\t// that source's tools by name.\n\tconst [search, setSearch] = useState('');\n\n\tconst tools = useMemo(\n\t\t() => items.filter((i) => metaOf(i)?.kind === 'tool'),\n\t\t[items],\n\t);\n\tconst subAgents = useMemo(\n\t\t() => items.filter((i) => metaOf(i)?.kind === 'subagent'),\n\t\t[items],\n\t);\n\tconst sources = useMemo(() => {\n\t\tconst acc: string[] = [];\n\t\ttools.forEach((t) => {\n\t\t\tconst s = metaOf(t)?.source ?? 'other';\n\t\t\tif (!acc.includes(s)) {\n\t\t\t\tacc.push(s);\n\t\t\t}\n\t\t});\n\t\treturn acc;\n\t}, [tools]);\n\n\t// Show a category when it has items — and ALWAYS show Sub-agent when creating\n\t// one is possible, so an agent with no sub-agents yet still gets the root\n\t// \"Tools / Sub-agent\" choice (with a \"Create new\" inside). When only one is\n\t// available (e.g. the sub-agent drawer offers tools only) the selector is skipped.\n\tconst availableCategories = useMemo(\n\t\t() =>\n\t\t\tCATEGORIES.filter((c) =>\n\t\t\t\tc.key === 'tool'\n\t\t\t\t\t? tools.length > 0 || (toolActions?.length ?? 0) > 0\n\t\t\t\t\t: subAgents.length > 0 || !!onCreateSubAgent,\n\t\t\t),\n\t\t[tools.length, subAgents.length, onCreateSubAgent, toolActions?.length],\n\t);\n\tconst soleCategory =\n\t\tavailableCategories.length === 1 ? availableCategories[0].key : null;\n\tconst activeCategory = category ?? soleCategory;\n\n\t// Title shown above the current view. `onBack` is omitted at a root level (a\n\t// sole category has nowhere to go back to) — the header then shows as a plain\n\t// title with no chevron. In a source detail view the leading glyph is the\n\t// source icon (per design), otherwise it's a back chevron.\n\tconst header: {\n\t\ttitle: string;\n\t\tonBack?: () => void;\n\t\ticon?: SourceIcon;\n\t} | null = !activeCategory\n\t\t? null\n\t\t: activeCategory === 'subagent'\n\t\t? // Always titled — with a back chevron only when the category chooser is above.\n\t\t {\n\t\t\t\ttitle: 'Sub-agent',\n\t\t\t\tonBack: soleCategory ? undefined : () => setCategory(null),\n\t\t }\n\t\t: source\n\t\t? {\n\t\t\t\ttitle: toolSourceLabel(source),\n\t\t\t\tonBack: () => setSource(null),\n\t\t\t\ticon: sourceIcon(source),\n\t\t }\n\t\t: soleCategory\n\t\t? null\n\t\t: { title: 'Tools', onBack: () => setCategory(null) };\n\n\t// Build the navigable rows for the current view.\n\tconst rows: PickerRowModel[] = useMemo(() => {\n\t\tif (!activeCategory) {\n\t\t\treturn availableCategories.map((c) => ({\n\t\t\t\tid: c.key,\n\t\t\t\tlabel: c.label,\n\t\t\t\tdrillsIn: true,\n\t\t\t\tonActivate: () => {\n\t\t\t\t\tsetCategory(c.key);\n\t\t\t\t\tsetSource(null);\n\t\t\t\t},\n\t\t\t}));\n\t\t}\n\t\tif (activeCategory === 'subagent') {\n\t\t\tconst sq = search.trim().toLowerCase();\n\t\t\tconst leaves: PickerRowModel[] = subAgents\n\t\t\t\t.filter((item) => !sq || rowLabel(item).toLowerCase().includes(sq))\n\t\t\t\t.map((item) => ({\n\t\t\t\t\tid: String(item.id),\n\t\t\t\t\tlabel: rowLabel(item),\n\t\t\t\t\tdrillsIn: false,\n\t\t\t\t\tonActivate: () => onSelect(item),\n\t\t\t\t}));\n\t\t\t// \"Create new\" opens the drawer — first dismiss the menu (strips the \"@\").\n\t\t\tif (onCreateSubAgent) {\n\t\t\t\tleaves.push({\n\t\t\t\t\tid: CREATE_SUBAGENT_ID,\n\t\t\t\t\tlabel: 'Create new',\n\t\t\t\t\tdrillsIn: false,\n\t\t\t\t\tisCreate: true,\n\t\t\t\t\tonActivate: () => {\n\t\t\t\t\t\tonClose?.();\n\t\t\t\t\t\tonCreateSubAgent();\n\t\t\t\t\t},\n\t\t\t\t});\n\t\t\t}\n\t\t\treturn leaves;\n\t\t}\n\t\tif (!source) {\n\t\t\tconst sourceRows: PickerRowModel[] = sources.map((s) => ({\n\t\t\t\tid: s,\n\t\t\t\tlabel: toolSourceLabel(s),\n\t\t\t\tdrillsIn: true,\n\t\t\t\ticon: sourceIcon(s),\n\t\t\t\tonActivate: () => setSource(s),\n\t\t\t}));\n\t\t\t// Built-in action tools sit alongside the real sources; picking one opens\n\t\t\t// its drawer (after dismissing the picker) rather than drilling / inserting.\n\t\t\tconst actionRows: PickerRowModel[] = (toolActions ?? []).map((a) => ({\n\t\t\t\tid: `action:${a.source}`,\n\t\t\t\tlabel: a.label,\n\t\t\t\tdrillsIn: true,\n\t\t\t\ticon: a.icon,\n\t\t\t\tonActivate: () => {\n\t\t\t\t\tonClose?.();\n\t\t\t\t\ta.onSelect();\n\t\t\t\t},\n\t\t\t}));\n\t\t\treturn [...sourceRows, ...actionRows];\n\t\t}\n\t\tconst q = search.trim().toLowerCase();\n\t\treturn tools\n\t\t\t.filter((t) => (metaOf(t)?.source ?? 'other') === source)\n\t\t\t.filter((t) => !q || rowLabel(t).toLowerCase().includes(q))\n\t\t\t.map((item) => ({\n\t\t\t\tid: String(item.id),\n\t\t\t\tlabel: rowLabel(item),\n\t\t\t\tdrillsIn: false,\n\t\t\t\tonActivate: () => onSelect(item),\n\t\t\t}));\n\t}, [\n\t\tactiveCategory,\n\t\tavailableCategories,\n\t\tsource,\n\t\tsearch,\n\t\ttools,\n\t\tsubAgents,\n\t\tsources,\n\t\tonSelect,\n\t\tonClose,\n\t\tonCreateSubAgent,\n\t\ttoolActions,\n\t]);\n\n\t// Reset highlight whenever the view (or filtered result set) changes.\n\tuseEffect(() => setActiveIndex(0), [activeCategory, source, search, items]);\n\t// Clear the search box when leaving a source view.\n\tuseEffect(() => setSearch(''), [activeCategory, source]);\n\n\t// Keep the latest rows/index reachable from the stable key handler.\n\tconst navRef = useRef({ rows, activeIndex, header });\n\tnavRef.current = { rows, activeIndex, header };\n\n\tuseEffect(() => {\n\t\tif (!registerKeyHandler) {\n\t\t\treturn;\n\t\t}\n\t\tregisterKeyHandler((event) => {\n\t\t\tconst { rows: r, activeIndex: i, header: h } = navRef.current;\n\t\t\tswitch (event.key) {\n\t\t\t\tcase 'ArrowDown':\n\t\t\t\t\tif (r.length) setActiveIndex((p) => (p + 1) % r.length);\n\t\t\t\t\treturn true;\n\t\t\t\tcase 'ArrowUp':\n\t\t\t\t\tif (r.length) setActiveIndex((p) => (p + r.length - 1) % r.length);\n\t\t\t\t\treturn true;\n\t\t\t\tcase 'ArrowRight':\n\t\t\t\tcase 'Enter':\n\t\t\t\t\tr[i]?.onActivate();\n\t\t\t\t\treturn true;\n\t\t\t\tcase 'ArrowLeft':\n\t\t\t\t\tif (h?.onBack) {\n\t\t\t\t\t\th.onBack();\n\t\t\t\t\t\treturn true;\n\t\t\t\t\t}\n\t\t\t\t\treturn false;\n\t\t\t\tdefault:\n\t\t\t\t\treturn false;\n\t\t\t}\n\t\t});\n\t\treturn () => registerKeyHandler(null);\n\t}, [registerKeyHandler]);\n\n\tconst variant = !activeCategory\n\t\t? 'categories'\n\t\t: rows.length && !rows[0].drillsIn\n\t\t? 'items'\n\t\t: 'sources';\n\n\t// Search lives inside a source's tool list (Manifest / Shopify) and in the\n\t// sub-agent list.\n\tconst showSearch =\n\t\t(activeCategory === 'tool' && !!source) || activeCategory === 'subagent';\n\n\treturn (\n\t\t<PickerCard className={`bik-mention-picker bik-mention-picker--${variant}`}>\n\t\t\t{header && (\n\t\t\t\t<PickerBack\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\tonClick={header.onBack}\n\t\t\t\t\tdisabled={!header.onBack}\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tbackground: COLORS.surface.subdued,\n\t\t\t\t\t\tcursor: header.onBack ? 'pointer' : 'default',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{header.icon ? (\n\t\t\t\t\t\trenderSourceIcon(header.icon)\n\t\t\t\t\t) : header.onBack ? (\n\t\t\t\t\t\t<SvgArrowLeft\n\t\t\t\t\t\t\twidth={20}\n\t\t\t\t\t\t\theight={20}\n\t\t\t\t\t\t\tcolor={COLORS.content.primary}\n\t\t\t\t\t\t/>\n\t\t\t\t\t) : null}\n\t\t\t\t\t<TitleSmall> {header.title}</TitleSmall>\n\t\t\t\t</PickerBack>\n\t\t\t)}\n\t\t\t{showSearch && (\n\t\t\t\t<PickerSearchRow>\n\t\t\t\t\t<SearchIcon\n\t\t\t\t\t\twidth={20}\n\t\t\t\t\t\theight={20}\n\t\t\t\t\t\tcolor={COLORS.content.placeholder}\n\t\t\t\t\t/>\n\t\t\t\t\t<PickerSearchInput\n\t\t\t\t\t\t// Focus on open so the user can type immediately (appears only\n\t\t\t\t\t\t// after they drill into a source).\n\t\t\t\t\t\t// eslint-disable-next-line jsx-a11y/no-autofocus\n\t\t\t\t\t\tautoFocus\n\t\t\t\t\t\tvalue={search}\n\t\t\t\t\t\tplaceholder=\"Search\"\n\t\t\t\t\t\tdata-test=\"mention-picker-search\"\n\t\t\t\t\t\tonChange={(e) => setSearch(e.target.value)}\n\t\t\t\t\t\tonKeyDown={(e) => {\n\t\t\t\t\t\t\tif (!rows.length) {\n\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tif (e.key === 'ArrowDown') {\n\t\t\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\t\t\tsetActiveIndex((p) => (p + 1) % rows.length);\n\t\t\t\t\t\t\t} else if (e.key === 'ArrowUp') {\n\t\t\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\t\t\tsetActiveIndex((p) => (p + rows.length - 1) % rows.length);\n\t\t\t\t\t\t\t} else if (e.key === 'Enter') {\n\t\t\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\t\t\trows[activeIndex]?.onActivate();\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t</PickerSearchRow>\n\t\t\t)}\n\t\t\t{rows.length === 0 ? (\n\t\t\t\t<PickerEmpty>\n\t\t\t\t\t{activeCategory === 'subagent'\n\t\t\t\t\t\t? 'No sub-agents available'\n\t\t\t\t\t\t: 'No tools available'}\n\t\t\t\t</PickerEmpty>\n\t\t\t) : (\n\t\t\t\trows.map((row, i) => (\n\t\t\t\t\t<PickerRow\n\t\t\t\t\t\tkey={row.id}\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t$active={i === activeIndex}\n\t\t\t\t\t\tonMouseEnter={() => setActiveIndex(i)}\n\t\t\t\t\t\tonClick={row.onActivate}\n\t\t\t\t\t>\n\t\t\t\t\t\t{row.isCreate ? (\n\t\t\t\t\t\t\t<CreateRowText>{row.label}</CreateRowText>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t<PickerRowMain>\n\t\t\t\t\t\t\t\t\t{renderSourceIcon(row.icon)}\n\t\t\t\t\t\t\t\t\t<BodySecondary color={COLORS.content.primary}>\n\t\t\t\t\t\t\t\t\t\t{row.label}\n\t\t\t\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t\t\t\t</PickerRowMain>\n\t\t\t\t\t\t\t\t{row.drillsIn && <ChevronRight width={12} height={12} />}\n\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</PickerRow>\n\t\t\t\t))\n\t\t\t)}\n\t\t</PickerCard>\n\t);\n};\n\nconst PickerCard = styled.div`\n\tdisplay: flex;\n\tflex-direction: column;\n\tmin-width: 240px;\n\tmax-height: 301px;\n\toverflow-y: auto;\n\tbackground: ${COLORS.surface.standard};\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 4px;\n\tbox-shadow: 0px -2px 8px 0px #0000001f;\n`;\n\n// Search box at the top of a source's tool list (Manifest / Shopify).\nconst PickerSearchRow = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n\tpadding: 10px 12px;\n\tborder-bottom: 1px solid ${COLORS.stroke.primary};\n`;\n\nconst PickerSearchInput = styled.input`\n\tflex: 1;\n\tmin-width: 0;\n\tborder: none;\n\toutline: none;\n\tbackground: transparent;\n\tfont-family: Inter;\n\tfont-size: 14px;\n\tcolor: ${COLORS.content.primary};\n\n\t&::placeholder {\n\t\tcolor: ${COLORS.content.placeholder};\n\t}\n`;\n\nconst PickerRow = styled.button<{ $active?: boolean }>`\n\tdisplay: flex;\n\tjustify-content: space-between;\n\talign-items: center;\n\tgap: 2px;\n\twidth: 100%;\n\tpadding: 8px 10px;\n\theight: 48px;\n\tborder: none;\n\tborder-bottom: 1px solid ${COLORS.stroke.primary};\n\tbackground: ${(p) => (p.$active ? COLORS.surface.subdued : 'transparent')};\n\tcursor: pointer;\n\ttext-align: left;\n\n\t&:hover {\n\t\tbackground: ${COLORS.surface.subdued};\n\t}\n`;\n\n// Left cluster: leading source glyph + label (chevron stays right via PickerRow).\nconst PickerRowMain = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 12px;\n\tmin-width: 0;\n`;\n\n// \"Create new\" — centered brand text, no icon (matches the side-panel dropdown).\nconst CreateRowText = styled.div`\n\twidth: 100%;\n\ttext-align: center;\n\tcolor: ${COLORS.content.brand};\n\tfont-family: Inter;\n\tfont-size: 14px;\n\tfont-weight: 600;\n`;\n\nconst PickerBack = styled.button`\n\tdisplay: flex;\n\talign-items: center;\n\tpadding: 12px 16px;\n\tborder: none;\n\tborder-bottom: 1px solid ${COLORS.stroke.primary};\n\tbackground: transparent;\n\tcursor: pointer;\n\tfont-family: Inter;\n\tfont-size: 12px;\n\tfont-weight: 600;\n\theight: 48px;\n\tgap: 4px;\n`;\n\nconst PickerEmpty = styled.div`\n\tpadding: 12px 10px;\n\tfont-family: Inter;\n\tfont-size: 13px;\n\tcolor: ${COLORS.content.secondary};\n`;\n"],"names":["metaOf","item","rowLabel","CREATE_SUBAGENT_ID","MentionPicker","items","onSelect","registerKeyHandler","onClose","onCreateSubAgent","initialSource","toolActions","category","setCategory","useState","source","setSource","activeIndex","setActiveIndex","search","setSearch","tools","useMemo","i","subAgents","sources","acc","t","availableCategories","CATEGORIES","c","soleCategory","activeCategory","header","toolSourceLabel","sourceIcon","rows","sq","leaves","sourceRows","s","actionRows","a","q","useEffect","navRef","useRef","event","r","h","p","variant","showSearch","jsxs","PickerCard","PickerBack","COLORS","renderSourceIcon","jsx","SvgArrowLeft","TitleSmall","PickerSearchRow","SearchIcon","PickerSearchInput","e","PickerEmpty","row","PickerRow","CreateRowText","Fragment","PickerRowMain","BodySecondary","ChevronRight","styled"],"mappings":"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"}
@@ -0,0 +1,27 @@
1
+ import { default as React } from 'react';
2
+ import { RestApiToolConfig } from '../AgentBuilder.model';
3
+ import { AgentCharLimits } from '../constants/charLimits';
4
+ interface RestApiToolPanelProps {
5
+ onClose: () => void;
6
+ /** Persist the config. A pending promise shows the Save loader. */
7
+ onSave: (config: RestApiToolConfig) => void | Promise<void>;
8
+ /** Seed values when editing an existing tool. */
9
+ initial?: RestApiToolConfig;
10
+ /** Optional "Improve with AI" for the instructions field. Omit to hide it. */
11
+ onImprove?: (text: string) => Promise<string>;
12
+ charLimits?: AgentCharLimits;
13
+ /** SideModal stacking order — raise it when opened over another drawer. */
14
+ zIndex?: number;
15
+ }
16
+ /**
17
+ * Right-side drawer to configure a "Rest API" tool: the endpoint the agent can
18
+ * call, plus a JSON request-body template and a sample response. Mount it fresh
19
+ * per open (key it) so `initial` seeds the state. Built on the shared `SideModal`
20
+ * shell and the BikEditor JSON body mode for the Request / Response editors.
21
+ */
22
+ export declare const RestApiToolPanel: React.FC<RestApiToolPanelProps>;
23
+ export declare const JsonFieldBox: {
24
+ borderRadius: string;
25
+ overflow: string;
26
+ };
27
+ export {};