@bikdotai/bik-component-library 0.0.849-beta.4 → 0.0.849-beta.6

package/dist/cjs/components/agent-builder/components/MentionPicker.js

@@ -1,20 +1,44 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),Z=require("../../../assets/icons/chevronRight.svg.js"),K=require("../../../assets/icons/searchIcon.svg.js"),H=require("../../../icons/Arrows/Normal arrows/ArrowLeft.js"),s=require("react"),ee=require("styled-components"),D=require("../../TypographyStyle.js"),c=require("../../../constants/Theme.js"),te=require("../../variable-picker-v3/model.js"),E=require("../constants/tools.js"),z=require("../utils/mentionSerialization.js"),m=require("../utils/sourceIcons.js"),ne=require("../../variable-picker-v3/VariablePicker.js"),Q=require("../../../icons/Informational/Common UI/Shield.js"),re=a=>a&&typeof a=="object"&&"default"in a?a:{default:a},p=re(ee),g=a=>a.meta,R=a=>g(a)?.plainLabel??a.label,oe="__bik_create_subagent__",ie=({items:a,onSelect:S,registerKeyHandler:C,onClose:k,onCreateSubAgent:v,initialSource:N,toolActions:y,integrationStatus:U,onConnectIntegration:F,variablesData:A,onSelectVariable:M})=>{const[W,L]=s.useState(null),[d,P]=s.useState(N??null),[w,x]=s.useState(-1),[O,G]=s.useState(""),b=s.useMemo(()=>a.filter(e=>g(e)?.kind==="tool"),[a]),I=s.useMemo(()=>a.filter(e=>g(e)?.kind==="subagent"),[a]),T=s.useMemo(()=>{const e=[];return b.forEach(o=>{const h=g(o)?.source??"other";e.includes(h)||e.push(h)}),e},[b]),_=s.useMemo(()=>new Map((y??[]).map(e=>[e.source,e])),[y]),j=s.useMemo(()=>E.CATEGORIES.filter(e=>e.key==="tool"?b.length>0||(y?.length??0)>0:e.key==="variable"?(A?.length??0)>0&&!!M:I.length>0||!!v),[b.length,I.length,v,y?.length,A?.length,M]),q=j.length===1?j[0].key:null,l=W??q,f=l?l==="subagent"?{title:"Sub-agent",onBack:q?void 0:()=>L(null)}:l==="variable"?{title:"Variables",onBack:q?void 0:()=>L(null)}:d?{title:z.toolSourceLabel(d),onBack:N?void 0:()=>P(null),icon:m.sourceIcon(d)}:{title:"Tools",onBack:q?void 0:()=>L(null)}:null,u=s.useMemo(()=>{if(!l)return j.map(n=>({id:n.key,label:n.label,drillsIn:!0,onActivate:()=>{L(n.key),P(null)}}));if(l==="subagent"){const n=O.trim().toLowerCase(),t=I.filter(i=>!n||R(i).toLowerCase().includes(n)).map(i=>({id:String(i.id),label:R(i),drillsIn:!1,onActivate:()=>S(i)}));return v&&t.push({id:oe,label:"Create new",drillsIn:!1,isCreate:!0,onActivate:()=>{k?.(),v()}}),t}if(l==="variable")return[];if(!d){const n=(y??[]).map(t=>t.source).filter(t=>!T.includes(t));return[...T,...n].sort((t,i)=>E.toolSourceRank(t)-E.toolSourceRank(i)).map(t=>{const i=_.get(t);if((i!==void 0?i.connected:U?.[t])===!1)return{id:t,label:z.toolSourceLabel(t),drillsIn:!1,icon:m.sourceIcon(t)??i?.icon,rightLabel:"Connect",onActivate:()=>{k?.(),i?.onConnect?i.onConnect():F?.(t)}};const J=b.filter($=>(g($)?.source??"other")===t);if(J.length+(i?1:0)===1){const $=m.sourceIcon(t)??i?.icon;if(i)return{id:t,label:i.label,drillsIn:!1,icon:$,onActivate:()=>{k?.(),i.onSelect()}};const B=J[0];return{id:String(B.id),label:R(B),drillsIn:!1,icon:$,authRequired:g(B)?.authRequired,onActivate:()=>S(B)}}return{id:t,label:z.toolSourceLabel(t),drillsIn:!0,icon:m.sourceIcon(t)??i?.icon,onActivate:()=>P(t)}})}const e=O.trim().toLowerCase(),o=b.filter(n=>(g(n)?.source??"other")===d).filter(n=>!e||R(n).toLowerCase().includes(e)).map(n=>({id:String(n.id),label:R(n),drillsIn:!1,authRequired:g(n)?.authRequired,onActivate:()=>S(n)})),h=_.get(d);if(h){const n=d in E.CONFIG_TOOL_SOURCES;o.push({id:`create:${d}`,label:h.label,drillsIn:!1,isCreate:!n,onActivate:()=>{k?.(),h.onSelect()}})}return o},[l,j,d,O,b,I,T,S,k,v,y,_,U,F]);s.useEffect(()=>x(-1),[l,d,O,a]),s.useEffect(()=>G(""),[l,d]);const V=s.useRef({rows:u,activeIndex:w,header:f});V.current={rows:u,activeIndex:w,header:f},s.useEffect(()=>{if(C)return C(e=>{const{rows:o,activeIndex:h,header:n}=V.current;switch(e.key){case"ArrowDown":return o.length&&x(t=>(t+1)%o.length),!0;case"ArrowUp":return o.length&&x(t=>(t+o.length-1)%o.length),!0;case"ArrowRight":case"Enter":return(o[h]??o[0])?.onActivate(),!0;case"ArrowLeft":return n?.onBack?(n.onBack(),!0):!1;default:return!1}}),()=>C(null)},[C]);const X=l?u.length&&!u[0].drillsIn?"items":"sources":"categories",Y=l==="tool"&&!!d||l==="subagent";return r.jsxs(ae,{className:`bik-mention-picker bik-mention-picker--${X}`,children:[f&&r.jsxs(he,{type:"button",onClick:f.onBack,disabled:!f.onBack,style:{background:c.COLORS.surface.subdued,cursor:f.onBack?"pointer":"default"},children:[f.onBack&&r.jsx(H.default,{width:20,height:20,color:c.COLORS.content.primary}),f.icon&&m.renderSourceIcon(f.icon),r.jsxs(D.TitleSmall,{children:[" ",f.title]})]}),Y&&r.jsxs(ce,{children:[r.jsx(K.default,{width:20,height:20,color:c.COLORS.content.placeholder}),r.jsx(le,{autoFocus:!0,value:O,placeholder:"Search","data-test":"mention-picker-search",onChange:e=>G(e.target.value),onKeyDown:e=>{u.length&&(e.key==="ArrowDown"?(e.preventDefault(),x(o=>(o+1)%u.length)):e.key==="ArrowUp"?(e.preventDefault(),x(o=>(o+u.length-1)%u.length)):e.key==="Enter"&&(e.preventDefault(),(u[w]??u[0])?.onActivate()))}})]}),l==="variable"?r.jsx(ne.VariablePicker,{type:te.PickerType.EMBEDDED,data:A??[],showRecommendedBar:!1,onSelect:e=>{k?.(),M?.(e)}}):u.length===0?r.jsx(ge,{children:l==="subagent"?null:"No tools available"}):u.map((e,o)=>r.jsx(se,{type:"button",$active:o===w,onMouseEnter:()=>x(o),onMouseLeave:()=>x(-1),onClick:e.onActivate,children:e.isCreate?r.jsx(pe,{children:e.label}):r.jsxs(r.Fragment,{children:[r.jsxs(ue,{children:[m.renderSourceIcon(e.icon),r.jsx(D.BodySecondary,{color:c.COLORS.content.primary,children:e.label}),e.authRequired&&r.jsx(Q.default,{size:14,"aria-label":"Requires customer verification"})]}),e.rightLabel?r.jsx(fe,{children:e.rightLabel}):e.drillsIn&&r.jsx(Z.default,{width:12,height:12})]})},e.id)),u.some(e=>e.authRequired)&&r.jsxs(de,{children:[r.jsx(Q.default,{size:14}),r.jsx(D.BodyCaption,{color:c.COLORS.content.secondary,children:"Requires customer verification"})]})]})},ae=p.default.div`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),Z=require("../../../assets/icons/chevronRight.svg.js"),H=require("../../../assets/icons/searchIcon.svg.js"),K=require("../../../icons/Arrows/Normal arrows/ArrowLeft.js"),s=require("react"),ee=require("styled-components"),D=require("../../TypographyStyle.js"),a=require("../../../constants/Theme.js"),te=require("../../variable-picker-v3/model.js"),E=require("../constants/tools.js"),z=require("../utils/mentionSerialization.js"),v=require("../utils/sourceIcons.js"),ne=require("../../variable-picker-v3/VariablePicker.js"),Q=require("../../../icons/Informational/Common UI/Shield.js"),re=o=>o&&typeof o=="object"&&"default"in o?o:{default:o},f=re(ee),g=o=>o.meta,S=o=>g(o)?.plainLabel??o.label,oe="__bik_create_subagent__",ie=({items:o,onSelect:R,registerKeyHandler:w,onClose:k,onCreateSubAgent:m,initialSource:F,toolActions:y,integrationStatus:N,onConnectIntegration:U,variablesData:A,onSelectVariable:P})=>{const[W,C]=s.useState(null),[d,M]=s.useState(F??null),[L,x]=s.useState(-1),[O,G]=s.useState(""),b=s.useMemo(()=>o.filter(e=>g(e)?.kind==="tool"),[o]),I=s.useMemo(()=>o.filter(e=>g(e)?.kind==="subagent"),[o]),T=s.useMemo(()=>{const e=[];return b.forEach(i=>{const p=g(i)?.source??"other";e.includes(p)||e.push(p)}),e},[b]),_=s.useMemo(()=>new Map((y??[]).map(e=>[e.source,e])),[y]),j=s.useMemo(()=>E.CATEGORIES.filter(e=>e.key==="tool"?b.length>0||(y?.length??0)>0:e.key==="variable"?(A?.length??0)>0&&!!P:I.length>0||!!m),[b.length,I.length,m,y?.length,A?.length,P]),q=j.length===1?j[0].key:null,c=W??q,h=c?c==="subagent"?{title:"Sub-agent",onBack:q?void 0:()=>C(null)}:c==="variable"?{title:"Variables",onBack:q?void 0:()=>C(null)}:d?{title:z.toolSourceLabel(d),onBack:F?void 0:()=>M(null),icon:v.sourceIcon(d)}:{title:"Tools",onBack:q?void 0:()=>C(null)}:null,u=s.useMemo(()=>{if(!c)return j.map(r=>({id:r.key,label:r.label,drillsIn:!0,onActivate:()=>{C(r.key),M(null)}}));if(c==="subagent"){const r=O.trim().toLowerCase(),t=I.filter(l=>!r||S(l).toLowerCase().includes(r)).map(l=>({id:String(l.id),label:S(l),drillsIn:!1,onActivate:()=>R(l)}));return m&&t.push({id:oe,label:"Create new",drillsIn:!1,isCreate:!0,onActivate:()=>{k?.(),m()}}),t}if(c==="variable")return[];if(!d){const r=(y??[]).map(t=>t.source).filter(t=>!T.includes(t));return[...T,...r].sort((t,l)=>E.toolSourceRank(t)-E.toolSourceRank(l)).map(t=>{const l=_.get(t);if((l!==void 0?l.connected:N?.[t])===!1)return{id:t,label:z.toolSourceLabel(t),drillsIn:!1,icon:v.sourceIcon(t)??l?.icon,rightLabel:"Connect",onActivate:()=>{k?.(),l?.onConnect?l.onConnect():U?.(t)}};const J=b.filter($=>(g($)?.source??"other")===t);if(J.length+(l?1:0)===1){const $=v.sourceIcon(t)??l?.icon;if(l)return{id:t,label:l.label,drillsIn:!1,icon:$,onActivate:()=>{k?.(),l.onSelect()}};const B=J[0];return{id:String(B.id),label:S(B),drillsIn:!1,icon:$,authRequired:g(B)?.authRequired,onActivate:()=>R(B)}}return{id:t,label:z.toolSourceLabel(t),drillsIn:!0,icon:v.sourceIcon(t)??l?.icon,onActivate:()=>M(t)}})}const e=O.trim().toLowerCase(),i=b.filter(r=>(g(r)?.source??"other")===d).filter(r=>!e||S(r).toLowerCase().includes(e)).map(r=>({id:String(r.id),label:S(r),drillsIn:!1,authRequired:g(r)?.authRequired,onActivate:()=>R(r)})),p=_.get(d);if(p){const r=d in E.CONFIG_TOOL_SOURCES;i.push({id:`create:${d}`,label:p.label,drillsIn:!1,isCreate:!r,onActivate:()=>{k?.(),p.onSelect()}})}return i},[c,j,d,O,b,I,T,R,k,m,y,_,N,U]);s.useEffect(()=>x(-1),[c,d,O,o]),s.useEffect(()=>G(""),[c,d]);const V=s.useRef({rows:u,activeIndex:L,header:h});V.current={rows:u,activeIndex:L,header:h},s.useEffect(()=>{if(w)return w(e=>{const{rows:i,activeIndex:p,header:r}=V.current;switch(e.key){case"ArrowDown":return i.length&&x(t=>(t+1)%i.length),!0;case"ArrowUp":return i.length&&x(t=>(t+i.length-1)%i.length),!0;case"ArrowRight":case"Enter":return(i[p]??i[0])?.onActivate(),!0;case"ArrowLeft":return r?.onBack?(r.onBack(),!0):!1;default:return!1}}),()=>w(null)},[w]);const X=c?u.length&&!u[0].drillsIn?"items":"sources":"categories",Y=c==="tool"&&!!d||c==="subagent";return n.jsxs(le,{className:`bik-mention-picker bik-mention-picker--${X}`,$fixedHeight:c==="variable",children:[h&&n.jsxs(xe,{type:"button",onClick:h.onBack,disabled:!h.onBack,style:{background:a.COLORS.surface.subdued,cursor:h.onBack?"pointer":"default"},children:[h.onBack&&n.jsx(K.default,{width:20,height:20,color:a.COLORS.content.primary}),h.icon&&v.renderSourceIcon(h.icon),n.jsxs(D.TitleSmall,{children:[" ",h.title]})]}),Y&&n.jsxs(se,{children:[n.jsx(H.default,{width:20,height:20,color:a.COLORS.content.placeholder}),n.jsx(ue,{autoFocus:!0,value:O,placeholder:"Search","data-test":"mention-picker-search",onChange:e=>G(e.target.value),onKeyDown:e=>{u.length&&(e.key==="ArrowDown"?(e.preventDefault(),x(i=>(i+1)%u.length)):e.key==="ArrowUp"?(e.preventDefault(),x(i=>(i+u.length-1)%u.length)):e.key==="Enter"&&(e.preventDefault(),(u[L]??u[0])?.onActivate()))}})]}),c==="variable"?n.jsx(ce,{children:n.jsx(ne.VariablePicker,{type:te.PickerType.EMBEDDED,data:A??[],showRecommendedBar:!1,skipDefaultVariableContent:!0,onSelect:e=>{k?.(),P?.(e)}})}):u.length===0?n.jsx(be,{children:c==="subagent"?null:"No tools available"}):n.jsx(ae,{children:u.map((e,i)=>n.jsx(de,{type:"button",$active:i===L,onMouseEnter:()=>x(i),onMouseLeave:()=>x(-1),onClick:e.onActivate,children:e.isCreate?n.jsx(ge,{children:e.label}):n.jsxs(n.Fragment,{children:[n.jsxs(fe,{children:[v.renderSourceIcon(e.icon),n.jsx(D.BodySecondary,{color:a.COLORS.content.primary,children:e.label}),e.authRequired&&n.jsx(Q.default,{size:14,"aria-label":"Requires customer verification"})]}),e.rightLabel?n.jsx(pe,{children:e.rightLabel}):e.drillsIn&&n.jsx(Z.default,{width:12,height:12})]})},e.id))}),u.some(e=>e.authRequired)&&n.jsxs(he,{children:[n.jsx(Q.default,{size:14}),n.jsx(D.BodyCaption,{color:a.COLORS.content.secondary,children:"Requires customer verification"})]})]})},le=f.default.div`
 	display: flex;
 	flex-direction: column;
 	min-width: 240px;
-	max-height: 301px;
-	overflow-y: auto;
-	background: ${c.COLORS.surface.standard};
-	border: 1px solid ${c.COLORS.stroke.primary};
+	${o=>o.$fixedHeight?"height: 301px;":"max-height: 301px;"}
+	overflow: hidden;
+	background: ${a.COLORS.surface.standard};
+	border: 1px solid ${a.COLORS.stroke.primary};
 	border-radius: 4px;
 	box-shadow: 0px -2px 8px 0px #0000001f;
-`,ce=p.default.div`
+`,ae=f.default.div`
+	flex: 1 1 auto;
+	min-height: 0;
+	overflow-y: auto;
+	scrollbar-width: none;
+
+	&::-webkit-scrollbar {
+		display: none;
+	}
+`,ce=f.default.div`
+	flex: 1 1 auto;
+	min-height: 0;
+
+	> div {
+		height: 100%;
+	}
+
+	* {
+		scrollbar-width: none;
+	}
+
+	*::-webkit-scrollbar {
+		display: none;
+	}
+`,se=f.default.div`
 	display: flex;
 	align-items: center;
 	gap: 8px;
 	padding: 10px 12px;
-	border-bottom: 1px solid ${c.COLORS.stroke.primary};
-`,le=p.default.input`
+	border-bottom: 1px solid ${a.COLORS.stroke.primary};
+`,ue=f.default.input`
 	flex: 1;
 	min-width: 0;
 	border: none;
@@ -22,12 +46,12 @@
 	background: transparent;
 	font-family: Inter;
 	font-size: 14px;
-	color: ${c.COLORS.content.primary};
+	color: ${a.COLORS.content.primary};
 
 	&::placeholder {
-		color: ${c.COLORS.content.placeholder};
+		color: ${a.COLORS.content.placeholder};
 	}
-`,se=p.default.button`
+`,de=f.default.button`
 	display: flex;
 	justify-content: space-between;
 	align-items: center;
@@ -36,45 +60,45 @@
 	padding: 8px 10px;
 	height: 48px;
 	border: none;
-	border-bottom: 1px solid ${c.COLORS.stroke.primary};
-	background: ${a=>a.$active?c.COLORS.surface.subdued:"transparent"};
+	border-bottom: 1px solid ${a.COLORS.stroke.primary};
+	background: ${o=>o.$active?a.COLORS.surface.subdued:"transparent"};
 	cursor: pointer;
 	text-align: left;
 
 	&:hover {
-		background: ${c.COLORS.surface.hovered};
+		background: ${a.COLORS.surface.hovered};
 	}
-`,ue=p.default.div`
+`,fe=f.default.div`
 	display: flex;
 	align-items: center;
 	gap: 12px;
 	min-width: 0;
-`,de=p.default.div`
+`,he=f.default.div`
 	display: flex;
 	align-items: center;
 	gap: 6px;
 	padding: 8px 12px;
-	border-top: 1px solid ${c.COLORS.stroke.primary};
-`,fe=p.default.span`
+	border-top: 1px solid ${a.COLORS.stroke.primary};
+`,pe=f.default.span`
 	flex-shrink: 0;
-	color: ${c.COLORS.content.brand};
+	color: ${a.COLORS.content.brand};
 	font-family: Inter;
 	font-size: 14px;
 	font-weight: 600;
 	white-space: nowrap;
-`,pe=p.default.div`
+`,ge=f.default.div`
 	width: 100%;
 	text-align: center;
-	color: ${c.COLORS.content.brand};
+	color: ${a.COLORS.content.brand};
 	font-family: Inter;
 	font-size: 14px;
 	font-weight: 600;
-`,he=p.default.button`
+`,xe=f.default.button`
 	display: flex;
 	align-items: center;
 	padding: 12px 16px;
 	border: none;
-	border-bottom: 1px solid ${c.COLORS.stroke.primary};
+	border-bottom: 1px solid ${a.COLORS.stroke.primary};
 	background: transparent;
 	cursor: pointer;
 	font-family: Inter;
@@ -82,10 +106,10 @@
 	font-weight: 600;
 	height: 48px;
 	gap: 4px;
-`,ge=p.default.div`
+`,be=f.default.div`
 	padding: 12px 10px;
 	font-family: Inter;
 	font-size: 13px;
-	color: ${c.COLORS.content.secondary};
+	color: ${a.COLORS.content.secondary};
 `;exports.MentionPicker=ie;
 //# sourceMappingURL=MentionPicker.js.map

package/dist/cjs/components/agent-builder/components/MentionPicker.js.map

@@ -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 { 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 { VariablePicker } from '../../variable-picker-v3';\nimport { PickerType } from '../../variable-picker-v3/model';\nimport type {\n\tVariableListInterfaceV3,\n\tVariableV3,\n} from '../../variable-picker-v3/model';\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\t/**\n\t * Variable catalog for the \"Variables\" view (the shared VariablePicker's\n\t * `data`). Omitted / empty → the Variables category is not offered.\n\t */\n\tvariablesData?: VariableListInterfaceV3[];\n\t/**\n\t * A variable was picked from the Variables view. The picker dismisses itself\n\t * (stripping the typed `@`) BEFORE calling this — the handler inserts a\n\t * `Variable: <name>` mention chip (see MentionEditor).\n\t */\n\tonSelectVariable?: (variable: VariableV3) => void;\n};\n\n/**\n * `@` reference picker. Drills:\n *   root → Tools → <source> (Manifest / Shopify / …) → tool\n *        → Sub-agent → sub-agent\n *        → Variables → shared VariablePicker (embedded)\n * (\"Add condition\" is 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\tvariablesData,\n\tonSelectVariable,\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\tif (c.key === 'tool') {\n\t\t\t\t\treturn tools.length > 0 || (toolActions?.length ?? 0) > 0;\n\t\t\t\t}\n\t\t\t\tif (c.key === 'variable') {\n\t\t\t\t\treturn (variablesData?.length ?? 0) > 0 && !!onSelectVariable;\n\t\t\t\t}\n\t\t\t\treturn subAgents.length > 0 || !!onCreateSubAgent;\n\t\t\t}),\n\t\t[\n\t\t\ttools.length,\n\t\t\tsubAgents.length,\n\t\t\tonCreateSubAgent,\n\t\t\ttoolActions?.length,\n\t\t\tvariablesData?.length,\n\t\t\tonSelectVariable,\n\t\t],\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: activeCategory === 'variable'\n\t\t? {\n\t\t\t\ttitle: 'Variables',\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 (activeCategory === 'variable') {\n\t\t\t// The embedded VariablePicker owns this view (its own search + rows) —\n\t\t\t// no navigable PickerRow list of our own.\n\t\t\treturn [];\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{activeCategory === 'variable' ? (\n\t\t\t\t// Shared variable catalog, embedded as this drill-in view. Selecting a\n\t\t\t\t// variable dismisses the menu FIRST (strips the typed \"@\" + query),\n\t\t\t\t// then hands the variable up to insert its `{{token}}` at the cursor.\n\t\t\t\t<VariablePicker\n\t\t\t\t\ttype={PickerType.EMBEDDED}\n\t\t\t\t\tdata={variablesData ?? []}\n\t\t\t\t\tshowRecommendedBar={false}\n\t\t\t\t\tonSelect={(variable: VariableV3) => {\n\t\t\t\t\t\tonClose?.();\n\t\t\t\t\t\tonSelectVariable?.(variable);\n\t\t\t\t\t}}\n\t\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","variablesData","onSelectVariable","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","r","h","p","variant","showSearch","jsxs","PickerCard","PickerBack","COLORS","jsx","SvgArrowLeft","renderSourceIcon","TitleSmall","PickerSearchRow","SearchIcon","PickerSearchInput","VariablePicker","PickerType","variable","PickerEmpty","row","PickerRow","CreateRowText","Fragment","PickerRowMain","BodySecondary","Shield","RightActionText","ChevronRight","PickerLegend","BodyCaption","styled"],"mappings":"gwBAgCMA,EAAUC,GACfA,EAAK,KAEAC,EAAYD,GACjBD,EAAOC,CAAI,GAAG,YAAcA,EAAK,MAuB5BE,GAAqB,0BA+CdC,GAA8C,CAAC,CAC3D,MAAAC,EACA,SAAAC,EACA,mBAAAC,EACA,QAAAC,EACA,iBAAAC,EACA,cAAAC,EACA,YAAAC,EACA,kBAAAC,EACA,qBAAAC,EACA,cAAAC,EACA,iBAAAC,CACD,IAAM,CACL,KAAM,CAACC,EAAUC,CAAW,EAAIC,EAAAA,SAA0B,IAAI,EACxD,CAACC,EAAQC,CAAS,EAAIF,EAAAA,SAAwBR,GAAiB,IAAI,EAGnE,CAACW,EAAaC,CAAc,EAAIJ,EAAAA,SAAS,EAAE,EAG3C,CAACK,EAAQC,CAAS,EAAIN,EAAAA,SAAS,EAAE,EAEjCO,EAAQC,EAAAA,QACb,IAAMrB,EAAM,OAAQsB,GAAM3B,EAAO2B,CAAC,GAAG,OAAS,MAAM,EACpD,CAACtB,CAAK,CAAA,EAEDuB,EAAYF,EAAAA,QACjB,IAAMrB,EAAM,OAAQsB,GAAM3B,EAAO2B,CAAC,GAAG,OAAS,UAAU,EACxD,CAACtB,CAAK,CAAA,EAEDwB,EAAUH,EAAAA,QAAQ,IAAM,CAC7B,MAAMI,EAAgB,CAAA,EACtBL,OAAAA,EAAM,QAASM,GAAM,CACpB,MAAMC,EAAIhC,EAAO+B,CAAC,GAAG,QAAU,QAC1BD,EAAI,SAASE,CAAC,GAClBF,EAAI,KAAKE,CAAC,CAEZ,CAAC,EACMF,CACR,EAAG,CAACL,CAAK,CAAC,EAIJQ,EAAiBP,EAAAA,QACtB,IACC,IAAI,KACFf,GAAe,CAAA,GAAI,IAAKuB,GAAM,CAACA,EAAE,OAAQA,CAAC,CAAC,CAAA,EAE9C,CAACvB,CAAW,CAAA,EAOPwB,EAAsBT,EAAAA,QAC3B,IACCU,EAAAA,WAAW,OAAQC,GACdA,EAAE,MAAQ,OACNZ,EAAM,OAAS,IAAMd,GAAa,QAAU,GAAK,EAErD0B,EAAE,MAAQ,YACLvB,GAAe,QAAU,GAAK,GAAK,CAAC,CAACC,EAEvCa,EAAU,OAAS,GAAK,CAAC,CAACnB,CACjC,EACF,CACCgB,EAAM,OACNG,EAAU,OACVnB,EACAE,GAAa,OACbG,GAAe,OACfC,CAAA,CACD,EAEKuB,EACLH,EAAoB,SAAW,EAAIA,EAAoB,CAAC,EAAE,IAAM,KAC3DI,EAAiBvB,GAAYsB,EAM7BE,EAIMD,EAETA,IAAmB,WAEnB,CACA,MAAO,YACP,OAAQD,EAAe,OAAY,IAAMrB,EAAY,IAAI,CAAA,EAEzDsB,IAAmB,WACnB,CACA,MAAO,YACP,OAAQD,EAAe,OAAY,IAAMrB,EAAY,IAAI,CAAA,EAEzDE,EACA,CACA,MAAOsB,EAAAA,gBAAgBtB,CAAM,EAI7B,OAAQT,EAAgB,OAAY,IAAMU,EAAU,IAAI,EACxD,KAAMsB,EAAAA,WAAWvB,CAAM,CAAA,EAIvB,CACA,MAAO,QACP,OAAQmB,EAAe,OAAY,IAAMrB,EAAY,IAAI,CAAA,EAzBzD,KA6BG0B,EAAyBjB,EAAAA,QAAQ,IAAM,CAC5C,GAAI,CAACa,EACJ,OAAOJ,EAAoB,IAAKE,IAAO,CACtC,GAAIA,EAAE,IACN,MAAOA,EAAE,MACT,SAAU,GACV,WAAY,IAAM,CACjBpB,EAAYoB,EAAE,GAAG,EACjBjB,EAAU,IAAI,CACf,CAAA,EACC,EAEH,GAAImB,IAAmB,WAAY,CAClC,MAAMK,EAAKrB,EAAO,KAAA,EAAO,YAAA,EACnBsB,EAA2BjB,EAC/B,OAAQ3B,GAAS,CAAC2C,GAAM1C,EAASD,CAAI,EAAE,YAAA,EAAc,SAAS2C,CAAE,CAAC,EACjE,IAAK3C,IAAU,CACf,GAAI,OAAOA,EAAK,EAAE,EAClB,MAAOC,EAASD,CAAI,EACpB,SAAU,GACV,WAAY,IAAMK,EAASL,CAAI,CAAA,EAC9B,EAEH,OAAIQ,GACHoC,EAAO,KAAK,CACX,GAAI1C,GACJ,MAAO,aACP,SAAU,GACV,SAAU,GACV,WAAY,IAAM,CACjBK,IAAA,EACAC,EAAA,CACD,CAAA,CACA,EAEKoC,CACR,CACA,GAAIN,IAAmB,WAGtB,MAAO,CAAA,EAER,GAAI,CAACpB,EAAQ,CAIZ,MAAM2B,GAAcnC,GAAe,CAAA,GACjC,IAAKuB,GAAMA,EAAE,MAAM,EACnB,OAAQF,GAAM,CAACH,EAAQ,SAASG,CAAC,CAAC,EAGpC,MAAO,CAAC,GAAGH,EAAS,GAAGiB,CAAU,EAC/B,KAAK,CAACZ,EAAGa,IAAMC,EAAAA,eAAed,CAAC,EAAIc,iBAAeD,CAAC,CAAC,EACpD,IAAKf,GAAM,CACX,MAAMiB,EAAShB,EAAe,IAAID,CAAC,EASnC,IAHCiB,IAAW,OACRA,EAAO,UACPrC,IAAoBoB,CAAe,KACrB,GACjB,MAAO,CACN,GAAIA,EACJ,MAAOS,EAAAA,gBAAgBT,CAAC,EACxB,SAAU,GACV,KAAMU,EAAAA,WAAWV,CAAC,GAAKiB,GAAQ,KAC/B,WAAY,UACZ,WAAY,IAAM,CACjBzC,IAAA,EACIyC,GAAQ,UACXA,EAAO,UAAA,EAEPpC,IAAuBmB,CAAe,CAExC,CAAA,EASF,MAAMkB,EAAYzB,EAAM,OACtBM,IAAO/B,EAAO+B,CAAC,GAAG,QAAU,WAAaC,CAAA,EAE3C,GAAIkB,EAAU,QAAUD,EAAS,EAAI,KAAO,EAAG,CAC9C,MAAME,EAAOT,EAAAA,WAAWV,CAAC,GAAKiB,GAAQ,KACtC,GAAIA,EACH,MAAO,CACN,GAAIjB,EACJ,MAAOiB,EAAO,MACd,SAAU,GACV,KAAAE,EACA,WAAY,IAAM,CACjB3C,IAAA,EACAyC,EAAO,SAAA,CACR,CAAA,EAGF,MAAMG,EAAOF,EAAU,CAAC,EACxB,MAAO,CACN,GAAI,OAAOE,EAAK,EAAE,EAClB,MAAOlD,EAASkD,CAAI,EACpB,SAAU,GACV,KAAAD,EACA,aAAcnD,EAAOoD,CAAI,GAAG,aAC5B,WAAY,IAAM9C,EAAS8C,CAAI,CAAA,CAEjC,CACA,MAAO,CACN,GAAIpB,EACJ,MAAOS,EAAAA,gBAAgBT,CAAC,EACxB,SAAU,GACV,KAAMU,EAAAA,WAAWV,CAAC,GAAKiB,GAAQ,KAC/B,WAAY,IAAM7B,EAAUY,CAAC,CAAA,CAE/B,CAAC,CACH,CACA,MAAMqB,EAAI9B,EAAO,KAAA,EAAO,YAAA,EAClBsB,EAA2BpB,EAC/B,OAAQM,IAAO/B,EAAO+B,CAAC,GAAG,QAAU,WAAaZ,CAAM,EACvD,OAAQY,GAAM,CAACsB,GAAKnD,EAAS6B,CAAC,EAAE,cAAc,SAASsB,CAAC,CAAC,EACzD,IAAKpD,IAAU,CACf,GAAI,OAAOA,EAAK,EAAE,EAClB,MAAOC,EAASD,CAAI,EACpB,SAAU,GACV,aAAcD,EAAOC,CAAI,GAAG,aAC5B,WAAY,IAAMK,EAASL,CAAI,CAAA,EAC9B,EAMGgD,EAAShB,EAAe,IAAId,CAAM,EACxC,GAAI8B,EAAQ,CACX,MAAMK,EAAenC,KAAUoC,EAAAA,oBAC/BV,EAAO,KAAK,CACX,GAAI,UAAU1B,CAAM,GACpB,MAAO8B,EAAO,MACd,SAAU,GACV,SAAU,CAACK,EACX,WAAY,IAAM,CACjB9C,IAAA,EACAyC,EAAO,SAAA,CACR,CAAA,CACA,CACF,CACA,OAAOJ,CACR,EAAG,CACFN,EACAJ,EACAhB,EACAI,EACAE,EACAG,EACAC,EACAvB,EACAE,EACAC,EACAE,EACAsB,EACArB,EACAC,CAAA,CACA,EAGD2C,YAAU,IAAMlC,EAAe,EAAE,EAAG,CAACiB,EAAgBpB,EAAQI,EAAQlB,CAAK,CAAC,EAE3EmD,EAAAA,UAAU,IAAMhC,EAAU,EAAE,EAAG,CAACe,EAAgBpB,CAAM,CAAC,EAGvD,MAAMsC,EAASC,EAAAA,OAAO,CAAE,KAAAf,EAAM,YAAAtB,EAAa,OAAAmB,EAAQ,EACnDiB,EAAO,QAAU,CAAE,KAAAd,EAAM,YAAAtB,EAAa,OAAAmB,CAAA,EAEtCgB,EAAAA,UAAU,IAAM,CACf,GAAKjD,EAGL,OAAAA,EAAoBoD,GAAU,CAC7B,KAAM,CAAE,KAAMC,EAAG,YAAajC,EAAG,OAAQkC,GAAMJ,EAAO,QACtD,OAAQE,EAAM,IAAA,CACb,IAAK,YACJ,OAAIC,EAAE,QAAQtC,EAAgBwC,IAAOA,EAAI,GAAKF,EAAE,MAAM,EAC/C,GACR,IAAK,UACJ,OAAIA,EAAE,QAAQtC,EAAgBwC,IAAOA,EAAIF,EAAE,OAAS,GAAKA,EAAE,MAAM,EAC1D,GACR,IAAK,aACL,IAAK,QAGJ,OAACA,EAAEjC,CAAC,GAAKiC,EAAE,CAAC,IAAI,WAAA,EACT,GACR,IAAK,YACJ,OAAIC,GAAG,QACNA,EAAE,OAAA,EACK,IAED,GACR,QACC,MAAO,EAAA,CAEV,CAAC,EACM,IAAMtD,EAAmB,IAAI,CACrC,EAAG,CAACA,CAAkB,CAAC,EAEvB,MAAMwD,EAAWxB,EAEdI,EAAK,QAAU,CAACA,EAAK,CAAC,EAAE,SACxB,QACA,UAHA,aAOGqB,EACJzB,IAAmB,QAAU,CAAC,CAACpB,GAAWoB,IAAmB,WAE/D,OACC0B,EAAAA,KAACC,GAAA,CAAW,UAAW,0CAA0CH,CAAO,GACtE,SAAA,CAAAvB,GACAyB,EAAAA,KAACE,GAAA,CACA,KAAK,SACL,QAAS3B,EAAO,OAChB,SAAU,CAACA,EAAO,OAClB,MAAO,CACN,WAAY4B,EAAAA,OAAO,QAAQ,QAC3B,OAAQ5B,EAAO,OAAS,UAAY,SAAA,EAGpC,SAAA,CAAAA,EAAO,QACP6B,EAAAA,IAACC,EAAAA,QAAA,CACA,MAAO,GACP,OAAQ,GACR,MAAOF,EAAAA,OAAO,QAAQ,OAAA,CAAA,EAGvB5B,EAAO,MAAQ+B,mBAAiB/B,EAAO,IAAI,SAC3CgC,EAAAA,WAAA,CAAW,SAAA,CAAA,IAAEhC,EAAO,KAAA,CAAA,CAAM,CAAA,CAAA,CAAA,EAG5BwB,UACCS,GAAA,CACA,SAAA,CAAAJ,EAAAA,IAACK,EAAAA,QAAA,CACA,MAAO,GACP,OAAQ,GACR,MAAON,EAAAA,OAAO,QAAQ,WAAA,CAAA,EAEvBC,EAAAA,IAACM,GAAA,CAIA,UAAS,GACT,MAAOpD,EACP,YAAY,SACZ,YAAU,wBACV,SAAW,GAAMC,EAAU,EAAE,OAAO,KAAK,EACzC,UAAY,GAAM,CACZmB,EAAK,SAGN,EAAE,MAAQ,aACb,EAAE,eAAA,EACFrB,EAAgBwC,IAAOA,EAAI,GAAKnB,EAAK,MAAM,GACjC,EAAE,MAAQ,WACpB,EAAE,eAAA,EACFrB,EAAgBwC,IAAOA,EAAInB,EAAK,OAAS,GAAKA,EAAK,MAAM,GAC/C,EAAE,MAAQ,UACpB,EAAE,eAAA,GACDA,EAAKtB,CAAW,GAAKsB,EAAK,CAAC,IAAI,WAAA,GAElC,CAAA,CAAA,CACD,EACD,EAEAJ,IAAmB,WAInB8B,EAAAA,IAACO,GAAAA,eAAA,CACA,KAAMC,GAAAA,WAAW,SACjB,KAAM/D,GAAiB,CAAA,EACvB,mBAAoB,GACpB,SAAWgE,GAAyB,CACnCtE,IAAA,EACAO,IAAmB+D,CAAQ,CAC5B,CAAA,CAAA,EAEEnC,EAAK,SAAW,EACnB0B,EAAAA,IAACU,IACC,SAAAxC,IAAmB,WAAa,KAAO,oBAAA,CACzC,EAEAI,EAAK,IAAI,CAACqC,EAAKrD,IACd0C,EAAAA,IAACY,GAAA,CAEA,KAAK,SACL,QAAStD,IAAMN,EACf,aAAc,IAAMC,EAAeK,CAAC,EACpC,aAAc,IAAML,EAAe,EAAE,EACrC,QAAS0D,EAAI,WAEZ,WAAI,SACJX,EAAAA,IAACa,IAAe,SAAAF,EAAI,KAAA,CAAM,EAE1Bf,EAAAA,KAAAkB,EAAAA,SAAA,CACC,SAAA,CAAAlB,OAACmB,GAAA,CACC,SAAA,CAAAb,EAAAA,iBAAiBS,EAAI,IAAI,QACzBK,EAAAA,cAAA,CAAc,MAAOjB,EAAAA,OAAO,QAAQ,QACnC,WAAI,MACN,EACCY,EAAI,cACJX,EAAAA,IAACiB,EAAAA,QAAA,CACA,KAAM,GACN,aAAW,gCAAA,CAAA,CACZ,EAEF,EACCN,EAAI,WACJX,MAACkB,GAAA,CAAiB,WAAI,UAAA,CAAW,EAEjCP,EAAI,UAAYX,EAAAA,IAACmB,EAAAA,QAAA,CAAa,MAAO,GAAI,OAAQ,EAAA,CAAI,CAAA,CAAA,CAEvD,CAAA,EA5BIR,EAAI,EAAA,CA+BV,EAEDrC,EAAK,KAAMqC,GAAQA,EAAI,YAAY,UAClCS,GAAA,CACA,SAAA,CAAApB,EAAAA,IAACiB,EAAAA,QAAA,CAAO,KAAM,EAAA,CAAI,QACjBI,EAAAA,YAAA,CAAY,MAAOtB,EAAAA,OAAO,QAAQ,UAAW,SAAA,gCAAA,CAE9C,CAAA,CAAA,CACD,CAAA,EAEF,CAEF,EAEMF,GAAayB,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,eAMXvB,EAAAA,OAAO,QAAQ,QAAQ;AAAA,qBACjBA,EAAAA,OAAO,OAAO,OAAO;AAAA;AAAA;AAAA,EAMpCK,GAAkBkB,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA,4BAKHvB,EAAAA,OAAO,OAAO,OAAO;AAAA,EAG3CO,GAAoBgB,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAQvBvB,EAAAA,OAAO,QAAQ,OAAO;AAAA;AAAA;AAAA,WAGrBA,EAAAA,OAAO,QAAQ,WAAW;AAAA;AAAA,EAI/Ba,GAAYU,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,4BASGvB,EAAAA,OAAO,OAAO,OAAO;AAAA,eACjCN,GAAOA,EAAE,QAAUM,EAAAA,OAAO,QAAQ,QAAU,aAAc;AAAA;AAAA;AAAA;AAAA;AAAA,gBAK1DA,EAAAA,OAAO,QAAQ,OAAO;AAAA;AAAA,EAKhCgB,GAAgBO,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA,EAQvBF,GAAeE,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA,yBAKHvB,EAAAA,OAAO,OAAO,OAAO;AAAA,EAIxCmB,GAAkBI,EAAAA,QAAO;AAAA;AAAA,UAErBvB,EAAAA,OAAO,QAAQ,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA,EAQxBc,GAAgBS,EAAAA,QAAO;AAAA;AAAA;AAAA,UAGnBvB,EAAAA,OAAO,QAAQ,KAAK;AAAA;AAAA;AAAA;AAAA,EAMxBD,GAAawB,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA,4BAKEvB,EAAAA,OAAO,OAAO,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAU3CW,GAAcY,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA,UAIjBvB,EAAAA,OAAO,QAAQ,SAAS;AAAA"}
+{"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 { VariablePicker } from '../../variable-picker-v3';\nimport { PickerType } from '../../variable-picker-v3/model';\nimport type {\n\tVariableListInterfaceV3,\n\tVariableV3,\n} from '../../variable-picker-v3/model';\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\t/**\n\t * Variable catalog for the \"Variables\" view (the shared VariablePicker's\n\t * `data`). Omitted / empty → the Variables category is not offered.\n\t */\n\tvariablesData?: VariableListInterfaceV3[];\n\t/**\n\t * A variable was picked from the Variables view. The picker dismisses itself\n\t * (stripping the typed `@`) BEFORE calling this — the handler inserts a\n\t * `Variable: <name>` mention chip (see MentionEditor).\n\t */\n\tonSelectVariable?: (variable: VariableV3) => void;\n};\n\n/**\n * `@` reference picker. Drills:\n *   root → Tools → <source> (Manifest / Shopify / …) → tool\n *        → Sub-agent → sub-agent\n *        → Variables → shared VariablePicker (embedded)\n * (\"Add condition\" is 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\tvariablesData,\n\tonSelectVariable,\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\tif (c.key === 'tool') {\n\t\t\t\t\treturn tools.length > 0 || (toolActions?.length ?? 0) > 0;\n\t\t\t\t}\n\t\t\t\tif (c.key === 'variable') {\n\t\t\t\t\treturn (variablesData?.length ?? 0) > 0 && !!onSelectVariable;\n\t\t\t\t}\n\t\t\t\treturn subAgents.length > 0 || !!onCreateSubAgent;\n\t\t\t}),\n\t\t[\n\t\t\ttools.length,\n\t\t\tsubAgents.length,\n\t\t\tonCreateSubAgent,\n\t\t\ttoolActions?.length,\n\t\t\tvariablesData?.length,\n\t\t\tonSelectVariable,\n\t\t],\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: activeCategory === 'variable'\n\t\t? {\n\t\t\t\ttitle: 'Variables',\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 (activeCategory === 'variable') {\n\t\t\t// The embedded VariablePicker owns this view (its own search + rows) —\n\t\t\t// no navigable PickerRow list of our own.\n\t\t\treturn [];\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\n\t\t\tclassName={`bik-mention-picker bik-mention-picker--${variant}`}\n\t\t\t// Variables view: a definite height so the embedded VariablePicker's\n\t\t\t// internal list scroll (below its fixed search bar) can resolve.\n\t\t\t$fixedHeight={activeCategory === 'variable'}\n\t\t>\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{activeCategory === 'variable' ? (\n\t\t\t\t// Shared variable catalog, embedded as this drill-in view. The fill\n\t\t\t\t// wrapper hands it the remaining card height, so ITS search bar stays\n\t\t\t\t// fixed and only the variable list below scrolls. Selecting a\n\t\t\t\t// variable dismisses the menu FIRST (strips the typed \"@\" + query),\n\t\t\t\t// then hands the variable up to insert its `{{token}}` at the cursor.\n\t\t\t\t<VariableFill>\n\t\t\t\t\t<VariablePicker\n\t\t\t\t\t\ttype={PickerType.EMBEDDED}\n\t\t\t\t\t\tdata={variablesData ?? []}\n\t\t\t\t\t\tshowRecommendedBar={false}\n\t\t\t\t\t\t// Insert the reference token directly — the \"set up a default\n\t\t\t\t\t\t// value\" flow doesn't apply in the agent builder.\n\t\t\t\t\t\tskipDefaultVariableContent\n\t\t\t\t\t\tonSelect={(variable: VariableV3) => {\n\t\t\t\t\t\t\tonClose?.();\n\t\t\t\t\t\t\tonSelectVariable?.(variable);\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t</VariableFill>\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\t<PickerScroll>\n\t\t\t\t\t{rows.map((row, i) => (\n\t\t\t\t\t\t<PickerRow\n\t\t\t\t\t\t\tkey={row.id}\n\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t$active={i === activeIndex}\n\t\t\t\t\t\t\tonMouseEnter={() => setActiveIndex(i)}\n\t\t\t\t\t\t\tonMouseLeave={() => setActiveIndex(-1)}\n\t\t\t\t\t\t\tonClick={row.onActivate}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{row.isCreate ? (\n\t\t\t\t\t\t\t\t<CreateRowText>{row.label}</CreateRowText>\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t<PickerRowMain>\n\t\t\t\t\t\t\t\t\t\t{renderSourceIcon(row.icon)}\n\t\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\t{row.label}\n\t\t\t\t\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t\t\t\t\t\t{row.authRequired && (\n\t\t\t\t\t\t\t\t\t\t\t<Shield\n\t\t\t\t\t\t\t\t\t\t\t\tsize={14}\n\t\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\t/>\n\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t</PickerRowMain>\n\t\t\t\t\t\t\t\t\t{row.rightLabel ? (\n\t\t\t\t\t\t\t\t\t\t<RightActionText>{row.rightLabel}</RightActionText>\n\t\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t\trow.drillsIn && <ChevronRight width={12} height={12} />\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</PickerRow>\n\t\t\t\t\t))}\n\t\t\t\t</PickerScroll>\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\n// The card itself never scrolls — the header / search stay fixed and only the\n// list area (PickerScroll, or the embedded VariablePicker's own list) does.\nconst PickerCard = styled.div<{ $fixedHeight?: boolean }>`\n\tdisplay: flex;\n\tflex-direction: column;\n\tmin-width: 240px;\n\t${(p) => (p.$fixedHeight ? 'height: 301px;' : 'max-height: 301px;')}\n\toverflow: hidden;\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// Scrollable row list below the fixed header / search (scrollbar hidden —\n// the fixed header already signals there's more below).\nconst PickerScroll = styled.div`\n\tflex: 1 1 auto;\n\tmin-height: 0;\n\toverflow-y: auto;\n\tscrollbar-width: none;\n\n\t&::-webkit-scrollbar {\n\t\tdisplay: none;\n\t}\n`;\n\n// Hands the embedded VariablePicker the card's remaining height (its Content\n// sizes itself with percentages, so the chain must be definite). Its internal\n// list scrollbar is hidden to match PickerScroll.\nconst VariableFill = styled.div`\n\tflex: 1 1 auto;\n\tmin-height: 0;\n\n\t> div {\n\t\theight: 100%;\n\t}\n\n\t* {\n\t\tscrollbar-width: none;\n\t}\n\n\t*::-webkit-scrollbar {\n\t\tdisplay: none;\n\t}\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","variablesData","onSelectVariable","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","r","h","p","variant","showSearch","jsxs","PickerCard","PickerBack","COLORS","jsx","SvgArrowLeft","renderSourceIcon","TitleSmall","PickerSearchRow","SearchIcon","PickerSearchInput","VariableFill","VariablePicker","PickerType","variable","PickerEmpty","PickerScroll","row","PickerRow","CreateRowText","Fragment","PickerRowMain","BodySecondary","Shield","RightActionText","ChevronRight","PickerLegend","BodyCaption","styled"],"mappings":"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"}

package/dist/cjs/components/agent-builder/components/RestApiToolPanel.js

@@ -1,23 +1,24 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),Q=require("../../../assets/icons/delete.svg.js"),K=require("../../../assets/icons/plus.svg.js"),o=require("react"),X=require("styled-components"),p=require("../../TypographyStyle.js"),i=require("../../../constants/Theme.js"),c=require("../AgentBuilder.styled.js"),Z=require("../constants/charLimits.js"),R=require("./DrawerHeaderText.js"),ee=require("./ToolInstructionsField.js"),h=require("./VariableTriggerArea.js"),te=require("../../side-modal/SideModal.js"),m=require("../../input/Input.js"),re=require("../../dropdown/Dropdown.js"),ne=require("../../dropdown/utils.js"),se=require("../../button/Button.js"),D=require("../../../editor/BikEditor.js"),oe=s=>s&&typeof s=="object"&&"default"in s?s:{default:s},O=oe(X),ae=["GET","POST","PUT","PATCH","DELETE"],le=ae.map(s=>({label:s,value:s})),C=(s,x)=>(x.textBefore.match(new RegExp('(?<!\\\\)"',"g"))?.length??0)%2===1?s:`"${s}"`,ie=({onClose:s,onSave:x,initial:a,onImprove:$,charLimits:q=Z.AGENT_CHAR_LIMITS,zIndex:M,existingNames:F=[],variablesData:d})=>{const[T,N]=o.useState(a?.name??""),I=o.useRef(null),k=o.useRef(null),[B,V]=o.useState(a?.instructions??""),[y,E]=o.useState(a?.url??"https://"),[g,z]=o.useState(a?.method??"POST"),[L,f]=o.useState(a?.headers??[{key:"",value:""}]),[A,J]=o.useState(a?.requestBody??""),[H,G]=o.useState(a?.responseSample??""),[w,P]=o.useState(!1),S=(t,r)=>f(n=>n.map((l,u)=>u===t?{...l,...r}:l)),U=()=>f(t=>[...t,{key:"",value:""}]),W=t=>f(r=>r.filter((n,l)=>l!==t)),j=T.trim(),v=j.length>0&&F.some(t=>t.trim().toLowerCase()===j.toLowerCase()),_=j.length>0&&y.trim().length>0&&!v,Y=async()=>{if(!_||w)return;const t={id:a?.id??`restapi_${Date.now().toString(36)}`,name:T.trim(),instructions:B,url:y.trim(),method:g,headers:L.filter(n=>n.key.trim()||n.value.trim()),requestBody:A,responseSample:H},r=x(t);if(r&&typeof r.then=="function"){P(!0);try{await r}finally{P(!1)}}};return e.jsxs(te.SideModal,{header:"Rest API",closeOnEscapeKey:!1,zIndex:M,headerCustomComponent:e.jsx(R.DrawerHeaderText,{title:"Rest API",subtitle:"Connect to any API endpoint. Define the request and a sample response for the agent to reference."}),width:"431px",headerStyle:R.DRAWER_HEADER_STYLE,bodyStyle:R.DRAWER_BODY_STYLE,onClose:s,saveButtonProps:{"data-test":"restapi-save",buttonText:"Save",buttonType:"primary",size:"small",disabled:!_,isLoading:w,onClick:Y},cancelButtonProps:{"data-test":"restapi-cancel",buttonText:"Cancel",buttonType:"tertiaryGray",size:"small",onClick:s},children:[e.jsx(m.Input,{"data-test":"restapi-name",variant:"small",labelText:"Name",labelTextBold:!0,placeholder:"Enter action name",value:T,maxCharLimit:q.name,state:v?"invalid":void 0,errorMessage:v?"A tool with this name already exists":void 0,onChangeText:N}),e.jsx(ee.ToolInstructionsField,{"data-test":"restapi-instructions",label:"Instructions",value:B,onChange:V,maxLength:q.instructions,placeholder:"Describe how should the LLM generate the rest API",onImprove:$,variablesData:d}),e.jsx(c.FieldBlock,{children:e.jsx(h.VariableTriggerArea,{variablesData:d,onInsert:(t,r)=>E(n=>{const l=r??n.length;return`${n.slice(0,l)}${t}${n.slice(l)}`}),children:e.jsx(m.Input,{"data-test":"restapi-url",variant:"small",labelText:"Request URL",labelTextBold:!0,placeholder:"https://",type:"url",value:y,onChangeText:E})})}),e.jsxs(c.FieldBlock,{children:[e.jsx(p.TitleSmall,{color:i.COLORS.content.primary,children:"HTTP method"}),e.jsx(re.Dropdown,{"data-test":"restapi-method",size:"small",width:"100%",dropdownWidth:"399px",options:le,defaultOptions:[{label:g,value:g}],onSelect:t=>{const r=ne.unwrapDropdownValue(t);r&&z(r)}})]}),e.jsxs(c.FieldBlock,{children:[e.jsx(p.TitleSmall,{color:i.COLORS.content.primary,children:"Headers"}),L.map((t,r)=>e.jsxs(de,{"data-test":`restapi-header-${r}`,children:[e.jsx(m.Input,{variant:"small",hideInputHeader:!0,placeholder:"Enter name",value:t.key,onChangeText:n=>S(r,{key:n})}),e.jsx(h.VariableTriggerArea,{variablesData:d,onInsert:(n,l)=>{const u=l??t.value.length;S(r,{value:`${t.value.slice(0,u)}${n}${t.value.slice(u)}`})},children:e.jsx(m.Input,{variant:"small",hideInputHeader:!0,placeholder:"Enter value",value:t.value,onChangeText:n=>S(r,{value:n})})}),e.jsx(ue,{type:"button","aria-label":"Remove header","data-test":`restapi-header-remove-${r}`,onClick:()=>W(r),children:e.jsx(Q.default,{width:16,height:16,color:i.COLORS.content.secondary})})]},r)),e.jsx(ce,{children:e.jsx(se.Button,{"data-test":"restapi-add-header",buttonType:"dashRegular",size:"small",LeadingIcon:K.default,buttonText:"Add header",onClick:U})})]}),e.jsxs(c.FieldBlock,{children:[e.jsx(p.TitleSmall,{color:i.COLORS.content.primary,children:"Request "}),e.jsx(h.VariableTriggerArea,{variablesData:d,transformToken:C,onInsert:t=>I.current?.insertInlineContent(t),children:e.jsx(D.BikEditor,{ref:I,features:{jsonMode:!0},initialContent:A,style:b,placeholder:"Type or paste JSON here",onChange:t=>J(t.text),minHeight:"120px",maxHeight:"240px"})})]}),e.jsxs(c.FieldBlock,{children:[e.jsx(p.TitleSmall,{color:i.COLORS.content.primary,children:"Response "}),e.jsx(h.VariableTriggerArea,{variablesData:d,transformToken:C,onInsert:t=>k.current?.insertInlineContent(t),children:e.jsx(D.BikEditor,{ref:k,features:{jsonMode:!0},style:b,initialContent:H,placeholder:"Type or paste JSON here",onChange:t=>G(t.text),minHeight:"120px",maxHeight:"240px"})})]})]})},de=O.default.div`
-	display: flex;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),U=require("../../../assets/icons/delete.svg.js"),W=require("../../../assets/icons/plus.svg.js"),o=require("react"),Y=require("styled-components"),c=require("../../TypographyStyle.js"),l=require("../../../constants/Theme.js"),i=require("../AgentBuilder.styled.js"),K=require("../constants/charLimits.js"),g=require("./DrawerHeaderText.js"),Q=require("./ToolInstructionsField.js"),k=require("./VariableInlineField.js"),X=require("../../side-modal/SideModal.js"),w=require("../../input/Input.js"),Z=require("../../dropdown/Dropdown.js"),ee=require("../../dropdown/utils.js"),te=require("../../button/Button.js"),E=require("../../../editor/BikEditor.js"),se=r=>r&&typeof r=="object"&&"default"in r?r:{default:r},v=se(Y),re=["GET","POST","PUT","PATCH","DELETE"],ne=re.map(r=>({label:r,value:r})),ae=({onClose:r,onSave:H,initial:a,onImprove:I,charLimits:R=K.AGENT_CHAR_LIMITS,zIndex:A,existingNames:D=[],variablesData:u})=>{const[p,P]=o.useState(a?.name??""),[j,_]=o.useState(a?.instructions??""),[h,F]=o.useState(a?.url??"https://"),[m,M]=o.useState(a?.method??"POST"),[x,y]=o.useState(a?.headers??[{key:"",value:""}]),[C,N]=o.useState(a?.requestBody??""),[b,$]=o.useState(a?.responseSample??""),[O,q]=o.useState(!1),L=(t,s)=>y(n=>n.map((d,G)=>G===t?{...d,...s}:d)),z=()=>y(t=>[...t,{key:"",value:""}]),J=t=>y(s=>s.filter((n,d)=>d!==t)),S=p.trim(),T=S.length>0&&D.some(t=>t.trim().toLowerCase()===S.toLowerCase()),B=S.length>0&&h.trim().length>0&&!T,V=async()=>{if(!B||O)return;const t={id:a?.id??`restapi_${Date.now().toString(36)}`,name:p.trim(),instructions:j,url:h.trim(),method:m,headers:x.filter(n=>n.key.trim()||n.value.trim()),requestBody:C,responseSample:b},s=H(t);if(s&&typeof s.then=="function"){q(!0);try{await s}finally{q(!1)}}};return e.jsxs(X.SideModal,{header:"Rest API",closeOnEscapeKey:!1,zIndex:A,headerCustomComponent:e.jsx(g.DrawerHeaderText,{title:"Rest API",subtitle:"Connect to any API endpoint. Define the request and a sample response for the agent to reference."}),width:"431px",headerStyle:g.DRAWER_HEADER_STYLE,bodyStyle:g.DRAWER_BODY_STYLE,onClose:r,saveButtonProps:{"data-test":"restapi-save",buttonText:"Save",buttonType:"primary",size:"small",disabled:!B,isLoading:O,onClick:V},cancelButtonProps:{"data-test":"restapi-cancel",buttonText:"Cancel",buttonType:"tertiaryGray",size:"small",onClick:r},children:[e.jsx(w.Input,{"data-test":"restapi-name",variant:"small",labelText:"Name",labelTextBold:!0,placeholder:"Enter action name",value:p,maxCharLimit:R.name,state:T?"invalid":void 0,errorMessage:T?"A tool with this name already exists":void 0,onChangeText:P}),e.jsx(Q.ToolInstructionsField,{"data-test":"restapi-instructions",label:"Instructions",value:j,onChange:_,maxLength:R.instructions,placeholder:"Describe how should the LLM generate the rest API",onImprove:I,variablesData:u}),e.jsx(i.FieldBlock,{children:e.jsx(k.VariableInlineField,{"data-test":"restapi-url",label:"Request URL",placeholder:"https://",value:h,onChange:F,variablesData:u})}),e.jsxs(i.FieldBlock,{children:[e.jsx(c.TitleSmall,{color:l.COLORS.content.primary,children:"HTTP method"}),e.jsx(Z.Dropdown,{"data-test":"restapi-method",size:"small",width:"100%",dropdownWidth:"399px",options:ne,defaultOptions:[{label:m,value:m}],onSelect:t=>{const s=ee.unwrapDropdownValue(t);s&&M(s)}})]}),e.jsxs(i.FieldBlock,{children:[e.jsx(c.TitleSmall,{color:l.COLORS.content.primary,children:"Headers"}),x.map((t,s)=>e.jsxs(oe,{"data-test":`restapi-header-${s}`,children:[e.jsx(w.Input,{variant:"small",hideInputHeader:!0,placeholder:"Enter name",value:t.key,onChangeText:n=>L(s,{key:n})}),e.jsx(k.VariableInlineField,{placeholder:"Enter value",value:t.value,onChange:n=>L(s,{value:n}),variablesData:u}),e.jsx(ie,{type:"button","aria-label":"Remove header","data-test":`restapi-header-remove-${s}`,onClick:()=>J(s),children:e.jsx(U.default,{width:16,height:16,color:l.COLORS.content.secondary})})]},`${s}:${x.length}`)),e.jsx(le,{children:e.jsx(te.Button,{"data-test":"restapi-add-header",buttonType:"dashRegular",size:"small",LeadingIcon:W.default,buttonText:"Add header",onClick:z})})]}),e.jsxs(i.FieldBlock,{children:[e.jsx(c.TitleSmall,{color:l.COLORS.content.primary,children:"Request "}),e.jsx(E.BikEditor,{features:{jsonMode:!0},initialContent:C,style:f,placeholder:"Type or paste JSON here",onChange:t=>N(t.text),minHeight:"120px",maxHeight:"240px"})]}),e.jsxs(i.FieldBlock,{children:[e.jsx(c.TitleSmall,{color:l.COLORS.content.primary,children:"Response "}),e.jsx(E.BikEditor,{features:{jsonMode:!0},style:f,initialContent:b,placeholder:"Type or paste JSON here",onChange:t=>$(t.text),minHeight:"120px",maxHeight:"240px"})]})]})},oe=v.default.div`
+	display: grid;
+	grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr) 32px;
 	align-items: center;
 	gap: 8px;
-`,ce=O.default.div`
+`,le=v.default.div`
 	display: flex;
-`,ue=O.default.button`
+`,ie=v.default.button`
 	display: inline-flex;
 	align-items: center;
 	justify-content: center;
 	flex-shrink: 0;
 	width: 32px;
 	height: 32px;
-	border: 1px solid ${i.COLORS.stroke.primary};
+	border: 1px solid ${l.COLORS.stroke.primary};
 	border-radius: 4px;
-	background: ${i.COLORS.surface.standard};
+	background: ${l.COLORS.surface.standard};
 	cursor: pointer;
 
 	&:hover {
-		border-color: ${i.COLORS.content.secondary};
+		border-color: ${l.COLORS.content.secondary};
 	}
-`,b={borderRadius:"4px",overflow:"hidden"};exports.JsonFieldBox=b;exports.RestApiToolPanel=ie;exports.jsonQuoteToken=C;
+`,f={borderRadius:"4px",overflow:"hidden"};exports.JsonFieldBox=f;exports.RestApiToolPanel=ae;
 //# sourceMappingURL=RestApiToolPanel.js.map

package/dist/cjs/components/agent-builder/components/RestApiToolPanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"RestApiToolPanel.js","sources":["../../../../../src/components/agent-builder/components/RestApiToolPanel.tsx"],"sourcesContent":["import DeleteIcon from '@src/assets/icons/delete.svg';\nimport PlusIcon from '@src/assets/icons/plus.svg';\nimport { BikEditor, BikEditorRef } from '@src/editor';\nimport React, { useRef, useState } from 'react';\nimport styled from 'styled-components';\nimport { Button } from '@src/components/button';\nimport { Dropdown, unwrapDropdownValue } from '@src/components/dropdown';\nimport { SingleOption } from '@src/components/dropdown/type';\nimport { Input } from '@src/components/input';\nimport { SideModal } from '@src/components/side-modal';\nimport { TitleSmall } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport type { VariableListInterfaceV3 } from '../../variable-picker-v3/model';\nimport {\n\tRestApiHeader,\n\tRestApiMethod,\n\tRestApiToolConfig,\n} from '../AgentBuilder.model';\nimport { FieldBlock } from '../AgentBuilder.styled';\nimport type { AgentCharLimits } from '../constants/charLimits';\nimport { AGENT_CHAR_LIMITS } from '../constants/charLimits';\nimport {\n\tDRAWER_BODY_STYLE,\n\tDRAWER_HEADER_STYLE,\n\tDrawerHeaderText,\n} from './DrawerHeaderText';\nimport { ToolInstructionsField } from './ToolInstructionsField';\nimport { VariableTriggerArea } from './VariableTriggerArea';\n\ninterface RestApiToolPanelProps {\n\tonClose: () => void;\n\t/** Persist the config. A pending promise shows the Save loader. */\n\tonSave: (config: RestApiToolConfig) => void | Promise<void>;\n\t/** Seed values when editing an existing tool. */\n\tinitial?: RestApiToolConfig;\n\t/** Optional \"Improve with AI\" for the instructions field. Omit to hide it. */\n\tonImprove?: (text: string) => Promise<string>;\n\tcharLimits?: AgentCharLimits;\n\t/** SideModal stacking order — raise it when opened over another drawer. */\n\tzIndex?: number;\n\t/** Names of the OTHER tools — a new tool can't reuse one of these. */\n\texistingNames?: string[];\n\t/**\n\t * Variable catalog for the `@` trigger. When non-empty, `@` opens the\n\t * variable picker directly in Instructions / Request URL / header values /\n\t * Request / Response. Absent → the drawer behaves exactly as before.\n\t */\n\tvariablesData?: VariableListInterfaceV3[];\n}\n\nconst METHODS: RestApiMethod[] = ['GET', 'POST', 'PUT', 'PATCH', 'DELETE'];\nconst METHOD_OPTIONS: SingleOption[] = METHODS.map((m) => ({\n\tlabel: m,\n\tvalue: m,\n}));\n\n/**\n * Keep the Request / Response bodies valid JSON: wrap the picked token in\n * quotes (`\"email\": \"{{variable:customer.email}}\"`) — unless the `@` was typed\n * inside a string literal already (odd number of unescaped `\"` before it, e.g.\n * `\"Bearer @`), where the bare token interpolates into the existing string.\n */\nexport const jsonQuoteToken = (\n\ttoken: string,\n\tctx: { textBefore: string },\n): string => {\n\tconst quotes = ctx.textBefore.match(/(?<!\\\\)\"/g)?.length ?? 0;\n\treturn quotes % 2 === 1 ? token : `\"${token}\"`;\n};\n\n/**\n * Right-side drawer to configure a \"Rest API\" tool: the endpoint the agent can\n * call, plus a JSON request-body template and a sample response. Mount it fresh\n * per open (key it) so `initial` seeds the state. Built on the shared `SideModal`\n * shell and the BikEditor JSON body mode for the Request / Response editors.\n */\nexport const RestApiToolPanel: React.FC<RestApiToolPanelProps> = ({\n\tonClose,\n\tonSave,\n\tinitial,\n\tonImprove,\n\tcharLimits = AGENT_CHAR_LIMITS,\n\tzIndex,\n\texistingNames = [],\n\tvariablesData,\n}) => {\n\tconst [name, setName] = useState(initial?.name ?? '');\n\t// `@`-picked variables insert into the JSON editors at their own cursor.\n\tconst requestEditorRef = useRef<BikEditorRef>(null);\n\tconst responseEditorRef = useRef<BikEditorRef>(null);\n\tconst [instructions, setInstructions] = useState(initial?.instructions ?? '');\n\t// New tools start with the scheme pre-filled so the user only types the host.\n\tconst [url, setUrl] = useState(initial?.url ?? 'https://');\n\tconst [method, setMethod] = useState<RestApiMethod>(\n\t\tinitial?.method ?? 'POST',\n\t);\n\tconst [headers, setHeaders] = useState<RestApiHeader[]>(\n\t\tinitial?.headers ?? [{ key: '', value: '' }],\n\t);\n\tconst [requestBody, setRequestBody] = useState(initial?.requestBody ?? '');\n\tconst [responseSample, setResponseSample] = useState(\n\t\tinitial?.responseSample ?? '',\n\t);\n\tconst [saving, setSaving] = useState(false);\n\n\tconst patchHeader = (i: number, patch: Partial<RestApiHeader>) =>\n\t\tsetHeaders((prev) =>\n\t\t\tprev.map((h, idx) => (idx === i ? { ...h, ...patch } : h)),\n\t\t);\n\tconst addHeader = () =>\n\t\tsetHeaders((prev) => [...prev, { key: '', value: '' }]);\n\tconst removeHeader = (i: number) =>\n\t\tsetHeaders((prev) => prev.filter((_, idx) => idx !== i));\n\n\tconst nameTrimmed = name.trim();\n\t// Case-insensitive: two tools can't share a name (the LLM references them by it).\n\tconst isDuplicateName =\n\t\tnameTrimmed.length > 0 &&\n\t\texistingNames.some(\n\t\t\t(n) => n.trim().toLowerCase() === nameTrimmed.toLowerCase(),\n\t\t);\n\tconst canSave =\n\t\tnameTrimmed.length > 0 && url.trim().length > 0 && !isDuplicateName;\n\n\tconst handleSave = async () => {\n\t\tif (!canSave || saving) {\n\t\t\treturn;\n\t\t}\n\t\tconst config: RestApiToolConfig = {\n\t\t\tid: initial?.id ?? `restapi_${Date.now().toString(36)}`,\n\t\t\tname: name.trim(),\n\t\t\tinstructions,\n\t\t\turl: url.trim(),\n\t\t\tmethod,\n\t\t\t// Drop fully-empty header rows.\n\t\t\theaders: headers.filter((h) => h.key.trim() || h.value.trim()),\n\t\t\trequestBody,\n\t\t\tresponseSample,\n\t\t};\n\t\tconst result = onSave(config);\n\t\tif (result && typeof (result as Promise<void>).then === 'function') {\n\t\t\tsetSaving(true);\n\t\t\ttry {\n\t\t\t\tawait result;\n\t\t\t} finally {\n\t\t\t\tsetSaving(false);\n\t\t\t}\n\t\t}\n\t};\n\n\treturn (\n\t\t<SideModal\n\t\t\theader=\"Rest API\"\n\t\t\tcloseOnEscapeKey={false}\n\t\t\tzIndex={zIndex}\n\t\t\theaderCustomComponent={\n\t\t\t\t<DrawerHeaderText\n\t\t\t\t\ttitle=\"Rest API\"\n\t\t\t\t\tsubtitle=\"Connect to any API endpoint. Define the request and a sample response for the agent to reference.\"\n\t\t\t\t/>\n\t\t\t}\n\t\t\twidth=\"431px\"\n\t\t\theaderStyle={DRAWER_HEADER_STYLE}\n\t\t\tbodyStyle={DRAWER_BODY_STYLE}\n\t\t\tonClose={onClose}\n\t\t\tsaveButtonProps={{\n\t\t\t\t'data-test': 'restapi-save',\n\t\t\t\tbuttonText: 'Save',\n\t\t\t\tbuttonType: 'primary',\n\t\t\t\tsize: 'small',\n\t\t\t\tdisabled: !canSave,\n\t\t\t\tisLoading: saving,\n\t\t\t\tonClick: handleSave,\n\t\t\t}}\n\t\t\tcancelButtonProps={{\n\t\t\t\t'data-test': 'restapi-cancel',\n\t\t\t\tbuttonText: 'Cancel',\n\t\t\t\tbuttonType: 'tertiaryGray',\n\t\t\t\tsize: 'small',\n\t\t\t\tonClick: onClose,\n\t\t\t}}\n\t\t>\n\t\t\t<Input\n\t\t\t\tdata-test=\"restapi-name\"\n\t\t\t\tvariant=\"small\"\n\t\t\t\tlabelText=\"Name\"\n\t\t\t\tlabelTextBold\n\t\t\t\tplaceholder=\"Enter action name\"\n\t\t\t\tvalue={name}\n\t\t\t\tmaxCharLimit={charLimits.name}\n\t\t\t\tstate={isDuplicateName ? 'invalid' : undefined}\n\t\t\t\terrorMessage={\n\t\t\t\t\tisDuplicateName ? 'A tool with this name already exists' : undefined\n\t\t\t\t}\n\t\t\t\tonChangeText={setName}\n\t\t\t/>\n\n\t\t\t<ToolInstructionsField\n\t\t\t\tdata-test=\"restapi-instructions\"\n\t\t\t\tlabel=\"Instructions\"\n\t\t\t\tvalue={instructions}\n\t\t\t\tonChange={setInstructions}\n\t\t\t\tmaxLength={charLimits.instructions}\n\t\t\t\tplaceholder=\"Describe how should the LLM generate the rest API\"\n\t\t\t\tonImprove={onImprove}\n\t\t\t\tvariablesData={variablesData}\n\t\t\t/>\n\n\t\t\t<FieldBlock>\n\t\t\t\t<VariableTriggerArea\n\t\t\t\t\tvariablesData={variablesData}\n\t\t\t\t\tonInsert={(token, caret) =>\n\t\t\t\t\t\tsetUrl((u) => {\n\t\t\t\t\t\t\tconst at = caret ?? u.length;\n\t\t\t\t\t\t\treturn `${u.slice(0, at)}${token}${u.slice(at)}`;\n\t\t\t\t\t\t})\n\t\t\t\t\t}\n\t\t\t\t>\n\t\t\t\t\t<Input\n\t\t\t\t\t\tdata-test=\"restapi-url\"\n\t\t\t\t\t\tvariant=\"small\"\n\t\t\t\t\t\tlabelText=\"Request URL\"\n\t\t\t\t\t\tlabelTextBold\n\t\t\t\t\t\tplaceholder=\"https://\"\n\t\t\t\t\t\ttype=\"url\"\n\t\t\t\t\t\tvalue={url}\n\t\t\t\t\t\tonChangeText={setUrl}\n\t\t\t\t\t/>\n\t\t\t\t</VariableTriggerArea>\n\t\t\t</FieldBlock>\n\n\t\t\t<FieldBlock>\n\t\t\t\t<TitleSmall color={COLORS.content.primary}>HTTP method</TitleSmall>\n\t\t\t\t<Dropdown\n\t\t\t\t\tdata-test=\"restapi-method\"\n\t\t\t\t\tsize=\"small\"\n\t\t\t\t\twidth=\"100%\"\n\t\t\t\t\tdropdownWidth=\"399px\"\n\t\t\t\t\toptions={METHOD_OPTIONS}\n\t\t\t\t\tdefaultOptions={[{ label: method, value: method }]}\n\t\t\t\t\tonSelect={(opt) => {\n\t\t\t\t\t\tconst v = unwrapDropdownValue(opt);\n\t\t\t\t\t\tif (v) {\n\t\t\t\t\t\t\tsetMethod(v as RestApiMethod);\n\t\t\t\t\t\t}\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t</FieldBlock>\n\n\t\t\t<FieldBlock>\n\t\t\t\t<TitleSmall color={COLORS.content.primary}>Headers</TitleSmall>\n\t\t\t\t{headers.map((h, i) => (\n\t\t\t\t\t// eslint-disable-next-line react/no-array-index-key\n\t\t\t\t\t<HeaderRow key={i} data-test={`restapi-header-${i}`}>\n\t\t\t\t\t\t<Input\n\t\t\t\t\t\t\tvariant=\"small\"\n\t\t\t\t\t\t\thideInputHeader\n\t\t\t\t\t\t\tplaceholder=\"Enter name\"\n\t\t\t\t\t\t\tvalue={h.key}\n\t\t\t\t\t\t\tonChangeText={(v) => patchHeader(i, { key: v })}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<VariableTriggerArea\n\t\t\t\t\t\t\tvariablesData={variablesData}\n\t\t\t\t\t\t\tonInsert={(token, caret) => {\n\t\t\t\t\t\t\t\tconst at = caret ?? h.value.length;\n\t\t\t\t\t\t\t\tpatchHeader(i, {\n\t\t\t\t\t\t\t\t\tvalue: `${h.value.slice(0, at)}${token}${h.value.slice(at)}`,\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\t\t<Input\n\t\t\t\t\t\t\t\tvariant=\"small\"\n\t\t\t\t\t\t\t\thideInputHeader\n\t\t\t\t\t\t\t\tplaceholder=\"Enter value\"\n\t\t\t\t\t\t\t\tvalue={h.value}\n\t\t\t\t\t\t\t\tonChangeText={(v) => patchHeader(i, { value: v })}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</VariableTriggerArea>\n\t\t\t\t\t\t<IconBtn\n\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\taria-label=\"Remove header\"\n\t\t\t\t\t\t\tdata-test={`restapi-header-remove-${i}`}\n\t\t\t\t\t\t\tonClick={() => removeHeader(i)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<DeleteIcon\n\t\t\t\t\t\t\t\twidth={16}\n\t\t\t\t\t\t\t\theight={16}\n\t\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</IconBtn>\n\t\t\t\t\t</HeaderRow>\n\t\t\t\t))}\n\t\t\t\t<AddHeaderRow>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tdata-test=\"restapi-add-header\"\n\t\t\t\t\t\tbuttonType=\"dashRegular\"\n\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\tLeadingIcon={PlusIcon}\n\t\t\t\t\t\tbuttonText=\"Add header\"\n\t\t\t\t\t\tonClick={addHeader}\n\t\t\t\t\t/>\n\t\t\t\t</AddHeaderRow>\n\t\t\t</FieldBlock>\n\n\t\t\t<FieldBlock>\n\t\t\t\t<TitleSmall color={COLORS.content.primary}>Request </TitleSmall>\n\t\t\t\t<VariableTriggerArea\n\t\t\t\t\tvariablesData={variablesData}\n\t\t\t\t\ttransformToken={jsonQuoteToken}\n\t\t\t\t\tonInsert={(token) =>\n\t\t\t\t\t\trequestEditorRef.current?.insertInlineContent(token)\n\t\t\t\t\t}\n\t\t\t\t>\n\t\t\t\t\t<BikEditor\n\t\t\t\t\t\tref={requestEditorRef}\n\t\t\t\t\t\tfeatures={{ jsonMode: true }}\n\t\t\t\t\t\tinitialContent={requestBody}\n\t\t\t\t\t\tstyle={JsonFieldBox}\n\t\t\t\t\t\tplaceholder=\"Type or paste JSON here\"\n\t\t\t\t\t\tonChange={(c) => setRequestBody(c.text)}\n\t\t\t\t\t\tminHeight=\"120px\"\n\t\t\t\t\t\tmaxHeight=\"240px\"\n\t\t\t\t\t/>\n\t\t\t\t</VariableTriggerArea>\n\t\t\t</FieldBlock>\n\n\t\t\t<FieldBlock>\n\t\t\t\t<TitleSmall color={COLORS.content.primary}>Response </TitleSmall>\n\t\t\t\t<VariableTriggerArea\n\t\t\t\t\tvariablesData={variablesData}\n\t\t\t\t\ttransformToken={jsonQuoteToken}\n\t\t\t\t\tonInsert={(token) =>\n\t\t\t\t\t\tresponseEditorRef.current?.insertInlineContent(token)\n\t\t\t\t\t}\n\t\t\t\t>\n\t\t\t\t\t<BikEditor\n\t\t\t\t\t\tref={responseEditorRef}\n\t\t\t\t\t\tfeatures={{ jsonMode: true }}\n\t\t\t\t\t\tstyle={JsonFieldBox}\n\t\t\t\t\t\tinitialContent={responseSample}\n\t\t\t\t\t\tplaceholder=\"Type or paste JSON here\"\n\t\t\t\t\t\tonChange={(c) => setResponseSample(c.text)}\n\t\t\t\t\t\tminHeight=\"120px\"\n\t\t\t\t\t\tmaxHeight=\"240px\"\n\t\t\t\t\t/>\n\t\t\t\t</VariableTriggerArea>\n\t\t\t</FieldBlock>\n\t\t</SideModal>\n\t);\n};\n\nconst HeaderRow = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n`;\n\nconst AddHeaderRow = styled.div`\n\tdisplay: flex;\n`;\n\nconst IconBtn = styled.button`\n\tdisplay: inline-flex;\n\talign-items: center;\n\tjustify-content: center;\n\tflex-shrink: 0;\n\twidth: 32px;\n\theight: 32px;\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 4px;\n\tbackground: ${COLORS.surface.standard};\n\tcursor: pointer;\n\n\t&:hover {\n\t\tborder-color: ${COLORS.content.secondary};\n\t}\n`;\n\nexport const JsonFieldBox = {\n\tborderRadius: '4px',\n\toverflow: 'hidden',\n};\n"],"names":["METHODS","METHOD_OPTIONS","m","jsonQuoteToken","token","ctx","RestApiToolPanel","onClose","onSave","initial","onImprove","charLimits","AGENT_CHAR_LIMITS","zIndex","existingNames","variablesData","name","setName","useState","requestEditorRef","useRef","responseEditorRef","instructions","setInstructions","url","setUrl","method","setMethod","headers","setHeaders","requestBody","setRequestBody","responseSample","setResponseSample","saving","setSaving","patchHeader","i","patch","prev","h","idx","addHeader","removeHeader","_","nameTrimmed","isDuplicateName","n","canSave","handleSave","config","result","jsxs","SideModal","jsx","DrawerHeaderText","DRAWER_HEADER_STYLE","DRAWER_BODY_STYLE","Input","ToolInstructionsField","FieldBlock","VariableTriggerArea","caret","u","at","TitleSmall","COLORS","Dropdown","opt","v","unwrapDropdownValue","HeaderRow","IconBtn","DeleteIcon","AddHeaderRow","Button","PlusIcon","BikEditor","JsonFieldBox","c","styled"],"mappings":"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"}
+{"version":3,"file":"RestApiToolPanel.js","sources":["../../../../../src/components/agent-builder/components/RestApiToolPanel.tsx"],"sourcesContent":["import DeleteIcon from '@src/assets/icons/delete.svg';\nimport PlusIcon from '@src/assets/icons/plus.svg';\nimport { BikEditor } from '@src/editor';\nimport React, { useState } from 'react';\nimport styled from 'styled-components';\nimport { Button } from '@src/components/button';\nimport { Dropdown, unwrapDropdownValue } from '@src/components/dropdown';\nimport { SingleOption } from '@src/components/dropdown/type';\nimport { Input } from '@src/components/input';\nimport { SideModal } from '@src/components/side-modal';\nimport { TitleSmall } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport type { VariableListInterfaceV3 } from '../../variable-picker-v3/model';\nimport {\n\tRestApiHeader,\n\tRestApiMethod,\n\tRestApiToolConfig,\n} from '../AgentBuilder.model';\nimport { FieldBlock } from '../AgentBuilder.styled';\nimport type { AgentCharLimits } from '../constants/charLimits';\nimport { AGENT_CHAR_LIMITS } from '../constants/charLimits';\nimport {\n\tDRAWER_BODY_STYLE,\n\tDRAWER_HEADER_STYLE,\n\tDrawerHeaderText,\n} from './DrawerHeaderText';\nimport { ToolInstructionsField } from './ToolInstructionsField';\nimport { VariableInlineField } from './VariableInlineField';\n\ninterface RestApiToolPanelProps {\n\tonClose: () => void;\n\t/** Persist the config. A pending promise shows the Save loader. */\n\tonSave: (config: RestApiToolConfig) => void | Promise<void>;\n\t/** Seed values when editing an existing tool. */\n\tinitial?: RestApiToolConfig;\n\t/** Optional \"Improve with AI\" for the instructions field. Omit to hide it. */\n\tonImprove?: (text: string) => Promise<string>;\n\tcharLimits?: AgentCharLimits;\n\t/** SideModal stacking order — raise it when opened over another drawer. */\n\tzIndex?: number;\n\t/** Names of the OTHER tools — a new tool can't reuse one of these. */\n\texistingNames?: string[];\n\t/**\n\t * Variable catalog for the `@` trigger. When non-empty, `@` opens the\n\t * variable picker directly in Instructions / Request URL / header values.\n\t * (Request / Response JSON editors are deliberately not wired for now.)\n\t * Absent → the drawer behaves exactly as before.\n\t */\n\tvariablesData?: VariableListInterfaceV3[];\n}\n\nconst METHODS: RestApiMethod[] = ['GET', 'POST', 'PUT', 'PATCH', 'DELETE'];\nconst METHOD_OPTIONS: SingleOption[] = METHODS.map((m) => ({\n\tlabel: m,\n\tvalue: m,\n}));\n\n/**\n * Keep the Request / Response bodies valid JSON: wrap the picked token in\n * quotes (`\"email\": \"{{variable:customer.email}}\"`) — unless the `@` was typed\n * inside a string literal already (odd number of unescaped `\"` before it, e.g.\n * `\"Bearer @`), where the bare token interpolates into the existing string.\n */\nexport const jsonQuoteToken = (\n\ttoken: string,\n\tctx: { textBefore: string },\n): string => {\n\tconst quotes = ctx.textBefore.match(/(?<!\\\\)\"/g)?.length ?? 0;\n\treturn quotes % 2 === 1 ? token : `\"${token}\"`;\n};\n\n/**\n * Right-side drawer to configure a \"Rest API\" tool: the endpoint the agent can\n * call, plus a JSON request-body template and a sample response. Mount it fresh\n * per open (key it) so `initial` seeds the state. Built on the shared `SideModal`\n * shell and the BikEditor JSON body mode for the Request / Response editors.\n */\nexport const RestApiToolPanel: React.FC<RestApiToolPanelProps> = ({\n\tonClose,\n\tonSave,\n\tinitial,\n\tonImprove,\n\tcharLimits = AGENT_CHAR_LIMITS,\n\tzIndex,\n\texistingNames = [],\n\tvariablesData,\n}) => {\n\tconst [name, setName] = useState(initial?.name ?? '');\n\tconst [instructions, setInstructions] = useState(initial?.instructions ?? '');\n\t// New tools start with the scheme pre-filled so the user only types the host.\n\tconst [url, setUrl] = useState(initial?.url ?? 'https://');\n\tconst [method, setMethod] = useState<RestApiMethod>(\n\t\tinitial?.method ?? 'POST',\n\t);\n\tconst [headers, setHeaders] = useState<RestApiHeader[]>(\n\t\tinitial?.headers ?? [{ key: '', value: '' }],\n\t);\n\tconst [requestBody, setRequestBody] = useState(initial?.requestBody ?? '');\n\tconst [responseSample, setResponseSample] = useState(\n\t\tinitial?.responseSample ?? '',\n\t);\n\tconst [saving, setSaving] = useState(false);\n\n\tconst patchHeader = (i: number, patch: Partial<RestApiHeader>) =>\n\t\tsetHeaders((prev) =>\n\t\t\tprev.map((h, idx) => (idx === i ? { ...h, ...patch } : h)),\n\t\t);\n\tconst addHeader = () =>\n\t\tsetHeaders((prev) => [...prev, { key: '', value: '' }]);\n\tconst removeHeader = (i: number) =>\n\t\tsetHeaders((prev) => prev.filter((_, idx) => idx !== i));\n\n\tconst nameTrimmed = name.trim();\n\t// Case-insensitive: two tools can't share a name (the LLM references them by it).\n\tconst isDuplicateName =\n\t\tnameTrimmed.length > 0 &&\n\t\texistingNames.some(\n\t\t\t(n) => n.trim().toLowerCase() === nameTrimmed.toLowerCase(),\n\t\t);\n\tconst canSave =\n\t\tnameTrimmed.length > 0 && url.trim().length > 0 && !isDuplicateName;\n\n\tconst handleSave = async () => {\n\t\tif (!canSave || saving) {\n\t\t\treturn;\n\t\t}\n\t\tconst config: RestApiToolConfig = {\n\t\t\tid: initial?.id ?? `restapi_${Date.now().toString(36)}`,\n\t\t\tname: name.trim(),\n\t\t\tinstructions,\n\t\t\turl: url.trim(),\n\t\t\tmethod,\n\t\t\t// Drop fully-empty header rows.\n\t\t\theaders: headers.filter((h) => h.key.trim() || h.value.trim()),\n\t\t\trequestBody,\n\t\t\tresponseSample,\n\t\t};\n\t\tconst result = onSave(config);\n\t\tif (result && typeof (result as Promise<void>).then === 'function') {\n\t\t\tsetSaving(true);\n\t\t\ttry {\n\t\t\t\tawait result;\n\t\t\t} finally {\n\t\t\t\tsetSaving(false);\n\t\t\t}\n\t\t}\n\t};\n\n\treturn (\n\t\t<SideModal\n\t\t\theader=\"Rest API\"\n\t\t\tcloseOnEscapeKey={false}\n\t\t\tzIndex={zIndex}\n\t\t\theaderCustomComponent={\n\t\t\t\t<DrawerHeaderText\n\t\t\t\t\ttitle=\"Rest API\"\n\t\t\t\t\tsubtitle=\"Connect to any API endpoint. Define the request and a sample response for the agent to reference.\"\n\t\t\t\t/>\n\t\t\t}\n\t\t\twidth=\"431px\"\n\t\t\theaderStyle={DRAWER_HEADER_STYLE}\n\t\t\tbodyStyle={DRAWER_BODY_STYLE}\n\t\t\tonClose={onClose}\n\t\t\tsaveButtonProps={{\n\t\t\t\t'data-test': 'restapi-save',\n\t\t\t\tbuttonText: 'Save',\n\t\t\t\tbuttonType: 'primary',\n\t\t\t\tsize: 'small',\n\t\t\t\tdisabled: !canSave,\n\t\t\t\tisLoading: saving,\n\t\t\t\tonClick: handleSave,\n\t\t\t}}\n\t\t\tcancelButtonProps={{\n\t\t\t\t'data-test': 'restapi-cancel',\n\t\t\t\tbuttonText: 'Cancel',\n\t\t\t\tbuttonType: 'tertiaryGray',\n\t\t\t\tsize: 'small',\n\t\t\t\tonClick: onClose,\n\t\t\t}}\n\t\t>\n\t\t\t<Input\n\t\t\t\tdata-test=\"restapi-name\"\n\t\t\t\tvariant=\"small\"\n\t\t\t\tlabelText=\"Name\"\n\t\t\t\tlabelTextBold\n\t\t\t\tplaceholder=\"Enter action name\"\n\t\t\t\tvalue={name}\n\t\t\t\tmaxCharLimit={charLimits.name}\n\t\t\t\tstate={isDuplicateName ? 'invalid' : undefined}\n\t\t\t\terrorMessage={\n\t\t\t\t\tisDuplicateName ? 'A tool with this name already exists' : undefined\n\t\t\t\t}\n\t\t\t\tonChangeText={setName}\n\t\t\t/>\n\n\t\t\t<ToolInstructionsField\n\t\t\t\tdata-test=\"restapi-instructions\"\n\t\t\t\tlabel=\"Instructions\"\n\t\t\t\tvalue={instructions}\n\t\t\t\tonChange={setInstructions}\n\t\t\t\tmaxLength={charLimits.instructions}\n\t\t\t\tplaceholder=\"Describe how should the LLM generate the rest API\"\n\t\t\t\tonImprove={onImprove}\n\t\t\t\tvariablesData={variablesData}\n\t\t\t/>\n\n\t\t\t<FieldBlock>\n\t\t\t\t<VariableInlineField\n\t\t\t\t\tdata-test=\"restapi-url\"\n\t\t\t\t\tlabel=\"Request URL\"\n\t\t\t\t\tplaceholder=\"https://\"\n\t\t\t\t\tvalue={url}\n\t\t\t\t\tonChange={setUrl}\n\t\t\t\t\tvariablesData={variablesData}\n\t\t\t\t/>\n\t\t\t</FieldBlock>\n\n\t\t\t<FieldBlock>\n\t\t\t\t<TitleSmall color={COLORS.content.primary}>HTTP method</TitleSmall>\n\t\t\t\t<Dropdown\n\t\t\t\t\tdata-test=\"restapi-method\"\n\t\t\t\t\tsize=\"small\"\n\t\t\t\t\twidth=\"100%\"\n\t\t\t\t\tdropdownWidth=\"399px\"\n\t\t\t\t\toptions={METHOD_OPTIONS}\n\t\t\t\t\tdefaultOptions={[{ label: method, value: method }]}\n\t\t\t\t\tonSelect={(opt) => {\n\t\t\t\t\t\tconst v = unwrapDropdownValue(opt);\n\t\t\t\t\t\tif (v) {\n\t\t\t\t\t\t\tsetMethod(v as RestApiMethod);\n\t\t\t\t\t\t}\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t</FieldBlock>\n\n\t\t\t<FieldBlock>\n\t\t\t\t<TitleSmall color={COLORS.content.primary}>Headers</TitleSmall>\n\t\t\t\t{headers.map((h, i) => (\n\t\t\t\t\t// Key includes the row count: the value field is an uncontrolled\n\t\t\t\t\t// editor, so add/remove must remount rows or a deleted row's text\n\t\t\t\t\t// would linger in its reused neighbour.\n\t\t\t\t\t// eslint-disable-next-line react/no-array-index-key\n\t\t\t\t\t<HeaderRow\n\t\t\t\t\t\tkey={`${i}:${headers.length}`}\n\t\t\t\t\t\tdata-test={`restapi-header-${i}`}\n\t\t\t\t\t>\n\t\t\t\t\t\t<Input\n\t\t\t\t\t\t\tvariant=\"small\"\n\t\t\t\t\t\t\thideInputHeader\n\t\t\t\t\t\t\tplaceholder=\"Enter name\"\n\t\t\t\t\t\t\tvalue={h.key}\n\t\t\t\t\t\t\tonChangeText={(v) => patchHeader(i, { key: v })}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<VariableInlineField\n\t\t\t\t\t\t\tplaceholder=\"Enter value\"\n\t\t\t\t\t\t\tvalue={h.value}\n\t\t\t\t\t\t\tonChange={(v) => patchHeader(i, { value: v })}\n\t\t\t\t\t\t\tvariablesData={variablesData}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<IconBtn\n\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\taria-label=\"Remove header\"\n\t\t\t\t\t\t\tdata-test={`restapi-header-remove-${i}`}\n\t\t\t\t\t\t\tonClick={() => removeHeader(i)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<DeleteIcon\n\t\t\t\t\t\t\t\twidth={16}\n\t\t\t\t\t\t\t\theight={16}\n\t\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</IconBtn>\n\t\t\t\t\t</HeaderRow>\n\t\t\t\t))}\n\t\t\t\t<AddHeaderRow>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tdata-test=\"restapi-add-header\"\n\t\t\t\t\t\tbuttonType=\"dashRegular\"\n\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\tLeadingIcon={PlusIcon}\n\t\t\t\t\t\tbuttonText=\"Add header\"\n\t\t\t\t\t\tonClick={addHeader}\n\t\t\t\t\t/>\n\t\t\t\t</AddHeaderRow>\n\t\t\t</FieldBlock>\n\n\t\t\t{/* Variables intentionally NOT wired here (yet) — the JSON editors are\n\t\t\t    plain code fields; @ types a literal @. */}\n\t\t\t<FieldBlock>\n\t\t\t\t<TitleSmall color={COLORS.content.primary}>Request </TitleSmall>\n\t\t\t\t<BikEditor\n\t\t\t\t\tfeatures={{ jsonMode: true }}\n\t\t\t\t\tinitialContent={requestBody}\n\t\t\t\t\tstyle={JsonFieldBox}\n\t\t\t\t\tplaceholder=\"Type or paste JSON here\"\n\t\t\t\t\tonChange={(c) => setRequestBody(c.text)}\n\t\t\t\t\tminHeight=\"120px\"\n\t\t\t\t\tmaxHeight=\"240px\"\n\t\t\t\t/>\n\t\t\t</FieldBlock>\n\n\t\t\t<FieldBlock>\n\t\t\t\t<TitleSmall color={COLORS.content.primary}>Response </TitleSmall>\n\t\t\t\t<BikEditor\n\t\t\t\t\tfeatures={{ jsonMode: true }}\n\t\t\t\t\tstyle={JsonFieldBox}\n\t\t\t\t\tinitialContent={responseSample}\n\t\t\t\t\tplaceholder=\"Type or paste JSON here\"\n\t\t\t\t\tonChange={(c) => setResponseSample(c.text)}\n\t\t\t\t\tminHeight=\"120px\"\n\t\t\t\t\tmaxHeight=\"240px\"\n\t\t\t\t/>\n\t\t\t</FieldBlock>\n\t\t</SideModal>\n\t);\n};\n\n// Fixed tracks (name / value / delete): minmax(0, …) lets the fields shrink\n// below their content width, so a long value scrolls inside its field and the\n// delete button can never be pushed off the row.\nconst HeaderRow = styled.div`\n\tdisplay: grid;\n\tgrid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr) 32px;\n\talign-items: center;\n\tgap: 8px;\n`;\n\nconst AddHeaderRow = styled.div`\n\tdisplay: flex;\n`;\n\nconst IconBtn = styled.button`\n\tdisplay: inline-flex;\n\talign-items: center;\n\tjustify-content: center;\n\tflex-shrink: 0;\n\twidth: 32px;\n\theight: 32px;\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 4px;\n\tbackground: ${COLORS.surface.standard};\n\tcursor: pointer;\n\n\t&:hover {\n\t\tborder-color: ${COLORS.content.secondary};\n\t}\n`;\n\nexport const JsonFieldBox = {\n\tborderRadius: '4px',\n\toverflow: 'hidden',\n};\n"],"names":["METHODS","METHOD_OPTIONS","m","RestApiToolPanel","onClose","onSave","initial","onImprove","charLimits","AGENT_CHAR_LIMITS","zIndex","existingNames","variablesData","name","setName","useState","instructions","setInstructions","url","setUrl","method","setMethod","headers","setHeaders","requestBody","setRequestBody","responseSample","setResponseSample","saving","setSaving","patchHeader","i","patch","prev","h","idx","addHeader","removeHeader","_","nameTrimmed","isDuplicateName","n","canSave","handleSave","config","result","jsxs","SideModal","jsx","DrawerHeaderText","DRAWER_HEADER_STYLE","DRAWER_BODY_STYLE","Input","ToolInstructionsField","FieldBlock","VariableInlineField","TitleSmall","COLORS","Dropdown","opt","v","unwrapDropdownValue","HeaderRow","IconBtn","DeleteIcon","AddHeaderRow","Button","PlusIcon","BikEditor","JsonFieldBox","c","styled"],"mappings":"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"}

package/dist/cjs/components/agent-builder/components/ToolInstructionsField.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),c=require("react"),q=require("styled-components"),I=require("../../TypographyStyle.js"),A=require("../../../constants/Theme.js"),a=require("../AgentBuilder.styled.js"),b=require("./MentionEditor.js"),v=require("../../button/Button.js"),B=require("../../../icons/BIK AI specific/WandSparkles.js"),E=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},F=E(q),w=({label:t,value:o,onChange:s,maxLength:d,placeholder:u,minHeight:p="120px",onImprove:i,variablesData:f,...n})=>{const[g,m]=c.useState(!1),[r,y]=c.useState(!1),[j,S]=c.useState(0),x=(f?.length??0)>0,T=async()=>{if(!(!i||r||o.trim().length===0)){y(!0);try{s(await i(o)),x&&S(l=>l+1)}finally{y(!1)}}},h=i?e.jsx(R,{children:e.jsx(v.Button,{"data-test":`${n["data-test"]??"tool"}-improve`,buttonType:"ai",size:"small",LeadingIcon:B.default,buttonText:"Improve with AI",isLoading:r,disabled:r||o.trim().length===0,onClick:T})}):void 0;return x?e.jsx(b.MentionEditor,{"data-test":n["data-test"],label:t,value:o,onChange:s,maxLength:d,placeholder:u,minHeight:p,resetKey:`improve-${j}`,mentionItems:[],tools:[],variablesData:f,action:h}):e.jsxs(a.FieldBlock,{children:[e.jsx(I.TitleSmall,{color:A.COLORS.content.primary,children:t}),e.jsxs(a.AiTextAreaShell,{focused:g,minHeight:p,children:[e.jsx(a.AiTextAreaInput,{"data-test":n["data-test"],value:o,placeholder:u,maxLength:d,onFocus:()=>m(!0),onBlur:()=>m(!1),onChange:l=>s(l.target.value)}),h]})]})},R=F.default.div`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),l=require("react"),q=require("styled-components"),I=require("../../TypographyStyle.js"),A=require("../../../constants/Theme.js"),c=require("../AgentBuilder.styled.js"),B=require("./MentionEditor.js"),b=require("../../button/Button.js"),v=require("../../../icons/BIK AI specific/WandSparkles.js"),E=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},F=E(q),w=({label:t,value:o,onChange:s,maxLength:d,placeholder:u,minHeight:p="120px",onImprove:i,variablesData:f,...n})=>{const[g,m]=l.useState(!1),[r,y]=l.useState(!1),[j,S]=l.useState(0),x=(f?.length??0)>0,T=async()=>{if(!(!i||r||o.trim().length===0)){y(!0);try{s(await i(o)),x&&S(a=>a+1)}finally{y(!1)}}},h=i?e.jsx(R,{children:e.jsx(b.Button,{"data-test":`${n["data-test"]??"tool"}-improve`,buttonType:"ai",size:"small",LeadingIcon:v.default,buttonText:"Improve with AI",isLoading:r,disabled:r||o.trim().length===0,onClick:T})}):void 0;return x?e.jsx(B.MentionEditor,{"data-test":n["data-test"],label:t,value:o,onChange:s,maxLength:d,placeholder:u,minHeight:p,resetKey:`improve-${j}`,mentionItems:[],tools:[],variablesData:f,addDataButton:!0,action:h}):e.jsxs(c.FieldBlock,{children:[e.jsx(I.TitleSmall,{color:A.COLORS.content.primary,children:t}),e.jsxs(c.AiTextAreaShell,{focused:g,minHeight:p,children:[e.jsx(c.AiTextAreaInput,{"data-test":n["data-test"],value:o,placeholder:u,maxLength:d,onFocus:()=>m(!0),onBlur:()=>m(!1),onChange:a=>s(a.target.value)}),h]})]})},R=F.default.div`
 	display: flex;
 	align-items: center;
 `;exports.ToolInstructionsField=w;

package/dist/cjs/components/agent-builder/components/ToolInstructionsField.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToolInstructionsField.js","sources":["../../../../../src/components/agent-builder/components/ToolInstructionsField.tsx"],"sourcesContent":["import { WandSparkles } from '@src/icons';\nimport React, { useState } from 'react';\nimport styled from 'styled-components';\nimport { Button } from '@src/components/button';\nimport { TitleSmall } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport type { VariableListInterfaceV3 } from '../../variable-picker-v3/model';\nimport {\n\tAiTextAreaInput,\n\tAiTextAreaShell,\n\tFieldBlock,\n} from '../AgentBuilder.styled';\nimport { MentionEditor } from './MentionEditor';\n\ninterface ToolInstructionsFieldProps {\n\tlabel: string;\n\tvalue: string;\n\tonChange: (value: string) => void;\n\tmaxLength: number;\n\tplaceholder?: string;\n\tminHeight?: string;\n\t/** \"Improve with AI\" — resolves with rewritten text. Omit to hide the button. */\n\tonImprove?: (text: string) => Promise<string>;\n\t/**\n\t * Variable catalog. When non-empty the field upgrades from a plain textarea\n\t * to a variables-only `@` mention editor: typing `@` opens the variable\n\t * categories directly (Variables is the sole category, so the picker skips\n\t * the Tools / Sub-agent root), and picks render as chips persisted as\n\t * `{{variable:<name>}}` tokens.\n\t */\n\tvariablesData?: VariableListInterfaceV3[];\n\t'data-test'?: string;\n}\n\n/**\n * A labelled multiline field with an inline \"Improve with AI\" action pinned to\n * the bottom-left of the box (Figma: Rest API / Handover-to-email drawers). The\n * button is hidden when `onImprove` is omitted.\n */\nexport const ToolInstructionsField: React.FC<ToolInstructionsFieldProps> = ({\n\tlabel,\n\tvalue,\n\tonChange,\n\tmaxLength,\n\tplaceholder,\n\tminHeight = '120px',\n\tonImprove,\n\tvariablesData,\n\t...rest\n}) => {\n\tconst [focused, setFocused] = useState(false);\n\tconst [improving, setImproving] = useState(false);\n\t// Bumped when \"Improve with AI\" replaces the text externally — the mention\n\t// editor only reads `value` on (re)mount, so it must be remounted.\n\tconst [editorEpoch, setEditorEpoch] = useState(0);\n\n\tconst withVariables = (variablesData?.length ?? 0) > 0;\n\n\tconst handleImprove = async () => {\n\t\tif (!onImprove || improving || value.trim().length === 0) {\n\t\t\treturn;\n\t\t}\n\t\tsetImproving(true);\n\t\ttry {\n\t\t\tonChange(await onImprove(value));\n\t\t\tif (withVariables) {\n\t\t\t\tsetEditorEpoch((e) => e + 1);\n\t\t\t}\n\t\t} finally {\n\t\t\tsetImproving(false);\n\t\t}\n\t};\n\n\tconst improveAction = onImprove ? (\n\t\t<ImproveRow>\n\t\t\t<Button\n\t\t\t\tdata-test={`${rest['data-test'] ?? 'tool'}-improve`}\n\t\t\t\tbuttonType=\"ai\"\n\t\t\t\tsize=\"small\"\n\t\t\t\tLeadingIcon={WandSparkles}\n\t\t\t\tbuttonText=\"Improve with AI\"\n\t\t\t\tisLoading={improving}\n\t\t\t\tdisabled={improving || value.trim().length === 0}\n\t\t\t\tonClick={handleImprove}\n\t\t\t/>\n\t\t</ImproveRow>\n\t) : undefined;\n\n\t// Variables enabled → the mention-editor variant. `mentionItems` / tool\n\t// hooks stay empty so Variables is the picker's ONLY category and `@` lands\n\t// straight in the variable list.\n\tif (withVariables) {\n\t\treturn (\n\t\t\t<MentionEditor\n\t\t\t\tdata-test={rest['data-test']}\n\t\t\t\tlabel={label}\n\t\t\t\tvalue={value}\n\t\t\t\tonChange={onChange}\n\t\t\t\tmaxLength={maxLength}\n\t\t\t\tplaceholder={placeholder}\n\t\t\t\tminHeight={minHeight}\n\t\t\t\tresetKey={`improve-${editorEpoch}`}\n\t\t\t\tmentionItems={[]}\n\t\t\t\ttools={[]}\n\t\t\t\tvariablesData={variablesData}\n\t\t\t\taction={improveAction}\n\t\t\t/>\n\t\t);\n\t}\n\n\treturn (\n\t\t<FieldBlock>\n\t\t\t<TitleSmall color={COLORS.content.primary}>{label}</TitleSmall>\n\t\t\t<AiTextAreaShell focused={focused} minHeight={minHeight}>\n\t\t\t\t<AiTextAreaInput\n\t\t\t\t\tdata-test={rest['data-test']}\n\t\t\t\t\tvalue={value}\n\t\t\t\t\tplaceholder={placeholder}\n\t\t\t\t\tmaxLength={maxLength}\n\t\t\t\t\tonFocus={() => setFocused(true)}\n\t\t\t\t\tonBlur={() => setFocused(false)}\n\t\t\t\t\tonChange={(e) => onChange(e.target.value)}\n\t\t\t\t/>\n\t\t\t\t{improveAction}\n\t\t\t</AiTextAreaShell>\n\t\t</FieldBlock>\n\t);\n};\n\nconst ImproveRow = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n`;\n"],"names":["ToolInstructionsField","label","value","onChange","maxLength","placeholder","minHeight","onImprove","variablesData","rest","focused","setFocused","useState","improving","setImproving","editorEpoch","setEditorEpoch","withVariables","handleImprove","e","improveAction","jsx","ImproveRow","Button","WandSparkles","MentionEditor","FieldBlock","TitleSmall","COLORS","jsxs","AiTextAreaShell","AiTextAreaInput","styled"],"mappings":"4dAuCaA,EAA8D,CAAC,CAC3E,MAAAC,EACA,MAAAC,EACA,SAAAC,EACA,UAAAC,EACA,YAAAC,EACA,UAAAC,EAAY,QACZ,UAAAC,EACA,cAAAC,EACA,GAAGC,CACJ,IAAM,CACL,KAAM,CAACC,EAASC,CAAU,EAAIC,EAAAA,SAAS,EAAK,EACtC,CAACC,EAAWC,CAAY,EAAIF,EAAAA,SAAS,EAAK,EAG1C,CAACG,EAAaC,CAAc,EAAIJ,EAAAA,SAAS,CAAC,EAE1CK,GAAiBT,GAAe,QAAU,GAAK,EAE/CU,EAAgB,SAAY,CACjC,GAAI,GAACX,GAAaM,GAAaX,EAAM,KAAA,EAAO,SAAW,GAGvD,CAAAY,EAAa,EAAI,EACjB,GAAI,CACHX,EAAS,MAAMI,EAAUL,CAAK,CAAC,EAC3Be,GACHD,EAAgBG,GAAMA,EAAI,CAAC,CAE7B,QAAA,CACCL,EAAa,EAAK,CACnB,EACD,EAEMM,EAAgBb,EACrBc,EAAAA,IAACC,EAAA,CACA,SAAAD,EAAAA,IAACE,EAAAA,OAAA,CACA,YAAW,GAAGd,EAAK,WAAW,GAAK,MAAM,WACzC,WAAW,KACX,KAAK,QACL,YAAae,EAAAA,QACb,WAAW,kBACX,UAAWX,EACX,SAAUA,GAAaX,EAAM,KAAA,EAAO,SAAW,EAC/C,QAASgB,CAAA,CAAA,EAEX,EACG,OAKJ,OAAID,EAEFI,EAAAA,IAACI,EAAAA,cAAA,CACA,YAAWhB,EAAK,WAAW,EAC3B,MAAAR,EACA,MAAAC,EACA,SAAAC,EACA,UAAAC,EACA,YAAAC,EACA,UAAAC,EACA,SAAU,WAAWS,CAAW,GAChC,aAAc,CAAA,EACd,MAAO,CAAA,EACP,cAAAP,EACA,OAAQY,CAAA,CAAA,SAMTM,aAAA,CACA,SAAA,CAAAL,MAACM,EAAAA,WAAA,CAAW,MAAOC,EAAAA,OAAO,QAAQ,QAAU,SAAA3B,EAAM,EAClD4B,EAAAA,KAACC,EAAAA,gBAAA,CAAgB,QAAApB,EAAkB,UAAAJ,EAClC,SAAA,CAAAe,EAAAA,IAACU,EAAAA,gBAAA,CACA,YAAWtB,EAAK,WAAW,EAC3B,MAAAP,EACA,YAAAG,EACA,UAAAD,EACA,QAAS,IAAMO,EAAW,EAAI,EAC9B,OAAQ,IAAMA,EAAW,EAAK,EAC9B,SAAWQ,GAAMhB,EAASgB,EAAE,OAAO,KAAK,CAAA,CAAA,EAExCC,CAAA,CAAA,CACF,CAAA,EACD,CAEF,EAEME,EAAaU,EAAAA,QAAO;AAAA;AAAA;AAAA"}
+{"version":3,"file":"ToolInstructionsField.js","sources":["../../../../../src/components/agent-builder/components/ToolInstructionsField.tsx"],"sourcesContent":["import { WandSparkles } from '@src/icons';\nimport React, { useState } from 'react';\nimport styled from 'styled-components';\nimport { Button } from '@src/components/button';\nimport { TitleSmall } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport type { VariableListInterfaceV3 } from '../../variable-picker-v3/model';\nimport {\n\tAiTextAreaInput,\n\tAiTextAreaShell,\n\tFieldBlock,\n} from '../AgentBuilder.styled';\nimport { MentionEditor } from './MentionEditor';\n\ninterface ToolInstructionsFieldProps {\n\tlabel: string;\n\tvalue: string;\n\tonChange: (value: string) => void;\n\tmaxLength: number;\n\tplaceholder?: string;\n\tminHeight?: string;\n\t/** \"Improve with AI\" — resolves with rewritten text. Omit to hide the button. */\n\tonImprove?: (text: string) => Promise<string>;\n\t/**\n\t * Variable catalog. When non-empty the field upgrades from a plain textarea\n\t * to a variables-only `@` mention editor: typing `@` opens the variable\n\t * categories directly (Variables is the sole category, so the picker skips\n\t * the Tools / Sub-agent root), and picks render as chips persisted as\n\t * `{{variable:<name>}}` tokens.\n\t */\n\tvariablesData?: VariableListInterfaceV3[];\n\t'data-test'?: string;\n}\n\n/**\n * A labelled multiline field with an inline \"Improve with AI\" action pinned to\n * the bottom-left of the box (Figma: Rest API / Handover-to-email drawers). The\n * button is hidden when `onImprove` is omitted.\n */\nexport const ToolInstructionsField: React.FC<ToolInstructionsFieldProps> = ({\n\tlabel,\n\tvalue,\n\tonChange,\n\tmaxLength,\n\tplaceholder,\n\tminHeight = '120px',\n\tonImprove,\n\tvariablesData,\n\t...rest\n}) => {\n\tconst [focused, setFocused] = useState(false);\n\tconst [improving, setImproving] = useState(false);\n\t// Bumped when \"Improve with AI\" replaces the text externally — the mention\n\t// editor only reads `value` on (re)mount, so it must be remounted.\n\tconst [editorEpoch, setEditorEpoch] = useState(0);\n\n\tconst withVariables = (variablesData?.length ?? 0) > 0;\n\n\tconst handleImprove = async () => {\n\t\tif (!onImprove || improving || value.trim().length === 0) {\n\t\t\treturn;\n\t\t}\n\t\tsetImproving(true);\n\t\ttry {\n\t\t\tonChange(await onImprove(value));\n\t\t\tif (withVariables) {\n\t\t\t\tsetEditorEpoch((e) => e + 1);\n\t\t\t}\n\t\t} finally {\n\t\t\tsetImproving(false);\n\t\t}\n\t};\n\n\tconst improveAction = onImprove ? (\n\t\t<ImproveRow>\n\t\t\t<Button\n\t\t\t\tdata-test={`${rest['data-test'] ?? 'tool'}-improve`}\n\t\t\t\tbuttonType=\"ai\"\n\t\t\t\tsize=\"small\"\n\t\t\t\tLeadingIcon={WandSparkles}\n\t\t\t\tbuttonText=\"Improve with AI\"\n\t\t\t\tisLoading={improving}\n\t\t\t\tdisabled={improving || value.trim().length === 0}\n\t\t\t\tonClick={handleImprove}\n\t\t\t/>\n\t\t</ImproveRow>\n\t) : undefined;\n\n\t// Variables enabled → the mention-editor variant. `mentionItems` / tool\n\t// hooks stay empty so Variables is the picker's ONLY category and `@` lands\n\t// straight in the variable list.\n\tif (withVariables) {\n\t\treturn (\n\t\t\t<MentionEditor\n\t\t\t\tdata-test={rest['data-test']}\n\t\t\t\tlabel={label}\n\t\t\t\tvalue={value}\n\t\t\t\tonChange={onChange}\n\t\t\t\tmaxLength={maxLength}\n\t\t\t\tplaceholder={placeholder}\n\t\t\t\tminHeight={minHeight}\n\t\t\t\tresetKey={`improve-${editorEpoch}`}\n\t\t\t\tmentionItems={[]}\n\t\t\t\ttools={[]}\n\t\t\t\tvariablesData={variablesData}\n\t\t\t\t// Drawers get the same focused-field \"+ Add data\" affordance as the\n\t\t\t\t// main Step-3 editors.\n\t\t\t\taddDataButton\n\t\t\t\taction={improveAction}\n\t\t\t/>\n\t\t);\n\t}\n\n\treturn (\n\t\t<FieldBlock>\n\t\t\t<TitleSmall color={COLORS.content.primary}>{label}</TitleSmall>\n\t\t\t<AiTextAreaShell focused={focused} minHeight={minHeight}>\n\t\t\t\t<AiTextAreaInput\n\t\t\t\t\tdata-test={rest['data-test']}\n\t\t\t\t\tvalue={value}\n\t\t\t\t\tplaceholder={placeholder}\n\t\t\t\t\tmaxLength={maxLength}\n\t\t\t\t\tonFocus={() => setFocused(true)}\n\t\t\t\t\tonBlur={() => setFocused(false)}\n\t\t\t\t\tonChange={(e) => onChange(e.target.value)}\n\t\t\t\t/>\n\t\t\t\t{improveAction}\n\t\t\t</AiTextAreaShell>\n\t\t</FieldBlock>\n\t);\n};\n\nconst ImproveRow = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n`;\n"],"names":["ToolInstructionsField","label","value","onChange","maxLength","placeholder","minHeight","onImprove","variablesData","rest","focused","setFocused","useState","improving","setImproving","editorEpoch","setEditorEpoch","withVariables","handleImprove","e","improveAction","jsx","ImproveRow","Button","WandSparkles","MentionEditor","FieldBlock","TitleSmall","COLORS","jsxs","AiTextAreaShell","AiTextAreaInput","styled"],"mappings":"4dAuCaA,EAA8D,CAAC,CAC3E,MAAAC,EACA,MAAAC,EACA,SAAAC,EACA,UAAAC,EACA,YAAAC,EACA,UAAAC,EAAY,QACZ,UAAAC,EACA,cAAAC,EACA,GAAGC,CACJ,IAAM,CACL,KAAM,CAACC,EAASC,CAAU,EAAIC,EAAAA,SAAS,EAAK,EACtC,CAACC,EAAWC,CAAY,EAAIF,EAAAA,SAAS,EAAK,EAG1C,CAACG,EAAaC,CAAc,EAAIJ,EAAAA,SAAS,CAAC,EAE1CK,GAAiBT,GAAe,QAAU,GAAK,EAE/CU,EAAgB,SAAY,CACjC,GAAI,GAACX,GAAaM,GAAaX,EAAM,KAAA,EAAO,SAAW,GAGvD,CAAAY,EAAa,EAAI,EACjB,GAAI,CACHX,EAAS,MAAMI,EAAUL,CAAK,CAAC,EAC3Be,GACHD,EAAgBG,GAAMA,EAAI,CAAC,CAE7B,QAAA,CACCL,EAAa,EAAK,CACnB,EACD,EAEMM,EAAgBb,EACrBc,EAAAA,IAACC,EAAA,CACA,SAAAD,EAAAA,IAACE,EAAAA,OAAA,CACA,YAAW,GAAGd,EAAK,WAAW,GAAK,MAAM,WACzC,WAAW,KACX,KAAK,QACL,YAAae,EAAAA,QACb,WAAW,kBACX,UAAWX,EACX,SAAUA,GAAaX,EAAM,KAAA,EAAO,SAAW,EAC/C,QAASgB,CAAA,CAAA,EAEX,EACG,OAKJ,OAAID,EAEFI,EAAAA,IAACI,EAAAA,cAAA,CACA,YAAWhB,EAAK,WAAW,EAC3B,MAAAR,EACA,MAAAC,EACA,SAAAC,EACA,UAAAC,EACA,YAAAC,EACA,UAAAC,EACA,SAAU,WAAWS,CAAW,GAChC,aAAc,CAAA,EACd,MAAO,CAAA,EACP,cAAAP,EAGA,cAAa,GACb,OAAQY,CAAA,CAAA,SAMTM,aAAA,CACA,SAAA,CAAAL,MAACM,EAAAA,WAAA,CAAW,MAAOC,EAAAA,OAAO,QAAQ,QAAU,SAAA3B,EAAM,EAClD4B,EAAAA,KAACC,EAAAA,gBAAA,CAAgB,QAAApB,EAAkB,UAAAJ,EAClC,SAAA,CAAAe,EAAAA,IAACU,EAAAA,gBAAA,CACA,YAAWtB,EAAK,WAAW,EAC3B,MAAAP,EACA,YAAAG,EACA,UAAAD,EACA,QAAS,IAAMO,EAAW,EAAI,EAC9B,OAAQ,IAAMA,EAAW,EAAK,EAC9B,SAAWQ,GAAMhB,EAASgB,EAAE,OAAO,KAAK,CAAA,CAAA,EAExCC,CAAA,CAAA,CACF,CAAA,EACD,CAEF,EAEME,EAAaU,EAAAA,QAAO;AAAA;AAAA;AAAA"}