@bikdotai/bik-component-library 0.0.850-tools-beta.0 → 0.0.850

package/dist/esm/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 } 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 {\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';\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}\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 * 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}) => {\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/>\n\n\t\t\t<FieldBlock>\n\t\t\t\t<Input\n\t\t\t\t\tdata-test=\"restapi-url\"\n\t\t\t\t\tvariant=\"small\"\n\t\t\t\t\tlabelText=\"Request URL\"\n\t\t\t\t\tlabelTextBold\n\t\t\t\t\tplaceholder=\"https://\"\n\t\t\t\t\ttype=\"url\"\n\t\t\t\t\tvalue={url}\n\t\t\t\t\tonChangeText={setUrl}\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// 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<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 value\"\n\t\t\t\t\t\t\tvalue={h.value}\n\t\t\t\t\t\t\tonChangeText={(v) => patchHeader(i, { value: v })}\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<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\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","RestApiToolPanel","onClose","onSave","initial","onImprove","charLimits","AGENT_CHAR_LIMITS","zIndex","existingNames","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","jsxs","SideModal","jsx","DrawerHeaderText","DRAWER_HEADER_STYLE","DRAWER_BODY_STYLE","config","result","Input","ToolInstructionsField","FieldBlock","TitleSmall","COLORS","Dropdown","opt","v","unwrapDropdownValue","HeaderRow","IconBtn","DeleteIcon","AddHeaderRow","Button","PlusIcon","BikEditor","JsonFieldBox","c","styled"],"mappings":";;;;;;;;;;;;;;;;;AA0CA,MAAMA,KAA2B,CAAC,OAAO,QAAQ,OAAO,SAAS,QAAQ,GACnEC,KAAiCD,GAAQ,IAAI,CAACE,OAAO;AAAA,EAC1D,OAAOA;AAAA,EACP,OAAOA;AACR,EAAE,GAQWC,KAAoD,CAAC;AAAA,EACjE,SAAAC;AAAA,EACA,QAAAC;AAAA,EACA,SAAAC;AAAA,EACA,WAAAC;AAAA,EACA,YAAAC,IAAaC;AAAA,EACb,QAAAC;AAAA,EACA,eAAAC,IAAgB,CAAA;AACjB,MAAM;AACL,QAAM,CAACC,GAAMC,CAAO,IAAIC,EAASR,GAAS,QAAQ,EAAE,GAC9C,CAACS,GAAcC,CAAe,IAAIF,EAASR,GAAS,gBAAgB,EAAE,GAEtE,CAACW,GAAKC,CAAM,IAAIJ,EAASR,GAAS,OAAO,UAAU,GACnD,CAACa,GAAQC,CAAS,IAAIN;AAAA,IAC3BR,GAAS,UAAU;AAAA,EAAA,GAEd,CAACe,GAASC,CAAU,IAAIR;AAAA,IAC7BR,GAAS,WAAW,CAAC,EAAE,KAAK,IAAI,OAAO,IAAI;AAAA,EAAA,GAEtC,CAACiB,GAAaC,CAAc,IAAIV,EAASR,GAAS,eAAe,EAAE,GACnE,CAACmB,GAAgBC,CAAiB,IAAIZ;AAAA,IAC3CR,GAAS,kBAAkB;AAAA,EAAA,GAEtB,CAACqB,GAAQC,CAAS,IAAId,EAAS,EAAK,GAEpCe,IAAc,CAACC,GAAWC,MAC/BT;AAAA,IAAW,CAACU,MACXA,EAAK,IAAI,CAACC,GAAGC,MAASA,MAAQJ,IAAI,EAAE,GAAGG,GAAG,GAAGF,EAAA,IAAUE,CAAE;AAAA,EAAA,GAErDE,IAAY,MACjBb,EAAW,CAACU,MAAS,CAAC,GAAGA,GAAM,EAAE,KAAK,IAAI,OAAO,GAAA,CAAI,CAAC,GACjDI,IAAe,CAACN,MACrBR,EAAW,CAACU,MAASA,EAAK,OAAO,CAACK,GAAGH,MAAQA,MAAQJ,CAAC,CAAC,GAElDQ,IAAc1B,EAAK,KAAA,GAEnB2B,IACLD,EAAY,SAAS,KACrB3B,EAAc;AAAA,IACb,CAAC6B,MAAMA,EAAE,KAAA,EAAO,YAAA,MAAkBF,EAAY,YAAA;AAAA,EAAY,GAEtDG,IACLH,EAAY,SAAS,KAAKrB,EAAI,OAAO,SAAS,KAAK,CAACsB;AA4BrD,SACC,gBAAAG;AAAA,IAACC;AAAA,IAAA;AAAA,MACA,QAAO;AAAA,MACP,kBAAkB;AAAA,MAClB,QAAAjC;AAAA,MACA,uBACC,gBAAAkC;AAAA,QAACC;AAAA,QAAA;AAAA,UACA,OAAM;AAAA,UACN,UAAS;AAAA,QAAA;AAAA,MAAA;AAAA,MAGX,OAAM;AAAA,MACN,aAAaC;AAAA,MACb,WAAWC;AAAA,MACX,SAAA3C;AAAA,MACA,iBAAiB;AAAA,QAChB,aAAa;AAAA,QACb,YAAY;AAAA,QACZ,YAAY;AAAA,QACZ,MAAM;AAAA,QACN,UAAU,CAACqC;AAAA,QACX,WAAWd;AAAA,QACX,SAhDgB,YAAY;AAC9B,cAAI,CAACc,KAAWd;AACf;AAED,gBAAMqB,IAA4B;AAAA,YACjC,IAAI1C,GAAS,MAAM,WAAW,KAAK,MAAM,SAAS,EAAE,CAAC;AAAA,YACrD,MAAMM,EAAK,KAAA;AAAA,YACX,cAAAG;AAAA,YACA,KAAKE,EAAI,KAAA;AAAA,YACT,QAAAE;AAAA;AAAA,YAEA,SAASE,EAAQ,OAAO,CAACY,MAAMA,EAAE,IAAI,UAAUA,EAAE,MAAM,KAAA,CAAM;AAAA,YAC7D,aAAAV;AAAA,YACA,gBAAAE;AAAA,UAAA,GAEKwB,IAAS5C,EAAO2C,CAAM;AAC5B,cAAIC,KAAU,OAAQA,EAAyB,QAAS,YAAY;AACnE,YAAArB,EAAU,EAAI;AACd,gBAAI;AACH,oBAAMqB;AAAA,YACP,UAAA;AACC,cAAArB,EAAU,EAAK;AAAA,YAChB;AAAA,UACD;AAAA,QACD;AAAA,MAwBY;AAAA,MAEV,mBAAmB;AAAA,QAClB,aAAa;AAAA,QACb,YAAY;AAAA,QACZ,YAAY;AAAA,QACZ,MAAM;AAAA,QACN,SAASxB;AAAA,MAAA;AAAA,MAGV,UAAA;AAAA,QAAA,gBAAAwC;AAAA,UAACM;AAAA,UAAA;AAAA,YACA,aAAU;AAAA,YACV,SAAQ;AAAA,YACR,WAAU;AAAA,YACV,eAAa;AAAA,YACb,aAAY;AAAA,YACZ,OAAOtC;AAAA,YACP,cAAcJ,EAAW;AAAA,YACzB,OAAO+B,IAAkB,YAAY;AAAA,YACrC,cACCA,IAAkB,yCAAyC;AAAA,YAE5D,cAAc1B;AAAA,UAAA;AAAA,QAAA;AAAA,QAGf,gBAAA+B;AAAA,UAACO;AAAA,UAAA;AAAA,YACA,aAAU;AAAA,YACV,OAAM;AAAA,YACN,OAAOpC;AAAA,YACP,UAAUC;AAAA,YACV,WAAWR,EAAW;AAAA,YACtB,aAAY;AAAA,YACZ,WAAAD;AAAA,UAAA;AAAA,QAAA;AAAA,0BAGA6C,GAAA,EACA,UAAA,gBAAAR;AAAA,UAACM;AAAA,UAAA;AAAA,YACA,aAAU;AAAA,YACV,SAAQ;AAAA,YACR,WAAU;AAAA,YACV,eAAa;AAAA,YACb,aAAY;AAAA,YACZ,MAAK;AAAA,YACL,OAAOjC;AAAA,YACP,cAAcC;AAAA,UAAA;AAAA,QAAA,GAEhB;AAAA,0BAECkC,GAAA,EACA,UAAA;AAAA,UAAA,gBAAAR,EAACS,GAAA,EAAW,OAAOC,EAAO,QAAQ,SAAS,UAAA,eAAW;AAAA,UACtD,gBAAAV;AAAA,YAACW;AAAA,YAAA;AAAA,cACA,aAAU;AAAA,cACV,MAAK;AAAA,cACL,OAAM;AAAA,cACN,eAAc;AAAA,cACd,SAAStD;AAAA,cACT,gBAAgB,CAAC,EAAE,OAAOkB,GAAQ,OAAOA,GAAQ;AAAA,cACjD,UAAU,CAACqC,MAAQ;AAClB,sBAAMC,IAAIC,EAAoBF,CAAG;AACjC,gBAAIC,KACHrC,EAAUqC,CAAkB;AAAA,cAE9B;AAAA,YAAA;AAAA,UAAA;AAAA,QACD,GACD;AAAA,0BAECL,GAAA,EACA,UAAA;AAAA,UAAA,gBAAAR,EAACS,GAAA,EAAW,OAAOC,EAAO,QAAQ,SAAS,UAAA,WAAO;AAAA,UACjDjC,EAAQ,IAAI,CAACY,GAAGH;AAAA;AAAA,YAEhB,gBAAAY,EAACiB,IAAA,EAAkB,aAAW,kBAAkB7B,CAAC,IAChD,UAAA;AAAA,cAAA,gBAAAc;AAAA,gBAACM;AAAA,gBAAA;AAAA,kBACA,SAAQ;AAAA,kBACR,iBAAe;AAAA,kBACf,aAAY;AAAA,kBACZ,OAAOjB,EAAE;AAAA,kBACT,cAAc,CAACwB,MAAM5B,EAAYC,GAAG,EAAE,KAAK2B,GAAG;AAAA,gBAAA;AAAA,cAAA;AAAA,cAE/C,gBAAAb;AAAA,gBAACM;AAAA,gBAAA;AAAA,kBACA,SAAQ;AAAA,kBACR,iBAAe;AAAA,kBACf,aAAY;AAAA,kBACZ,OAAOjB,EAAE;AAAA,kBACT,cAAc,CAACwB,MAAM5B,EAAYC,GAAG,EAAE,OAAO2B,GAAG;AAAA,gBAAA;AAAA,cAAA;AAAA,cAEjD,gBAAAb;AAAA,gBAACgB;AAAA,gBAAA;AAAA,kBACA,MAAK;AAAA,kBACL,cAAW;AAAA,kBACX,aAAW,yBAAyB9B,CAAC;AAAA,kBACrC,SAAS,MAAMM,EAAaN,CAAC;AAAA,kBAE7B,UAAA,gBAAAc;AAAA,oBAACiB;AAAAA,oBAAA;AAAA,sBACA,OAAO;AAAA,sBACP,QAAQ;AAAA,sBACR,OAAOP,EAAO,QAAQ;AAAA,oBAAA;AAAA,kBAAA;AAAA,gBACvB;AAAA,cAAA;AAAA,YACD,EAAA,GA1BexB,CA2BhB;AAAA,WACA;AAAA,4BACAgC,IAAA,EACA,UAAA,gBAAAlB;AAAA,YAACmB;AAAA,YAAA;AAAA,cACA,aAAU;AAAA,cACV,YAAW;AAAA,cACX,MAAK;AAAA,cACL,aAAaC;AAAAA,cACb,YAAW;AAAA,cACX,SAAS7B;AAAA,YAAA;AAAA,UAAA,EACV,CACD;AAAA,QAAA,GACD;AAAA,0BAECiB,GAAA,EACA,UAAA;AAAA,UAAA,gBAAAR,EAACS,GAAA,EAAW,OAAOC,EAAO,QAAQ,SAAS,UAAA,YAAQ;AAAA,UACnD,gBAAAV;AAAA,YAACqB;AAAA,YAAA;AAAA,cACA,UAAU,EAAE,UAAU,GAAA;AAAA,cACtB,gBAAgB1C;AAAA,cAChB,OAAO2C;AAAA,cACP,aAAY;AAAA,cACZ,UAAU,CAACC,MAAM3C,EAAe2C,EAAE,IAAI;AAAA,cACtC,WAAU;AAAA,cACV,WAAU;AAAA,YAAA;AAAA,UAAA;AAAA,QACX,GACD;AAAA,0BAECf,GAAA,EACA,UAAA;AAAA,UAAA,gBAAAR,EAACS,GAAA,EAAW,OAAOC,EAAO,QAAQ,SAAS,UAAA,aAAS;AAAA,UACpD,gBAAAV;AAAA,YAACqB;AAAA,YAAA;AAAA,cACA,UAAU,EAAE,UAAU,GAAA;AAAA,cACtB,OAAOC;AAAA,cACP,gBAAgBzC;AAAA,cAChB,aAAY;AAAA,cACZ,UAAU,CAAC0C,MAAMzC,EAAkByC,EAAE,IAAI;AAAA,cACzC,WAAU;AAAA,cACV,WAAU;AAAA,YAAA;AAAA,UAAA;AAAA,QACX,EAAA,CACD;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGH,GAEMR,KAAYS,EAAO;AAAA;AAAA;AAAA;AAAA,GAMnBN,KAAeM,EAAO;AAAA;AAAA,GAItBR,KAAUQ,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qBAOFd,EAAO,OAAO,OAAO;AAAA;AAAA,eAE3BA,EAAO,QAAQ,QAAQ;AAAA;AAAA;AAAA;AAAA,kBAIpBA,EAAO,QAAQ,SAAS;AAAA;AAAA,GAI7BY,IAAe;AAAA,EAC3B,cAAc;AAAA,EACd,UAAU;AACX;"}
+{"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 {\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';\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}\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// A callable endpoint needs an http(s) scheme AND a host — this rejects the\n// pre-filled bare \"https://\" (and any scheme-only / malformed value).\nconst isValidHttpUrl = (value: string): boolean => {\n\ttry {\n\t\tconst parsed = new URL(value);\n\t\treturn (\n\t\t\t(parsed.protocol === 'http:' || parsed.protocol === 'https:') &&\n\t\t\tparsed.hostname.length > 0\n\t\t);\n\t} catch {\n\t\treturn false;\n\t}\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}) => {\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 urlTrimmed = url.trim();\n\t// Save needs a real endpoint, but don't flash the error while the field still\n\t// holds its pristine \"https://\" seed — only once the user has typed past it.\n\tconst isUrlInvalid =\n\t\turlTrimmed.length > 0 &&\n\t\turlTrimmed !== 'https://' &&\n\t\t!isValidHttpUrl(urlTrimmed);\n\tconst canSave =\n\t\tnameTrimmed.length > 0 && isValidHttpUrl(urlTrimmed) && !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/>\n\n\t\t\t<FieldBlock>\n\t\t\t\t<Input\n\t\t\t\t\tdata-test=\"restapi-url\"\n\t\t\t\t\tvariant=\"small\"\n\t\t\t\t\tlabelText=\"Request URL\"\n\t\t\t\t\tlabelTextBold\n\t\t\t\t\tplaceholder=\"https://\"\n\t\t\t\t\ttype=\"url\"\n\t\t\t\t\tvalue={url}\n\t\t\t\t\tstate={isUrlInvalid ? 'invalid' : undefined}\n\t\t\t\t\terrorMessage={\n\t\t\t\t\t\tisUrlInvalid ? 'Enter a valid URL (including https://)' : undefined\n\t\t\t\t\t}\n\t\t\t\t\tonChangeText={setUrl}\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// 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<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 value\"\n\t\t\t\t\t\t\tvalue={h.value}\n\t\t\t\t\t\t\tonChangeText={(v) => patchHeader(i, { value: v })}\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<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\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","isValidHttpUrl","value","parsed","RestApiToolPanel","onClose","onSave","initial","onImprove","charLimits","AGENT_CHAR_LIMITS","zIndex","existingNames","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","urlTrimmed","isUrlInvalid","canSave","jsxs","SideModal","jsx","DrawerHeaderText","DRAWER_HEADER_STYLE","DRAWER_BODY_STYLE","config","result","Input","ToolInstructionsField","FieldBlock","TitleSmall","COLORS","Dropdown","opt","v","unwrapDropdownValue","HeaderRow","IconBtn","DeleteIcon","AddHeaderRow","Button","PlusIcon","BikEditor","JsonFieldBox","c","styled"],"mappings":"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"}

package/dist/esm/components/agent-builder/components/SelectableListSection.js

@@ -1,96 +1,105 @@
-import { jsx as n, jsxs as d, Fragment as U } from "react/jsx-runtime";
+import { jsx as n, jsxs as i, Fragment as J } from "react/jsx-runtime";
 import ie from "../../../assets/icons/delete.svg.js";
 import de from "../../../assets/icons/edit.svg.js";
-import J from "../../../assets/icons/plus.svg.js";
-import { useState as m, useRef as Q, useEffect as se } from "react";
-import I from "styled-components";
+import Q from "../../../assets/icons/plus.svg.js";
+import { useState as m, useRef as U, useEffect as se } from "react";
+import R from "styled-components";
 import { TitleSmall as ae, BodyCaption as $, BodySecondary as A } from "../../TypographyStyle.js";
-import { COLORS as i } from "../../../constants/Theme.js";
-import { SideSection as ue, SideSectionHeader as he, AddIconButton as fe, SourceButtonRow as pe, SourceButton as X, SelectableRow as me, RowText as Se, RowActions as ye, RowMenuButton as Y, RowActionDivider as be } from "../AgentBuilder.styled.js";
-import { renderSourceIcon as R, SOURCE_ICONS as ve } from "../utils/sourceIcons.js";
+import { COLORS as d } from "../../../constants/Theme.js";
+import { SideSection as ue, SideSectionHeader as he, AddIconButton as fe, SourceButtonRow as pe, SourceButton as X, SelectableRow as me, RowLabel as Se, RowText as be, RowActions as ve, RowMenuButton as Y, RowActionDivider as ye } from "../AgentBuilder.styled.js";
+import { renderSourceIcon as I, sourceIcon as we } from "../utils/sourceIcons.js";
 import { MentionPicker as $e } from "./MentionPicker.js";
 import { Dropdown as Z } from "../../dropdown/Dropdown.js";
 import { unwrapDropdownValue as P } from "../../dropdown/utils.js";
 import { Button as ge } from "../../button/Button.js";
-import { DeleteConfirmationModal as we } from "../../states-modal/DeleteConfirmationModal.js";
+import { DeleteConfirmationModal as Ce } from "../../states-modal/DeleteConfirmationModal.js";
 import { Tooltip as g } from "../../tooltips/Tooltip.js";
-import Ce from "../../../icons/Informational/Common UI/Shield.js";
-const G = "__bik_create_new__", Ve = ({
+import ke from "../../../icons/Informational/Common UI/Shield.js";
+const G = "__bik_create_new__", Je = ({
   title: s,
-  helper: _,
+  helper: D,
   items: u,
   addableOptions: S,
-  onAdd: w,
-  onRemove: D,
-  dataTestPrefix: t,
+  onAdd: b,
+  onRemove: _,
+  dataTestPrefix: l,
   emptyText: O,
-  createOption: l,
-  onConfigure: B,
+  createOption: r,
+  onConfigure: L,
   sourceGroups: h,
-  mentionItems: L,
-  actionSources: y,
+  mentionItems: B,
+  actionSources: v,
   confirmDelete: p,
   pickerOpensUp: z
 }) => {
-  const [f, r] = m(!1), [x, C] = m(null), [H, M] = m(null), [ee, k] = m(null), b = !!h && h.length > 0, E = h?.find((e) => e.source === ee), c = L !== void 0, j = Q(null), q = Q(null), [v, N] = m(null);
+  const [f, t] = m(!1), [x, C] = m(null), [H, M] = m(null), [ee, k] = m(null), y = !!h && h.length > 0, E = h?.find((e) => e.source === ee), c = B !== void 0, j = U(null), q = U(null), [w, W] = m(null);
   se(() => {
     if (!c || !f)
       return;
     const e = (a) => {
       const V = a.target;
-      !j.current?.contains(V) && !q.current?.contains(V) && r(!1);
+      !j.current?.contains(V) && !q.current?.contains(V) && t(!1);
     }, o = (a) => {
-      a.key === "Escape" && r(!1);
+      a.key === "Escape" && t(!1);
     };
     return document.addEventListener("mousedown", e), document.addEventListener("keydown", o), () => {
       document.removeEventListener("mousedown", e), document.removeEventListener("keydown", o);
     };
   }, [c, f]);
-  const ne = b ? c || u.length > 0 : c || S.length > 0 || !!l && u.length > 0, oe = u.length === 0 && !!l && !b && !c, W = !!y && y.length > 0, te = (b || W) && u.length === 0, le = () => {
+  const ne = y ? c || u.length > 0 : c || S.length > 0 || !!r && u.length > 0, oe = u.length === 0 && !!r && !y && !c, F = !!v && v.length > 0, te = (y || F) && u.length === 0, le = () => {
     if (c) {
-      N(null), r((e) => !e);
+      W(null), t((e) => !e);
       return;
     }
-    if (b) {
-      k(null), r((e) => !e);
+    if (y) {
+      k(null), t((e) => !e);
       return;
     }
-    if (S.length === 0 && l) {
-      l.onSelect();
+    if (S.length === 0 && r) {
+      r.onSelect();
       return;
     }
-    r((e) => !e);
+    t((e) => !e);
   }, re = (e, o) => {
     if (H)
       return;
     const a = o();
     a && typeof a.then == "function" && (M(e), a.finally(() => M(null)));
   }, ce = () => u.map((e) => {
-    const o = e.onConfigure ?? (B ? () => B(e.id) : void 0);
-    return /* @__PURE__ */ d(
+    const o = e.onConfigure ?? (L ? () => L(e.id) : void 0);
+    return /* @__PURE__ */ i(
       me,
       {
-        "data-test": `${t}-row-${e.id}`,
+        "data-test": `${l}-row-${e.id}`,
         children: [
-          R(e.icon),
-          e.authRequired && // Order tools touch customer-private data — the shield flags that
-          // this agent must verify the customer before the tool can run.
-          /* @__PURE__ */ n(g, { body: "Requires customer verification", placement: "top", children: /* @__PURE__ */ n(
-            "span",
-            {
-              "data-test": `${t}-auth-${e.id}`,
-              style: { display: "inline-flex", flexShrink: 0 },
-              children: /* @__PURE__ */ n(Ce, { size: 16 })
-            }
-          ) }),
-          /* @__PURE__ */ n(g, { body: e.label, placement: "top", children: /* @__PURE__ */ n(Se, { children: /* @__PURE__ */ n(A, { numberOfLines: 1, color: i.content.primary, children: e.label }) }) }),
-          /* @__PURE__ */ d(ye, { children: [
+          I(e.icon),
+          /* @__PURE__ */ i(Se, { children: [
+            /* @__PURE__ */ n(g, { body: e.label, placement: "top", children: /* @__PURE__ */ n(be, { children: /* @__PURE__ */ n(A, { numberOfLines: 1, color: d.content.primary, children: e.label }) }) }),
+            e.authRequired && // Order tools touch customer-private data — the shield flags that
+            // this agent must verify the customer before the tool can run.
+            /* @__PURE__ */ n(
+              g,
+              {
+                body: "This tool requires customer verification",
+                placement: "top",
+                children: /* @__PURE__ */ n(
+                  "span",
+                  {
+                    "data-test": `${l}-auth-${e.id}`,
+                    style: { display: "inline-flex", flexShrink: 0 },
+                    children: /* @__PURE__ */ n(ke, { size: 16 })
+                  }
+                )
+              }
+            )
+          ] }),
+          /* @__PURE__ */ i(ve, { children: [
             o && // Configurable rows (sub-agents, Rest API / email tools) get an
             // always-visible edit icon.
             /* @__PURE__ */ n(g, { body: "Edit", placement: "top", children: /* @__PURE__ */ n(
               Y,
               {
-                "data-test": `${t}-edit-${e.id}`,
+                "data-test": `${l}-edit-${e.id}`,
                 "aria-label": `Edit ${e.label}`,
                 disabled: H !== null,
                 onClick: () => re(e.id, o),
@@ -99,24 +108,24 @@ const G = "__bik_create_new__", Ve = ({
                   {
                     width: 16,
                     height: 16,
-                    color: i.content.secondary
+                    color: d.content.secondary
                   }
                 )
               }
             ) }),
-            o && /* @__PURE__ */ n(be, { "aria-hidden": !0 }),
+            o && /* @__PURE__ */ n(ye, { "aria-hidden": !0 }),
             /* @__PURE__ */ n(g, { body: "Delete", placement: "top", children: /* @__PURE__ */ n(
               Y,
               {
-                "data-test": `${t}-delete-${e.id}`,
+                "data-test": `${l}-delete-${e.id}`,
                 "aria-label": `Delete ${e.label}`,
-                onClick: () => p ? C(e.id) : D(e.id),
+                onClick: () => p ? C(e.id) : _(e.id),
                 children: /* @__PURE__ */ n(
                   ie,
                   {
                     width: 16,
                     height: 16,
-                    color: i.content.secondary
+                    color: d.content.secondary
                   }
                 )
               }
@@ -126,140 +135,147 @@ const G = "__bik_create_new__", Ve = ({
       },
       e.id
     );
-  }), F = l ? [
+  }), K = r ? [
     ...S,
     {
-      label: l.label,
+      label: r.label,
       value: G,
-      searchKey: l.label,
+      searchKey: r.label,
       customComponent: /* @__PURE__ */ n(
         "div",
         {
           style: {
             width: "100%",
             textAlign: "center",
-            color: i.content.brand,
+            color: d.content.brand,
             fontFamily: "Inter",
             fontSize: 14,
             fontWeight: 600
           },
-          children: l.label
+          children: r.label
         }
       )
     }
-  ] : S, K = c ? /* @__PURE__ */ n(
+  ] : S, N = c ? /* @__PURE__ */ n(
     $e,
     {
-      items: L ?? [],
+      items: B ?? [],
       query: "",
       activeIndex: 0,
-      initialSource: v ?? void 0,
+      initialSource: w ?? void 0,
       onSelect: (e) => {
-        r(!1), w(String(e.id));
+        t(!1), b(String(e.id));
       },
-      onClose: () => r(!1),
-      onCreateSubAgent: l ? () => {
-        r(!1), l.onSelect();
+      onClose: () => t(!1),
+      onCreateSubAgent: r ? () => {
+        t(!1), r.onSelect();
       } : void 0,
-      toolActions: W ? y?.map((e) => ({
+      toolActions: F ? v?.map((e) => ({
         ...e,
         onSelect: () => {
-          r(!1), e.onSelect();
+          t(!1), e.onSelect();
         }
       })) : void 0,
       integrationStatus: Object.fromEntries(
         (h ?? []).filter((e) => e.connected !== void 0).map((e) => [e.source, e.connected])
       ),
       onConnectIntegration: (e) => {
-        r(!1), h?.find((o) => o.source === e)?.onConnect?.();
+        t(!1), h?.find((o) => o.source === e)?.onConnect?.();
       }
     },
-    v ?? "__root__"
+    w ?? "__root__"
   ) : null;
-  return /* @__PURE__ */ d(ue, { children: [
-    /* @__PURE__ */ d(he, { children: [
-      /* @__PURE__ */ n(ae, { color: i.content.primary, children: s }),
-      ne && /* @__PURE__ */ d(ke, { ref: j, children: [
+  return /* @__PURE__ */ i(ue, { children: [
+    /* @__PURE__ */ i(he, { children: [
+      /* @__PURE__ */ n(ae, { color: d.content.primary, children: s }),
+      ne && /* @__PURE__ */ i(Ee, { ref: j, children: [
         /* @__PURE__ */ n(
           fe,
           {
-            "data-test": `${t}-add`,
+            "data-test": `${l}-add`,
             onClick: le,
             "aria-label": `Add ${s}`,
-            children: /* @__PURE__ */ n(J, { width: 16, height: 16, color: i.content.primary })
+            children: /* @__PURE__ */ n(Q, { width: 16, height: 16, color: d.content.primary })
           }
         ),
-        c && f && v === null && /* @__PURE__ */ n(
+        c && f && w === null && /* @__PURE__ */ n(
           T,
           {
             $up: z,
-            "data-test": `${t}-picker`,
-            children: K
+            "data-test": `${l}-picker`,
+            children: N
           }
         )
       ] })
     ] }),
-    _ && /* @__PURE__ */ n($, { color: i.content.secondary, children: _ }),
-    te ? /* @__PURE__ */ d(Ee, { ref: c ? q : void 0, children: [
-      /* @__PURE__ */ d(pe, { "data-test": `${t}-sources`, children: [
-        h?.map((e) => /* @__PURE__ */ d(
-          X,
-          {
-            type: "button",
-            "data-test": `${t}-source-${e.source}`,
-            onClick: () => {
-              if (e.connected === !1) {
-                e.onConnect?.();
-                return;
-              }
-              if (c) {
-                N(e.source), r(!0);
-                return;
-              }
-              k(e.source);
+    D && /* @__PURE__ */ n($, { color: d.content.secondary, children: D }),
+    te ? /* @__PURE__ */ i(Ae, { ref: c ? q : void 0, children: [
+      /* @__PURE__ */ i(pe, { "data-test": `${l}-sources`, children: [
+        h?.map((e) => {
+          const o = e.connected !== !1 && e.options.length === 1 ? e.options[0] : void 0;
+          return /* @__PURE__ */ i(
+            X,
+            {
+              type: "button",
+              "data-test": `${l}-source-${e.source}`,
+              onClick: () => {
+                if (e.connected === !1) {
+                  e.onConnect?.();
+                  return;
+                }
+                if (o) {
+                  t(!1), b(o.value);
+                  return;
+                }
+                if (c) {
+                  W(e.source), t(!0);
+                  return;
+                }
+                k(e.source);
+              },
+              children: [
+                I(we(e.source), -4),
+                /* @__PURE__ */ n($, { color: d.content.primary, children: o ? o.label : e.label }),
+                e.connected === !1 && // Not connected → show "Connect" upfront (consistent with
+                // the `@` picker); clicking runs the connect flow.
+                /* @__PURE__ */ n(A, { color: d.content.brand, children: "Connect" })
+              ]
             },
-            children: [
-              R(ve[e.source], -4),
-              /* @__PURE__ */ n($, { color: i.content.primary, children: e.label }),
-              e.connected === !1 && // Not connected → show "Connect" upfront (consistent with
-              // the `@` picker); clicking runs the connect flow.
-              /* @__PURE__ */ n(A, { color: i.content.brand, children: "Connect" })
-            ]
-          },
-          e.source
-        )),
-        y?.map((e) => /* @__PURE__ */ d(
+            e.source
+          );
+        }),
+        v?.map((e) => /* @__PURE__ */ i(
           X,
           {
             type: "button",
-            "data-test": `${t}-action-${e.source}`,
+            "data-test": `${l}-action-${e.source}`,
             onClick: e.connected === !1 ? () => e.onConnect?.() : () => {
-              r(!1), e.onSelect();
+              t(!1), e.onSelect();
             },
             children: [
-              R(e.icon, -4),
-              /* @__PURE__ */ n($, { color: i.content.primary, children: e.label }),
+              I(e.icon, -4),
+              /* @__PURE__ */ n($, { color: d.content.primary, children: e.label }),
               e.connected === !1 && // Not connected → "Connect" upfront (consistent with the
               // source buttons and the `@` picker).
-              /* @__PURE__ */ n(A, { color: i.content.brand, children: "Connect" })
+              /* @__PURE__ */ n(A, { color: d.content.brand, children: "Connect" })
             ]
           },
           e.source
         ))
       ] }),
-      c && f && v !== null && /* @__PURE__ */ n(
+      c && f && w !== null && /* @__PURE__ */ n(
         T,
         {
           $align: "left",
           $up: z,
-          "data-test": `${t}-picker`,
-          children: K
+          "data-test": `${l}-picker`,
+          children: N
         }
       ),
       !c && E && /* @__PURE__ */ n(
         Z,
         {
-          "data-test": `${t}-dropdown`,
+          "data-test": `${l}-dropdown`,
           size: "small",
           width: "100%",
           isSearchable: !0,
@@ -267,72 +283,72 @@ const G = "__bik_create_new__", Ve = ({
           options: E.options,
           onSelect: (e) => {
             const o = P(e);
-            k(null), r(!1), o && w(o);
+            k(null), t(!1), o && b(o);
           }
         }
       )
-    ] }) : /* @__PURE__ */ d(U, { children: [
-      !c && f && F.length > 0 && /* @__PURE__ */ n(
+    ] }) : /* @__PURE__ */ i(J, { children: [
+      !c && f && K.length > 0 && /* @__PURE__ */ n(
         Z,
         {
-          "data-test": `${t}-dropdown`,
+          "data-test": `${l}-dropdown`,
           size: "small",
           width: "100%",
           isSearchable: !0,
           placeHolder: `Select ${s.toLowerCase()}`,
-          options: F,
+          options: K,
           onSelect: (e) => {
             const o = P(e);
-            r(!1), o && (o === G ? l?.onSelect() : w(o));
+            t(!1), o && (o === G ? r?.onSelect() : b(o));
           }
         }
       ),
-      u.length === 0 && !f ? /* @__PURE__ */ d(U, { children: [
-        /* @__PURE__ */ n($, { color: i.content.placeholder, children: O }),
-        oe && l && /* @__PURE__ */ n(
+      u.length === 0 && !f ? /* @__PURE__ */ i(J, { children: [
+        /* @__PURE__ */ n($, { color: d.content.placeholder, children: O }),
+        oe && r && /* @__PURE__ */ n(
           ge,
           {
-            "data-test": `${t}-create`,
+            "data-test": `${l}-create`,
             buttonType: "secondary",
             size: "small",
             matchParentWidth: !0,
-            LeadingIcon: J,
-            buttonText: l.label,
-            onClick: l.onSelect
+            LeadingIcon: Q,
+            buttonText: r.label,
+            onClick: r.onSelect
           }
         )
       ] }) : ce()
     ] }),
     p && x && /* @__PURE__ */ n(
-      we,
+      Ce,
       {
-        "data-test": `${t}-delete-confirm`,
+        "data-test": `${l}-delete-confirm`,
         header: `Delete this ${p.noun}?`,
         subHeader: `Deleting this ${p.noun} will also remove it from your instructions, wherever it's referenced.`,
         confirmationText: "Delete",
         zIndex: p.zIndex,
         onDeleteConfirmed: () => {
-          D(x), C(null);
+          _(x), C(null);
         },
         onCancelClicked: () => C(null)
       }
     )
   ] });
-}, ke = I.div`
+}, Ee = R.div`
 	position: relative;
 	display: flex;
-`, Ee = I.div`
+`, Ae = R.div`
 	position: relative;
 	display: flex;
 	flex-direction: column;
 	gap: 8px;
-`, T = I.div`
+`, T = R.div`
 	position: absolute;
 	${(s) => s.$up ? "bottom: calc(100% + 4px);" : "top: calc(100% + 4px);"}
 	${(s) => s.$align === "left" ? "left: 0;" : "right: 0;"}
 	z-index: 30;
 `;
 export {
-  Ve as SelectableListSection
+  Je as SelectableListSection
 };
 //# sourceMappingURL=SelectableListSection.js.map