@bikdotai/bik-component-library 0.0.823-beta.2 → 0.0.823
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.
- package/dist/cjs/components/agent-builder/AgentBuilder.js +1 -1
- package/dist/cjs/components/agent-builder/AgentBuilder.js.map +1 -1
- package/dist/cjs/components/agent-builder/AgentBuilder.styled.js +97 -66
- package/dist/cjs/components/agent-builder/AgentBuilder.styled.js.map +1 -1
- package/dist/cjs/components/agent-builder/components/AgentBuilderTopBar.js +1 -1
- package/dist/cjs/components/agent-builder/components/AgentBuilderTopBar.js.map +1 -1
- package/dist/cjs/components/agent-builder/components/CreateSubAgentPanel.js +1 -1
- package/dist/cjs/components/agent-builder/components/CreateSubAgentPanel.js.map +1 -1
- package/dist/cjs/components/agent-builder/components/MentionField.js +1 -1
- package/dist/cjs/components/agent-builder/components/MentionField.js.map +1 -1
- package/dist/cjs/components/agent-builder/components/SelectableListSection.js +4 -4
- package/dist/cjs/components/agent-builder/components/SelectableListSection.js.map +1 -1
- package/dist/cjs/components/agent-builder/components/StepRail.js +1 -1
- package/dist/cjs/components/agent-builder/components/StepRail.js.map +1 -1
- package/dist/cjs/components/agent-builder/context/AgentBuilderContext.js +1 -1
- package/dist/cjs/components/agent-builder/context/AgentBuilderContext.js.map +1 -1
- package/dist/cjs/components/agent-builder/steps/Step1About.js +1 -1
- package/dist/cjs/components/agent-builder/steps/Step1About.js.map +1 -1
- package/dist/cjs/components/agent-builder/steps/Step2WhenItStepsIn.js +1 -1
- package/dist/cjs/components/agent-builder/steps/Step2WhenItStepsIn.js.map +1 -1
- package/dist/cjs/components/agent-builder/steps/Step3HowItResponds.js +1 -1
- package/dist/cjs/components/agent-builder/steps/Step3HowItResponds.js.map +1 -1
- package/dist/cjs/components/agent-builder/steps/Step4HandoverRules.js +1 -1
- package/dist/cjs/components/agent-builder/steps/Step4HandoverRules.js.map +1 -1
- package/dist/cjs/components/agent-listing/AgentListing.js +1 -1
- package/dist/cjs/components/agent-listing/AgentListing.js.map +1 -1
- package/dist/cjs/components/agent-listing/AgentListing.styled.js +32 -28
- package/dist/cjs/components/agent-listing/AgentListing.styled.js.map +1 -1
- package/dist/cjs/components/agent-listing/AgentListingHeader.js +1 -1
- package/dist/cjs/components/agent-listing/AgentListingHeader.js.map +1 -1
- package/dist/cjs/components/agent-listing/AgentTableRow.js +1 -1
- package/dist/cjs/components/agent-listing/AgentTableRow.js.map +1 -1
- package/dist/cjs/components/template-preview/models/TemplateMeta.js +1 -1
- package/dist/cjs/components/template-preview/models/TemplateMeta.js.map +1 -1
- package/dist/esm/components/agent-builder/AgentBuilder.js +82 -83
- package/dist/esm/components/agent-builder/AgentBuilder.js.map +1 -1
- package/dist/esm/components/agent-builder/AgentBuilder.styled.d.ts +13 -5
- package/dist/esm/components/agent-builder/AgentBuilder.styled.js +141 -102
- package/dist/esm/components/agent-builder/AgentBuilder.styled.js.map +1 -1
- package/dist/esm/components/agent-builder/components/AgentBuilderTopBar.d.ts +0 -1
- package/dist/esm/components/agent-builder/components/AgentBuilderTopBar.js +33 -46
- package/dist/esm/components/agent-builder/components/AgentBuilderTopBar.js.map +1 -1
- package/dist/esm/components/agent-builder/components/CreateSubAgentPanel.js +135 -119
- package/dist/esm/components/agent-builder/components/CreateSubAgentPanel.js.map +1 -1
- package/dist/esm/components/agent-builder/components/MentionField.js +44 -45
- package/dist/esm/components/agent-builder/components/MentionField.js.map +1 -1
- package/dist/esm/components/agent-builder/components/SelectableListSection.js +91 -94
- package/dist/esm/components/agent-builder/components/SelectableListSection.js.map +1 -1
- package/dist/esm/components/agent-builder/components/StepRail.js +28 -20
- package/dist/esm/components/agent-builder/components/StepRail.js.map +1 -1
- package/dist/esm/components/agent-builder/context/AgentBuilderContext.d.ts +7 -0
- package/dist/esm/components/agent-builder/context/AgentBuilderContext.js +108 -98
- package/dist/esm/components/agent-builder/context/AgentBuilderContext.js.map +1 -1
- package/dist/esm/components/agent-builder/steps/Step1About.js +38 -35
- package/dist/esm/components/agent-builder/steps/Step1About.js.map +1 -1
- package/dist/esm/components/agent-builder/steps/Step2WhenItStepsIn.js +118 -122
- package/dist/esm/components/agent-builder/steps/Step2WhenItStepsIn.js.map +1 -1
- package/dist/esm/components/agent-builder/steps/Step3HowItResponds.js +112 -110
- package/dist/esm/components/agent-builder/steps/Step3HowItResponds.js.map +1 -1
- package/dist/esm/components/agent-builder/steps/Step4HandoverRules.js +72 -70
- package/dist/esm/components/agent-builder/steps/Step4HandoverRules.js.map +1 -1
- package/dist/esm/components/agent-listing/AgentListing.js +45 -43
- package/dist/esm/components/agent-listing/AgentListing.js.map +1 -1
- package/dist/esm/components/agent-listing/AgentListing.model.d.ts +7 -0
- package/dist/esm/components/agent-listing/AgentListing.styled.js +28 -24
- package/dist/esm/components/agent-listing/AgentListing.styled.js.map +1 -1
- package/dist/esm/components/agent-listing/AgentListingHeader.d.ts +2 -0
- package/dist/esm/components/agent-listing/AgentListingHeader.js +14 -12
- package/dist/esm/components/agent-listing/AgentListingHeader.js.map +1 -1
- package/dist/esm/components/agent-listing/AgentTableRow.js +102 -57
- package/dist/esm/components/agent-listing/AgentTableRow.js.map +1 -1
- package/dist/esm/components/template-preview/models/TemplateMeta.d.ts +1 -2
- package/dist/esm/components/template-preview/models/TemplateMeta.js +11 -11
- package/dist/esm/components/template-preview/models/TemplateMeta.js.map +1 -1
- package/package.json +1 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),oe=require("../../../assets/icons/cross.svg.js"),n=require("react"),E=require("../../TypographyStyle.js"),L=require("../../../utils/arrayUtils.js"),q=require("../../../constants/Theme.js"),u=require("../AgentBuilder.styled.js"),se=require("../constants/charLimits.js"),G=require("../utils/mentionSerialization.js"),c=require("../utils/sourceIcons.js"),U=require("./MentionEditor.js"),re=require("./SelectableListSection.js"),ae=require("../../input/Input.js"),N=require("../../button/Button.js"),ie=require("../../toaster/Toaster.js"),ue=({onClose:h,onSave:H,availableTools:a,onImprove:ce,title:K="Create sub-agent",initial:l,appLabel:v="Manifest",charLimits:p=se.AGENT_CHAR_LIMITS})=>{const[b,F]=n.useState(l?.name??""),[d,y]=n.useState(l?.instructions??""),[g,f]=n.useState(l?.guardrail??""),[x,m]=n.useState(l?.tools??[]),[A,O]=n.useState(!1),[w,_]=n.useState(0),[z,k]=n.useState(0),[le,de]=n.useState(null),C=n.useMemo(()=>G.buildAgentMentionItems(a,[],v),[a,v]),S=n.useRef({}),I=n.useRef("instructions"),$=n.useCallback(e=>{S.current.instructions=e??void 0},[]),W=n.useCallback(e=>{S.current.guardrail=e??void 0},[]),D=n.useCallback(()=>{I.current="instructions"},[]),J=n.useCallback(()=>{I.current="guardrail"},[]),M=n.useCallback((e,t)=>{e==="tool"&&m(s=>L.addUnique(s,t))},[]),Q=n.useCallback(e=>{(S.current[I.current]??S.current.instructions)?.("tool",e)},[]),[T,j]=n.useState(null),R=n.useRef(null),P=n.useRef(0),V=e=>{const t=a.find(r=>r.tool_id===e),s=t?`{{tool:${t.function_key}}}`:null,i=r=>s?r.split(s).join(""):r;R.current={instructions:d,guardrail:g,tools:x},y(r=>i(r)),f(r=>i(r)),m(r=>r.filter(ne=>ne!==e)),_(r=>r+1),k(r=>r+1),P.current+=1,j({id:P.current,message:`Tool "${t?.display_name??"Tool"}" removed`})},X=()=>{const e=R.current;e&&(y(e.instructions),f(e.guardrail),m(e.tools),_(t=>t+1),k(t=>t+1),R.current=null),j(null)},B=b.trim().length>0&&(d.trim().length>0||g.trim().length>0),Y=x.map(e=>{const t=a.find(s=>s.tool_id===e);return t?{id:e,label:t.display_name,icon:c.SOURCE_ICONS[t.source??"manifest"]}:null}).filter(e=>e!==null),Z=a.map(e=>({label:e.display_name,value:e.tool_id,leadingIcon:c.renderSourceIcon(c.SOURCE_ICONS[e.source??"manifest"])??void 0})),ee=(()=>{const e=[],t=new Map;return a.forEach(s=>{const i=s.source??"manifest";t.has(i)||(t.set(i,[]),e.push(i)),t.get(i)?.push({label:s.display_name,value:s.tool_id,leadingIcon:c.renderSourceIcon(c.SOURCE_ICONS[s.source??"manifest"])??void 0})}),e.map(s=>({source:s,label:G.toolSourceLabel(s),options:t.get(s)??[]}))})(),te=async()=>{if(!B||A)return;const e=H({name:b.trim(),instructions:d,guardrail:g,tools:x});if(e&&typeof e.then=="function"){O(!0);try{await e}finally{O(!1)}}};return o.jsxs(o.Fragment,{children:[o.jsx(u.SubAgentScrim,{onClick:h,"data-test":"subagent-scrim"}),o.jsxs(u.SubAgentPanel,{"data-test":"create-subagent-panel",children:[o.jsxs(u.SubAgentPanelHeader,{children:[o.jsxs(u.SubAgentPanelHeaderText,{children:[o.jsx(E.TitleRegular,{color:q.COLORS.content.primary,children:K}),o.jsx(E.BodySecondary,{color:q.COLORS.content.secondary,children:"Each sub-agent handles one piece of the job. Use @ in the main instructions to call them."})]}),o.jsx(u.SubAgentCloseButton,{onClick:h,"aria-label":"Close",children:o.jsx(oe.default,{width:20,height:20,color:q.COLORS.content.secondary})})]}),o.jsxs(u.SubAgentPanelBody,{children:[o.jsx(ae.Input,{"data-test":"subagent-name",labelText:"Agent name",labelTextBold:!0,placeholder:"Enter agent name",value:b,maxCharLimit:p.name,maxCharLimitPosition:"TOP",maxCharStyle:{fontSize:12,lineHeight:"16px"},onChangeText:F}),o.jsx(U.MentionEditor,{"data-test":"subagent-instructions",label:"Instructions",value:d,onChange:y,maxLength:p.instructions,placeholder:"Write the steps in plain English. Type @ to reference a tool.",minHeight:"160px",resetKey:`instr-${w}`,mentionItems:C,tools:a,onMentionSelect:M,onFocus:D,registerInsert:$}),o.jsx(U.MentionEditor,{"data-test":"subagent-guardrail",label:"Guardrails",value:g,onChange:f,maxLength:p.guardrail,placeholder:"e.g. Never discuss competitor pricing. Type @ to reference a tool.",minHeight:"160px",resetKey:`guard-${z}`,mentionItems:C,tools:a,onMentionSelect:M,onFocus:J,registerInsert:W}),o.jsx(re.SelectableListSection,{title:"Tools this agent can use",dataTestPrefix:"subagent-tools",items:Y,addableOptions:Z,sourceGroups:ee,mentionItems:C,emptyText:"No tools added yet.",onAdd:e=>{Q(e),m(t=>L.addUnique(t,e))},onRemove:V})]}),o.jsxs(u.SubAgentPanelFooter,{children:[o.jsx(N.Button,{"data-test":"subagent-save",buttonType:"primary",size:"small",buttonText:"Save",disabled:!B,isLoading:A,onClick:te}),o.jsx(N.Button,{"data-test":"subagent-cancel",buttonType:"tertiaryGray",size:"small",buttonText:"Cancel",onClick:h})]})]}),T&&o.jsx(ie.Toaster,{text:T.message,type:"info",position:"top-right",autoClose:5e3,hideCloseButton:!0,buttonProps:{buttonText:"Undo",showButton:!0,onButtonClick:()=>(X(),{})},onCloseToast:()=>j(null)},T.id)]})};exports.CreateSubAgentPanel=ue;
|
|
2
2
|
//# sourceMappingURL=CreateSubAgentPanel.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CreateSubAgentPanel.js","sources":["../../../../../src/components/agent-builder/components/CreateSubAgentPanel.tsx"],"sourcesContent":["import CrossIcon from '@src/assets/icons/cross.svg';\nimport React, { useCallback, useMemo, useRef, useState } from 'react';\nimport { Button } from '@src/components/button';\nimport { SingleOption } from '@src/components/dropdown/type';\nimport { Input } from '@src/components/input';\nimport { Toaster } from '@src/components/toaster';\nimport { BodySecondary, TitleRegular } from '@src/components/TypographyStyle';\nimport { addUnique } from '@src/utils/arrayUtils';\nimport { COLORS } from '@src/constants/Theme';\nimport { AgentTool, SubAgentDraft } from '../AgentBuilder.model';\nimport {\n\tSubAgentCloseButton,\n\tSubAgentPanel,\n\tSubAgentPanelBody,\n\tSubAgentPanelFooter,\n\tSubAgentPanelHeader,\n\tSubAgentPanelHeaderText,\n\tSubAgentScrim,\n} from '../AgentBuilder.styled';\nimport { AGENT_CHAR_LIMITS } from '../constants/charLimits';\nimport type { AgentCharLimits } from '../constants/charLimits';\nimport { buildAgentMentionItems } from '../utils/mentionSerialization';\nimport { renderSourceIcon, SOURCE_ICONS } from '../utils/sourceIcons';\nimport { MentionEditor } from './MentionEditor';\nimport { SelectableItem, SelectableListSection } from './SelectableListSection';\n\ntype InsertFn = (kind: 'tool' | 'subagent', id: string, label?: string) => void;\n\ninterface CreateSubAgentPanelProps {\n\tonClose: () => void;\n\t/** Persist the draft. The drawer shows a loader while the returned promise is pending. */\n\tonSave: (draft: SubAgentDraft) => void | Promise<void>;\n\tavailableTools: AgentTool[];\n\t/** Optional \"Improve with AI\" for instructions / guardrails. Omit to hide the buttons. */\n\tonImprove?: (\n\t\tkind: 'instructions' | 'guardrail',\n\t\ttext: string,\n\t) => Promise<string>;\n\t/** Header title — \"Create sub-agent\" (default) or \"Edit sub-agent\". */\n\ttitle?: string;\n\t/** Initial values, e.g. when configuring an existing sub-agent. */\n\tinitial?: SubAgentDraft;\n\t/** Tool-source fallback label for chips (host app). */\n\tappLabel?: string;\n\t/** Resolved character limits (defaults to {@link AGENT_CHAR_LIMITS}). */\n\tcharLimits?: AgentCharLimits;\n}\n\n/**\n * Right-side drawer for creating / editing a sub-agent (name, instructions,\n * guardrails, tools). Instructions & Guardrails are `@`-mention editors (tools\n * only — sub-agents can't nest); adding a tool from the list inserts it at the\n * last-focused field's cursor. Mount it fresh per open (key it) so `initial`\n * seeds the draft.\n */\nexport const CreateSubAgentPanel: React.FC<CreateSubAgentPanelProps> = ({\n\tonClose,\n\tonSave,\n\tavailableTools,\n\tonImprove,\n\ttitle = 'Create sub-agent',\n\tinitial,\n\tappLabel = 'Manifest',\n\tcharLimits = AGENT_CHAR_LIMITS,\n}) => {\n\tconst [name, setName] = useState(initial?.name ?? '');\n\tconst [instructions, setInstructions] = useState(initial?.instructions ?? '');\n\tconst [guardrail, setGuardrail] = useState(initial?.guardrail ?? '');\n\tconst [tools, setTools] = useState<string[]>(initial?.tools ?? []);\n\tconst [saving, setSaving] = useState(false);\n\t// Bumped to remount a field after its text is replaced (e.g. by Improve).\n\tconst [instrKey, setInstrKey] = useState(0);\n\tconst [guardKey, setGuardKey] = useState(0);\n\tconst [improving, setImproving] = useState<\n\t\t'instructions' | 'guardrail' | null\n\t>(null);\n\n\t// Tools-only mention list (sub-agents can't reference other sub-agents).\n\tconst mentionItems = useMemo(\n\t\t() => buildAgentMentionItems(availableTools, [], appLabel),\n\t\t[availableTools, appLabel],\n\t);\n\n\t// Per-field insert + focus registry, so the Tools list inserts a chip into the\n\t// last-focused editor at its cursor.\n\tconst insertersRef = useRef<\n\t\tPartial<Record<'instructions' | 'guardrail', InsertFn>>\n\t>({});\n\tconst lastFocusedRef = useRef<'instructions' | 'guardrail'>('instructions');\n\tconst registerInstr = useCallback((fn: InsertFn | null) => {\n\t\tinsertersRef.current.instructions = fn ?? undefined;\n\t}, []);\n\tconst registerGuard = useCallback((fn: InsertFn | null) => {\n\t\tinsertersRef.current.guardrail = fn ?? undefined;\n\t}, []);\n\tconst focusInstr = useCallback(() => {\n\t\tlastFocusedRef.current = 'instructions';\n\t}, []);\n\tconst focusGuard = useCallback(() => {\n\t\tlastFocusedRef.current = 'guardrail';\n\t}, []);\n\tconst addToolMention = useCallback(\n\t\t(kind: 'tool' | 'subagent', id: string) => {\n\t\t\tif (kind === 'tool') {\n\t\t\t\tsetTools((prev) => addUnique(prev, id));\n\t\t\t}\n\t\t},\n\t\t[],\n\t);\n\tconst insertToolAtCursor = useCallback((id: string) => {\n\t\tconst target =\n\t\t\tinsertersRef.current[lastFocusedRef.current] ??\n\t\t\tinsertersRef.current.instructions;\n\t\ttarget?.('tool', id);\n\t}, []);\n\n\t// Local undo toast for tool removal (drawer state isn't in AgentValue).\n\tconst [undo, setUndo] = useState<{ id: number; message: string } | null>(\n\t\tnull,\n\t);\n\tconst undoSnapshotRef = useRef<{\n\t\tinstructions: string;\n\t\tguardrail: string;\n\t\ttools: string[];\n\t} | null>(null);\n\tconst undoIdRef = useRef(0);\n\n\tconst removeTool = (id: string) => {\n\t\tconst tool = availableTools.find((t) => t.tool_id === id);\n\t\tconst token = tool ? `{{tool:${tool.function_key}}}` : null;\n\t\tconst strip = (text: string) => (token ? text.split(token).join('') : text);\n\t\tundoSnapshotRef.current = { instructions, guardrail, tools };\n\t\tsetInstructions((prev) => strip(prev));\n\t\tsetGuardrail((prev) => strip(prev));\n\t\tsetTools((prev) => prev.filter((t) => t !== id));\n\t\tsetInstrKey((k) => k + 1);\n\t\tsetGuardKey((k) => k + 1);\n\t\tundoIdRef.current += 1;\n\t\tsetUndo({\n\t\t\tid: undoIdRef.current,\n\t\t\tmessage: `Tool \"${tool?.display_name ?? 'Tool'}\" removed`,\n\t\t});\n\t};\n\n\tconst undoRemove = () => {\n\t\tconst snap = undoSnapshotRef.current;\n\t\tif (snap) {\n\t\t\tsetInstructions(snap.instructions);\n\t\t\tsetGuardrail(snap.guardrail);\n\t\t\tsetTools(snap.tools);\n\t\t\tsetInstrKey((k) => k + 1);\n\t\t\tsetGuardKey((k) => k + 1);\n\t\t\tundoSnapshotRef.current = null;\n\t\t}\n\t\tsetUndo(null);\n\t};\n\n\tconst canSave =\n\t\tname.trim().length > 0 &&\n\t\t(instructions.trim().length > 0 || guardrail.trim().length > 0);\n\n\tconst toolItems: SelectableItem[] = tools\n\t\t.map((id): SelectableItem | null => {\n\t\t\tconst tool = availableTools.find((t) => t.tool_id === id);\n\t\t\treturn tool\n\t\t\t\t? {\n\t\t\t\t\t\tid,\n\t\t\t\t\t\tlabel: tool.display_name,\n\t\t\t\t\t\ticon: SOURCE_ICONS[tool.source ?? 'manifest'],\n\t\t\t\t }\n\t\t\t\t: null;\n\t\t})\n\t\t.filter((x): x is SelectableItem => x !== null);\n\n\t// Offer all tools (re-add allowed); the chip list stays deduped. Icon left of\n\t// the name, no description.\n\tconst toolOptions: SingleOption[] = availableTools.map((t) => ({\n\t\tlabel: t.display_name,\n\t\tvalue: t.tool_id,\n\t\tleadingIcon:\n\t\t\trenderSourceIcon(SOURCE_ICONS[t.source ?? 'manifest']) ?? undefined,\n\t}));\n\n\tconst handleSave = async () => {\n\t\tif (!canSave || saving) {\n\t\t\treturn;\n\t\t}\n\t\tconst result = onSave({\n\t\t\tname: name.trim(),\n\t\t\tinstructions,\n\t\t\tguardrail,\n\t\t\ttools,\n\t\t});\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\tconst handleImprove = async (kind: 'instructions' | 'guardrail') => {\n\t\tif (!onImprove || improving) {\n\t\t\treturn;\n\t\t}\n\t\tsetImproving(kind);\n\t\ttry {\n\t\t\tconst current = kind === 'instructions' ? instructions : guardrail;\n\t\t\tconst improved = await onImprove(kind, current);\n\t\t\tif (kind === 'instructions') {\n\t\t\t\tsetInstructions(improved);\n\t\t\t\tsetInstrKey((k) => k + 1);\n\t\t\t} else {\n\t\t\t\tsetGuardrail(improved);\n\t\t\t\tsetGuardKey((k) => k + 1);\n\t\t\t}\n\t\t} finally {\n\t\t\tsetImproving(null);\n\t\t}\n\t};\n\n\treturn (\n\t\t<>\n\t\t\t<SubAgentScrim onClick={onClose} data-test=\"subagent-scrim\" />\n\t\t\t<SubAgentPanel data-test=\"create-subagent-panel\">\n\t\t\t\t<SubAgentPanelHeader>\n\t\t\t\t\t<SubAgentPanelHeaderText>\n\t\t\t\t\t\t<TitleRegular color={COLORS.content.primary}>{title}</TitleRegular>\n\t\t\t\t\t\t<BodySecondary color={COLORS.content.secondary}>\n\t\t\t\t\t\t\tEach sub-agent handles one piece of the job. Use @ in the main\n\t\t\t\t\t\t\tinstructions to call them.\n\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t</SubAgentPanelHeaderText>\n\t\t\t\t\t<SubAgentCloseButton onClick={onClose} aria-label=\"Close\">\n\t\t\t\t\t\t<CrossIcon\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.secondary}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</SubAgentCloseButton>\n\t\t\t\t</SubAgentPanelHeader>\n\n\t\t\t\t<SubAgentPanelBody>\n\t\t\t\t\t<Input\n\t\t\t\t\t\tdata-test=\"subagent-name\"\n\t\t\t\t\t\tlabelText=\"Agent name\"\n\t\t\t\t\t\tlabelTextBold\n\t\t\t\t\t\tplaceholder=\"Enter agent name\"\n\t\t\t\t\t\tvalue={name}\n\t\t\t\t\t\tmaxCharLimit={charLimits.name}\n\t\t\t\t\t\tmaxCharLimitPosition=\"TOP\"\n\t\t\t\t\t\tmaxCharStyle={{ fontSize: 12, lineHeight: '16px' }}\n\t\t\t\t\t\tonChangeText={setName}\n\t\t\t\t\t/>\n\n\t\t\t\t\t<MentionEditor\n\t\t\t\t\t\tdata-test=\"subagent-instructions\"\n\t\t\t\t\t\tlabel=\"Instructions\"\n\t\t\t\t\t\tvalue={instructions}\n\t\t\t\t\t\tonChange={setInstructions}\n\t\t\t\t\t\tmaxLength={charLimits.instructions}\n\t\t\t\t\t\tplaceholder=\"Write the steps in plain English. Type @ to reference a tool.\"\n\t\t\t\t\t\tminHeight=\"160px\"\n\t\t\t\t\t\tresetKey={`instr-${instrKey}`}\n\t\t\t\t\t\tmentionItems={mentionItems}\n\t\t\t\t\t\ttools={availableTools}\n\t\t\t\t\t\tonMentionSelect={addToolMention}\n\t\t\t\t\t\tonFocus={focusInstr}\n\t\t\t\t\t\tregisterInsert={registerInstr}\n\t\t\t\t\t/>\n\n\t\t\t\t\t<MentionEditor\n\t\t\t\t\t\tdata-test=\"subagent-guardrail\"\n\t\t\t\t\t\tlabel=\"Guardrails\"\n\t\t\t\t\t\tvalue={guardrail}\n\t\t\t\t\t\tonChange={setGuardrail}\n\t\t\t\t\t\tmaxLength={charLimits.guardrail}\n\t\t\t\t\t\tplaceholder=\"e.g. Never discuss competitor pricing. Type @ to reference a tool.\"\n\t\t\t\t\t\tminHeight=\"160px\"\n\t\t\t\t\t\tresetKey={`guard-${guardKey}`}\n\t\t\t\t\t\tmentionItems={mentionItems}\n\t\t\t\t\t\ttools={availableTools}\n\t\t\t\t\t\tonMentionSelect={addToolMention}\n\t\t\t\t\t\tonFocus={focusGuard}\n\t\t\t\t\t\tregisterInsert={registerGuard}\n\t\t\t\t\t/>\n\n\t\t\t\t\t<SelectableListSection\n\t\t\t\t\t\ttitle=\"Tools this agent can use\"\n\t\t\t\t\t\tdataTestPrefix=\"subagent-tools\"\n\t\t\t\t\t\titems={toolItems}\n\t\t\t\t\t\taddableOptions={toolOptions}\n\t\t\t\t\t\temptyText=\"No tools added yet.\"\n\t\t\t\t\t\tonAdd={(id) => {\n\t\t\t\t\t\t\tinsertToolAtCursor(id);\n\t\t\t\t\t\t\tsetTools((prev) => addUnique(prev, id));\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tonRemove={removeTool}\n\t\t\t\t\t/>\n\t\t\t\t</SubAgentPanelBody>\n\n\t\t\t\t<SubAgentPanelFooter>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tdata-test=\"subagent-save\"\n\t\t\t\t\t\tbuttonType=\"primary\"\n\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\tbuttonText=\"Save\"\n\t\t\t\t\t\tdisabled={!canSave}\n\t\t\t\t\t\tisLoading={saving}\n\t\t\t\t\t\tonClick={handleSave}\n\t\t\t\t\t/>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tdata-test=\"subagent-cancel\"\n\t\t\t\t\t\tbuttonType=\"secondary\"\n\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\tbuttonText=\"Cancel\"\n\t\t\t\t\t\tonClick={onClose}\n\t\t\t\t\t/>\n\t\t\t\t</SubAgentPanelFooter>\n\t\t\t</SubAgentPanel>\n\n\t\t\t{undo && (\n\t\t\t\t<Toaster\n\t\t\t\t\tkey={undo.id}\n\t\t\t\t\ttext={undo.message}\n\t\t\t\t\ttype=\"info\"\n\t\t\t\t\tposition=\"top-right\"\n\t\t\t\t\tautoClose={5000}\n\t\t\t\t\thideCloseButton\n\t\t\t\t\tbuttonProps={{\n\t\t\t\t\t\tbuttonText: 'Undo',\n\t\t\t\t\t\tshowButton: true,\n\t\t\t\t\t\tonButtonClick: () => {\n\t\t\t\t\t\t\tundoRemove();\n\t\t\t\t\t\t\treturn {} as Record<string, never>;\n\t\t\t\t\t\t},\n\t\t\t\t\t}}\n\t\t\t\t\tonCloseToast={() => setUndo(null)}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</>\n\t);\n};\n"],"names":["CreateSubAgentPanel","onClose","onSave","availableTools","onImprove","title","initial","appLabel","charLimits","AGENT_CHAR_LIMITS","name","setName","useState","instructions","setInstructions","guardrail","setGuardrail","tools","setTools","saving","setSaving","instrKey","setInstrKey","guardKey","setGuardKey","improving","setImproving","mentionItems","useMemo","buildAgentMentionItems","insertersRef","useRef","lastFocusedRef","registerInstr","useCallback","fn","registerGuard","focusInstr","focusGuard","addToolMention","kind","id","prev","addUnique","insertToolAtCursor","undo","setUndo","undoSnapshotRef","undoIdRef","removeTool","tool","t","token","strip","text","k","undoRemove","snap","canSave","toolItems","SOURCE_ICONS","x","toolOptions","renderSourceIcon","handleSave","result","jsxs","Fragment","jsx","SubAgentScrim","SubAgentPanel","SubAgentPanelHeader","SubAgentPanelHeaderText","TitleRegular","COLORS","BodySecondary","SubAgentCloseButton","CrossIcon","SubAgentPanelBody","Input","MentionEditor","SelectableListSection","SubAgentPanelFooter","Button","Toaster"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"CreateSubAgentPanel.js","sources":["../../../../../src/components/agent-builder/components/CreateSubAgentPanel.tsx"],"sourcesContent":["import CrossIcon from '@src/assets/icons/cross.svg';\nimport React, { useCallback, useMemo, useRef, useState } from 'react';\nimport { Button } from '@src/components/button';\nimport { SingleOption } from '@src/components/dropdown/type';\nimport { Input } from '@src/components/input';\nimport { Toaster } from '@src/components/toaster';\nimport { BodySecondary, TitleRegular } from '@src/components/TypographyStyle';\nimport { addUnique } from '@src/utils/arrayUtils';\nimport { COLORS } from '@src/constants/Theme';\nimport { AgentTool, SubAgentDraft } from '../AgentBuilder.model';\nimport {\n\tSubAgentCloseButton,\n\tSubAgentPanel,\n\tSubAgentPanelBody,\n\tSubAgentPanelFooter,\n\tSubAgentPanelHeader,\n\tSubAgentPanelHeaderText,\n\tSubAgentScrim,\n} from '../AgentBuilder.styled';\nimport { AGENT_CHAR_LIMITS } from '../constants/charLimits';\nimport type { AgentCharLimits } from '../constants/charLimits';\nimport {\n\tbuildAgentMentionItems,\n\ttoolSourceLabel,\n} from '../utils/mentionSerialization';\nimport { renderSourceIcon, SOURCE_ICONS } from '../utils/sourceIcons';\nimport { MentionEditor } from './MentionEditor';\nimport {\n\tSelectableItem,\n\tSelectableListSection,\n\tSourceGroup,\n} from './SelectableListSection';\n\ntype InsertFn = (kind: 'tool' | 'subagent', id: string, label?: string) => void;\n\ninterface CreateSubAgentPanelProps {\n\tonClose: () => void;\n\t/** Persist the draft. The drawer shows a loader while the returned promise is pending. */\n\tonSave: (draft: SubAgentDraft) => void | Promise<void>;\n\tavailableTools: AgentTool[];\n\t/** Optional \"Improve with AI\" for instructions / guardrails. Omit to hide the buttons. */\n\tonImprove?: (\n\t\tkind: 'instructions' | 'guardrail',\n\t\ttext: string,\n\t) => Promise<string>;\n\t/** Header title — \"Create sub-agent\" (default) or \"Edit sub-agent\". */\n\ttitle?: string;\n\t/** Initial values, e.g. when configuring an existing sub-agent. */\n\tinitial?: SubAgentDraft;\n\t/** Tool-source fallback label for chips (host app). */\n\tappLabel?: string;\n\t/** Resolved character limits (defaults to {@link AGENT_CHAR_LIMITS}). */\n\tcharLimits?: AgentCharLimits;\n}\n\n/**\n * Right-side drawer for creating / editing a sub-agent (name, instructions,\n * guardrails, tools). Instructions & Guardrails are `@`-mention editors (tools\n * only — sub-agents can't nest); adding a tool from the list inserts it at the\n * last-focused field's cursor. Mount it fresh per open (key it) so `initial`\n * seeds the draft.\n */\nexport const CreateSubAgentPanel: React.FC<CreateSubAgentPanelProps> = ({\n\tonClose,\n\tonSave,\n\tavailableTools,\n\tonImprove,\n\ttitle = 'Create sub-agent',\n\tinitial,\n\tappLabel = 'Manifest',\n\tcharLimits = AGENT_CHAR_LIMITS,\n}) => {\n\tconst [name, setName] = useState(initial?.name ?? '');\n\tconst [instructions, setInstructions] = useState(initial?.instructions ?? '');\n\tconst [guardrail, setGuardrail] = useState(initial?.guardrail ?? '');\n\tconst [tools, setTools] = useState<string[]>(initial?.tools ?? []);\n\tconst [saving, setSaving] = useState(false);\n\t// Bumped to remount a field after its text is replaced (e.g. by Improve).\n\tconst [instrKey, setInstrKey] = useState(0);\n\tconst [guardKey, setGuardKey] = useState(0);\n\tconst [improving, setImproving] = useState<\n\t\t'instructions' | 'guardrail' | null\n\t>(null);\n\n\t// Tools-only mention list (sub-agents can't reference other sub-agents).\n\tconst mentionItems = useMemo(\n\t\t() => buildAgentMentionItems(availableTools, [], appLabel),\n\t\t[availableTools, appLabel],\n\t);\n\n\t// Per-field insert + focus registry, so the Tools list inserts a chip into the\n\t// last-focused editor at its cursor.\n\tconst insertersRef = useRef<\n\t\tPartial<Record<'instructions' | 'guardrail', InsertFn>>\n\t>({});\n\tconst lastFocusedRef = useRef<'instructions' | 'guardrail'>('instructions');\n\tconst registerInstr = useCallback((fn: InsertFn | null) => {\n\t\tinsertersRef.current.instructions = fn ?? undefined;\n\t}, []);\n\tconst registerGuard = useCallback((fn: InsertFn | null) => {\n\t\tinsertersRef.current.guardrail = fn ?? undefined;\n\t}, []);\n\tconst focusInstr = useCallback(() => {\n\t\tlastFocusedRef.current = 'instructions';\n\t}, []);\n\tconst focusGuard = useCallback(() => {\n\t\tlastFocusedRef.current = 'guardrail';\n\t}, []);\n\tconst addToolMention = useCallback(\n\t\t(kind: 'tool' | 'subagent', id: string) => {\n\t\t\tif (kind === 'tool') {\n\t\t\t\tsetTools((prev) => addUnique(prev, id));\n\t\t\t}\n\t\t},\n\t\t[],\n\t);\n\tconst insertToolAtCursor = useCallback((id: string) => {\n\t\tconst target =\n\t\t\tinsertersRef.current[lastFocusedRef.current] ??\n\t\t\tinsertersRef.current.instructions;\n\t\ttarget?.('tool', id);\n\t}, []);\n\n\t// Local undo toast for tool removal (drawer state isn't in AgentValue).\n\tconst [undo, setUndo] = useState<{ id: number; message: string } | null>(\n\t\tnull,\n\t);\n\tconst undoSnapshotRef = useRef<{\n\t\tinstructions: string;\n\t\tguardrail: string;\n\t\ttools: string[];\n\t} | null>(null);\n\tconst undoIdRef = useRef(0);\n\n\tconst removeTool = (id: string) => {\n\t\tconst tool = availableTools.find((t) => t.tool_id === id);\n\t\tconst token = tool ? `{{tool:${tool.function_key}}}` : null;\n\t\tconst strip = (text: string) => (token ? text.split(token).join('') : text);\n\t\tundoSnapshotRef.current = { instructions, guardrail, tools };\n\t\tsetInstructions((prev) => strip(prev));\n\t\tsetGuardrail((prev) => strip(prev));\n\t\tsetTools((prev) => prev.filter((t) => t !== id));\n\t\tsetInstrKey((k) => k + 1);\n\t\tsetGuardKey((k) => k + 1);\n\t\tundoIdRef.current += 1;\n\t\tsetUndo({\n\t\t\tid: undoIdRef.current,\n\t\t\tmessage: `Tool \"${tool?.display_name ?? 'Tool'}\" removed`,\n\t\t});\n\t};\n\n\tconst undoRemove = () => {\n\t\tconst snap = undoSnapshotRef.current;\n\t\tif (snap) {\n\t\t\tsetInstructions(snap.instructions);\n\t\t\tsetGuardrail(snap.guardrail);\n\t\t\tsetTools(snap.tools);\n\t\t\tsetInstrKey((k) => k + 1);\n\t\t\tsetGuardKey((k) => k + 1);\n\t\t\tundoSnapshotRef.current = null;\n\t\t}\n\t\tsetUndo(null);\n\t};\n\n\tconst canSave =\n\t\tname.trim().length > 0 &&\n\t\t(instructions.trim().length > 0 || guardrail.trim().length > 0);\n\n\tconst toolItems: SelectableItem[] = tools\n\t\t.map((id): SelectableItem | null => {\n\t\t\tconst tool = availableTools.find((t) => t.tool_id === id);\n\t\t\treturn tool\n\t\t\t\t? {\n\t\t\t\t\t\tid,\n\t\t\t\t\t\tlabel: tool.display_name,\n\t\t\t\t\t\ticon: SOURCE_ICONS[tool.source ?? 'manifest'],\n\t\t\t\t }\n\t\t\t\t: null;\n\t\t})\n\t\t.filter((x): x is SelectableItem => x !== null);\n\n\t// Offer all tools (re-add allowed); the chip list stays deduped. Icon left of\n\t// the name, no description.\n\tconst toolOptions: SingleOption[] = availableTools.map((t) => ({\n\t\tlabel: t.display_name,\n\t\tvalue: t.tool_id,\n\t\tleadingIcon:\n\t\t\trenderSourceIcon(SOURCE_ICONS[t.source ?? 'manifest']) ?? undefined,\n\t}));\n\n\t// Group tools by source (Manifest / Shopify / …) so the empty state shows the\n\t// same per-source buttons as the main builder's side panel.\n\tconst toolSourceGroups: SourceGroup[] = (() => {\n\t\tconst order: string[] = [];\n\t\tconst bySource = new Map<string, SingleOption[]>();\n\t\tavailableTools.forEach((t) => {\n\t\t\tconst src = t.source ?? 'manifest';\n\t\t\tif (!bySource.has(src)) {\n\t\t\t\tbySource.set(src, []);\n\t\t\t\torder.push(src);\n\t\t\t}\n\t\t\tbySource.get(src)?.push({\n\t\t\t\tlabel: t.display_name,\n\t\t\t\tvalue: t.tool_id,\n\t\t\t\tleadingIcon:\n\t\t\t\t\trenderSourceIcon(SOURCE_ICONS[t.source ?? 'manifest']) ?? undefined,\n\t\t\t});\n\t\t});\n\t\treturn order.map((src) => ({\n\t\t\tsource: src,\n\t\t\tlabel: toolSourceLabel(src),\n\t\t\toptions: bySource.get(src) ?? [],\n\t\t}));\n\t})();\n\n\tconst handleSave = async () => {\n\t\tif (!canSave || saving) {\n\t\t\treturn;\n\t\t}\n\t\tconst result = onSave({\n\t\t\tname: name.trim(),\n\t\t\tinstructions,\n\t\t\tguardrail,\n\t\t\ttools,\n\t\t});\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\tconst handleImprove = async (kind: 'instructions' | 'guardrail') => {\n\t\tif (!onImprove || improving) {\n\t\t\treturn;\n\t\t}\n\t\tsetImproving(kind);\n\t\ttry {\n\t\t\tconst current = kind === 'instructions' ? instructions : guardrail;\n\t\t\tconst improved = await onImprove(kind, current);\n\t\t\tif (kind === 'instructions') {\n\t\t\t\tsetInstructions(improved);\n\t\t\t\tsetInstrKey((k) => k + 1);\n\t\t\t} else {\n\t\t\t\tsetGuardrail(improved);\n\t\t\t\tsetGuardKey((k) => k + 1);\n\t\t\t}\n\t\t} finally {\n\t\t\tsetImproving(null);\n\t\t}\n\t};\n\n\treturn (\n\t\t<>\n\t\t\t<SubAgentScrim onClick={onClose} data-test=\"subagent-scrim\" />\n\t\t\t<SubAgentPanel data-test=\"create-subagent-panel\">\n\t\t\t\t<SubAgentPanelHeader>\n\t\t\t\t\t<SubAgentPanelHeaderText>\n\t\t\t\t\t\t<TitleRegular color={COLORS.content.primary}>{title}</TitleRegular>\n\t\t\t\t\t\t<BodySecondary color={COLORS.content.secondary}>\n\t\t\t\t\t\t\tEach sub-agent handles one piece of the job. Use @ in the main\n\t\t\t\t\t\t\tinstructions to call them.\n\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t</SubAgentPanelHeaderText>\n\t\t\t\t\t<SubAgentCloseButton onClick={onClose} aria-label=\"Close\">\n\t\t\t\t\t\t<CrossIcon\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.secondary}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</SubAgentCloseButton>\n\t\t\t\t</SubAgentPanelHeader>\n\n\t\t\t\t<SubAgentPanelBody>\n\t\t\t\t\t<Input\n\t\t\t\t\t\tdata-test=\"subagent-name\"\n\t\t\t\t\t\tlabelText=\"Agent name\"\n\t\t\t\t\t\tlabelTextBold\n\t\t\t\t\t\tplaceholder=\"Enter agent name\"\n\t\t\t\t\t\tvalue={name}\n\t\t\t\t\t\tmaxCharLimit={charLimits.name}\n\t\t\t\t\t\tmaxCharLimitPosition=\"TOP\"\n\t\t\t\t\t\tmaxCharStyle={{ fontSize: 12, lineHeight: '16px' }}\n\t\t\t\t\t\tonChangeText={setName}\n\t\t\t\t\t/>\n\n\t\t\t\t\t<MentionEditor\n\t\t\t\t\t\tdata-test=\"subagent-instructions\"\n\t\t\t\t\t\tlabel=\"Instructions\"\n\t\t\t\t\t\tvalue={instructions}\n\t\t\t\t\t\tonChange={setInstructions}\n\t\t\t\t\t\tmaxLength={charLimits.instructions}\n\t\t\t\t\t\tplaceholder=\"Write the steps in plain English. Type @ to reference a tool.\"\n\t\t\t\t\t\tminHeight=\"160px\"\n\t\t\t\t\t\tresetKey={`instr-${instrKey}`}\n\t\t\t\t\t\tmentionItems={mentionItems}\n\t\t\t\t\t\ttools={availableTools}\n\t\t\t\t\t\tonMentionSelect={addToolMention}\n\t\t\t\t\t\tonFocus={focusInstr}\n\t\t\t\t\t\tregisterInsert={registerInstr}\n\t\t\t\t\t/>\n\n\t\t\t\t\t<MentionEditor\n\t\t\t\t\t\tdata-test=\"subagent-guardrail\"\n\t\t\t\t\t\tlabel=\"Guardrails\"\n\t\t\t\t\t\tvalue={guardrail}\n\t\t\t\t\t\tonChange={setGuardrail}\n\t\t\t\t\t\tmaxLength={charLimits.guardrail}\n\t\t\t\t\t\tplaceholder=\"e.g. Never discuss competitor pricing. Type @ to reference a tool.\"\n\t\t\t\t\t\tminHeight=\"160px\"\n\t\t\t\t\t\tresetKey={`guard-${guardKey}`}\n\t\t\t\t\t\tmentionItems={mentionItems}\n\t\t\t\t\t\ttools={availableTools}\n\t\t\t\t\t\tonMentionSelect={addToolMention}\n\t\t\t\t\t\tonFocus={focusGuard}\n\t\t\t\t\t\tregisterInsert={registerGuard}\n\t\t\t\t\t/>\n\n\t\t\t\t\t<SelectableListSection\n\t\t\t\t\t\ttitle=\"Tools this agent can use\"\n\t\t\t\t\t\tdataTestPrefix=\"subagent-tools\"\n\t\t\t\t\t\titems={toolItems}\n\t\t\t\t\t\taddableOptions={toolOptions}\n\t\t\t\t\t\tsourceGroups={toolSourceGroups}\n\t\t\t\t\t\tmentionItems={mentionItems}\n\t\t\t\t\t\temptyText=\"No tools added yet.\"\n\t\t\t\t\t\tonAdd={(id) => {\n\t\t\t\t\t\t\tinsertToolAtCursor(id);\n\t\t\t\t\t\t\tsetTools((prev) => addUnique(prev, id));\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tonRemove={removeTool}\n\t\t\t\t\t/>\n\t\t\t\t</SubAgentPanelBody>\n\n\t\t\t\t<SubAgentPanelFooter>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tdata-test=\"subagent-save\"\n\t\t\t\t\t\tbuttonType=\"primary\"\n\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\tbuttonText=\"Save\"\n\t\t\t\t\t\tdisabled={!canSave}\n\t\t\t\t\t\tisLoading={saving}\n\t\t\t\t\t\tonClick={handleSave}\n\t\t\t\t\t/>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tdata-test=\"subagent-cancel\"\n\t\t\t\t\t\tbuttonType=\"tertiaryGray\"\n\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\tbuttonText=\"Cancel\"\n\t\t\t\t\t\tonClick={onClose}\n\t\t\t\t\t/>\n\t\t\t\t</SubAgentPanelFooter>\n\t\t\t</SubAgentPanel>\n\n\t\t\t{undo && (\n\t\t\t\t<Toaster\n\t\t\t\t\tkey={undo.id}\n\t\t\t\t\ttext={undo.message}\n\t\t\t\t\ttype=\"info\"\n\t\t\t\t\tposition=\"top-right\"\n\t\t\t\t\tautoClose={5000}\n\t\t\t\t\thideCloseButton\n\t\t\t\t\tbuttonProps={{\n\t\t\t\t\t\tbuttonText: 'Undo',\n\t\t\t\t\t\tshowButton: true,\n\t\t\t\t\t\tonButtonClick: () => {\n\t\t\t\t\t\t\tundoRemove();\n\t\t\t\t\t\t\treturn {} as Record<string, never>;\n\t\t\t\t\t\t},\n\t\t\t\t\t}}\n\t\t\t\t\tonCloseToast={() => setUndo(null)}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</>\n\t);\n};\n"],"names":["CreateSubAgentPanel","onClose","onSave","availableTools","onImprove","title","initial","appLabel","charLimits","AGENT_CHAR_LIMITS","name","setName","useState","instructions","setInstructions","guardrail","setGuardrail","tools","setTools","saving","setSaving","instrKey","setInstrKey","guardKey","setGuardKey","improving","setImproving","mentionItems","useMemo","buildAgentMentionItems","insertersRef","useRef","lastFocusedRef","registerInstr","useCallback","fn","registerGuard","focusInstr","focusGuard","addToolMention","kind","id","prev","addUnique","insertToolAtCursor","undo","setUndo","undoSnapshotRef","undoIdRef","removeTool","tool","t","token","strip","text","k","undoRemove","snap","canSave","toolItems","SOURCE_ICONS","x","toolOptions","renderSourceIcon","toolSourceGroups","order","bySource","src","toolSourceLabel","handleSave","result","jsxs","Fragment","jsx","SubAgentScrim","SubAgentPanel","SubAgentPanelHeader","SubAgentPanelHeaderText","TitleRegular","COLORS","BodySecondary","SubAgentCloseButton","CrossIcon","SubAgentPanelBody","Input","MentionEditor","SelectableListSection","SubAgentPanelFooter","Button","Toaster"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const R=require("react/jsx-runtime"),o=require("react"),T=require("../context/AgentBuilderContext.js"),c=require("../utils/mentionSerialization.js"),j=require("./MentionEditor.js"),I=({fieldKey:e,label:l,placeholder:b,maxLength:g,minHeight:d,...M})=>{const{value:i,patch:m,addReference:s,availableTools:n,availableSubAgents:r,applicationType:a,mentionResetKey:p,registerMentionField:u,notifyMentionFocus:C,onCreateSubAgent:S,requestCreateSubAgent:A}=T.useAgentBuilderContext(),q=o.useMemo(()=>c.buildAgentMentionItems(n,r,c.appTypeLabel(a)),[n,r,a]),v=o.useCallback(t=>u(e,t),[u,e]),F=o.useCallback((t,x)=>s(t,x),[s]);return R.jsx(j.MentionEditor,{label:l,value:i[e]??"",onChange:t=>m({[e]:t}),maxLength:g,placeholder:b,minHeight:d,resetKey:`${i.id}:${e}:${p}`,mentionItems:q,tools:n,onMentionSelect:F,onFocus:()=>C(e),registerInsert:v,onCreateSubAgent:S?A:void 0,"data-test":M["data-test"]})};exports.MentionField=I;
|
|
2
2
|
//# sourceMappingURL=MentionField.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MentionField.js","sources":["../../../../../src/components/agent-builder/components/MentionField.tsx"],"sourcesContent":["import React, { useCallback, useMemo } from 'react';\nimport { AgentValue } from '../AgentBuilder.model';\nimport {\n\tMentionFieldKey,\n\tuseAgentBuilderContext,\n} from '../context/AgentBuilderContext';\nimport {\n\tappTypeLabel,\n\tbuildAgentMentionItems,\n} from '../utils/mentionSerialization';\nimport { MentionEditor } from './MentionEditor';\n\ninterface MentionFieldProps {\n\t/** Which AgentValue field this editor reads / writes. */\n\tfieldKey: MentionFieldKey;\n\tlabel: string;\n\tplaceholder?: string;\n\tmaxLength: number;\n\tminHeight?: string;\n\t'data-test'?: string;\n}\n\n/**\n * Context-bound {@link MentionEditor} for the builder's Step-3 Instructions /\n * Guardrails. Both `@` tools and sub-agents are offered; the field registers its\n * insert + focus with the context so side-panel adds drop a chip into whichever\n * field was last focused, and remounts on `mentionResetKey`.\n */\nexport const MentionField: React.FC<MentionFieldProps> = ({\n\tfieldKey,\n\tlabel,\n\tplaceholder,\n\tmaxLength,\n\tminHeight,\n\t...rest\n}) => {\n\tconst {\n\t\tvalue,\n\t\tpatch,\n\t\tavailableTools,\n\t\tavailableSubAgents,\n\t\tapplicationType,\n\t\tmentionResetKey,\n\t\tregisterMentionField,\n\t\tnotifyMentionFocus,\n\t\tonCreateSubAgent,\n\t\trequestCreateSubAgent,\n\t} = useAgentBuilderContext();\n\n\tconst mentionItems = useMemo(\n\t\t() =>\n\t\t\tbuildAgentMentionItems(\n\t\t\t\tavailableTools,\n\t\t\t\tavailableSubAgents,\n\t\t\t\tappTypeLabel(applicationType),\n\t\t\t),\n\t\t[availableTools, availableSubAgents, applicationType],\n\t);\n\n\tconst registerInsert = useCallback(\n\t\t(fn: Parameters<typeof registerMentionField>[1]) =>\n\t\t\tregisterMentionField(fieldKey, fn),\n\t\t[registerMentionField, fieldKey],\n\t);\n\n\
|
|
1
|
+
{"version":3,"file":"MentionField.js","sources":["../../../../../src/components/agent-builder/components/MentionField.tsx"],"sourcesContent":["import React, { useCallback, useMemo } from 'react';\nimport { AgentValue } from '../AgentBuilder.model';\nimport {\n\tMentionFieldKey,\n\tuseAgentBuilderContext,\n} from '../context/AgentBuilderContext';\nimport {\n\tappTypeLabel,\n\tbuildAgentMentionItems,\n} from '../utils/mentionSerialization';\nimport { MentionEditor } from './MentionEditor';\n\ninterface MentionFieldProps {\n\t/** Which AgentValue field this editor reads / writes. */\n\tfieldKey: MentionFieldKey;\n\tlabel: string;\n\tplaceholder?: string;\n\tmaxLength: number;\n\tminHeight?: string;\n\t'data-test'?: string;\n}\n\n/**\n * Context-bound {@link MentionEditor} for the builder's Step-3 Instructions /\n * Guardrails. Both `@` tools and sub-agents are offered; the field registers its\n * insert + focus with the context so side-panel adds drop a chip into whichever\n * field was last focused, and remounts on `mentionResetKey`.\n */\nexport const MentionField: React.FC<MentionFieldProps> = ({\n\tfieldKey,\n\tlabel,\n\tplaceholder,\n\tmaxLength,\n\tminHeight,\n\t...rest\n}) => {\n\tconst {\n\t\tvalue,\n\t\tpatch,\n\t\taddReference,\n\t\tavailableTools,\n\t\tavailableSubAgents,\n\t\tapplicationType,\n\t\tmentionResetKey,\n\t\tregisterMentionField,\n\t\tnotifyMentionFocus,\n\t\tonCreateSubAgent,\n\t\trequestCreateSubAgent,\n\t} = useAgentBuilderContext();\n\n\tconst mentionItems = useMemo(\n\t\t() =>\n\t\t\tbuildAgentMentionItems(\n\t\t\t\tavailableTools,\n\t\t\t\tavailableSubAgents,\n\t\t\t\tappTypeLabel(applicationType),\n\t\t\t),\n\t\t[availableTools, availableSubAgents, applicationType],\n\t);\n\n\tconst registerInsert = useCallback(\n\t\t(fn: Parameters<typeof registerMentionField>[1]) =>\n\t\t\tregisterMentionField(fieldKey, fn),\n\t\t[registerMentionField, fieldKey],\n\t);\n\n\t// Route through the context's ref-backed `addReference`: BikEditor captures\n\t// this handler at mount, so reading `value.tools` here would keep only the last\n\t// pick. `addReference` always appends against the latest lists.\n\tconst onMentionSelect = useCallback(\n\t\t(kind: 'tool' | 'subagent', id: string) => addReference(kind, id),\n\t\t[addReference],\n\t);\n\n\treturn (\n\t\t<MentionEditor\n\t\t\tlabel={label}\n\t\t\tvalue={(value[fieldKey] as string | undefined) ?? ''}\n\t\t\tonChange={(text) => patch({ [fieldKey]: text } as Partial<AgentValue>)}\n\t\t\tmaxLength={maxLength}\n\t\t\tplaceholder={placeholder}\n\t\t\tminHeight={minHeight}\n\t\t\tresetKey={`${value.id}:${fieldKey}:${mentionResetKey}`}\n\t\t\tmentionItems={mentionItems}\n\t\t\ttools={availableTools}\n\t\t\tonMentionSelect={onMentionSelect}\n\t\t\tonFocus={() => notifyMentionFocus(fieldKey)}\n\t\t\tregisterInsert={registerInsert}\n\t\t\tonCreateSubAgent={onCreateSubAgent ? requestCreateSubAgent : undefined}\n\t\t\tdata-test={rest['data-test']}\n\t\t/>\n\t);\n};\n"],"names":["MentionField","fieldKey","label","placeholder","maxLength","minHeight","rest","value","patch","addReference","availableTools","availableSubAgents","applicationType","mentionResetKey","registerMentionField","notifyMentionFocus","onCreateSubAgent","requestCreateSubAgent","useAgentBuilderContext","mentionItems","useMemo","buildAgentMentionItems","appTypeLabel","registerInsert","useCallback","fn","onMentionSelect","kind","id","jsx","MentionEditor","text"],"mappings":"qQA4BaA,EAA4C,CAAC,CACzD,SAAAC,EACA,MAAAC,EACA,YAAAC,EACA,UAAAC,EACA,UAAAC,EACA,GAAGC,CACJ,IAAM,CACL,KAAM,CACL,MAAAC,EACA,MAAAC,EACA,aAAAC,EACA,eAAAC,EACA,mBAAAC,EACA,gBAAAC,EACA,gBAAAC,EACA,qBAAAC,EACA,mBAAAC,EACA,iBAAAC,EACA,sBAAAC,CAAA,EACGC,yBAAA,EAEEC,EAAeC,EAAAA,QACpB,IACCC,EAAAA,uBACCX,EACAC,EACAW,EAAAA,aAAaV,CAAe,CAAA,EAE9B,CAACF,EAAgBC,EAAoBC,CAAe,CAAA,EAG/CW,EAAiBC,EAAAA,YACrBC,GACAX,EAAqBb,EAAUwB,CAAE,EAClC,CAACX,EAAsBb,CAAQ,CAAA,EAM1ByB,EAAkBF,EAAAA,YACvB,CAACG,EAA2BC,IAAenB,EAAakB,EAAMC,CAAE,EAChE,CAACnB,CAAY,CAAA,EAGd,OACCoB,EAAAA,IAACC,EAAAA,cAAA,CACA,MAAA5B,EACA,MAAQK,EAAMN,CAAQ,GAA4B,GAClD,SAAW8B,GAASvB,EAAM,CAAE,CAACP,CAAQ,EAAG8B,EAA6B,EACrE,UAAA3B,EACA,YAAAD,EACA,UAAAE,EACA,SAAU,GAAGE,EAAM,EAAE,IAAIN,CAAQ,IAAIY,CAAe,GACpD,aAAAM,EACA,MAAOT,EACP,gBAAAgB,EACA,QAAS,IAAMX,EAAmBd,CAAQ,EAC1C,eAAAsB,EACA,iBAAkBP,EAAmBC,EAAwB,OAC7D,YAAWX,EAAK,WAAW,CAAA,CAAA,CAG9B"}
|
|
@@ -1,15 +1,15 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),U=require("../../../assets/icons/delete.svg.js"),J=require("../../../assets/icons/edit.svg.js"),E=require("../../../assets/icons/plus.svg.js"),h=require("react"),Q=require("styled-components"),S=require("../../TypographyStyle.js"),d=require("../../../constants/Theme.js"),s=require("../AgentBuilder.styled.js"),R=require("../utils/sourceIcons.js"),X=require("./MentionPicker.js"),D=require("../../dropdown/Dropdown.js"),O=require("../../dropdown/utils.js"),Y=require("../../button/Button.js"),Z=l=>l&&typeof l=="object"&&"default"in l?l:{default:l},g=Z(Q),I="__bik_create_new__",G=({title:l,helper:$,items:u,addableOptions:f,onAdd:j,onRemove:z,dataTestPrefix:r,emptyText:F,createOption:t,onConfigure:x,sourceGroups:w,mentionItems:k})=>{const[a,c]=h.useState(!1),[H,b]=h.useState(null),y=!!w&&w.length>0,v=w?.find(e=>e.source===H),o=k!==void 0,L=h.useRef(null),_=h.useRef(null),[p,m]=h.useState(null);h.useEffect(()=>{if(!o||!a)return;const e=C=>{const A=C.target;!L.current?.contains(A)&&!_.current?.contains(A)&&c(!1)},i=C=>{C.key==="Escape"&&c(!1)};return document.addEventListener("mousedown",e),document.addEventListener("keydown",i),()=>{document.removeEventListener("mousedown",e),document.removeEventListener("keydown",i)}},[o,a]);const N=y?o||u.length>0:o||f.length>0||!!t&&u.length>0,V=u.length===0&&!!t&&!y&&!o,W=y&&u.length===0,K=()=>{if(o){m(null),c(e=>!e);return}if(y){b(null),c(e=>!e);return}if(f.length===0&&t){t.onSelect();return}c(e=>!e)},P=()=>u.map(e=>n.jsxs(s.SelectableRow,{"data-test":`${r}-row-${e.id}`,children:[R.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:[x&&n.jsx(s.RowMenuButton,{"data-test":`${r}-edit-${e.id}`,"aria-label":`Edit ${e.label}`,onClick:()=>x(e.id),children:n.jsx(J.default,{width:16,height:16,color:d.COLORS.content.secondary})}),x&&n.jsx(s.RowActionDivider,{"aria-hidden":!0}),n.jsx(s.RowMenuButton,{"data-test":`${r}-delete-${e.id}`,"aria-label":`Delete ${e.label}`,onClick:()=>z(e.id),children:n.jsx(U.default,{width:16,height:16,color:d.COLORS.content.secondary})})]})]},e.id)),q=t?[...f,{label:t.label,value:I,searchKey:t.label,customComponent:n.jsx("div",{style:{width:"100%",textAlign:"center",color:d.COLORS.content.brand,fontFamily:"Inter",fontSize:14,fontWeight:600},children:t.label})}]:f,B=o?n.jsx(X.MentionPicker,{items:k??[],query:"",activeIndex:0,initialSource:p??void 0,onSelect:e=>{c(!1),j(String(e.id))},onClose:()=>c(!1),onCreateSubAgent:t?()=>{c(!1),t.onSelect()}:void 0},p??"__root__"):null;return n.jsxs(s.SideSection,{children:[n.jsxs(s.SideSectionHeader,{children:[n.jsx(S.TitleSmall,{color:d.COLORS.content.primary,children:l}),N&&n.jsxs(T,{ref:L,children:[n.jsx(s.AddIconButton,{"data-test":`${r}-add`,onClick:K,"aria-label":`Add ${l}`,children:n.jsx(E.default,{width:20,height:20,color:d.COLORS.content.brand})}),o&&a&&p===null&&n.jsx(M,{"data-test":`${r}-picker`,children:B})]})]}),$&&n.jsx(S.BodyCaption,{color:d.COLORS.content.secondary,children:$}),W?n.jsxs(ee,{ref:o?_:void 0,children:[n.jsx(s.SourceButtonRow,{"data-test":`${r}-sources`,children:w?.map(e=>n.jsxs(s.SourceButton,{type:"button","data-test":`${r}-source-${e.source}`,onClick:()=>{if(o){m(e.source),c(!0);return}b(e.source)},children:[R.renderSourceIcon(R.SOURCE_ICONS[e.source],-4),n.jsx(S.BodySecondary,{color:d.COLORS.content.primary,children:e.label})]},e.source))}),o&&a&&p!==null&&n.jsx(M,{$align:"left","data-test":`${r}-picker`,children:B}),!o&&v&&n.jsx(D.Dropdown,{"data-test":`${r}-dropdown`,size:"small",width:"100%",isSearchable:!0,placeHolder:`Search ${v.label} tools`,options:v.options,onSelect:e=>{const i=O.unwrapDropdownValue(e);b(null),c(!1),i&&j(i)}})]}):n.jsxs(n.Fragment,{children:[!o&&a&&q.length>0&&n.jsx(D.Dropdown,{"data-test":`${r}-dropdown`,size:"small",width:"100%",isSearchable:!0,placeHolder:`Select ${l.toLowerCase()}`,options:q,onSelect:e=>{const i=O.unwrapDropdownValue(e);c(!1),i&&(i===I?t?.onSelect():j(i))}}),u.length===0&&!a?n.jsxs(n.Fragment,{children:[n.jsx(S.BodyCaption,{color:d.COLORS.content.placeholder,children:F}),V&&t&&n.jsx(Y.Button,{"data-test":`${r}-create`,buttonType:"secondary",size:"small",matchParentWidth:!0,LeadingIcon:E.default,buttonText:t.label,onClick:t.onSelect})]}):P()]})]})},T=g.default.div`
|
|
2
2
|
position: relative;
|
|
3
3
|
display: flex;
|
|
4
|
-
`,
|
|
4
|
+
`,ee=g.default.div`
|
|
5
5
|
position: relative;
|
|
6
6
|
display: flex;
|
|
7
7
|
flex-direction: column;
|
|
8
8
|
gap: 8px;
|
|
9
|
-
`,
|
|
9
|
+
`,M=g.default.div`
|
|
10
10
|
position: absolute;
|
|
11
11
|
top: calc(100% + 4px);
|
|
12
12
|
${l=>l.$align==="left"?"left: 0;":"right: 0;"}
|
|
13
13
|
z-index: 30;
|
|
14
|
-
`;exports.SelectableListSection=
|
|
14
|
+
`;exports.SelectableListSection=G;
|
|
15
15
|
//# sourceMappingURL=SelectableListSection.js.map
|
|
@@ -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 {\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}\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}\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}) => {\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\tconst pickerWrapRef = 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\tif (!pickerWrapRef.current?.contains(e.target as Node)) {\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// With sourceGroups the empty state IS the source buttons, so \"+\" only adds more.\n\tconst showAddButton = hasSourceGroups\n\t\t? items.length > 0\n\t\t: // Picker mode (sub-agents) always shows the header \"+\", even when empty —\n\t\t // the empty state is just the title + helper + \"+\" (create lives in the picker).\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\t// Source buttons ONLY while no tool is added. Once one exists, adding more uses\n\t// the header \"+\" → all-tools dropdown (the buttons never come back).\n\tconst showSourceButtons = hasSourceGroups && 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<SelectableRow\n\t\t\t\tkey={item.id}\n\t\t\t\tdata-test={`${dataTestPrefix}-row-${item.id}`}\n\t\t\t>\n\t\t\t\t{renderSourceIcon(item.icon)}\n\t\t\t\t<RowText>\n\t\t\t\t\t<BodySecondary numberOfLines={1} color={COLORS.content.primary}>\n\t\t\t\t\t\t{item.label}\n\t\t\t\t\t</BodySecondary>\n\t\t\t\t</RowText>\n\t\t\t\t<RowActions>\n\t\t\t\t\t{onConfigure && (\n\t\t\t\t\t\t// Configurable rows (sub-agents) get an always-visible edit icon.\n\t\t\t\t\t\t<RowMenuButton\n\t\t\t\t\t\t\tdata-test={`${dataTestPrefix}-edit-${item.id}`}\n\t\t\t\t\t\t\taria-label={`Edit ${item.label}`}\n\t\t\t\t\t\t\tonClick={() => onConfigure(item.id)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<EditIcon\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)}\n\t\t\t\t\t{onConfigure && <RowActionDivider aria-hidden />}\n\t\t\t\t\t<RowMenuButton\n\t\t\t\t\t\tdata-test={`${dataTestPrefix}-delete-${item.id}`}\n\t\t\t\t\t\taria-label={`Delete ${item.label}`}\n\t\t\t\t\t\tonClick={() => onRemove(item.id)}\n\t\t\t\t\t>\n\t\t\t\t\t\t<DeleteIcon\n\t\t\t\t\t\t\twidth={16}\n\t\t\t\t\t\t\theight={16}\n\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</RowMenuButton>\n\t\t\t\t</RowActions>\n\t\t\t</SelectableRow>\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/>\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={pickerWrapRef}>\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 ? pickerWrapRef : 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</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","adding","setAdding","useState","activeSource","setActiveSource","hasSourceGroups","activeGroup","g","usePicker","pickerWrapRef","useRef","pickerSource","setPickerSource","useEffect","onDocMouseDown","e","onKeyDown","showAddButton","showEmptyCreate","showSourceButtons","handleAddClick","v","renderChipRows","item","jsxs","SelectableRow","renderSourceIcon","jsx","RowText","BodySecondary","COLORS","RowActions","RowMenuButton","EditIcon","RowActionDivider","DeleteIcon","dropdownOptions","pickerNode","MentionPicker","SideSection","SideSectionHeader","TitleSmall","AddButtonWrap","AddIconButton","PlusIcon","PickerPopover","BodyCaption","SourcePickerAnchor","SourceButtonRow","SourceButton","SOURCE_ICONS","Dropdown","opt","unwrapDropdownValue","Fragment","Button","styled","p"],"mappings":"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"}
|
|
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 {\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}\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}\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}) => {\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\t// Source buttons ONLY while no tool is added. Once one exists, adding more uses\n\t// the header \"+\" → all-tools dropdown (the buttons never come back).\n\tconst showSourceButtons = hasSourceGroups && 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<SelectableRow\n\t\t\t\tkey={item.id}\n\t\t\t\tdata-test={`${dataTestPrefix}-row-${item.id}`}\n\t\t\t>\n\t\t\t\t{renderSourceIcon(item.icon)}\n\t\t\t\t<RowText>\n\t\t\t\t\t<BodySecondary numberOfLines={1} color={COLORS.content.primary}>\n\t\t\t\t\t\t{item.label}\n\t\t\t\t\t</BodySecondary>\n\t\t\t\t</RowText>\n\t\t\t\t<RowActions>\n\t\t\t\t\t{onConfigure && (\n\t\t\t\t\t\t// Configurable rows (sub-agents) get an always-visible edit icon.\n\t\t\t\t\t\t<RowMenuButton\n\t\t\t\t\t\t\tdata-test={`${dataTestPrefix}-edit-${item.id}`}\n\t\t\t\t\t\t\taria-label={`Edit ${item.label}`}\n\t\t\t\t\t\t\tonClick={() => onConfigure(item.id)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<EditIcon\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)}\n\t\t\t\t\t{onConfigure && <RowActionDivider aria-hidden />}\n\t\t\t\t\t<RowMenuButton\n\t\t\t\t\t\tdata-test={`${dataTestPrefix}-delete-${item.id}`}\n\t\t\t\t\t\taria-label={`Delete ${item.label}`}\n\t\t\t\t\t\tonClick={() => onRemove(item.id)}\n\t\t\t\t\t>\n\t\t\t\t\t\t<DeleteIcon\n\t\t\t\t\t\t\twidth={16}\n\t\t\t\t\t\t\theight={16}\n\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</RowMenuButton>\n\t\t\t\t</RowActions>\n\t\t\t</SelectableRow>\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/>\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</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","adding","setAdding","useState","activeSource","setActiveSource","hasSourceGroups","activeGroup","g","usePicker","headerPickerRef","useRef","sourcePickerRef","pickerSource","setPickerSource","useEffect","onDocMouseDown","e","target","onKeyDown","showAddButton","showEmptyCreate","showSourceButtons","handleAddClick","v","renderChipRows","item","jsxs","SelectableRow","renderSourceIcon","jsx","RowText","BodySecondary","COLORS","RowActions","RowMenuButton","EditIcon","RowActionDivider","DeleteIcon","dropdownOptions","pickerNode","MentionPicker","SideSection","SideSectionHeader","TitleSmall","AddButtonWrap","AddIconButton","PlusIcon","PickerPopover","BodyCaption","SourcePickerAnchor","SourceButtonRow","SourceButton","SOURCE_ICONS","Dropdown","opt","unwrapDropdownValue","Fragment","Button","styled","p"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),g=require("../../../assets/icons/tick.svg.js"),c=require("../../TypographyStyle.js"),a=require("../../../constants/Theme.js"),i=require("../AgentBuilder.styled.js"),x=require("../constants/steps.js"),m=require("../context/AgentBuilderContext.js"),v=()=>{const{activeStep:l,activeIndex:s,validation:d,goToStep:u,disableStepNavigation:n}=m.useAgentBuilderContext();return t.jsx(i.RailList,{children:x.STEP_DEFINITIONS.map(e=>{const r=e.key===l,o=e.index-1<s&&d[e.key],S=r?"active":o?"complete":"inactive",y=r?c.TitleSmall:c.BodySecondary;return t.jsxs(i.RailItem,{"data-test":`agent-step-${e.key}`,disabled:n,onClick:n?void 0:()=>u(e.key),children:[t.jsx(i.StepBadge,{state:S,children:o?t.jsx(g.default,{width:11,height:8,color:a.COLORS.content.primaryInverse}):e.index}),t.jsx(y,{color:a.COLORS.content.primary,children:e.title})]},e.key)})})};exports.StepRail=v;
|
|
2
2
|
//# sourceMappingURL=StepRail.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"StepRail.js","sources":["../../../../../src/components/agent-builder/components/StepRail.tsx"],"sourcesContent":["import React from 'react';\nimport { BodySecondary, TitleSmall } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport { RailItem, RailList, StepBadge } from '../AgentBuilder.styled';\nimport { STEP_DEFINITIONS } from '../constants/steps';\nimport { useAgentBuilderContext } from '../context/AgentBuilderContext';\n\nexport const StepRail: React.FC = () => {\n\tconst {\n\t\tactiveStep,\n\t\tactiveIndex,\n\t\tvalidation,\n\t\tgoToStep,\n\t\tdisableStepNavigation,\n\t} = useAgentBuilderContext();\n\n\treturn (\n\t\t<RailList>\n\t\t\t{STEP_DEFINITIONS.map((step) => {\n\t\t\t\tconst isActive = step.key === activeStep;\n\t\t\t\tconst isComplete = step.index - 1 < activeIndex && validation[step.key];\n\t\t\t\tconst badgeState = isActive\n\t\t\t\t\t? 'active'\n\t\t\t\t\t: isComplete\n\t\t\t\t\t? 'complete'\n\t\t\t\t\t: 'inactive';\n\n\t\t\t\tconst Label = isActive ? TitleSmall : BodySecondary;\n\n\t\t\t\treturn (\n\t\t\t\t\t<RailItem\n\t\t\t\t\t\tkey={step.key}\n\t\t\t\t\t\tdata-test={`agent-step-${step.key}`}\n\t\t\t\t\t\tdisabled={disableStepNavigation}\n\t\t\t\t\t\tonClick={\n\t\t\t\t\t\t\tdisableStepNavigation ? undefined : () => goToStep(step.key)\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t<StepBadge state={badgeState}>\n\t\t\t\t\t\t\t{isComplete ?
|
|
1
|
+
{"version":3,"file":"StepRail.js","sources":["../../../../../src/components/agent-builder/components/StepRail.tsx"],"sourcesContent":["import TickIcon from '@src/assets/icons/tick.svg';\nimport React from 'react';\nimport { BodySecondary, TitleSmall } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport { RailItem, RailList, StepBadge } from '../AgentBuilder.styled';\nimport { STEP_DEFINITIONS } from '../constants/steps';\nimport { useAgentBuilderContext } from '../context/AgentBuilderContext';\n\nexport const StepRail: React.FC = () => {\n\tconst {\n\t\tactiveStep,\n\t\tactiveIndex,\n\t\tvalidation,\n\t\tgoToStep,\n\t\tdisableStepNavigation,\n\t} = useAgentBuilderContext();\n\n\treturn (\n\t\t<RailList>\n\t\t\t{STEP_DEFINITIONS.map((step) => {\n\t\t\t\tconst isActive = step.key === activeStep;\n\t\t\t\tconst isComplete = step.index - 1 < activeIndex && validation[step.key];\n\t\t\t\tconst badgeState = isActive\n\t\t\t\t\t? 'active'\n\t\t\t\t\t: isComplete\n\t\t\t\t\t? 'complete'\n\t\t\t\t\t: 'inactive';\n\n\t\t\t\tconst Label = isActive ? TitleSmall : BodySecondary;\n\n\t\t\t\treturn (\n\t\t\t\t\t<RailItem\n\t\t\t\t\t\tkey={step.key}\n\t\t\t\t\t\tdata-test={`agent-step-${step.key}`}\n\t\t\t\t\t\tdisabled={disableStepNavigation}\n\t\t\t\t\t\tonClick={\n\t\t\t\t\t\t\tdisableStepNavigation ? undefined : () => goToStep(step.key)\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t<StepBadge state={badgeState}>\n\t\t\t\t\t\t\t{isComplete ? (\n\t\t\t\t\t\t\t\t<TickIcon\n\t\t\t\t\t\t\t\t\twidth={11}\n\t\t\t\t\t\t\t\t\theight={8}\n\t\t\t\t\t\t\t\t\tcolor={COLORS.content.primaryInverse}\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\tstep.index\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</StepBadge>\n\t\t\t\t\t\t<Label color={COLORS.content.primary}>{step.title}</Label>\n\t\t\t\t\t</RailItem>\n\t\t\t\t);\n\t\t\t})}\n\t\t</RailList>\n\t);\n};\n"],"names":["StepRail","activeStep","activeIndex","validation","goToStep","disableStepNavigation","useAgentBuilderContext","jsx","RailList","STEP_DEFINITIONS","step","isActive","isComplete","badgeState","Label","TitleSmall","BodySecondary","jsxs","RailItem","StepBadge","TickIcon","COLORS"],"mappings":"4WAQaA,EAAqB,IAAM,CACvC,KAAM,CACL,WAAAC,EACA,YAAAC,EACA,WAAAC,EACA,SAAAC,EACA,sBAAAC,CAAA,EACGC,yBAAA,EAEJ,OACCC,EAAAA,IAACC,EAAAA,SAAA,CACC,SAAAC,EAAAA,iBAAiB,IAAKC,GAAS,CAC/B,MAAMC,EAAWD,EAAK,MAAQT,EACxBW,EAAaF,EAAK,MAAQ,EAAIR,GAAeC,EAAWO,EAAK,GAAG,EAChEG,EAAaF,EAChB,SACAC,EACA,WACA,WAEGE,EAAQH,EAAWI,EAAAA,WAAaC,EAAAA,cAEtC,OACCC,EAAAA,KAACC,EAAAA,SAAA,CAEA,YAAW,cAAcR,EAAK,GAAG,GACjC,SAAUL,EACV,QACCA,EAAwB,OAAY,IAAMD,EAASM,EAAK,GAAG,EAG5D,SAAA,CAAAH,EAAAA,IAACY,EAAAA,UAAA,CAAU,MAAON,EAChB,SAAAD,EACAL,EAAAA,IAACa,EAAAA,QAAA,CACA,MAAO,GACP,OAAQ,EACR,MAAOC,EAAAA,OAAO,QAAQ,cAAA,CAAA,EAGvBX,EAAK,MAEP,QACCI,EAAA,CAAM,MAAOO,EAAAA,OAAO,QAAQ,QAAU,WAAK,KAAA,CAAM,CAAA,CAAA,EAlB7CX,EAAK,GAAA,CAqBb,CAAC,CAAA,CACF,CAEF"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const ot=require("react/jsx-runtime"),s=require("react"),ct=require("../constants/charLimits.js"),g=require("../constants/steps.js"),ut=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},it=ut(s),O=it.default.createContext(null),lt=()=>{const t=s.useContext(O);if(!t)throw new Error("useAgentBuilderContext must be used within an AgentBuilderProvider");return t},dt=(t,o)=>{const l=t.trigger.mode==="custom_intent"?(t.trigger.custom_intent??"").trim().length>0:t.trigger.intents.length>0;return{about:t.name.trim().length>0&&t.name.length<=o.name&&t.description.length<=o.description,trigger:l,response:t.instructions.trim().length>0||(t.guardrail??"").trim().length>0,handover:!0}},at=({value:t,onChange:o,activeStep:l,onStepChange:p,availableTools:d,availableSubAgents:f,availableIntents:k,availableModels:C,validation:E,applicationType:M,charLimits:P,disableStepNavigation:h=!0,onCreateSubAgent:B,onFetchSubAgent:T,onUpdateSubAgent:y,onImproveSubAgent:A,children:v})=>{const[tt,et]=s.useState("about"),m=l??tt,u=g.getStepIndex(m),j=s.useRef(t);j.current=t;const[q,F]=s.useState(0),S=s.useRef({}),I=s.useRef("instructions"),K=s.useCallback((e,n)=>{n?S.current[e]=n:delete S.current[e]},[]),L=s.useCallback(e=>{I.current=e},[]),$=s.useRef(null),Y=s.useCallback(e=>{$.current=e},[]),w=s.useCallback(()=>{$.current?.()},[]),V=s.useCallback((e,n,c)=>{const a=S.current;(a[I.current]??a.instructions)?.(e,n,c)},[]),[D,x]=s.useState(null),R=s.useRef(null),G=s.useRef(0),i=s.useCallback(e=>{l===void 0&&et(e),p?.(e)},[l,p]),H=s.useCallback(()=>{const e=g.STEP_KEYS[Math.min(u+1,g.STEP_KEYS.length-1)];i(e)},[u,i]),N=s.useCallback(()=>{const e=g.STEP_KEYS[Math.max(u-1,0)];i(e)},[u,i]),U=s.useCallback(e=>o(e),[o]),z=s.useCallback((e,n)=>o({[e]:n}),[o]),J=s.useCallback((e,n)=>{const c=j.current;e==="tool"?c.tools.includes(n)||o({tools:[...c.tools,n]}):c.subagents.includes(n)||o({subagents:[...c.subagents,n]})},[o]),Q=s.useCallback((e,n)=>{const c=e==="tool"?(()=>{const r=d.find(rt=>rt.tool_id===n);return r?`{{tool:${r.function_key}}}`:null})():`{{subagent:${n}}}`,a=r=>c?r.split(c).join(""):r;R.current={tools:t.tools,subagents:t.subagents,instructions:t.instructions,guardrail:t.guardrail};const Z={instructions:a(t.instructions),guardrail:a(t.guardrail??""),...e==="tool"?{tools:t.tools.filter(r=>r!==n)}:{subagents:t.subagents.filter(r=>r!==n)}};o(Z),F(r=>r+1);const nt=e==="tool"?d.find(r=>r.tool_id===n)?.display_name??"Tool":f.find(r=>r.id===n)?.name??"Sub-agent";G.current+=1,x({id:G.current,message:`${e==="tool"?"Tool":"Sub-agent"} "${nt}" removed`})},[d,f,t,o]),W=s.useCallback(()=>{R.current&&(o(R.current),R.current=null,F(e=>e+1)),x(null)},[o]),X=s.useCallback(()=>x(null),[]),b=s.useMemo(()=>({...ct.AGENT_CHAR_LIMITS,...P}),[P]),_=s.useMemo(()=>({...dt(t,b),...E}),[t,b,E]),st=s.useMemo(()=>({value:t,patch:U,updateField:z,addReference:J,removeReference:Q,mentionResetKey:q,insertMention:V,registerMentionField:K,notifyMentionFocus:L,undoToast:D,undoRemoval:W,dismissUndo:X,activeStep:m,activeIndex:u,goToStep:i,goNext:H,goPrev:N,isFirstStep:u===0,isLastStep:u===g.STEP_KEYS.length-1,validation:_,isActiveStepValid:_[m],availableTools:d,availableSubAgents:f,availableIntents:k,availableModels:C,applicationType:M,charLimits:b,disableStepNavigation:h,onCreateSubAgent:B,registerSubAgentCreator:Y,requestCreateSubAgent:w,onFetchSubAgent:T,onUpdateSubAgent:y,onImproveSubAgent:A}),[t,U,z,J,Q,q,V,K,L,D,W,X,m,u,i,H,N,_,d,f,k,C,M,b,h,B,Y,w,T,y,A]);return ot.jsx(O.Provider,{value:st,children:v})};exports.AgentBuilderProvider=at;exports.useAgentBuilderContext=lt;
|
|
2
2
|
//# sourceMappingURL=AgentBuilderContext.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AgentBuilderContext.js","sources":["../../../../../src/components/agent-builder/context/AgentBuilderContext.tsx"],"sourcesContent":["import type { ApplicationType } from '@bikdotai/bik-models/growth';\nimport React, {\n\tuseCallback,\n\tuseContext,\n\tuseMemo,\n\tuseRef,\n\tuseState,\n} from 'react';\nimport {\n\tAgentTool,\n\tAgentValue,\n\tIntentOption,\n\tModelOption,\n\tStepKey,\n\tStepValidation,\n\tSubAgentDraft,\n\tSubAgentRef,\n} from '../AgentBuilder.model';\nimport { AGENT_CHAR_LIMITS } from '../constants/charLimits';\nimport type { AgentCharLimits } from '../constants/charLimits';\nimport { getStepIndex, STEP_KEYS } from '../constants/steps';\n\n/** Mention-capable text fields in Step 3 (both store firebase token text). */\nexport type MentionFieldKey = 'instructions' | 'guardrail';\ntype MentionInsertFn = (\n\tkind: 'tool' | 'subagent',\n\tid: string,\n\tlabel?: string,\n) => void;\n\n/** Toast shown after a tool / sub-agent is removed, offering an undo. */\nexport interface UndoToastState {\n\t/** Bumped per removal so the toast timer restarts. */\n\tid: number;\n\tmessage: string;\n}\n\nexport interface AgentBuilderContextShape {\n\t/** Controlled value relayed from props. */\n\tvalue: AgentValue;\n\t/** Patch one or more fields. */\n\tpatch: (partial: Partial<AgentValue>) => void;\n\t/** Patch a single field. */\n\tupdateField: <K extends keyof AgentValue>(key: K, val: AgentValue[K]) => void;\n\t/**\n\t * Remove a tool / sub-agent everywhere: drops it from the list AND strips ALL\n\t * its `{{tool:KEY}}` / `{{subagent:ID}}` tokens from BOTH the instructions and\n\t * the guardrails, remounts the editors, and raises an undo toast.\n\t */\n\tremoveReference: (kind: 'tool' | 'subagent', id: string) => void;\n\t/** Remount signal for the mention editors after an external edit. */\n\tmentionResetKey: number;\n\t/**\n\t * Insert a tool / sub-agent mention chip at the last cursor position of\n\t * whichever mention field was focused most recently (Instructions or\n\t * Guardrails). `label` overrides the chip text (e.g. a just-created sub-agent\n\t * not yet in the available list).\n\t */\n\tinsertMention: (\n\t\tkind: 'tool' | 'subagent',\n\t\tid: string,\n\t\tlabel?: string,\n\t) => void;\n\t/** A mention field registers its editor-backed insert here (internal). */\n\tregisterMentionField: (\n\t\tfieldKey: MentionFieldKey,\n\t\tfn: MentionInsertFn | null,\n\t) => void;\n\t/** A mention field reports focus so inserts target it (internal). */\n\tnotifyMentionFocus: (fieldKey: MentionFieldKey) => void;\n\n\t// Undo (post-removal)\n\t/** Non-null while the undo toast should be visible. */\n\tundoToast: UndoToastState | null;\n\t/** Restore the last removed tool / sub-agent (list + stripped tokens). */\n\tundoRemoval: () => void;\n\t/** Dismiss the undo toast without restoring. */\n\tdismissUndo: () => void;\n\n\t// Navigation\n\tactiveStep: StepKey;\n\tactiveIndex: number;\n\tgoToStep: (step: StepKey) => void;\n\tgoNext: () => void;\n\tgoPrev: () => void;\n\tisFirstStep: boolean;\n\tisLastStep: boolean;\n\n\t// Validation\n\tvalidation: StepValidation;\n\tisActiveStepValid: boolean;\n\n\t// Reference data\n\tavailableTools: AgentTool[];\n\tavailableSubAgents: SubAgentRef[];\n\tavailableIntents: IntentOption[];\n\tavailableModels: ModelOption[];\n\t/** Host application context (e.g. MANIFEST) — drives tool-chip labelling. */\n\tapplicationType?: ApplicationType;\n\t/** Resolved per-field character limits (consumer overrides merged over defaults). */\n\tcharLimits: AgentCharLimits;\n\t/** When true, step-rail items are not clickable (Back / Next only). */\n\tdisableStepNavigation: boolean;\n\n\t// Sub-agent creation (Step 3 drawer)\n\t/** Persist a new sub-agent and resolve with its ref. Omit to hide the create flow. */\n\tonCreateSubAgent?: (draft: SubAgentDraft) => Promise<SubAgentRef>;\n\t/**\n\t * Step 3 registers its \"open create-sub-agent drawer\" action here so the `@`\n\t * picker's \"Create new\" row can trigger it. Pass `null` to unregister.\n\t */\n\tregisterSubAgentCreator: (fn: (() => void) | null) => void;\n\t/** Open the create-sub-agent drawer (no-op until Step 3 registers it). */\n\trequestCreateSubAgent: () => void;\n\t/** Fetch a sub-agent's editable data (Configure). Omit to hide Configure. */\n\tonFetchSubAgent?: (id: string) => Promise<SubAgentDraft>;\n\t/** Persist edits to an existing sub-agent. */\n\tonUpdateSubAgent?: (id: string, draft: SubAgentDraft) => Promise<SubAgentRef>;\n\t/** Optional \"Improve with AI\" for the drawer's instructions / guardrails. */\n\tonImproveSubAgent?: (\n\t\tkind: 'instructions' | 'guardrail',\n\t\ttext: string,\n\t) => Promise<string>;\n}\n\nconst AgentBuilderContext =\n\tReact.createContext<AgentBuilderContextShape | null>(null);\n\nexport const useAgentBuilderContext = (): AgentBuilderContextShape => {\n\tconst ctx = useContext(AgentBuilderContext);\n\tif (!ctx) {\n\t\tthrow new Error(\n\t\t\t'useAgentBuilderContext must be used within an AgentBuilderProvider',\n\t\t);\n\t}\n\treturn ctx;\n};\n\n/** Validity derived purely from the current value (no effects). */\nconst deriveValidation = (\n\tvalue: AgentValue,\n\tlimits: AgentCharLimits,\n): StepValidation => {\n\tconst triggerValid =\n\t\tvalue.trigger.mode === 'custom_intent'\n\t\t\t? (value.trigger.custom_intent ?? '').trim().length > 0\n\t\t\t: value.trigger.intents.length > 0;\n\n\treturn {\n\t\tabout:\n\t\t\tvalue.name.trim().length > 0 &&\n\t\t\tvalue.name.length <= limits.name &&\n\t\t\tvalue.description.length <= limits.description,\n\t\ttrigger: triggerValid,\n\t\t// At least one of Instructions / Guardrails must be filled.\n\t\tresponse:\n\t\t\tvalue.instructions.trim().length > 0 ||\n\t\t\t(value.guardrail ?? '').trim().length > 0,\n\t\t// Optional until specced further — never blocks go-live.\n\t\thandover: true,\n\t};\n};\n\ninterface ProviderProps {\n\tvalue: AgentValue;\n\tonChange: (patch: Partial<AgentValue>) => void;\n\tactiveStep?: StepKey;\n\tonStepChange?: (step: StepKey) => void;\n\tavailableTools: AgentTool[];\n\tavailableSubAgents: SubAgentRef[];\n\tavailableIntents: IntentOption[];\n\tavailableModels: ModelOption[];\n\tvalidation?: Partial<StepValidation>;\n\tapplicationType?: ApplicationType;\n\tcharLimits?: Partial<AgentCharLimits>;\n\tdisableStepNavigation?: boolean;\n\tonCreateSubAgent?: (draft: SubAgentDraft) => Promise<SubAgentRef>;\n\tonFetchSubAgent?: (id: string) => Promise<SubAgentDraft>;\n\tonUpdateSubAgent?: (id: string, draft: SubAgentDraft) => Promise<SubAgentRef>;\n\tonImproveSubAgent?: (\n\t\tkind: 'instructions' | 'guardrail',\n\t\ttext: string,\n\t) => Promise<string>;\n\tchildren: React.ReactNode;\n}\n\nexport const AgentBuilderProvider: React.FC<ProviderProps> = ({\n\tvalue,\n\tonChange,\n\tactiveStep: controlledStep,\n\tonStepChange,\n\tavailableTools,\n\tavailableSubAgents,\n\tavailableIntents,\n\tavailableModels,\n\tvalidation: validationOverride,\n\tapplicationType,\n\tcharLimits: charLimitsOverride,\n\tdisableStepNavigation = true,\n\tonCreateSubAgent,\n\tonFetchSubAgent,\n\tonUpdateSubAgent,\n\tonImproveSubAgent,\n\tchildren,\n}) => {\n\tconst [internalStep, setInternalStep] = useState<StepKey>('about');\n\tconst activeStep = controlledStep ?? internalStep;\n\tconst activeIndex = getStepIndex(activeStep);\n\n\t// Bumped when a mention field is edited from OUTSIDE its editor (removing a\n\t// tool from the side list, undo), forcing the mention editors to remount.\n\tconst [mentionResetKey, setMentionResetKey] = useState(0);\n\n\t// Each mention field registers an editor-backed insert fn + reports focus, so\n\t// side-panel adds drop a chip into the last-focused field at its cursor.\n\tconst mentionInsertersRef = useRef<\n\t\tPartial<Record<MentionFieldKey, MentionInsertFn>>\n\t>({});\n\tconst lastFocusedFieldRef = useRef<MentionFieldKey>('instructions');\n\tconst registerMentionField = useCallback(\n\t\t(fieldKey: MentionFieldKey, fn: MentionInsertFn | null) => {\n\t\t\tif (fn) {\n\t\t\t\tmentionInsertersRef.current[fieldKey] = fn;\n\t\t\t} else {\n\t\t\t\tdelete mentionInsertersRef.current[fieldKey];\n\t\t\t}\n\t\t},\n\t\t[],\n\t);\n\tconst notifyMentionFocus = useCallback((fieldKey: MentionFieldKey) => {\n\t\tlastFocusedFieldRef.current = fieldKey;\n\t}, []);\n\n\t// Step 3 registers its drawer opener here; the `@` picker's \"Create new\" calls it.\n\tconst subAgentCreatorRef = useRef<(() => void) | null>(null);\n\tconst registerSubAgentCreator = useCallback((fn: (() => void) | null) => {\n\t\tsubAgentCreatorRef.current = fn;\n\t}, []);\n\tconst requestCreateSubAgent = useCallback(() => {\n\t\tsubAgentCreatorRef.current?.();\n\t}, []);\n\tconst insertMention = useCallback<MentionInsertFn>((kind, id, label) => {\n\t\tconst inserters = mentionInsertersRef.current;\n\t\tconst target =\n\t\t\tinserters[lastFocusedFieldRef.current] ?? inserters.instructions;\n\t\ttarget?.(kind, id, label);\n\t}, []);\n\n\t// Undo state for the most recent removal.\n\tconst [undoToast, setUndoToast] = useState<UndoToastState | null>(null);\n\tconst undoSnapshotRef = useRef<Partial<AgentValue> | null>(null);\n\tconst undoIdRef = useRef(0);\n\n\tconst goToStep = useCallback(\n\t\t(step: StepKey) => {\n\t\t\tif (controlledStep === undefined) {\n\t\t\t\tsetInternalStep(step);\n\t\t\t}\n\t\t\tonStepChange?.(step);\n\t\t},\n\t\t[controlledStep, onStepChange],\n\t);\n\n\tconst goNext = useCallback(() => {\n\t\tconst next = STEP_KEYS[Math.min(activeIndex + 1, STEP_KEYS.length - 1)];\n\t\tgoToStep(next);\n\t}, [activeIndex, goToStep]);\n\n\tconst goPrev = useCallback(() => {\n\t\tconst prev = STEP_KEYS[Math.max(activeIndex - 1, 0)];\n\t\tgoToStep(prev);\n\t}, [activeIndex, goToStep]);\n\n\tconst patch = useCallback(\n\t\t(partial: Partial<AgentValue>) => onChange(partial),\n\t\t[onChange],\n\t);\n\n\tconst updateField = useCallback(\n\t\t<K extends keyof AgentValue>(key: K, val: AgentValue[K]) =>\n\t\t\tonChange({ [key]: val } as Partial<AgentValue>),\n\t\t[onChange],\n\t);\n\n\tconst removeReference = useCallback(\n\t\t(kind: 'tool' | 'subagent', id: string) => {\n\t\t\tconst token =\n\t\t\t\tkind === 'tool'\n\t\t\t\t\t? (() => {\n\t\t\t\t\t\t\tconst tool = availableTools.find((t) => t.tool_id === id);\n\t\t\t\t\t\t\treturn tool ? `{{tool:${tool.function_key}}}` : null;\n\t\t\t\t\t })()\n\t\t\t\t\t: `{{subagent:${id}}}`;\n\t\t\tconst strip = (text: string) =>\n\t\t\t\ttoken ? text.split(token).join('') : text;\n\n\t\t\t// Snapshot the four fields a removal touches, for undo.\n\t\t\tundoSnapshotRef.current = {\n\t\t\t\ttools: value.tools,\n\t\t\t\tsubagents: value.subagents,\n\t\t\t\tinstructions: value.instructions,\n\t\t\t\tguardrail: value.guardrail,\n\t\t\t};\n\n\t\t\tconst next: Partial<AgentValue> = {\n\t\t\t\tinstructions: strip(value.instructions),\n\t\t\t\tguardrail: strip(value.guardrail ?? ''),\n\t\t\t\t...(kind === 'tool'\n\t\t\t\t\t? { tools: value.tools.filter((t) => t !== id) }\n\t\t\t\t\t: { subagents: value.subagents.filter((s) => s !== id) }),\n\t\t\t};\n\t\t\tonChange(next);\n\t\t\tsetMentionResetKey((k) => k + 1);\n\n\t\t\tconst label =\n\t\t\t\tkind === 'tool'\n\t\t\t\t\t? availableTools.find((t) => t.tool_id === id)?.display_name ?? 'Tool'\n\t\t\t\t\t: availableSubAgents.find((s) => s.id === id)?.name ?? 'Sub-agent';\n\t\t\tundoIdRef.current += 1;\n\t\t\tsetUndoToast({\n\t\t\t\tid: undoIdRef.current,\n\t\t\t\tmessage: `${kind === 'tool' ? 'Tool' : 'Sub-agent'} \"${label}\" removed`,\n\t\t\t});\n\t\t},\n\t\t[availableTools, availableSubAgents, value, onChange],\n\t);\n\n\tconst undoRemoval = useCallback(() => {\n\t\tif (undoSnapshotRef.current) {\n\t\t\tonChange(undoSnapshotRef.current);\n\t\t\tundoSnapshotRef.current = null;\n\t\t\tsetMentionResetKey((k) => k + 1);\n\t\t}\n\t\tsetUndoToast(null);\n\t}, [onChange]);\n\n\tconst dismissUndo = useCallback(() => setUndoToast(null), []);\n\n\t// Consumer overrides merged over the built-in defaults (name 60, rest 1000).\n\tconst charLimits = useMemo<AgentCharLimits>(\n\t\t() => ({ ...AGENT_CHAR_LIMITS, ...charLimitsOverride }),\n\t\t[charLimitsOverride],\n\t);\n\n\tconst validation: StepValidation = useMemo(\n\t\t() => ({ ...deriveValidation(value, charLimits), ...validationOverride }),\n\t\t[value, charLimits, validationOverride],\n\t);\n\n\tconst ctx = useMemo<AgentBuilderContextShape>(\n\t\t() => ({\n\t\t\tvalue,\n\t\t\tpatch,\n\t\t\tupdateField,\n\t\t\tremoveReference,\n\t\t\tmentionResetKey,\n\t\t\tinsertMention,\n\t\t\tregisterMentionField,\n\t\t\tnotifyMentionFocus,\n\t\t\tundoToast,\n\t\t\tundoRemoval,\n\t\t\tdismissUndo,\n\t\t\tactiveStep,\n\t\t\tactiveIndex,\n\t\t\tgoToStep,\n\t\t\tgoNext,\n\t\t\tgoPrev,\n\t\t\tisFirstStep: activeIndex === 0,\n\t\t\tisLastStep: activeIndex === STEP_KEYS.length - 1,\n\t\t\tvalidation,\n\t\t\tisActiveStepValid: validation[activeStep],\n\t\t\tavailableTools,\n\t\t\tavailableSubAgents,\n\t\t\tavailableIntents,\n\t\t\tavailableModels,\n\t\t\tapplicationType,\n\t\t\tcharLimits,\n\t\t\tdisableStepNavigation,\n\t\t\tonCreateSubAgent,\n\t\t\tregisterSubAgentCreator,\n\t\t\trequestCreateSubAgent,\n\t\t\tonFetchSubAgent,\n\t\t\tonUpdateSubAgent,\n\t\t\tonImproveSubAgent,\n\t\t}),\n\t\t[\n\t\t\tvalue,\n\t\t\tpatch,\n\t\t\tupdateField,\n\t\t\tremoveReference,\n\t\t\tmentionResetKey,\n\t\t\tinsertMention,\n\t\t\tregisterMentionField,\n\t\t\tnotifyMentionFocus,\n\t\t\tundoToast,\n\t\t\tundoRemoval,\n\t\t\tdismissUndo,\n\t\t\tactiveStep,\n\t\t\tactiveIndex,\n\t\t\tgoToStep,\n\t\t\tgoNext,\n\t\t\tgoPrev,\n\t\t\tvalidation,\n\t\t\tavailableTools,\n\t\t\tavailableSubAgents,\n\t\t\tavailableIntents,\n\t\t\tavailableModels,\n\t\t\tapplicationType,\n\t\t\tcharLimits,\n\t\t\tdisableStepNavigation,\n\t\t\tonCreateSubAgent,\n\t\t\tregisterSubAgentCreator,\n\t\t\trequestCreateSubAgent,\n\t\t\tonFetchSubAgent,\n\t\t\tonUpdateSubAgent,\n\t\t\tonImproveSubAgent,\n\t\t],\n\t);\n\n\treturn (\n\t\t<AgentBuilderContext.Provider value={ctx}>\n\t\t\t{children}\n\t\t</AgentBuilderContext.Provider>\n\t);\n};\n"],"names":["AgentBuilderContext","React","useAgentBuilderContext","ctx","useContext","deriveValidation","value","limits","triggerValid","AgentBuilderProvider","onChange","controlledStep","onStepChange","availableTools","availableSubAgents","availableIntents","availableModels","validationOverride","applicationType","charLimitsOverride","disableStepNavigation","onCreateSubAgent","onFetchSubAgent","onUpdateSubAgent","onImproveSubAgent","children","internalStep","setInternalStep","useState","activeStep","activeIndex","getStepIndex","mentionResetKey","setMentionResetKey","mentionInsertersRef","useRef","lastFocusedFieldRef","registerMentionField","useCallback","fieldKey","fn","notifyMentionFocus","subAgentCreatorRef","registerSubAgentCreator","requestCreateSubAgent","insertMention","kind","id","label","inserters","undoToast","setUndoToast","undoSnapshotRef","undoIdRef","goToStep","step","goNext","next","STEP_KEYS","goPrev","prev","patch","partial","updateField","key","val","removeReference","token","tool","t","strip","text","k","undoRemoval","dismissUndo","charLimits","useMemo","AGENT_CHAR_LIMITS","validation"],"mappings":"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AAS,EACA,YAAAuB,EACA,YAAAC,EACA,WAAA7C,EACA,YAAAC,EACA,SAAAwB,EACA,OAAAE,EACA,OAAAG,EACA,YAAa7B,IAAgB,EAC7B,WAAYA,IAAgB4B,YAAU,OAAS,EAC/C,WAAAoB,EACA,kBAAmBA,EAAWjD,CAAU,EACxC,eAAAhB,EACA,mBAAAC,EACA,iBAAAC,EACA,gBAAAC,EACA,gBAAAE,EAAA,WACAyD,EACA,sBAAAvD,EACA,iBAAAC,EACA,wBAAAsB,EACA,sBAAAC,EACA,gBAAAtB,EACA,iBAAAC,EACA,kBAAAC,CAAA,GAED,CACClB,EACAuD,EACAE,EACAG,EACAlC,EACAa,EACAR,EACAI,EACAS,EACAuB,EACAC,EACA7C,EACAC,EACAwB,EACAE,EACAG,EACAmB,EACAjE,EACAC,EACAC,EACAC,EACAE,EACAyD,EACAvD,EACAC,EACAsB,EACAC,EACAtB,EACAC,EACAC,CAAA,CACD,EAGD,cACExB,EAAoB,SAApB,CAA6B,MAAOG,GACnC,SAAAsB,EACF,CAEF"}
|
|
1
|
+
{"version":3,"file":"AgentBuilderContext.js","sources":["../../../../../src/components/agent-builder/context/AgentBuilderContext.tsx"],"sourcesContent":["import type { ApplicationType } from '@bikdotai/bik-models/growth';\nimport React, {\n\tuseCallback,\n\tuseContext,\n\tuseMemo,\n\tuseRef,\n\tuseState,\n} from 'react';\nimport {\n\tAgentTool,\n\tAgentValue,\n\tIntentOption,\n\tModelOption,\n\tStepKey,\n\tStepValidation,\n\tSubAgentDraft,\n\tSubAgentRef,\n} from '../AgentBuilder.model';\nimport { AGENT_CHAR_LIMITS } from '../constants/charLimits';\nimport type { AgentCharLimits } from '../constants/charLimits';\nimport { getStepIndex, STEP_KEYS } from '../constants/steps';\n\n/** Mention-capable text fields in Step 3 (both store firebase token text). */\nexport type MentionFieldKey = 'instructions' | 'guardrail';\ntype MentionInsertFn = (\n\tkind: 'tool' | 'subagent',\n\tid: string,\n\tlabel?: string,\n) => void;\n\n/** Toast shown after a tool / sub-agent is removed, offering an undo. */\nexport interface UndoToastState {\n\t/** Bumped per removal so the toast timer restarts. */\n\tid: number;\n\tmessage: string;\n}\n\nexport interface AgentBuilderContextShape {\n\t/** Controlled value relayed from props. */\n\tvalue: AgentValue;\n\t/** Patch one or more fields. */\n\tpatch: (partial: Partial<AgentValue>) => void;\n\t/** Patch a single field. */\n\tupdateField: <K extends keyof AgentValue>(key: K, val: AgentValue[K]) => void;\n\t/**\n\t * Remove a tool / sub-agent everywhere: drops it from the list AND strips ALL\n\t * its `{{tool:KEY}}` / `{{subagent:ID}}` tokens from BOTH the instructions and\n\t * the guardrails, remounts the editors, and raises an undo toast.\n\t */\n\tremoveReference: (kind: 'tool' | 'subagent', id: string) => void;\n\t/**\n\t * Append a tool / sub-agent id to its list (deduped), reading the LATEST value\n\t * via a ref. Use this instead of `patch({ tools: [...value.tools, id] })` from\n\t * any handler that may be captured with a stale `value` — notably the `@`\n\t * editor's mount-time `onSelect`, which would otherwise keep only the last pick.\n\t */\n\taddReference: (kind: 'tool' | 'subagent', id: string) => void;\n\t/** Remount signal for the mention editors after an external edit. */\n\tmentionResetKey: number;\n\t/**\n\t * Insert a tool / sub-agent mention chip at the last cursor position of\n\t * whichever mention field was focused most recently (Instructions or\n\t * Guardrails). `label` overrides the chip text (e.g. a just-created sub-agent\n\t * not yet in the available list).\n\t */\n\tinsertMention: (\n\t\tkind: 'tool' | 'subagent',\n\t\tid: string,\n\t\tlabel?: string,\n\t) => void;\n\t/** A mention field registers its editor-backed insert here (internal). */\n\tregisterMentionField: (\n\t\tfieldKey: MentionFieldKey,\n\t\tfn: MentionInsertFn | null,\n\t) => void;\n\t/** A mention field reports focus so inserts target it (internal). */\n\tnotifyMentionFocus: (fieldKey: MentionFieldKey) => void;\n\n\t// Undo (post-removal)\n\t/** Non-null while the undo toast should be visible. */\n\tundoToast: UndoToastState | null;\n\t/** Restore the last removed tool / sub-agent (list + stripped tokens). */\n\tundoRemoval: () => void;\n\t/** Dismiss the undo toast without restoring. */\n\tdismissUndo: () => void;\n\n\t// Navigation\n\tactiveStep: StepKey;\n\tactiveIndex: number;\n\tgoToStep: (step: StepKey) => void;\n\tgoNext: () => void;\n\tgoPrev: () => void;\n\tisFirstStep: boolean;\n\tisLastStep: boolean;\n\n\t// Validation\n\tvalidation: StepValidation;\n\tisActiveStepValid: boolean;\n\n\t// Reference data\n\tavailableTools: AgentTool[];\n\tavailableSubAgents: SubAgentRef[];\n\tavailableIntents: IntentOption[];\n\tavailableModels: ModelOption[];\n\t/** Host application context (e.g. MANIFEST) — drives tool-chip labelling. */\n\tapplicationType?: ApplicationType;\n\t/** Resolved per-field character limits (consumer overrides merged over defaults). */\n\tcharLimits: AgentCharLimits;\n\t/** When true, step-rail items are not clickable (Back / Next only). */\n\tdisableStepNavigation: boolean;\n\n\t// Sub-agent creation (Step 3 drawer)\n\t/** Persist a new sub-agent and resolve with its ref. Omit to hide the create flow. */\n\tonCreateSubAgent?: (draft: SubAgentDraft) => Promise<SubAgentRef>;\n\t/**\n\t * Step 3 registers its \"open create-sub-agent drawer\" action here so the `@`\n\t * picker's \"Create new\" row can trigger it. Pass `null` to unregister.\n\t */\n\tregisterSubAgentCreator: (fn: (() => void) | null) => void;\n\t/** Open the create-sub-agent drawer (no-op until Step 3 registers it). */\n\trequestCreateSubAgent: () => void;\n\t/** Fetch a sub-agent's editable data (Configure). Omit to hide Configure. */\n\tonFetchSubAgent?: (id: string) => Promise<SubAgentDraft>;\n\t/** Persist edits to an existing sub-agent. */\n\tonUpdateSubAgent?: (id: string, draft: SubAgentDraft) => Promise<SubAgentRef>;\n\t/** Optional \"Improve with AI\" for the drawer's instructions / guardrails. */\n\tonImproveSubAgent?: (\n\t\tkind: 'instructions' | 'guardrail',\n\t\ttext: string,\n\t) => Promise<string>;\n}\n\nconst AgentBuilderContext =\n\tReact.createContext<AgentBuilderContextShape | null>(null);\n\nexport const useAgentBuilderContext = (): AgentBuilderContextShape => {\n\tconst ctx = useContext(AgentBuilderContext);\n\tif (!ctx) {\n\t\tthrow new Error(\n\t\t\t'useAgentBuilderContext must be used within an AgentBuilderProvider',\n\t\t);\n\t}\n\treturn ctx;\n};\n\n/** Validity derived purely from the current value (no effects). */\nconst deriveValidation = (\n\tvalue: AgentValue,\n\tlimits: AgentCharLimits,\n): StepValidation => {\n\tconst triggerValid =\n\t\tvalue.trigger.mode === 'custom_intent'\n\t\t\t? (value.trigger.custom_intent ?? '').trim().length > 0\n\t\t\t: value.trigger.intents.length > 0;\n\n\treturn {\n\t\tabout:\n\t\t\tvalue.name.trim().length > 0 &&\n\t\t\tvalue.name.length <= limits.name &&\n\t\t\tvalue.description.length <= limits.description,\n\t\ttrigger: triggerValid,\n\t\t// At least one of Instructions / Guardrails must be filled.\n\t\tresponse:\n\t\t\tvalue.instructions.trim().length > 0 ||\n\t\t\t(value.guardrail ?? '').trim().length > 0,\n\t\t// Optional until specced further — never blocks go-live.\n\t\thandover: true,\n\t};\n};\n\ninterface ProviderProps {\n\tvalue: AgentValue;\n\tonChange: (patch: Partial<AgentValue>) => void;\n\tactiveStep?: StepKey;\n\tonStepChange?: (step: StepKey) => void;\n\tavailableTools: AgentTool[];\n\tavailableSubAgents: SubAgentRef[];\n\tavailableIntents: IntentOption[];\n\tavailableModels: ModelOption[];\n\tvalidation?: Partial<StepValidation>;\n\tapplicationType?: ApplicationType;\n\tcharLimits?: Partial<AgentCharLimits>;\n\tdisableStepNavigation?: boolean;\n\tonCreateSubAgent?: (draft: SubAgentDraft) => Promise<SubAgentRef>;\n\tonFetchSubAgent?: (id: string) => Promise<SubAgentDraft>;\n\tonUpdateSubAgent?: (id: string, draft: SubAgentDraft) => Promise<SubAgentRef>;\n\tonImproveSubAgent?: (\n\t\tkind: 'instructions' | 'guardrail',\n\t\ttext: string,\n\t) => Promise<string>;\n\tchildren: React.ReactNode;\n}\n\nexport const AgentBuilderProvider: React.FC<ProviderProps> = ({\n\tvalue,\n\tonChange,\n\tactiveStep: controlledStep,\n\tonStepChange,\n\tavailableTools,\n\tavailableSubAgents,\n\tavailableIntents,\n\tavailableModels,\n\tvalidation: validationOverride,\n\tapplicationType,\n\tcharLimits: charLimitsOverride,\n\tdisableStepNavigation = true,\n\tonCreateSubAgent,\n\tonFetchSubAgent,\n\tonUpdateSubAgent,\n\tonImproveSubAgent,\n\tchildren,\n}) => {\n\tconst [internalStep, setInternalStep] = useState<StepKey>('about');\n\tconst activeStep = controlledStep ?? internalStep;\n\tconst activeIndex = getStepIndex(activeStep);\n\n\t// Latest value, so closure-captured handlers (e.g. the `@` editor's mount-time\n\t// mention onSelect) append against the current lists, not a stale snapshot.\n\tconst valueRef = useRef(value);\n\tvalueRef.current = value;\n\n\t// Bumped when a mention field is edited from OUTSIDE its editor (removing a\n\t// tool from the side list, undo), forcing the mention editors to remount.\n\tconst [mentionResetKey, setMentionResetKey] = useState(0);\n\n\t// Each mention field registers an editor-backed insert fn + reports focus, so\n\t// side-panel adds drop a chip into the last-focused field at its cursor.\n\tconst mentionInsertersRef = useRef<\n\t\tPartial<Record<MentionFieldKey, MentionInsertFn>>\n\t>({});\n\tconst lastFocusedFieldRef = useRef<MentionFieldKey>('instructions');\n\tconst registerMentionField = useCallback(\n\t\t(fieldKey: MentionFieldKey, fn: MentionInsertFn | null) => {\n\t\t\tif (fn) {\n\t\t\t\tmentionInsertersRef.current[fieldKey] = fn;\n\t\t\t} else {\n\t\t\t\tdelete mentionInsertersRef.current[fieldKey];\n\t\t\t}\n\t\t},\n\t\t[],\n\t);\n\tconst notifyMentionFocus = useCallback((fieldKey: MentionFieldKey) => {\n\t\tlastFocusedFieldRef.current = fieldKey;\n\t}, []);\n\n\t// Step 3 registers its drawer opener here; the `@` picker's \"Create new\" calls it.\n\tconst subAgentCreatorRef = useRef<(() => void) | null>(null);\n\tconst registerSubAgentCreator = useCallback((fn: (() => void) | null) => {\n\t\tsubAgentCreatorRef.current = fn;\n\t}, []);\n\tconst requestCreateSubAgent = useCallback(() => {\n\t\tsubAgentCreatorRef.current?.();\n\t}, []);\n\tconst insertMention = useCallback<MentionInsertFn>((kind, id, label) => {\n\t\tconst inserters = mentionInsertersRef.current;\n\t\tconst target =\n\t\t\tinserters[lastFocusedFieldRef.current] ?? inserters.instructions;\n\t\ttarget?.(kind, id, label);\n\t}, []);\n\n\t// Undo state for the most recent removal.\n\tconst [undoToast, setUndoToast] = useState<UndoToastState | null>(null);\n\tconst undoSnapshotRef = useRef<Partial<AgentValue> | null>(null);\n\tconst undoIdRef = useRef(0);\n\n\tconst goToStep = useCallback(\n\t\t(step: StepKey) => {\n\t\t\tif (controlledStep === undefined) {\n\t\t\t\tsetInternalStep(step);\n\t\t\t}\n\t\t\tonStepChange?.(step);\n\t\t},\n\t\t[controlledStep, onStepChange],\n\t);\n\n\tconst goNext = useCallback(() => {\n\t\tconst next = STEP_KEYS[Math.min(activeIndex + 1, STEP_KEYS.length - 1)];\n\t\tgoToStep(next);\n\t}, [activeIndex, goToStep]);\n\n\tconst goPrev = useCallback(() => {\n\t\tconst prev = STEP_KEYS[Math.max(activeIndex - 1, 0)];\n\t\tgoToStep(prev);\n\t}, [activeIndex, goToStep]);\n\n\tconst patch = useCallback(\n\t\t(partial: Partial<AgentValue>) => onChange(partial),\n\t\t[onChange],\n\t);\n\n\tconst updateField = useCallback(\n\t\t<K extends keyof AgentValue>(key: K, val: AgentValue[K]) =>\n\t\t\tonChange({ [key]: val } as Partial<AgentValue>),\n\t\t[onChange],\n\t);\n\n\tconst addReference = useCallback(\n\t\t(kind: 'tool' | 'subagent', id: string) => {\n\t\t\tconst v = valueRef.current;\n\t\t\tif (kind === 'tool') {\n\t\t\t\tif (!v.tools.includes(id)) {\n\t\t\t\t\tonChange({ tools: [...v.tools, id] });\n\t\t\t\t}\n\t\t\t} else if (!v.subagents.includes(id)) {\n\t\t\t\tonChange({ subagents: [...v.subagents, id] });\n\t\t\t}\n\t\t},\n\t\t[onChange],\n\t);\n\n\tconst removeReference = useCallback(\n\t\t(kind: 'tool' | 'subagent', id: string) => {\n\t\t\tconst token =\n\t\t\t\tkind === 'tool'\n\t\t\t\t\t? (() => {\n\t\t\t\t\t\t\tconst tool = availableTools.find((t) => t.tool_id === id);\n\t\t\t\t\t\t\treturn tool ? `{{tool:${tool.function_key}}}` : null;\n\t\t\t\t\t })()\n\t\t\t\t\t: `{{subagent:${id}}}`;\n\t\t\tconst strip = (text: string) =>\n\t\t\t\ttoken ? text.split(token).join('') : text;\n\n\t\t\t// Snapshot the four fields a removal touches, for undo.\n\t\t\tundoSnapshotRef.current = {\n\t\t\t\ttools: value.tools,\n\t\t\t\tsubagents: value.subagents,\n\t\t\t\tinstructions: value.instructions,\n\t\t\t\tguardrail: value.guardrail,\n\t\t\t};\n\n\t\t\tconst next: Partial<AgentValue> = {\n\t\t\t\tinstructions: strip(value.instructions),\n\t\t\t\tguardrail: strip(value.guardrail ?? ''),\n\t\t\t\t...(kind === 'tool'\n\t\t\t\t\t? { tools: value.tools.filter((t) => t !== id) }\n\t\t\t\t\t: { subagents: value.subagents.filter((s) => s !== id) }),\n\t\t\t};\n\t\t\tonChange(next);\n\t\t\tsetMentionResetKey((k) => k + 1);\n\n\t\t\tconst label =\n\t\t\t\tkind === 'tool'\n\t\t\t\t\t? availableTools.find((t) => t.tool_id === id)?.display_name ?? 'Tool'\n\t\t\t\t\t: availableSubAgents.find((s) => s.id === id)?.name ?? 'Sub-agent';\n\t\t\tundoIdRef.current += 1;\n\t\t\tsetUndoToast({\n\t\t\t\tid: undoIdRef.current,\n\t\t\t\tmessage: `${kind === 'tool' ? 'Tool' : 'Sub-agent'} \"${label}\" removed`,\n\t\t\t});\n\t\t},\n\t\t[availableTools, availableSubAgents, value, onChange],\n\t);\n\n\tconst undoRemoval = useCallback(() => {\n\t\tif (undoSnapshotRef.current) {\n\t\t\tonChange(undoSnapshotRef.current);\n\t\t\tundoSnapshotRef.current = null;\n\t\t\tsetMentionResetKey((k) => k + 1);\n\t\t}\n\t\tsetUndoToast(null);\n\t}, [onChange]);\n\n\tconst dismissUndo = useCallback(() => setUndoToast(null), []);\n\n\t// Consumer overrides merged over the built-in defaults (name 60, rest 1000).\n\tconst charLimits = useMemo<AgentCharLimits>(\n\t\t() => ({ ...AGENT_CHAR_LIMITS, ...charLimitsOverride }),\n\t\t[charLimitsOverride],\n\t);\n\n\tconst validation: StepValidation = useMemo(\n\t\t() => ({ ...deriveValidation(value, charLimits), ...validationOverride }),\n\t\t[value, charLimits, validationOverride],\n\t);\n\n\tconst ctx = useMemo<AgentBuilderContextShape>(\n\t\t() => ({\n\t\t\tvalue,\n\t\t\tpatch,\n\t\t\tupdateField,\n\t\t\taddReference,\n\t\t\tremoveReference,\n\t\t\tmentionResetKey,\n\t\t\tinsertMention,\n\t\t\tregisterMentionField,\n\t\t\tnotifyMentionFocus,\n\t\t\tundoToast,\n\t\t\tundoRemoval,\n\t\t\tdismissUndo,\n\t\t\tactiveStep,\n\t\t\tactiveIndex,\n\t\t\tgoToStep,\n\t\t\tgoNext,\n\t\t\tgoPrev,\n\t\t\tisFirstStep: activeIndex === 0,\n\t\t\tisLastStep: activeIndex === STEP_KEYS.length - 1,\n\t\t\tvalidation,\n\t\t\tisActiveStepValid: validation[activeStep],\n\t\t\tavailableTools,\n\t\t\tavailableSubAgents,\n\t\t\tavailableIntents,\n\t\t\tavailableModels,\n\t\t\tapplicationType,\n\t\t\tcharLimits,\n\t\t\tdisableStepNavigation,\n\t\t\tonCreateSubAgent,\n\t\t\tregisterSubAgentCreator,\n\t\t\trequestCreateSubAgent,\n\t\t\tonFetchSubAgent,\n\t\t\tonUpdateSubAgent,\n\t\t\tonImproveSubAgent,\n\t\t}),\n\t\t[\n\t\t\tvalue,\n\t\t\tpatch,\n\t\t\tupdateField,\n\t\t\taddReference,\n\t\t\tremoveReference,\n\t\t\tmentionResetKey,\n\t\t\tinsertMention,\n\t\t\tregisterMentionField,\n\t\t\tnotifyMentionFocus,\n\t\t\tundoToast,\n\t\t\tundoRemoval,\n\t\t\tdismissUndo,\n\t\t\tactiveStep,\n\t\t\tactiveIndex,\n\t\t\tgoToStep,\n\t\t\tgoNext,\n\t\t\tgoPrev,\n\t\t\tvalidation,\n\t\t\tavailableTools,\n\t\t\tavailableSubAgents,\n\t\t\tavailableIntents,\n\t\t\tavailableModels,\n\t\t\tapplicationType,\n\t\t\tcharLimits,\n\t\t\tdisableStepNavigation,\n\t\t\tonCreateSubAgent,\n\t\t\tregisterSubAgentCreator,\n\t\t\trequestCreateSubAgent,\n\t\t\tonFetchSubAgent,\n\t\t\tonUpdateSubAgent,\n\t\t\tonImproveSubAgent,\n\t\t],\n\t);\n\n\treturn (\n\t\t<AgentBuilderContext.Provider value={ctx}>\n\t\t\t{children}\n\t\t</AgentBuilderContext.Provider>\n\t);\n};\n"],"names":["AgentBuilderContext","React","useAgentBuilderContext","ctx","useContext","deriveValidation","value","limits","triggerValid","AgentBuilderProvider","onChange","controlledStep","onStepChange","availableTools","availableSubAgents","availableIntents","availableModels","validationOverride","applicationType","charLimitsOverride","disableStepNavigation","onCreateSubAgent","onFetchSubAgent","onUpdateSubAgent","onImproveSubAgent","children","internalStep","setInternalStep","useState","activeStep","activeIndex","getStepIndex","valueRef","useRef","mentionResetKey","setMentionResetKey","mentionInsertersRef","lastFocusedFieldRef","registerMentionField","useCallback","fieldKey","fn","notifyMentionFocus","subAgentCreatorRef","registerSubAgentCreator","requestCreateSubAgent","insertMention","kind","id","label","inserters","undoToast","setUndoToast","undoSnapshotRef","undoIdRef","goToStep","step","goNext","next","STEP_KEYS","goPrev","prev","patch","partial","updateField","key","val","addReference","v","removeReference","token","tool","t","strip","text","s","k","undoRemoval","dismissUndo","charLimits","useMemo","AGENT_CHAR_LIMITS","validation"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),o=require("../components/AiTextArea.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../AgentBuilder.styled.js"),o=require("../components/AiTextArea.js"),l=require("../components/StepSectionHeader.js"),c=require("../constants/steps.js"),d=require("../context/AgentBuilderContext.js"),u=require("../../input/Input.js"),a=c.STEP_DEFINITIONS[0],p=()=>{const{value:n,updateField:i,charLimits:r}=d.useAgentBuilderContext();return e.jsxs("div",{className:"bik-agent-step bik-agent-step--about",children:[e.jsx(l.StepSectionHeader,{title:a.title,helper:a.helper}),e.jsxs(s.SectionBodyWrap,{children:[e.jsx("div",{children:e.jsx(u.Input,{"data-test":"agent-name",labelText:"Agent name",labelTextBold:!0,placeholder:"Enter agent name",value:n.name,maxCharLimit:r.name,maxCharLimitPosition:"TOP",maxCharStyle:{fontSize:12,lineHeight:"16px"},onChangeText:t=>i("name",t)})}),e.jsx(o.AiTextArea,{"data-test":"agent-description",label:"What it does",value:n.description,onChange:t=>i("description",t),maxLength:r.description,placeholder:"Enter description",minHeight:"200px"})]})]})};exports.Step1About=p;
|
|
2
2
|
//# sourceMappingURL=Step1About.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Step1About.js","sources":["../../../../../src/components/agent-builder/steps/Step1About.tsx"],"sourcesContent":["import React from 'react';\nimport { Input } from '@src/components/input';\nimport { AiTextArea } from '../components/AiTextArea';\nimport { StepSectionHeader } from '../components/StepSectionHeader';\nimport { STEP_DEFINITIONS } from '../constants/steps';\nimport { useAgentBuilderContext } from '../context/AgentBuilderContext';\n\nconst STEP = STEP_DEFINITIONS[0];\n\nexport const Step1About: React.FC = () => {\n\tconst { value, updateField, charLimits } = useAgentBuilderContext();\n\n\treturn (\n\t\t<div className=\"bik-agent-step bik-agent-step--about\">\n\t\t\t<StepSectionHeader title={STEP.title} helper={STEP.helper} />\n\n\t\t\t<div
|
|
1
|
+
{"version":3,"file":"Step1About.js","sources":["../../../../../src/components/agent-builder/steps/Step1About.tsx"],"sourcesContent":["import React from 'react';\nimport { Input } from '@src/components/input';\nimport { SectionBodyWrap } from '../AgentBuilder.styled';\nimport { AiTextArea } from '../components/AiTextArea';\nimport { StepSectionHeader } from '../components/StepSectionHeader';\nimport { STEP_DEFINITIONS } from '../constants/steps';\nimport { useAgentBuilderContext } from '../context/AgentBuilderContext';\n\nconst STEP = STEP_DEFINITIONS[0];\n\nexport const Step1About: React.FC = () => {\n\tconst { value, updateField, charLimits } = useAgentBuilderContext();\n\n\treturn (\n\t\t<div className=\"bik-agent-step bik-agent-step--about\">\n\t\t\t<StepSectionHeader title={STEP.title} helper={STEP.helper} />\n\n\t\t\t<SectionBodyWrap>\n\t\t\t\t<div>\n\t\t\t\t\t<Input\n\t\t\t\t\t\tdata-test=\"agent-name\"\n\t\t\t\t\t\tlabelText=\"Agent name\"\n\t\t\t\t\t\tlabelTextBold\n\t\t\t\t\t\tplaceholder=\"Enter agent name\"\n\t\t\t\t\t\tvalue={value.name}\n\t\t\t\t\t\tmaxCharLimit={charLimits.name}\n\t\t\t\t\t\tmaxCharLimitPosition=\"TOP\"\n\t\t\t\t\t\tmaxCharStyle={{ fontSize: 12, lineHeight: '16px' }}\n\t\t\t\t\t\tonChangeText={(text) => updateField('name', text)}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\n\t\t\t\t<AiTextArea\n\t\t\t\t\tdata-test=\"agent-description\"\n\t\t\t\t\tlabel=\"What it does\"\n\t\t\t\t\tvalue={value.description}\n\t\t\t\t\tonChange={(text) => updateField('description', text)}\n\t\t\t\t\tmaxLength={charLimits.description}\n\t\t\t\t\tplaceholder=\"Enter description\"\n\t\t\t\t\tminHeight=\"200px\"\n\t\t\t\t/>\n\t\t\t</SectionBodyWrap>\n\t\t</div>\n\t);\n};\n"],"names":["STEP","STEP_DEFINITIONS","Step1About","value","updateField","charLimits","useAgentBuilderContext","jsxs","jsx","StepSectionHeader","SectionBodyWrap","Input","text","AiTextArea"],"mappings":"yWAQMA,EAAOC,EAAAA,iBAAiB,CAAC,EAElBC,EAAuB,IAAM,CACzC,KAAM,CAAE,MAAAC,EAAO,YAAAC,EAAa,WAAAC,CAAA,EAAeC,EAAAA,uBAAA,EAE3C,OACCC,EAAAA,KAAC,MAAA,CAAI,UAAU,uCACd,SAAA,CAAAC,MAACC,EAAAA,mBAAkB,MAAOT,EAAK,MAAO,OAAQA,EAAK,OAAQ,SAE1DU,EAAAA,gBAAA,CACA,SAAA,CAAAF,MAAC,MAAA,CACA,SAAAA,EAAAA,IAACG,EAAAA,MAAA,CACA,YAAU,aACV,UAAU,aACV,cAAa,GACb,YAAY,mBACZ,MAAOR,EAAM,KACb,aAAcE,EAAW,KACzB,qBAAqB,MACrB,aAAc,CAAE,SAAU,GAAI,WAAY,MAAA,EAC1C,aAAeO,GAASR,EAAY,OAAQQ,CAAI,CAAA,CAAA,EAElD,EAEAJ,EAAAA,IAACK,EAAAA,WAAA,CACA,YAAU,oBACV,MAAM,eACN,MAAOV,EAAM,YACb,SAAWS,GAASR,EAAY,cAAeQ,CAAI,EACnD,UAAWP,EAAW,YACtB,YAAY,oBACZ,UAAU,OAAA,CAAA,CACX,CAAA,CACD,CAAA,EACD,CAEF"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),S=require("../../../assets/icons/cross.svg.js"),y=require("../../../assets/icons/plus.svg.js"),j=require("../../dropdown/DropdownPopover/index.js"),h=require("../../radioButton/RadioButton.js"),r=require("../../TypographyStyle.js"),o=require("../../../constants/Theme.js"),i=require("../AgentBuilder.styled.js"),O=require("../components/AiTextArea.js"),f=require("../components/StepSectionHeader.js"),R=require("../constants/steps.js"),v=require("../context/AgentBuilderContext.js"),b=require("../../dropdown/utils.js"),m=R.STEP_DEFINITIONS[1],T=()=>{const{value:p,patch:c,availableIntents:l,charLimits:g}=v.useAgentBuilderContext(),{trigger:n}=p,a=t=>c({trigger:{...n,mode:t}}),x=t=>{n.intents.includes(t)||c({trigger:{...n,intents:[...n.intents,t]}})},C=t=>c({trigger:{...n,intents:n.intents.filter(s=>s!==t)}}),d=t=>l.find(s=>s.value===t)?.label??t,u=l.filter(t=>!n.intents.includes(t.value)).map(t=>({label:t.label,value:t.value}));return e.jsxs("div",{children:[e.jsx(f.StepSectionHeader,{title:m.title,helper:m.helper}),e.jsxs(i.SectionBodyWrap,{children:[e.jsxs(i.CardRow,{children:[e.jsxs(i.RadioCard,{"data-test":"trigger-mode-manifest",selected:n.mode==="manifest_intent",onClick:()=>a("manifest_intent"),children:[e.jsx(h.RadioButton,{isActive:n.mode==="manifest_intent",onValueChange:()=>a("manifest_intent"),skipSelectingOff:!0,activeColor:o.COLORS.content.brand}),e.jsxs(i.RadioCardText,{children:[e.jsx(r.TitleSmall,{color:o.COLORS.content.primary,children:"Manifest intent"}),e.jsx(r.BodyCaption,{color:o.COLORS.content.secondary,children:"Manifest's AI classifier routes conversations automatically — no keywords needed."})]})]}),e.jsxs(i.RadioCard,{"data-test":"trigger-mode-custom",selected:n.mode==="custom_intent",onClick:()=>a("custom_intent"),children:[e.jsx(h.RadioButton,{isActive:n.mode==="custom_intent",onValueChange:()=>a("custom_intent"),skipSelectingOff:!0,activeColor:o.COLORS.content.brand}),e.jsxs(i.RadioCardText,{children:[e.jsx(r.TitleSmall,{color:o.COLORS.content.primary,children:"Custom intent"}),e.jsx(r.BodyCaption,{color:o.COLORS.content.secondary,children:"Define your own trigger — use exact phrases or describe the customer's intent."})]})]})]}),n.mode==="manifest_intent"?e.jsxs(i.FieldBlock,{children:[e.jsx(r.TitleSmall,{color:o.COLORS.content.primary,children:"If customer talks about"}),e.jsxs(i.ChipWrap,{children:[n.intents.map(t=>e.jsxs(i.IntentChip,{"data-test":`intent-chip-${t}`,children:[e.jsx(r.BodySecondary,{color:o.COLORS.content.primary,children:d(t)}),e.jsx(i.ChipCloseButton,{onClick:()=>C(t),"aria-label":`Remove ${d(t)}`,children:e.jsx(S.default,{width:14,height:14,color:o.COLORS.content.secondary})})]},t)),u.length>0&&e.jsx(j.DropdownPopover,{"data-test":"intent-add-dropdown",isSearchable:!0,width:"200px",placement:"bottom-start",options:u,onSelect:t=>{const s=b.unwrapDropdownValue(t);s&&x(s)},children:e.jsxs(i.AddChipButton,{"data-test":"intent-add-button",type:"button",children:[e.jsx(y.default,{width:16,height:16,color:o.COLORS.content.secondary}),e.jsx(r.BodySecondary,{color:o.COLORS.content.secondary,children:"Intent"})]})})]}),e.jsx(r.BodyCaption,{color:o.COLORS.content.secondary,children:"This agent takes over from your main assistant when this intent is detected. The changeover is automatic when you go live."})]}):e.jsx(O.AiTextArea,{"data-test":"custom-intent",label:"Describe the trigger",value:n.custom_intent??"",onChange:t=>c({trigger:{...n,custom_intent:t}}),maxLength:g.custom_intent,placeholder:"e.g. The customer wants to cancel an order they placed.",minHeight:"120px"})]})]})};exports.Step2WhenItStepsIn=T;
|
|
2
2
|
//# sourceMappingURL=Step2WhenItStepsIn.js.map
|