@bikdotai/bik-component-library 0.0.822-beta.1 → 0.0.822

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 (5) hide show
  1. package/dist/cjs/components/agent-builder/components/MentionPicker.js +19 -19
  2. package/dist/cjs/components/agent-builder/components/MentionPicker.js.map +1 -1
  3. package/dist/esm/components/agent-builder/components/MentionPicker.js +101 -91
  4. package/dist/esm/components/agent-builder/components/MentionPicker.js.map +1 -1
  5. package/package.json +1 -1
package/dist/cjs/components/agent-builder/components/MentionPicker.js CHANGED
@@ -1,20 +1,20 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),D=require("../../../assets/icons/chevronRight.svg.js"),N=require("../../../assets/icons/searchIcon.svg.js"),z=require("../../../icons/Arrows/Normal arrows/ArrowLeft.js"),l=require("react"),U=require("styled-components"),_=require("../../TypographyStyle.js"),o=require("../../../constants/Theme.js"),q=require("../utils/mentionSerialization.js"),S=require("../utils/sourceIcons.js"),F=n=>n&&typeof n=="object"&&"default"in n?n:{default:n},u=F(U),G=[{key:"tool",label:"Tools"},{key:"subagent",label:"Sub-agent"}],g=n=>n.meta,I=n=>g(n)?.plainLabel??n.label,J="__bik_create_subagent__",Q=({items:n,onSelect:O,registerKeyHandler:x,onClose:L,onCreateSubAgent:h,initialSource:M})=>{const[P,v]=l.useState(null),[s,C]=l.useState(M??null),[b,p]=l.useState(0),[k,j]=l.useState(""),f=l.useMemo(()=>n.filter(t=>g(t)?.kind==="tool"),[n]),y=l.useMemo(()=>n.filter(t=>g(t)?.kind==="subagent"),[n]),A=l.useMemo(()=>{const t=[];return f.forEach(e=>{const c=g(e)?.source??"other";t.includes(c)||t.push(c)}),t},[f]),m=l.useMemo(()=>G.filter(t=>t.key==="tool"?f.length>0:y.length>0||!!h),[f.length,y.length,h]),w=m.length===1?m[0].key:null,i=P??w,d=i?i==="subagent"?w?null:{title:"Sub-agent",onBack:()=>v(null)}:s?{title:q.toolSourceLabel(s),onBack:()=>C(null),icon:S.SOURCE_ICONS[s]}:w?null:{title:"Tools",onBack:()=>v(null)}:null,a=l.useMemo(()=>{if(!i)return m.map(e=>({id:e.key,label:e.label,drillsIn:!0,onActivate:()=>{v(e.key),C(null)}}));if(i==="subagent"){const e=y.map(c=>({id:String(c.id),label:I(c),drillsIn:!1,onActivate:()=>O(c)}));return h&&e.push({id:J,label:"Create new",drillsIn:!1,isCreate:!0,onActivate:()=>{L?.(),h()}}),e}if(!s)return A.map(e=>({id:e,label:q.toolSourceLabel(e),drillsIn:!0,icon:S.SOURCE_ICONS[e],onActivate:()=>C(e)}));const t=k.trim().toLowerCase();return f.filter(e=>(g(e)?.source??"other")===s).filter(e=>!t||I(e).toLowerCase().includes(t)).map(e=>({id:String(e.id),label:I(e),drillsIn:!1,onActivate:()=>O(e)}))},[i,m,s,k,f,y,A,O,L,h]);l.useEffect(()=>p(0),[i,s,k,n]),l.useEffect(()=>j(""),[i,s]);const E=l.useRef({rows:a,activeIndex:b,header:d});E.current={rows:a,activeIndex:b,header:d},l.useEffect(()=>{if(x)return x(t=>{const{rows:e,activeIndex:c,header:$}=E.current;switch(t.key){case"ArrowDown":return e.length&&p(R=>(R+1)%e.length),!0;case"ArrowUp":return e.length&&p(R=>(R+e.length-1)%e.length),!0;case"ArrowRight":case"Enter":return e[c]?.onActivate(),!0;case"ArrowLeft":return $?($.onBack(),!0):!1;default:return!1}}),()=>x(null)},[x]);const T=i?a.length&&!a[0].drillsIn?"items":"sources":"categories",B=i==="tool"&&!!s;return r.jsxs(V,{className:`bik-mention-picker bik-mention-picker--${T}`,children:[d&&r.jsxs(H,{type:"button",onClick:d.onBack,style:{background:o.COLORS.surface.subdued},children:[d.icon?S.renderSourceIcon(d.icon):r.jsx(z.default,{width:20,height:20,color:o.COLORS.content.primary}),r.jsxs(_.TitleSmall,{children:[" ",d.title]})]}),B&&r.jsxs(W,{children:[r.jsx(N.default,{width:20,height:20,color:o.COLORS.content.placeholder}),r.jsx(X,{autoFocus:!0,value:k,placeholder:"Search","data-test":"mention-picker-search",onChange:t=>j(t.target.value),onKeyDown:t=>{a.length&&(t.key==="ArrowDown"?(t.preventDefault(),p(e=>(e+1)%a.length)):t.key==="ArrowUp"?(t.preventDefault(),p(e=>(e+a.length-1)%a.length)):t.key==="Enter"&&(t.preventDefault(),a[b]?.onActivate()))}})]}),a.length===0?r.jsx(ee,{children:i==="subagent"?"No sub-agents available":"No tools available"}):a.map((t,e)=>r.jsx(Y,{type:"button",$active:e===b,onMouseEnter:()=>p(e),onClick:t.onActivate,children:t.isCreate?r.jsx(K,{children:t.label}):r.jsxs(r.Fragment,{children:[r.jsxs(Z,{children:[S.renderSourceIcon(t.icon),r.jsx(_.BodySecondary,{color:o.COLORS.content.primary,children:t.label})]}),t.drillsIn&&r.jsx(D.default,{width:12,height:12})]})},t.id))]})},V=u.default.div`
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),D=require("../../../assets/icons/chevronRight.svg.js"),N=require("../../../assets/icons/searchIcon.svg.js"),z=require("../../../icons/Arrows/Normal arrows/ArrowLeft.js"),a=require("react"),U=require("styled-components"),_=require("../../TypographyStyle.js"),r=require("../../../constants/Theme.js"),q=require("../utils/mentionSerialization.js"),O=require("../utils/sourceIcons.js"),F=n=>n&&typeof n=="object"&&"default"in n?n:{default:n},d=F(U),G=[{key:"tool",label:"Tools"},{key:"subagent",label:"Sub-agent"}],x=n=>n.meta,v=n=>x(n)?.plainLabel??n.label,J="__bik_create_subagent__",Q=({items:n,onSelect:C,registerKeyHandler:k,onClose:j,onCreateSubAgent:g,initialSource:B})=>{const[M,w]=a.useState(null),[c,R]=a.useState(B??null),[y,p]=a.useState(0),[b,A]=a.useState(""),h=a.useMemo(()=>n.filter(t=>x(t)?.kind==="tool"),[n]),m=a.useMemo(()=>n.filter(t=>x(t)?.kind==="subagent"),[n]),E=a.useMemo(()=>{const t=[];return h.forEach(e=>{const f=x(e)?.source??"other";t.includes(f)||t.push(f)}),t},[h]),S=a.useMemo(()=>G.filter(t=>t.key==="tool"?h.length>0:m.length>0||!!g),[h.length,m.length,g]),L=S.length===1?S[0].key:null,l=M??L,s=l?l==="subagent"?{title:"Sub-agent",onBack:L?void 0:()=>w(null)}:c?{title:q.toolSourceLabel(c),onBack:()=>R(null),icon:O.SOURCE_ICONS[c]}:L?null:{title:"Tools",onBack:()=>w(null)}:null,i=a.useMemo(()=>{if(!l)return S.map(e=>({id:e.key,label:e.label,drillsIn:!0,onActivate:()=>{w(e.key),R(null)}}));if(l==="subagent"){const e=b.trim().toLowerCase(),f=m.filter(u=>!e||v(u).toLowerCase().includes(e)).map(u=>({id:String(u.id),label:v(u),drillsIn:!1,onActivate:()=>C(u)}));return g&&f.push({id:J,label:"Create new",drillsIn:!1,isCreate:!0,onActivate:()=>{j?.(),g()}}),f}if(!c)return E.map(e=>({id:e,label:q.toolSourceLabel(e),drillsIn:!0,icon:O.SOURCE_ICONS[e],onActivate:()=>R(e)}));const t=b.trim().toLowerCase();return h.filter(e=>(x(e)?.source??"other")===c).filter(e=>!t||v(e).toLowerCase().includes(t)).map(e=>({id:String(e.id),label:v(e),drillsIn:!1,onActivate:()=>C(e)}))},[l,S,c,b,h,m,E,C,j,g]);a.useEffect(()=>p(0),[l,c,b,n]),a.useEffect(()=>A(""),[l,c]);const $=a.useRef({rows:i,activeIndex:y,header:s});$.current={rows:i,activeIndex:y,header:s},a.useEffect(()=>{if(k)return k(t=>{const{rows:e,activeIndex:f,header:u}=$.current;switch(t.key){case"ArrowDown":return e.length&&p(I=>(I+1)%e.length),!0;case"ArrowUp":return e.length&&p(I=>(I+e.length-1)%e.length),!0;case"ArrowRight":case"Enter":return e[f]?.onActivate(),!0;case"ArrowLeft":return u?.onBack?(u.onBack(),!0):!1;default:return!1}}),()=>k(null)},[k]);const P=l?i.length&&!i[0].drillsIn?"items":"sources":"categories",T=l==="tool"&&!!c||l==="subagent";return o.jsxs(V,{className:`bik-mention-picker bik-mention-picker--${P}`,children:[s&&o.jsxs(H,{type:"button",onClick:s.onBack,disabled:!s.onBack,style:{background:r.COLORS.surface.subdued,cursor:s.onBack?"pointer":"default"},children:[s.icon?O.renderSourceIcon(s.icon):s.onBack?o.jsx(z.default,{width:20,height:20,color:r.COLORS.content.primary}):null,o.jsxs(_.TitleSmall,{children:[" ",s.title]})]}),T&&o.jsxs(W,{children:[o.jsx(N.default,{width:20,height:20,color:r.COLORS.content.placeholder}),o.jsx(X,{autoFocus:!0,value:b,placeholder:"Search","data-test":"mention-picker-search",onChange:t=>A(t.target.value),onKeyDown:t=>{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()))}})]}),i.length===0?o.jsx(ee,{children:l==="subagent"?"No sub-agents available":"No tools available"}):i.map((t,e)=>o.jsx(Y,{type:"button",$active:e===y,onMouseEnter:()=>p(e),onClick:t.onActivate,children:t.isCreate?o.jsx(K,{children:t.label}):o.jsxs(o.Fragment,{children:[o.jsxs(Z,{children:[O.renderSourceIcon(t.icon),o.jsx(_.BodySecondary,{color:r.COLORS.content.primary,children:t.label})]}),t.drillsIn&&o.jsx(D.default,{width:12,height:12})]})},t.id))]})},V=d.default.div`
2
2
  display: flex;
3
3
  flex-direction: column;
4
4
  min-width: 240px;
5
5
  max-height: 280px;
6
6
  overflow-y: auto;
7
- background: ${o.COLORS.surface.standard};
8
- border: 1px solid ${o.COLORS.stroke.primary};
7
+ background: ${r.COLORS.surface.standard};
8
+ border: 1px solid ${r.COLORS.stroke.primary};
9
9
  border-radius: 4px;
10
10
  box-shadow: 0px -2px 8px 0px #0000001f;
11
- `,W=u.default.div`
11
+ `,W=d.default.div`
12
12
  display: flex;
13
13
  align-items: center;
14
14
  gap: 8px;
15
15
  padding: 10px 12px;
16
- border-bottom: 1px solid ${o.COLORS.stroke.primary};
17
- `,X=u.default.input`
16
+ border-bottom: 1px solid ${r.COLORS.stroke.primary};
17
+ `,X=d.default.input`
18
18
  flex: 1;
19
19
  min-width: 0;
20
20
  border: none;
@@ -22,12 +22,12 @@
22
22
  background: transparent;
23
23
  font-family: Inter;
24
24
  font-size: 14px;
25
- color: ${o.COLORS.content.primary};
25
+ color: ${r.COLORS.content.primary};
26
26
 
27
27
  &::placeholder {
28
- color: ${o.COLORS.content.placeholder};
28
+ color: ${r.COLORS.content.placeholder};
29
29
  }
30
- `,Y=u.default.button`
30
+ `,Y=d.default.button`
31
31
  display: flex;
32
32
  justify-content: space-between;
33
33
  align-items: center;
@@ -36,32 +36,32 @@
36
36
  padding: 8px 10px;
37
37
  height: 48px;
38
38
  border: none;
39
- border-bottom: 1px solid ${o.COLORS.stroke.primary};
40
- background: ${n=>n.$active?o.COLORS.surface.subdued:"transparent"};
39
+ border-bottom: 1px solid ${r.COLORS.stroke.primary};
40
+ background: ${n=>n.$active?r.COLORS.surface.subdued:"transparent"};
41
41
  cursor: pointer;
42
42
  text-align: left;
43
43
 
44
44
  &:hover {
45
- background: ${o.COLORS.surface.subdued};
45
+ background: ${r.COLORS.surface.subdued};
46
46
  }
47
- `,Z=u.default.div`
47
+ `,Z=d.default.div`
48
48
  display: flex;
49
49
  align-items: center;
50
50
  gap: 12px;
51
51
  min-width: 0;
52
- `,K=u.default.div`
52
+ `,K=d.default.div`
53
53
  width: 100%;
54
54
  text-align: center;
55
- color: ${o.COLORS.content.brand};
55
+ color: ${r.COLORS.content.brand};
56
56
  font-family: Inter;
57
57
  font-size: 14px;
58
58
  font-weight: 600;
59
- `,H=u.default.button`
59
+ `,H=d.default.button`
60
60
  display: flex;
61
61
  align-items: center;
62
62
  padding: 12px 16px;
63
63
  border: none;
64
- border-bottom: 1px solid ${o.COLORS.stroke.primary};
64
+ border-bottom: 1px solid ${r.COLORS.stroke.primary};
65
65
  background: transparent;
66
66
  cursor: pointer;
67
67
  font-family: Inter;
@@ -69,10 +69,10 @@
69
69
  font-weight: 600;
70
70
  height: 48px;
71
71
  gap: 4px;
72
- `,ee=u.default.div`
72
+ `,ee=d.default.div`
73
73
  padding: 12px 10px;
74
74
  font-family: Inter;
75
75
  font-size: 13px;
76
- color: ${o.COLORS.content.secondary};
76
+ color: ${r.COLORS.content.secondary};
77
77
  `;exports.MentionPicker=Q;
78
78
  //# sourceMappingURL=MentionPicker.js.map
package/dist/cjs/components/agent-builder/components/MentionPicker.js.map CHANGED
@@ -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, and whether we can go back a level.\n\t// With a sole category there is no root to go back to (no category header).\n\t// In a source detail view the leading glyph is the source icon (per design),\n\t// 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? soleCategory\n\t\t\t? null\n\t\t\t: { title: 'Sub-agent', onBack: () => setCategory(null) }\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 leaves: PickerRowModel[] = subAgents.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\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) {\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).\n\tconst showSearch = activeCategory === 'tool' && !!source;\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\tstyle={{ background: COLORS.surface.subdued }}\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) : (\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<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: 280px;\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","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 {\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: 280px;\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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"}
package/dist/esm/components/agent-builder/components/MentionPicker.js CHANGED
@@ -1,9 +1,9 @@
1
- import { jsxs as h, jsx as c, Fragment as F } from "react/jsx-runtime";
2
- import G from "../../../assets/icons/chevronRight.svg.js";
3
- import q from "../../../assets/icons/searchIcon.svg.js";
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
4
  import J from "../../../icons/Arrows/Normal arrows/ArrowLeft.js";
5
- import { useState as w, useMemo as g, useEffect as E, useRef as Q } from "react";
6
- import s from "styled-components";
5
+ import { useState as I, useMemo as m, useEffect as R, useRef as Q } from "react";
6
+ import d from "styled-components";
7
7
  import { TitleSmall as V, BodySecondary as W } from "../../TypographyStyle.js";
8
8
  import { COLORS as n } from "../../../constants/Theme.js";
9
9
  import { toolSourceLabel as T } from "../utils/mentionSerialization.js";
@@ -11,176 +11,186 @@ import { SOURCE_ICONS as O, renderSourceIcon as N } from "../utils/sourceIcons.j
11
11
  const X = [
12
12
  { key: "tool", label: "Tools" },
13
13
  { key: "subagent", label: "Sub-agent" }
14
- ], b = (r) => r.meta, R = (r) => b(r)?.plainLabel ?? r.label, Y = "__bik_create_subagent__", ge = ({
14
+ ], k = (r) => r.meta, S = (r) => k(r)?.plainLabel ?? r.label, Y = "__bik_create_subagent__", ge = ({
15
15
  items: r,
16
- onSelect: I,
17
- registerKeyHandler: m,
18
- onClose: _,
19
- onCreateSubAgent: f,
16
+ onSelect: C,
17
+ registerKeyHandler: x,
18
+ onClose: L,
19
+ onCreateSubAgent: g,
20
20
  initialSource: z
21
21
  }) => {
22
- const [M, S] = w(null), [l, A] = w(z ?? null), [x, u] = w(0), [k, B] = w(""), p = g(
23
- () => r.filter((t) => b(t)?.kind === "tool"),
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
24
  [r]
25
- ), y = g(
26
- () => r.filter((t) => b(t)?.kind === "subagent"),
25
+ ), v = m(
26
+ () => r.filter((t) => k(t)?.kind === "subagent"),
27
27
  [r]
28
- ), L = g(() => {
28
+ ), P = m(() => {
29
29
  const t = [];
30
- return p.forEach((e) => {
31
- const a = b(e)?.source ?? "other";
32
- t.includes(a) || t.push(a);
30
+ return f.forEach((e) => {
31
+ const u = k(e)?.source ?? "other";
32
+ t.includes(u) || t.push(u);
33
33
  }), t;
34
- }, [p]), v = g(
34
+ }, [f]), w = m(
35
35
  () => X.filter(
36
- (t) => t.key === "tool" ? p.length > 0 : y.length > 0 || !!f
36
+ (t) => t.key === "tool" ? f.length > 0 : v.length > 0 || !!g
37
37
  ),
38
- [p.length, y.length, f]
39
- ), C = v.length === 1 ? v[0].key : null, i = M ?? C, d = i ? i === "subagent" ? C ? null : { title: "Sub-agent", onBack: () => S(null) } : l ? {
40
- title: T(l),
41
- onBack: () => A(null),
42
- icon: O[l]
43
- } : C ? null : { title: "Tools", onBack: () => S(null) } : null, o = g(() => {
44
- if (!i)
45
- return v.map((e) => ({
38
+ [f.length, v.length, g]
39
+ ), B = w.length === 1 ? w[0].key : null, o = M ?? B, l = o ? o === "subagent" ? (
40
+ // Always titled — with a back chevron only when the category chooser is above.
41
+ {
42
+ title: "Sub-agent",
43
+ onBack: B ? void 0 : () => A(null)
44
+ }
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) => ({
46
52
  id: e.key,
47
53
  label: e.label,
48
54
  drillsIn: !0,
49
55
  onActivate: () => {
50
- S(e.key), A(null);
56
+ A(e.key), $(null);
51
57
  }
52
58
  }));
53
- if (i === "subagent") {
54
- const e = y.map((a) => ({
55
- id: String(a.id),
56
- label: R(a),
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),
57
63
  drillsIn: !1,
58
- onActivate: () => I(a)
64
+ onActivate: () => C(c)
59
65
  }));
60
- return f && e.push({
66
+ return g && u.push({
61
67
  id: Y,
62
68
  label: "Create new",
63
69
  drillsIn: !1,
64
70
  isCreate: !0,
65
71
  onActivate: () => {
66
- _?.(), f();
72
+ L?.(), g();
67
73
  }
68
- }), e;
74
+ }), u;
69
75
  }
70
- if (!l)
71
- return L.map((e) => ({
76
+ if (!a)
77
+ return P.map((e) => ({
72
78
  id: e,
73
79
  label: T(e),
74
80
  drillsIn: !0,
75
81
  icon: O[e],
76
- onActivate: () => A(e)
82
+ onActivate: () => $(e)
77
83
  }));
78
- const t = k.trim().toLowerCase();
79
- return p.filter((e) => (b(e)?.source ?? "other") === l).filter((e) => !t || R(e).toLowerCase().includes(t)).map((e) => ({
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) => ({
80
86
  id: String(e.id),
81
- label: R(e),
87
+ label: S(e),
82
88
  drillsIn: !1,
83
- onActivate: () => I(e)
89
+ onActivate: () => C(e)
84
90
  }));
85
91
  }, [
86
- i,
92
+ o,
93
+ w,
94
+ a,
95
+ b,
96
+ f,
87
97
  v,
88
- l,
89
- k,
90
- p,
91
- y,
98
+ P,
99
+ C,
92
100
  L,
93
- I,
94
- _,
95
- f
101
+ g
96
102
  ]);
97
- E(() => u(0), [i, l, k, r]), E(() => B(""), [i, l]);
98
- const P = Q({ rows: o, activeIndex: x, header: d });
99
- P.current = { rows: o, activeIndex: x, header: d }, E(() => {
100
- if (m)
101
- return m((t) => {
102
- const { rows: e, activeIndex: a, header: D } = P.current;
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;
103
109
  switch (t.key) {
104
110
  case "ArrowDown":
105
- return e.length && u(($) => ($ + 1) % e.length), !0;
111
+ return e.length && p((E) => (E + 1) % e.length), !0;
106
112
  case "ArrowUp":
107
- return e.length && u(($) => ($ + e.length - 1) % e.length), !0;
113
+ return e.length && p((E) => (E + e.length - 1) % e.length), !0;
108
114
  case "ArrowRight":
109
115
  case "Enter":
110
- return e[a]?.onActivate(), !0;
116
+ return e[u]?.onActivate(), !0;
111
117
  case "ArrowLeft":
112
- return D ? (D.onBack(), !0) : !1;
118
+ return c?.onBack ? (c.onBack(), !0) : !1;
113
119
  default:
114
120
  return !1;
115
121
  }
116
- }), () => m(null);
117
- }, [m]);
118
- const U = i ? o.length && !o[0].drillsIn ? "items" : "sources" : "categories", j = i === "tool" && !!l;
122
+ }), () => x(null);
123
+ }, [x]);
124
+ const U = o ? i.length && !i[0].drillsIn ? "items" : "sources" : "categories", j = o === "tool" && !!a || o === "subagent";
119
125
  return /* @__PURE__ */ h(Z, { className: `bik-mention-picker bik-mention-picker--${U}`, children: [
120
- d && /* @__PURE__ */ h(
126
+ l && /* @__PURE__ */ h(
121
127
  re,
122
128
  {
123
129
  type: "button",
124
- onClick: d.onBack,
125
- style: { background: n.surface.subdued },
130
+ onClick: l.onBack,
131
+ disabled: !l.onBack,
132
+ style: {
133
+ background: n.surface.subdued,
134
+ cursor: l.onBack ? "pointer" : "default"
135
+ },
126
136
  children: [
127
- d.icon ? N(d.icon) : /* @__PURE__ */ c(
137
+ l.icon ? N(l.icon) : l.onBack ? /* @__PURE__ */ s(
128
138
  J,
129
139
  {
130
140
  width: 20,
131
141
  height: 20,
132
142
  color: n.content.primary
133
143
  }
134
- ),
144
+ ) : null,
135
145
  /* @__PURE__ */ h(V, { children: [
136
146
  " ",
137
- d.title
147
+ l.title
138
148
  ] })
139
149
  ]
140
150
  }
141
151
  ),
142
152
  j && /* @__PURE__ */ h(K, { children: [
143
- /* @__PURE__ */ c(
144
- q,
153
+ /* @__PURE__ */ s(
154
+ G,
145
155
  {
146
156
  width: 20,
147
157
  height: 20,
148
158
  color: n.content.placeholder
149
159
  }
150
160
  ),
151
- /* @__PURE__ */ c(
161
+ /* @__PURE__ */ s(
152
162
  H,
153
163
  {
154
164
  autoFocus: !0,
155
- value: k,
165
+ value: b,
156
166
  placeholder: "Search",
157
167
  "data-test": "mention-picker-search",
158
- onChange: (t) => B(t.target.value),
168
+ onChange: (t) => _(t.target.value),
159
169
  onKeyDown: (t) => {
160
- o.length && (t.key === "ArrowDown" ? (t.preventDefault(), u((e) => (e + 1) % o.length)) : t.key === "ArrowUp" ? (t.preventDefault(), u((e) => (e + o.length - 1) % o.length)) : t.key === "Enter" && (t.preventDefault(), o[x]?.onActivate()));
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()));
161
171
  }
162
172
  }
163
173
  )
164
174
  ] }),
165
- o.length === 0 ? /* @__PURE__ */ c(oe, { children: i === "subagent" ? "No sub-agents available" : "No tools available" }) : o.map((t, e) => /* @__PURE__ */ c(
175
+ i.length === 0 ? /* @__PURE__ */ s(oe, { children: o === "subagent" ? "No sub-agents available" : "No tools available" }) : i.map((t, e) => /* @__PURE__ */ s(
166
176
  ee,
167
177
  {
168
178
  type: "button",
169
- $active: e === x,
170
- onMouseEnter: () => u(e),
179
+ $active: e === y,
180
+ onMouseEnter: () => p(e),
171
181
  onClick: t.onActivate,
172
- children: t.isCreate ? /* @__PURE__ */ c(ne, { children: t.label }) : /* @__PURE__ */ h(F, { children: [
182
+ children: t.isCreate ? /* @__PURE__ */ s(ne, { children: t.label }) : /* @__PURE__ */ h(q, { children: [
173
183
  /* @__PURE__ */ h(te, { children: [
174
184
  N(t.icon),
175
- /* @__PURE__ */ c(W, { color: n.content.primary, children: t.label })
185
+ /* @__PURE__ */ s(W, { color: n.content.primary, children: t.label })
176
186
  ] }),
177
- t.drillsIn && /* @__PURE__ */ c(G, { width: 12, height: 12 })
187
+ t.drillsIn && /* @__PURE__ */ s(F, { width: 12, height: 12 })
178
188
  ] })
179
189
  },
180
190
  t.id
181
191
  ))
182
192
  ] });
183
- }, Z = s.div`
193
+ }, Z = d.div`
184
194
  display: flex;
185
195
  flex-direction: column;
186
196
  min-width: 240px;
@@ -190,13 +200,13 @@ const X = [
190
200
  border: 1px solid ${n.stroke.primary};
191
201
  border-radius: 4px;
192
202
  box-shadow: 0px -2px 8px 0px #0000001f;
193
- `, K = s.div`
203
+ `, K = d.div`
194
204
  display: flex;
195
205
  align-items: center;
196
206
  gap: 8px;
197
207
  padding: 10px 12px;
198
208
  border-bottom: 1px solid ${n.stroke.primary};
199
- `, H = s.input`
209
+ `, H = d.input`
200
210
  flex: 1;
201
211
  min-width: 0;
202
212
  border: none;
@@ -209,7 +219,7 @@ const X = [
209
219
  &::placeholder {
210
220
  color: ${n.content.placeholder};
211
221
  }
212
- `, ee = s.button`
222
+ `, ee = d.button`
213
223
  display: flex;
214
224
  justify-content: space-between;
215
225
  align-items: center;
@@ -226,19 +236,19 @@ const X = [
226
236
  &:hover {
227
237
  background: ${n.surface.subdued};
228
238
  }
229
- `, te = s.div`
239
+ `, te = d.div`
230
240
  display: flex;
231
241
  align-items: center;
232
242
  gap: 12px;
233
243
  min-width: 0;
234
- `, ne = s.div`
244
+ `, ne = d.div`
235
245
  width: 100%;
236
246
  text-align: center;
237
247
  color: ${n.content.brand};
238
248
  font-family: Inter;
239
249
  font-size: 14px;
240
250
  font-weight: 600;
241
- `, re = s.button`
251
+ `, re = d.button`
242
252
  display: flex;
243
253
  align-items: center;
244
254
  padding: 12px 16px;
@@ -251,7 +261,7 @@ const X = [
251
261
  font-weight: 600;
252
262
  height: 48px;
253
263
  gap: 4px;
254
- `, oe = s.div`
264
+ `, oe = d.div`
255
265
  padding: 12px 10px;
256
266
  font-family: Inter;
257
267
  font-size: 13px;
package/dist/esm/components/agent-builder/components/MentionPicker.js.map CHANGED
@@ -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, and whether we can go back a level.\n\t// With a sole category there is no root to go back to (no category header).\n\t// In a source detail view the leading glyph is the source icon (per design),\n\t// 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? soleCategory\n\t\t\t? null\n\t\t\t: { title: 'Sub-agent', onBack: () => setCategory(null) }\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 leaves: PickerRowModel[] = subAgents.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\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) {\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).\n\tconst showSearch = activeCategory === 'tool' && !!source;\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\tstyle={{ background: COLORS.surface.subdued }}\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) : (\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<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: 280px;\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","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 {\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: 280px;\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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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bikdotai/bik-component-library",
3
- "version": "0.0.822-beta.1",
3
+ "version": "0.0.822",
4
4
  "description": "Bik Component Library",
5
5
  "repository": {
6
6
  "type": "git",