@bikdotai/bik-component-library 0.0.865-beta.2 → 0.0.865-beta.4

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

@@ -1 +1 @@
-{"version":3,"file":"MentionPicker.js","sources":["../../../../../src/components/agent-builder/components/MentionPicker.tsx"],"sourcesContent":["// import ChevronLeft from '@src/assets/icons/chevronLeft.svg';\nimport ChevronRight from '@src/assets/icons/chevronRight.svg';\nimport SearchIcon from '@src/assets/icons/searchIcon.svg';\nimport type { MentionDropdownRenderProps, MentionItem } from '@src/editor';\nimport { PuzzlePiece, Shield } from '@src/icons';\nimport SvgArrowLeft from '@src/icons/Arrows/Normal arrows/ArrowLeft';\nimport React, { useEffect, useMemo, useRef, useState } from 'react';\nimport styled from 'styled-components';\nimport {\n\tBodyCaption,\n\tBodySecondary,\n\tTitleSmall,\n} from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport { VariablePicker } from '../../variable-picker-v3';\nimport { PickerType } from '../../variable-picker-v3/model';\nimport type {\n\tVariableListInterfaceV3,\n\tVariableV3,\n} from '../../variable-picker-v3/model';\nimport {\n\tCATEGORIES,\n\tCONFIG_TOOL_SOURCES,\n\tisIntegrationSource,\n\tisMoreIntegrationSource,\n\tMORE_INTEGRATIONS_KEY,\n\tMORE_INTEGRATIONS_LABEL,\n\tMORE_INTEGRATIONS_RANK,\n\ttoolSourceRank,\n} from '../constants/tools';\nimport type {\n\tCategory,\n\tIconComp,\n\tToolAction,\n\tToolSource,\n} from '../constants/tools';\nimport {\n\tMentionKindMeta,\n\ttoolSourceLabel,\n} from '../utils/mentionSerialization';\nimport { renderSourceIcon, sourceIcon, SourceIcon } from '../utils/sourceIcons';\n\n// Icon for the synthetic \"More Integrations\" umbrella row (not a real source, so\n// it isn't in SOURCE_ICONS).\nconst MORE_INTEGRATIONS_ICON: SourceIcon = {\n\tIcon: PuzzlePiece as IconComp,\n\tw: 20,\n\th: 20,\n};\n\nconst metaOf = (item: MentionItem): MentionKindMeta | undefined =>\n\titem.meta as unknown as MentionKindMeta | undefined;\n\nconst rowLabel = (item: MentionItem): string =>\n\tmetaOf(item)?.plainLabel ?? item.label;\n\n/** One navigable row in the picker's current view. */\ntype PickerRowModel = {\n\tid: string;\n\tlabel: string;\n\t/** Drill-in rows show a chevron; leaf (selectable) rows do not. */\n\tdrillsIn: boolean;\n\t/** Leading brand glyph (source rows only). */\n\ticon?: SourceIcon;\n\t/** Brand-coloured \"Create new\" action row (not a selectable item). */\n\tisCreate?: boolean;\n\t/**\n\t * Brand-coloured right-aligned action text (e.g. \"Connect\") shown in place of\n\t * the drill-in chevron — used for an unconnected integration source.\n\t */\n\trightLabel?: string;\n\t/** Tool leaf touches customer-private data → shows a shield glyph. */\n\tauthRequired?: boolean;\n\tonActivate: () => void;\n};\n\n/** Sentinel id for the sub-agent \"Create new\" row. */\nconst CREATE_SUBAGENT_ID = '__bik_create_subagent__';\n\ntype MentionPickerProps = MentionDropdownRenderProps & {\n\t/** Opens the create-sub-agent drawer (shows a \"Create new\" row in the Sub-agent view). */\n\tonCreateSubAgent?: () => void;\n\t/**\n\t * Open already drilled into this tool source (e.g. `'shopify'`) — its tool list\n\t * is shown immediately. */\n\tinitialSource?: string;\n\t/**\n\t * Built-in tool actions (Rest API / Handover to email) shown in the Tools view.\n\t * Picking one opens its config drawer (via `onSelect`) and dismisses the picker\n\t * — it never inserts a mention into the text.\n\t */\n\ttoolActions?: ToolAction[];\n\t/**\n\t * Per-source integration connection state. A source whose value is `false`\n\t * renders a \"Connect\" row (like an unconnected action) instead of drilling in —\n\t * so native source groups (Shopify / BigCommerce / ShipStation) show \"Connect\"\n\t * consistently with the config actions (Slack).\n\t */\n\tintegrationStatus?: Partial<Record<ToolSource, boolean>>;\n\t/** Open the connect flow for an unconnected source (used by the Connect row). */\n\tonConnectIntegration?: (source: ToolSource) => void;\n\t/**\n\t * Variable catalog for the \"Variables\" view (the shared VariablePicker's\n\t * `data`). Omitted / empty → the Variables category is not offered.\n\t */\n\tvariablesData?: VariableListInterfaceV3[];\n\t/**\n\t * A variable was picked from the Variables view. The picker dismisses itself\n\t * (stripping the typed `@`) BEFORE calling this — the handler inserts a\n\t * `Variable: <name>` mention chip (see MentionEditor).\n\t */\n\tonSelectVariable?: (variable: VariableV3) => void;\n};\n\n/**\n * `@` reference picker. Drills:\n *   root → Tools → <source> (Manifest / Shopify / …) → tool\n *        → Sub-agent → sub-agent\n *        → Variables → shared VariablePicker (embedded)\n * (\"Add condition\" is intentionally not shown yet.)\n *\n * Owns keyboard navigation (↑/↓ move, →/Enter activate, ← go back) over the\n * CURRENTLY visible rows — registered with the editor via `registerKeyHandler`.\n */\nexport const MentionPicker: React.FC<MentionPickerProps> = ({\n\titems,\n\tonSelect,\n\tregisterKeyHandler,\n\tonClose,\n\tonCreateSubAgent,\n\tinitialSource,\n\ttoolActions,\n\tintegrationStatus,\n\tonConnectIntegration,\n\tvariablesData,\n\tonSelectVariable,\n}) => {\n\tconst [category, setCategory] = useState<Category | null>(null);\n\tconst [source, setSource] = useState<string | null>(initialSource ?? null);\n\t// -1 = nothing highlighted; rows highlight only on hover / arrow keys\n\t// (a default highlight reads as a stuck hover state).\n\tconst [activeIndex, setActiveIndex] = useState(-1);\n\t// Search box shown inside a source's tool list (Manifest / Shopify); filters\n\t// that source's tools by name.\n\tconst [search, setSearch] = useState('');\n\n\tconst tools = useMemo(\n\t\t() => items.filter((i) => metaOf(i)?.kind === 'tool'),\n\t\t[items],\n\t);\n\tconst subAgents = useMemo(\n\t\t() => items.filter((i) => metaOf(i)?.kind === 'subagent'),\n\t\t[items],\n\t);\n\tconst sources = useMemo(() => {\n\t\tconst acc: string[] = [];\n\t\ttools.forEach((t) => {\n\t\t\tconst s = metaOf(t)?.source ?? 'other';\n\t\t\tif (!acc.includes(s)) {\n\t\t\t\tacc.push(s);\n\t\t\t}\n\t\t});\n\t\treturn acc;\n\t}, [tools]);\n\t// The built-in \"create\" action per source (Rest API / email / Slack). A source\n\t// with an action drills into [its instances + a \"Create new\" row] — like the\n\t// Sub-agent category — instead of showing a duplicate flat \"create\" row.\n\tconst actionBySource = useMemo(\n\t\t() =>\n\t\t\tnew Map<string, ToolAction>(\n\t\t\t\t(toolActions ?? []).map((a) => [a.source, a]),\n\t\t\t),\n\t\t[toolActions],\n\t);\n\n\t// Show a category when it has items — and ALWAYS show Sub-agent when creating\n\t// one is possible, so an agent with no sub-agents yet still gets the root\n\t// \"Tools / Sub-agent\" choice (with a \"Create new\" inside). When only one is\n\t// available (e.g. the sub-agent drawer offers tools only) the selector is skipped.\n\tconst availableCategories = useMemo(\n\t\t() =>\n\t\t\tCATEGORIES.filter((c) => {\n\t\t\t\tif (c.key === 'tool') {\n\t\t\t\t\treturn tools.length > 0 || (toolActions?.length ?? 0) > 0;\n\t\t\t\t}\n\t\t\t\tif (c.key === 'variable') {\n\t\t\t\t\treturn (variablesData?.length ?? 0) > 0 && !!onSelectVariable;\n\t\t\t\t}\n\t\t\t\treturn subAgents.length > 0 || !!onCreateSubAgent;\n\t\t\t}),\n\t\t[\n\t\t\ttools.length,\n\t\t\tsubAgents.length,\n\t\t\tonCreateSubAgent,\n\t\t\ttoolActions?.length,\n\t\t\tvariablesData?.length,\n\t\t\tonSelectVariable,\n\t\t],\n\t);\n\tconst soleCategory =\n\t\tavailableCategories.length === 1 ? availableCategories[0].key : null;\n\tconst activeCategory = category ?? soleCategory;\n\n\t// Title shown above the current view. `onBack` is omitted at a root level (a\n\t// sole category has nowhere to go back to) — the header then shows as a plain\n\t// title. When `onBack` is set the header leads with a back arrow, followed by\n\t// the source icon in a source detail view: `[← back][icon][title]`.\n\tconst header: {\n\t\ttitle: string;\n\t\tonBack?: () => void;\n\t\ticon?: SourceIcon;\n\t} | null = !activeCategory\n\t\t? null\n\t\t: activeCategory === 'subagent'\n\t\t? // Always titled — with a back arrow only when the category chooser is above.\n\t\t  {\n\t\t\t\ttitle: 'Sub-agent',\n\t\t\t\tonBack: soleCategory ? undefined : () => setCategory(null),\n\t\t  }\n\t\t: activeCategory === 'variable'\n\t\t? {\n\t\t\t\ttitle: 'Variables',\n\t\t\t\tonBack: soleCategory ? undefined : () => setCategory(null),\n\t\t  }\n\t\t: source === MORE_INTEGRATIONS_KEY\n\t\t? {\n\t\t\t\ttitle: MORE_INTEGRATIONS_LABEL,\n\t\t\t\tonBack: () => setSource(null),\n\t\t\t\ticon: MORE_INTEGRATIONS_ICON,\n\t\t  }\n\t\t: source\n\t\t? {\n\t\t\t\ttitle: toolSourceLabel(source),\n\t\t\t\t// Deep-linked to a source (opened from a right-panel source button):\n\t\t\t\t// that source IS the root, so no back arrow. Otherwise back returns to\n\t\t\t\t// the \"More Integrations\" umbrella for a vendor that lives under it,\n\t\t\t\t// else to the source chooser.\n\t\t\t\tonBack: initialSource\n\t\t\t\t\t? undefined\n\t\t\t\t\t: () =>\n\t\t\t\t\t\t\tsetSource(\n\t\t\t\t\t\t\t\tisMoreIntegrationSource(source) ? MORE_INTEGRATIONS_KEY : null,\n\t\t\t\t\t\t\t),\n\t\t\t\ticon: sourceIcon(source),\n\t\t  }\n\t\t: // Always titled — matches the Sub-agent header; back arrow only when the\n\t\t  // category chooser is above (i.e. not the sole category).\n\t\t  {\n\t\t\t\ttitle: 'Tools',\n\t\t\t\tonBack: soleCategory ? undefined : () => setCategory(null),\n\t\t  };\n\n\t// Build the navigable rows for the current view.\n\tconst rows: PickerRowModel[] = useMemo(() => {\n\t\tif (!activeCategory) {\n\t\t\treturn availableCategories.map((c) => ({\n\t\t\t\tid: c.key,\n\t\t\t\tlabel: c.label,\n\t\t\t\tdrillsIn: true,\n\t\t\t\tonActivate: () => {\n\t\t\t\t\tsetCategory(c.key);\n\t\t\t\t\tsetSource(null);\n\t\t\t\t},\n\t\t\t}));\n\t\t}\n\t\tif (activeCategory === 'subagent') {\n\t\t\tconst sq = search.trim().toLowerCase();\n\t\t\tconst leaves: PickerRowModel[] = subAgents\n\t\t\t\t.filter((item) => !sq || rowLabel(item).toLowerCase().includes(sq))\n\t\t\t\t.map((item) => ({\n\t\t\t\t\tid: String(item.id),\n\t\t\t\t\tlabel: rowLabel(item),\n\t\t\t\t\tdrillsIn: false,\n\t\t\t\t\tonActivate: () => onSelect(item),\n\t\t\t\t}));\n\t\t\t// \"Create new\" opens the drawer — first dismiss the menu (strips the \"@\").\n\t\t\tif (onCreateSubAgent) {\n\t\t\t\tleaves.push({\n\t\t\t\t\tid: CREATE_SUBAGENT_ID,\n\t\t\t\t\tlabel: 'Create new',\n\t\t\t\t\tdrillsIn: false,\n\t\t\t\t\tisCreate: true,\n\t\t\t\t\tonActivate: () => {\n\t\t\t\t\t\tonClose?.();\n\t\t\t\t\t\tonCreateSubAgent();\n\t\t\t\t\t},\n\t\t\t\t});\n\t\t\t}\n\t\t\treturn leaves;\n\t\t}\n\t\tif (activeCategory === 'variable') {\n\t\t\t// The embedded VariablePicker owns this view (its own search + rows) —\n\t\t\t// no navigable PickerRow list of our own.\n\t\t\treturn [];\n\t\t}\n\t\tif (!source || source === MORE_INTEGRATIONS_KEY) {\n\t\t\t// The real sources (from instances) plus any action source (Rest API /\n\t\t\t// email / Slack) with no instances yet, so it still appears for first-time\n\t\t\t// 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\tconst combined = [...sources, ...actionOnly];\n\n\t\t\t// One row per source: Connect (unconnected) / a single collapsed leaf\n\t\t\t// (action sources) / a drill-in group (integrations + multi-tool sources).\n\t\t\tconst buildSourceRow = (s: string): PickerRowModel => {\n\t\t\t\tconst action = actionBySource.get(s);\n\t\t\t\t// Not connected → a \"Connect\" row (no drill-in / no instances / no\n\t\t\t\t// \"Create new\"); clicking dismisses the picker and runs the connect\n\t\t\t\t// flow. Applies to config actions (their own `connected`) AND native\n\t\t\t\t// source groups (via `integrationStatus`), so both look consistent.\n\t\t\t\tconst connected =\n\t\t\t\t\taction !== undefined\n\t\t\t\t\t\t? action.connected\n\t\t\t\t\t\t: integrationStatus?.[s as ToolSource];\n\t\t\t\tif (connected === false) {\n\t\t\t\t\treturn {\n\t\t\t\t\t\tid: s,\n\t\t\t\t\t\tlabel: toolSourceLabel(s),\n\t\t\t\t\t\tdrillsIn: false,\n\t\t\t\t\t\ticon: sourceIcon(s) ?? action?.icon,\n\t\t\t\t\t\trightLabel: 'Connect',\n\t\t\t\t\t\tonActivate: () => {\n\t\t\t\t\t\t\tonClose?.();\n\t\t\t\t\t\t\tif (action?.onConnect) {\n\t\t\t\t\t\t\t\taction.onConnect();\n\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\tonConnectIntegration?.(s as ToolSource);\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}\n\t\t\t\t// A source whose drill-in view would hold exactly one leaf is normally\n\t\t\t\t// surfaced as that single leaf right here (its function name + the same\n\t\t\t\t// source icon). Covers \"no Rest API added yet\" (→ open the create modal\n\t\t\t\t// directly) and a config tool's single capability (Slack → \"Send Slack\n\t\t\t\t// message\", email → \"Send email\"). EXCEPTION: external integrations\n\t\t\t\t// (Shopify / BigCommerce / ShipStation / Skio / Gorgias / AfterShip)\n\t\t\t\t// always stay a drill-in group even with a single tool, so the vendor\n\t\t\t\t// reads as its own discoverable, connectable unit.\n\t\t\t\tconst instances = tools.filter(\n\t\t\t\t\t(t) => (metaOf(t)?.source ?? 'other') === s,\n\t\t\t\t);\n\t\t\t\tconst collapseSingleLeaf =\n\t\t\t\t\tinstances.length + (action ? 1 : 0) === 1 &&\n\t\t\t\t\t!(action === undefined && isIntegrationSource(s));\n\t\t\t\tif (collapseSingleLeaf) {\n\t\t\t\t\tconst icon = sourceIcon(s) ?? action?.icon;\n\t\t\t\t\tif (action) {\n\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\tid: s,\n\t\t\t\t\t\t\tlabel: action.label,\n\t\t\t\t\t\t\tdrillsIn: false,\n\t\t\t\t\t\t\ticon,\n\t\t\t\t\t\t\tonActivate: () => {\n\t\t\t\t\t\t\t\tonClose?.();\n\t\t\t\t\t\t\t\taction.onSelect();\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\tconst only = instances[0];\n\t\t\t\t\treturn {\n\t\t\t\t\t\tid: String(only.id),\n\t\t\t\t\t\tlabel: rowLabel(only),\n\t\t\t\t\t\tdrillsIn: false,\n\t\t\t\t\t\ticon,\n\t\t\t\t\t\tauthRequired: metaOf(only)?.authRequired,\n\t\t\t\t\t\tonActivate: () => onSelect(only),\n\t\t\t\t\t};\n\t\t\t\t}\n\t\t\t\treturn {\n\t\t\t\t\tid: s,\n\t\t\t\t\tlabel: toolSourceLabel(s),\n\t\t\t\t\tdrillsIn: true,\n\t\t\t\t\ticon: sourceIcon(s) ?? action?.icon,\n\t\t\t\t\tonActivate: () => setSource(s),\n\t\t\t\t};\n\t\t\t};\n\n\t\t\t// Umbrella view: one row per vendor integration that lives under\n\t\t\t// \"More Integrations\" (ShipStation / BigCommerce / …).\n\t\t\tif (source === MORE_INTEGRATIONS_KEY) {\n\t\t\t\treturn combined\n\t\t\t\t\t.filter((s) => isMoreIntegrationSource(s))\n\t\t\t\t\t.sort((a, b) => toolSourceRank(a) - toolSourceRank(b))\n\t\t\t\t\t.map(buildSourceRow);\n\t\t\t}\n\n\t\t\t// Root chooser: Manifest / Shopify / the action sources each keep their\n\t\t\t// own top-level row; the vendor integrations collapse into ONE\n\t\t\t// \"More Integrations\" umbrella row (shown only when any exist). Fixed rank\n\t\t\t// order so adding / updating a tool never reshuffles the picker.\n\t\t\tconst rootRows: { row: PickerRowModel; rank: number }[] = combined\n\t\t\t\t.filter((s) => !isMoreIntegrationSource(s))\n\t\t\t\t.map((s) => ({ row: buildSourceRow(s), rank: toolSourceRank(s) }));\n\t\t\tif (combined.some((s) => isMoreIntegrationSource(s))) {\n\t\t\t\trootRows.push({\n\t\t\t\t\trank: MORE_INTEGRATIONS_RANK,\n\t\t\t\t\trow: {\n\t\t\t\t\t\tid: MORE_INTEGRATIONS_KEY,\n\t\t\t\t\t\tlabel: MORE_INTEGRATIONS_LABEL,\n\t\t\t\t\t\tdrillsIn: true,\n\t\t\t\t\t\ticon: MORE_INTEGRATIONS_ICON,\n\t\t\t\t\t\tonActivate: () => setSource(MORE_INTEGRATIONS_KEY),\n\t\t\t\t\t},\n\t\t\t\t});\n\t\t\t}\n\t\t\treturn rootRows.sort((a, b) => a.rank - b.rank).map((e) => e.row);\n\t\t}\n\t\tconst q = search.trim().toLowerCase();\n\t\tconst leaves: PickerRowModel[] = tools\n\t\t\t.filter((t) => (metaOf(t)?.source ?? 'other') === source)\n\t\t\t.filter((t) => !q || rowLabel(t).toLowerCase().includes(q))\n\t\t\t.map((item) => ({\n\t\t\t\tid: String(item.id),\n\t\t\t\tlabel: rowLabel(item),\n\t\t\t\tdrillsIn: false,\n\t\t\t\tauthRequired: metaOf(item)?.authRequired,\n\t\t\t\tonActivate: () => onSelect(item),\n\t\t\t}));\n\t\t// A configurable source's add row, below any existing instances, opening\n\t\t// its drawer. Config tools (Slack / email) are a single fixed capability →\n\t\t// render like a normal tool leaf (label only, no icon — matching the tool\n\t\t// rows). Rest API instances are user-created, so its \"add\" stays a\n\t\t// brand-coloured create row.\n\t\tconst action = actionBySource.get(source);\n\t\tif (action) {\n\t\t\tconst isConfigTool = source in CONFIG_TOOL_SOURCES;\n\t\t\tleaves.push({\n\t\t\t\tid: `create:${source}`,\n\t\t\t\tlabel: action.label,\n\t\t\t\tdrillsIn: false,\n\t\t\t\tisCreate: !isConfigTool,\n\t\t\t\tonActivate: () => {\n\t\t\t\t\tonClose?.();\n\t\t\t\t\taction.onSelect();\n\t\t\t\t},\n\t\t\t});\n\t\t}\n\t\treturn leaves;\n\t}, [\n\t\tactiveCategory,\n\t\tavailableCategories,\n\t\tsource,\n\t\tsearch,\n\t\ttools,\n\t\tsubAgents,\n\t\tsources,\n\t\tonSelect,\n\t\tonClose,\n\t\tonCreateSubAgent,\n\t\ttoolActions,\n\t\tactionBySource,\n\t\tintegrationStatus,\n\t\tonConnectIntegration,\n\t]);\n\n\t// Reset highlight whenever the view (or filtered result set) changes.\n\tuseEffect(() => setActiveIndex(-1), [activeCategory, source, search, items]);\n\t// Clear the search box when leaving a source view.\n\tuseEffect(() => setSearch(''), [activeCategory, source]);\n\n\t// Keep the latest rows/index reachable from the stable key handler.\n\tconst navRef = useRef({ rows, activeIndex, header });\n\tnavRef.current = { rows, activeIndex, header };\n\n\tuseEffect(() => {\n\t\tif (!registerKeyHandler) {\n\t\t\treturn;\n\t\t}\n\t\tregisterKeyHandler((event) => {\n\t\t\tconst { rows: r, activeIndex: i, header: h } = navRef.current;\n\t\t\t// The Variables view has no navigable rows of its own (the embedded\n\t\t\t// VariablePicker owns that surface) — swallowing arrows / Enter there\n\t\t\t// would freeze the keyboard for nothing. Let those keys fall through\n\t\t\t// to the editor; ArrowLeft still navigates back below.\n\t\t\tif (!r.length && event.key !== 'ArrowLeft') {\n\t\t\t\treturn false;\n\t\t\t}\n\t\t\tswitch (event.key) {\n\t\t\t\tcase 'ArrowDown':\n\t\t\t\t\tsetActiveIndex((p) => (p + 1) % r.length);\n\t\t\t\t\treturn true;\n\t\t\t\tcase 'ArrowUp':\n\t\t\t\t\tsetActiveIndex((p) => (p + r.length - 1) % r.length);\n\t\t\t\t\treturn true;\n\t\t\t\tcase 'ArrowRight':\n\t\t\t\tcase 'Enter':\n\t\t\t\t\t// Nothing highlighted yet → treat the first row as the target so\n\t\t\t\t\t// the editor's @-flow (type, then Enter) still works.\n\t\t\t\t\t(r[i] ?? r[0])?.onActivate();\n\t\t\t\t\treturn true;\n\t\t\t\tcase 'ArrowLeft':\n\t\t\t\t\tif (h?.onBack) {\n\t\t\t\t\t\th.onBack();\n\t\t\t\t\t\treturn true;\n\t\t\t\t\t}\n\t\t\t\t\treturn false;\n\t\t\t\tdefault:\n\t\t\t\t\treturn false;\n\t\t\t}\n\t\t});\n\t\treturn () => registerKeyHandler(null);\n\t}, [registerKeyHandler]);\n\n\tconst variant = !activeCategory\n\t\t? 'categories'\n\t\t: rows.length && !rows[0].drillsIn\n\t\t? 'items'\n\t\t: 'sources';\n\n\t// Search lives inside a source's tool list (Manifest / Shopify) and in the\n\t// sub-agent list.\n\tconst showSearch =\n\t\t(activeCategory === 'tool' &&\n\t\t\t!!source &&\n\t\t\tsource !== MORE_INTEGRATIONS_KEY) ||\n\t\tactiveCategory === 'subagent';\n\n\treturn (\n\t\t<PickerCard\n\t\t\tclassName={`bik-mention-picker bik-mention-picker--${variant}`}\n\t\t\t// Variables view: a definite height so the embedded VariablePicker's\n\t\t\t// internal list scroll (below its fixed search bar) can resolve.\n\t\t\t$fixedHeight={activeCategory === 'variable'}\n\t\t>\n\t\t\t{header && (\n\t\t\t\t<PickerBack\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\tonClick={header.onBack}\n\t\t\t\t\tdisabled={!header.onBack}\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tbackground: COLORS.surface.subdued,\n\t\t\t\t\t\tcursor: header.onBack ? 'pointer' : 'default',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{header.onBack && (\n\t\t\t\t\t\t<SvgArrowLeft\n\t\t\t\t\t\t\twidth={20}\n\t\t\t\t\t\t\theight={20}\n\t\t\t\t\t\t\tcolor={COLORS.content.primary}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t\t{header.icon && renderSourceIcon(header.icon)}\n\t\t\t\t\t<TitleSmall> {header.title}</TitleSmall>\n\t\t\t\t</PickerBack>\n\t\t\t)}\n\t\t\t{showSearch && (\n\t\t\t\t<PickerSearchRow>\n\t\t\t\t\t<SearchIcon\n\t\t\t\t\t\twidth={20}\n\t\t\t\t\t\theight={20}\n\t\t\t\t\t\tcolor={COLORS.content.placeholder}\n\t\t\t\t\t/>\n\t\t\t\t\t<PickerSearchInput\n\t\t\t\t\t\t// Focus on open so the user can type immediately (appears only\n\t\t\t\t\t\t// after they drill into a source).\n\t\t\t\t\t\t// eslint-disable-next-line jsx-a11y/no-autofocus\n\t\t\t\t\t\tautoFocus\n\t\t\t\t\t\tvalue={search}\n\t\t\t\t\t\tplaceholder=\"Search\"\n\t\t\t\t\t\tdata-test=\"mention-picker-search\"\n\t\t\t\t\t\tonChange={(e) => setSearch(e.target.value)}\n\t\t\t\t\t\tonKeyDown={(e) => {\n\t\t\t\t\t\t\tif (!rows.length) {\n\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tif (e.key === 'ArrowDown') {\n\t\t\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\t\t\tsetActiveIndex((p) => (p + 1) % rows.length);\n\t\t\t\t\t\t\t} else if (e.key === 'ArrowUp') {\n\t\t\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\t\t\tsetActiveIndex((p) => (p + rows.length - 1) % rows.length);\n\t\t\t\t\t\t\t} else if (e.key === 'Enter') {\n\t\t\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\t\t\t(rows[activeIndex] ?? rows[0])?.onActivate();\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t</PickerSearchRow>\n\t\t\t)}\n\t\t\t{activeCategory === 'variable' ? (\n\t\t\t\t// Shared variable catalog, embedded as this drill-in view. The fill\n\t\t\t\t// wrapper hands it the remaining card height, so ITS search bar stays\n\t\t\t\t// fixed and only the variable list below scrolls. Selecting a\n\t\t\t\t// variable dismisses the menu FIRST (strips the typed \"@\" + query),\n\t\t\t\t// then hands the variable up to insert its `{{token}}` at the cursor.\n\t\t\t\t<VariableFill>\n\t\t\t\t\t<VariablePicker\n\t\t\t\t\t\ttype={PickerType.EMBEDDED}\n\t\t\t\t\t\tdata={variablesData ?? []}\n\t\t\t\t\t\t// \"Only Recommended\" bar shown and ON to start, same as the\n\t\t\t\t\t\t// dashboard's pickers — the catalog is long and most of it is\n\t\t\t\t\t\t// irrelevant to a given agent field. Merchants flip it off to\n\t\t\t\t\t\t// reach the full list. (The prop drives both the bar and the\n\t\t\t\t\t\t// initial filter state; see VariablePicker's mount effect.)\n\t\t\t\t\t\tshowRecommendedBar\n\t\t\t\t\t\t// Insert the reference token directly — the \"set up a default\n\t\t\t\t\t\t// value\" flow doesn't apply in the agent builder.\n\t\t\t\t\t\tskipDefaultVariableContent\n\t\t\t\t\t\tonSelect={(variable: VariableV3) => {\n\t\t\t\t\t\t\tonClose?.();\n\t\t\t\t\t\t\tonSelectVariable?.(variable);\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t</VariableFill>\n\t\t\t) : rows.length === 0 ? (\n\t\t\t\t<PickerEmpty>\n\t\t\t\t\t{activeCategory === 'subagent' ? null : 'No tools available'}\n\t\t\t\t</PickerEmpty>\n\t\t\t) : (\n\t\t\t\t<PickerScroll>\n\t\t\t\t\t{rows.map((row, i) => (\n\t\t\t\t\t\t<PickerRow\n\t\t\t\t\t\t\tkey={row.id}\n\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t$active={i === activeIndex}\n\t\t\t\t\t\t\tonMouseEnter={() => setActiveIndex(i)}\n\t\t\t\t\t\t\tonMouseLeave={() => setActiveIndex(-1)}\n\t\t\t\t\t\t\tonClick={row.onActivate}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{row.isCreate ? (\n\t\t\t\t\t\t\t\t<CreateRowText>{row.label}</CreateRowText>\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t<PickerRowMain>\n\t\t\t\t\t\t\t\t\t\t{renderSourceIcon(row.icon)}\n\t\t\t\t\t\t\t\t\t\t<BodySecondary color={COLORS.content.primary}>\n\t\t\t\t\t\t\t\t\t\t\t{row.label}\n\t\t\t\t\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t\t\t\t\t\t{row.authRequired && (\n\t\t\t\t\t\t\t\t\t\t\t<Shield\n\t\t\t\t\t\t\t\t\t\t\t\tsize={14}\n\t\t\t\t\t\t\t\t\t\t\t\taria-label=\"Requires customer verification\"\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t</PickerRowMain>\n\t\t\t\t\t\t\t\t\t{row.rightLabel ? (\n\t\t\t\t\t\t\t\t\t\t<RightActionText>{row.rightLabel}</RightActionText>\n\t\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t\trow.drillsIn && <ChevronRight width={12} height={12} />\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</PickerRow>\n\t\t\t\t\t))}\n\t\t\t\t</PickerScroll>\n\t\t\t)}\n\t\t\t{rows.some((row) => row.authRequired) && (\n\t\t\t\t<PickerLegend>\n\t\t\t\t\t<Shield size={16} />\n\t\t\t\t\t<BodyCaption color={COLORS.content.secondary}>\n\t\t\t\t\t\tThis tool requires customer verification\n\t\t\t\t\t</BodyCaption>\n\t\t\t\t</PickerLegend>\n\t\t\t)}\n\t\t</PickerCard>\n\t);\n};\n\n// The card itself never scrolls — the header / search stay fixed and only the\n// list area (PickerScroll, or the embedded VariablePicker's own list) does.\nconst PickerCard = styled.div<{ $fixedHeight?: boolean }>`\n\tdisplay: flex;\n\tflex-direction: column;\n\tmin-width: 240px;\n\t/* Variables view is 45px taller: that is what the embedded picker's \"Only\n\t   Recommended\" bar costs, so the variable list keeps the room it had before\n\t   the bar was turned on (VariablePicker's calculateHeight subtracts it). */\n\t${(p) => (p.$fixedHeight ? 'height: 346px;' : 'max-height: 301px;')}\n\toverflow: hidden;\n\tbackground: ${COLORS.surface.standard};\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 4px;\n\tbox-shadow: 0px -2px 8px 0px #0000001f;\n`;\n\n// Scrollable row list below the fixed header / search (scrollbar hidden —\n// the fixed header already signals there's more below).\nconst PickerScroll = styled.div`\n\tflex: 1 1 auto;\n\tmin-height: 0;\n\toverflow-y: auto;\n\tscrollbar-width: none;\n\n\t&::-webkit-scrollbar {\n\t\tdisplay: none;\n\t}\n`;\n\n// Hands the embedded VariablePicker the card's remaining height (its Content\n// sizes itself with percentages, so the chain must be definite). Its internal\n// list scrollbar is hidden to match PickerScroll.\nconst VariableFill = styled.div`\n\tflex: 1 1 auto;\n\tmin-height: 0;\n\n\t> div {\n\t\theight: 100%;\n\t}\n\n\t* {\n\t\tscrollbar-width: none;\n\t}\n\n\t*::-webkit-scrollbar {\n\t\tdisplay: none;\n\t}\n`;\n\n// Search box at the top of a source's tool list (Manifest / Shopify).\nconst PickerSearchRow = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n\tpadding: 10px 12px;\n\tflex-shrink: 0;\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\t/* The card is a flex column with a max-height; without these a long list\n\t   compresses its rows below 48px (why only the short first step looked right)\n\t   instead of scrolling. Pin the row so the card scrolls instead. */\n\tbox-sizing: border-box;\n\tflex-shrink: 0;\n\tborder: none;\n\tborder-bottom: 1px solid ${COLORS.stroke.primary};\n\tbackground: ${(p) => (p.$active ? COLORS.surface.subdued : 'transparent')};\n\tcursor: pointer;\n\ttext-align: left;\n\n\t&:hover {\n\t\tbackground: ${COLORS.surface.hovered};\n\t}\n`;\n\n// Left cluster: leading source glyph + label (chevron stays right via PickerRow).\nconst PickerRowMain = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 12px;\n\tmin-width: 0;\n`;\n\n// Footer legend, shown when the list holds any auth-required tool.\nconst PickerLegend = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 6px;\n\tpadding: 8px 12px;\n\tborder-top: 1px solid ${COLORS.stroke.primary};\n`;\n\n// Right-aligned brand action text (e.g. \"Connect\") in place of the chevron.\nconst RightActionText = styled.span`\n\tflex-shrink: 0;\n\tcolor: ${COLORS.content.brand};\n\tfont-family: Inter;\n\tfont-size: 14px;\n\tfont-weight: 600;\n\twhite-space: nowrap;\n`;\n\n// \"Create new\" — centered brand text, no icon (matches the side-panel dropdown).\nconst CreateRowText = styled.div`\n\twidth: 100%;\n\ttext-align: center;\n\tcolor: ${COLORS.content.brand};\n\tfont-family: Inter;\n\tfont-size: 14px;\n\tfont-weight: 600;\n`;\n\nconst PickerBack = styled.button`\n\tdisplay: flex;\n\talign-items: center;\n\tpadding: 12px 16px;\n\tborder: none;\n\tborder-bottom: 1px solid ${COLORS.stroke.primary};\n\tbackground: transparent;\n\tcursor: pointer;\n\tfont-family: Inter;\n\tfont-size: 12px;\n\tfont-weight: 600;\n\theight: 48px;\n\tbox-sizing: border-box;\n\tflex-shrink: 0;\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":["MORE_INTEGRATIONS_ICON","PuzzlePiece","metaOf","item","rowLabel","CREATE_SUBAGENT_ID","MentionPicker","items","onSelect","registerKeyHandler","onClose","onCreateSubAgent","initialSource","toolActions","integrationStatus","onConnectIntegration","variablesData","onSelectVariable","category","setCategory","useState","source","setSource","activeIndex","setActiveIndex","search","setSearch","tools","useMemo","i","subAgents","sources","acc","t","s","actionBySource","a","availableCategories","CATEGORIES","c","soleCategory","activeCategory","header","MORE_INTEGRATIONS_KEY","MORE_INTEGRATIONS_LABEL","toolSourceLabel","isMoreIntegrationSource","sourceIcon","rows","sq","leaves","actionOnly","combined","buildSourceRow","action","instances","isIntegrationSource","icon","only","b","toolSourceRank","rootRows","MORE_INTEGRATIONS_RANK","e","q","isConfigTool","CONFIG_TOOL_SOURCES","useEffect","navRef","useRef","event","r","h","variant","showSearch","jsxs","PickerCard","PickerBack","COLORS","jsx","SvgArrowLeft","renderSourceIcon","TitleSmall","PickerSearchRow","SearchIcon","PickerSearchInput","p","VariableFill","VariablePicker","PickerType","variable","PickerEmpty","PickerScroll","row","PickerRow","CreateRowText","Fragment","PickerRowMain","BodySecondary","Shield","RightActionText","ChevronRight","PickerLegend","BodyCaption","styled"],"mappings":"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"}
+{"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 { PuzzlePiece, Shield } from '@src/icons';\nimport SvgArrowLeft from '@src/icons/Arrows/Normal arrows/ArrowLeft';\nimport React, { useEffect, useMemo, useRef, useState } from 'react';\nimport styled from 'styled-components';\nimport {\n\tBodyCaption,\n\tBodySecondary,\n\tTitleSmall,\n} from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport { VariablePicker } from '../../variable-picker-v3';\nimport { PickerType } from '../../variable-picker-v3/model';\nimport type {\n\tVariableListInterfaceV3,\n\tVariableV3,\n} from '../../variable-picker-v3/model';\nimport {\n\tCATEGORIES,\n\tCONFIG_TOOL_SOURCES,\n\tisIntegrationSource,\n\tisMoreIntegrationSource,\n\tMORE_INTEGRATIONS_KEY,\n\tMORE_INTEGRATIONS_LABEL,\n\tMORE_INTEGRATIONS_RANK,\n\ttoolSourceRank,\n} from '../constants/tools';\nimport type {\n\tCategory,\n\tIconComp,\n\tToolAction,\n\tToolSource,\n} from '../constants/tools';\nimport {\n\tMentionKindMeta,\n\ttoolSourceLabel,\n} from '../utils/mentionSerialization';\nimport { renderSourceIcon, sourceIcon, SourceIcon } from '../utils/sourceIcons';\n\n// Icon for the synthetic \"More Integrations\" umbrella row (not a real source, so\n// it isn't in SOURCE_ICONS).\nconst MORE_INTEGRATIONS_ICON: SourceIcon = {\n\tIcon: PuzzlePiece as IconComp,\n\tw: 20,\n\th: 20,\n};\n\nconst metaOf = (item: MentionItem): MentionKindMeta | undefined =>\n\titem.meta as unknown as MentionKindMeta | undefined;\n\nconst rowLabel = (item: MentionItem): string =>\n\tmetaOf(item)?.plainLabel ?? item.label;\n\n/** One navigable row in the picker's current view. */\ntype PickerRowModel = {\n\tid: string;\n\tlabel: string;\n\t/** Drill-in rows show a chevron; leaf (selectable) rows do not. */\n\tdrillsIn: boolean;\n\t/** Leading brand glyph (source rows only). */\n\ticon?: SourceIcon;\n\t/** Brand-coloured \"Create new\" action row (not a selectable item). */\n\tisCreate?: boolean;\n\t/**\n\t * Brand-coloured right-aligned action text (e.g. \"Connect\") shown in place of\n\t * the drill-in chevron — used for an unconnected integration source.\n\t */\n\trightLabel?: string;\n\t/** Tool leaf touches customer-private data → shows a shield glyph. */\n\tauthRequired?: boolean;\n\tonActivate: () => void;\n};\n\n/** Sentinel id for the sub-agent \"Create new\" row. */\nconst CREATE_SUBAGENT_ID = '__bik_create_subagent__';\n\ntype MentionPickerProps = MentionDropdownRenderProps & {\n\t/** Opens the create-sub-agent drawer (shows a \"Create new\" row in the Sub-agent view). */\n\tonCreateSubAgent?: () => void;\n\t/**\n\t * Open already drilled into this tool source (e.g. `'shopify'`) — its tool list\n\t * is shown immediately. */\n\tinitialSource?: string;\n\t/**\n\t * Built-in tool actions (Rest API / Handover to email) shown in the Tools view.\n\t * Picking one opens its config drawer (via `onSelect`) and dismisses the picker\n\t * — it never inserts a mention into the text.\n\t */\n\ttoolActions?: ToolAction[];\n\t/**\n\t * Per-source integration connection state. A source whose value is `false`\n\t * renders a \"Connect\" row (like an unconnected action) instead of drilling in —\n\t * so native source groups (Shopify / BigCommerce / ShipStation) show \"Connect\"\n\t * consistently with the config actions (Slack).\n\t */\n\tintegrationStatus?: Partial<Record<ToolSource, boolean>>;\n\t/** Open the connect flow for an unconnected source (used by the Connect row). */\n\tonConnectIntegration?: (source: ToolSource) => void;\n\t/**\n\t * Host-app name for the native (`manifest`) tool group — \"BIK\" in BIK, \"BSP\"\n\t * in BSP. Defaults to \"Manifest\"; pass `appTypeLabel(applicationType)`.\n\t */\n\tappLabel?: string;\n\t/**\n\t * Variable catalog for the \"Variables\" view (the shared VariablePicker's\n\t * `data`). Omitted / empty → the Variables category is not offered.\n\t */\n\tvariablesData?: VariableListInterfaceV3[];\n\t/**\n\t * A variable was picked from the Variables view. The picker dismisses itself\n\t * (stripping the typed `@`) BEFORE calling this — the handler inserts a\n\t * `Variable: <name>` mention chip (see MentionEditor).\n\t */\n\tonSelectVariable?: (variable: VariableV3) => void;\n};\n\n/**\n * `@` reference picker. Drills:\n *   root → Tools → <source> (Manifest / Shopify / …) → tool\n *        → Sub-agent → sub-agent\n *        → Variables → shared VariablePicker (embedded)\n * (\"Add condition\" is intentionally not shown yet.)\n *\n * Owns keyboard navigation (↑/↓ move, →/Enter activate, ← go back) over the\n * CURRENTLY visible rows — registered with the editor via `registerKeyHandler`.\n */\nexport const MentionPicker: React.FC<MentionPickerProps> = ({\n\titems,\n\tonSelect,\n\tregisterKeyHandler,\n\tonClose,\n\tonCreateSubAgent,\n\tinitialSource,\n\ttoolActions,\n\tintegrationStatus,\n\tonConnectIntegration,\n\tappLabel,\n\tvariablesData,\n\tonSelectVariable,\n}) => {\n\tconst [category, setCategory] = useState<Category | null>(null);\n\tconst [source, setSource] = useState<string | null>(initialSource ?? null);\n\t// -1 = nothing highlighted; rows highlight only on hover / arrow keys\n\t// (a default highlight reads as a stuck hover state).\n\tconst [activeIndex, setActiveIndex] = useState(-1);\n\t// Search box shown inside a source's tool list (Manifest / Shopify); filters\n\t// that source's tools by name.\n\tconst [search, setSearch] = useState('');\n\n\tconst tools = useMemo(\n\t\t() => items.filter((i) => metaOf(i)?.kind === 'tool'),\n\t\t[items],\n\t);\n\tconst subAgents = useMemo(\n\t\t() => items.filter((i) => metaOf(i)?.kind === 'subagent'),\n\t\t[items],\n\t);\n\tconst sources = useMemo(() => {\n\t\tconst acc: string[] = [];\n\t\ttools.forEach((t) => {\n\t\t\tconst s = metaOf(t)?.source ?? 'other';\n\t\t\tif (!acc.includes(s)) {\n\t\t\t\tacc.push(s);\n\t\t\t}\n\t\t});\n\t\treturn acc;\n\t}, [tools]);\n\t// The built-in \"create\" action per source (Rest API / email / Slack). A source\n\t// with an action drills into [its instances + a \"Create new\" row] — like the\n\t// Sub-agent category — instead of showing a duplicate flat \"create\" row.\n\tconst actionBySource = useMemo(\n\t\t() =>\n\t\t\tnew Map<string, ToolAction>(\n\t\t\t\t(toolActions ?? []).map((a) => [a.source, a]),\n\t\t\t),\n\t\t[toolActions],\n\t);\n\n\t// Show a category when it has items — and ALWAYS show Sub-agent when creating\n\t// one is possible, so an agent with no sub-agents yet still gets the root\n\t// \"Tools / Sub-agent\" choice (with a \"Create new\" inside). When only one is\n\t// available (e.g. the sub-agent drawer offers tools only) the selector is skipped.\n\tconst availableCategories = useMemo(\n\t\t() =>\n\t\t\tCATEGORIES.filter((c) => {\n\t\t\t\tif (c.key === 'tool') {\n\t\t\t\t\treturn tools.length > 0 || (toolActions?.length ?? 0) > 0;\n\t\t\t\t}\n\t\t\t\tif (c.key === 'variable') {\n\t\t\t\t\treturn (variablesData?.length ?? 0) > 0 && !!onSelectVariable;\n\t\t\t\t}\n\t\t\t\treturn subAgents.length > 0 || !!onCreateSubAgent;\n\t\t\t}),\n\t\t[\n\t\t\ttools.length,\n\t\t\tsubAgents.length,\n\t\t\tonCreateSubAgent,\n\t\t\ttoolActions?.length,\n\t\t\tvariablesData?.length,\n\t\t\tonSelectVariable,\n\t\t],\n\t);\n\tconst soleCategory =\n\t\tavailableCategories.length === 1 ? availableCategories[0].key : null;\n\tconst activeCategory = category ?? soleCategory;\n\n\t// Title shown above the current view. `onBack` is omitted at a root level (a\n\t// sole category has nowhere to go back to) — the header then shows as a plain\n\t// title. When `onBack` is set the header leads with a back arrow, followed by\n\t// the source icon in a source detail view: `[← back][icon][title]`.\n\tconst header: {\n\t\ttitle: string;\n\t\tonBack?: () => void;\n\t\ticon?: SourceIcon;\n\t} | null = !activeCategory\n\t\t? null\n\t\t: activeCategory === 'subagent'\n\t\t? // Always titled — with a back arrow only when the category chooser is above.\n\t\t  {\n\t\t\t\ttitle: 'Sub-agent',\n\t\t\t\tonBack: soleCategory ? undefined : () => setCategory(null),\n\t\t  }\n\t\t: activeCategory === 'variable'\n\t\t? {\n\t\t\t\ttitle: 'Variables',\n\t\t\t\tonBack: soleCategory ? undefined : () => setCategory(null),\n\t\t  }\n\t\t: source === MORE_INTEGRATIONS_KEY\n\t\t? {\n\t\t\t\ttitle: MORE_INTEGRATIONS_LABEL,\n\t\t\t\tonBack: () => setSource(null),\n\t\t\t\ticon: MORE_INTEGRATIONS_ICON,\n\t\t  }\n\t\t: source\n\t\t? {\n\t\t\t\ttitle: toolSourceLabel(source, appLabel),\n\t\t\t\t// Deep-linked to a source (opened from a right-panel source button):\n\t\t\t\t// that source IS the root, so no back arrow. Otherwise back returns to\n\t\t\t\t// the \"More Integrations\" umbrella for a vendor that lives under it,\n\t\t\t\t// else to the source chooser.\n\t\t\t\tonBack: initialSource\n\t\t\t\t\t? undefined\n\t\t\t\t\t: () =>\n\t\t\t\t\t\t\tsetSource(\n\t\t\t\t\t\t\t\tisMoreIntegrationSource(source) ? MORE_INTEGRATIONS_KEY : null,\n\t\t\t\t\t\t\t),\n\t\t\t\ticon: sourceIcon(source),\n\t\t  }\n\t\t: // Always titled — matches the Sub-agent header; back arrow only when the\n\t\t  // category chooser is above (i.e. not the sole category).\n\t\t  {\n\t\t\t\ttitle: 'Tools',\n\t\t\t\tonBack: soleCategory ? undefined : () => setCategory(null),\n\t\t  };\n\n\t// Build the navigable rows for the current view.\n\tconst rows: PickerRowModel[] = useMemo(() => {\n\t\tif (!activeCategory) {\n\t\t\treturn availableCategories.map((c) => ({\n\t\t\t\tid: c.key,\n\t\t\t\tlabel: c.label,\n\t\t\t\tdrillsIn: true,\n\t\t\t\tonActivate: () => {\n\t\t\t\t\tsetCategory(c.key);\n\t\t\t\t\tsetSource(null);\n\t\t\t\t},\n\t\t\t}));\n\t\t}\n\t\tif (activeCategory === 'subagent') {\n\t\t\tconst sq = search.trim().toLowerCase();\n\t\t\tconst leaves: PickerRowModel[] = subAgents\n\t\t\t\t.filter((item) => !sq || rowLabel(item).toLowerCase().includes(sq))\n\t\t\t\t.map((item) => ({\n\t\t\t\t\tid: String(item.id),\n\t\t\t\t\tlabel: rowLabel(item),\n\t\t\t\t\tdrillsIn: false,\n\t\t\t\t\tonActivate: () => onSelect(item),\n\t\t\t\t}));\n\t\t\t// \"Create new\" opens the drawer — first dismiss the menu (strips the \"@\").\n\t\t\tif (onCreateSubAgent) {\n\t\t\t\tleaves.push({\n\t\t\t\t\tid: CREATE_SUBAGENT_ID,\n\t\t\t\t\tlabel: 'Create new',\n\t\t\t\t\tdrillsIn: false,\n\t\t\t\t\tisCreate: true,\n\t\t\t\t\tonActivate: () => {\n\t\t\t\t\t\tonClose?.();\n\t\t\t\t\t\tonCreateSubAgent();\n\t\t\t\t\t},\n\t\t\t\t});\n\t\t\t}\n\t\t\treturn leaves;\n\t\t}\n\t\tif (activeCategory === 'variable') {\n\t\t\t// The embedded VariablePicker owns this view (its own search + rows) —\n\t\t\t// no navigable PickerRow list of our own.\n\t\t\treturn [];\n\t\t}\n\t\tif (!source || source === MORE_INTEGRATIONS_KEY) {\n\t\t\t// The real sources (from instances) plus any action source (Rest API /\n\t\t\t// email / Slack) with no instances yet, so it still appears for first-time\n\t\t\t// 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\tconst combined = [...sources, ...actionOnly];\n\n\t\t\t// One row per source: Connect (unconnected) / a single collapsed leaf\n\t\t\t// (action sources) / a drill-in group (integrations + multi-tool sources).\n\t\t\tconst buildSourceRow = (s: string): PickerRowModel => {\n\t\t\t\tconst action = actionBySource.get(s);\n\t\t\t\t// Not connected → a \"Connect\" row (no drill-in / no instances / no\n\t\t\t\t// \"Create new\"); clicking dismisses the picker and runs the connect\n\t\t\t\t// flow. Applies to config actions (their own `connected`) AND native\n\t\t\t\t// source groups (via `integrationStatus`), so both look consistent.\n\t\t\t\tconst connected =\n\t\t\t\t\taction !== undefined\n\t\t\t\t\t\t? action.connected\n\t\t\t\t\t\t: integrationStatus?.[s as ToolSource];\n\t\t\t\tif (connected === false) {\n\t\t\t\t\treturn {\n\t\t\t\t\t\tid: s,\n\t\t\t\t\t\tlabel: toolSourceLabel(s, appLabel),\n\t\t\t\t\t\tdrillsIn: false,\n\t\t\t\t\t\ticon: sourceIcon(s) ?? action?.icon,\n\t\t\t\t\t\trightLabel: 'Connect',\n\t\t\t\t\t\tonActivate: () => {\n\t\t\t\t\t\t\tonClose?.();\n\t\t\t\t\t\t\tif (action?.onConnect) {\n\t\t\t\t\t\t\t\taction.onConnect();\n\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\tonConnectIntegration?.(s as ToolSource);\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}\n\t\t\t\t// A source whose drill-in view would hold exactly one leaf is normally\n\t\t\t\t// surfaced as that single leaf right here (its function name + the same\n\t\t\t\t// source icon). Covers \"no Rest API added yet\" (→ open the create modal\n\t\t\t\t// directly) and a config tool's single capability (Slack → \"Send Slack\n\t\t\t\t// message\", email → \"Send email\"). EXCEPTION: external integrations\n\t\t\t\t// (Shopify / BigCommerce / ShipStation / Skio / Gorgias / AfterShip)\n\t\t\t\t// always stay a drill-in group even with a single tool, so the vendor\n\t\t\t\t// reads as its own discoverable, connectable unit.\n\t\t\t\tconst instances = tools.filter(\n\t\t\t\t\t(t) => (metaOf(t)?.source ?? 'other') === s,\n\t\t\t\t);\n\t\t\t\tconst collapseSingleLeaf =\n\t\t\t\t\tinstances.length + (action ? 1 : 0) === 1 &&\n\t\t\t\t\t!(action === undefined && isIntegrationSource(s));\n\t\t\t\tif (collapseSingleLeaf) {\n\t\t\t\t\tconst icon = sourceIcon(s) ?? action?.icon;\n\t\t\t\t\tif (action) {\n\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\tid: s,\n\t\t\t\t\t\t\tlabel: action.label,\n\t\t\t\t\t\t\tdrillsIn: false,\n\t\t\t\t\t\t\ticon,\n\t\t\t\t\t\t\tonActivate: () => {\n\t\t\t\t\t\t\t\tonClose?.();\n\t\t\t\t\t\t\t\taction.onSelect();\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\tconst only = instances[0];\n\t\t\t\t\treturn {\n\t\t\t\t\t\tid: String(only.id),\n\t\t\t\t\t\tlabel: rowLabel(only),\n\t\t\t\t\t\tdrillsIn: false,\n\t\t\t\t\t\ticon,\n\t\t\t\t\t\tauthRequired: metaOf(only)?.authRequired,\n\t\t\t\t\t\tonActivate: () => onSelect(only),\n\t\t\t\t\t};\n\t\t\t\t}\n\t\t\t\treturn {\n\t\t\t\t\tid: s,\n\t\t\t\t\tlabel: toolSourceLabel(s, appLabel),\n\t\t\t\t\tdrillsIn: true,\n\t\t\t\t\ticon: sourceIcon(s) ?? action?.icon,\n\t\t\t\t\tonActivate: () => setSource(s),\n\t\t\t\t};\n\t\t\t};\n\n\t\t\t// Umbrella view: one row per vendor integration that lives under\n\t\t\t// \"More Integrations\" (ShipStation / BigCommerce / …).\n\t\t\tif (source === MORE_INTEGRATIONS_KEY) {\n\t\t\t\treturn combined\n\t\t\t\t\t.filter((s) => isMoreIntegrationSource(s))\n\t\t\t\t\t.sort((a, b) => toolSourceRank(a) - toolSourceRank(b))\n\t\t\t\t\t.map(buildSourceRow);\n\t\t\t}\n\n\t\t\t// Root chooser: Manifest / Shopify / the action sources each keep their\n\t\t\t// own top-level row; the vendor integrations collapse into ONE\n\t\t\t// \"More Integrations\" umbrella row (shown only when any exist). Fixed rank\n\t\t\t// order so adding / updating a tool never reshuffles the picker.\n\t\t\tconst rootRows: { row: PickerRowModel; rank: number }[] = combined\n\t\t\t\t.filter((s) => !isMoreIntegrationSource(s))\n\t\t\t\t.map((s) => ({ row: buildSourceRow(s), rank: toolSourceRank(s) }));\n\t\t\tif (combined.some((s) => isMoreIntegrationSource(s))) {\n\t\t\t\trootRows.push({\n\t\t\t\t\trank: MORE_INTEGRATIONS_RANK,\n\t\t\t\t\trow: {\n\t\t\t\t\t\tid: MORE_INTEGRATIONS_KEY,\n\t\t\t\t\t\tlabel: MORE_INTEGRATIONS_LABEL,\n\t\t\t\t\t\tdrillsIn: true,\n\t\t\t\t\t\ticon: MORE_INTEGRATIONS_ICON,\n\t\t\t\t\t\tonActivate: () => setSource(MORE_INTEGRATIONS_KEY),\n\t\t\t\t\t},\n\t\t\t\t});\n\t\t\t}\n\t\t\treturn rootRows.sort((a, b) => a.rank - b.rank).map((e) => e.row);\n\t\t}\n\t\tconst q = search.trim().toLowerCase();\n\t\tconst leaves: PickerRowModel[] = tools\n\t\t\t.filter((t) => (metaOf(t)?.source ?? 'other') === source)\n\t\t\t.filter((t) => !q || rowLabel(t).toLowerCase().includes(q))\n\t\t\t.map((item) => ({\n\t\t\t\tid: String(item.id),\n\t\t\t\tlabel: rowLabel(item),\n\t\t\t\tdrillsIn: false,\n\t\t\t\tauthRequired: metaOf(item)?.authRequired,\n\t\t\t\tonActivate: () => onSelect(item),\n\t\t\t}));\n\t\t// A configurable source's add row, below any existing instances, opening\n\t\t// its drawer. Config tools (Slack / email) are a single fixed capability →\n\t\t// render like a normal tool leaf (label only, no icon — matching the tool\n\t\t// rows). Rest API instances are user-created, so its \"add\" stays a\n\t\t// brand-coloured create row.\n\t\tconst action = actionBySource.get(source);\n\t\tif (action) {\n\t\t\tconst isConfigTool = source in CONFIG_TOOL_SOURCES;\n\t\t\tleaves.push({\n\t\t\t\tid: `create:${source}`,\n\t\t\t\tlabel: action.label,\n\t\t\t\tdrillsIn: false,\n\t\t\t\tisCreate: !isConfigTool,\n\t\t\t\tonActivate: () => {\n\t\t\t\t\tonClose?.();\n\t\t\t\t\taction.onSelect();\n\t\t\t\t},\n\t\t\t});\n\t\t}\n\t\treturn leaves;\n\t}, [\n\t\tactiveCategory,\n\t\tavailableCategories,\n\t\tsource,\n\t\tsearch,\n\t\ttools,\n\t\tsubAgents,\n\t\tsources,\n\t\tonSelect,\n\t\tonClose,\n\t\tonCreateSubAgent,\n\t\ttoolActions,\n\t\tactionBySource,\n\t\tintegrationStatus,\n\t\tonConnectIntegration,\n\t\tappLabel,\n\t]);\n\n\t// Reset highlight whenever the view (or filtered result set) changes.\n\tuseEffect(() => setActiveIndex(-1), [activeCategory, source, search, items]);\n\t// Clear the search box when leaving a source view.\n\tuseEffect(() => setSearch(''), [activeCategory, source]);\n\n\t// Keep the latest rows/index reachable from the stable key handler.\n\tconst navRef = useRef({ rows, activeIndex, header });\n\tnavRef.current = { rows, activeIndex, header };\n\n\tuseEffect(() => {\n\t\tif (!registerKeyHandler) {\n\t\t\treturn;\n\t\t}\n\t\tregisterKeyHandler((event) => {\n\t\t\tconst { rows: r, activeIndex: i, header: h } = navRef.current;\n\t\t\t// The Variables view has no navigable rows of its own (the embedded\n\t\t\t// VariablePicker owns that surface) — swallowing arrows / Enter there\n\t\t\t// would freeze the keyboard for nothing. Let those keys fall through\n\t\t\t// to the editor; ArrowLeft still navigates back below.\n\t\t\tif (!r.length && event.key !== 'ArrowLeft') {\n\t\t\t\treturn false;\n\t\t\t}\n\t\t\tswitch (event.key) {\n\t\t\t\tcase 'ArrowDown':\n\t\t\t\t\tsetActiveIndex((p) => (p + 1) % r.length);\n\t\t\t\t\treturn true;\n\t\t\t\tcase 'ArrowUp':\n\t\t\t\t\tsetActiveIndex((p) => (p + r.length - 1) % r.length);\n\t\t\t\t\treturn true;\n\t\t\t\tcase 'ArrowRight':\n\t\t\t\tcase 'Enter':\n\t\t\t\t\t// Nothing highlighted yet → treat the first row as the target so\n\t\t\t\t\t// the editor's @-flow (type, then Enter) still works.\n\t\t\t\t\t(r[i] ?? r[0])?.onActivate();\n\t\t\t\t\treturn true;\n\t\t\t\tcase 'ArrowLeft':\n\t\t\t\t\tif (h?.onBack) {\n\t\t\t\t\t\th.onBack();\n\t\t\t\t\t\treturn true;\n\t\t\t\t\t}\n\t\t\t\t\treturn false;\n\t\t\t\tdefault:\n\t\t\t\t\treturn false;\n\t\t\t}\n\t\t});\n\t\treturn () => registerKeyHandler(null);\n\t}, [registerKeyHandler]);\n\n\tconst variant = !activeCategory\n\t\t? 'categories'\n\t\t: rows.length && !rows[0].drillsIn\n\t\t? 'items'\n\t\t: 'sources';\n\n\t// Search lives inside a source's tool list (Manifest / Shopify) and in the\n\t// sub-agent list.\n\tconst showSearch =\n\t\t(activeCategory === 'tool' &&\n\t\t\t!!source &&\n\t\t\tsource !== MORE_INTEGRATIONS_KEY) ||\n\t\tactiveCategory === 'subagent';\n\n\treturn (\n\t\t<PickerCard\n\t\t\tclassName={`bik-mention-picker bik-mention-picker--${variant}`}\n\t\t\t// Variables view: a definite height so the embedded VariablePicker's\n\t\t\t// internal list scroll (below its fixed search bar) can resolve.\n\t\t\t$fixedHeight={activeCategory === 'variable'}\n\t\t>\n\t\t\t{header && (\n\t\t\t\t<PickerBack\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\tonClick={header.onBack}\n\t\t\t\t\tdisabled={!header.onBack}\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tbackground: COLORS.surface.subdued,\n\t\t\t\t\t\tcursor: header.onBack ? 'pointer' : 'default',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{header.onBack && (\n\t\t\t\t\t\t<SvgArrowLeft\n\t\t\t\t\t\t\twidth={20}\n\t\t\t\t\t\t\theight={20}\n\t\t\t\t\t\t\tcolor={COLORS.content.primary}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t\t{header.icon && renderSourceIcon(header.icon)}\n\t\t\t\t\t<TitleSmall> {header.title}</TitleSmall>\n\t\t\t\t</PickerBack>\n\t\t\t)}\n\t\t\t{showSearch && (\n\t\t\t\t<PickerSearchRow>\n\t\t\t\t\t<SearchIcon\n\t\t\t\t\t\twidth={20}\n\t\t\t\t\t\theight={20}\n\t\t\t\t\t\tcolor={COLORS.content.placeholder}\n\t\t\t\t\t/>\n\t\t\t\t\t<PickerSearchInput\n\t\t\t\t\t\t// Focus on open so the user can type immediately (appears only\n\t\t\t\t\t\t// after they drill into a source).\n\t\t\t\t\t\t// eslint-disable-next-line jsx-a11y/no-autofocus\n\t\t\t\t\t\tautoFocus\n\t\t\t\t\t\tvalue={search}\n\t\t\t\t\t\tplaceholder=\"Search\"\n\t\t\t\t\t\tdata-test=\"mention-picker-search\"\n\t\t\t\t\t\tonChange={(e) => setSearch(e.target.value)}\n\t\t\t\t\t\tonKeyDown={(e) => {\n\t\t\t\t\t\t\tif (!rows.length) {\n\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tif (e.key === 'ArrowDown') {\n\t\t\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\t\t\tsetActiveIndex((p) => (p + 1) % rows.length);\n\t\t\t\t\t\t\t} else if (e.key === 'ArrowUp') {\n\t\t\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\t\t\tsetActiveIndex((p) => (p + rows.length - 1) % rows.length);\n\t\t\t\t\t\t\t} else if (e.key === 'Enter') {\n\t\t\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\t\t\t(rows[activeIndex] ?? rows[0])?.onActivate();\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t</PickerSearchRow>\n\t\t\t)}\n\t\t\t{activeCategory === 'variable' ? (\n\t\t\t\t// Shared variable catalog, embedded as this drill-in view. The fill\n\t\t\t\t// wrapper hands it the remaining card height, so ITS search bar stays\n\t\t\t\t// fixed and only the variable list below scrolls. Selecting a\n\t\t\t\t// variable dismisses the menu FIRST (strips the typed \"@\" + query),\n\t\t\t\t// then hands the variable up to insert its `{{token}}` at the cursor.\n\t\t\t\t<VariableFill>\n\t\t\t\t\t<VariablePicker\n\t\t\t\t\t\ttype={PickerType.EMBEDDED}\n\t\t\t\t\t\tdata={variablesData ?? []}\n\t\t\t\t\t\t// \"Only Recommended\" bar shown and ON to start, same as the\n\t\t\t\t\t\t// dashboard's pickers — the catalog is long and most of it is\n\t\t\t\t\t\t// irrelevant to a given agent field. Merchants flip it off to\n\t\t\t\t\t\t// reach the full list. (The prop drives both the bar and the\n\t\t\t\t\t\t// initial filter state; see VariablePicker's mount effect.)\n\t\t\t\t\t\tshowRecommendedBar\n\t\t\t\t\t\t// Insert the reference token directly — the \"set up a default\n\t\t\t\t\t\t// value\" flow doesn't apply in the agent builder.\n\t\t\t\t\t\tskipDefaultVariableContent\n\t\t\t\t\t\tonSelect={(variable: VariableV3) => {\n\t\t\t\t\t\t\tonClose?.();\n\t\t\t\t\t\t\tonSelectVariable?.(variable);\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t</VariableFill>\n\t\t\t) : rows.length === 0 ? (\n\t\t\t\t<PickerEmpty>\n\t\t\t\t\t{activeCategory === 'subagent' ? null : 'No tools available'}\n\t\t\t\t</PickerEmpty>\n\t\t\t) : (\n\t\t\t\t<PickerScroll>\n\t\t\t\t\t{rows.map((row, i) => (\n\t\t\t\t\t\t<PickerRow\n\t\t\t\t\t\t\tkey={row.id}\n\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t$active={i === activeIndex}\n\t\t\t\t\t\t\tonMouseEnter={() => setActiveIndex(i)}\n\t\t\t\t\t\t\tonMouseLeave={() => setActiveIndex(-1)}\n\t\t\t\t\t\t\tonClick={row.onActivate}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{row.isCreate ? (\n\t\t\t\t\t\t\t\t<CreateRowText>{row.label}</CreateRowText>\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t<PickerRowMain>\n\t\t\t\t\t\t\t\t\t\t{renderSourceIcon(row.icon)}\n\t\t\t\t\t\t\t\t\t\t<BodySecondary color={COLORS.content.primary}>\n\t\t\t\t\t\t\t\t\t\t\t{row.label}\n\t\t\t\t\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t\t\t\t\t\t{row.authRequired && (\n\t\t\t\t\t\t\t\t\t\t\t<Shield\n\t\t\t\t\t\t\t\t\t\t\t\tsize={14}\n\t\t\t\t\t\t\t\t\t\t\t\taria-label=\"Requires customer verification\"\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t</PickerRowMain>\n\t\t\t\t\t\t\t\t\t{row.rightLabel ? (\n\t\t\t\t\t\t\t\t\t\t<RightActionText>{row.rightLabel}</RightActionText>\n\t\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t\trow.drillsIn && <ChevronRight width={12} height={12} />\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</PickerRow>\n\t\t\t\t\t))}\n\t\t\t\t</PickerScroll>\n\t\t\t)}\n\t\t\t{rows.some((row) => row.authRequired) && (\n\t\t\t\t<PickerLegend>\n\t\t\t\t\t<Shield size={16} />\n\t\t\t\t\t<BodyCaption color={COLORS.content.secondary}>\n\t\t\t\t\t\tRequires customer verification\n\t\t\t\t\t</BodyCaption>\n\t\t\t\t</PickerLegend>\n\t\t\t)}\n\t\t</PickerCard>\n\t);\n};\n\n// The card itself never scrolls — the header / search stay fixed and only the\n// list area (PickerScroll, or the embedded VariablePicker's own list) does.\nconst PickerCard = styled.div<{ $fixedHeight?: boolean }>`\n\tdisplay: flex;\n\tflex-direction: column;\n\tmin-width: 240px;\n\t/* Variables view is 45px taller: that is what the embedded picker's \"Only\n\t   Recommended\" bar costs, so the variable list keeps the room it had before\n\t   the bar was turned on (VariablePicker's calculateHeight subtracts it). */\n\t${(p) => (p.$fixedHeight ? 'height: 346px;' : 'max-height: 301px;')}\n\toverflow: hidden;\n\tbackground: ${COLORS.surface.standard};\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 4px;\n\tbox-shadow: 0px -2px 8px 0px #0000001f;\n`;\n\n// Scrollable row list below the fixed header / search (scrollbar hidden —\n// the fixed header already signals there's more below).\nconst PickerScroll = styled.div`\n\tflex: 1 1 auto;\n\tmin-height: 0;\n\toverflow-y: auto;\n\tscrollbar-width: none;\n\n\t&::-webkit-scrollbar {\n\t\tdisplay: none;\n\t}\n`;\n\n// Hands the embedded VariablePicker the card's remaining height (its Content\n// sizes itself with percentages, so the chain must be definite). Its internal\n// list scrollbar is hidden to match PickerScroll.\nconst VariableFill = styled.div`\n\tflex: 1 1 auto;\n\tmin-height: 0;\n\n\t> div {\n\t\theight: 100%;\n\t}\n\n\t* {\n\t\tscrollbar-width: none;\n\t}\n\n\t*::-webkit-scrollbar {\n\t\tdisplay: none;\n\t}\n`;\n\n// Search box at the top of a source's tool list (Manifest / Shopify).\nconst PickerSearchRow = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n\tpadding: 10px 12px;\n\tflex-shrink: 0;\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\t/* The card is a flex column with a max-height; without these a long list\n\t   compresses its rows below 48px (why only the short first step looked right)\n\t   instead of scrolling. Pin the row so the card scrolls instead. */\n\tbox-sizing: border-box;\n\tflex-shrink: 0;\n\tborder: none;\n\tborder-bottom: 1px solid ${COLORS.stroke.primary};\n\tbackground: ${(p) => (p.$active ? COLORS.surface.subdued : 'transparent')};\n\tcursor: pointer;\n\ttext-align: left;\n\n\t&:hover {\n\t\tbackground: ${COLORS.surface.hovered};\n\t}\n`;\n\n// Left cluster: leading source glyph + label (chevron stays right via PickerRow).\nconst PickerRowMain = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 12px;\n\tmin-width: 0;\n`;\n\n// Footer legend, shown when the list holds any auth-required tool.\nconst PickerLegend = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 6px;\n\tpadding: 8px 12px;\n\tborder-top: 1px solid ${COLORS.stroke.primary};\n`;\n\n// Right-aligned brand action text (e.g. \"Connect\") in place of the chevron.\nconst RightActionText = styled.span`\n\tflex-shrink: 0;\n\tcolor: ${COLORS.content.brand};\n\tfont-family: Inter;\n\tfont-size: 14px;\n\tfont-weight: 600;\n\twhite-space: nowrap;\n`;\n\n// \"Create new\" — centered brand text, no icon (matches the side-panel dropdown).\nconst CreateRowText = styled.div`\n\twidth: 100%;\n\ttext-align: center;\n\tcolor: ${COLORS.content.brand};\n\tfont-family: Inter;\n\tfont-size: 14px;\n\tfont-weight: 600;\n`;\n\nconst PickerBack = styled.button`\n\tdisplay: flex;\n\talign-items: center;\n\tpadding: 12px 16px;\n\tborder: none;\n\tborder-bottom: 1px solid ${COLORS.stroke.primary};\n\tbackground: transparent;\n\tcursor: pointer;\n\tfont-family: Inter;\n\tfont-size: 12px;\n\tfont-weight: 600;\n\theight: 48px;\n\tbox-sizing: border-box;\n\tflex-shrink: 0;\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":["MORE_INTEGRATIONS_ICON","PuzzlePiece","metaOf","item","rowLabel","CREATE_SUBAGENT_ID","MentionPicker","items","onSelect","registerKeyHandler","onClose","onCreateSubAgent","initialSource","toolActions","integrationStatus","onConnectIntegration","appLabel","variablesData","onSelectVariable","category","setCategory","useState","source","setSource","activeIndex","setActiveIndex","search","setSearch","tools","useMemo","i","subAgents","sources","acc","t","s","actionBySource","a","availableCategories","CATEGORIES","c","soleCategory","activeCategory","header","MORE_INTEGRATIONS_KEY","MORE_INTEGRATIONS_LABEL","toolSourceLabel","isMoreIntegrationSource","sourceIcon","rows","sq","leaves","actionOnly","combined","buildSourceRow","action","instances","isIntegrationSource","icon","only","b","toolSourceRank","rootRows","MORE_INTEGRATIONS_RANK","e","q","isConfigTool","CONFIG_TOOL_SOURCES","useEffect","navRef","useRef","event","r","h","variant","showSearch","jsxs","PickerCard","PickerBack","COLORS","jsx","SvgArrowLeft","renderSourceIcon","TitleSmall","PickerSearchRow","SearchIcon","PickerSearchInput","p","VariableFill","VariablePicker","PickerType","variable","PickerEmpty","PickerScroll","row","PickerRow","CreateRowText","Fragment","PickerRowMain","BodySecondary","Shield","RightActionText","ChevronRight","PickerLegend","BodyCaption","styled"],"mappings":"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"}

package/dist/esm/components/agent-builder/components/SelectableListSection.d.ts

@@ -103,6 +103,8 @@ interface SelectableListSectionProps {
      * stretches the drawer and leaves a gap.
      */
     pickerOpensUp?: boolean;
+    /** Host-app name for the native tool group (source buttons + `@` picker). */
+    appLabel?: string;
 }
 export declare const SelectableListSection: React.FC<SelectableListSectionProps>;
 export {};

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

@@ -1,22 +1,22 @@
 import { jsx as n, jsxs as i, Fragment as J } from "react/jsx-runtime";
-import ie from "../../../assets/icons/delete.svg.js";
-import de from "../../../assets/icons/edit.svg.js";
+import de from "../../../assets/icons/delete.svg.js";
+import se from "../../../assets/icons/edit.svg.js";
 import Q from "../../../assets/icons/plus.svg.js";
-import { useState as m, useRef as U, useEffect as se } from "react";
+import { useState as m, useRef as U, useEffect as ae } from "react";
 import D from "styled-components";
-import { TitleSmall as ae, BodyCaption as $, BodySecondary as I } from "../../TypographyStyle.js";
+import { TitleSmall as ue, BodyCaption as $, BodySecondary as A } from "../../TypographyStyle.js";
 import { COLORS as d } from "../../../constants/Theme.js";
-import { SideSection as ue, SideSectionHeader as he, AddIconButton as fe, SourceButtonRow as pe, SourceButton as X, SelectableRow as me, RowLabel as Se, RowText as be, RowActions as ve, RowMenuButton as Y, RowActionDivider as ye } from "../AgentBuilder.styled.js";
-import { isIntegrationSource as we } from "../constants/tools.js";
-import { renderSourceIcon as R, sourceIcon as $e } from "../utils/sourceIcons.js";
-import { MentionPicker as ge } from "./MentionPicker.js";
+import { SideSection as he, SideSectionHeader as fe, AddIconButton as pe, SourceButtonRow as me, SourceButton as X, SelectableRow as Se, RowLabel as be, RowText as ve, RowActions as ye, RowMenuButton as Y, RowActionDivider as we } from "../AgentBuilder.styled.js";
+import { isIntegrationSource as $e } from "../constants/tools.js";
+import { renderSourceIcon as I, sourceIcon as ge } from "../utils/sourceIcons.js";
+import { MentionPicker as Ce } from "./MentionPicker.js";
 import { Dropdown as Z } from "../../dropdown/Dropdown.js";
 import { unwrapDropdownValue as P } from "../../dropdown/utils.js";
-import { Button as Ce } from "../../button/Button.js";
-import { DeleteConfirmationModal as ke } from "../../states-modal/DeleteConfirmationModal.js";
+import { Button as ke } from "../../button/Button.js";
+import { DeleteConfirmationModal as Ee } from "../../states-modal/DeleteConfirmationModal.js";
 import { Tooltip as g } from "../../tooltips/Tooltip.js";
-import Ee from "../../../icons/Informational/Common UI/Shield.js";
-const G = "__bik_create_new__", Ue = ({
+import Re from "../../../icons/Informational/Common UI/Shield.js";
+const G = "__bik_create_new__", Xe = ({
   title: s,
   helper: _,
   items: u,
@@ -31,10 +31,11 @@ const G = "__bik_create_new__", Ue = ({
   mentionItems: C,
   actionSources: v,
   confirmDelete: p,
-  pickerOpensUp: z
+  pickerOpensUp: z,
+  appLabel: ee
 }) => {
-  const [f, l] = m(!1), [x, k] = m(null), [H, M] = m(null), [ee, E] = m(null), y = !!h && h.length > 0, A = h?.find((e) => e.source === ee), c = C !== void 0, j = U(null), q = U(null), [w, W] = m(null);
-  se(() => {
+  const [f, l] = m(!1), [x, k] = m(null), [H, M] = m(null), [ne, E] = m(null), y = !!h && h.length > 0, R = h?.find((e) => e.source === ne), c = C !== void 0, j = U(null), q = U(null), [w, W] = m(null);
+  ae(() => {
     if (!c || !f)
       return;
     const e = (a) => {
@@ -47,7 +48,7 @@ const G = "__bik_create_new__", Ue = ({
       document.removeEventListener("mousedown", e), document.removeEventListener("keydown", o);
     };
   }, [c, f]);
-  const ne = y ? c || u.length > 0 : c || S.length > 0 || !!t && u.length > 0, oe = u.length === 0 && !!t && !y && !c, F = !!v && v.length > 0, te = (y || F) && u.length === 0, le = () => {
+  const oe = y ? c || u.length > 0 : c || S.length > 0 || !!t && u.length > 0, te = u.length === 0 && !!t && !y && !c, F = !!v && v.length > 0, le = (y || F) && u.length === 0, re = () => {
     if (c) {
       if ((C?.length ?? 0) === 0 && t) {
         t.onSelect();
@@ -65,40 +66,33 @@ const G = "__bik_create_new__", Ue = ({
       return;
     }
     l((e) => !e);
-  }, re = (e, o) => {
+  }, ce = (e, o) => {
     if (H)
       return;
     const a = o();
     a && typeof a.then == "function" && (M(e), a.finally(() => M(null)));
-  }, ce = () => u.map((e) => {
+  }, ie = () => u.map((e) => {
     const o = e.onConfigure ?? (B ? () => B(e.id) : void 0);
     return /* @__PURE__ */ i(
-      me,
+      Se,
       {
         "data-test": `${r}-row-${e.id}`,
         children: [
-          R(e.icon),
-          /* @__PURE__ */ i(Se, { children: [
-            /* @__PURE__ */ n(g, { body: e.label, placement: "top", children: /* @__PURE__ */ n(be, { children: /* @__PURE__ */ n(I, { numberOfLines: 1, color: d.content.primary, children: e.label }) }) }),
+          I(e.icon),
+          /* @__PURE__ */ i(be, { children: [
+            /* @__PURE__ */ n(g, { body: e.label, placement: "top", children: /* @__PURE__ */ n(ve, { children: /* @__PURE__ */ n(A, { numberOfLines: 1, color: d.content.primary, children: e.label }) }) }),
             e.authRequired && // Order tools touch customer-private data — the shield flags that
             // this agent must verify the customer before the tool can run.
-            /* @__PURE__ */ n(
-              g,
+            /* @__PURE__ */ n(g, { body: "Requires customer verification", placement: "top", children: /* @__PURE__ */ n(
+              "span",
               {
-                body: "This tool requires customer verification",
-                placement: "top",
-                children: /* @__PURE__ */ n(
-                  "span",
-                  {
-                    "data-test": `${r}-auth-${e.id}`,
-                    style: { display: "inline-flex", flexShrink: 0 },
-                    children: /* @__PURE__ */ n(Ee, { size: 16 })
-                  }
-                )
+                "data-test": `${r}-auth-${e.id}`,
+                style: { display: "inline-flex", flexShrink: 0 },
+                children: /* @__PURE__ */ n(Re, { size: 16 })
               }
-            )
+            ) })
           ] }),
-          /* @__PURE__ */ i(ve, { children: [
+          /* @__PURE__ */ i(ye, { children: [
             o && // Configurable rows (sub-agents, Rest API / email tools) get an
             // always-visible edit icon.
             /* @__PURE__ */ n(g, { body: "Edit", placement: "top", children: /* @__PURE__ */ n(
@@ -107,9 +101,9 @@ const G = "__bik_create_new__", Ue = ({
                 "data-test": `${r}-edit-${e.id}`,
                 "aria-label": `Edit ${e.label}`,
                 disabled: H !== null,
-                onClick: () => re(e.id, o),
+                onClick: () => ce(e.id, o),
                 children: /* @__PURE__ */ n(
-                  de,
+                  se,
                   {
                     width: 16,
                     height: 16,
@@ -118,7 +112,7 @@ const G = "__bik_create_new__", Ue = ({
                 )
               }
             ) }),
-            o && /* @__PURE__ */ n(ye, { "aria-hidden": !0 }),
+            o && /* @__PURE__ */ n(we, { "aria-hidden": !0 }),
             /* @__PURE__ */ n(g, { body: "Delete", placement: "top", children: /* @__PURE__ */ n(
               Y,
               {
@@ -126,7 +120,7 @@ const G = "__bik_create_new__", Ue = ({
                 "aria-label": `Delete ${e.label}`,
                 onClick: () => p ? k(e.id) : L(e.id),
                 children: /* @__PURE__ */ n(
-                  ie,
+                  de,
                   {
                     width: 16,
                     height: 16,
@@ -162,7 +156,7 @@ const G = "__bik_create_new__", Ue = ({
       )
     }
   ] : S, N = c ? /* @__PURE__ */ n(
-    ge,
+    Ce,
     {
       items: C ?? [],
       query: "",
@@ -186,19 +180,20 @@ const G = "__bik_create_new__", Ue = ({
       ),
       onConnectIntegration: (e) => {
         l(!1), h?.find((o) => o.source === e)?.onConnect?.();
-      }
+      },
+      appLabel: ee
     },
     w ?? "__root__"
   ) : null;
-  return /* @__PURE__ */ i(ue, { children: [
-    /* @__PURE__ */ i(he, { children: [
-      /* @__PURE__ */ n(ae, { color: d.content.primary, children: s }),
-      ne && /* @__PURE__ */ i(Ae, { ref: j, children: [
+  return /* @__PURE__ */ i(he, { children: [
+    /* @__PURE__ */ i(fe, { children: [
+      /* @__PURE__ */ n(ue, { color: d.content.primary, children: s }),
+      oe && /* @__PURE__ */ i(Ae, { ref: j, children: [
         /* @__PURE__ */ n(
-          fe,
+          pe,
           {
             "data-test": `${r}-add`,
-            onClick: le,
+            onClick: re,
             "aria-label": `Add ${s}`,
             children: /* @__PURE__ */ n(Q, { width: 16, height: 16, color: d.content.primary })
           }
@@ -214,10 +209,10 @@ const G = "__bik_create_new__", Ue = ({
       ] })
     ] }),
     _ && /* @__PURE__ */ n($, { color: d.content.secondary, children: _ }),
-    te ? /* @__PURE__ */ i(Ie, { ref: c ? q : void 0, children: [
-      /* @__PURE__ */ i(pe, { "data-test": `${r}-sources`, children: [
+    le ? /* @__PURE__ */ i(Ie, { ref: c ? q : void 0, children: [
+      /* @__PURE__ */ i(me, { "data-test": `${r}-sources`, children: [
         h?.map((e) => {
-          const o = e.connected !== !1 && e.options.length === 1 && !we(e.source) ? e.options[0] : void 0;
+          const o = e.connected !== !1 && e.options.length === 1 && !$e(e.source) ? e.options[0] : void 0;
           return /* @__PURE__ */ i(
             X,
             {
@@ -239,11 +234,11 @@ const G = "__bik_create_new__", Ue = ({
                 E(e.source);
               },
               children: [
-                R($e(e.source), -4),
+                I(ge(e.source), -4),
                 /* @__PURE__ */ n($, { color: d.content.primary, children: o ? o.label : e.label }),
                 e.connected === !1 && // Not connected → show "Connect" upfront (consistent with
                 // the `@` picker); clicking runs the connect flow.
-                /* @__PURE__ */ n(I, { color: d.content.brand, children: "Connect" })
+                /* @__PURE__ */ n(A, { color: d.content.brand, children: "Connect" })
               ]
             },
             e.source
@@ -258,11 +253,11 @@ const G = "__bik_create_new__", Ue = ({
               l(!1), e.onSelect();
             },
             children: [
-              R(e.icon, -4),
+              I(e.icon, -4),
               /* @__PURE__ */ n($, { color: d.content.primary, children: e.label }),
               e.connected === !1 && // Not connected → "Connect" upfront (consistent with the
               // source buttons and the `@` picker).
-              /* @__PURE__ */ n(I, { color: d.content.brand, children: "Connect" })
+              /* @__PURE__ */ n(A, { color: d.content.brand, children: "Connect" })
             ]
           },
           e.source
@@ -277,15 +272,15 @@ const G = "__bik_create_new__", Ue = ({
           children: N
         }
       ),
-      !c && A && /* @__PURE__ */ n(
+      !c && R && /* @__PURE__ */ n(
         Z,
         {
           "data-test": `${r}-dropdown`,
           size: "small",
           width: "100%",
           isSearchable: !0,
-          placeHolder: `Search ${A.label} tools`,
-          options: A.options,
+          placeHolder: `Search ${R.label} tools`,
+          options: R.options,
           onSelect: (e) => {
             const o = P(e);
             E(null), l(!1), o && b(o);
@@ -310,8 +305,8 @@ const G = "__bik_create_new__", Ue = ({
       ),
       u.length === 0 && !f ? /* @__PURE__ */ i(J, { children: [
         /* @__PURE__ */ n($, { color: d.content.placeholder, children: O }),
-        oe && t && /* @__PURE__ */ n(
-          Ce,
+        te && t && /* @__PURE__ */ n(
+          ke,
           {
             "data-test": `${r}-create`,
             buttonType: "secondary",
@@ -322,10 +317,10 @@ const G = "__bik_create_new__", Ue = ({
             onClick: t.onSelect
           }
         )
-      ] }) : ce()
+      ] }) : ie()
     ] }),
     p && x && /* @__PURE__ */ n(
-      ke,
+      Ee,
       {
         "data-test": `${r}-delete-confirm`,
         header: `Delete this ${p.noun}?`,
@@ -354,6 +349,6 @@ const G = "__bik_create_new__", Ue = ({
 	z-index: 30;
 `;
 export {
-  Ue as SelectableListSection
+  Xe as SelectableListSection
 };
 //# sourceMappingURL=SelectableListSection.js.map