npm - @bikdotai/bik-component-library - Versions diffs - 0.0.831-beta.1 → 0.0.831-beta.3 - Mend

@bikdotai/bik-component-library 0.0.831-beta.1 → 0.0.831-beta.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (74) hide show

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

	@@ -1 +1 @@
1	- {"version":3,"file":"MentionPicker.js","sources":["../../../../../src/components/agent-builder/components/MentionPicker.tsx"],"sourcesContent":["// import ChevronLeft from '@src/assets/icons/chevronLeft.svg';\nimport ChevronRight from '@src/assets/icons/chevronRight.svg';\nimport SearchIcon from '@src/assets/icons/searchIcon.svg';\nimport type { MentionDropdownRenderProps, MentionItem } from '@src/editor';\nimport SvgArrowLeft from '@src/icons/Arrows/Normal arrows/ArrowLeft';\nimport React, { useEffect, useMemo, useRef, useState } from 'react';\nimport styled from 'styled-components';\nimport { BodySecondary, TitleSmall } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport { CATEGORIES } from '../constants/tools';\nimport type { Category, ToolAction } from '../constants/tools';\nimport {\n\tMentionKindMeta,\n\ttoolSourceLabel,\n} from '../utils/mentionSerialization';\nimport { renderSourceIcon, sourceIcon, SourceIcon } from '../utils/sourceIcons';\n\nconst metaOf = (item: MentionItem): MentionKindMeta \| undefined =>\n\titem.meta as unknown as MentionKindMeta \| undefined;\n\nconst rowLabel = (item: MentionItem): string =>\n\tmetaOf(item)?.plainLabel ?? item.label;\n\n/** One navigable row in the picker's current view. /\ntype PickerRowModel = {\n\tid: string;\n\tlabel: string;\n\t/* Drill-in rows show a chevron; leaf (selectable) rows do not. /\n\tdrillsIn: boolean;\n\t/* Leading brand glyph (source rows only). /\n\ticon?: SourceIcon;\n\t/* Brand-coloured \"Create new\" action row (not a selectable item). /\n\tisCreate?: boolean;\n\tonActivate: () => void;\n};\n\n/* Sentinel id for the sub-agent \"Create new\" row. /\nconst CREATE_SUBAGENT_ID = '__bik_create_subagent__';\n\ntype MentionPickerProps = MentionDropdownRenderProps & {\n\t/* Opens the create-sub-agent drawer (shows a \"Create new\" row in the Sub-agent view). /\n\tonCreateSubAgent?: () => void;\n\t/\n\t Open already drilled into this tool source (e.g. `'shopify'`) — its tool list\n\t * is shown immediately. /\n\tinitialSource?: string;\n\t/\n\t Built-in tool actions (Rest API / Handover to email) shown in the Tools view.\n\t * Picking one opens its config drawer (via `onSelect`) and dismisses the picker\n\t * — it never inserts a mention into the text.\n\t /\n\ttoolActions?: ToolAction[];\n};\n\n/\n `@` reference picker. Drills:\n * root → Tools → <source> (Manifest / Shopify / …) → tool\n * → Sub-agent → sub-agent\n * (\"Add condition\" and \"Variables\" are intentionally not shown yet.)\n \n Owns keyboard navigation (↑/↓ move, →/Enter activate, ← go back) over the\n * CURRENTLY visible rows — registered with the editor via `registerKeyHandler`.\n */\nexport const MentionPicker: React.FC<MentionPickerProps> = ({\n\titems,\n\tonSelect,\n\tregisterKeyHandler,\n\tonClose,\n\tonCreateSubAgent,\n\tinitialSource,\n\ttoolActions,\n}) => {\n\tconst [category, setCategory] = useState<Category \| null>(null);\n\tconst [source, setSource] = useState<string \| null>(initialSource ?? null);\n\tconst [activeIndex, setActiveIndex] = useState(0);\n\t// Search box shown inside a source's tool list (Manifest / Shopify); filters\n\t// that source's tools by name.\n\tconst [search, setSearch] = useState('');\n\n\tconst tools = useMemo(\n\t\t() => items.filter((i) => metaOf(i)?.kind === 'tool'),\n\t\t[items],\n\t);\n\tconst subAgents = useMemo(\n\t\t() => items.filter((i) => metaOf(i)?.kind === 'subagent'),\n\t\t[items],\n\t);\n\tconst sources = useMemo(() => {\n\t\tconst acc: string[] = [];\n\t\ttools.forEach((t) => {\n\t\t\tconst s = metaOf(t)?.source ?? 'other';\n\t\t\tif (!acc.includes(s)) {\n\t\t\t\tacc.push(s);\n\t\t\t}\n\t\t});\n\t\treturn acc;\n\t}, [tools]);\n\t// The built-in \"create\" action per source (Rest API / email / Slack). A source\n\t// with an action drills into [its instances + a \"Create new\" row] — like the\n\t// Sub-agent category — instead of showing a duplicate flat \"create\" row.\n\tconst actionBySource = useMemo(\n\t\t() =>\n\t\t\tnew Map<string, ToolAction>(\n\t\t\t\t(toolActions ?? []).map((a) => [a.source, a]),\n\t\t\t),\n\t\t[toolActions],\n\t);\n\n\t// Show a category when it has items — and ALWAYS show Sub-agent when creating\n\t// one is possible, so an agent with no sub-agents yet still gets the root\n\t// \"Tools / Sub-agent\" choice (with a \"Create new\" inside). When only one is\n\t// available (e.g. the sub-agent drawer offers tools only) the selector is skipped.\n\tconst availableCategories = useMemo(\n\t\t() =>\n\t\t\tCATEGORIES.filter((c) =>\n\t\t\t\tc.key === 'tool'\n\t\t\t\t\t? tools.length > 0 \|\| (toolActions?.length ?? 0) > 0\n\t\t\t\t\t: subAgents.length > 0 \|\| !!onCreateSubAgent,\n\t\t\t),\n\t\t[tools.length, subAgents.length, onCreateSubAgent, toolActions?.length],\n\t);\n\tconst soleCategory =\n\t\tavailableCategories.length === 1 ? availableCategories[0].key : null;\n\tconst activeCategory = category ?? soleCategory;\n\n\t// Title shown above the current view. `onBack` is omitted at a root level (a\n\t// sole category has nowhere to go back to) — the header then shows as a plain\n\t// title. When `onBack` is set the header leads with a back arrow, followed by\n\t// the source icon in a source detail view: `[← back][icon][title]`.\n\tconst header: {\n\t\ttitle: string;\n\t\tonBack?: () => void;\n\t\ticon?: SourceIcon;\n\t} \| null = !activeCategory\n\t\t? null\n\t\t: activeCategory === 'subagent'\n\t\t? // Always titled — with a back arrow only when the category chooser is above.\n\t\t {\n\t\t\t\ttitle: 'Sub-agent',\n\t\t\t\tonBack: soleCategory ? undefined : () => setCategory(null),\n\t\t }\n\t\t: source\n\t\t? {\n\t\t\t\ttitle: toolSourceLabel(source),\n\t\t\t\tonBack: () => setSource(null),\n\t\t\t\ticon: sourceIcon(source),\n\t\t }\n\t\t: soleCategory\n\t\t? null\n\t\t: { title: 'Tools', onBack: () => setCategory(null) };\n\n\t// Build the navigable rows for the current view.\n\tconst rows: PickerRowModel[] = useMemo(() => {\n\t\tif (!activeCategory) {\n\t\t\treturn availableCategories.map((c) => ({\n\t\t\t\tid: c.key,\n\t\t\t\tlabel: c.label,\n\t\t\t\tdrillsIn: true,\n\t\t\t\tonActivate: () => {\n\t\t\t\t\tsetCategory(c.key);\n\t\t\t\t\tsetSource(null);\n\t\t\t\t},\n\t\t\t}));\n\t\t}\n\t\tif (activeCategory === 'subagent') {\n\t\t\tconst sq = search.trim().toLowerCase();\n\t\t\tconst leaves: PickerRowModel[] = subAgents\n\t\t\t\t.filter((item) => !sq \|\| rowLabel(item).toLowerCase().includes(sq))\n\t\t\t\t.map((item) => ({\n\t\t\t\t\tid: String(item.id),\n\t\t\t\t\tlabel: rowLabel(item),\n\t\t\t\t\tdrillsIn: false,\n\t\t\t\t\tonActivate: () => onSelect(item),\n\t\t\t\t}));\n\t\t\t// \"Create new\" opens the drawer — first dismiss the menu (strips the \"@\").\n\t\t\tif (onCreateSubAgent) {\n\t\t\t\tleaves.push({\n\t\t\t\t\tid: CREATE_SUBAGENT_ID,\n\t\t\t\t\tlabel: 'Create new',\n\t\t\t\t\tdrillsIn: false,\n\t\t\t\t\tisCreate: true,\n\t\t\t\t\tonActivate: () => {\n\t\t\t\t\t\tonClose?.();\n\t\t\t\t\t\tonCreateSubAgent();\n\t\t\t\t\t},\n\t\t\t\t});\n\t\t\t}\n\t\t\treturn leaves;\n\t\t}\n\t\tif (!source) {\n\t\t\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\treturn [...sources, ...actionOnly].map((s) => ({\n\t\t\t\tid: s,\n\t\t\t\tlabel: toolSourceLabel(s),\n\t\t\t\tdrillsIn: true,\n\t\t\t\ticon: sourceIcon(s) ?? actionBySource.get(s)?.icon,\n\t\t\t\tonActivate: () => setSource(s),\n\t\t\t}));\n\t\t}\n\t\tconst q = search.trim().toLowerCase();\n\t\tconst leaves: PickerRowModel[] = tools\n\t\t\t.filter((t) => (metaOf(t)?.source ?? 'other') === source)\n\t\t\t.filter((t) => !q \|\| rowLabel(t).toLowerCase().includes(q))\n\t\t\t.map((item) => ({\n\t\t\t\tid: String(item.id),\n\t\t\t\tlabel: rowLabel(item),\n\t\t\t\tdrillsIn: false,\n\t\t\t\tonActivate: () => onSelect(item),\n\t\t\t}));\n\t\t// A configurable source (Rest API / email / Slack) ends with an add row\n\t\t// labelled by the action it adds (e.g. \"Send Slack message\") — sits below\n\t\t// any existing instances and opens its drawer (after dismissing the picker).\n\t\tconst action = actionBySource.get(source);\n\t\tif (action) {\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: true,\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]);\n\n\t// Reset highlight whenever the view (or filtered result set) changes.\n\tuseEffect(() => setActiveIndex(0), [activeCategory, source, search, items]);\n\t// Clear the search box when leaving a source view.\n\tuseEffect(() => setSearch(''), [activeCategory, source]);\n\n\t// Keep the latest rows/index reachable from the stable key handler.\n\tconst navRef = useRef({ rows, activeIndex, header });\n\tnavRef.current = { rows, activeIndex, header };\n\n\tuseEffect(() => {\n\t\tif (!registerKeyHandler) {\n\t\t\treturn;\n\t\t}\n\t\tregisterKeyHandler((event) => {\n\t\t\tconst { rows: r, activeIndex: i, header: h } = navRef.current;\n\t\t\tswitch (event.key) {\n\t\t\t\tcase 'ArrowDown':\n\t\t\t\t\tif (r.length) setActiveIndex((p) => (p + 1) % r.length);\n\t\t\t\t\treturn true;\n\t\t\t\tcase 'ArrowUp':\n\t\t\t\t\tif (r.length) setActiveIndex((p) => (p + r.length - 1) % r.length);\n\t\t\t\t\treturn true;\n\t\t\t\tcase 'ArrowRight':\n\t\t\t\tcase 'Enter':\n\t\t\t\t\tr[i]?.onActivate();\n\t\t\t\t\treturn true;\n\t\t\t\tcase 'ArrowLeft':\n\t\t\t\t\tif (h?.onBack) {\n\t\t\t\t\t\th.onBack();\n\t\t\t\t\t\treturn true;\n\t\t\t\t\t}\n\t\t\t\t\treturn false;\n\t\t\t\tdefault:\n\t\t\t\t\treturn false;\n\t\t\t}\n\t\t});\n\t\treturn () => registerKeyHandler(null);\n\t}, [registerKeyHandler]);\n\n\tconst variant = !activeCategory\n\t\t? 'categories'\n\t\t: rows.length && !rows[0].drillsIn\n\t\t? 'items'\n\t\t: 'sources';\n\n\t// Search lives inside a source's tool list (Manifest / Shopify) and in the\n\t// sub-agent list.\n\tconst showSearch =\n\t\t(activeCategory === 'tool' && !!source) \|\| activeCategory === 'subagent';\n\n\treturn (\n\t\t<PickerCard className={`bik-mention-picker bik-mention-picker--${variant}`}>\n\t\t\t{header && (\n\t\t\t\t<PickerBack\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\tonClick={header.onBack}\n\t\t\t\t\tdisabled={!header.onBack}\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tbackground: COLORS.surface.subdued,\n\t\t\t\t\t\tcursor: header.onBack ? 'pointer' : 'default',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{header.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\trows[activeIndex]?.onActivate();\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t</PickerSearchRow>\n\t\t\t)}\n\t\t\t{rows.length === 0 ? (\n\t\t\t\t<PickerEmpty>\n\t\t\t\t\t{activeCategory === 'subagent'\n\t\t\t\t\t\t? 'No sub-agents available'\n\t\t\t\t\t\t: 'No tools available'}\n\t\t\t\t</PickerEmpty>\n\t\t\t) : (\n\t\t\t\trows.map((row, i) => (\n\t\t\t\t\t<PickerRow\n\t\t\t\t\t\tkey={row.id}\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t$active={i === activeIndex}\n\t\t\t\t\t\tonMouseEnter={() => setActiveIndex(i)}\n\t\t\t\t\t\tonClick={row.onActivate}\n\t\t\t\t\t>\n\t\t\t\t\t\t{row.isCreate ? (\n\t\t\t\t\t\t\t<CreateRowText>{row.label}</CreateRowText>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t<PickerRowMain>\n\t\t\t\t\t\t\t\t\t{renderSourceIcon(row.icon)}\n\t\t\t\t\t\t\t\t\t<BodySecondary color={COLORS.content.primary}>\n\t\t\t\t\t\t\t\t\t\t{row.label}\n\t\t\t\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t\t\t\t</PickerRowMain>\n\t\t\t\t\t\t\t\t{row.drillsIn && <ChevronRight width={12} height={12} />}\n\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</PickerRow>\n\t\t\t\t))\n\t\t\t)}\n\t\t</PickerCard>\n\t);\n};\n\nconst PickerCard = styled.div`\n\tdisplay: flex;\n\tflex-direction: column;\n\tmin-width: 240px;\n\tmax-height: 301px;\n\toverflow-y: auto;\n\tbackground: ${COLORS.surface.standard};\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 4px;\n\tbox-shadow: 0px -2px 8px 0px #0000001f;\n`;\n\n// Search box at the top of a source's tool list (Manifest / Shopify).\nconst PickerSearchRow = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n\tpadding: 10px 12px;\n\tborder-bottom: 1px solid ${COLORS.stroke.primary};\n`;\n\nconst PickerSearchInput = styled.input`\n\tflex: 1;\n\tmin-width: 0;\n\tborder: none;\n\toutline: none;\n\tbackground: transparent;\n\tfont-family: Inter;\n\tfont-size: 14px;\n\tcolor: ${COLORS.content.primary};\n\n\t&::placeholder {\n\t\tcolor: ${COLORS.content.placeholder};\n\t}\n`;\n\nconst PickerRow = styled.button<{ $active?: boolean }>`\n\tdisplay: flex;\n\tjustify-content: space-between;\n\talign-items: center;\n\tgap: 2px;\n\twidth: 100%;\n\tpadding: 8px 10px;\n\theight: 48px;\n\tborder: none;\n\tborder-bottom: 1px solid ${COLORS.stroke.primary};\n\tbackground: ${(p) => (p.$active ? COLORS.surface.subdued : 'transparent')};\n\tcursor: pointer;\n\ttext-align: left;\n\n\t&:hover {\n\t\tbackground: ${COLORS.surface.subdued};\n\t}\n`;\n\n// Left cluster: leading source glyph + label (chevron stays right via PickerRow).\nconst PickerRowMain = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 12px;\n\tmin-width: 0;\n`;\n\n// \"Create new\" — centered brand text, no icon (matches the side-panel dropdown).\nconst CreateRowText = styled.div`\n\twidth: 100%;\n\ttext-align: center;\n\tcolor: ${COLORS.content.brand};\n\tfont-family: Inter;\n\tfont-size: 14px;\n\tfont-weight: 600;\n`;\n\nconst PickerBack = styled.button`\n\tdisplay: flex;\n\talign-items: center;\n\tpadding: 12px 16px;\n\tborder: none;\n\tborder-bottom: 1px solid ${COLORS.stroke.primary};\n\tbackground: transparent;\n\tcursor: pointer;\n\tfont-family: Inter;\n\tfont-size: 12px;\n\tfont-weight: 600;\n\theight: 48px;\n\tgap: 4px;\n`;\n\nconst PickerEmpty = styled.div`\n\tpadding: 12px 10px;\n\tfont-family: Inter;\n\tfont-size: 13px;\n\tcolor: ${COLORS.content.secondary};\n`;\n"],"names":["metaOf","item","rowLabel","CREATE_SUBAGENT_ID","MentionPicker","items","onSelect","registerKeyHandler","onClose","onCreateSubAgent","initialSource","toolActions","category","setCategory","useState","source","setSource","activeIndex","setActiveIndex","search","setSearch","tools","useMemo","i","subAgents","sources","acc","t","s","actionBySource","a","availableCategories","CATEGORIES","c","soleCategory","activeCategory","header","toolSourceLabel","sourceIcon","rows","sq","leaves","actionOnly","q","action","useEffect","navRef","useRef","event","h","p","variant","showSearch","jsxs","PickerCard","PickerBack","COLORS","jsx","SvgArrowLeft","renderSourceIcon","TitleSmall","PickerSearchRow","SearchIcon","PickerSearchInput","PickerEmpty","row","PickerRow","CreateRowText","Fragment","PickerRowMain","BodySecondary","ChevronRight","styled"],"mappings":"qlBAiBMA,EAAUC,GACfA,EAAK,KAEAC,EAAYD,GACjBD,EAAOC,CAAI,GAAG,YAAcA,EAAK,MAgB5BE,EAAqB,0BA0BdC,EAA8C,CAAC,CAC3D,MAAAC,EACA,SAAAC,EACA,mBAAAC,EACA,QAAAC,EACA,iBAAAC,EACA,cAAAC,EACA,YAAAC,CACD,IAAM,CACL,KAAM,CAACC,EAAUC,CAAW,EAAIC,EAAAA,SAA0B,IAAI,EACxD,CAACC,EAAQC,CAAS,EAAIF,EAAAA,SAAwBJ,GAAiB,IAAI,EACnE,CAACO,EAAaC,CAAc,EAAIJ,EAAAA,SAAS,CAAC,EAG1C,CAACK,EAAQC,CAAS,EAAIN,EAAAA,SAAS,EAAE,EAEjCO,EAAQC,EAAAA,QACb,IAAMjB,EAAM,OAAQkB,GAAMvB,EAAOuB,CAAC,GAAG,OAAS,MAAM,EACpD,CAAClB,CAAK,CAAA,EAEDmB,EAAYF,EAAAA,QACjB,IAAMjB,EAAM,OAAQkB,GAAMvB,EAAOuB,CAAC,GAAG,OAAS,UAAU,EACxD,CAAClB,CAAK,CAAA,EAEDoB,EAAUH,EAAAA,QAAQ,IAAM,CAC7B,MAAMI,EAAgB,CAAA,EACtBL,OAAAA,EAAM,QAASM,GAAM,CACpB,MAAMC,EAAI5B,EAAO2B,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,KACFX,GAAe,CAAA,GAAI,IAAKmB,GAAM,CAACA,EAAE,OAAQA,CAAC,CAAC,CAAA,EAE9C,CAACnB,CAAW,CAAA,EAOPoB,EAAsBT,EAAAA,QAC3B,IACCU,EAAAA,WAAW,OAAQC,GAClBA,EAAE,MAAQ,OACPZ,EAAM,OAAS,IAAMV,GAAa,QAAU,GAAK,EACjDa,EAAU,OAAS,GAAK,CAAC,CAACf,CAAA,EAE/B,CAACY,EAAM,OAAQG,EAAU,OAAQf,EAAkBE,GAAa,MAAM,CAAA,EAEjEuB,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,EAEzDE,EACA,CACA,MAAOsB,EAAAA,gBAAgBtB,CAAM,EAC7B,OAAQ,IAAMC,EAAU,IAAI,EAC5B,KAAMsB,EAAAA,WAAWvB,CAAM,CAAA,EAEvBmB,EACA,KACA,CAAE,MAAO,QAAS,OAAQ,IAAMrB,EAAY,IAAI,CAAA,EAfhD,KAkBG0B,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,OAAQvB,GAAS,CAACuC,GAAMtC,EAASD,CAAI,EAAE,YAAA,EAAc,SAASuC,CAAE,CAAC,EACjE,IAAKvC,IAAU,CACf,GAAI,OAAOA,EAAK,EAAE,EAClB,MAAOC,EAASD,CAAI,EACpB,SAAU,GACV,WAAY,IAAMK,EAASL,CAAI,CAAA,EAC9B,EAEH,OAAIQ,GACHgC,EAAO,KAAK,CACX,GAAItC,EACJ,MAAO,aACP,SAAU,GACV,SAAU,GACV,WAAY,IAAM,CACjBK,IAAA,EACAC,EAAA,CACD,CAAA,CACA,EAEKgC,CACR,CACA,GAAI,CAAC1B,EAAQ,CAIZ,MAAM2B,GAAc/B,GAAe,CAAA,GACjC,IAAKmB,GAAMA,EAAE,MAAM,EACnB,OAAQF,GAAM,CAACH,EAAQ,SAASG,CAAC,CAAC,EACpC,MAAO,CAAC,GAAGH,EAAS,GAAGiB,CAAU,EAAE,IAAKd,IAAO,CAC9C,GAAIA,EACJ,MAAOS,EAAAA,gBAAgBT,CAAC,EACxB,SAAU,GACV,KAAMU,EAAAA,WAAWV,CAAC,GAAKC,EAAe,IAAID,CAAC,GAAG,KAC9C,WAAY,IAAMZ,EAAUY,CAAC,CAAA,EAC5B,CACH,CACA,MAAMe,EAAIxB,EAAO,KAAA,EAAO,YAAA,EAClBsB,EAA2BpB,EAC/B,OAAQ,IAAOrB,EAAO,CAAC,GAAG,QAAU,WAAae,CAAM,EACvD,OAAQ,GAAM,CAAC4B,GAAKzC,EAAS,CAAC,EAAE,cAAc,SAASyC,CAAC,CAAC,EACzD,IAAK1C,IAAU,CACf,GAAI,OAAOA,EAAK,EAAE,EAClB,MAAOC,EAASD,CAAI,EACpB,SAAU,GACV,WAAY,IAAMK,EAASL,CAAI,CAAA,EAC9B,EAIG2C,EAASf,EAAe,IAAId,CAAM,EACxC,OAAI6B,GACHH,EAAO,KAAK,CACX,GAAI,UAAU1B,CAAM,GACpB,MAAO6B,EAAO,MACd,SAAU,GACV,SAAU,GACV,WAAY,IAAM,CACjBpC,IAAA,EACAoC,EAAO,SAAA,CACR,CAAA,CACA,EAEKH,CACR,EAAG,CACFN,EACAJ,EACAhB,EACAI,EACAE,EACAG,EACAC,EACAnB,EACAE,EACAC,EACAE,EACAkB,CAAA,CACA,EAGDgB,YAAU,IAAM3B,EAAe,CAAC,EAAG,CAACiB,EAAgBpB,EAAQI,EAAQd,CAAK,CAAC,EAE1EwC,EAAAA,UAAU,IAAMzB,EAAU,EAAE,EAAG,CAACe,EAAgBpB,CAAM,CAAC,EAGvD,MAAM+B,EAASC,EAAAA,OAAO,CAAE,KAAAR,EAAM,YAAAtB,EAAa,OAAAmB,EAAQ,EACnDU,EAAO,QAAU,CAAE,KAAAP,EAAM,YAAAtB,EAAa,OAAAmB,CAAA,EAEtCS,EAAAA,UAAU,IAAM,CACf,GAAKtC,EAGL,OAAAA,EAAoByC,GAAU,CAC7B,KAAM,CAAE,KAAM,EAAG,YAAazB,EAAG,OAAQ0B,GAAMH,EAAO,QACtD,OAAQE,EAAM,IAAA,CACb,IAAK,YACJ,OAAI,EAAE,QAAQ9B,EAAgBgC,IAAOA,EAAI,GAAK,EAAE,MAAM,EAC/C,GACR,IAAK,UACJ,OAAI,EAAE,QAAQhC,EAAgBgC,IAAOA,EAAI,EAAE,OAAS,GAAK,EAAE,MAAM,EAC1D,GACR,IAAK,aACL,IAAK,QACJ,SAAE3B,CAAC,GAAG,WAAA,EACC,GACR,IAAK,YACJ,OAAI0B,GAAG,QACNA,EAAE,OAAA,EACK,IAED,GACR,QACC,MAAO,EAAA,CAEV,CAAC,EACM,IAAM1C,EAAmB,IAAI,CACrC,EAAG,CAACA,CAAkB,CAAC,EAEvB,MAAM4C,EAAWhB,EAEdI,EAAK,QAAU,CAACA,EAAK,CAAC,EAAE,SACxB,QACA,UAHA,aAOGa,EACJjB,IAAmB,QAAU,CAAC,CAACpB,GAAWoB,IAAmB,WAE/D,OACCkB,EAAAA,KAACC,EAAA,CAAW,UAAW,0CAA0CH,CAAO,GACtE,SAAA,CAAAf,GACAiB,EAAAA,KAACE,GAAA,CACA,KAAK,SACL,QAASnB,EAAO,OAChB,SAAU,CAACA,EAAO,OAClB,MAAO,CACN,WAAYoB,EAAAA,OAAO,QAAQ,QAC3B,OAAQpB,EAAO,OAAS,UAAY,SAAA,EAGpC,SAAA,CAAAA,EAAO,QACPqB,EAAAA,IAACC,EAAAA,QAAA,CACA,MAAO,GACP,OAAQ,GACR,MAAOF,EAAAA,OAAO,QAAQ,OAAA,CAAA,EAGvBpB,EAAO,MAAQuB,mBAAiBvB,EAAO,IAAI,SAC3CwB,EAAAA,WAAA,CAAW,SAAA,CAAA,IAAExB,EAAO,KAAA,CAAA,CAAM,CAAA,CAAA,CAAA,EAG5BgB,UACCS,EAAA,CACA,SAAA,CAAAJ,EAAAA,IAACK,EAAAA,QAAA,CACA,MAAO,GACP,OAAQ,GACR,MAAON,EAAAA,OAAO,QAAQ,WAAA,CAAA,EAEvBC,EAAAA,IAACM,EAAA,CAIA,UAAS,GACT,MAAO5C,EACP,YAAY,SACZ,YAAU,wBACV,SAAW,GAAMC,EAAU,EAAE,OAAO,KAAK,EACzC,UAAY,GAAM,CACZmB,EAAK,SAGN,EAAE,MAAQ,aACb,EAAE,eAAA,EACFrB,EAAgBgC,IAAOA,EAAI,GAAKX,EAAK,MAAM,GACjC,EAAE,MAAQ,WACpB,EAAE,eAAA,EACFrB,EAAgBgC,IAAOA,EAAIX,EAAK,OAAS,GAAKA,EAAK,MAAM,GAC/C,EAAE,MAAQ,UACpB,EAAE,eAAA,EACFA,EAAKtB,CAAW,GAAG,WAAA,GAErB,CAAA,CAAA,CACD,EACD,EAEAsB,EAAK,SAAW,EAChBkB,EAAAA,IAACO,IACC,SAAA7B,IAAmB,WACjB,0BACA,oBAAA,CACJ,EAEAI,EAAK,IAAI,CAAC0B,EAAK1C,IACdkC,EAAAA,IAACS,EAAA,CAEA,KAAK,SACL,QAAS3C,IAAMN,EACf,aAAc,IAAMC,EAAeK,CAAC,EACpC,QAAS0C,EAAI,WAEZ,WAAI,SACJR,EAAAA,IAACU,IAAe,SAAAF,EAAI,KAAA,CAAM,EAE1BZ,EAAAA,KAAAe,EAAAA,SAAA,CACC,SAAA,CAAAf,OAACgB,GAAA,CACC,SAAA,CAAAV,EAAAA,iBAAiBM,EAAI,IAAI,QACzBK,EAAAA,cAAA,CAAc,MAAOd,EAAAA,OAAO,QAAQ,QACnC,WAAI,KAAA,CACN,CAAA,EACD,EACCS,EAAI,UAAYR,EAAAA,IAACc,EAAAA,SAAa,MAAO,GAAI,OAAQ,EAAA,CAAI,CAAA,CAAA,CACvD,CAAA,EAjBIN,EAAI,EAAA,CAoBV,CAAA,EAEH,CAEF,EAEMX,EAAakB,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,eAMXhB,EAAAA,OAAO,QAAQ,QAAQ;AAAA,qBACjBA,EAAAA,OAAO,OAAO,OAAO;AAAA;AAAA;AAAA,EAMpCK,EAAkBW,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA,4BAKHhB,EAAAA,OAAO,OAAO,OAAO;AAAA,EAG3CO,EAAoBS,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAQvBhB,EAAAA,OAAO,QAAQ,OAAO;AAAA;AAAA;AAAA,WAGrBA,EAAAA,OAAO,QAAQ,WAAW;AAAA;AAAA,EAI/BU,EAAYM,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,4BASGhB,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,EAKhCa,GAAgBG,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA,EAQvBL,GAAgBK,EAAAA,QAAO;AAAA;AAAA;AAAA,UAGnBhB,EAAAA,OAAO,QAAQ,KAAK;AAAA;AAAA;AAAA;AAAA,EAMxBD,GAAaiB,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA,4BAKEhB,EAAAA,OAAO,OAAO,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAU3CQ,GAAcQ,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA,UAIjBhB,EAAAA,OAAO,QAAQ,SAAS;AAAA"}
1	+ {"version":3,"file":"MentionPicker.js","sources":["../../../../../src/components/agent-builder/components/MentionPicker.tsx"],"sourcesContent":["// import ChevronLeft from '@src/assets/icons/chevronLeft.svg';\nimport ChevronRight from '@src/assets/icons/chevronRight.svg';\nimport SearchIcon from '@src/assets/icons/searchIcon.svg';\nimport type { MentionDropdownRenderProps, MentionItem } from '@src/editor';\nimport SvgArrowLeft from '@src/icons/Arrows/Normal arrows/ArrowLeft';\nimport React, { useEffect, useMemo, useRef, useState } from 'react';\nimport styled from 'styled-components';\nimport { BodySecondary, TitleSmall } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport { CATEGORIES, CONFIG_TOOL_SOURCES } from '../constants/tools';\nimport type { Category, ToolAction } from '../constants/tools';\nimport {\n\tMentionKindMeta,\n\ttoolSourceLabel,\n} from '../utils/mentionSerialization';\nimport { renderSourceIcon, sourceIcon, SourceIcon } from '../utils/sourceIcons';\n\nconst metaOf = (item: MentionItem): MentionKindMeta \| undefined =>\n\titem.meta as unknown as MentionKindMeta \| undefined;\n\nconst rowLabel = (item: MentionItem): string =>\n\tmetaOf(item)?.plainLabel ?? item.label;\n\n/** One navigable row in the picker's current view. /\ntype PickerRowModel = {\n\tid: string;\n\tlabel: string;\n\t/* Drill-in rows show a chevron; leaf (selectable) rows do not. /\n\tdrillsIn: boolean;\n\t/* Leading brand glyph (source rows only). /\n\ticon?: SourceIcon;\n\t/* Brand-coloured \"Create new\" action row (not a selectable item). /\n\tisCreate?: boolean;\n\tonActivate: () => void;\n};\n\n/* Sentinel id for the sub-agent \"Create new\" row. /\nconst CREATE_SUBAGENT_ID = '__bik_create_subagent__';\n\ntype MentionPickerProps = MentionDropdownRenderProps & {\n\t/* Opens the create-sub-agent drawer (shows a \"Create new\" row in the Sub-agent view). /\n\tonCreateSubAgent?: () => void;\n\t/\n\t Open already drilled into this tool source (e.g. `'shopify'`) — its tool list\n\t * is shown immediately. /\n\tinitialSource?: string;\n\t/\n\t Built-in tool actions (Rest API / Handover to email) shown in the Tools view.\n\t * Picking one opens its config drawer (via `onSelect`) and dismisses the picker\n\t * — it never inserts a mention into the text.\n\t /\n\ttoolActions?: ToolAction[];\n};\n\n/\n `@` reference picker. Drills:\n * root → Tools → <source> (Manifest / Shopify / …) → tool\n * → Sub-agent → sub-agent\n * (\"Add condition\" and \"Variables\" are intentionally not shown yet.)\n \n Owns keyboard navigation (↑/↓ move, →/Enter activate, ← go back) over the\n * CURRENTLY visible rows — registered with the editor via `registerKeyHandler`.\n */\nexport const MentionPicker: React.FC<MentionPickerProps> = ({\n\titems,\n\tonSelect,\n\tregisterKeyHandler,\n\tonClose,\n\tonCreateSubAgent,\n\tinitialSource,\n\ttoolActions,\n}) => {\n\tconst [category, setCategory] = useState<Category \| null>(null);\n\tconst [source, setSource] = useState<string \| null>(initialSource ?? null);\n\tconst [activeIndex, setActiveIndex] = useState(0);\n\t// Search box shown inside a source's tool list (Manifest / Shopify); filters\n\t// that source's tools by name.\n\tconst [search, setSearch] = useState('');\n\n\tconst tools = useMemo(\n\t\t() => items.filter((i) => metaOf(i)?.kind === 'tool'),\n\t\t[items],\n\t);\n\tconst subAgents = useMemo(\n\t\t() => items.filter((i) => metaOf(i)?.kind === 'subagent'),\n\t\t[items],\n\t);\n\tconst sources = useMemo(() => {\n\t\tconst acc: string[] = [];\n\t\ttools.forEach((t) => {\n\t\t\tconst s = metaOf(t)?.source ?? 'other';\n\t\t\tif (!acc.includes(s)) {\n\t\t\t\tacc.push(s);\n\t\t\t}\n\t\t});\n\t\treturn acc;\n\t}, [tools]);\n\t// The built-in \"create\" action per source (Rest API / email / Slack). A source\n\t// with an action drills into [its instances + a \"Create new\" row] — like the\n\t// Sub-agent category — instead of showing a duplicate flat \"create\" row.\n\tconst actionBySource = useMemo(\n\t\t() =>\n\t\t\tnew Map<string, ToolAction>(\n\t\t\t\t(toolActions ?? []).map((a) => [a.source, a]),\n\t\t\t),\n\t\t[toolActions],\n\t);\n\n\t// Show a category when it has items — and ALWAYS show Sub-agent when creating\n\t// one is possible, so an agent with no sub-agents yet still gets the root\n\t// \"Tools / Sub-agent\" choice (with a \"Create new\" inside). When only one is\n\t// available (e.g. the sub-agent drawer offers tools only) the selector is skipped.\n\tconst availableCategories = useMemo(\n\t\t() =>\n\t\t\tCATEGORIES.filter((c) =>\n\t\t\t\tc.key === 'tool'\n\t\t\t\t\t? tools.length > 0 \|\| (toolActions?.length ?? 0) > 0\n\t\t\t\t\t: subAgents.length > 0 \|\| !!onCreateSubAgent,\n\t\t\t),\n\t\t[tools.length, subAgents.length, onCreateSubAgent, toolActions?.length],\n\t);\n\tconst soleCategory =\n\t\tavailableCategories.length === 1 ? availableCategories[0].key : null;\n\tconst activeCategory = category ?? soleCategory;\n\n\t// Title shown above the current view. `onBack` is omitted at a root level (a\n\t// sole category has nowhere to go back to) — the header then shows as a plain\n\t// title. When `onBack` is set the header leads with a back arrow, followed by\n\t// the source icon in a source detail view: `[← back][icon][title]`.\n\tconst header: {\n\t\ttitle: string;\n\t\tonBack?: () => void;\n\t\ticon?: SourceIcon;\n\t} \| null = !activeCategory\n\t\t? null\n\t\t: activeCategory === 'subagent'\n\t\t? // Always titled — with a back arrow only when the category chooser is above.\n\t\t {\n\t\t\t\ttitle: 'Sub-agent',\n\t\t\t\tonBack: soleCategory ? undefined : () => setCategory(null),\n\t\t }\n\t\t: source\n\t\t? {\n\t\t\t\ttitle: toolSourceLabel(source),\n\t\t\t\tonBack: () => setSource(null),\n\t\t\t\ticon: sourceIcon(source),\n\t\t }\n\t\t: // Always titled — matches the Sub-agent header; back arrow only when the\n\t\t // category chooser is above (i.e. not the sole category).\n\t\t {\n\t\t\t\ttitle: 'Tools',\n\t\t\t\tonBack: soleCategory ? undefined : () => setCategory(null),\n\t\t };\n\n\t// Build the navigable rows for the current view.\n\tconst rows: PickerRowModel[] = useMemo(() => {\n\t\tif (!activeCategory) {\n\t\t\treturn availableCategories.map((c) => ({\n\t\t\t\tid: c.key,\n\t\t\t\tlabel: c.label,\n\t\t\t\tdrillsIn: true,\n\t\t\t\tonActivate: () => {\n\t\t\t\t\tsetCategory(c.key);\n\t\t\t\t\tsetSource(null);\n\t\t\t\t},\n\t\t\t}));\n\t\t}\n\t\tif (activeCategory === 'subagent') {\n\t\t\tconst sq = search.trim().toLowerCase();\n\t\t\tconst leaves: PickerRowModel[] = subAgents\n\t\t\t\t.filter((item) => !sq \|\| rowLabel(item).toLowerCase().includes(sq))\n\t\t\t\t.map((item) => ({\n\t\t\t\t\tid: String(item.id),\n\t\t\t\t\tlabel: rowLabel(item),\n\t\t\t\t\tdrillsIn: false,\n\t\t\t\t\tonActivate: () => onSelect(item),\n\t\t\t\t}));\n\t\t\t// \"Create new\" opens the drawer — first dismiss the menu (strips the \"@\").\n\t\t\tif (onCreateSubAgent) {\n\t\t\t\tleaves.push({\n\t\t\t\t\tid: CREATE_SUBAGENT_ID,\n\t\t\t\t\tlabel: 'Create new',\n\t\t\t\t\tdrillsIn: false,\n\t\t\t\t\tisCreate: true,\n\t\t\t\t\tonActivate: () => {\n\t\t\t\t\t\tonClose?.();\n\t\t\t\t\t\tonCreateSubAgent();\n\t\t\t\t\t},\n\t\t\t\t});\n\t\t\t}\n\t\t\treturn leaves;\n\t\t}\n\t\tif (!source) {\n\t\t\t// One drill-in row per source: the real sources (from instances) plus any\n\t\t\t// action source (Rest API / email / Slack) with no instances yet, so it\n\t\t\t// still appears for first-time creation. Deduped — no more twin rows.\n\t\t\tconst actionOnly = (toolActions ?? [])\n\t\t\t\t.map((a) => a.source)\n\t\t\t\t.filter((s) => !sources.includes(s));\n\t\t\treturn [...sources, ...actionOnly].map((s) => ({\n\t\t\t\tid: s,\n\t\t\t\tlabel: toolSourceLabel(s),\n\t\t\t\tdrillsIn: true,\n\t\t\t\ticon: sourceIcon(s) ?? actionBySource.get(s)?.icon,\n\t\t\t\tonActivate: () => setSource(s),\n\t\t\t}));\n\t\t}\n\t\tconst q = search.trim().toLowerCase();\n\t\tconst leaves: PickerRowModel[] = tools\n\t\t\t.filter((t) => (metaOf(t)?.source ?? 'other') === source)\n\t\t\t.filter((t) => !q \|\| rowLabel(t).toLowerCase().includes(q))\n\t\t\t.map((item) => ({\n\t\t\t\tid: String(item.id),\n\t\t\t\tlabel: rowLabel(item),\n\t\t\t\tdrillsIn: false,\n\t\t\t\tonActivate: () => onSelect(item),\n\t\t\t}));\n\t\t// A configurable source's add row, below any existing instances, opening\n\t\t// its drawer. Config tools (Slack / email) are a single fixed capability →\n\t\t// render like a normal tool leaf (label only, no icon — matching the tool\n\t\t// rows). Rest API instances are user-created, so its \"add\" stays a\n\t\t// brand-coloured create row.\n\t\tconst action = actionBySource.get(source);\n\t\tif (action) {\n\t\t\tconst isConfigTool = source in CONFIG_TOOL_SOURCES;\n\t\t\tleaves.push({\n\t\t\t\tid: `create:${source}`,\n\t\t\t\tlabel: action.label,\n\t\t\t\tdrillsIn: false,\n\t\t\t\tisCreate: !isConfigTool,\n\t\t\t\tonActivate: () => {\n\t\t\t\t\tonClose?.();\n\t\t\t\t\taction.onSelect();\n\t\t\t\t},\n\t\t\t});\n\t\t}\n\t\treturn leaves;\n\t}, [\n\t\tactiveCategory,\n\t\tavailableCategories,\n\t\tsource,\n\t\tsearch,\n\t\ttools,\n\t\tsubAgents,\n\t\tsources,\n\t\tonSelect,\n\t\tonClose,\n\t\tonCreateSubAgent,\n\t\ttoolActions,\n\t\tactionBySource,\n\t]);\n\n\t// Reset highlight whenever the view (or filtered result set) changes.\n\tuseEffect(() => setActiveIndex(0), [activeCategory, source, search, items]);\n\t// Clear the search box when leaving a source view.\n\tuseEffect(() => setSearch(''), [activeCategory, source]);\n\n\t// Keep the latest rows/index reachable from the stable key handler.\n\tconst navRef = useRef({ rows, activeIndex, header });\n\tnavRef.current = { rows, activeIndex, header };\n\n\tuseEffect(() => {\n\t\tif (!registerKeyHandler) {\n\t\t\treturn;\n\t\t}\n\t\tregisterKeyHandler((event) => {\n\t\t\tconst { rows: r, activeIndex: i, header: h } = navRef.current;\n\t\t\tswitch (event.key) {\n\t\t\t\tcase 'ArrowDown':\n\t\t\t\t\tif (r.length) setActiveIndex((p) => (p + 1) % r.length);\n\t\t\t\t\treturn true;\n\t\t\t\tcase 'ArrowUp':\n\t\t\t\t\tif (r.length) setActiveIndex((p) => (p + r.length - 1) % r.length);\n\t\t\t\t\treturn true;\n\t\t\t\tcase 'ArrowRight':\n\t\t\t\tcase 'Enter':\n\t\t\t\t\tr[i]?.onActivate();\n\t\t\t\t\treturn true;\n\t\t\t\tcase 'ArrowLeft':\n\t\t\t\t\tif (h?.onBack) {\n\t\t\t\t\t\th.onBack();\n\t\t\t\t\t\treturn true;\n\t\t\t\t\t}\n\t\t\t\t\treturn false;\n\t\t\t\tdefault:\n\t\t\t\t\treturn false;\n\t\t\t}\n\t\t});\n\t\treturn () => registerKeyHandler(null);\n\t}, [registerKeyHandler]);\n\n\tconst variant = !activeCategory\n\t\t? 'categories'\n\t\t: rows.length && !rows[0].drillsIn\n\t\t? 'items'\n\t\t: 'sources';\n\n\t// Search lives inside a source's tool list (Manifest / Shopify) and in the\n\t// sub-agent list.\n\tconst showSearch =\n\t\t(activeCategory === 'tool' && !!source) \|\| activeCategory === 'subagent';\n\n\treturn (\n\t\t<PickerCard className={`bik-mention-picker bik-mention-picker--${variant}`}>\n\t\t\t{header && (\n\t\t\t\t<PickerBack\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\tonClick={header.onBack}\n\t\t\t\t\tdisabled={!header.onBack}\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tbackground: COLORS.surface.subdued,\n\t\t\t\t\t\tcursor: header.onBack ? 'pointer' : 'default',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{header.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\trows[activeIndex]?.onActivate();\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t</PickerSearchRow>\n\t\t\t)}\n\t\t\t{rows.length === 0 ? (\n\t\t\t\t<PickerEmpty>\n\t\t\t\t\t{activeCategory === 'subagent'\n\t\t\t\t\t\t? 'No sub-agents available'\n\t\t\t\t\t\t: 'No tools available'}\n\t\t\t\t</PickerEmpty>\n\t\t\t) : (\n\t\t\t\trows.map((row, i) => (\n\t\t\t\t\t<PickerRow\n\t\t\t\t\t\tkey={row.id}\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t$active={i === activeIndex}\n\t\t\t\t\t\tonMouseEnter={() => setActiveIndex(i)}\n\t\t\t\t\t\tonClick={row.onActivate}\n\t\t\t\t\t>\n\t\t\t\t\t\t{row.isCreate ? (\n\t\t\t\t\t\t\t<CreateRowText>{row.label}</CreateRowText>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t<PickerRowMain>\n\t\t\t\t\t\t\t\t\t{renderSourceIcon(row.icon)}\n\t\t\t\t\t\t\t\t\t<BodySecondary color={COLORS.content.primary}>\n\t\t\t\t\t\t\t\t\t\t{row.label}\n\t\t\t\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t\t\t\t</PickerRowMain>\n\t\t\t\t\t\t\t\t{row.drillsIn && <ChevronRight width={12} height={12} />}\n\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</PickerRow>\n\t\t\t\t))\n\t\t\t)}\n\t\t</PickerCard>\n\t);\n};\n\nconst PickerCard = styled.div`\n\tdisplay: flex;\n\tflex-direction: column;\n\tmin-width: 240px;\n\tmax-height: 301px;\n\toverflow-y: auto;\n\tbackground: ${COLORS.surface.standard};\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 4px;\n\tbox-shadow: 0px -2px 8px 0px #0000001f;\n`;\n\n// Search box at the top of a source's tool list (Manifest / Shopify).\nconst PickerSearchRow = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n\tpadding: 10px 12px;\n\tborder-bottom: 1px solid ${COLORS.stroke.primary};\n`;\n\nconst PickerSearchInput = styled.input`\n\tflex: 1;\n\tmin-width: 0;\n\tborder: none;\n\toutline: none;\n\tbackground: transparent;\n\tfont-family: Inter;\n\tfont-size: 14px;\n\tcolor: ${COLORS.content.primary};\n\n\t&::placeholder {\n\t\tcolor: ${COLORS.content.placeholder};\n\t}\n`;\n\nconst PickerRow = styled.button<{ $active?: boolean }>`\n\tdisplay: flex;\n\tjustify-content: space-between;\n\talign-items: center;\n\tgap: 2px;\n\twidth: 100%;\n\tpadding: 8px 10px;\n\theight: 48px;\n\tborder: none;\n\tborder-bottom: 1px solid ${COLORS.stroke.primary};\n\tbackground: ${(p) => (p.$active ? COLORS.surface.subdued : 'transparent')};\n\tcursor: pointer;\n\ttext-align: left;\n\n\t&:hover {\n\t\tbackground: ${COLORS.surface.subdued};\n\t}\n`;\n\n// Left cluster: leading source glyph + label (chevron stays right via PickerRow).\nconst PickerRowMain = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 12px;\n\tmin-width: 0;\n`;\n\n// \"Create new\" — centered brand text, no icon (matches the side-panel dropdown).\nconst CreateRowText = styled.div`\n\twidth: 100%;\n\ttext-align: center;\n\tcolor: ${COLORS.content.brand};\n\tfont-family: Inter;\n\tfont-size: 14px;\n\tfont-weight: 600;\n`;\n\nconst PickerBack = styled.button`\n\tdisplay: flex;\n\talign-items: center;\n\tpadding: 12px 16px;\n\tborder: none;\n\tborder-bottom: 1px solid ${COLORS.stroke.primary};\n\tbackground: transparent;\n\tcursor: pointer;\n\tfont-family: Inter;\n\tfont-size: 12px;\n\tfont-weight: 600;\n\theight: 48px;\n\tgap: 4px;\n`;\n\nconst PickerEmpty = styled.div`\n\tpadding: 12px 10px;\n\tfont-family: Inter;\n\tfont-size: 13px;\n\tcolor: ${COLORS.content.secondary};\n`;\n"],"names":["metaOf","item","rowLabel","CREATE_SUBAGENT_ID","MentionPicker","items","onSelect","registerKeyHandler","onClose","onCreateSubAgent","initialSource","toolActions","category","setCategory","useState","source","setSource","activeIndex","setActiveIndex","search","setSearch","tools","useMemo","i","subAgents","sources","acc","t","s","actionBySource","a","availableCategories","CATEGORIES","c","soleCategory","activeCategory","header","toolSourceLabel","sourceIcon","rows","sq","leaves","actionOnly","q","action","isConfigTool","CONFIG_TOOL_SOURCES","useEffect","navRef","useRef","event","h","p","variant","showSearch","jsxs","PickerCard","PickerBack","COLORS","jsx","SvgArrowLeft","renderSourceIcon","TitleSmall","PickerSearchRow","SearchIcon","PickerSearchInput","PickerEmpty","row","PickerRow","CreateRowText","Fragment","PickerRowMain","BodySecondary","ChevronRight","styled"],"mappings":"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"}

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

@@ -1,10 +1,10 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),$=require("../../../assets/icons/delete.svg.js"),z=require("../../../assets/icons/plus.svg.js"),o=require("react"),J=require("styled-components"),c=require("../../TypographyStyle.js"),l=require("../../../constants/Theme.js"),i=require("../AgentBuilder.styled.js"),U=require("../constants/charLimits.js"),G=require("../constants/tools.js"),Y=require("../utils/sourceIcons.js"),y=require("./DrawerHeaderText.js"),V=require("./ToolInstructionsField.js"),W=require("../../side-modal/SideModal.js"),u=require("../../input/Input.js"),K=require("../../dropdown/Dropdown.js"),Q=require("../../dropdown/utils.js"),X=require("../../button/Button.js"),B=require("../../../editor/BikEditor.js"),Z=r=>r&&typeof r=="object"&&"default"in r?r:{default:r},T=Z(J),ee=["GET","POST","PUT","PATCH","DELETE"],te=ee.map(r=>({label:r,value:r})),se=({onClose:r,onSave:I,initial:n,onImprove:H,charLimits:f=U.AGENT_CHAR_LIMITS,zIndex:k})=>{const[p,L]=o.useState(n?.name??""),[g,E]=o.useState(n?.instructions??""),[h,w]=o.useState(n?.url??""),[m,A]=o.useState(n?.method??"POST"),[R,x]=o.useState(n?.headers??[{key:"",value:""}]),[v,D]=o.useState(n?.requestBody??""),[C,P]=o.useState(n?.responseSample??""),[j,O]=o.useState(!1),b=(s,t)=>x(a=>a.map((d,N)=>N===s?{...d,...t}:d)),_=()=>x(s=>[...s,{key:"",value:""}]),M=s=>x(t=>t.filter((a,d)=>d!==s)),q=p.trim().length>0&&h.trim().length>0,F=async()=>{if(!q||j)return;const s={id:n?.id??`restapi_${Date.now().toString(36)}`,name:p.trim(),instructions:g,url:h.trim(),method:m,headers:R.filter(a=>a.key.trim()||a.value.trim()),requestBody:v,responseSample:C},t=I(s);if(t&&typeof t.then=="function"){O(!0);try{await t}finally{O(!1)}}};return e.jsxs(W.SideModal,{header:"Rest API",closeOnEscapeKey:!1,zIndex:k,headerCustomComponent:e.jsx(y.DrawerHeaderText,{title:"Rest API",subtitle:"Connect to any API endpoint. Configure the request, then test it with a sample response.",icon:Y.SOURCE_ICONS[G.ToolSource.RestApi]}),width:"431px",headerStyle:y.DRAWER_HEADER_STYLE,bodyStyle:y.DRAWER_BODY_STYLE,onClose:r,saveButtonProps:{"data-test":"restapi-save",buttonText:"Save",buttonType:"primary",size:"small",disabled:!q,isLoading:j,onClick:F},cancelButtonProps:{"data-test":"restapi-cancel",buttonText:"Cancel",buttonType:"tertiaryGray",size:"small",onClick:r},children:[e.jsx(u.Input,{"data-test":"restapi-name",variant:"small",labelText:"Name",labelTextBold:!0,placeholder:"Enter name",value:p,maxCharLimit:f.name,onChangeText:L}),e.jsx(V.ToolInstructionsField,{"data-test":"restapi-instructions",label:"Instructions",value:g,onChange:E,maxLength:f.instructions,placeholder:"Describe how should the LLM generate the rest API",onImprove:H}),e.jsx(i.FieldBlock,{children:e.jsx(u.Input,{"data-test":"restapi-url",variant:"small",labelText:"Request URL",labelTextBold:!0,placeholder:"https://",type:"url",value:h,onChangeText:w})}),e.jsxs(i.FieldBlock,{children:[e.jsx(c.TitleSmall,{color:l.COLORS.content.primary,children:"HTTP method"}),e.jsx(K.Dropdown,{"data-test":"restapi-method",size:"small",width:"100%",options:te,defaultOptions:[{label:m,value:m}],onSelect:s=>{const t=Q.unwrapDropdownValue(s);t&&A(t)}})]}),e.jsxs(i.FieldBlock,{children:[e.jsx(c.TitleSmall,{color:l.COLORS.content.primary,children:"Headers"}),R.map((s,t)=>e.jsxs(re,{"data-test":`restapi-header-${t}`,children:[e.jsx(u.Input,{variant:"small",hideInputHeader:!0,placeholder:"Accept",value:s.key,onChangeText:a=>b(t,{key:a})}),e.jsx(u.Input,{variant:"small",hideInputHeader:!0,placeholder:"Value",value:s.value,onChangeText:a=>b(t,{value:a})}),e.jsx(ne,{type:"button","aria-label":"Remove header","data-test":`restapi-header-remove-${t}`,onClick:()=>M(t),children:e.jsx($.default,{width:16,height:16,color:l.COLORS.content.secondary})})]},t)),e.jsx(ae,{children:e.jsx(X.Button,{"data-test":"restapi-add-header",buttonType:"dashRegular",size:"small",LeadingIcon:z.default,buttonText:"Add header",onClick:_})})]}),e.jsxs(i.FieldBlock,{children:[e.jsx(c.TitleSmall,{color:l.COLORS.content.primary,children:"Request "}),e.jsx(B.BikEditor,{features:{jsonMode:!0},initialContent:v,style:S,placeholder:"Type or paste JSON here",onChange:s=>D(s.text),minHeight:"120px",maxHeight:"240px"})]}),e.jsxs(i.FieldBlock,{children:[e.jsx(c.TitleSmall,{color:l.COLORS.content.primary,children:"Response "}),e.jsx(B.BikEditor,{features:{jsonMode:!0},style:S,initialContent:C,placeholder:"Type or paste JSON here",onChange:s=>P(s.text),minHeight:"120px",maxHeight:"240px"})]})]})},re=T.default.div`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),$=require("../../../assets/icons/delete.svg.js"),z=require("../../../assets/icons/plus.svg.js"),o=require("react"),J=require("styled-components"),c=require("../../TypographyStyle.js"),l=require("../../../constants/Theme.js"),i=require("../AgentBuilder.styled.js"),G=require("../constants/charLimits.js"),y=require("./DrawerHeaderText.js"),U=require("./ToolInstructionsField.js"),Y=require("../../side-modal/SideModal.js"),u=require("../../input/Input.js"),V=require("../../dropdown/Dropdown.js"),W=require("../../dropdown/utils.js"),K=require("../../button/Button.js"),B=require("../../../editor/BikEditor.js"),Q=r=>r&&typeof r=="object"&&"default"in r?r:{default:r},T=Q(J),X=["GET","POST","PUT","PATCH","DELETE"],Z=X.map(r=>({label:r,value:r})),ee=({onClose:r,onSave:H,initial:n,onImprove:k,charLimits:f=G.AGENT_CHAR_LIMITS,zIndex:I})=>{const[p,L]=o.useState(n?.name??""),[g,E]=o.useState(n?.instructions??""),[h,w]=o.useState(n?.url??""),[m,A]=o.useState(n?.method??"POST"),[v,x]=o.useState(n?.headers??[{key:"",value:""}]),[R,D]=o.useState(n?.requestBody??""),[j,P]=o.useState(n?.responseSample??""),[C,b]=o.useState(!1),O=(s,t)=>x(a=>a.map((d,N)=>N===s?{...d,...t}:d)),_=()=>x(s=>[...s,{key:"",value:""}]),M=s=>x(t=>t.filter((a,d)=>d!==s)),q=p.trim().length>0&&h.trim().length>0,F=async()=>{if(!q||C)return;const s={id:n?.id??`restapi_${Date.now().toString(36)}`,name:p.trim(),instructions:g,url:h.trim(),method:m,headers:v.filter(a=>a.key.trim()||a.value.trim()),requestBody:R,responseSample:j},t=H(s);if(t&&typeof t.then=="function"){b(!0);try{await t}finally{b(!1)}}};return e.jsxs(Y.SideModal,{header:"Rest API",closeOnEscapeKey:!1,zIndex:I,headerCustomComponent:e.jsx(y.DrawerHeaderText,{title:"Rest API",subtitle:"Connect to any API endpoint. Configure the request, then test it with a sample response."}),width:"431px",headerStyle:y.DRAWER_HEADER_STYLE,bodyStyle:y.DRAWER_BODY_STYLE,onClose:r,saveButtonProps:{"data-test":"restapi-save",buttonText:"Save",buttonType:"primary",size:"small",disabled:!q,isLoading:C,onClick:F},cancelButtonProps:{"data-test":"restapi-cancel",buttonText:"Cancel",buttonType:"tertiaryGray",size:"small",onClick:r},children:[e.jsx(u.Input,{"data-test":"restapi-name",variant:"small",labelText:"Name",labelTextBold:!0,placeholder:"Enter name",value:p,maxCharLimit:f.name,onChangeText:L}),e.jsx(U.ToolInstructionsField,{"data-test":"restapi-instructions",label:"Instructions",value:g,onChange:E,maxLength:f.instructions,placeholder:"Describe how should the LLM generate the rest API",onImprove:k}),e.jsx(i.FieldBlock,{children:e.jsx(u.Input,{"data-test":"restapi-url",variant:"small",labelText:"Request URL",labelTextBold:!0,placeholder:"https://",type:"url",value:h,onChangeText:w})}),e.jsxs(i.FieldBlock,{children:[e.jsx(c.TitleSmall,{color:l.COLORS.content.primary,children:"HTTP method"}),e.jsx(V.Dropdown,{"data-test":"restapi-method",size:"small",width:"100%",options:Z,defaultOptions:[{label:m,value:m}],onSelect:s=>{const t=W.unwrapDropdownValue(s);t&&A(t)}})]}),e.jsxs(i.FieldBlock,{children:[e.jsx(c.TitleSmall,{color:l.COLORS.content.primary,children:"Headers"}),v.map((s,t)=>e.jsxs(te,{"data-test":`restapi-header-${t}`,children:[e.jsx(u.Input,{variant:"small",hideInputHeader:!0,placeholder:"Accept",value:s.key,onChangeText:a=>O(t,{key:a})}),e.jsx(u.Input,{variant:"small",hideInputHeader:!0,placeholder:"Value",value:s.value,onChangeText:a=>O(t,{value:a})}),e.jsx(re,{type:"button","aria-label":"Remove header","data-test":`restapi-header-remove-${t}`,onClick:()=>M(t),children:e.jsx($.default,{width:16,height:16,color:l.COLORS.content.secondary})})]},t)),e.jsx(se,{children:e.jsx(K.Button,{"data-test":"restapi-add-header",buttonType:"dashRegular",size:"small",LeadingIcon:z.default,buttonText:"Add header",onClick:_})})]}),e.jsxs(i.FieldBlock,{children:[e.jsx(c.TitleSmall,{color:l.COLORS.content.primary,children:"Request "}),e.jsx(B.BikEditor,{features:{jsonMode:!0},initialContent:R,style:S,placeholder:"Type or paste JSON here",onChange:s=>D(s.text),minHeight:"120px",maxHeight:"240px"})]}),e.jsxs(i.FieldBlock,{children:[e.jsx(c.TitleSmall,{color:l.COLORS.content.primary,children:"Response "}),e.jsx(B.BikEditor,{features:{jsonMode:!0},style:S,initialContent:j,placeholder:"Type or paste JSON here",onChange:s=>P(s.text),minHeight:"120px",maxHeight:"240px"})]})]})},te=T.default.div`
 	display: flex;
 	align-items: center;
 	gap: 8px;
-`,ae=T.default.div`
+`,se=T.default.div`
 	display: flex;
-`,ne=T.default.button`
+`,re=T.default.button`
 	display: inline-flex;
 	align-items: center;
 	justify-content: center;
@@ -19,5 +19,5 @@
 	&:hover {
 		border-color: ${l.COLORS.content.secondary};
 	}
-`,S={borderRadius:"4px",overflow:"hidden"};exports.JsonFieldBox=S;exports.RestApiToolPanel=se;
+`,S={borderRadius:"4px",overflow:"hidden"};exports.JsonFieldBox=S;exports.RestApiToolPanel=ee;
 //# sourceMappingURL=RestApiToolPanel.js.map

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

	@@ -1 +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 { ToolSource } from '../constants/tools';\nimport { SOURCE_ICONS } from '../utils/sourceIcons';\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}\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}) => {\n\tconst [name, setName] = useState(initial?.name ?? '');\n\tconst [instructions, setInstructions] = useState(initial?.instructions ?? '');\n\tconst [url, setUrl] = useState(initial?.url ?? '');\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 canSave = name.trim().length > 0 && url.trim().length > 0;\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. Configure the request, then test it with a sample response.\"\n\t\t\t\t\ticon={SOURCE_ICONS[ToolSource.RestApi]}\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 name\"\n\t\t\t\tvalue={name}\n\t\t\t\tmaxCharLimit={charLimits.name}\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\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=\"Accept\"\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=\"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","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","_","canSave","handleSave","config","result","jsxs","SideModal","jsx","DrawerHeaderText","SOURCE_ICONS","ToolSource","DRAWER_HEADER_STYLE","DRAWER_BODY_STYLE","Input","ToolInstructionsField","FieldBlock","TitleSmall","COLORS","Dropdown","opt","v","unwrapDropdownValue","HeaderRow","IconBtn","DeleteIcon","AddHeaderRow","Button","PlusIcon","BikEditor","JsonFieldBox","c","styled"],"mappings":"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"}
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}\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}) => {\n\tconst [name, setName] = useState(initial?.name ?? '');\n\tconst [instructions, setInstructions] = useState(initial?.instructions ?? '');\n\tconst [url, setUrl] = useState(initial?.url ?? '');\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 canSave = name.trim().length > 0 && url.trim().length > 0;\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. Configure the request, then test it with a sample response.\"\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 name\"\n\t\t\t\tvalue={name}\n\t\t\t\tmaxCharLimit={charLimits.name}\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\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=\"Accept\"\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=\"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","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","_","canSave","handleSave","config","result","jsxs","SideModal","jsx","DrawerHeaderText","DRAWER_HEADER_STYLE","DRAWER_BODY_STYLE","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/cjs/components/agent-builder/components/SelectableListSection.js CHANGED Viewed

@@ -1,15 +1,15 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),Q=require("../../../assets/icons/delete.svg.js"),X=require("../../../assets/icons/edit.svg.js"),O=require("../../../assets/icons/plus.svg.js"),h=require("react"),Y=require("styled-components"),S=require("../../TypographyStyle.js"),d=require("../../../constants/Theme.js"),s=require("../AgentBuilder.styled.js"),x=require("../utils/sourceIcons.js"),Z=require("./MentionPicker.js"),I=require("../../dropdown/Dropdown.js"),M=require("../../dropdown/utils.js"),G=require("../../button/Button.js"),T=i=>i&&typeof i=="object"&&"default"in i?i:{default:i},R=T(Y),z="__bik_create_new__",ee=({title:i,helper:$,items:u,addableOptions:f,onAdd:b,onRemove:H,dataTestPrefix:c,emptyText:N,createOption:o,onConfigure:k,sourceGroups:y,mentionItems:L,actionSources:p})=>{const[a,r]=h.useState(!1),[V,C]=h.useState(null),w=!!y&&y.length>0,g=y?.find(e=>e.source===V),t=L!==void 0,_=h.useRef(null),m=h.useRef(null),[j,B]=h.useState(null);h.useEffect(()=>{if(!t||!a)return;const e=v=>{const D=v.target;!_.current?.contains(D)&&!m.current?.contains(D)&&r(!1)},l=v=>{v.key==="Escape"&&r(!1)};return document.addEventListener("mousedown",e),document.addEventListener("keydown",l),()=>{document.removeEventListener("mousedown",e),document.removeEventListener("keydown",l)}},[t,a]);const W=w?t||u.length>0:t||f.length>0||!!o&&u.length>0,K=u.length===0&&!!o&&!w&&!t,q=!!p&&p.length>0,U=(w||q)&&u.length===0,P=()=>{if(t){B(null),r(e=>!e);return}if(w){C(null),r(e=>!e);return}if(f.length===0&&o){o.onSelect();return}r(e=>!e)},J=()=>u.map(e=>{const l=e.onConfigure??(k?()=>k(e.id):void 0);return n.jsxs(s.SelectableRow,{"data-test":`${c}-row-${e.id}`,children:[x.renderSourceIcon(e.icon),n.jsx(s.RowText,{children:n.jsx(S.BodySecondary,{numberOfLines:1,color:d.COLORS.content.primary,children:e.label})}),n.jsxs(s.RowActions,{children:[l&&n.jsx(s.RowMenuButton,{"data-test":`${c}-edit-${e.id}`,"aria-label":`Edit ${e.label}`,onClick:l,children:n.jsx(X.default,{width:16,height:16,color:d.COLORS.content.secondary})}),l&&n.jsx(s.RowActionDivider,{"aria-hidden":!0}),n.jsx(s.RowMenuButton,{"data-test":`${c}-delete-${e.id}`,"aria-label":`Delete ${e.label}`,onClick:()=>H(e.id),children:n.jsx(Q.default,{width:16,height:16,color:d.COLORS.content.secondary})})]})]},e.id)}),A=o?[...f,{label:o.label,value:z,searchKey:o.label,customComponent:n.jsx("div",{style:{width:"100%",textAlign:"center",color:d.COLORS.content.brand,fontFamily:"Inter",fontSize:14,fontWeight:600},children:o.label})}]:f,E=t?n.jsx(Z.MentionPicker,{items:L??[],query:"",activeIndex:0,initialSource:j??void 0,onSelect:e=>{r(!1),b(String(e.id))},onClose:()=>r(!1),onCreateSubAgent:o?()=>{r(!1),o.onSelect()}:void 0,toolActions:q?p?.map(e=>({...e,onSelect:()=>{r(!1),e.onSelect()}})):void 0},j??"__root__"):null;return n.jsxs(s.SideSection,{children:[n.jsxs(s.SideSectionHeader,{children:[n.jsx(S.TitleSmall,{color:d.COLORS.content.primary,children:i}),W&&n.jsxs(ne,{ref:_,children:[n.jsx(s.AddIconButton,{"data-test":`${c}-add`,onClick:P,"aria-label":`Add ${i}`,children:n.jsx(O.default,{width:20,height:20,color:d.COLORS.content.brand})}),t&&a&&j===null&&n.jsx(F,{"data-test":`${c}-picker`,children:E})]})]}),$&&n.jsx(S.BodyCaption,{color:d.COLORS.content.secondary,children:$}),U?n.jsxs(oe,{ref:t?m:void 0,children:[n.jsxs(s.SourceButtonRow,{"data-test":`${c}-sources`,children:[y?.map(e=>n.jsxs(s.SourceButton,{type:"button","data-test":`${c}-source-${e.source}`,onClick:()=>{if(t){B(e.source),r(!0);return}C(e.source)},children:[x.renderSourceIcon(x.SOURCE_ICONS[e.source],-4),n.jsx(S.BodySecondary,{color:d.COLORS.content.primary,children:e.label})]},e.source)),p?.map(e=>n.jsxs(s.SourceButton,{type:"button","data-test":`${c}-action-${e.source}`,onClick:e.onSelect,children:[x.renderSourceIcon(e.icon,-4),n.jsx(S.BodySecondary,{color:d.COLORS.content.primary,children:e.label})]},e.source))]}),t&&a&&j!==null&&n.jsx(F,{$align:"left","data-test":`${c}-picker`,children:E}),!t&&g&&n.jsx(I.Dropdown,{"data-test":`${c}-dropdown`,size:"small",width:"100%",isSearchable:!0,placeHolder:`Search ${g.label} tools`,options:g.options,onSelect:e=>{const l=M.unwrapDropdownValue(e);C(null),r(!1),l&&b(l)}})]}):n.jsxs(n.Fragment,{children:[!t&&a&&A.length>0&&n.jsx(I.Dropdown,{"data-test":`${c}-dropdown`,size:"small",width:"100%",isSearchable:!0,placeHolder:`Select ${i.toLowerCase()}`,options:A,onSelect:e=>{const l=M.unwrapDropdownValue(e);r(!1),l&&(l===z?o?.onSelect():b(l))}}),u.length===0&&!a?n.jsxs(n.Fragment,{children:[n.jsx(S.BodyCaption,{color:d.COLORS.content.placeholder,children:N}),K&&o&&n.jsx(G.Button,{"data-test":`${c}-create`,buttonType:"secondary",size:"small",matchParentWidth:!0,LeadingIcon:O.default,buttonText:o.label,onClick:o.onSelect})]}):J()]})]})},ne=R.default.div`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),Z=require("../../../assets/icons/delete.svg.js"),G=require("../../../assets/icons/edit.svg.js"),H=require("../../../assets/icons/plus.svg.js"),u=require("react"),T=require("styled-components"),S=require("../../TypographyStyle.js"),d=require("../../../constants/Theme.js"),s=require("../AgentBuilder.styled.js"),C=require("../utils/sourceIcons.js"),ee=require("./MentionPicker.js"),F=require("../../dropdown/Dropdown.js"),N=require("../../dropdown/utils.js"),ne=require("../../button/Button.js"),oe=require("../../states-modal/DeleteConfirmationModal.js"),te=i=>i&&typeof i=="object"&&"default"in i?i:{default:i},k=te(T),V="__bik_create_new__",le=({title:i,helper:L,items:a,addableOptions:y,onAdd:g,onRemove:m,dataTestPrefix:t,emptyText:K,createOption:o,onConfigure:_,sourceGroups:p,mentionItems:B,actionSources:w,confirmDelete:f})=>{const[h,c]=u.useState(!1),[q,b]=u.useState(null),[U,v]=u.useState(null),j=!!p&&p.length>0,$=p?.find(e=>e.source===U),l=B!==void 0,A=u.useRef(null),D=u.useRef(null),[x,I]=u.useState(null);u.useEffect(()=>{if(!l||!h)return;const e=R=>{const z=R.target;!A.current?.contains(z)&&!D.current?.contains(z)&&c(!1)},r=R=>{R.key==="Escape"&&c(!1)};return document.addEventListener("mousedown",e),document.addEventListener("keydown",r),()=>{document.removeEventListener("mousedown",e),document.removeEventListener("keydown",r)}},[l,h]);const P=j?l||a.length>0:l||y.length>0||!!o&&a.length>0,J=a.length===0&&!!o&&!j&&!l,E=!!w&&w.length>0,Q=(j||E)&&a.length===0,X=()=>{if(l){I(null),c(e=>!e);return}if(j){v(null),c(e=>!e);return}if(y.length===0&&o){o.onSelect();return}c(e=>!e)},Y=()=>a.map(e=>{const r=e.onConfigure??(_?()=>_(e.id):void 0);return n.jsxs(s.SelectableRow,{"data-test":`${t}-row-${e.id}`,children:[C.renderSourceIcon(e.icon),n.jsx(s.RowText,{children:n.jsx(S.BodySecondary,{numberOfLines:1,color:d.COLORS.content.primary,children:e.label})}),n.jsxs(s.RowActions,{children:[r&&n.jsx(s.RowMenuButton,{"data-test":`${t}-edit-${e.id}`,"aria-label":`Edit ${e.label}`,onClick:r,children:n.jsx(G.default,{width:16,height:16,color:d.COLORS.content.secondary})}),r&&n.jsx(s.RowActionDivider,{"aria-hidden":!0}),n.jsx(s.RowMenuButton,{"data-test":`${t}-delete-${e.id}`,"aria-label":`Delete ${e.label}`,onClick:()=>f?b(e.id):m(e.id),children:n.jsx(Z.default,{width:16,height:16,color:d.COLORS.content.secondary})})]})]},e.id)}),O=o?[...y,{label:o.label,value:V,searchKey:o.label,customComponent:n.jsx("div",{style:{width:"100%",textAlign:"center",color:d.COLORS.content.brand,fontFamily:"Inter",fontSize:14,fontWeight:600},children:o.label})}]:y,M=l?n.jsx(ee.MentionPicker,{items:B??[],query:"",activeIndex:0,initialSource:x??void 0,onSelect:e=>{c(!1),g(String(e.id))},onClose:()=>c(!1),onCreateSubAgent:o?()=>{c(!1),o.onSelect()}:void 0,toolActions:E?w?.map(e=>({...e,onSelect:()=>{c(!1),e.onSelect()}})):void 0},x??"__root__"):null;return n.jsxs(s.SideSection,{children:[n.jsxs(s.SideSectionHeader,{children:[n.jsx(S.TitleSmall,{color:d.COLORS.content.primary,children:i}),P&&n.jsxs(re,{ref:A,children:[n.jsx(s.AddIconButton,{"data-test":`${t}-add`,onClick:X,"aria-label":`Add ${i}`,children:n.jsx(H.default,{width:20,height:20,color:d.COLORS.content.brand})}),l&&h&&x===null&&n.jsx(W,{"data-test":`${t}-picker`,children:M})]})]}),L&&n.jsx(S.BodyCaption,{color:d.COLORS.content.secondary,children:L}),Q?n.jsxs(ce,{ref:l?D:void 0,children:[n.jsxs(s.SourceButtonRow,{"data-test":`${t}-sources`,children:[p?.map(e=>n.jsxs(s.SourceButton,{type:"button","data-test":`${t}-source-${e.source}`,onClick:()=>{if(l){I(e.source),c(!0);return}v(e.source)},children:[C.renderSourceIcon(C.SOURCE_ICONS[e.source],-4),n.jsx(S.BodySecondary,{color:d.COLORS.content.primary,children:e.label})]},e.source)),w?.map(e=>n.jsxs(s.SourceButton,{type:"button","data-test":`${t}-action-${e.source}`,onClick:e.onSelect,children:[C.renderSourceIcon(e.icon,-4),n.jsx(S.BodySecondary,{color:d.COLORS.content.primary,children:e.label})]},e.source))]}),l&&h&&x!==null&&n.jsx(W,{$align:"left","data-test":`${t}-picker`,children:M}),!l&&$&&n.jsx(F.Dropdown,{"data-test":`${t}-dropdown`,size:"small",width:"100%",isSearchable:!0,placeHolder:`Search ${$.label} tools`,options:$.options,onSelect:e=>{const r=N.unwrapDropdownValue(e);v(null),c(!1),r&&g(r)}})]}):n.jsxs(n.Fragment,{children:[!l&&h&&O.length>0&&n.jsx(F.Dropdown,{"data-test":`${t}-dropdown`,size:"small",width:"100%",isSearchable:!0,placeHolder:`Select ${i.toLowerCase()}`,options:O,onSelect:e=>{const r=N.unwrapDropdownValue(e);c(!1),r&&(r===V?o?.onSelect():g(r))}}),a.length===0&&!h?n.jsxs(n.Fragment,{children:[n.jsx(S.BodyCaption,{color:d.COLORS.content.placeholder,children:K}),J&&o&&n.jsx(ne.Button,{"data-test":`${t}-create`,buttonType:"secondary",size:"small",matchParentWidth:!0,LeadingIcon:H.default,buttonText:o.label,onClick:o.onSelect})]}):Y()]}),f&&q&&n.jsx(oe.DeleteConfirmationModal,{"data-test":`${t}-delete-confirm`,header:`Delete this ${f.noun}?`,subHeader:`Deleting this ${f.noun} will also remove it from your instructions, wherever it's referenced.`,confirmationText:"Delete",zIndex:f.zIndex,onDeleteConfirmed:()=>{m(q),b(null)},onCancelClicked:()=>b(null)})]})},re=k.default.div`
 	position: relative;
 	display: flex;
-`,oe=R.default.div`
+`,ce=k.default.div`
 	position: relative;
 	display: flex;
 	flex-direction: column;
 	gap: 8px;
-`,F=R.default.div`
+`,W=k.default.div`
 	position: absolute;
 	top: calc(100% + 4px);
 	${i=>i.$align==="left"?"left: 0;":"right: 0;"}
 	z-index: 30;
-`;exports.SelectableListSection=ee;
+`;exports.SelectableListSection=le;
 //# sourceMappingURL=SelectableListSection.js.map

package/dist/cjs/components/agent-builder/components/SelectableListSection.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SelectableListSection.js","sources":["../../../../../src/components/agent-builder/components/SelectableListSection.tsx"],"sourcesContent":["import DeleteIcon from '@src/assets/icons/delete.svg';\nimport EditIcon from '@src/assets/icons/edit.svg';\nimport PlusIcon from '@src/assets/icons/plus.svg';\nimport { MentionItem } from '@src/editor';\nimport React, { useEffect, 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 {\n\tBodyCaption,\n\tBodySecondary,\n\tTitleSmall,\n} from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport {\n\tAddIconButton,\n\tRowActionDivider,\n\tRowActions,\n\tRowMenuButton,\n\tRowText,\n\tSelectableRow,\n\tSideSection,\n\tSideSectionHeader,\n\tSourceButton,\n\tSourceButtonRow,\n} from '../AgentBuilder.styled';\nimport { ToolAction } from '../constants/tools';\nimport {\n\trenderSourceIcon,\n\tSOURCE_ICONS,\n\tSourceIcon,\n} from '../utils/sourceIcons';\nimport { MentionPicker } from './MentionPicker';\n\nexport interface SelectableItem {\n\tid: string;\n\tlabel: string;\n\t/** Leading brand glyph (e.g. a tool's source icon). /\n\ticon?: SourceIcon;\n\t/\n\t When set, this row shows an edit (Configure) icon that calls this instead of\n\t * the section-level `onConfigure`. Use for rows that open their own drawer\n\t * (e.g. a configured Rest API / email-handover tool).\n\t /\n\tonConfigure?: () => void;\n}\n\n/* A tool source for the empty-state picker (Tools): a button → its searchable list. /\nexport interface SourceGroup {\n\tsource: string;\n\tlabel: string;\n\toptions: SingleOption[];\n}\n\n/* Sentinel value for the \"create new\" entry in the add dropdown. /\nconst CREATE_OPTION_VALUE = '__bik_create_new__';\n\ninterface SelectableListSectionProps {\n\ttitle: string;\n\thelper?: string;\n\titems: SelectableItem[];\n\t/\n\t Options shown in the add dropdown. Pass ALL items (not just unselected\n\t * ones) when re-picking an already-added item is allowed (e.g. to insert its\n\t * mention again) — the chip list still shows each item only once.\n\t /\n\taddableOptions: SingleOption[];\n\tonAdd: (id: string) => void;\n\tonRemove: (id: string) => void;\n\tdataTestPrefix: string;\n\temptyText: string;\n\t/\n\t Adds a \"create new\" entry at the top of the add dropdown (e.g. \"Create\n\t * sub-agent\"). Selecting it calls `onSelect` instead of `onAdd`.\n\t /\n\tcreateOption?: { label: string; onSelect: () => void };\n\t/\n\t When provided, each row shows an edit (Configure) icon next to Delete.\n\t * Omit for tools (Delete only).\n\t /\n\tonConfigure?: (id: string) => void;\n\t/\n\t Tool sources (e.g. Manifest / Shopify). When set, the empty state shows a\n\t * button per source; clicking one reveals a searchable dropdown of just that\n\t * source's options. Selecting calls `onAdd`. Takes precedence over the plain\n\t * `addableOptions` dropdown.\n\t /\n\tsourceGroups?: SourceGroup[];\n\t/\n\t When provided, the header \"+\" opens the same `@` reference picker used in the\n\t * Instructions editor (a {@link MentionPicker} popover) instead of the inline\n\t * select dropdown. Pass the items for THIS section only (tools OR sub-agents) —\n\t * the picker auto-drills into the single category. Selecting a row calls\n\t * `onAdd(id)`; the picker's \"Create new\" row (sub-agents) calls\n\t * `createOption.onSelect`.\n\t /\n\tmentionItems?: MentionItem[];\n\t/\n\t Built-in \"action\" tools (e.g. Rest API / Handover to email) that open a\n\t * config drawer via `onSelect` instead of adding a mention. Shown as\n\t * empty-state source buttons (only while no items exist, alongside\n\t * `sourceGroups`) AND as rows inside the `@` picker's Tools view.\n\t /\n\tactionSources?: ToolAction[];\n}\n\nexport const SelectableListSection: React.FC<SelectableListSectionProps> = ({\n\ttitle,\n\thelper,\n\titems,\n\taddableOptions,\n\tonAdd,\n\tonRemove,\n\tdataTestPrefix,\n\temptyText,\n\tcreateOption,\n\tonConfigure,\n\tsourceGroups,\n\tmentionItems,\n\tactionSources,\n}) => {\n\tconst [adding, setAdding] = useState(false);\n\t// Tools: which source's searchable list is open (null = just show the buttons).\n\tconst [activeSource, setActiveSource] = useState<string \| null>(null);\n\tconst hasSourceGroups = !!sourceGroups && sourceGroups.length > 0;\n\tconst activeGroup = sourceGroups?.find((g) => g.source === activeSource);\n\t// When set, \"+\" opens the `@` MentionPicker popover instead of a select input.\n\tconst usePicker = mentionItems !== undefined;\n\t// Separate anchors for the header \"+\" popover and the empty-state source-button\n\t// popover — when empty both render at once, so a shared ref would misfire the\n\t// outside-click check (closing the header picker when a source row is clicked).\n\tconst headerPickerRef = useRef<HTMLDivElement>(null);\n\tconst sourcePickerRef = useRef<HTMLDivElement>(null);\n\t// Source (Shopify / Manifest) the empty-state button opened the picker into;\n\t// null when \"+\" opened it at the root source list.\n\tconst [pickerSource, setPickerSource] = useState<string \| null>(null);\n\n\t// Dismiss the picker popover on outside click / Escape.\n\tuseEffect(() => {\n\t\tif (!usePicker \|\| !adding) {\n\t\t\treturn;\n\t\t}\n\t\tconst onDocMouseDown = (e: MouseEvent) => {\n\t\t\tconst target = e.target as Node;\n\t\t\tif (\n\t\t\t\t!headerPickerRef.current?.contains(target) &&\n\t\t\t\t!sourcePickerRef.current?.contains(target)\n\t\t\t) {\n\t\t\t\tsetAdding(false);\n\t\t\t}\n\t\t};\n\t\tconst onKeyDown = (e: KeyboardEvent) => {\n\t\t\tif (e.key === 'Escape') {\n\t\t\t\tsetAdding(false);\n\t\t\t}\n\t\t};\n\t\tdocument.addEventListener('mousedown', onDocMouseDown);\n\t\tdocument.addEventListener('keydown', onKeyDown);\n\t\treturn () => {\n\t\t\tdocument.removeEventListener('mousedown', onDocMouseDown);\n\t\t\tdocument.removeEventListener('keydown', onKeyDown);\n\t\t};\n\t}, [usePicker, adding]);\n\n\t// Header \"+\" picks an EXISTING item (and, once some exist, re-creates via the\n\t// dropdown's footer row). With an empty list + a createOption the body shows a\n\t// dedicated \"Create new\" button instead, so the header \"+\" would be redundant.\n\t// In picker mode the \"+\" always shows (even empty) — for tools it sits next to\n\t// the empty-state source buttons; the create flow lives inside the picker.\n\tconst showAddButton = hasSourceGroups\n\t\t? usePicker \|\| items.length > 0\n\t\t: usePicker \|\|\n\t\t addableOptions.length > 0 \|\|\n\t\t (!!createOption && items.length > 0);\n\t// Empty state offers a one-click \"Create new\" (sub-agents) rather than burying\n\t// it behind a single-item dropdown. In picker mode the \"+\" opens the picker\n\t// (with its own \"Create new\" row) instead, so skip the standalone button.\n\tconst showEmptyCreate =\n\t\titems.length === 0 && !!createOption && !hasSourceGroups && !usePicker;\n\tconst hasActionSources = !!actionSources && actionSources.length > 0;\n\t// Source buttons ONLY while no item is added — the tool sources (Manifest /\n\t// Shopify …) plus the built-in action tools (Rest API / Handover to email).\n\t// Once an item exists, adding more uses the header \"+\" → picker (the buttons\n\t// never come back); the action tools still live inside that picker.\n\tconst showSourceButtons =\n\t\t(hasSourceGroups \|\| hasActionSources) && items.length === 0;\n\t// Nothing existing to pick → skip the 1-item dropdown and create directly.\n\tconst handleAddClick = () => {\n\t\tif (usePicker) {\n\t\t\t// Toggle the `@` reference-picker popover (rendered under the \"+\"), opened\n\t\t\t// at the root source list (no pre-drilled source).\n\t\t\tsetPickerSource(null);\n\t\t\tsetAdding((v) => !v);\n\t\t\treturn;\n\t\t}\n\t\tif (hasSourceGroups) {\n\t\t\tsetActiveSource(null);\n\t\t\tsetAdding((v) => !v);\n\t\t\treturn;\n\t\t}\n\t\tif (addableOptions.length === 0 && createOption) {\n\t\t\tcreateOption.onSelect();\n\t\t\treturn;\n\t\t}\n\t\tsetAdding((v) => !v);\n\t};\n\n\tconst renderChipRows = () =>\n\t\titems.map((item) => {\n\t\t\t// Per-item configure wins; otherwise fall back to the section-level one.\n\t\t\tconst configure =\n\t\t\t\titem.onConfigure ??\n\t\t\t\t(onConfigure ? () => onConfigure(item.id) : undefined);\n\t\t\treturn (\n\t\t\t\t<SelectableRow\n\t\t\t\t\tkey={item.id}\n\t\t\t\t\tdata-test={`${dataTestPrefix}-row-${item.id}`}\n\t\t\t\t>\n\t\t\t\t\t{renderSourceIcon(item.icon)}\n\t\t\t\t\t<RowText>\n\t\t\t\t\t\t<BodySecondary numberOfLines={1} color={COLORS.content.primary}>\n\t\t\t\t\t\t\t{item.label}\n\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t</RowText>\n\t\t\t\t\t<RowActions>\n\t\t\t\t\t\t{configure && (\n\t\t\t\t\t\t\t// Configurable rows (sub-agents, Rest API / email tools) get an\n\t\t\t\t\t\t\t// always-visible edit icon.\n\t\t\t\t\t\t\t<RowMenuButton\n\t\t\t\t\t\t\t\tdata-test={`${dataTestPrefix}-edit-${item.id}`}\n\t\t\t\t\t\t\t\taria-label={`Edit ${item.label}`}\n\t\t\t\t\t\t\t\tonClick={configure}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<EditIcon\n\t\t\t\t\t\t\t\t\twidth={16}\n\t\t\t\t\t\t\t\t\theight={16}\n\t\t\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</RowMenuButton>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t{configure && <RowActionDivider aria-hidden />}\n\t\t\t\t\t\t<RowMenuButton\n\t\t\t\t\t\t\tdata-test={`${dataTestPrefix}-delete-${item.id}`}\n\t\t\t\t\t\t\taria-label={`Delete ${item.label}`}\n\t\t\t\t\t\t\tonClick={() => onRemove(item.id)}\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</RowMenuButton>\n\t\t\t\t\t</RowActions>\n\t\t\t\t</SelectableRow>\n\t\t\t);\n\t\t});\n\t// \"Create new\" is a brand-coloured footer row at the BOTTOM of the dropdown,\n\t// separated from the selectable items by a divider.\n\tconst dropdownOptions: SingleOption[] = createOption\n\t\t? [\n\t\t\t\t...addableOptions,\n\t\t\t\t{\n\t\t\t\t\tlabel: createOption.label,\n\t\t\t\t\tvalue: CREATE_OPTION_VALUE,\n\t\t\t\t\tsearchKey: createOption.label,\n\t\t\t\t\tcustomComponent: (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\t\ttextAlign: 'center',\n\t\t\t\t\t\t\t\tcolor: COLORS.content.brand,\n\t\t\t\t\t\t\t\tfontFamily: 'Inter',\n\t\t\t\t\t\t\t\tfontSize: 14,\n\t\t\t\t\t\t\t\tfontWeight: 600,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{createOption.label}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t),\n\t\t\t\t},\n\t\t ]\n\t\t: addableOptions;\n\n\t// One picker instance reused by the header \"+\" and the empty-state source\n\t// buttons. `key` remounts it so a source button re-drills into its own tools\n\t// (the initial drill-in level is read once, on mount).\n\tconst pickerNode = usePicker ? (\n\t\t<MentionPicker\n\t\t\tkey={pickerSource ?? '__root__'}\n\t\t\titems={mentionItems ?? []}\n\t\t\tquery=\"\"\n\t\t\tactiveIndex={0}\n\t\t\tinitialSource={pickerSource ?? undefined}\n\t\t\tonSelect={(item) => {\n\t\t\t\tsetAdding(false);\n\t\t\t\tonAdd(String(item.id));\n\t\t\t}}\n\t\t\tonClose={() => setAdding(false)}\n\t\t\tonCreateSubAgent={\n\t\t\t\tcreateOption\n\t\t\t\t\t? () => {\n\t\t\t\t\t\t\tsetAdding(false);\n\t\t\t\t\t\t\tcreateOption.onSelect();\n\t\t\t\t\t }\n\t\t\t\t\t: undefined\n\t\t\t}\n\t\t\ttoolActions={\n\t\t\t\thasActionSources\n\t\t\t\t\t? actionSources?.map((a) => ({\n\t\t\t\t\t\t\t...a,\n\t\t\t\t\t\t\tonSelect: () => {\n\t\t\t\t\t\t\t\tsetAdding(false);\n\t\t\t\t\t\t\t\ta.onSelect();\n\t\t\t\t\t\t\t},\n\t\t\t\t\t }))\n\t\t\t\t\t: undefined\n\t\t\t}\n\t\t/>\n\t) : null;\n\n\treturn (\n\t\t<SideSection>\n\t\t\t<SideSectionHeader>\n\t\t\t\t<TitleSmall color={COLORS.content.primary}>{title}</TitleSmall>\n\t\t\t\t{showAddButton && (\n\t\t\t\t\t<AddButtonWrap ref={headerPickerRef}>\n\t\t\t\t\t\t<AddIconButton\n\t\t\t\t\t\t\tdata-test={`${dataTestPrefix}-add`}\n\t\t\t\t\t\t\tonClick={handleAddClick}\n\t\t\t\t\t\t\taria-label={`Add ${title}`}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<PlusIcon width={20} height={20} color={COLORS.content.brand} />\n\t\t\t\t\t\t</AddIconButton>\n\t\t\t\t\t\t{usePicker && adding && pickerSource === null && (\n\t\t\t\t\t\t\t<PickerPopover data-test={`${dataTestPrefix}-picker`}>\n\t\t\t\t\t\t\t\t{pickerNode}\n\t\t\t\t\t\t\t</PickerPopover>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</AddButtonWrap>\n\t\t\t\t)}\n\t\t\t</SideSectionHeader>\n\n\t\t\t{helper && (\n\t\t\t\t<BodyCaption color={COLORS.content.secondary}>{helper}</BodyCaption>\n\t\t\t)}\n\n\t\t\t{showSourceButtons ? (\n\t\t\t\t<SourcePickerAnchor ref={usePicker ? sourcePickerRef : undefined}>\n\t\t\t\t\t{/ No tools yet: one button per source (never shown once a tool exists). /}\n\t\t\t\t\t<SourceButtonRow data-test={`${dataTestPrefix}-sources`}>\n\t\t\t\t\t\t{sourceGroups?.map((g) => (\n\t\t\t\t\t\t\t<SourceButton\n\t\t\t\t\t\t\t\tkey={g.source}\n\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\tdata-test={`${dataTestPrefix}-source-${g.source}`}\n\t\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\t\tif (usePicker) {\n\t\t\t\t\t\t\t\t\t\t// Open the `@` picker drilled straight into this source's tools.\n\t\t\t\t\t\t\t\t\t\tsetPickerSource(g.source);\n\t\t\t\t\t\t\t\t\t\tsetAdding(true);\n\t\t\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tsetActiveSource(g.source);\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{renderSourceIcon(SOURCE_ICONS[g.source], -4)}\n\t\t\t\t\t\t\t\t<BodySecondary color={COLORS.content.primary}>\n\t\t\t\t\t\t\t\t\t{g.label}\n\t\t\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t\t\t</SourceButton>\n\t\t\t\t\t\t))}\n\t\t\t\t\t\t{/ Built-in action tools (Rest API / Handover to email) open a drawer. /}\n\t\t\t\t\t\t{actionSources?.map((a) => (\n\t\t\t\t\t\t\t<SourceButton\n\t\t\t\t\t\t\t\tkey={a.source}\n\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\tdata-test={`${dataTestPrefix}-action-${a.source}`}\n\t\t\t\t\t\t\t\tonClick={a.onSelect}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{renderSourceIcon(a.icon, -4)}\n\t\t\t\t\t\t\t\t<BodySecondary color={COLORS.content.primary}>\n\t\t\t\t\t\t\t\t\t{a.label}\n\t\t\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t\t\t</SourceButton>\n\t\t\t\t\t\t))}\n\t\t\t\t\t</SourceButtonRow>\n\n\t\t\t\t\t{/ Picker mode: clicking a source opens its tools in the `@` picker. /}\n\t\t\t\t\t{usePicker && adding && pickerSource !== null && (\n\t\t\t\t\t\t<PickerPopover $align=\"left\" data-test={`${dataTestPrefix}-picker`}>\n\t\t\t\t\t\t\t{pickerNode}\n\t\t\t\t\t\t</PickerPopover>\n\t\t\t\t\t)}\n\n\t\t\t\t\t{/ Legacy (non-picker) mode: chosen source → its searchable tool list. */}\n\t\t\t\t\t{!usePicker && activeGroup && (\n\t\t\t\t\t\t<Dropdown\n\t\t\t\t\t\t\tdata-test={`${dataTestPrefix}-dropdown`}\n\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\twidth=\"100%\"\n\t\t\t\t\t\t\tisSearchable\n\t\t\t\t\t\t\tplaceHolder={`Search ${activeGroup.label} tools`}\n\t\t\t\t\t\t\toptions={activeGroup.options}\n\t\t\t\t\t\t\tonSelect={(opt) => {\n\t\t\t\t\t\t\t\tconst v = unwrapDropdownValue(opt);\n\t\t\t\t\t\t\t\tsetActiveSource(null);\n\t\t\t\t\t\t\t\tsetAdding(false);\n\t\t\t\t\t\t\t\tif (v) {\n\t\t\t\t\t\t\t\t\tonAdd(v);\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</SourcePickerAnchor>\n\t\t\t) : (\n\t\t\t\t<>\n\t\t\t\t\t{!usePicker && adding && dropdownOptions.length > 0 && (\n\t\t\t\t\t\t<Dropdown\n\t\t\t\t\t\t\tdata-test={`${dataTestPrefix}-dropdown`}\n\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\twidth=\"100%\"\n\t\t\t\t\t\t\tisSearchable\n\t\t\t\t\t\t\tplaceHolder={`Select ${title.toLowerCase()}`}\n\t\t\t\t\t\t\toptions={dropdownOptions}\n\t\t\t\t\t\t\tonSelect={(opt) => {\n\t\t\t\t\t\t\t\tconst v = unwrapDropdownValue(opt);\n\t\t\t\t\t\t\t\tsetAdding(false);\n\t\t\t\t\t\t\t\tif (!v) {\n\t\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tif (v === CREATE_OPTION_VALUE) {\n\t\t\t\t\t\t\t\t\tcreateOption?.onSelect();\n\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\tonAdd(v);\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\n\t\t\t\t\t{items.length === 0 && !adding ? (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t<BodyCaption color={COLORS.content.placeholder}>\n\t\t\t\t\t\t\t\t{emptyText}\n\t\t\t\t\t\t\t</BodyCaption>\n\t\t\t\t\t\t\t{showEmptyCreate && createOption && (\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tdata-test={`${dataTestPrefix}-create`}\n\t\t\t\t\t\t\t\t\tbuttonType=\"secondary\"\n\t\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\t\tmatchParentWidth\n\t\t\t\t\t\t\t\t\tLeadingIcon={PlusIcon}\n\t\t\t\t\t\t\t\t\tbuttonText={createOption.label}\n\t\t\t\t\t\t\t\t\tonClick={createOption.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) : (\n\t\t\t\t\t\trenderChipRows()\n\t\t\t\t\t)}\n\t\t\t\t</>\n\t\t\t)}\n\t\t</SideSection>\n\t);\n};\n\n// Anchors the `@`-picker popover to the header \"+\" button.\nconst AddButtonWrap = styled.div`\n\tposition: relative;\n\tdisplay: flex;\n`;\n\n// Anchors the `@`-picker popover to the empty-state source buttons.\nconst SourcePickerAnchor = styled.div`\n\tposition: relative;\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 8px;\n`;\n\n// Floating card under the trigger. Aligns to the \"+\" (right) or the source\n// buttons (left) so it stays inside the side panel.\nconst PickerPopover = styled.div<{ $align?: 'left' \| 'right' }>`\n\tposition: absolute;\n\ttop: calc(100% + 4px);\n\t${(p) => (p.$align === 'left' ? 'left: 0;' : 'right: 0;')}\n\tz-index: 30;\n`;\n"],"names":["CREATE_OPTION_VALUE","SelectableListSection","title","helper","items","addableOptions","onAdd","onRemove","dataTestPrefix","emptyText","createOption","onConfigure","sourceGroups","mentionItems","actionSources","adding","setAdding","useState","activeSource","setActiveSource","hasSourceGroups","activeGroup","g","usePicker","headerPickerRef","useRef","sourcePickerRef","pickerSource","setPickerSource","useEffect","onDocMouseDown","e","target","onKeyDown","showAddButton","showEmptyCreate","hasActionSources","showSourceButtons","handleAddClick","v","renderChipRows","item","configure","jsxs","SelectableRow","renderSourceIcon","jsx","RowText","BodySecondary","COLORS","RowActions","RowMenuButton","EditIcon","RowActionDivider","DeleteIcon","dropdownOptions","pickerNode","MentionPicker","a","SideSection","SideSectionHeader","TitleSmall","AddButtonWrap","AddIconButton","PlusIcon","PickerPopover","BodyCaption","SourcePickerAnchor","SourceButtonRow","SourceButton","SOURCE_ICONS","Dropdown","opt","unwrapDropdownValue","Fragment","Button","styled","p"],"mappings":"iqBAwDMA,EAAsB,qBAmDfC,GAA8D,CAAC,CAC3E,MAAAC,EACA,OAAAC,EACA,MAAAC,EACA,eAAAC,EACA,MAAAC,EACA,SAAAC,EACA,eAAAC,EACA,UAAAC,EACA,aAAAC,EACA,YAAAC,EACA,aAAAC,EACA,aAAAC,EACA,cAAAC,CACD,IAAM,CACL,KAAM,CAACC,EAAQC,CAAS,EAAIC,EAAAA,SAAS,EAAK,EAEpC,CAACC,EAAcC,CAAe,EAAIF,EAAAA,SAAwB,IAAI,EAC9DG,EAAkB,CAAC,CAACR,GAAgBA,EAAa,OAAS,EAC1DS,EAAcT,GAAc,KAAMU,GAAMA,EAAE,SAAWJ,CAAY,EAEjEK,EAAYV,IAAiB,OAI7BW,EAAkBC,EAAAA,OAAuB,IAAI,EAC7CC,EAAkBD,EAAAA,OAAuB,IAAI,EAG7C,CAACE,EAAcC,CAAe,EAAIX,EAAAA,SAAwB,IAAI,EAGpEY,EAAAA,UAAU,IAAM,CACf,GAAI,CAACN,GAAa,CAACR,EAClB,OAED,MAAMe,EAAkBC,GAAkB,CACzC,MAAMC,EAASD,EAAE,OAEhB,CAACP,EAAgB,SAAS,SAASQ,CAAM,GACzC,CAACN,EAAgB,SAAS,SAASM,CAAM,GAEzChB,EAAU,EAAK,CAEjB,EACMiB,EAAaF,GAAqB,CACnCA,EAAE,MAAQ,UACbf,EAAU,EAAK,CAEjB,EACA,gBAAS,iBAAiB,YAAac,CAAc,EACrD,SAAS,iBAAiB,UAAWG,CAAS,EACvC,IAAM,CACZ,SAAS,oBAAoB,YAAaH,CAAc,EACxD,SAAS,oBAAoB,UAAWG,CAAS,CAClD,CACD,EAAG,CAACV,EAAWR,CAAM,CAAC,EAOtB,MAAMmB,EAAgBd,EACnBG,GAAanB,EAAM,OAAS,EAC5BmB,GACAlB,EAAe,OAAS,GACvB,CAAC,CAACK,GAAgBN,EAAM,OAAS,EAI/B+B,EACL/B,EAAM,SAAW,GAAK,CAAC,CAACM,GAAgB,CAACU,GAAmB,CAACG,EACxDa,EAAmB,CAAC,CAACtB,GAAiBA,EAAc,OAAS,EAK7DuB,GACJjB,GAAmBgB,IAAqBhC,EAAM,SAAW,EAErDkC,EAAiB,IAAM,CAC5B,GAAIf,EAAW,CAGdK,EAAgB,IAAI,EACpBZ,EAAWuB,GAAM,CAACA,CAAC,EACnB,MACD,CACA,GAAInB,EAAiB,CACpBD,EAAgB,IAAI,EACpBH,EAAWuB,GAAM,CAACA,CAAC,EACnB,MACD,CACA,GAAIlC,EAAe,SAAW,GAAKK,EAAc,CAChDA,EAAa,SAAA,EACb,MACD,CACAM,EAAWuB,GAAM,CAACA,CAAC,CACpB,EAEMC,EAAiB,IACtBpC,EAAM,IAAKqC,GAAS,CAEnB,MAAMC,EACLD,EAAK,cACJ9B,EAAc,IAAMA,EAAY8B,EAAK,EAAE,EAAI,QAC7C,OACCE,EAAAA,KAACC,EAAAA,cAAA,CAEA,YAAW,GAAGpC,CAAc,QAAQiC,EAAK,EAAE,GAE1C,SAAA,CAAAI,EAAAA,iBAAiBJ,EAAK,IAAI,EAC3BK,EAAAA,IAACC,EAAAA,QAAA,CACA,SAAAD,EAAAA,IAACE,EAAAA,cAAA,CAAc,cAAe,EAAG,MAAOC,EAAAA,OAAO,QAAQ,QACrD,SAAAR,EAAK,KAAA,CACP,EACD,SACCS,EAAAA,WAAA,CACC,SAAA,CAAAR,GAGAI,EAAAA,IAACK,EAAAA,cAAA,CACA,YAAW,GAAG3C,CAAc,SAASiC,EAAK,EAAE,GAC5C,aAAY,QAAQA,EAAK,KAAK,GAC9B,QAASC,EAET,SAAAI,EAAAA,IAACM,EAAAA,QAAA,CACA,MAAO,GACP,OAAQ,GACR,MAAOH,EAAAA,OAAO,QAAQ,SAAA,CAAA,CACvB,CAAA,EAGDP,GAAaI,EAAAA,IAACO,EAAAA,iBAAA,CAAiB,cAAW,EAAA,CAAC,EAC5CP,EAAAA,IAACK,EAAAA,cAAA,CACA,YAAW,GAAG3C,CAAc,WAAWiC,EAAK,EAAE,GAC9C,aAAY,UAAUA,EAAK,KAAK,GAChC,QAAS,IAAMlC,EAASkC,EAAK,EAAE,EAE/B,SAAAK,EAAAA,IAACQ,EAAAA,QAAA,CACA,MAAO,GACP,OAAQ,GACR,MAAOL,EAAAA,OAAO,QAAQ,SAAA,CAAA,CACvB,CAAA,CACD,CAAA,CACD,CAAA,CAAA,EArCKR,EAAK,EAAA,CAwCb,CAAC,EAGIc,EAAkC7C,EACrC,CACA,GAAGL,EACH,CACC,MAAOK,EAAa,MACpB,MAAOV,EACP,UAAWU,EAAa,MACxB,gBACCoC,EAAAA,IAAC,MAAA,CACA,MAAO,CACN,MAAO,OACP,UAAW,SACX,MAAOG,EAAAA,OAAO,QAAQ,MACtB,WAAY,QACZ,SAAU,GACV,WAAY,GAAA,EAGZ,SAAAvC,EAAa,KAAA,CAAA,CACf,CAEF,EAEAL,EAKGmD,EAAajC,EAClBuB,EAAAA,IAACW,EAAAA,cAAA,CAEA,MAAO5C,GAAgB,CAAA,EACvB,MAAM,GACN,YAAa,EACb,cAAec,GAAgB,OAC/B,SAAWc,GAAS,CACnBzB,EAAU,EAAK,EACfV,EAAM,OAAOmC,EAAK,EAAE,CAAC,CACtB,EACA,QAAS,IAAMzB,EAAU,EAAK,EAC9B,iBACCN,EACG,IAAM,CACNM,EAAU,EAAK,EACfN,EAAa,SAAA,CACb,EACA,OAEJ,YACC0B,EACGtB,GAAe,IAAK4C,IAAO,CAC3B,GAAGA,EACH,SAAU,IAAM,CACf1C,EAAU,EAAK,EACf0C,EAAE,SAAA,CACH,CAAA,EACE,EACF,MAAA,EA3BC/B,GAAgB,UAAA,EA8BnB,KAEJ,cACEgC,cAAA,CACA,SAAA,CAAAhB,OAACiB,EAAAA,kBAAA,CACA,SAAA,CAAAd,MAACe,EAAAA,WAAA,CAAW,MAAOZ,EAAAA,OAAO,QAAQ,QAAU,SAAA/C,EAAM,EACjDgC,GACAS,EAAAA,KAACmB,GAAA,CAAc,IAAKtC,EACnB,SAAA,CAAAsB,EAAAA,IAACiB,EAAAA,cAAA,CACA,YAAW,GAAGvD,CAAc,OAC5B,QAAS8B,EACT,aAAY,OAAOpC,CAAK,GAExB,SAAA4C,EAAAA,IAACkB,WAAS,MAAO,GAAI,OAAQ,GAAI,MAAOf,SAAO,QAAQ,KAAA,CAAO,CAAA,CAAA,EAE9D1B,GAAaR,GAAUY,IAAiB,MACxCmB,EAAAA,IAACmB,GAAc,YAAW,GAAGzD,CAAc,UACzC,SAAAgD,CAAA,CACF,CAAA,CAAA,CAEF,CAAA,EAEF,EAECrD,GACA2C,EAAAA,IAACoB,EAAAA,YAAA,CAAY,MAAOjB,SAAO,QAAQ,UAAY,SAAA9C,EAAO,EAGtDkC,EACAM,EAAAA,KAACwB,GAAA,CAAmB,IAAK5C,EAAYG,EAAkB,OAEtD,SAAA,CAAAiB,EAAAA,KAACyB,EAAAA,gBAAA,CAAgB,YAAW,GAAG5D,CAAc,WAC3C,SAAA,CAAAI,GAAc,IAAKU,GACnBqB,EAAAA,KAAC0B,EAAAA,aAAA,CAEA,KAAK,SACL,YAAW,GAAG7D,CAAc,WAAWc,EAAE,MAAM,GAC/C,QAAS,IAAM,CACd,GAAIC,EAAW,CAEdK,EAAgBN,EAAE,MAAM,EACxBN,EAAU,EAAI,EACd,MACD,CACAG,EAAgBG,EAAE,MAAM,CACzB,EAEC,SAAA,CAAAuB,EAAAA,iBAAiByB,EAAAA,aAAahD,EAAE,MAAM,EAAG,EAAE,QAC3C0B,EAAAA,cAAA,CAAc,MAAOC,EAAAA,OAAO,QAAQ,QACnC,WAAE,KAAA,CACJ,CAAA,CAAA,EAhBK3B,EAAE,MAAA,CAkBR,EAEAR,GAAe,IAAK4C,GACpBf,EAAAA,KAAC0B,EAAAA,aAAA,CAEA,KAAK,SACL,YAAW,GAAG7D,CAAc,WAAWkD,EAAE,MAAM,GAC/C,QAASA,EAAE,SAEV,SAAA,CAAAb,mBAAiBa,EAAE,KAAM,EAAE,QAC3BV,EAAAA,cAAA,CAAc,MAAOC,EAAAA,OAAO,QAAQ,QACnC,WAAE,KAAA,CACJ,CAAA,CAAA,EARKS,EAAE,MAAA,CAUR,CAAA,EACF,EAGCnC,GAAaR,GAAUY,IAAiB,MACxCmB,EAAAA,IAACmB,EAAA,CAAc,OAAO,OAAO,YAAW,GAAGzD,CAAc,UACvD,SAAAgD,EACF,EAIA,CAACjC,GAAaF,GACdyB,EAAAA,IAACyB,EAAAA,SAAA,CACA,YAAW,GAAG/D,CAAc,YAC5B,KAAK,QACL,MAAM,OACN,aAAY,GACZ,YAAa,UAAUa,EAAY,KAAK,SACxC,QAASA,EAAY,QACrB,SAAWmD,GAAQ,CAClB,MAAMjC,EAAIkC,EAAAA,oBAAoBD,CAAG,EACjCrD,EAAgB,IAAI,EACpBH,EAAU,EAAK,EACXuB,GACHjC,EAAMiC,CAAC,CAET,CAAA,CAAA,CACD,CAAA,CAEF,EAEAI,EAAAA,KAAA+B,EAAAA,SAAA,CACE,SAAA,CAAA,CAACnD,GAAaR,GAAUwC,EAAgB,OAAS,GACjDT,EAAAA,IAACyB,EAAAA,SAAA,CACA,YAAW,GAAG/D,CAAc,YAC5B,KAAK,QACL,MAAM,OACN,aAAY,GACZ,YAAa,UAAUN,EAAM,YAAA,CAAa,GAC1C,QAASqD,EACT,SAAWiB,GAAQ,CAClB,MAAMjC,EAAIkC,EAAAA,oBAAoBD,CAAG,EACjCxD,EAAU,EAAK,EACVuB,IAGDA,IAAMvC,EACTU,GAAc,SAAA,EAEdJ,EAAMiC,CAAC,EAET,CAAA,CAAA,EAIDnC,EAAM,SAAW,GAAK,CAACW,EACvB4B,OAAA+B,EAAAA,SAAA,CACC,SAAA,CAAA5B,MAACoB,EAAAA,YAAA,CAAY,MAAOjB,EAAAA,OAAO,QAAQ,YACjC,SAAAxC,EACF,EACC0B,GAAmBzB,GACnBoC,EAAAA,IAAC6B,EAAAA,OAAA,CACA,YAAW,GAAGnE,CAAc,UAC5B,WAAW,YACX,KAAK,QACL,iBAAgB,GAChB,YAAawD,EAAAA,QACb,WAAYtD,EAAa,MACzB,QAASA,EAAa,QAAA,CAAA,CACvB,CAAA,CAEF,EAEA8B,EAAA,CAAe,CAAA,CAEjB,CAAA,EAEF,CAEF,EAGMsB,GAAgBc,EAAAA,QAAO;AAAA;AAAA;AAAA,EAMvBT,GAAqBS,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA,EAS5BX,EAAgBW,EAAAA,QAAO;AAAA;AAAA;AAAA,GAGzBC,GAAOA,EAAE,SAAW,OAAS,WAAa,WAAY;AAAA;AAAA"}
1	+ {"version":3,"file":"SelectableListSection.js","sources":["../../../../../src/components/agent-builder/components/SelectableListSection.tsx"],"sourcesContent":["import DeleteIcon from '@src/assets/icons/delete.svg';\nimport EditIcon from '@src/assets/icons/edit.svg';\nimport PlusIcon from '@src/assets/icons/plus.svg';\nimport { MentionItem } from '@src/editor';\nimport React, { useEffect, 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 { DeleteConfirmationModal } from '@src/components/states-modal';\nimport {\n\tBodyCaption,\n\tBodySecondary,\n\tTitleSmall,\n} from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport {\n\tAddIconButton,\n\tRowActionDivider,\n\tRowActions,\n\tRowMenuButton,\n\tRowText,\n\tSelectableRow,\n\tSideSection,\n\tSideSectionHeader,\n\tSourceButton,\n\tSourceButtonRow,\n} from '../AgentBuilder.styled';\nimport { ToolAction } from '../constants/tools';\nimport {\n\trenderSourceIcon,\n\tSOURCE_ICONS,\n\tSourceIcon,\n} from '../utils/sourceIcons';\nimport { MentionPicker } from './MentionPicker';\n\nexport interface SelectableItem {\n\tid: string;\n\tlabel: string;\n\t/** Leading brand glyph (e.g. a tool's source icon). /\n\ticon?: SourceIcon;\n\t/\n\t When set, this row shows an edit (Configure) icon that calls this instead of\n\t * the section-level `onConfigure`. Use for rows that open their own drawer\n\t * (e.g. a configured Rest API / email-handover tool).\n\t /\n\tonConfigure?: () => void;\n}\n\n/* A tool source for the empty-state picker (Tools): a button → its searchable list. /\nexport interface SourceGroup {\n\tsource: string;\n\tlabel: string;\n\toptions: SingleOption[];\n}\n\n/* Sentinel value for the \"create new\" entry in the add dropdown. /\nconst CREATE_OPTION_VALUE = '__bik_create_new__';\n\ninterface SelectableListSectionProps {\n\ttitle: string;\n\thelper?: string;\n\titems: SelectableItem[];\n\t/\n\t Options shown in the add dropdown. Pass ALL items (not just unselected\n\t * ones) when re-picking an already-added item is allowed (e.g. to insert its\n\t * mention again) — the chip list still shows each item only once.\n\t /\n\taddableOptions: SingleOption[];\n\tonAdd: (id: string) => void;\n\tonRemove: (id: string) => void;\n\tdataTestPrefix: string;\n\temptyText: string;\n\t/\n\t Adds a \"create new\" entry at the top of the add dropdown (e.g. \"Create\n\t * sub-agent\"). Selecting it calls `onSelect` instead of `onAdd`.\n\t /\n\tcreateOption?: { label: string; onSelect: () => void };\n\t/\n\t When provided, each row shows an edit (Configure) icon next to Delete.\n\t * Omit for tools (Delete only).\n\t /\n\tonConfigure?: (id: string) => void;\n\t/\n\t Tool sources (e.g. Manifest / Shopify). When set, the empty state shows a\n\t * button per source; clicking one reveals a searchable dropdown of just that\n\t * source's options. Selecting calls `onAdd`. Takes precedence over the plain\n\t * `addableOptions` dropdown.\n\t /\n\tsourceGroups?: SourceGroup[];\n\t/\n\t When provided, the header \"+\" opens the same `@` reference picker used in the\n\t * Instructions editor (a {@link MentionPicker} popover) instead of the inline\n\t * select dropdown. Pass the items for THIS section only (tools OR sub-agents) —\n\t * the picker auto-drills into the single category. Selecting a row calls\n\t * `onAdd(id)`; the picker's \"Create new\" row (sub-agents) calls\n\t * `createOption.onSelect`.\n\t /\n\tmentionItems?: MentionItem[];\n\t/\n\t Built-in \"action\" tools (e.g. Rest API / Handover to email) that open a\n\t * config drawer via `onSelect` instead of adding a mention. Shown as\n\t * empty-state source buttons (only while no items exist, alongside\n\t * `sourceGroups`) AND as rows inside the `@` picker's Tools view.\n\t /\n\tactionSources?: ToolAction[];\n\t/\n\t When set, the row Delete icon opens a confirmation modal (instead of\n\t * removing immediately); `onRemove` runs only on confirm. `noun` fills the one\n\t * shared message template (\"Delete this <noun>?\" …); `zIndex` raises the modal\n\t * above a parent drawer. Omit to delete directly.\n\t /\n\tconfirmDelete?: { noun: string; zIndex?: number };\n}\n\nexport const SelectableListSection: React.FC<SelectableListSectionProps> = ({\n\ttitle,\n\thelper,\n\titems,\n\taddableOptions,\n\tonAdd,\n\tonRemove,\n\tdataTestPrefix,\n\temptyText,\n\tcreateOption,\n\tonConfigure,\n\tsourceGroups,\n\tmentionItems,\n\tactionSources,\n\tconfirmDelete,\n}) => {\n\tconst [adding, setAdding] = useState(false);\n\t// Row id awaiting delete confirmation (null = modal closed).\n\tconst [pendingDeleteId, setPendingDeleteId] = useState<string \| null>(null);\n\t// Tools: which source's searchable list is open (null = just show the buttons).\n\tconst [activeSource, setActiveSource] = useState<string \| null>(null);\n\tconst hasSourceGroups = !!sourceGroups && sourceGroups.length > 0;\n\tconst activeGroup = sourceGroups?.find((g) => g.source === activeSource);\n\t// When set, \"+\" opens the `@` MentionPicker popover instead of a select input.\n\tconst usePicker = mentionItems !== undefined;\n\t// Separate anchors for the header \"+\" popover and the empty-state source-button\n\t// popover — when empty both render at once, so a shared ref would misfire the\n\t// outside-click check (closing the header picker when a source row is clicked).\n\tconst headerPickerRef = useRef<HTMLDivElement>(null);\n\tconst sourcePickerRef = useRef<HTMLDivElement>(null);\n\t// Source (Shopify / Manifest) the empty-state button opened the picker into;\n\t// null when \"+\" opened it at the root source list.\n\tconst [pickerSource, setPickerSource] = useState<string \| null>(null);\n\n\t// Dismiss the picker popover on outside click / Escape.\n\tuseEffect(() => {\n\t\tif (!usePicker \|\| !adding) {\n\t\t\treturn;\n\t\t}\n\t\tconst onDocMouseDown = (e: MouseEvent) => {\n\t\t\tconst target = e.target as Node;\n\t\t\tif (\n\t\t\t\t!headerPickerRef.current?.contains(target) &&\n\t\t\t\t!sourcePickerRef.current?.contains(target)\n\t\t\t) {\n\t\t\t\tsetAdding(false);\n\t\t\t}\n\t\t};\n\t\tconst onKeyDown = (e: KeyboardEvent) => {\n\t\t\tif (e.key === 'Escape') {\n\t\t\t\tsetAdding(false);\n\t\t\t}\n\t\t};\n\t\tdocument.addEventListener('mousedown', onDocMouseDown);\n\t\tdocument.addEventListener('keydown', onKeyDown);\n\t\treturn () => {\n\t\t\tdocument.removeEventListener('mousedown', onDocMouseDown);\n\t\t\tdocument.removeEventListener('keydown', onKeyDown);\n\t\t};\n\t}, [usePicker, adding]);\n\n\t// Header \"+\" picks an EXISTING item (and, once some exist, re-creates via the\n\t// dropdown's footer row). With an empty list + a createOption the body shows a\n\t// dedicated \"Create new\" button instead, so the header \"+\" would be redundant.\n\t// In picker mode the \"+\" always shows (even empty) — for tools it sits next to\n\t// the empty-state source buttons; the create flow lives inside the picker.\n\tconst showAddButton = hasSourceGroups\n\t\t? usePicker \|\| items.length > 0\n\t\t: usePicker \|\|\n\t\t addableOptions.length > 0 \|\|\n\t\t (!!createOption && items.length > 0);\n\t// Empty state offers a one-click \"Create new\" (sub-agents) rather than burying\n\t// it behind a single-item dropdown. In picker mode the \"+\" opens the picker\n\t// (with its own \"Create new\" row) instead, so skip the standalone button.\n\tconst showEmptyCreate =\n\t\titems.length === 0 && !!createOption && !hasSourceGroups && !usePicker;\n\tconst hasActionSources = !!actionSources && actionSources.length > 0;\n\t// Source buttons ONLY while no item is added — the tool sources (Manifest /\n\t// Shopify …) plus the built-in action tools (Rest API / Handover to email).\n\t// Once an item exists, adding more uses the header \"+\" → picker (the buttons\n\t// never come back); the action tools still live inside that picker.\n\tconst showSourceButtons =\n\t\t(hasSourceGroups \|\| hasActionSources) && items.length === 0;\n\t// Nothing existing to pick → skip the 1-item dropdown and create directly.\n\tconst handleAddClick = () => {\n\t\tif (usePicker) {\n\t\t\t// Toggle the `@` reference-picker popover (rendered under the \"+\"), opened\n\t\t\t// at the root source list (no pre-drilled source).\n\t\t\tsetPickerSource(null);\n\t\t\tsetAdding((v) => !v);\n\t\t\treturn;\n\t\t}\n\t\tif (hasSourceGroups) {\n\t\t\tsetActiveSource(null);\n\t\t\tsetAdding((v) => !v);\n\t\t\treturn;\n\t\t}\n\t\tif (addableOptions.length === 0 && createOption) {\n\t\t\tcreateOption.onSelect();\n\t\t\treturn;\n\t\t}\n\t\tsetAdding((v) => !v);\n\t};\n\n\tconst renderChipRows = () =>\n\t\titems.map((item) => {\n\t\t\t// Per-item configure wins; otherwise fall back to the section-level one.\n\t\t\tconst configure =\n\t\t\t\titem.onConfigure ??\n\t\t\t\t(onConfigure ? () => onConfigure(item.id) : undefined);\n\t\t\treturn (\n\t\t\t\t<SelectableRow\n\t\t\t\t\tkey={item.id}\n\t\t\t\t\tdata-test={`${dataTestPrefix}-row-${item.id}`}\n\t\t\t\t>\n\t\t\t\t\t{renderSourceIcon(item.icon)}\n\t\t\t\t\t<RowText>\n\t\t\t\t\t\t<BodySecondary numberOfLines={1} color={COLORS.content.primary}>\n\t\t\t\t\t\t\t{item.label}\n\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t</RowText>\n\t\t\t\t\t<RowActions>\n\t\t\t\t\t\t{configure && (\n\t\t\t\t\t\t\t// Configurable rows (sub-agents, Rest API / email tools) get an\n\t\t\t\t\t\t\t// always-visible edit icon.\n\t\t\t\t\t\t\t<RowMenuButton\n\t\t\t\t\t\t\t\tdata-test={`${dataTestPrefix}-edit-${item.id}`}\n\t\t\t\t\t\t\t\taria-label={`Edit ${item.label}`}\n\t\t\t\t\t\t\t\tonClick={configure}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<EditIcon\n\t\t\t\t\t\t\t\t\twidth={16}\n\t\t\t\t\t\t\t\t\theight={16}\n\t\t\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</RowMenuButton>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t{configure && <RowActionDivider aria-hidden />}\n\t\t\t\t\t\t<RowMenuButton\n\t\t\t\t\t\t\tdata-test={`${dataTestPrefix}-delete-${item.id}`}\n\t\t\t\t\t\t\taria-label={`Delete ${item.label}`}\n\t\t\t\t\t\t\tonClick={() =>\n\t\t\t\t\t\t\t\tconfirmDelete ? setPendingDeleteId(item.id) : onRemove(item.id)\n\t\t\t\t\t\t\t}\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</RowMenuButton>\n\t\t\t\t\t</RowActions>\n\t\t\t\t</SelectableRow>\n\t\t\t);\n\t\t});\n\t// \"Create new\" is a brand-coloured footer row at the BOTTOM of the dropdown,\n\t// separated from the selectable items by a divider.\n\tconst dropdownOptions: SingleOption[] = createOption\n\t\t? [\n\t\t\t\t...addableOptions,\n\t\t\t\t{\n\t\t\t\t\tlabel: createOption.label,\n\t\t\t\t\tvalue: CREATE_OPTION_VALUE,\n\t\t\t\t\tsearchKey: createOption.label,\n\t\t\t\t\tcustomComponent: (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\t\ttextAlign: 'center',\n\t\t\t\t\t\t\t\tcolor: COLORS.content.brand,\n\t\t\t\t\t\t\t\tfontFamily: 'Inter',\n\t\t\t\t\t\t\t\tfontSize: 14,\n\t\t\t\t\t\t\t\tfontWeight: 600,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{createOption.label}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t),\n\t\t\t\t},\n\t\t ]\n\t\t: addableOptions;\n\n\t// One picker instance reused by the header \"+\" and the empty-state source\n\t// buttons. `key` remounts it so a source button re-drills into its own tools\n\t// (the initial drill-in level is read once, on mount).\n\tconst pickerNode = usePicker ? (\n\t\t<MentionPicker\n\t\t\tkey={pickerSource ?? '__root__'}\n\t\t\titems={mentionItems ?? []}\n\t\t\tquery=\"\"\n\t\t\tactiveIndex={0}\n\t\t\tinitialSource={pickerSource ?? undefined}\n\t\t\tonSelect={(item) => {\n\t\t\t\tsetAdding(false);\n\t\t\t\tonAdd(String(item.id));\n\t\t\t}}\n\t\t\tonClose={() => setAdding(false)}\n\t\t\tonCreateSubAgent={\n\t\t\t\tcreateOption\n\t\t\t\t\t? () => {\n\t\t\t\t\t\t\tsetAdding(false);\n\t\t\t\t\t\t\tcreateOption.onSelect();\n\t\t\t\t\t }\n\t\t\t\t\t: undefined\n\t\t\t}\n\t\t\ttoolActions={\n\t\t\t\thasActionSources\n\t\t\t\t\t? actionSources?.map((a) => ({\n\t\t\t\t\t\t\t...a,\n\t\t\t\t\t\t\tonSelect: () => {\n\t\t\t\t\t\t\t\tsetAdding(false);\n\t\t\t\t\t\t\t\ta.onSelect();\n\t\t\t\t\t\t\t},\n\t\t\t\t\t }))\n\t\t\t\t\t: undefined\n\t\t\t}\n\t\t/>\n\t) : null;\n\n\treturn (\n\t\t<SideSection>\n\t\t\t<SideSectionHeader>\n\t\t\t\t<TitleSmall color={COLORS.content.primary}>{title}</TitleSmall>\n\t\t\t\t{showAddButton && (\n\t\t\t\t\t<AddButtonWrap ref={headerPickerRef}>\n\t\t\t\t\t\t<AddIconButton\n\t\t\t\t\t\t\tdata-test={`${dataTestPrefix}-add`}\n\t\t\t\t\t\t\tonClick={handleAddClick}\n\t\t\t\t\t\t\taria-label={`Add ${title}`}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<PlusIcon width={20} height={20} color={COLORS.content.brand} />\n\t\t\t\t\t\t</AddIconButton>\n\t\t\t\t\t\t{usePicker && adding && pickerSource === null && (\n\t\t\t\t\t\t\t<PickerPopover data-test={`${dataTestPrefix}-picker`}>\n\t\t\t\t\t\t\t\t{pickerNode}\n\t\t\t\t\t\t\t</PickerPopover>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</AddButtonWrap>\n\t\t\t\t)}\n\t\t\t</SideSectionHeader>\n\n\t\t\t{helper && (\n\t\t\t\t<BodyCaption color={COLORS.content.secondary}>{helper}</BodyCaption>\n\t\t\t)}\n\n\t\t\t{showSourceButtons ? (\n\t\t\t\t<SourcePickerAnchor ref={usePicker ? sourcePickerRef : undefined}>\n\t\t\t\t\t{/ No tools yet: one button per source (never shown once a tool exists). /}\n\t\t\t\t\t<SourceButtonRow data-test={`${dataTestPrefix}-sources`}>\n\t\t\t\t\t\t{sourceGroups?.map((g) => (\n\t\t\t\t\t\t\t<SourceButton\n\t\t\t\t\t\t\t\tkey={g.source}\n\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\tdata-test={`${dataTestPrefix}-source-${g.source}`}\n\t\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\t\tif (usePicker) {\n\t\t\t\t\t\t\t\t\t\t// Open the `@` picker drilled straight into this source's tools.\n\t\t\t\t\t\t\t\t\t\tsetPickerSource(g.source);\n\t\t\t\t\t\t\t\t\t\tsetAdding(true);\n\t\t\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tsetActiveSource(g.source);\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{renderSourceIcon(SOURCE_ICONS[g.source], -4)}\n\t\t\t\t\t\t\t\t<BodySecondary color={COLORS.content.primary}>\n\t\t\t\t\t\t\t\t\t{g.label}\n\t\t\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t\t\t</SourceButton>\n\t\t\t\t\t\t))}\n\t\t\t\t\t\t{/ Built-in action tools (Rest API / Handover to email) open a drawer. /}\n\t\t\t\t\t\t{actionSources?.map((a) => (\n\t\t\t\t\t\t\t<SourceButton\n\t\t\t\t\t\t\t\tkey={a.source}\n\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\tdata-test={`${dataTestPrefix}-action-${a.source}`}\n\t\t\t\t\t\t\t\tonClick={a.onSelect}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{renderSourceIcon(a.icon, -4)}\n\t\t\t\t\t\t\t\t<BodySecondary color={COLORS.content.primary}>\n\t\t\t\t\t\t\t\t\t{a.label}\n\t\t\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t\t\t</SourceButton>\n\t\t\t\t\t\t))}\n\t\t\t\t\t</SourceButtonRow>\n\n\t\t\t\t\t{/ Picker mode: clicking a source opens its tools in the `@` picker. /}\n\t\t\t\t\t{usePicker && adding && pickerSource !== null && (\n\t\t\t\t\t\t<PickerPopover $align=\"left\" data-test={`${dataTestPrefix}-picker`}>\n\t\t\t\t\t\t\t{pickerNode}\n\t\t\t\t\t\t</PickerPopover>\n\t\t\t\t\t)}\n\n\t\t\t\t\t{/ Legacy (non-picker) mode: chosen source → its searchable tool list. */}\n\t\t\t\t\t{!usePicker && activeGroup && (\n\t\t\t\t\t\t<Dropdown\n\t\t\t\t\t\t\tdata-test={`${dataTestPrefix}-dropdown`}\n\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\twidth=\"100%\"\n\t\t\t\t\t\t\tisSearchable\n\t\t\t\t\t\t\tplaceHolder={`Search ${activeGroup.label} tools`}\n\t\t\t\t\t\t\toptions={activeGroup.options}\n\t\t\t\t\t\t\tonSelect={(opt) => {\n\t\t\t\t\t\t\t\tconst v = unwrapDropdownValue(opt);\n\t\t\t\t\t\t\t\tsetActiveSource(null);\n\t\t\t\t\t\t\t\tsetAdding(false);\n\t\t\t\t\t\t\t\tif (v) {\n\t\t\t\t\t\t\t\t\tonAdd(v);\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</SourcePickerAnchor>\n\t\t\t) : (\n\t\t\t\t<>\n\t\t\t\t\t{!usePicker && adding && dropdownOptions.length > 0 && (\n\t\t\t\t\t\t<Dropdown\n\t\t\t\t\t\t\tdata-test={`${dataTestPrefix}-dropdown`}\n\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\twidth=\"100%\"\n\t\t\t\t\t\t\tisSearchable\n\t\t\t\t\t\t\tplaceHolder={`Select ${title.toLowerCase()}`}\n\t\t\t\t\t\t\toptions={dropdownOptions}\n\t\t\t\t\t\t\tonSelect={(opt) => {\n\t\t\t\t\t\t\t\tconst v = unwrapDropdownValue(opt);\n\t\t\t\t\t\t\t\tsetAdding(false);\n\t\t\t\t\t\t\t\tif (!v) {\n\t\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tif (v === CREATE_OPTION_VALUE) {\n\t\t\t\t\t\t\t\t\tcreateOption?.onSelect();\n\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\tonAdd(v);\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\n\t\t\t\t\t{items.length === 0 && !adding ? (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t<BodyCaption color={COLORS.content.placeholder}>\n\t\t\t\t\t\t\t\t{emptyText}\n\t\t\t\t\t\t\t</BodyCaption>\n\t\t\t\t\t\t\t{showEmptyCreate && createOption && (\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tdata-test={`${dataTestPrefix}-create`}\n\t\t\t\t\t\t\t\t\tbuttonType=\"secondary\"\n\t\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\t\tmatchParentWidth\n\t\t\t\t\t\t\t\t\tLeadingIcon={PlusIcon}\n\t\t\t\t\t\t\t\t\tbuttonText={createOption.label}\n\t\t\t\t\t\t\t\t\tonClick={createOption.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) : (\n\t\t\t\t\t\trenderChipRows()\n\t\t\t\t\t)}\n\t\t\t\t</>\n\t\t\t)}\n\t\t\t{confirmDelete && pendingDeleteId && (\n\t\t\t\t<DeleteConfirmationModal\n\t\t\t\t\tdata-test={`${dataTestPrefix}-delete-confirm`}\n\t\t\t\t\theader={`Delete this ${confirmDelete.noun}?`}\n\t\t\t\t\tsubHeader={`Deleting this ${confirmDelete.noun} will also remove it from your instructions, wherever it's referenced.`}\n\t\t\t\t\tconfirmationText=\"Delete\"\n\t\t\t\t\tzIndex={confirmDelete.zIndex}\n\t\t\t\t\tonDeleteConfirmed={() => {\n\t\t\t\t\t\tonRemove(pendingDeleteId);\n\t\t\t\t\t\tsetPendingDeleteId(null);\n\t\t\t\t\t}}\n\t\t\t\t\tonCancelClicked={() => setPendingDeleteId(null)}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</SideSection>\n\t);\n};\n\n// Anchors the `@`-picker popover to the header \"+\" button.\nconst AddButtonWrap = styled.div`\n\tposition: relative;\n\tdisplay: flex;\n`;\n\n// Anchors the `@`-picker popover to the empty-state source buttons.\nconst SourcePickerAnchor = styled.div`\n\tposition: relative;\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 8px;\n`;\n\n// Floating card under the trigger. Aligns to the \"+\" (right) or the source\n// buttons (left) so it stays inside the side panel.\nconst PickerPopover = styled.div<{ $align?: 'left' \| 'right' }>`\n\tposition: absolute;\n\ttop: calc(100% + 4px);\n\t${(p) => (p.$align === 'left' ? 'left: 0;' : 'right: 0;')}\n\tz-index: 30;\n`;\n"],"names":["CREATE_OPTION_VALUE","SelectableListSection","title","helper","items","addableOptions","onAdd","onRemove","dataTestPrefix","emptyText","createOption","onConfigure","sourceGroups","mentionItems","actionSources","confirmDelete","adding","setAdding","useState","pendingDeleteId","setPendingDeleteId","activeSource","setActiveSource","hasSourceGroups","activeGroup","g","usePicker","headerPickerRef","useRef","sourcePickerRef","pickerSource","setPickerSource","useEffect","onDocMouseDown","e","target","onKeyDown","showAddButton","showEmptyCreate","hasActionSources","showSourceButtons","handleAddClick","v","renderChipRows","item","configure","jsxs","SelectableRow","renderSourceIcon","jsx","RowText","BodySecondary","COLORS","RowActions","RowMenuButton","EditIcon","RowActionDivider","DeleteIcon","dropdownOptions","pickerNode","MentionPicker","a","SideSection","SideSectionHeader","TitleSmall","AddButtonWrap","AddIconButton","PlusIcon","PickerPopover","BodyCaption","SourcePickerAnchor","SourceButtonRow","SourceButton","SOURCE_ICONS","Dropdown","opt","unwrapDropdownValue","Fragment","Button","DeleteConfirmationModal","styled","p"],"mappings":"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"}

package/dist/cjs/components/agent-builder/steps/Step3HowItResponds.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),s=require("react"),U=require("../../TypographyStyle.js"),G=require("../../../constants/Theme.js"),m=require("../AgentBuilder.styled.js"),be=require("../components/ConfigToolPanel.js"),me=require("../components/CreateSubAgentPanel.js"),W=require("../components/MentionField.js"),fe=require("../components/RestApiToolPanel.js"),z=require("../components/SelectableListSection.js"),Te=require("../components/StepSectionHeader.js"),ye=require("../constants/steps.js"),r=require("../constants/tools.js"),Ce=require("../context/AgentBuilderContext.js"),c=require("../utils/mentionSerialization.js"),f=require("../utils/sourceIcons.js"),he=require("../../dropdown/Dropdown.js"),Ae=require("../../dropdown/utils.js"),Ie=t=>f.renderSourceIcon(f.sourceIcon(t))??void 0,$=t=>({label:t.display_name,value:t.tool_id,leadingIcon:Ie(t.source??r.ToolSource.Manifest)}),V=ye.STEP_DEFINITIONS[2],J=(t,i)=>{const T=t??[];return T.some(d=>d.id===i.id)?T.map(d=>d.id===i.id?i:d):[...T,i]},ve=()=>{const{value:t,patch:i,updateField:T,addReference:d,removeReference:P,availableTools:y,availableSubAgents:Q,availableModels:R,configToolTemplates:x,applicationType:K,charLimits:C,insertMention:u,onCreateSubAgent:g,onFetchSubAgent:h,onUpdateSubAgent:k,onImproveSubAgent:X,onImproveToolInstructions:w,registerSubAgentCreator:_,registerToolActionHandler:j}=Ce.useAgentBuilderContext(),[p,A]=s.useState(null),I=s.useRef(0),[a,S]=s.useState(null),v=s.useRef(0),E=s.useCallback(e=>{v.current+=1,S({key:v.current,kind:"restapi",initialRest:e})},[]),L=s.useCallback((e,o)=>{v.current+=1,S({key:v.current,kind:"config",toolKey:e,initialConfig:o})},[]),Y=s.useCallback(e=>{const o=!(t.restApiTools??[]).some(l=>l.id===e.id);i({restApiTools:J(t.restApiTools,e)}),o&&u("tool",e.id,c.restApiMentionItem(e).label),S(null)},[i,t.restApiTools,u]),Z=s.useCallback(e=>{const o=!(t.configTools??[]).some(l=>l.id===e.id);i({configTools:J(t.configTools,e)}),o&&u("tool",e.id,c.configToolMentionItem(e).label),S(null)},[i,t.configTools,u]),q=s.useCallback(e=>{const o=r.CONFIG_TOOL_SOURCES[e];o?L(o):E()},[L,E]);s.useEffect(()=>(j(q),()=>j(null)),[j,q]);const[ee,B]=s.useState([]),O=new Map;Q.forEach(e=>O.set(e.id,e)),ee.forEach(e=>O.set(e.id,e));const H=Array.from(O.values()),M=s.useCallback(()=>{I.current+=1,A({key:I.current,title:"Create sub-agent"})},[]);s.useEffect(()=>{if(g)return _(M),()=>_(null)},[_,M,g]);const oe=s.useCallback(async e=>{if(!h)return;const o=await h(e);I.current+=1,A({key:I.current,title:"Edit sub-agent",editingId:e,initial:o})},[h]),te=s.useCallback(async e=>{if(p?.editingId){if(k){const o=await k(p.editingId,e);B(l=>[...l.filter(b=>b.id!==o.id),o])}}else if(g){const o=await g(e);B(l=>[...l,o]),i({subagents:[...t.subagents,o.id]}),u("subagent",o.id,`sub-agent: ${o.name}`)}A(null)},[p,k,g,i,t.subagents,u]),ne=t.tools.map(e=>{const o=y.find(l=>l.tool_id===e);return o?{id:e,label:o.display_name,icon:f.sourceIcon(o.source??r.ToolSource.Manifest)}:null}).filter(e=>e!==null),le=(t.restApiTools??[]).map(e=>({id:e.id,label:c.restApiToolName(e),icon:f.SOURCE_ICONS[r.ToolSource.RestApi],onConfigure:()=>E(e)})),se=(t.configTools??[]).map(e=>({id:e.id,label:c.configToolName(e),icon:f.SOURCE_ICONS[e.tool_key==="send_slack_message"?r.ToolSource.Slack:r.ToolSource.EmailHandover],onConfigure:()=>L(e.tool_key,e)})),ie=[...ne,...le,...se],ae=r.TOOL_ACTION_SOURCES.filter(e=>{const o=r.CONFIG_TOOL_SOURCES[e];return!o||!!x?.[o]}).map(e=>({source:e,label:r.TOOL_SOURCE_LABELS[e],icon:f.SOURCE_ICONS[e],onSelect:()=>q(e)})),re=y.map($),ce=(()=>{const e=[],o=new Map;return y.forEach(l=>{const b=l.source??r.ToolSource.Manifest;o.has(b)||(o.set(b,[]),e.push(b)),o.get(b)?.push($(l))}),e.map(l=>({source:l,label:c.toolSourceLabel(l),options:o.get(l)??[]}))})(),ue=t.subagents.map(e=>{const o=O.get(e);return o?{id:e,label:o.name}:null}).filter(e=>e!==null),de=H.map(e=>({label:e.name,value:e.id})),D=c.appTypeLabel(K),pe=c.buildAgentMentionItems(y,[],D),ge=c.buildAgentMentionItems([],H,D),Se=R.map(e=>({label:e.label,value:e.value,selected:e.value===t.model})),N=R.find(e=>e.value===t.model),F=a?.kind==="config"&&a.toolKey?x?.[a.toolKey]:void 0;return n.jsxs(m.Step3Root,{children:[n.jsx(Te.StepSectionHeader,{title:V.title,helper:V.helper}),n.jsxs(m.Step3Grid,{$grow:!0,children:[n.jsxs(m.SectionBodyWrap,{children:[n.jsx(W.MentionField,{fieldKey:"instructions","data-test":"agent-instructions",label:"Instructions",maxLength:C.instructions,placeholder:"Write what this agent should do. Type @ to reference a tool or sub-agent.",minHeight:"200px"}),n.jsx(W.MentionField,{fieldKey:"guardrail","data-test":"agent-guardrail",label:"Guardrails",maxLength:C.guardrail,placeholder:"Things this agent must never do. Type @ to reference a tool or sub-agent.",minHeight:"140px"})]}),n.jsx(m.Step3Divider,{}),n.jsxs(m.SectionBodyWrap,{children:[n.jsx(z.SelectableListSection,{title:"Tools",helper:"Actions this agent can take while responding.",dataTestPrefix:"agent-tools",items:ie,addableOptions:re,sourceGroups:ce,mentionItems:pe,actionSources:ae,emptyText:"No tools added yet.",onAdd:e=>{u("tool",e),d("tool",e)},onRemove:e=>P("tool",e)}),n.jsx(z.SelectableListSection,{title:"Sub-agents",helper:"Other agents this agent can hand off the conversation to.",dataTestPrefix:"agent-subagents",items:ue,addableOptions:de,mentionItems:ge,emptyText:"No sub-agents added yet.",onAdd:e=>{u("subagent",e),d("subagent",e)},onRemove:e=>P("subagent",e),onConfigure:h?oe:void 0,createOption:g?{label:"Create new",onSelect:M}:void 0}),R.length>0&&n.jsxs(m.SideSection,{children:[n.jsx(U.TitleSmall,{color:G.COLORS.content.primary,children:"Advanced settings"}),n.jsx(U.TitleSmall,{color:G.COLORS.content.secondary,children:"Select AI model"}),n.jsx(he.Dropdown,{"data-test":"agent-model",size:"small",width:"100%",placeHolder:"Select model",options:Se,defaultOptions:N?[{label:N.label,value:N.value}]:void 0,onSelect:e=>{const o=Ae.unwrapDropdownValue(e);o&&T("model",o)}})]})]})]}),p&&n.jsx(me.CreateSubAgentPanel,{title:p.title,initial:p.initial,availableTools:y,configToolTemplates:x,appLabel:c.appTypeLabel(K),charLimits:C,onImprove:X,onImproveToolInstructions:w,onClose:()=>A(null),onSave:te},p.key),a?.kind==="restapi"&&n.jsx(fe.RestApiToolPanel,{initial:a.initialRest,charLimits:C,onImprove:w,onClose:()=>S(null),onSave:Y},a.key),a?.kind==="config"&&a.toolKey&&F&&n.jsx(be.ConfigToolPanel,{toolKey:a.toolKey,template:F,initial:a.initialConfig,charLimits:C,onImprove:w,onClose:()=>S(null),onSave:Z},a.key)]})};exports.Step3HowItResponds=ve;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),s=require("react"),G=require("../../TypographyStyle.js"),U=require("../../../constants/Theme.js"),m=require("../AgentBuilder.styled.js"),Se=require("../components/ConfigToolPanel.js"),me=require("../components/CreateSubAgentPanel.js"),W=require("../components/MentionField.js"),fe=require("../components/RestApiToolPanel.js"),z=require("../components/SelectableListSection.js"),Te=require("../components/StepSectionHeader.js"),ye=require("../constants/steps.js"),p=require("../constants/tools.js"),he=require("../context/AgentBuilderContext.js"),r=require("../utils/mentionSerialization.js"),h=require("../utils/sourceIcons.js"),Ae=require("../utils/toolActions.js"),Ce=require("../../dropdown/Dropdown.js"),Ie=require("../../dropdown/utils.js"),ve=t=>h.renderSourceIcon(h.sourceIcon(t))??void 0,$=t=>({label:t.display_name,value:t.tool_id,leadingIcon:ve(t.source??p.ToolSource.Manifest)}),V=ye.STEP_DEFINITIONS[2],J=(t,i)=>{const f=t??[];return f.some(u=>u.id===i.id)?f.map(u=>u.id===i.id?i:u):[...f,i]},xe=()=>{const{value:t,patch:i,updateField:f,addReference:u,removeReference:N,availableTools:T,availableSubAgents:Q,availableModels:k,configToolTemplates:R,applicationType:D,charLimits:y,insertMention:c,onCreateSubAgent:g,onFetchSubAgent:A,onUpdateSubAgent:O,onImproveSubAgent:X,onImproveToolInstructions:w,registerSubAgentCreator:j,registerToolActionHandler:q}=he.useAgentBuilderContext(),[d,C]=s.useState(null),I=s.useRef(0),[a,b]=s.useState(null),v=s.useRef(0),M=s.useCallback(e=>{v.current+=1,b({key:v.current,kind:"restapi",initialRest:e})},[]),E=s.useCallback((e,o)=>{v.current+=1,b({key:v.current,kind:"config",toolKey:e,initialConfig:o})},[]),Y=s.useCallback(e=>{const o=!(t.restApiTools??[]).some(l=>l.id===e.id);i({restApiTools:J(t.restApiTools,e)}),o&&c("tool",e.id,r.restApiMentionItem(e).label),b(null)},[i,t.restApiTools,c]),Z=s.useCallback(e=>{const o=!(t.configTools??[]).some(l=>l.id===e.id);i({configTools:J(t.configTools,e)}),o&&c("tool",e.id,r.configToolMentionItem(e).label),b(null)},[i,t.configTools,c]),L=s.useCallback(e=>{const o=p.CONFIG_TOOL_SOURCES[e];o?E(o):M()},[E,M]);s.useEffect(()=>(q(L),()=>q(null)),[q,L]);const[ee,K]=s.useState([]),x=new Map;Q.forEach(e=>x.set(e.id,e)),ee.forEach(e=>x.set(e.id,e));const H=Array.from(x.values()),_=s.useCallback(()=>{I.current+=1,C({key:I.current,title:"Create sub-agent"})},[]);s.useEffect(()=>{if(g)return j(_),()=>j(null)},[j,_,g]);const oe=s.useCallback(async e=>{if(!A)return;const o=await A(e);I.current+=1,C({key:I.current,title:"Edit sub-agent",editingId:e,initial:o})},[A]),te=s.useCallback(async e=>{if(d?.editingId){if(O){const o=await O(d.editingId,e);K(l=>[...l.filter(S=>S.id!==o.id),o])}}else if(g){const o=await g(e);K(l=>[...l,o]),i({subagents:[...t.subagents,o.id]}),c("subagent",o.id,`sub-agent: ${o.name}`)}C(null)},[d,O,g,i,t.subagents,c]),ne=t.tools.map(e=>{const o=T.find(l=>l.tool_id===e);return o?{id:e,label:o.display_name,icon:h.sourceIcon(o.source??p.ToolSource.Manifest)}:null}).filter(e=>e!==null),le=(t.restApiTools??[]).map(e=>({id:e.id,label:r.restApiToolName(e),icon:h.SOURCE_ICONS[p.ToolSource.RestApi],onConfigure:()=>M(e)})),se=(t.configTools??[]).map(e=>({id:e.id,label:r.configToolName(e),icon:h.SOURCE_ICONS[e.tool_key==="send_slack_message"?p.ToolSource.Slack:p.ToolSource.EmailHandover],onConfigure:()=>E(e.tool_key,e)})),ie=[...ne,...le,...se],ae=Ae.buildToolActions(R,L),re=T.map($),ce=(()=>{const e=[],o=new Map;return T.forEach(l=>{const S=l.source??p.ToolSource.Manifest;o.has(S)||(o.set(S,[]),e.push(S)),o.get(S)?.push($(l))}),e.map(l=>({source:l,label:r.toolSourceLabel(l),options:o.get(l)??[]}))})(),ue=t.subagents.map(e=>{const o=x.get(e);return o?{id:e,label:o.name}:null}).filter(e=>e!==null),de=H.map(e=>({label:e.name,value:e.id})),B=r.appTypeLabel(D),pe=r.buildAgentMentionItems(T,[],B),ge=r.buildAgentMentionItems([],H,B),be=k.map(e=>({label:e.label,value:e.value,selected:e.value===t.model})),P=k.find(e=>e.value===t.model),F=a?.kind==="config"&&a.toolKey?R?.[a.toolKey]:void 0;return n.jsxs(m.Step3Root,{children:[n.jsx(Te.StepSectionHeader,{title:V.title,helper:V.helper}),n.jsxs(m.Step3Grid,{$grow:!0,children:[n.jsxs(m.SectionBodyWrap,{children:[n.jsx(W.MentionField,{fieldKey:"instructions","data-test":"agent-instructions",label:"Instructions",maxLength:y.instructions,placeholder:"Write what this agent should do. Type @ to reference a tool or sub-agent.",minHeight:"200px"}),n.jsx(W.MentionField,{fieldKey:"guardrail","data-test":"agent-guardrail",label:"Guardrails",maxLength:y.guardrail,placeholder:"Things this agent must never do. Type @ to reference a tool or sub-agent.",minHeight:"140px"})]}),n.jsx(m.Step3Divider,{}),n.jsxs(m.SectionBodyWrap,{children:[n.jsx(z.SelectableListSection,{title:"Tools",helper:"Actions this agent can take while responding.",dataTestPrefix:"agent-tools",items:ie,addableOptions:re,sourceGroups:ce,mentionItems:pe,actionSources:ae,emptyText:"No tools added yet.",onAdd:e=>{c("tool",e),u("tool",e)},onRemove:e=>N("tool",e),confirmDelete:{noun:"tool"}}),n.jsx(z.SelectableListSection,{title:"Sub-agents",helper:"Other agents this agent can hand off the conversation to.",dataTestPrefix:"agent-subagents",items:ue,addableOptions:de,mentionItems:ge,emptyText:"No sub-agents added yet.",onAdd:e=>{c("subagent",e),u("subagent",e)},onRemove:e=>N("subagent",e),confirmDelete:{noun:"sub-agent"},onConfigure:A?oe:void 0,createOption:g?{label:"Create new",onSelect:_}:void 0}),k.length>0&&n.jsxs(m.SideSection,{children:[n.jsx(G.TitleSmall,{color:U.COLORS.content.primary,children:"Advanced settings"}),n.jsx(G.TitleSmall,{color:U.COLORS.content.secondary,children:"Select AI model"}),n.jsx(Ce.Dropdown,{"data-test":"agent-model",size:"small",width:"100%",placeHolder:"Select model",options:be,defaultOptions:P?[{label:P.label,value:P.value}]:void 0,onSelect:e=>{const o=Ie.unwrapDropdownValue(e);o&&f("model",o)}})]})]})]}),d&&n.jsx(me.CreateSubAgentPanel,{title:d.title,initial:d.initial,availableTools:T,configToolTemplates:R,appLabel:r.appTypeLabel(D),charLimits:y,onImprove:X,onImproveToolInstructions:w,onClose:()=>C(null),onSave:te},d.key),a?.kind==="restapi"&&n.jsx(fe.RestApiToolPanel,{initial:a.initialRest,charLimits:y,onImprove:w,onClose:()=>b(null),onSave:Y},a.key),a?.kind==="config"&&a.toolKey&&F&&n.jsx(Se.ConfigToolPanel,{toolKey:a.toolKey,template:F,initial:a.initialConfig,charLimits:y,onImprove:w,onClose:()=>b(null),onSave:Z},a.key)]})};exports.Step3HowItResponds=xe;
 //# sourceMappingURL=Step3HowItResponds.js.map