@bikdotai/bik-component-library 0.0.841 → 0.0.842
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.
- package/dist/cjs/components/agent-builder/components/MentionPicker.js +26 -20
- package/dist/cjs/components/agent-builder/components/MentionPicker.js.map +1 -1
- package/dist/cjs/components/agent-builder/components/RequireVerificationModal.js +2 -0
- package/dist/cjs/components/agent-builder/components/RequireVerificationModal.js.map +1 -0
- package/dist/cjs/components/agent-builder/components/SelectableListSection.js +6 -6
- package/dist/cjs/components/agent-builder/components/SelectableListSection.js.map +1 -1
- package/dist/cjs/components/agent-builder/steps/Step3HowItResponds.js +1 -1
- package/dist/cjs/components/agent-builder/steps/Step3HowItResponds.js.map +1 -1
- package/dist/cjs/components/agent-builder/utils/mentionSerialization.js +1 -1
- package/dist/cjs/components/agent-builder/utils/mentionSerialization.js.map +1 -1
- package/dist/cjs/icons/Informational/Common UI/Shield.js +1 -1
- package/dist/cjs/icons/Informational/Common UI/Shield.js.map +1 -1
- package/dist/esm/components/agent-builder/AgentBuilder.model.d.ts +31 -1
- package/dist/esm/components/agent-builder/components/MentionPicker.js +142 -122
- package/dist/esm/components/agent-builder/components/MentionPicker.js.map +1 -1
- package/dist/esm/components/agent-builder/components/RequireVerificationModal.d.ts +18 -0
- package/dist/esm/components/agent-builder/components/RequireVerificationModal.js +74 -0
- package/dist/esm/components/agent-builder/components/RequireVerificationModal.js.map +1 -0
- package/dist/esm/components/agent-builder/components/SelectableListSection.d.ts +5 -0
- package/dist/esm/components/agent-builder/components/SelectableListSection.js +117 -106
- package/dist/esm/components/agent-builder/components/SelectableListSection.js.map +1 -1
- package/dist/esm/components/agent-builder/steps/Step3HowItResponds.js +286 -204
- package/dist/esm/components/agent-builder/steps/Step3HowItResponds.js.map +1 -1
- package/dist/esm/components/agent-builder/utils/mentionSerialization.d.ts +2 -0
- package/dist/esm/components/agent-builder/utils/mentionSerialization.js +41 -40
- package/dist/esm/components/agent-builder/utils/mentionSerialization.js.map +1 -1
- package/dist/esm/icons/Informational/Common UI/Shield.d.ts +1 -2
- package/dist/esm/icons/Informational/Common UI/Shield.js +10 -11
- package/dist/esm/icons/Informational/Common UI/Shield.js.map +1 -1
- package/package.json +1 -1
|
@@ -1,70 +1,71 @@
|
|
|
1
|
-
import { jsxs as
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
import { useState as
|
|
1
|
+
import { jsxs as b, jsx as s, Fragment as K } from "react/jsx-runtime";
|
|
2
|
+
import H from "../../../assets/icons/chevronRight.svg.js";
|
|
3
|
+
import ee from "../../../assets/icons/searchIcon.svg.js";
|
|
4
|
+
import te from "../../../icons/Arrows/Normal arrows/ArrowLeft.js";
|
|
5
|
+
import { useState as E, useMemo as k, useEffect as D, useRef as ne } from "react";
|
|
6
6
|
import p from "styled-components";
|
|
7
|
-
import { TitleSmall as
|
|
7
|
+
import { TitleSmall as re, BodySecondary as oe, BodyCaption as ie } from "../../TypographyStyle.js";
|
|
8
8
|
import { COLORS as i } from "../../../constants/Theme.js";
|
|
9
|
-
import { CATEGORIES as
|
|
10
|
-
import { toolSourceLabel as
|
|
11
|
-
import { sourceIcon as
|
|
12
|
-
|
|
9
|
+
import { CATEGORIES as ae, toolSourceRank as Q, CONFIG_TOOL_SOURCES as le } from "../constants/tools.js";
|
|
10
|
+
import { toolSourceLabel as M } from "../utils/mentionSerialization.js";
|
|
11
|
+
import { sourceIcon as q, renderSourceIcon as V } from "../utils/sourceIcons.js";
|
|
12
|
+
import W from "../../../icons/Informational/Common UI/Shield.js";
|
|
13
|
+
const h = (l) => l.meta, I = (l) => h(l)?.plainLabel ?? l.label, ce = "__bik_create_subagent__", qe = ({
|
|
13
14
|
items: l,
|
|
14
|
-
onSelect:
|
|
15
|
-
registerKeyHandler:
|
|
15
|
+
onSelect: R,
|
|
16
|
+
registerKeyHandler: S,
|
|
16
17
|
onClose: v,
|
|
17
18
|
onCreateSubAgent: y,
|
|
18
|
-
initialSource:
|
|
19
|
-
toolActions:
|
|
20
|
-
integrationStatus:
|
|
21
|
-
onConnectIntegration:
|
|
19
|
+
initialSource: N,
|
|
20
|
+
toolActions: x,
|
|
21
|
+
integrationStatus: U,
|
|
22
|
+
onConnectIntegration: j
|
|
22
23
|
}) => {
|
|
23
|
-
const [
|
|
24
|
-
() => l.filter((e) =>
|
|
24
|
+
const [X, _] = E(null), [c, O] = E(N ?? null), [C, g] = E(-1), [w, F] = E(""), m = k(
|
|
25
|
+
() => l.filter((e) => h(e)?.kind === "tool"),
|
|
25
26
|
[l]
|
|
26
|
-
), $ =
|
|
27
|
-
() => l.filter((e) =>
|
|
27
|
+
), $ = k(
|
|
28
|
+
() => l.filter((e) => h(e)?.kind === "subagent"),
|
|
28
29
|
[l]
|
|
29
|
-
),
|
|
30
|
+
), P = k(() => {
|
|
30
31
|
const e = [];
|
|
31
|
-
return
|
|
32
|
-
const f =
|
|
32
|
+
return m.forEach((r) => {
|
|
33
|
+
const f = h(r)?.source ?? "other";
|
|
33
34
|
e.includes(f) || e.push(f);
|
|
34
35
|
}), e;
|
|
35
|
-
}, [
|
|
36
|
+
}, [m]), T = k(
|
|
36
37
|
() => new Map(
|
|
37
|
-
(
|
|
38
|
+
(x ?? []).map((e) => [e.source, e])
|
|
38
39
|
),
|
|
39
|
-
[
|
|
40
|
-
),
|
|
41
|
-
() =>
|
|
42
|
-
(e) => e.key === "tool" ?
|
|
40
|
+
[x]
|
|
41
|
+
), A = k(
|
|
42
|
+
() => ae.filter(
|
|
43
|
+
(e) => e.key === "tool" ? m.length > 0 || (x?.length ?? 0) > 0 : $.length > 0 || !!y
|
|
43
44
|
),
|
|
44
|
-
[
|
|
45
|
-
),
|
|
45
|
+
[m.length, $.length, y, x?.length]
|
|
46
|
+
), z = A.length === 1 ? A[0].key : null, d = X ?? z, u = d ? d === "subagent" ? (
|
|
46
47
|
// Always titled — with a back arrow only when the category chooser is above.
|
|
47
48
|
{
|
|
48
49
|
title: "Sub-agent",
|
|
49
|
-
onBack:
|
|
50
|
+
onBack: z ? void 0 : () => _(null)
|
|
50
51
|
}
|
|
51
52
|
) : c ? {
|
|
52
|
-
title:
|
|
53
|
+
title: M(c),
|
|
53
54
|
// Deep-linked to a source (opened from a right-panel source button):
|
|
54
55
|
// that source IS the root, so no back arrow. In the @-drill flow
|
|
55
56
|
// (no initialSource) back returns to the source chooser.
|
|
56
|
-
onBack:
|
|
57
|
-
icon:
|
|
57
|
+
onBack: N ? void 0 : () => O(null),
|
|
58
|
+
icon: q(c)
|
|
58
59
|
} : (
|
|
59
60
|
// Always titled — matches the Sub-agent header; back arrow only when the
|
|
60
61
|
// category chooser is above (i.e. not the sole category).
|
|
61
62
|
{
|
|
62
63
|
title: "Tools",
|
|
63
|
-
onBack:
|
|
64
|
+
onBack: z ? void 0 : () => _(null)
|
|
64
65
|
}
|
|
65
|
-
) : null, a =
|
|
66
|
-
if (!
|
|
67
|
-
return
|
|
66
|
+
) : null, a = k(() => {
|
|
67
|
+
if (!d)
|
|
68
|
+
return A.map((n) => ({
|
|
68
69
|
id: n.key,
|
|
69
70
|
label: n.label,
|
|
70
71
|
drillsIn: !0,
|
|
@@ -72,15 +73,15 @@ const k = (l) => l.meta, I = (l) => k(l)?.plainLabel ?? l.label, le = "__bik_cre
|
|
|
72
73
|
_(n.key), O(null);
|
|
73
74
|
}
|
|
74
75
|
}));
|
|
75
|
-
if (
|
|
76
|
+
if (d === "subagent") {
|
|
76
77
|
const n = w.trim().toLowerCase(), t = $.filter((o) => !n || I(o).toLowerCase().includes(n)).map((o) => ({
|
|
77
78
|
id: String(o.id),
|
|
78
79
|
label: I(o),
|
|
79
80
|
drillsIn: !1,
|
|
80
|
-
onActivate: () =>
|
|
81
|
+
onActivate: () => R(o)
|
|
81
82
|
}));
|
|
82
83
|
return y && t.push({
|
|
83
|
-
id:
|
|
84
|
+
id: ce,
|
|
84
85
|
label: "Create new",
|
|
85
86
|
drillsIn: !1,
|
|
86
87
|
isCreate: !0,
|
|
@@ -90,61 +91,63 @@ const k = (l) => l.meta, I = (l) => k(l)?.plainLabel ?? l.label, le = "__bik_cre
|
|
|
90
91
|
}), t;
|
|
91
92
|
}
|
|
92
93
|
if (!c) {
|
|
93
|
-
const n = (
|
|
94
|
-
return [...
|
|
95
|
-
const o =
|
|
96
|
-
if ((o !== void 0 ? o.connected :
|
|
94
|
+
const n = (x ?? []).map((t) => t.source).filter((t) => !P.includes(t));
|
|
95
|
+
return [...P, ...n].sort((t, o) => Q(t) - Q(o)).map((t) => {
|
|
96
|
+
const o = T.get(t);
|
|
97
|
+
if ((o !== void 0 ? o.connected : U?.[t]) === !1)
|
|
97
98
|
return {
|
|
98
99
|
id: t,
|
|
99
|
-
label:
|
|
100
|
+
label: M(t),
|
|
100
101
|
drillsIn: !1,
|
|
101
|
-
icon:
|
|
102
|
+
icon: q(t) ?? o?.icon,
|
|
102
103
|
rightLabel: "Connect",
|
|
103
104
|
onActivate: () => {
|
|
104
|
-
v?.(), o?.onConnect ? o.onConnect() :
|
|
105
|
+
v?.(), o?.onConnect ? o.onConnect() : j?.(t);
|
|
105
106
|
}
|
|
106
107
|
};
|
|
107
|
-
const J =
|
|
108
|
-
(
|
|
108
|
+
const J = m.filter(
|
|
109
|
+
(L) => (h(L)?.source ?? "other") === t
|
|
109
110
|
);
|
|
110
111
|
if (J.length + (o ? 1 : 0) === 1) {
|
|
111
|
-
const
|
|
112
|
+
const L = q(t) ?? o?.icon;
|
|
112
113
|
if (o)
|
|
113
114
|
return {
|
|
114
115
|
id: t,
|
|
115
116
|
label: o.label,
|
|
116
117
|
drillsIn: !1,
|
|
117
|
-
icon:
|
|
118
|
+
icon: L,
|
|
118
119
|
onActivate: () => {
|
|
119
120
|
v?.(), o.onSelect();
|
|
120
121
|
}
|
|
121
122
|
};
|
|
122
|
-
const
|
|
123
|
+
const B = J[0];
|
|
123
124
|
return {
|
|
124
|
-
id: String(
|
|
125
|
-
label: I(
|
|
125
|
+
id: String(B.id),
|
|
126
|
+
label: I(B),
|
|
126
127
|
drillsIn: !1,
|
|
127
|
-
icon:
|
|
128
|
-
|
|
128
|
+
icon: L,
|
|
129
|
+
authRequired: h(B)?.authRequired,
|
|
130
|
+
onActivate: () => R(B)
|
|
129
131
|
};
|
|
130
132
|
}
|
|
131
133
|
return {
|
|
132
134
|
id: t,
|
|
133
|
-
label:
|
|
135
|
+
label: M(t),
|
|
134
136
|
drillsIn: !0,
|
|
135
|
-
icon:
|
|
137
|
+
icon: q(t) ?? o?.icon,
|
|
136
138
|
onActivate: () => O(t)
|
|
137
139
|
};
|
|
138
140
|
});
|
|
139
141
|
}
|
|
140
|
-
const e = w.trim().toLowerCase(), r =
|
|
142
|
+
const e = w.trim().toLowerCase(), r = m.filter((n) => (h(n)?.source ?? "other") === c).filter((n) => !e || I(n).toLowerCase().includes(e)).map((n) => ({
|
|
141
143
|
id: String(n.id),
|
|
142
144
|
label: I(n),
|
|
143
145
|
drillsIn: !1,
|
|
144
|
-
|
|
145
|
-
|
|
146
|
+
authRequired: h(n)?.authRequired,
|
|
147
|
+
onActivate: () => R(n)
|
|
148
|
+
})), f = T.get(c);
|
|
146
149
|
if (f) {
|
|
147
|
-
const n = c in
|
|
150
|
+
const n = c in le;
|
|
148
151
|
r.push({
|
|
149
152
|
id: `create:${c}`,
|
|
150
153
|
label: f.label,
|
|
@@ -157,32 +160,32 @@ const k = (l) => l.meta, I = (l) => k(l)?.plainLabel ?? l.label, le = "__bik_cre
|
|
|
157
160
|
}
|
|
158
161
|
return r;
|
|
159
162
|
}, [
|
|
160
|
-
|
|
161
|
-
|
|
163
|
+
d,
|
|
164
|
+
A,
|
|
162
165
|
c,
|
|
163
166
|
w,
|
|
164
|
-
|
|
167
|
+
m,
|
|
165
168
|
$,
|
|
166
|
-
|
|
167
|
-
|
|
169
|
+
P,
|
|
170
|
+
R,
|
|
168
171
|
v,
|
|
169
172
|
y,
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
173
|
+
x,
|
|
174
|
+
T,
|
|
175
|
+
U,
|
|
176
|
+
j
|
|
174
177
|
]);
|
|
175
|
-
|
|
176
|
-
const
|
|
177
|
-
|
|
178
|
-
if (
|
|
179
|
-
return
|
|
180
|
-
const { rows: r, activeIndex: f, header: n } =
|
|
178
|
+
D(() => g(-1), [d, c, w, l]), D(() => F(""), [d, c]);
|
|
179
|
+
const G = ne({ rows: a, activeIndex: C, header: u });
|
|
180
|
+
G.current = { rows: a, activeIndex: C, header: u }, D(() => {
|
|
181
|
+
if (S)
|
|
182
|
+
return S((e) => {
|
|
183
|
+
const { rows: r, activeIndex: f, header: n } = G.current;
|
|
181
184
|
switch (e.key) {
|
|
182
185
|
case "ArrowDown":
|
|
183
|
-
return r.length &&
|
|
186
|
+
return r.length && g((t) => (t + 1) % r.length), !0;
|
|
184
187
|
case "ArrowUp":
|
|
185
|
-
return r.length &&
|
|
188
|
+
return r.length && g((t) => (t + r.length - 1) % r.length), !0;
|
|
186
189
|
case "ArrowRight":
|
|
187
190
|
case "Enter":
|
|
188
191
|
return (r[f] ?? r[0])?.onActivate(), !0;
|
|
@@ -191,80 +194,91 @@ const k = (l) => l.meta, I = (l) => k(l)?.plainLabel ?? l.label, le = "__bik_cre
|
|
|
191
194
|
default:
|
|
192
195
|
return !1;
|
|
193
196
|
}
|
|
194
|
-
}), () =>
|
|
195
|
-
}, [
|
|
196
|
-
const
|
|
197
|
-
return /* @__PURE__ */
|
|
198
|
-
|
|
199
|
-
|
|
197
|
+
}), () => S(null);
|
|
198
|
+
}, [S]);
|
|
199
|
+
const Y = d ? a.length && !a[0].drillsIn ? "items" : "sources" : "categories", Z = d === "tool" && !!c || d === "subagent";
|
|
200
|
+
return /* @__PURE__ */ b(se, { className: `bik-mention-picker bik-mention-picker--${Y}`, children: [
|
|
201
|
+
u && /* @__PURE__ */ b(
|
|
202
|
+
be,
|
|
200
203
|
{
|
|
201
204
|
type: "button",
|
|
202
|
-
onClick:
|
|
203
|
-
disabled: !
|
|
205
|
+
onClick: u.onBack,
|
|
206
|
+
disabled: !u.onBack,
|
|
204
207
|
style: {
|
|
205
208
|
background: i.surface.subdued,
|
|
206
|
-
cursor:
|
|
209
|
+
cursor: u.onBack ? "pointer" : "default"
|
|
207
210
|
},
|
|
208
211
|
children: [
|
|
209
|
-
|
|
210
|
-
|
|
212
|
+
u.onBack && /* @__PURE__ */ s(
|
|
213
|
+
te,
|
|
211
214
|
{
|
|
212
215
|
width: 20,
|
|
213
216
|
height: 20,
|
|
214
217
|
color: i.content.primary
|
|
215
218
|
}
|
|
216
219
|
),
|
|
217
|
-
|
|
218
|
-
/* @__PURE__ */
|
|
220
|
+
u.icon && V(u.icon),
|
|
221
|
+
/* @__PURE__ */ b(re, { children: [
|
|
219
222
|
" ",
|
|
220
|
-
|
|
223
|
+
u.title
|
|
221
224
|
] })
|
|
222
225
|
]
|
|
223
226
|
}
|
|
224
227
|
),
|
|
225
|
-
|
|
226
|
-
/* @__PURE__ */
|
|
227
|
-
|
|
228
|
+
Z && /* @__PURE__ */ b(de, { children: [
|
|
229
|
+
/* @__PURE__ */ s(
|
|
230
|
+
ee,
|
|
228
231
|
{
|
|
229
232
|
width: 20,
|
|
230
233
|
height: 20,
|
|
231
234
|
color: i.content.placeholder
|
|
232
235
|
}
|
|
233
236
|
),
|
|
234
|
-
/* @__PURE__ */
|
|
235
|
-
|
|
237
|
+
/* @__PURE__ */ s(
|
|
238
|
+
ue,
|
|
236
239
|
{
|
|
237
240
|
autoFocus: !0,
|
|
238
241
|
value: w,
|
|
239
242
|
placeholder: "Search",
|
|
240
243
|
"data-test": "mention-picker-search",
|
|
241
|
-
onChange: (e) =>
|
|
244
|
+
onChange: (e) => F(e.target.value),
|
|
242
245
|
onKeyDown: (e) => {
|
|
243
|
-
a.length && (e.key === "ArrowDown" ? (e.preventDefault(),
|
|
246
|
+
a.length && (e.key === "ArrowDown" ? (e.preventDefault(), g((r) => (r + 1) % a.length)) : e.key === "ArrowUp" ? (e.preventDefault(), g((r) => (r + a.length - 1) % a.length)) : e.key === "Enter" && (e.preventDefault(), (a[C] ?? a[0])?.onActivate()));
|
|
244
247
|
}
|
|
245
248
|
}
|
|
246
249
|
)
|
|
247
250
|
] }),
|
|
248
|
-
a.length === 0 ? /* @__PURE__ */
|
|
249
|
-
|
|
251
|
+
a.length === 0 ? /* @__PURE__ */ s(xe, { children: d === "subagent" ? null : "No tools available" }) : a.map((e, r) => /* @__PURE__ */ s(
|
|
252
|
+
pe,
|
|
250
253
|
{
|
|
251
254
|
type: "button",
|
|
252
|
-
$active: r ===
|
|
253
|
-
onMouseEnter: () =>
|
|
254
|
-
onMouseLeave: () =>
|
|
255
|
+
$active: r === C,
|
|
256
|
+
onMouseEnter: () => g(r),
|
|
257
|
+
onMouseLeave: () => g(-1),
|
|
255
258
|
onClick: e.onActivate,
|
|
256
|
-
children: e.isCreate ? /* @__PURE__ */
|
|
257
|
-
/* @__PURE__ */
|
|
259
|
+
children: e.isCreate ? /* @__PURE__ */ s(me, { children: e.label }) : /* @__PURE__ */ b(K, { children: [
|
|
260
|
+
/* @__PURE__ */ b(fe, { children: [
|
|
258
261
|
V(e.icon),
|
|
259
|
-
/* @__PURE__ */
|
|
262
|
+
/* @__PURE__ */ s(oe, { color: i.content.primary, children: e.label }),
|
|
263
|
+
e.authRequired && /* @__PURE__ */ s(
|
|
264
|
+
W,
|
|
265
|
+
{
|
|
266
|
+
size: 14,
|
|
267
|
+
"aria-label": "Requires customer verification"
|
|
268
|
+
}
|
|
269
|
+
)
|
|
260
270
|
] }),
|
|
261
|
-
e.rightLabel ? /* @__PURE__ */
|
|
271
|
+
e.rightLabel ? /* @__PURE__ */ s(ge, { children: e.rightLabel }) : e.drillsIn && /* @__PURE__ */ s(H, { width: 12, height: 12 })
|
|
262
272
|
] })
|
|
263
273
|
},
|
|
264
274
|
e.id
|
|
265
|
-
))
|
|
275
|
+
)),
|
|
276
|
+
a.some((e) => e.authRequired) && /* @__PURE__ */ b(he, { children: [
|
|
277
|
+
/* @__PURE__ */ s(W, { size: 14 }),
|
|
278
|
+
/* @__PURE__ */ s(ie, { color: i.content.secondary, children: "Requires customer verification" })
|
|
279
|
+
] })
|
|
266
280
|
] });
|
|
267
|
-
},
|
|
281
|
+
}, se = p.div`
|
|
268
282
|
display: flex;
|
|
269
283
|
flex-direction: column;
|
|
270
284
|
min-width: 240px;
|
|
@@ -274,13 +288,13 @@ const k = (l) => l.meta, I = (l) => k(l)?.plainLabel ?? l.label, le = "__bik_cre
|
|
|
274
288
|
border: 1px solid ${i.stroke.primary};
|
|
275
289
|
border-radius: 4px;
|
|
276
290
|
box-shadow: 0px -2px 8px 0px #0000001f;
|
|
277
|
-
`,
|
|
291
|
+
`, de = p.div`
|
|
278
292
|
display: flex;
|
|
279
293
|
align-items: center;
|
|
280
294
|
gap: 8px;
|
|
281
295
|
padding: 10px 12px;
|
|
282
296
|
border-bottom: 1px solid ${i.stroke.primary};
|
|
283
|
-
`,
|
|
297
|
+
`, ue = p.input`
|
|
284
298
|
flex: 1;
|
|
285
299
|
min-width: 0;
|
|
286
300
|
border: none;
|
|
@@ -293,7 +307,7 @@ const k = (l) => l.meta, I = (l) => k(l)?.plainLabel ?? l.label, le = "__bik_cre
|
|
|
293
307
|
&::placeholder {
|
|
294
308
|
color: ${i.content.placeholder};
|
|
295
309
|
}
|
|
296
|
-
`,
|
|
310
|
+
`, pe = p.button`
|
|
297
311
|
display: flex;
|
|
298
312
|
justify-content: space-between;
|
|
299
313
|
align-items: center;
|
|
@@ -310,26 +324,32 @@ const k = (l) => l.meta, I = (l) => k(l)?.plainLabel ?? l.label, le = "__bik_cre
|
|
|
310
324
|
&:hover {
|
|
311
325
|
background: ${i.surface.hovered};
|
|
312
326
|
}
|
|
313
|
-
`,
|
|
327
|
+
`, fe = p.div`
|
|
314
328
|
display: flex;
|
|
315
329
|
align-items: center;
|
|
316
330
|
gap: 12px;
|
|
317
331
|
min-width: 0;
|
|
318
|
-
`,
|
|
332
|
+
`, he = p.div`
|
|
333
|
+
display: flex;
|
|
334
|
+
align-items: center;
|
|
335
|
+
gap: 6px;
|
|
336
|
+
padding: 8px 12px;
|
|
337
|
+
border-top: 1px solid ${i.stroke.primary};
|
|
338
|
+
`, ge = p.span`
|
|
319
339
|
flex-shrink: 0;
|
|
320
340
|
color: ${i.content.brand};
|
|
321
341
|
font-family: Inter;
|
|
322
342
|
font-size: 14px;
|
|
323
343
|
font-weight: 600;
|
|
324
344
|
white-space: nowrap;
|
|
325
|
-
`,
|
|
345
|
+
`, me = p.div`
|
|
326
346
|
width: 100%;
|
|
327
347
|
text-align: center;
|
|
328
348
|
color: ${i.content.brand};
|
|
329
349
|
font-family: Inter;
|
|
330
350
|
font-size: 14px;
|
|
331
351
|
font-weight: 600;
|
|
332
|
-
`,
|
|
352
|
+
`, be = p.button`
|
|
333
353
|
display: flex;
|
|
334
354
|
align-items: center;
|
|
335
355
|
padding: 12px 16px;
|
|
@@ -342,13 +362,13 @@ const k = (l) => l.meta, I = (l) => k(l)?.plainLabel ?? l.label, le = "__bik_cre
|
|
|
342
362
|
font-weight: 600;
|
|
343
363
|
height: 48px;
|
|
344
364
|
gap: 4px;
|
|
345
|
-
`,
|
|
365
|
+
`, xe = p.div`
|
|
346
366
|
padding: 12px 10px;
|
|
347
367
|
font-family: Inter;
|
|
348
368
|
font-size: 13px;
|
|
349
369
|
color: ${i.content.secondary};
|
|
350
370
|
`;
|
|
351
371
|
export {
|
|
352
|
-
|
|
372
|
+
qe as MentionPicker
|
|
353
373
|
};
|
|
354
374
|
//# 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\tCATEGORIES,\n\tCONFIG_TOOL_SOURCES,\n\ttoolSourceRank,\n} from '../constants/tools';\nimport type { Category, ToolAction, ToolSource } 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\t/**\n\t * Brand-coloured right-aligned action text (e.g. \"Connect\") shown in place of\n\t * the drill-in chevron — used for an unconnected integration source.\n\t */\n\trightLabel?: string;\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\t/**\n\t * Per-source integration connection state. A source whose value is `false`\n\t * renders a \"Connect\" row (like an unconnected action) instead of drilling in —\n\t * so native source groups (Shopify / BigCommerce / ShipStation) show \"Connect\"\n\t * consistently with the config actions (Slack).\n\t */\n\tintegrationStatus?: Partial<Record<ToolSource, boolean>>;\n\t/** Open the connect flow for an unconnected source (used by the Connect row). */\n\tonConnectIntegration?: (source: ToolSource) => void;\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\tintegrationStatus,\n\tonConnectIntegration,\n}) => {\n\tconst [category, setCategory] = useState<Category | null>(null);\n\tconst [source, setSource] = useState<string | null>(initialSource ?? null);\n\t// -1 = nothing highlighted; rows highlight only on hover / arrow keys\n\t// (a default highlight reads as a stuck hover state).\n\tconst [activeIndex, setActiveIndex] = useState(-1);\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\t// The built-in \"create\" action per source (Rest API / email / Slack). A source\n\t// with an action drills into [its instances + a \"Create new\" row] — like the\n\t// Sub-agent category — instead of showing a duplicate flat \"create\" row.\n\tconst actionBySource = useMemo(\n\t\t() =>\n\t\t\tnew Map<string, ToolAction>(\n\t\t\t\t(toolActions ?? []).map((a) => [a.source, a]),\n\t\t\t),\n\t\t[toolActions],\n\t);\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. When `onBack` is set the header leads with a back arrow, followed by\n\t// the source icon in a source detail view: `[← back][icon][title]`.\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 arrow 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\t// Deep-linked to a source (opened from a right-panel source button):\n\t\t\t\t// that source IS the root, so no back arrow. In the @-drill flow\n\t\t\t\t// (no initialSource) back returns to the source chooser.\n\t\t\t\tonBack: initialSource ? undefined : () => setSource(null),\n\t\t\t\ticon: sourceIcon(source),\n\t\t }\n\t\t: // Always titled — matches the Sub-agent header; back arrow only when the\n\t\t // category chooser is above (i.e. not the sole category).\n\t\t {\n\t\t\t\ttitle: 'Tools',\n\t\t\t\tonBack: soleCategory ? undefined : () => setCategory(null),\n\t\t };\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\t// One drill-in row per source: the real sources (from instances) plus any\n\t\t\t// action source (Rest API / email / Slack) with no instances yet, so it\n\t\t\t// still appears for first-time creation. Deduped — no more twin rows.\n\t\t\tconst actionOnly = (toolActions ?? [])\n\t\t\t\t.map((a) => a.source)\n\t\t\t\t.filter((s) => !sources.includes(s));\n\t\t\t// Fixed source order (manifest → shopify → rest_api → email → slack →\n\t\t\t// rest) so adding/updating a tool never reshuffles the picker rows.\n\t\t\treturn [...sources, ...actionOnly]\n\t\t\t\t.sort((a, b) => toolSourceRank(a) - toolSourceRank(b))\n\t\t\t\t.map((s) => {\n\t\t\t\t\tconst action = actionBySource.get(s);\n\t\t\t\t\t// Not connected → a \"Connect\" row (no drill-in / no instances / no\n\t\t\t\t\t// \"Create new\"); clicking dismisses the picker and runs the connect\n\t\t\t\t\t// flow. Applies to config actions (their own `connected`) AND native\n\t\t\t\t\t// source groups (via `integrationStatus`), so both look consistent.\n\t\t\t\t\tconst connected =\n\t\t\t\t\t\taction !== undefined\n\t\t\t\t\t\t\t? action.connected\n\t\t\t\t\t\t\t: integrationStatus?.[s as ToolSource];\n\t\t\t\t\tif (connected === false) {\n\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\tid: s,\n\t\t\t\t\t\t\tlabel: toolSourceLabel(s),\n\t\t\t\t\t\t\tdrillsIn: false,\n\t\t\t\t\t\t\ticon: sourceIcon(s) ?? action?.icon,\n\t\t\t\t\t\t\trightLabel: 'Connect',\n\t\t\t\t\t\t\tonActivate: () => {\n\t\t\t\t\t\t\t\tonClose?.();\n\t\t\t\t\t\t\t\tif (action?.onConnect) {\n\t\t\t\t\t\t\t\t\taction.onConnect();\n\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\tonConnectIntegration?.(s as ToolSource);\n\t\t\t\t\t\t\t\t}\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\t// A source whose drill-in view would hold exactly one leaf is\n\t\t\t\t\t// pointless to drill into — surface that single leaf right here at\n\t\t\t\t\t// the source level (its function name + the same source icon).\n\t\t\t\t\t// Covers \"no Rest API added yet\" (→ open the create modal directly)\n\t\t\t\t\t// and a config tool's single capability (Slack → \"Send Slack\n\t\t\t\t\t// message\", email → \"Send Email\").\n\t\t\t\t\tconst instances = tools.filter(\n\t\t\t\t\t\t(t) => (metaOf(t)?.source ?? 'other') === s,\n\t\t\t\t\t);\n\t\t\t\t\tif (instances.length + (action ? 1 : 0) === 1) {\n\t\t\t\t\t\tconst icon = sourceIcon(s) ?? action?.icon;\n\t\t\t\t\t\tif (action) {\n\t\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t\tid: s,\n\t\t\t\t\t\t\t\tlabel: action.label,\n\t\t\t\t\t\t\t\tdrillsIn: false,\n\t\t\t\t\t\t\t\ticon,\n\t\t\t\t\t\t\t\tonActivate: () => {\n\t\t\t\t\t\t\t\t\tonClose?.();\n\t\t\t\t\t\t\t\t\taction.onSelect();\n\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t};\n\t\t\t\t\t\t}\n\t\t\t\t\t\tconst only = instances[0];\n\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\tid: String(only.id),\n\t\t\t\t\t\t\tlabel: rowLabel(only),\n\t\t\t\t\t\t\tdrillsIn: false,\n\t\t\t\t\t\t\ticon,\n\t\t\t\t\t\t\tonActivate: () => onSelect(only),\n\t\t\t\t\t\t};\n\t\t\t\t\t}\n\t\t\t\t\treturn {\n\t\t\t\t\t\tid: s,\n\t\t\t\t\t\tlabel: toolSourceLabel(s),\n\t\t\t\t\t\tdrillsIn: true,\n\t\t\t\t\t\ticon: sourceIcon(s) ?? action?.icon,\n\t\t\t\t\t\tonActivate: () => setSource(s),\n\t\t\t\t\t};\n\t\t\t\t});\n\t\t}\n\t\tconst q = search.trim().toLowerCase();\n\t\tconst leaves: PickerRowModel[] = 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\t// A configurable source's add row, below any existing instances, opening\n\t\t// its drawer. Config tools (Slack / email) are a single fixed capability →\n\t\t// render like a normal tool leaf (label only, no icon — matching the tool\n\t\t// rows). Rest API instances are user-created, so its \"add\" stays a\n\t\t// brand-coloured create row.\n\t\tconst action = actionBySource.get(source);\n\t\tif (action) {\n\t\t\tconst isConfigTool = source in CONFIG_TOOL_SOURCES;\n\t\t\tleaves.push({\n\t\t\t\tid: `create:${source}`,\n\t\t\t\tlabel: action.label,\n\t\t\t\tdrillsIn: false,\n\t\t\t\tisCreate: !isConfigTool,\n\t\t\t\tonActivate: () => {\n\t\t\t\t\tonClose?.();\n\t\t\t\t\taction.onSelect();\n\t\t\t\t},\n\t\t\t});\n\t\t}\n\t\treturn leaves;\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\tactionBySource,\n\t\tintegrationStatus,\n\t\tonConnectIntegration,\n\t]);\n\n\t// Reset highlight whenever the view (or filtered result set) changes.\n\tuseEffect(() => setActiveIndex(-1), [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\t// Nothing highlighted yet → treat the first row as the target so\n\t\t\t\t\t// the editor's @-flow (type, then Enter) still works.\n\t\t\t\t\t(r[i] ?? r[0])?.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.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)}\n\t\t\t\t\t{header.icon && renderSourceIcon(header.icon)}\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\t(rows[activeIndex] ?? rows[0])?.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' ? null : '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\tonMouseLeave={() => setActiveIndex(-1)}\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.rightLabel ? (\n\t\t\t\t\t\t\t\t\t<RightActionText>{row.rightLabel}</RightActionText>\n\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\trow.drillsIn && <ChevronRight width={12} height={12} />\n\t\t\t\t\t\t\t\t)}\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.hovered};\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// Right-aligned brand action text (e.g. \"Connect\") in place of the chevron.\nconst RightActionText = styled.span`\n\tflex-shrink: 0;\n\tcolor: ${COLORS.content.brand};\n\tfont-family: Inter;\n\tfont-size: 14px;\n\tfont-weight: 600;\n\twhite-space: nowrap;\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","integrationStatus","onConnectIntegration","category","setCategory","useState","source","setSource","activeIndex","setActiveIndex","search","setSearch","tools","useMemo","i","subAgents","sources","acc","t","s","actionBySource","a","availableCategories","CATEGORIES","c","soleCategory","activeCategory","header","toolSourceLabel","sourceIcon","rows","sq","leaves","actionOnly","b","toolSourceRank","action","instances","icon","only","q","isConfigTool","CONFIG_TOOL_SOURCES","useEffect","navRef","useRef","event","h","p","variant","showSearch","jsxs","PickerCard","PickerBack","COLORS","jsx","SvgArrowLeft","renderSourceIcon","TitleSmall","PickerSearchRow","SearchIcon","PickerSearchInput","PickerEmpty","row","PickerRow","CreateRowText","Fragment","PickerRowMain","BodySecondary","RightActionText","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 { Shield } from '@src/icons';\nimport SvgArrowLeft from '@src/icons/Arrows/Normal arrows/ArrowLeft';\nimport React, { useEffect, useMemo, useRef, useState } from 'react';\nimport styled from 'styled-components';\nimport {\n\tBodyCaption,\n\tBodySecondary,\n\tTitleSmall,\n} from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport {\n\tCATEGORIES,\n\tCONFIG_TOOL_SOURCES,\n\ttoolSourceRank,\n} from '../constants/tools';\nimport type { Category, ToolAction, ToolSource } 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\t/**\n\t * Brand-coloured right-aligned action text (e.g. \"Connect\") shown in place of\n\t * the drill-in chevron — used for an unconnected integration source.\n\t */\n\trightLabel?: string;\n\t/** Tool leaf touches customer-private data → shows a shield glyph. */\n\tauthRequired?: 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\t/**\n\t * Per-source integration connection state. A source whose value is `false`\n\t * renders a \"Connect\" row (like an unconnected action) instead of drilling in —\n\t * so native source groups (Shopify / BigCommerce / ShipStation) show \"Connect\"\n\t * consistently with the config actions (Slack).\n\t */\n\tintegrationStatus?: Partial<Record<ToolSource, boolean>>;\n\t/** Open the connect flow for an unconnected source (used by the Connect row). */\n\tonConnectIntegration?: (source: ToolSource) => void;\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\tintegrationStatus,\n\tonConnectIntegration,\n}) => {\n\tconst [category, setCategory] = useState<Category | null>(null);\n\tconst [source, setSource] = useState<string | null>(initialSource ?? null);\n\t// -1 = nothing highlighted; rows highlight only on hover / arrow keys\n\t// (a default highlight reads as a stuck hover state).\n\tconst [activeIndex, setActiveIndex] = useState(-1);\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\t// The built-in \"create\" action per source (Rest API / email / Slack). A source\n\t// with an action drills into [its instances + a \"Create new\" row] — like the\n\t// Sub-agent category — instead of showing a duplicate flat \"create\" row.\n\tconst actionBySource = useMemo(\n\t\t() =>\n\t\t\tnew Map<string, ToolAction>(\n\t\t\t\t(toolActions ?? []).map((a) => [a.source, a]),\n\t\t\t),\n\t\t[toolActions],\n\t);\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. When `onBack` is set the header leads with a back arrow, followed by\n\t// the source icon in a source detail view: `[← back][icon][title]`.\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 arrow 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\t// Deep-linked to a source (opened from a right-panel source button):\n\t\t\t\t// that source IS the root, so no back arrow. In the @-drill flow\n\t\t\t\t// (no initialSource) back returns to the source chooser.\n\t\t\t\tonBack: initialSource ? undefined : () => setSource(null),\n\t\t\t\ticon: sourceIcon(source),\n\t\t }\n\t\t: // Always titled — matches the Sub-agent header; back arrow only when the\n\t\t // category chooser is above (i.e. not the sole category).\n\t\t {\n\t\t\t\ttitle: 'Tools',\n\t\t\t\tonBack: soleCategory ? undefined : () => setCategory(null),\n\t\t };\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\t// One drill-in row per source: the real sources (from instances) plus any\n\t\t\t// action source (Rest API / email / Slack) with no instances yet, so it\n\t\t\t// still appears for first-time creation. Deduped — no more twin rows.\n\t\t\tconst actionOnly = (toolActions ?? [])\n\t\t\t\t.map((a) => a.source)\n\t\t\t\t.filter((s) => !sources.includes(s));\n\t\t\t// Fixed source order (manifest → shopify → rest_api → email → slack →\n\t\t\t// rest) so adding/updating a tool never reshuffles the picker rows.\n\t\t\treturn [...sources, ...actionOnly]\n\t\t\t\t.sort((a, b) => toolSourceRank(a) - toolSourceRank(b))\n\t\t\t\t.map((s) => {\n\t\t\t\t\tconst action = actionBySource.get(s);\n\t\t\t\t\t// Not connected → a \"Connect\" row (no drill-in / no instances / no\n\t\t\t\t\t// \"Create new\"); clicking dismisses the picker and runs the connect\n\t\t\t\t\t// flow. Applies to config actions (their own `connected`) AND native\n\t\t\t\t\t// source groups (via `integrationStatus`), so both look consistent.\n\t\t\t\t\tconst connected =\n\t\t\t\t\t\taction !== undefined\n\t\t\t\t\t\t\t? action.connected\n\t\t\t\t\t\t\t: integrationStatus?.[s as ToolSource];\n\t\t\t\t\tif (connected === false) {\n\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\tid: s,\n\t\t\t\t\t\t\tlabel: toolSourceLabel(s),\n\t\t\t\t\t\t\tdrillsIn: false,\n\t\t\t\t\t\t\ticon: sourceIcon(s) ?? action?.icon,\n\t\t\t\t\t\t\trightLabel: 'Connect',\n\t\t\t\t\t\t\tonActivate: () => {\n\t\t\t\t\t\t\t\tonClose?.();\n\t\t\t\t\t\t\t\tif (action?.onConnect) {\n\t\t\t\t\t\t\t\t\taction.onConnect();\n\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\tonConnectIntegration?.(s as ToolSource);\n\t\t\t\t\t\t\t\t}\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\t// A source whose drill-in view would hold exactly one leaf is\n\t\t\t\t\t// pointless to drill into — surface that single leaf right here at\n\t\t\t\t\t// the source level (its function name + the same source icon).\n\t\t\t\t\t// Covers \"no Rest API added yet\" (→ open the create modal directly)\n\t\t\t\t\t// and a config tool's single capability (Slack → \"Send Slack\n\t\t\t\t\t// message\", email → \"Send Email\").\n\t\t\t\t\tconst instances = tools.filter(\n\t\t\t\t\t\t(t) => (metaOf(t)?.source ?? 'other') === s,\n\t\t\t\t\t);\n\t\t\t\t\tif (instances.length + (action ? 1 : 0) === 1) {\n\t\t\t\t\t\tconst icon = sourceIcon(s) ?? action?.icon;\n\t\t\t\t\t\tif (action) {\n\t\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t\tid: s,\n\t\t\t\t\t\t\t\tlabel: action.label,\n\t\t\t\t\t\t\t\tdrillsIn: false,\n\t\t\t\t\t\t\t\ticon,\n\t\t\t\t\t\t\t\tonActivate: () => {\n\t\t\t\t\t\t\t\t\tonClose?.();\n\t\t\t\t\t\t\t\t\taction.onSelect();\n\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t};\n\t\t\t\t\t\t}\n\t\t\t\t\t\tconst only = instances[0];\n\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\tid: String(only.id),\n\t\t\t\t\t\t\tlabel: rowLabel(only),\n\t\t\t\t\t\t\tdrillsIn: false,\n\t\t\t\t\t\t\ticon,\n\t\t\t\t\t\t\tauthRequired: metaOf(only)?.authRequired,\n\t\t\t\t\t\t\tonActivate: () => onSelect(only),\n\t\t\t\t\t\t};\n\t\t\t\t\t}\n\t\t\t\t\treturn {\n\t\t\t\t\t\tid: s,\n\t\t\t\t\t\tlabel: toolSourceLabel(s),\n\t\t\t\t\t\tdrillsIn: true,\n\t\t\t\t\t\ticon: sourceIcon(s) ?? action?.icon,\n\t\t\t\t\t\tonActivate: () => setSource(s),\n\t\t\t\t\t};\n\t\t\t\t});\n\t\t}\n\t\tconst q = search.trim().toLowerCase();\n\t\tconst leaves: PickerRowModel[] = 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\tauthRequired: metaOf(item)?.authRequired,\n\t\t\t\tonActivate: () => onSelect(item),\n\t\t\t}));\n\t\t// A configurable source's add row, below any existing instances, opening\n\t\t// its drawer. Config tools (Slack / email) are a single fixed capability →\n\t\t// render like a normal tool leaf (label only, no icon — matching the tool\n\t\t// rows). Rest API instances are user-created, so its \"add\" stays a\n\t\t// brand-coloured create row.\n\t\tconst action = actionBySource.get(source);\n\t\tif (action) {\n\t\t\tconst isConfigTool = source in CONFIG_TOOL_SOURCES;\n\t\t\tleaves.push({\n\t\t\t\tid: `create:${source}`,\n\t\t\t\tlabel: action.label,\n\t\t\t\tdrillsIn: false,\n\t\t\t\tisCreate: !isConfigTool,\n\t\t\t\tonActivate: () => {\n\t\t\t\t\tonClose?.();\n\t\t\t\t\taction.onSelect();\n\t\t\t\t},\n\t\t\t});\n\t\t}\n\t\treturn leaves;\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\tactionBySource,\n\t\tintegrationStatus,\n\t\tonConnectIntegration,\n\t]);\n\n\t// Reset highlight whenever the view (or filtered result set) changes.\n\tuseEffect(() => setActiveIndex(-1), [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\t// Nothing highlighted yet → treat the first row as the target so\n\t\t\t\t\t// the editor's @-flow (type, then Enter) still works.\n\t\t\t\t\t(r[i] ?? r[0])?.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.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)}\n\t\t\t\t\t{header.icon && renderSourceIcon(header.icon)}\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\t(rows[activeIndex] ?? rows[0])?.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' ? null : '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\tonMouseLeave={() => setActiveIndex(-1)}\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\t{row.authRequired && (\n\t\t\t\t\t\t\t\t\t\t<Shield\n\t\t\t\t\t\t\t\t\t\t\tsize={14}\n\t\t\t\t\t\t\t\t\t\t\taria-label=\"Requires customer verification\"\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\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{row.rightLabel ? (\n\t\t\t\t\t\t\t\t\t<RightActionText>{row.rightLabel}</RightActionText>\n\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\trow.drillsIn && <ChevronRight width={12} height={12} />\n\t\t\t\t\t\t\t\t)}\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\t{rows.some((row) => row.authRequired) && (\n\t\t\t\t<PickerLegend>\n\t\t\t\t\t<Shield size={14} />\n\t\t\t\t\t<BodyCaption color={COLORS.content.secondary}>\n\t\t\t\t\t\tRequires customer verification\n\t\t\t\t\t</BodyCaption>\n\t\t\t\t</PickerLegend>\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.hovered};\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// Footer legend, shown when the list holds any auth-required tool.\nconst PickerLegend = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 6px;\n\tpadding: 8px 12px;\n\tborder-top: 1px solid ${COLORS.stroke.primary};\n`;\n\n// Right-aligned brand action text (e.g. \"Connect\") in place of the chevron.\nconst RightActionText = styled.span`\n\tflex-shrink: 0;\n\tcolor: ${COLORS.content.brand};\n\tfont-family: Inter;\n\tfont-size: 14px;\n\tfont-weight: 600;\n\twhite-space: nowrap;\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","integrationStatus","onConnectIntegration","category","setCategory","useState","source","setSource","activeIndex","setActiveIndex","search","setSearch","tools","useMemo","i","subAgents","sources","acc","t","s","actionBySource","a","availableCategories","CATEGORIES","c","soleCategory","activeCategory","header","toolSourceLabel","sourceIcon","rows","sq","leaves","actionOnly","b","toolSourceRank","action","instances","icon","only","q","isConfigTool","CONFIG_TOOL_SOURCES","useEffect","navRef","useRef","event","h","p","variant","showSearch","jsxs","PickerCard","PickerBack","COLORS","jsx","SvgArrowLeft","renderSourceIcon","TitleSmall","PickerSearchRow","SearchIcon","PickerSearchInput","PickerEmpty","row","PickerRow","CreateRowText","Fragment","PickerRowMain","BodySecondary","Shield","RightActionText","ChevronRight","PickerLegend","BodyCaption","styled"],"mappings":"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"}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
interface RequireVerificationModalProps {
|
|
3
|
+
open: boolean;
|
|
4
|
+
/** Name of the tool being added (shown in the copy). */
|
|
5
|
+
toolLabel: string;
|
|
6
|
+
/** Dismiss without adding the tool (X / outside click / Cancel). */
|
|
7
|
+
onCancel: () => void;
|
|
8
|
+
/** Turn on customer verification and add the tool. */
|
|
9
|
+
onConfirm: () => void;
|
|
10
|
+
}
|
|
11
|
+
/**
|
|
12
|
+
* Shown when the merchant attaches a tool that touches customer-private data
|
|
13
|
+
* (`auth_required`) while customer verification is off. Verification is mandatory
|
|
14
|
+
* for such tools — confirming ("Add tool") turns it on and adds the tool;
|
|
15
|
+
* cancelling skips the add. Centred layout per Figma (node 1165-21717).
|
|
16
|
+
*/
|
|
17
|
+
export declare const RequireVerificationModal: React.FC<RequireVerificationModalProps>;
|
|
18
|
+
export {};
|