@bikdotai/bik-component-library 0.0.874-beta.0 → 0.0.875-beta.0

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

@@ -1 +1 @@
-{"version":3,"file":"ConfigToolPanel.js","sources":["../../../../../src/components/agent-builder/components/ConfigToolPanel.tsx"],"sourcesContent":["import CrossIcon from '@src/assets/icons/cross.svg';\nimport React, { useRef, useState } from 'react';\nimport styled from 'styled-components';\nimport { Input } from '@src/components/input';\nimport { SideModal } from '@src/components/side-modal';\nimport { Switch } from '@src/components/switch';\nimport { Tag } from '@src/components/tag';\nimport { BodyCaption, TitleSmall } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport type { VariableListInterfaceV3 } from '../../variable-picker-v3/model';\nimport {\n\tConfigToolConfig,\n\tConfigToolKey,\n\tParamField,\n\tParamsBlob,\n} from '../AgentBuilder.model';\nimport { FieldBlock } from '../AgentBuilder.styled';\nimport type { AgentCharLimits } from '../constants/charLimits';\nimport { AGENT_CHAR_LIMITS } from '../constants/charLimits';\nimport {\n\tDRAWER_BODY_STYLE,\n\tDRAWER_HEADER_STYLE,\n\tDrawerHeaderText,\n} from './DrawerHeaderText';\nimport { ToolInstructionsField } from './ToolInstructionsField';\nimport { VariableTriggerArea } from './VariableTriggerArea';\n\n/** Header copy per shared-drawer tool. */\nconst TOOL_COPY: Record<ConfigToolKey, { title: string; subtitle: string }> = {\n\tsend_email: {\n\t\ttitle: 'Send email',\n\t\tsubtitle:\n\t\t\t\"Notify someone by email when this agent can't continue. You pick the recipient, the AI drafts the message.\",\n\t},\n\tsend_slack_message: {\n\t\ttitle: 'Send Slack message',\n\t\tsubtitle:\n\t\t\t'Post a message to a Slack channel. You pick the channel, the AI composes the message from the conversation.',\n\t},\n\tgoogle_sheet_get_data: {\n\t\ttitle: 'Get data from sheet',\n\t\tsubtitle:\n\t\t\t'Look up rows in a Google Sheet. You pick the sheet and describe its columns, the AI writes the query it needs.',\n\t},\n\tgoogle_sheet_add_row: {\n\t\ttitle: 'Add row to sheet',\n\t\tsubtitle:\n\t\t\t'Append a row to a Google Sheet. You pick the sheet and its columns, the AI fills them in from the conversation.',\n\t},\n};\n\ninterface ConfigToolPanelProps {\n\t/** Which tool this drawer configures (drives copy + persistence). */\n\ttoolKey: ConfigToolKey;\n\t/**\n\t * The backend template (`list-catalog` → params) for `toolKey`. The form is\n\t * DYNAMIC: exactly these fields render, in this order, each by its\n\t * `component` kind (KeywordInput | MultilineInput | Switch | fallback input).\n\t */\n\ttemplate: ParamsBlob;\n\tonClose: () => void;\n\t/** Persist the filled template. A pending promise shows the Save loader. */\n\tonSave: (config: ConfigToolConfig) => void | Promise<void>;\n\t/** Seed values when editing an existing tool. */\n\tinitial?: ConfigToolConfig;\n\t/** Optional \"Improve with AI\" for multiline fields. Omit to hide it. */\n\tonImprove?: (text: string) => Promise<string>;\n\tcharLimits?: AgentCharLimits;\n\t/**\n\t * Variable catalog for the `@` trigger. When non-empty, `@` in the email\n\t * tool's Subject / Send To / Reply To / CC opens the variable picker\n\t * directly, and Message Instructions upgrades to the variables-only mention\n\t * editor. Absent → the drawer behaves exactly as before.\n\t */\n\tvariablesData?: VariableListInterfaceV3[];\n\t/** SideModal stacking order — raise it when opened over another drawer. */\n\tzIndex?: number;\n}\n\ninterface EmailChipsFieldProps {\n\tchips: string[];\n\tonChange: (next: string[]) => void;\n\tplaceholder: string;\n\tnativeID?: string;\n\t/** Optional helper caption shown between the input and the chips. */\n\thint?: React.ReactNode;\n\t/**\n\t * Variable catalog for the `@` trigger. A picked variable is interpolated\n\t * into the entry TEXT at the caret (so values can mix text and variables,\n\t * e.g. `ops-{{variable:store_name}}@acme.com`) — it becomes a chip on\n\t * Enter / comma like any typed value.\n\t */\n\tvariablesData?: VariableListInterfaceV3[];\n}\n\n/**\n * Email entry field: type an address and press Enter / comma (or blur) to add\n * it. Added emails render as removable chips BELOW the input — not inside it.\n * Backspace on an empty input removes the last chip.\n */\nconst EmailChipsField: React.FC<EmailChipsFieldProps> = ({\n\tchips,\n\tonChange,\n\tplaceholder,\n\tnativeID,\n\thint,\n\tvariablesData,\n}) => {\n\tconst [buffer, setBuffer] = useState('');\n\tconst [entryFocused, setEntryFocused] = useState(false);\n\tconst wrapRef = useRef<HTMLDivElement>(null);\n\tconst inputRef = useRef<HTMLInputElement>(null);\n\n\tconst commit = () => {\n\t\tconst parts = buffer\n\t\t\t.split(',')\n\t\t\t.map((s) => s.trim())\n\t\t\t.filter(Boolean);\n\t\tif (parts.length) {\n\t\t\tonChange([...chips, ...parts.filter((p) => !chips.includes(p))]);\n\t\t}\n\t\tsetBuffer('');\n\t};\n\t// The blur handler defers via setTimeout — read the LATEST commit (with the\n\t// current buffer), not the one captured when the blur fired.\n\tconst commitRef = useRef(commit);\n\tcommitRef.current = commit;\n\t// While the variable panel is open, focus bounces through it (search box,\n\t// rows) — blur must not commit the half-composed entry.\n\tconst panelOpenRef = useRef(false);\n\t// A variable was just picked — the panel-close commit below must not fire\n\t// (onInsert refocuses the entry, so its eventual blur commits instead).\n\tconst insertedRef = useRef(false);\n\n\treturn (\n\t\t<ChipsFieldWrap ref={wrapRef}>\n\t\t\t<VariableTriggerArea\n\t\t\t\taddDataButton\n\t\t\t\tvariablesData={variablesData}\n\t\t\t\tonOpenChange={(open) => {\n\t\t\t\t\tpanelOpenRef.current = open;\n\t\t\t\t\tif (open) {\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\t\t\t\t\t// Panel closed (Escape / outside click / pick). If the entry's\n\t\t\t\t\t// blur-commit was skipped while the panel was open and focus is\n\t\t\t\t\t// not coming back, the half-typed entry would be silently lost\n\t\t\t\t\t// on save — commit it now.\n\t\t\t\t\tsetTimeout(() => {\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t!insertedRef.current &&\n\t\t\t\t\t\t\t!wrapRef.current?.contains(document.activeElement)\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\tcommitRef.current();\n\t\t\t\t\t\t}\n\t\t\t\t\t\tinsertedRef.current = false;\n\t\t\t\t\t}, 0);\n\t\t\t\t}}\n\t\t\t\tonInsert={(token, caret) => {\n\t\t\t\t\tinsertedRef.current = true;\n\t\t\t\t\tconst at = caret ?? buffer.length;\n\t\t\t\t\tsetBuffer(`${buffer.slice(0, at)}${token}${buffer.slice(at)}`);\n\t\t\t\t\t// Put the caret after the inserted token so typing continues\n\t\t\t\t\t// naturally (e.g. `{{variable:store_name}}|@acme.com`).\n\t\t\t\t\trequestAnimationFrame(() => {\n\t\t\t\t\t\tconst el = inputRef.current;\n\t\t\t\t\t\tel?.focus();\n\t\t\t\t\t\tel?.setSelectionRange(at + token.length, at + token.length);\n\t\t\t\t\t});\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<EmailInputBox\n\t\t\t\t\tid={nativeID}\n\t\t\t\t\tref={inputRef}\n\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t// Focused + empty → the @ hint (only when a catalog makes @ do\n\t\t\t\t\t// anything); otherwise the field's own text.\n\t\t\t\t\tplaceholder={\n\t\t\t\t\t\tentryFocused && buffer === '' && (variablesData?.length ?? 0) > 0\n\t\t\t\t\t\t\t? 'Enter text, type @ to add variable'\n\t\t\t\t\t\t\t: placeholder\n\t\t\t\t\t}\n\t\t\t\t\tvalue={buffer}\n\t\t\t\t\tonChange={(e) => setBuffer(e.target.value)}\n\t\t\t\t\tonFocus={() => setEntryFocused(true)}\n\t\t\t\t\tonBlur={() => {\n\t\t\t\t\t\tsetEntryFocused(false);\n\t\t\t\t\t\t// Focus moving into the variable panel / pill is not \"leaving\n\t\t\t\t\t\t// the field\" — committing then would chip a half-composed value.\n\t\t\t\t\t\tsetTimeout(() => {\n\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t!panelOpenRef.current &&\n\t\t\t\t\t\t\t\t!wrapRef.current?.contains(document.activeElement)\n\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\tcommitRef.current();\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}, 0);\n\t\t\t\t\t}}\n\t\t\t\t\tonKeyDown={(e) => {\n\t\t\t\t\t\tif (e.key === 'Enter' || e.key === ',') {\n\t\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\t\tcommit();\n\t\t\t\t\t\t} else if (\n\t\t\t\t\t\t\te.key === 'Backspace' &&\n\t\t\t\t\t\t\tbuffer === '' &&\n\t\t\t\t\t\t\tchips.length > 0\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\tonChange(chips.slice(0, -1));\n\t\t\t\t\t\t}\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t</VariableTriggerArea>\n\t\t\t{hint}\n\t\t\t{chips.length > 0 && (\n\t\t\t\t<ChipRow>\n\t\t\t\t\t{chips.map((email, i) => (\n\t\t\t\t\t\t<Tag\n\t\t\t\t\t\t\tkey={`${email}-${i}`}\n\t\t\t\t\t\t\t// Variable tokens display as the short {{name}} (values can mix\n\t\t\t\t\t\t\t// text and tokens); the stored value keeps {{variable:<name>}}.\n\t\t\t\t\t\t\ttagText={email.replace(/\\{\\{variable:([^}]+)\\}\\}/g, '{{$1}}')}\n\t\t\t\t\t\t\ttheme=\"light\"\n\t\t\t\t\t\t\ttype=\"neutral\"\n\t\t\t\t\t\t\tvariant=\"regular\"\n\t\t\t\t\t\t\tTrailingIcon={CrossIcon}\n\t\t\t\t\t\t\tonTrailingIconClicked={() =>\n\t\t\t\t\t\t\t\tonChange(chips.filter((_, idx) => idx !== i))\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</ChipRow>\n\t\t\t)}\n\t\t</ChipsFieldWrap>\n\t);\n};\n\n/** Field values keyed by param key (the editable part of a {@link ParamsBlob}). */\ntype ParamValues = Record<string, string | boolean | number | object>;\n\nconst seedValues = (\n\ttemplate: ParamsBlob,\n\tinitial?: ConfigToolConfig,\n): ParamValues => {\n\tconst values: ParamValues = {};\n\tObject.keys(template).forEach((key) => {\n\t\tvalues[key] = initial?.params[key]?.value ?? template[key].value;\n\t});\n\treturn values;\n};\n\n/** Chips ↔ the string value KeywordInput fields carry (comma-separated). */\nconst toChips = (value: unknown): string[] =>\n\tString(value ?? '')\n\t\t.split(',')\n\t\t.map((s) => s.trim())\n\t\t.filter(Boolean);\n\n/**\n * Shared right-side drawer for the params-driven configurable tools (email /\n * Slack). Fully backend-driven: it renders the template fields by their\n * `component` kind and returns the same blob with values filled in. KeywordInput\n * renders as multi-value email chips only for `send_email`; every other tool\n * gets a plain single-line input. Mount it fresh per open (key it) so `initial`\n * seeds the state. Built on the shared `SideModal` shell.\n */\nexport const ConfigToolPanel: React.FC<ConfigToolPanelProps> = ({\n\ttoolKey,\n\ttemplate,\n\tonClose,\n\tonSave,\n\tinitial,\n\tonImprove,\n\tcharLimits = AGENT_CHAR_LIMITS,\n\tvariablesData,\n\tzIndex,\n}) => {\n\tconst [values, setValues] = useState<ParamValues>(() =>\n\t\tseedValues(template, initial),\n\t);\n\tconst [saving, setSaving] = useState(false);\n\n\tconst fields = Object.values(template);\n\tconst isEmail = toolKey === 'send_email';\n\tconst setValue = (key: string, value: string | boolean | number | object) =>\n\t\tsetValues((prev) => ({ ...prev, [key]: value }));\n\n\tconst canSave = fields.every((f) => {\n\t\tif (f.required && String(values[f.key] ?? '').trim() === '') {\n\t\t\treturn false;\n\t\t}\n\t\t// MultilineInput renders the soft-limit editor (a paste may exceed the\n\t\t// cap, rendered grey) — gate the save so over-limit text can't persist.\n\t\tif (\n\t\t\tf.component === 'MultilineInput' &&\n\t\t\tString(values[f.key] ?? '').length > charLimits.instructions\n\t\t) {\n\t\t\treturn false;\n\t\t}\n\t\treturn true;\n\t});\n\n\tconst handleSave = async () => {\n\t\tif (!canSave || saving) {\n\t\t\treturn;\n\t\t}\n\t\tconst params: ParamsBlob = {};\n\t\tfields.forEach((f) => {\n\t\t\t// Save the FULL descriptor with only `value` changed — the backend\n\t\t\t// infers each field's type from `component` and reads `required`.\n\t\t\tparams[f.key] = { ...f, value: values[f.key] };\n\t\t});\n\t\tconst config: ConfigToolConfig = {\n\t\t\tid: initial?.id ?? `${toolKey}_${Date.now().toString(36)}`,\n\t\t\ttool_key: toolKey,\n\t\t\tparams,\n\t\t};\n\t\tconst result = onSave(config);\n\t\tif (result && typeof (result as Promise<void>).then === 'function') {\n\t\t\tsetSaving(true);\n\t\t\ttry {\n\t\t\t\tawait result;\n\t\t\t} finally {\n\t\t\t\tsetSaving(false);\n\t\t\t}\n\t\t}\n\t};\n\n\tconst renderField = (field: ParamField) => {\n\t\tconst testId = `config-tool-${field.key.toLowerCase()}`;\n\t\tswitch (field.component) {\n\t\t\t// Multi-value email chips — only for the email tool. Slack's KeywordInput\n\t\t\t// (channelId) falls through to the plain input below.\n\t\t\tcase 'KeywordInput':\n\t\t\t\tif (!isEmail) {\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t\treturn (\n\t\t\t\t\t<FieldBlock key={field.key}>\n\t\t\t\t\t\t<TitleSmall color={COLORS.content.primary}>\n\t\t\t\t\t\t\t{field.title}\n\t\t\t\t\t\t</TitleSmall>\n\t\t\t\t\t\t{/* `@` at a word boundary (or the \"+ Add data\" pill) interpolates\n\t\t\t\t\t\t    a variable into the entry TEXT at the caret — mixed values like\n\t\t\t\t\t\t    ops-{{variable:store_name}}@acme.com chip on Enter / comma. */}\n\t\t\t\t\t\t<EmailChipsField\n\t\t\t\t\t\t\tnativeID={testId}\n\t\t\t\t\t\t\tplaceholder={field.hint ?? ''}\n\t\t\t\t\t\t\tchips={toChips(values[field.key])}\n\t\t\t\t\t\t\tonChange={(chips) => setValue(field.key, chips.join(','))}\n\t\t\t\t\t\t\tvariablesData={variablesData}\n\t\t\t\t\t\t\thint={\n\t\t\t\t\t\t\t\t<BodyCaption color={COLORS.content.secondary}>\n\t\t\t\t\t\t\t\t\tPress Enter or comma to add multiple emails\n\t\t\t\t\t\t\t\t</BodyCaption>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</FieldBlock>\n\t\t\t\t);\n\t\t\tcase 'MultilineInput':\n\t\t\t\treturn (\n\t\t\t\t\t<ToolInstructionsField\n\t\t\t\t\t\tkey={field.key}\n\t\t\t\t\t\tdata-test={testId}\n\t\t\t\t\t\tlabel={field.title}\n\t\t\t\t\t\tvalue={String(values[field.key] ?? '')}\n\t\t\t\t\t\tonChange={(text) => setValue(field.key, text)}\n\t\t\t\t\t\tmaxLength={charLimits.instructions}\n\t\t\t\t\t\tplaceholder={field.hint ?? ''}\n\t\t\t\t\t\tonImprove={onImprove}\n\t\t\t\t\t\tvariablesData={variablesData}\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\tcase 'Switch':\n\t\t\t\treturn (\n\t\t\t\t\t<SwitchRow key={field.key}>\n\t\t\t\t\t\t<SwitchText>\n\t\t\t\t\t\t\t<TitleSmall color={COLORS.content.primary}>\n\t\t\t\t\t\t\t\t{field.title}\n\t\t\t\t\t\t\t</TitleSmall>\n\t\t\t\t\t\t\t{field.hint && (\n\t\t\t\t\t\t\t\t<BodyCaption color={COLORS.content.secondary}>\n\t\t\t\t\t\t\t\t\t{field.hint}\n\t\t\t\t\t\t\t\t</BodyCaption>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</SwitchText>\n\t\t\t\t\t\t<Switch\n\t\t\t\t\t\t\tdata-test={testId}\n\t\t\t\t\t\t\tvalue={Boolean(values[field.key])}\n\t\t\t\t\t\t\tonValueChange={async (next) => setValue(field.key, next)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</SwitchRow>\n\t\t\t\t);\n\t\t\tdefault:\n\t\t\t\tbreak;\n\t\t}\n\t\tconst plainInput = (\n\t\t\t<Input\n\t\t\t\tdata-test={testId}\n\t\t\t\tvariant=\"small\"\n\t\t\t\tlabelText={field.title}\n\t\t\t\tlabelTextBold\n\t\t\t\tplaceholder={field.hint ?? ''}\n\t\t\t\tvalue={String(values[field.key] ?? '')}\n\t\t\t\tonChangeText={(text) => setValue(field.key, text)}\n\t\t\t/>\n\t\t);\n\t\t// `@` variables only in the email tool's free-text fields (Subject) —\n\t\t// a Slack channel id can't hold a variable.\n\t\tif (!isEmail) {\n\t\t\treturn <React.Fragment key={field.key}>{plainInput}</React.Fragment>;\n\t\t}\n\t\treturn (\n\t\t\t<VariableTriggerArea\n\t\t\t\taddDataButton\n\t\t\t\tkey={field.key}\n\t\t\t\tvariablesData={variablesData}\n\t\t\t\tonInsert={(token, caret) => {\n\t\t\t\t\tconst current = String(values[field.key] ?? '');\n\t\t\t\t\tconst at = caret ?? current.length;\n\t\t\t\t\tsetValue(\n\t\t\t\t\t\tfield.key,\n\t\t\t\t\t\t`${current.slice(0, at)}${token}${current.slice(at)}`,\n\t\t\t\t\t);\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{plainInput}\n\t\t\t</VariableTriggerArea>\n\t\t);\n\t};\n\n\tconst copy = TOOL_COPY[toolKey];\n\n\treturn (\n\t\t<SideModal\n\t\t\theader={copy.title}\n\t\t\tcloseOnEscapeKey={false}\n\t\t\tzIndex={zIndex}\n\t\t\theaderCustomComponent={\n\t\t\t\t<DrawerHeaderText title={copy.title} subtitle={copy.subtitle} />\n\t\t\t}\n\t\t\thideCrossButton={false}\n\t\t\twidth=\"431px\"\n\t\t\theaderStyle={DRAWER_HEADER_STYLE}\n\t\t\tbodyStyle={DRAWER_BODY_STYLE}\n\t\t\tonClose={onClose}\n\t\t\tsaveButtonProps={{\n\t\t\t\t'data-test': 'config-tool-save',\n\t\t\t\tbuttonText: 'Save',\n\t\t\t\tbuttonType: 'primary',\n\t\t\t\tsize: 'small',\n\t\t\t\tdisabled: !canSave,\n\t\t\t\tisLoading: saving,\n\t\t\t\tonClick: handleSave,\n\t\t\t}}\n\t\t\tcancelButtonProps={{\n\t\t\t\t'data-test': 'config-tool-cancel',\n\t\t\t\tbuttonText: 'Cancel',\n\t\t\t\tbuttonType: 'tertiaryGray',\n\t\t\t\tsize: 'small',\n\t\t\t\tonClick: onClose,\n\t\t\t}}\n\t\t>\n\t\t\t{fields.map(renderField)}\n\t\t</SideModal>\n\t);\n};\n\nconst ChipsFieldWrap = styled.div`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 8px;\n`;\n\nconst EmailInputBox = styled.input`\n\twidth: 100%;\n\tmin-width: 0;\n\tbox-sizing: border-box;\n\theight: 32px;\n\tpadding: 0 8px;\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 4px;\n\tfont-family: 'Inter', sans-serif;\n\tfont-size: 14px;\n\tcolor: ${COLORS.content.primary};\n\tbackground: ${COLORS.surface.standard};\n\toutline: none;\n\n\t&::placeholder {\n\t\tcolor: ${COLORS.content.secondary};\n\t}\n\n\t&:focus {\n\t\tborder-color: ${COLORS.stroke.brand};\n\t}\n`;\n\nconst ChipRow = styled.div`\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\tgap: 6px;\n`;\n\nconst SwitchRow = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: space-between;\n\tgap: 12px;\n`;\n\nconst SwitchText = styled.div`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 4px;\n\tmin-width: 0;\n`;\n"],"names":["TOOL_COPY","EmailChipsField","chips","onChange","placeholder","nativeID","hint","variablesData","buffer","setBuffer","useState","entryFocused","setEntryFocused","wrapRef","useRef","inputRef","commit","parts","s","p","commitRef","panelOpenRef","insertedRef","jsxs","ChipsFieldWrap","jsx","VariableTriggerArea","open","token","caret","at","el","EmailInputBox","e","ChipRow","email","i","Tag","CrossIcon","_","idx","seedValues","template","initial","values","key","toChips","value","ConfigToolPanel","toolKey","onClose","onSave","onImprove","charLimits","AGENT_CHAR_LIMITS","zIndex","setValues","saving","setSaving","fields","isEmail","setValue","prev","canSave","f","handleSave","params","config","result","renderField","field","testId","FieldBlock","TitleSmall","COLORS","BodyCaption","ToolInstructionsField","text","SwitchRow","SwitchText","Switch","next","plainInput","Input","current","React","copy","SideModal","DrawerHeaderText","DRAWER_HEADER_STYLE","DRAWER_BODY_STYLE","styled"],"mappings":"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"}
+{"version":3,"file":"ConfigToolPanel.js","sources":["../../../../../src/components/agent-builder/components/ConfigToolPanel.tsx"],"sourcesContent":["import CrossIcon from '@src/assets/icons/cross.svg';\nimport React, { useRef, useState } from 'react';\nimport styled from 'styled-components';\nimport { Input } from '@src/components/input';\nimport { SideModal } from '@src/components/side-modal';\nimport { Switch } from '@src/components/switch';\nimport { Tag } from '@src/components/tag';\nimport { BodyCaption, TitleSmall } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport type { VariableListInterfaceV3 } from '../../variable-picker-v3/model';\nimport {\n\tConfigToolConfig,\n\tConfigToolKey,\n\tParamField,\n\tParamsBlob,\n} from '../AgentBuilder.model';\nimport { FieldBlock } from '../AgentBuilder.styled';\nimport type { AgentCharLimits } from '../constants/charLimits';\nimport { AGENT_CHAR_LIMITS } from '../constants/charLimits';\nimport {\n\tDRAWER_BODY_STYLE,\n\tDRAWER_HEADER_STYLE,\n\tDrawerHeaderText,\n} from './DrawerHeaderText';\nimport { ToolInstructionsField } from './ToolInstructionsField';\nimport { VariableTriggerArea } from './VariableTriggerArea';\n\n/** Header copy per shared-drawer tool. */\nconst TOOL_COPY: Record<ConfigToolKey, { title: string; subtitle: string }> = {\n\tsend_email: {\n\t\ttitle: 'Send email',\n\t\tsubtitle:\n\t\t\t\"Notify someone by email when this agent can't continue. You pick the recipient, the AI drafts the message.\",\n\t},\n\tsend_slack_message: {\n\t\ttitle: 'Send Slack message',\n\t\tsubtitle:\n\t\t\t'Post a message to a Slack channel. You pick the channel, the AI composes the message from the conversation.',\n\t},\n\tgoogle_sheet_get_data: {\n\t\ttitle: 'Get data from sheet',\n\t\tsubtitle:\n\t\t\t'Look up rows in a Google Sheet. You pick the sheet and describe its columns, the AI writes the query it needs.',\n\t},\n\tgoogle_sheet_add_row: {\n\t\ttitle: 'Add row to sheet',\n\t\tsubtitle:\n\t\t\t'Append a row to a Google Sheet. You pick the sheet and its columns, the AI fills them in from the conversation.',\n\t},\n};\n\ninterface ConfigToolPanelProps {\n\t/** Which tool this drawer configures (drives copy + persistence). */\n\ttoolKey: ConfigToolKey;\n\t/**\n\t * The backend template (`list-catalog` → params) for `toolKey`. The form is\n\t * DYNAMIC: exactly these fields render, in this order, each by its\n\t * `component` kind (KeywordInput | MultilineInput | Switch | fallback input).\n\t */\n\ttemplate: ParamsBlob;\n\tonClose: () => void;\n\t/** Persist the filled template. A pending promise shows the Save loader. */\n\tonSave: (config: ConfigToolConfig) => void | Promise<void>;\n\t/** Seed values when editing an existing tool. */\n\tinitial?: ConfigToolConfig;\n\t/** Optional \"Improve with AI\" for multiline fields. Omit to hide it. */\n\tonImprove?: (text: string) => Promise<string>;\n\tcharLimits?: AgentCharLimits;\n\t/**\n\t * Variable catalog for the `@` trigger. When non-empty, `@` in the email\n\t * tool's Subject / Send To / Reply To / CC opens the variable picker\n\t * directly, and Message Instructions upgrades to the variables-only mention\n\t * editor. Absent → the drawer behaves exactly as before.\n\t */\n\tvariablesData?: VariableListInterfaceV3[];\n\t/** SideModal stacking order — raise it when opened over another drawer. */\n\tzIndex?: number;\n}\n\ninterface EmailChipsFieldProps {\n\tchips: string[];\n\tonChange: (next: string[]) => void;\n\tplaceholder: string;\n\tnativeID?: string;\n\t/** Optional helper caption shown between the input and the chips. */\n\thint?: React.ReactNode;\n\t/**\n\t * Variable catalog for the `@` trigger. A picked variable is interpolated\n\t * into the entry TEXT at the caret (so values can mix text and variables,\n\t * e.g. `ops-{{variable:store_name}}@acme.com`) — it becomes a chip on\n\t * Enter / comma like any typed value.\n\t */\n\tvariablesData?: VariableListInterfaceV3[];\n}\n\n/**\n * Email entry field: type an address and press Enter / comma (or blur) to add\n * it. Added emails render as removable chips BELOW the input — not inside it.\n * Backspace on an empty input removes the last chip.\n */\nconst EmailChipsField: React.FC<EmailChipsFieldProps> = ({\n\tchips,\n\tonChange,\n\tplaceholder,\n\tnativeID,\n\thint,\n\tvariablesData,\n}) => {\n\tconst [buffer, setBuffer] = useState('');\n\tconst [entryFocused, setEntryFocused] = useState(false);\n\tconst wrapRef = useRef<HTMLDivElement>(null);\n\tconst inputRef = useRef<HTMLInputElement>(null);\n\n\tconst commit = () => {\n\t\tconst parts = buffer\n\t\t\t.split(',')\n\t\t\t.map((s) => s.trim())\n\t\t\t.filter(Boolean);\n\t\tif (parts.length) {\n\t\t\tonChange([...chips, ...parts.filter((p) => !chips.includes(p))]);\n\t\t}\n\t\tsetBuffer('');\n\t};\n\t// The blur handler defers via setTimeout — read the LATEST commit (with the\n\t// current buffer), not the one captured when the blur fired.\n\tconst commitRef = useRef(commit);\n\tcommitRef.current = commit;\n\t// While the variable panel is open, focus bounces through it (search box,\n\t// rows) — blur must not commit the half-composed entry.\n\tconst panelOpenRef = useRef(false);\n\t// A variable was just picked — the panel-close commit below must not fire\n\t// (onInsert refocuses the entry, so its eventual blur commits instead).\n\tconst insertedRef = useRef(false);\n\n\treturn (\n\t\t<ChipsFieldWrap ref={wrapRef}>\n\t\t\t<VariableTriggerArea\n\t\t\t\taddDataButton\n\t\t\t\tvariablesData={variablesData}\n\t\t\t\tonOpenChange={(open) => {\n\t\t\t\t\tpanelOpenRef.current = open;\n\t\t\t\t\tif (open) {\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\t\t\t\t\t// Panel closed (Escape / outside click / pick). If the entry's\n\t\t\t\t\t// blur-commit was skipped while the panel was open and focus is\n\t\t\t\t\t// not coming back, the half-typed entry would be silently lost\n\t\t\t\t\t// on save — commit it now.\n\t\t\t\t\tsetTimeout(() => {\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t!insertedRef.current &&\n\t\t\t\t\t\t\t!wrapRef.current?.contains(document.activeElement)\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\tcommitRef.current();\n\t\t\t\t\t\t}\n\t\t\t\t\t\tinsertedRef.current = false;\n\t\t\t\t\t}, 0);\n\t\t\t\t}}\n\t\t\t\tonInsert={(token, caret) => {\n\t\t\t\t\tinsertedRef.current = true;\n\t\t\t\t\tconst at = caret ?? buffer.length;\n\t\t\t\t\tsetBuffer(`${buffer.slice(0, at)}${token}${buffer.slice(at)}`);\n\t\t\t\t\t// Put the caret after the inserted token so typing continues\n\t\t\t\t\t// naturally (e.g. `{{variable:store_name}}|@acme.com`).\n\t\t\t\t\trequestAnimationFrame(() => {\n\t\t\t\t\t\tconst el = inputRef.current;\n\t\t\t\t\t\tel?.focus();\n\t\t\t\t\t\tel?.setSelectionRange(at + token.length, at + token.length);\n\t\t\t\t\t});\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<EmailInputBox\n\t\t\t\t\tid={nativeID}\n\t\t\t\t\tname={nativeID}\n\t\t\t\t\tref={inputRef}\n\t\t\t\t\ttype=\"text\"\n\t\t\t\t\tautoComplete=\"off\"\n\t\t\t\t\t// Focused + empty → the @ hint (only when a catalog makes @ do\n\t\t\t\t\t// anything); otherwise the field's own text.\n\t\t\t\t\tplaceholder={\n\t\t\t\t\t\tentryFocused && buffer === '' && (variablesData?.length ?? 0) > 0\n\t\t\t\t\t\t\t? 'Enter text, type @ to add variable'\n\t\t\t\t\t\t\t: placeholder\n\t\t\t\t\t}\n\t\t\t\t\tvalue={buffer}\n\t\t\t\t\tonChange={(e) => setBuffer(e.target.value)}\n\t\t\t\t\tonFocus={() => setEntryFocused(true)}\n\t\t\t\t\tonBlur={() => {\n\t\t\t\t\t\tsetEntryFocused(false);\n\t\t\t\t\t\t// Focus moving into the variable panel / pill is not \"leaving\n\t\t\t\t\t\t// the field\" — committing then would chip a half-composed value.\n\t\t\t\t\t\tsetTimeout(() => {\n\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t!panelOpenRef.current &&\n\t\t\t\t\t\t\t\t!wrapRef.current?.contains(document.activeElement)\n\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\tcommitRef.current();\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}, 0);\n\t\t\t\t\t}}\n\t\t\t\t\tonKeyDown={(e) => {\n\t\t\t\t\t\tif (e.key === 'Enter' || e.key === ',') {\n\t\t\t\t\t\t\te.preventDefault();\n\t\t\t\t\t\t\tcommit();\n\t\t\t\t\t\t} else if (\n\t\t\t\t\t\t\te.key === 'Backspace' &&\n\t\t\t\t\t\t\tbuffer === '' &&\n\t\t\t\t\t\t\tchips.length > 0\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\tonChange(chips.slice(0, -1));\n\t\t\t\t\t\t}\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t</VariableTriggerArea>\n\t\t\t{hint}\n\t\t\t{chips.length > 0 && (\n\t\t\t\t<ChipRow>\n\t\t\t\t\t{chips.map((email, i) => (\n\t\t\t\t\t\t<Tag\n\t\t\t\t\t\t\tkey={`${email}-${i}`}\n\t\t\t\t\t\t\t// Variable tokens display as the short {{name}} (values can mix\n\t\t\t\t\t\t\t// text and tokens); the stored value keeps {{variable:<name>}}.\n\t\t\t\t\t\t\ttagText={email.replace(/\\{\\{variable:([^}]+)\\}\\}/g, '{{$1}}')}\n\t\t\t\t\t\t\ttheme=\"light\"\n\t\t\t\t\t\t\ttype=\"neutral\"\n\t\t\t\t\t\t\tvariant=\"regular\"\n\t\t\t\t\t\t\tTrailingIcon={CrossIcon}\n\t\t\t\t\t\t\tonTrailingIconClicked={() =>\n\t\t\t\t\t\t\t\tonChange(chips.filter((_, idx) => idx !== i))\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</ChipRow>\n\t\t\t)}\n\t\t</ChipsFieldWrap>\n\t);\n};\n\n/** Field values keyed by param key (the editable part of a {@link ParamsBlob}). */\ntype ParamValues = Record<string, string | boolean | number | object>;\n\nconst seedValues = (\n\ttemplate: ParamsBlob,\n\tinitial?: ConfigToolConfig,\n): ParamValues => {\n\tconst values: ParamValues = {};\n\tObject.keys(template).forEach((key) => {\n\t\tvalues[key] = initial?.params[key]?.value ?? template[key].value;\n\t});\n\treturn values;\n};\n\n/** Chips ↔ the string value KeywordInput fields carry (comma-separated). */\nconst toChips = (value: unknown): string[] =>\n\tString(value ?? '')\n\t\t.split(',')\n\t\t.map((s) => s.trim())\n\t\t.filter(Boolean);\n\n/**\n * Shared right-side drawer for the params-driven configurable tools (email /\n * Slack). Fully backend-driven: it renders the template fields by their\n * `component` kind and returns the same blob with values filled in. KeywordInput\n * renders as multi-value email chips only for `send_email`; every other tool\n * gets a plain single-line input. Mount it fresh per open (key it) so `initial`\n * seeds the state. Built on the shared `SideModal` shell.\n */\nexport const ConfigToolPanel: React.FC<ConfigToolPanelProps> = ({\n\ttoolKey,\n\ttemplate,\n\tonClose,\n\tonSave,\n\tinitial,\n\tonImprove,\n\tcharLimits = AGENT_CHAR_LIMITS,\n\tvariablesData,\n\tzIndex,\n}) => {\n\tconst [values, setValues] = useState<ParamValues>(() =>\n\t\tseedValues(template, initial),\n\t);\n\tconst [saving, setSaving] = useState(false);\n\n\tconst fields = Object.values(template);\n\tconst isEmail = toolKey === 'send_email';\n\tconst setValue = (key: string, value: string | boolean | number | object) =>\n\t\tsetValues((prev) => ({ ...prev, [key]: value }));\n\n\tconst canSave = fields.every((f) => {\n\t\tif (f.required && String(values[f.key] ?? '').trim() === '') {\n\t\t\treturn false;\n\t\t}\n\t\t// MultilineInput renders the soft-limit editor (a paste may exceed the\n\t\t// cap, rendered grey) — gate the save so over-limit text can't persist.\n\t\tif (\n\t\t\tf.component === 'MultilineInput' &&\n\t\t\tString(values[f.key] ?? '').length > charLimits.instructions\n\t\t) {\n\t\t\treturn false;\n\t\t}\n\t\treturn true;\n\t});\n\n\tconst handleSave = async () => {\n\t\tif (!canSave || saving) {\n\t\t\treturn;\n\t\t}\n\t\tconst params: ParamsBlob = {};\n\t\tfields.forEach((f) => {\n\t\t\t// Save the FULL descriptor with only `value` changed — the backend\n\t\t\t// infers each field's type from `component` and reads `required`.\n\t\t\tparams[f.key] = { ...f, value: values[f.key] };\n\t\t});\n\t\tconst config: ConfigToolConfig = {\n\t\t\tid: initial?.id ?? `${toolKey}_${Date.now().toString(36)}`,\n\t\t\ttool_key: toolKey,\n\t\t\tparams,\n\t\t};\n\t\tconst result = onSave(config);\n\t\tif (result && typeof (result as Promise<void>).then === 'function') {\n\t\t\tsetSaving(true);\n\t\t\ttry {\n\t\t\t\tawait result;\n\t\t\t} finally {\n\t\t\t\tsetSaving(false);\n\t\t\t}\n\t\t}\n\t};\n\n\tconst renderField = (field: ParamField) => {\n\t\tconst testId = `config-tool-${field.key.toLowerCase()}`;\n\t\tswitch (field.component) {\n\t\t\t// Multi-value email chips — only for the email tool. Slack's KeywordInput\n\t\t\t// (channelId) falls through to the plain input below.\n\t\t\tcase 'KeywordInput':\n\t\t\t\tif (!isEmail) {\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t\treturn (\n\t\t\t\t\t<FieldBlock key={field.key}>\n\t\t\t\t\t\t<TitleSmall color={COLORS.content.primary}>\n\t\t\t\t\t\t\t{field.title}\n\t\t\t\t\t\t</TitleSmall>\n\t\t\t\t\t\t{/* `@` at a word boundary (or the \"+ Add data\" pill) interpolates\n\t\t\t\t\t\t    a variable into the entry TEXT at the caret — mixed values like\n\t\t\t\t\t\t    ops-{{variable:store_name}}@acme.com chip on Enter / comma. */}\n\t\t\t\t\t\t<EmailChipsField\n\t\t\t\t\t\t\tnativeID={testId}\n\t\t\t\t\t\t\tplaceholder={field.hint ?? ''}\n\t\t\t\t\t\t\tchips={toChips(values[field.key])}\n\t\t\t\t\t\t\tonChange={(chips) => setValue(field.key, chips.join(','))}\n\t\t\t\t\t\t\tvariablesData={variablesData}\n\t\t\t\t\t\t\thint={\n\t\t\t\t\t\t\t\t<BodyCaption color={COLORS.content.secondary}>\n\t\t\t\t\t\t\t\t\tPress Enter or comma to add multiple emails\n\t\t\t\t\t\t\t\t</BodyCaption>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</FieldBlock>\n\t\t\t\t);\n\t\t\tcase 'MultilineInput':\n\t\t\t\treturn (\n\t\t\t\t\t<ToolInstructionsField\n\t\t\t\t\t\tkey={field.key}\n\t\t\t\t\t\tdata-test={testId}\n\t\t\t\t\t\tlabel={field.title}\n\t\t\t\t\t\tvalue={String(values[field.key] ?? '')}\n\t\t\t\t\t\tonChange={(text) => setValue(field.key, text)}\n\t\t\t\t\t\tmaxLength={charLimits.instructions}\n\t\t\t\t\t\tplaceholder={field.hint ?? ''}\n\t\t\t\t\t\tonImprove={onImprove}\n\t\t\t\t\t\tvariablesData={variablesData}\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\tcase 'Switch':\n\t\t\t\treturn (\n\t\t\t\t\t<SwitchRow key={field.key}>\n\t\t\t\t\t\t<SwitchText>\n\t\t\t\t\t\t\t<TitleSmall color={COLORS.content.primary}>\n\t\t\t\t\t\t\t\t{field.title}\n\t\t\t\t\t\t\t</TitleSmall>\n\t\t\t\t\t\t\t{field.hint && (\n\t\t\t\t\t\t\t\t<BodyCaption color={COLORS.content.secondary}>\n\t\t\t\t\t\t\t\t\t{field.hint}\n\t\t\t\t\t\t\t\t</BodyCaption>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</SwitchText>\n\t\t\t\t\t\t<Switch\n\t\t\t\t\t\t\tdata-test={testId}\n\t\t\t\t\t\t\tvalue={Boolean(values[field.key])}\n\t\t\t\t\t\t\tonValueChange={async (next) => setValue(field.key, next)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</SwitchRow>\n\t\t\t\t);\n\t\t\tdefault:\n\t\t\t\tbreak;\n\t\t}\n\t\tconst plainInput = (\n\t\t\t<Input\n\t\t\t\tdata-test={testId}\n\t\t\t\tvariant=\"small\"\n\t\t\t\tlabelText={field.title}\n\t\t\t\tlabelTextBold\n\t\t\t\tplaceholder={field.hint ?? ''}\n\t\t\t\tvalue={String(values[field.key] ?? '')}\n\t\t\t\tonChangeText={(text) => setValue(field.key, text)}\n\t\t\t/>\n\t\t);\n\t\t// `@` variables only in the email tool's free-text fields (Subject) —\n\t\t// a Slack channel id can't hold a variable.\n\t\tif (!isEmail) {\n\t\t\treturn <React.Fragment key={field.key}>{plainInput}</React.Fragment>;\n\t\t}\n\t\treturn (\n\t\t\t<VariableTriggerArea\n\t\t\t\taddDataButton\n\t\t\t\tkey={field.key}\n\t\t\t\tvariablesData={variablesData}\n\t\t\t\tonInsert={(token, caret) => {\n\t\t\t\t\tconst current = String(values[field.key] ?? '');\n\t\t\t\t\tconst at = caret ?? current.length;\n\t\t\t\t\tsetValue(\n\t\t\t\t\t\tfield.key,\n\t\t\t\t\t\t`${current.slice(0, at)}${token}${current.slice(at)}`,\n\t\t\t\t\t);\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{plainInput}\n\t\t\t</VariableTriggerArea>\n\t\t);\n\t};\n\n\tconst copy = TOOL_COPY[toolKey];\n\n\treturn (\n\t\t<SideModal\n\t\t\theader={copy.title}\n\t\t\tcloseOnEscapeKey={false}\n\t\t\tzIndex={zIndex}\n\t\t\theaderCustomComponent={\n\t\t\t\t<DrawerHeaderText title={copy.title} subtitle={copy.subtitle} />\n\t\t\t}\n\t\t\thideCrossButton={false}\n\t\t\twidth=\"431px\"\n\t\t\theaderStyle={DRAWER_HEADER_STYLE}\n\t\t\tbodyStyle={DRAWER_BODY_STYLE}\n\t\t\tonClose={onClose}\n\t\t\tsaveButtonProps={{\n\t\t\t\t'data-test': 'config-tool-save',\n\t\t\t\tbuttonText: 'Save',\n\t\t\t\tbuttonType: 'primary',\n\t\t\t\tsize: 'small',\n\t\t\t\tdisabled: !canSave,\n\t\t\t\tisLoading: saving,\n\t\t\t\tonClick: handleSave,\n\t\t\t}}\n\t\t\tcancelButtonProps={{\n\t\t\t\t'data-test': 'config-tool-cancel',\n\t\t\t\tbuttonText: 'Cancel',\n\t\t\t\tbuttonType: 'tertiaryGray',\n\t\t\t\tsize: 'small',\n\t\t\t\tonClick: onClose,\n\t\t\t}}\n\t\t>\n\t\t\t{fields.map(renderField)}\n\t\t</SideModal>\n\t);\n};\n\nconst ChipsFieldWrap = styled.div`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 8px;\n`;\n\nconst EmailInputBox = styled.input`\n\twidth: 100%;\n\tmin-width: 0;\n\tbox-sizing: border-box;\n\theight: 32px;\n\tpadding: 0 8px;\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 4px;\n\tfont-family: 'Inter', sans-serif;\n\tfont-size: 14px;\n\tcolor: ${COLORS.content.primary};\n\tbackground: ${COLORS.surface.standard};\n\toutline: none;\n\n\t&::placeholder {\n\t\tcolor: ${COLORS.content.secondary};\n\t}\n\n\t&:focus {\n\t\tborder-color: ${COLORS.stroke.brand};\n\t}\n`;\n\nconst ChipRow = styled.div`\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\tgap: 6px;\n`;\n\nconst SwitchRow = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: space-between;\n\tgap: 12px;\n`;\n\nconst SwitchText = styled.div`\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 4px;\n\tmin-width: 0;\n`;\n"],"names":["TOOL_COPY","EmailChipsField","chips","onChange","placeholder","nativeID","hint","variablesData","buffer","setBuffer","useState","entryFocused","setEntryFocused","wrapRef","useRef","inputRef","commit","parts","s","p","commitRef","panelOpenRef","insertedRef","jsxs","ChipsFieldWrap","jsx","VariableTriggerArea","open","token","caret","at","el","EmailInputBox","e","ChipRow","email","i","Tag","CrossIcon","_","idx","seedValues","template","initial","values","key","toChips","value","ConfigToolPanel","toolKey","onClose","onSave","onImprove","charLimits","AGENT_CHAR_LIMITS","zIndex","setValues","saving","setSaving","fields","isEmail","setValue","prev","canSave","f","handleSave","params","config","result","renderField","field","testId","FieldBlock","TitleSmall","COLORS","BodyCaption","ToolInstructionsField","text","SwitchRow","SwitchText","Switch","next","plainInput","Input","current","React","copy","SideModal","DrawerHeaderText","DRAWER_HEADER_STYLE","DRAWER_BODY_STYLE","styled"],"mappings":"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"}

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

@@ -0,0 +1,22 @@
+import { default as React } from 'react';
+import { HandoverMethod } from '../AgentBuilder.model';
+export interface HandoverMethodSectionProps {
+    /** The agent's current `handover.method`. */
+    method: HandoverMethod;
+    /** Called with the newly picked method. */
+    onMethodChange: (method: HandoverMethod) => void;
+    /**
+     * Open the store's smart-agent-handover settings. When absent the
+     * "Smart agent handover" text renders as plain text instead of a link.
+     */
+    onSmartAgentHandover?: () => void;
+    'data-test'?: string;
+}
+/**
+ * The BIK "Handover method" picker: "Use default settings" (selectable, links
+ * out to smart agent handover) and "Custom instructions" (disabled until that
+ * flow is built). Presentational and context-free so any host — the
+ * AgentBuilder's Step 4 or an embedding product like the journey builder —
+ * renders the identical UI.
+ */
+export declare const HandoverMethodSection: React.FC<HandoverMethodSectionProps>;

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

@@ -0,0 +1,109 @@
+import { jsxs as e, jsx as t } from "react/jsx-runtime";
+import v from "../../../assets/icons/RedirectToNew.svg.js";
+import { RadioButton as l } from "../../radioButton/RadioButton.js";
+import { TitleSmall as r, BodyCaption as s } from "../../TypographyStyle.js";
+import { COLORS as o, BASE_COLORS as c } from "../../../constants/Theme.js";
+import { FieldBlock as C, CardRow as g, RadioCard as h, RadioCardText as m, ChannelsLink as y } from "../AgentBuilder.styled.js";
+import { Tooltip as S } from "../../tooltips/Tooltip.js";
+const i = "default", A = ({
+  method: u,
+  onMethodChange: a,
+  onSmartAgentHandover: d,
+  "data-test": p
+}) => {
+  const n = u !== i;
+  return /* @__PURE__ */ e(C, { "data-test": p, children: [
+    /* @__PURE__ */ t(r, { color: o.content.primary, children: "Handover method" }),
+    /* @__PURE__ */ e(g, { children: [
+      /* @__PURE__ */ e(
+        h,
+        {
+          "data-test": "handover-method-default",
+          type: "button",
+          selected: !n,
+          onClick: () => a(i),
+          children: [
+            /* @__PURE__ */ t(
+              l,
+              {
+                isActive: !n,
+                onValueChange: () => a(i),
+                skipSelectingOff: !0,
+                activeColor: c.brand[800]
+              }
+            ),
+            /* @__PURE__ */ e(m, { children: [
+              /* @__PURE__ */ t(r, { color: o.content.primary, children: "Use default settings" }),
+              /* @__PURE__ */ e(s, { color: o.content.secondary, children: [
+                "As defined in",
+                " ",
+                d ? /* @__PURE__ */ e(
+                  y,
+                  {
+                    "data-test": "handover-smart-agent-link",
+                    type: "button",
+                    onClick: (f) => {
+                      f.stopPropagation(), d();
+                    },
+                    style: { display: "inline-flex" },
+                    children: [
+                      "Smart agent handover",
+                      /* @__PURE__ */ t(v, { width: 12, height: 12 })
+                    ]
+                  }
+                ) : "Smart agent handover"
+              ] })
+            ] })
+          ]
+        }
+      ),
+      /* @__PURE__ */ t(
+        S,
+        {
+          body: "Custom handover rules are coming soon. For now this agent follows your smart agent handover settings.",
+          placement: "top",
+          children: /* @__PURE__ */ t(
+            "span",
+            {
+              style: {
+                flex: 1,
+                display: "flex",
+                cursor: "not-allowed"
+              },
+              children: /* @__PURE__ */ e(
+                h,
+                {
+                  "data-test": "handover-method-custom",
+                  type: "button",
+                  disabled: !0,
+                  selected: n,
+                  children: [
+                    /* @__PURE__ */ t(
+                      l,
+                      {
+                        isActive: n,
+                        isDisabled: !0,
+                        onValueChange: () => {
+                        },
+                        skipSelectingOff: !0,
+                        activeColor: c.brand[800]
+                      }
+                    ),
+                    /* @__PURE__ */ e(m, { children: [
+                      /* @__PURE__ */ t(r, { color: o.content.inactive, children: "Custom instructions" }),
+                      /* @__PURE__ */ t(s, { color: o.content.inactive, children: "Write custom handover rules for this agent." })
+                    ] })
+                  ]
+                }
+              )
+            }
+          )
+        }
+      )
+    ] })
+  ] });
+};
+export {
+  A as HandoverMethodSection
+};
+//# sourceMappingURL=HandoverMethodSection.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"HandoverMethodSection.js","sources":["../../../../../src/components/agent-builder/components/HandoverMethodSection.tsx"],"sourcesContent":["import RedirectIcon from '@src/assets/icons/RedirectToNew.svg';\nimport React from 'react';\nimport { RadioButton } from '@src/components/radioButton/RadioButton';\nimport { Tooltip } from '@src/components/tooltips';\nimport { BodyCaption, TitleSmall } from '@src/components/TypographyStyle';\nimport { BASE_COLORS, COLORS } from '@src/constants/Theme';\nimport type { HandoverMethod } from '../AgentBuilder.model';\nimport {\n\tCardRow,\n\tChannelsLink,\n\tFieldBlock,\n\tRadioCard,\n\tRadioCardText,\n} from '../AgentBuilder.styled';\n\n/**\n * The stored `handover.method` that means \"inherit the store's smart-agent\n * handover settings\" — the BIK default, and the only method selectable today.\n */\nconst DEFAULT_METHOD: HandoverMethod = 'default';\n\nexport interface HandoverMethodSectionProps {\n\t/** The agent's current `handover.method`. */\n\tmethod: HandoverMethod;\n\t/** Called with the newly picked method. */\n\tonMethodChange: (method: HandoverMethod) => void;\n\t/**\n\t * Open the store's smart-agent-handover settings. When absent the\n\t * \"Smart agent handover\" text renders as plain text instead of a link.\n\t */\n\tonSmartAgentHandover?: () => void;\n\t'data-test'?: string;\n}\n\n/**\n * The BIK \"Handover method\" picker: \"Use default settings\" (selectable, links\n * out to smart agent handover) and \"Custom instructions\" (disabled until that\n * flow is built). Presentational and context-free so any host — the\n * AgentBuilder's Step 4 or an embedding product like the journey builder —\n * renders the identical UI.\n */\nexport const HandoverMethodSection: React.FC<HandoverMethodSectionProps> = ({\n\tmethod,\n\tonMethodChange,\n\tonSmartAgentHandover,\n\t'data-test': dataTest,\n}) => {\n\t// Anything other than the default method means the merchant is on custom\n\t// instructions.\n\tconst usesCustom = method !== DEFAULT_METHOD;\n\n\treturn (\n\t\t<FieldBlock data-test={dataTest}>\n\t\t\t<TitleSmall color={COLORS.content.primary}>Handover method</TitleSmall>\n\n\t\t\t<CardRow>\n\t\t\t\t<RadioCard\n\t\t\t\t\tdata-test=\"handover-method-default\"\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\tselected={!usesCustom}\n\t\t\t\t\tonClick={() => onMethodChange(DEFAULT_METHOD)}\n\t\t\t\t>\n\t\t\t\t\t<RadioButton\n\t\t\t\t\t\tisActive={!usesCustom}\n\t\t\t\t\t\tonValueChange={() => onMethodChange(DEFAULT_METHOD)}\n\t\t\t\t\t\tskipSelectingOff\n\t\t\t\t\t\tactiveColor={BASE_COLORS.brand['800']}\n\t\t\t\t\t/>\n\t\t\t\t\t<RadioCardText>\n\t\t\t\t\t\t<TitleSmall color={COLORS.content.primary}>\n\t\t\t\t\t\t\tUse default settings\n\t\t\t\t\t\t</TitleSmall>\n\t\t\t\t\t\t<BodyCaption color={COLORS.content.secondary}>\n\t\t\t\t\t\t\tAs defined in{' '}\n\t\t\t\t\t\t\t{onSmartAgentHandover ? (\n\t\t\t\t\t\t\t\t<ChannelsLink\n\t\t\t\t\t\t\t\t\tdata-test=\"handover-smart-agent-link\"\n\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t\t// The link sits inside the card's own click target, so\n\t\t\t\t\t\t\t\t\t// stop the click bubbling up and re-selecting the card.\n\t\t\t\t\t\t\t\t\tonClick={(event) => {\n\t\t\t\t\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t\t\t\t\tonSmartAgentHandover();\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tstyle={{ display: 'inline-flex' }}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\tSmart agent handover\n\t\t\t\t\t\t\t\t\t<RedirectIcon width={12} height={12} />\n\t\t\t\t\t\t\t\t</ChannelsLink>\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t'Smart agent handover'\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</BodyCaption>\n\t\t\t\t\t</RadioCardText>\n\t\t\t\t</RadioCard>\n\n\t\t\t\t{/* Custom handover rules aren't built yet — the card is shown so the\n\t\t\t\t    merchant knows it's coming, but it can't be selected. */}\n\t\t\t\t<Tooltip\n\t\t\t\t\tbody=\"Custom handover rules are coming soon. For now this agent follows your smart agent handover settings.\"\n\t\t\t\t\tplacement=\"top\"\n\t\t\t\t>\n\t\t\t\t\t{/* A disabled <button> fires no mouse events, so the tooltip would\n\t\t\t\t\t    never open on the card itself — the span is the hover target\n\t\t\t\t\t    (same wrapper IconButton uses for its disabled tooltip). It also\n\t\t\t\t\t    has to carry the card's `flex: 1`, since it is now the flex item. */}\n\t\t\t\t\t<span\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tflex: 1,\n\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\tcursor: 'not-allowed',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<RadioCard\n\t\t\t\t\t\t\tdata-test=\"handover-method-custom\"\n\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\tdisabled\n\t\t\t\t\t\t\tselected={usesCustom}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<RadioButton\n\t\t\t\t\t\t\t\tisActive={usesCustom}\n\t\t\t\t\t\t\t\tisDisabled\n\t\t\t\t\t\t\t\tonValueChange={() => undefined}\n\t\t\t\t\t\t\t\tskipSelectingOff\n\t\t\t\t\t\t\t\tactiveColor={BASE_COLORS.brand['800']}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<RadioCardText>\n\t\t\t\t\t\t\t\t<TitleSmall color={COLORS.content.inactive}>\n\t\t\t\t\t\t\t\t\tCustom instructions\n\t\t\t\t\t\t\t\t</TitleSmall>\n\t\t\t\t\t\t\t\t<BodyCaption color={COLORS.content.inactive}>\n\t\t\t\t\t\t\t\t\tWrite custom handover rules for this agent.\n\t\t\t\t\t\t\t\t</BodyCaption>\n\t\t\t\t\t\t\t</RadioCardText>\n\t\t\t\t\t\t</RadioCard>\n\t\t\t\t\t</span>\n\t\t\t\t</Tooltip>\n\t\t\t</CardRow>\n\t\t</FieldBlock>\n\t);\n};\n"],"names":["DEFAULT_METHOD","HandoverMethodSection","method","onMethodChange","onSmartAgentHandover","dataTest","usesCustom","jsxs","FieldBlock","jsx","TitleSmall","COLORS","CardRow","RadioCard","RadioButton","BASE_COLORS","RadioCardText","BodyCaption","ChannelsLink","event","RedirectIcon","Tooltip"],"mappings":";;;;;;;AAmBA,MAAMA,IAAiC,WAsB1BC,IAA8D,CAAC;AAAA,EAC3E,QAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,sBAAAC;AAAA,EACA,aAAaC;AACd,MAAM;AAGL,QAAMC,IAAaJ,MAAWF;AAE9B,SACC,gBAAAO,EAACC,GAAA,EAAW,aAAWH,GACtB,UAAA;AAAA,IAAA,gBAAAI,EAACC,GAAA,EAAW,OAAOC,EAAO,QAAQ,SAAS,UAAA,mBAAe;AAAA,sBAEzDC,GAAA,EACA,UAAA;AAAA,MAAA,gBAAAL;AAAA,QAACM;AAAA,QAAA;AAAA,UACA,aAAU;AAAA,UACV,MAAK;AAAA,UACL,UAAU,CAACP;AAAA,UACX,SAAS,MAAMH,EAAeH,CAAc;AAAA,UAE5C,UAAA;AAAA,YAAA,gBAAAS;AAAA,cAACK;AAAA,cAAA;AAAA,gBACA,UAAU,CAACR;AAAA,gBACX,eAAe,MAAMH,EAAeH,CAAc;AAAA,gBAClD,kBAAgB;AAAA,gBAChB,aAAae,EAAY,MAAM,GAAK;AAAA,cAAA;AAAA,YAAA;AAAA,8BAEpCC,GAAA,EACA,UAAA;AAAA,cAAA,gBAAAP,EAACC,GAAA,EAAW,OAAOC,EAAO,QAAQ,SAAS,UAAA,wBAE3C;AAAA,cACA,gBAAAJ,EAACU,GAAA,EAAY,OAAON,EAAO,QAAQ,WAAW,UAAA;AAAA,gBAAA;AAAA,gBAC/B;AAAA,gBACbP,IACA,gBAAAG;AAAA,kBAACW;AAAA,kBAAA;AAAA,oBACA,aAAU;AAAA,oBACV,MAAK;AAAA,oBAGL,SAAS,CAACC,MAAU;AACnB,sBAAAA,EAAM,gBAAA,GACNf,EAAA;AAAA,oBACD;AAAA,oBACA,OAAO,EAAE,SAAS,cAAA;AAAA,oBAClB,UAAA;AAAA,sBAAA;AAAA,sBAEA,gBAAAK,EAACW,GAAA,EAAa,OAAO,IAAI,QAAQ,GAAA,CAAI;AAAA,oBAAA;AAAA,kBAAA;AAAA,gBAAA,IAGtC;AAAA,cAAA,EAAA,CAEF;AAAA,YAAA,EAAA,CACD;AAAA,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,MAKD,gBAAAX;AAAA,QAACY;AAAA,QAAA;AAAA,UACA,MAAK;AAAA,UACL,WAAU;AAAA,UAMV,UAAA,gBAAAZ;AAAA,YAAC;AAAA,YAAA;AAAA,cACA,OAAO;AAAA,gBACN,MAAM;AAAA,gBACN,SAAS;AAAA,gBACT,QAAQ;AAAA,cAAA;AAAA,cAGT,UAAA,gBAAAF;AAAA,gBAACM;AAAA,gBAAA;AAAA,kBACA,aAAU;AAAA,kBACV,MAAK;AAAA,kBACL,UAAQ;AAAA,kBACR,UAAUP;AAAA,kBAEV,UAAA;AAAA,oBAAA,gBAAAG;AAAA,sBAACK;AAAA,sBAAA;AAAA,wBACA,UAAUR;AAAA,wBACV,YAAU;AAAA,wBACV,eAAe,MAAA;AAAA;AAAA,wBACf,kBAAgB;AAAA,wBAChB,aAAaS,EAAY,MAAM,GAAK;AAAA,sBAAA;AAAA,oBAAA;AAAA,sCAEpCC,GAAA,EACA,UAAA;AAAA,sBAAA,gBAAAP,EAACC,GAAA,EAAW,OAAOC,EAAO,QAAQ,UAAU,UAAA,uBAE5C;AAAA,wCACCM,GAAA,EAAY,OAAON,EAAO,QAAQ,UAAU,UAAA,8CAAA,CAE7C;AAAA,oBAAA,EAAA,CACD;AAAA,kBAAA;AAAA,gBAAA;AAAA,cAAA;AAAA,YACD;AAAA,UAAA;AAAA,QACD;AAAA,MAAA;AAAA,IACD,EAAA,CACD;AAAA,EAAA,GACD;AAEF;"}

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

@@ -1,27 +1,26 @@
-import { jsx as n } from "react/jsx-runtime";
+import { jsx as e } from "react/jsx-runtime";
 import { useAgentBuilderContext as r } from "../context/AgentBuilderContext.js";
 import { Toaster as s } from "../../toaster/Toaster.js";
-const m = () => {
-  const { undoToast: o, undoRemoval: t, dismissUndo: e } = r();
-  return o ? /* @__PURE__ */ n(
+const d = () => {
+  const { undoToast: o, undoRemoval: t, dismissUndo: n } = r();
+  return o ? /* @__PURE__ */ e(
     s,
     {
       text: o.message,
       type: "info",
       position: "top-right",
       autoClose: 5e3,
-      hideCloseButton: !0,
       buttonProps: {
         buttonText: "Undo",
         showButton: !0,
         onButtonClick: () => (t(), {})
       },
-      onCloseToast: () => e()
+      onCloseToast: () => n()
     },
     o.id
   ) : null;
 };
 export {
-  m as UndoToast
+  d as UndoToast
 };
 //# sourceMappingURL=UndoToast.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"UndoToast.js","sources":["../../../../../src/components/agent-builder/components/UndoToast.tsx"],"sourcesContent":["import React from 'react';\nimport { Toaster } from '@src/components/toaster';\nimport { useAgentBuilderContext } from '../context/AgentBuilderContext';\n\n/**\n * Top-right toast shown after a tool / sub-agent is removed, offering an Undo.\n * Re-keyed per removal so each one restarts the auto-close timer. Uses the\n * shared `Toaster` (which mounts its own ToastContainer).\n */\nexport const UndoToast: React.FC = () => {\n\tconst { undoToast, undoRemoval, dismissUndo } = useAgentBuilderContext();\n\n\tif (!undoToast) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<Toaster\n\t\t\tkey={undoToast.id}\n\t\t\ttext={undoToast.message}\n\t\t\ttype=\"info\"\n\t\t\tposition=\"top-right\"\n\t\t\tautoClose={5000}\n\t\t\thideCloseButton\n\t\t\tbuttonProps={{\n\t\t\t\tbuttonText: 'Undo',\n\t\t\t\tshowButton: true,\n\t\t\t\tonButtonClick: () => {\n\t\t\t\t\tundoRemoval();\n\t\t\t\t\treturn {} as Record<string, never>;\n\t\t\t\t},\n\t\t\t}}\n\t\t\tonCloseToast={() => dismissUndo()}\n\t\t/>\n\t);\n};\n"],"names":["UndoToast","undoToast","undoRemoval","dismissUndo","useAgentBuilderContext","jsx","Toaster"],"mappings":";;;AASO,MAAMA,IAAsB,MAAM;AACxC,QAAM,EAAE,WAAAC,GAAW,aAAAC,GAAa,aAAAC,EAAA,IAAgBC,EAAA;AAEhD,SAAKH,IAKJ,gBAAAI;AAAA,IAACC;AAAA,IAAA;AAAA,MAEA,MAAML,EAAU;AAAA,MAChB,MAAK;AAAA,MACL,UAAS;AAAA,MACT,WAAW;AAAA,MACX,iBAAe;AAAA,MACf,aAAa;AAAA,QACZ,YAAY;AAAA,QACZ,YAAY;AAAA,QACZ,eAAe,OACdC,EAAA,GACO,CAAA;AAAA,MACR;AAAA,MAED,cAAc,MAAMC,EAAA;AAAA,IAAY;AAAA,IAd3BF,EAAU;AAAA,EAAA,IALT;AAsBT;"}
+{"version":3,"file":"UndoToast.js","sources":["../../../../../src/components/agent-builder/components/UndoToast.tsx"],"sourcesContent":["import React from 'react';\nimport { Toaster } from '@src/components/toaster';\nimport { useAgentBuilderContext } from '../context/AgentBuilderContext';\n\n/**\n * Top-right toast shown after a tool / sub-agent is removed, offering an Undo.\n * Re-keyed per removal so each one restarts the auto-close timer. Uses the\n * shared `Toaster` (which mounts its own ToastContainer).\n */\nexport const UndoToast: React.FC = () => {\n\tconst { undoToast, undoRemoval, dismissUndo } = useAgentBuilderContext();\n\n\tif (!undoToast) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<Toaster\n\t\t\tkey={undoToast.id}\n\t\t\ttext={undoToast.message}\n\t\t\ttype=\"info\"\n\t\t\tposition=\"top-right\"\n\t\t\tautoClose={5000}\n\t\t\tbuttonProps={{\n\t\t\t\tbuttonText: 'Undo',\n\t\t\t\tshowButton: true,\n\t\t\t\tonButtonClick: () => {\n\t\t\t\t\tundoRemoval();\n\t\t\t\t\treturn {} as Record<string, never>;\n\t\t\t\t},\n\t\t\t}}\n\t\t\tonCloseToast={() => dismissUndo()}\n\t\t/>\n\t);\n};\n"],"names":["UndoToast","undoToast","undoRemoval","dismissUndo","useAgentBuilderContext","jsx","Toaster"],"mappings":";;;AASO,MAAMA,IAAsB,MAAM;AACxC,QAAM,EAAE,WAAAC,GAAW,aAAAC,GAAa,aAAAC,EAAA,IAAgBC,EAAA;AAEhD,SAAKH,IAKJ,gBAAAI;AAAA,IAACC;AAAA,IAAA;AAAA,MAEA,MAAML,EAAU;AAAA,MAChB,MAAK;AAAA,MACL,UAAS;AAAA,MACT,WAAW;AAAA,MACX,aAAa;AAAA,QACZ,YAAY;AAAA,QACZ,YAAY;AAAA,QACZ,eAAe,OACdC,EAAA,GACO,CAAA;AAAA,MACR;AAAA,MAED,cAAc,MAAMC,EAAA;AAAA,IAAY;AAAA,IAb3BF,EAAU;AAAA,EAAA,IALT;AAqBT;"}

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

@@ -12,6 +12,8 @@ export { MentionPicker } from './components/MentionPicker';
 export { AiTextArea } from './components/AiTextArea';
 export { ToolInstructionsField } from './components/ToolInstructionsField';
 export { DrawerHeaderText } from './components/DrawerHeaderText';
+export { HandoverMethodSection } from './components/HandoverMethodSection';
+export type { HandoverMethodSectionProps } from './components/HandoverMethodSection';
 export { useAgentDraft } from './hooks/useAgentDraft';
 export type { AgentDraft } from './hooks/useAgentDraft';
 export { AGENT_CHAR_LIMITS } from './constants/charLimits';
@@ -22,7 +24,7 @@ export type { ChannelPresentation } from './constants/channels';
 export { ToolSource, TOOL_SOURCE_LABELS, TOOL_ACTION_SOURCES, TOOL_ACTION_LABELS, CONFIG_TOOL_SOURCES, CONFIG_TOOL_ACTION_LABELS, INTEGRATION_SOURCES, TOOL_SOURCE_RANK, } from './constants/tools';
 export type { ToolAction, SourceIcon, IconComp } from './constants/tools';
 export { AGENT_EDITOR_STYLE } from './constants/editorStyle';
-export { buildAgentMentionItems, editorDocToInstructions, instructionsToEditorHtml, } from './utils/mentionSerialization';
+export { buildAgentMentionItems, editorDocToInstructions, instructionsToEditorHtml, toolSourceLabel, appTypeLabel, } from './utils/mentionSerialization';
 export { SOURCE_ICONS, sourceIcon, renderSourceIcon, GENERIC_SOURCE_ICON, } from './utils/sourceIcons';
 export { buildToolActions } from './utils/toolActions';
 export { partitionSources, isUnconnectedSource } from './utils/sourceGrouping';

package/dist/esm/components/agent-builder/steps/Step4HandoverRules.d.ts

@@ -5,8 +5,9 @@ import { default as React } from 'react';
  * **Manifest** (and any other host) keeps the original single free-text field:
  * the method is implicit and the consumer always sends the seeded `'default'`.
  *
- * **BIK** picks a handover *method* first. "Use default settings" is selected by
- * default and links out to where those defaults live; "Custom instructions" is
+ * **BIK** picks a handover *method* first, via the shared
+ * {@link HandoverMethodSection}: "Use default settings" is selected by default
+ * and links out to where those defaults live; "Custom instructions" is
  * deliberately disabled until that flow is built, so the free-text field only
  * appears for an agent already saved with a non-default method.
  */

package/dist/esm/components/agent-builder/steps/Step4HandoverRules.js

@@ -1,132 +1,46 @@
-import { jsxs as t, jsx as e } from "react/jsx-runtime";
-import x from "../../../assets/icons/RedirectToNew.svg.js";
-import { RadioButton as m } from "../../radioButton/RadioButton.js";
-import { TitleSmall as c, BodyCaption as p } from "../../TypographyStyle.js";
-import { COLORS as a, BASE_COLORS as v } from "../../../constants/Theme.js";
-import { SectionBodyWrap as u, FieldBlock as T, CardRow as w, RadioCard as f, RadioCardText as g, ChannelsLink as H } from "../AgentBuilder.styled.js";
-import { AiTextArea as A } from "../components/AiTextArea.js";
-import { StepSectionHeader as C } from "../components/StepSectionHeader.js";
-import { STEP_DEFINITIONS as B } from "../constants/steps.js";
-import { useAgentBuilderContext as S } from "../context/AgentBuilderContext.js";
-import { appTypeLabel as O } from "../utils/mentionSerialization.js";
-import { Tooltip as R } from "../../tooltips/Tooltip.js";
-const d = B[3], h = "default", K = () => {
-  const { value: l, patch: i, applicationType: s, onSmartAgentHandover: o } = S(), { handover: n } = l, b = O(s) === "BIK", r = n.method !== h;
-  return b ? /* @__PURE__ */ t("div", { className: "bik-agent-step bik-agent-step--handover", children: [
-    /* @__PURE__ */ e(C, { title: d.title, helper: d.helper }),
-    /* @__PURE__ */ t(u, { children: [
-      /* @__PURE__ */ t(T, { children: [
-        /* @__PURE__ */ e(c, { color: a.content.primary, children: "Handover method" }),
-        /* @__PURE__ */ t(w, { children: [
-          /* @__PURE__ */ t(
-            f,
-            {
-              "data-test": "handover-method-default",
-              type: "button",
-              selected: !r,
-              onClick: () => i({ handover: { ...n, method: h } }),
-              children: [
-                /* @__PURE__ */ e(
-                  m,
-                  {
-                    isActive: !r,
-                    onValueChange: () => i({ handover: { ...n, method: h } }),
-                    skipSelectingOff: !0,
-                    activeColor: v.brand[800]
-                  }
-                ),
-                /* @__PURE__ */ t(g, { children: [
-                  /* @__PURE__ */ e(c, { color: a.content.primary, children: "Use default settings" }),
-                  /* @__PURE__ */ t(p, { color: a.content.secondary, children: [
-                    "As defined in",
-                    " ",
-                    o ? /* @__PURE__ */ t(
-                      H,
-                      {
-                        "data-test": "handover-smart-agent-link",
-                        type: "button",
-                        onClick: (k) => {
-                          k.stopPropagation(), o();
-                        },
-                        style: { display: "inline-flex" },
-                        children: [
-                          "Smart agent handover",
-                          /* @__PURE__ */ e(x, { width: 12, height: 12 })
-                        ]
-                      }
-                    ) : "Smart agent handover"
-                  ] })
-                ] })
-              ]
-            }
-          ),
-          /* @__PURE__ */ e(
-            R,
-            {
-              body: "Custom handover rules are coming soon. For now this agent follows your smart agent handover settings.",
-              placement: "top",
-              children: /* @__PURE__ */ e(
-                "span",
-                {
-                  style: {
-                    flex: 1,
-                    display: "flex",
-                    cursor: "not-allowed"
-                  },
-                  children: /* @__PURE__ */ t(
-                    f,
-                    {
-                      "data-test": "handover-method-custom",
-                      type: "button",
-                      disabled: !0,
-                      selected: r,
-                      children: [
-                        /* @__PURE__ */ e(
-                          m,
-                          {
-                            isActive: r,
-                            isDisabled: !0,
-                            onValueChange: () => {
-                            },
-                            skipSelectingOff: !0,
-                            activeColor: v.brand[800]
-                          }
-                        ),
-                        /* @__PURE__ */ t(g, { children: [
-                          /* @__PURE__ */ e(c, { color: a.content.inactive, children: "Custom instructions" }),
-                          /* @__PURE__ */ e(p, { color: a.content.inactive, children: "Write custom handover rules for this agent." })
-                        ] })
-                      ]
-                    }
-                  )
-                }
-              )
-            }
-          )
-        ] })
-      ] }),
-      r && /* @__PURE__ */ e(y, {})
+import { jsxs as h, jsx as e } from "react/jsx-runtime";
+import { SectionBodyWrap as d } from "../AgentBuilder.styled.js";
+import { AiTextArea as u } from "../components/AiTextArea.js";
+import { HandoverMethodSection as f } from "../components/HandoverMethodSection.js";
+import { StepSectionHeader as s } from "../components/StepSectionHeader.js";
+import { STEP_DEFINITIONS as g } from "../constants/steps.js";
+import { useAgentBuilderContext as m } from "../context/AgentBuilderContext.js";
+import { appTypeLabel as H } from "../utils/mentionSerialization.js";
+const r = g[3], S = "default", B = () => {
+  const { value: n, patch: a, applicationType: i, onSmartAgentHandover: o } = m(), { handover: t } = n, l = H(i) === "BIK", c = t.method !== S;
+  return l ? /* @__PURE__ */ h("div", { className: "bik-agent-step bik-agent-step--handover", children: [
+    /* @__PURE__ */ e(s, { title: r.title, helper: r.helper }),
+    /* @__PURE__ */ h(d, { children: [
+      /* @__PURE__ */ e(
+        f,
+        {
+          method: t.method,
+          onMethodChange: (v) => a({ handover: { ...t, method: v } }),
+          onSmartAgentHandover: o
+        }
+      ),
+      c && /* @__PURE__ */ e(p, {})
     ] })
-  ] }) : /* @__PURE__ */ t("div", { className: "bik-agent-step bik-agent-step--handover", children: [
-    /* @__PURE__ */ e(C, { title: d.title, helper: d.helper }),
-    /* @__PURE__ */ e(u, { children: /* @__PURE__ */ e(y, {}) })
+  ] }) : /* @__PURE__ */ h("div", { className: "bik-agent-step bik-agent-step--handover", children: [
+    /* @__PURE__ */ e(s, { title: r.title, helper: r.helper }),
+    /* @__PURE__ */ e(d, { children: /* @__PURE__ */ e(p, {}) })
   ] });
-}, y = () => {
-  const { value: l, patch: i, charLimits: s } = S(), { handover: o } = l;
+}, p = () => {
+  const { value: n, patch: a, charLimits: i } = m(), { handover: o } = n;
   return /* @__PURE__ */ e(
-    A,
+    u,
     {
       "data-test": "handover-when",
       label: "Handover when",
       value: o.when,
-      onChange: (n) => i({ handover: { ...o, when: n } }),
-      maxLength: s.handoverWhen,
+      onChange: (t) => a({ handover: { ...o, when: t } }),
+      maxLength: i.handoverWhen,
       placeholder: "e.g. Hand over if the customer is angry or asks for a human three times. Hand over if the order value exceeds ₹5,000.",
       minHeight: "120px"
     }
   );
 };
 export {
-  K as Step4HandoverRules
+  B as Step4HandoverRules
 };
 //# sourceMappingURL=Step4HandoverRules.js.map

package/dist/esm/components/agent-builder/steps/Step4HandoverRules.js.map

@@ -1 +1 @@
-{"version":3,"file":"Step4HandoverRules.js","sources":["../../../../../src/components/agent-builder/steps/Step4HandoverRules.tsx"],"sourcesContent":["import RedirectIcon from '@src/assets/icons/RedirectToNew.svg';\nimport React from 'react';\nimport { RadioButton } from '@src/components/radioButton/RadioButton';\nimport { Tooltip } from '@src/components/tooltips';\nimport { BodyCaption, TitleSmall } from '@src/components/TypographyStyle';\nimport { BASE_COLORS, COLORS } from '@src/constants/Theme';\nimport type { HandoverMethod } from '../AgentBuilder.model';\nimport {\n\tCardRow,\n\tChannelsLink,\n\tFieldBlock,\n\tRadioCard,\n\tRadioCardText,\n\tSectionBodyWrap,\n} from '../AgentBuilder.styled';\nimport { AiTextArea } from '../components/AiTextArea';\nimport { StepSectionHeader } from '../components/StepSectionHeader';\nimport { STEP_DEFINITIONS } from '../constants/steps';\nimport { useAgentBuilderContext } from '../context/AgentBuilderContext';\nimport { appTypeLabel } from '../utils/mentionSerialization';\n\nconst STEP = STEP_DEFINITIONS[3];\n\n/**\n * The stored `handover.method` that means \"inherit the store's smart-agent\n * handover settings\" — the BIK default, and the only method selectable today.\n */\nconst DEFAULT_METHOD: HandoverMethod = 'default';\n\n/**\n * Step 4.\n *\n * **Manifest** (and any other host) keeps the original single free-text field:\n * the method is implicit and the consumer always sends the seeded `'default'`.\n *\n * **BIK** picks a handover *method* first. \"Use default settings\" is selected by\n * default and links out to where those defaults live; \"Custom instructions\" is\n * deliberately disabled until that flow is built, so the free-text field only\n * appears for an agent already saved with a non-default method.\n */\nexport const Step4HandoverRules: React.FC = () => {\n\tconst { value, patch, applicationType, onSmartAgentHandover } =\n\t\tuseAgentBuilderContext();\n\tconst { handover } = value;\n\n\tconst isBik = appTypeLabel(applicationType) === 'BIK';\n\t// Anything other than the default method means the merchant is on custom\n\t// instructions, so the free-text field is what they need to see.\n\tconst usesCustom = handover.method !== DEFAULT_METHOD;\n\n\tif (!isBik) {\n\t\treturn (\n\t\t\t<div className=\"bik-agent-step bik-agent-step--handover\">\n\t\t\t\t<StepSectionHeader title={STEP.title} helper={STEP.helper} />\n\t\t\t\t<SectionBodyWrap>\n\t\t\t\t\t<HandoverWhenField />\n\t\t\t\t</SectionBodyWrap>\n\t\t\t</div>\n\t\t);\n\t}\n\n\treturn (\n\t\t<div className=\"bik-agent-step bik-agent-step--handover\">\n\t\t\t<StepSectionHeader title={STEP.title} helper={STEP.helper} />\n\n\t\t\t<SectionBodyWrap>\n\t\t\t\t<FieldBlock>\n\t\t\t\t\t<TitleSmall color={COLORS.content.primary}>\n\t\t\t\t\t\tHandover method\n\t\t\t\t\t</TitleSmall>\n\n\t\t\t\t\t<CardRow>\n\t\t\t\t\t\t<RadioCard\n\t\t\t\t\t\t\tdata-test=\"handover-method-default\"\n\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\tselected={!usesCustom}\n\t\t\t\t\t\t\tonClick={() =>\n\t\t\t\t\t\t\t\tpatch({ handover: { ...handover, method: DEFAULT_METHOD } })\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<RadioButton\n\t\t\t\t\t\t\t\tisActive={!usesCustom}\n\t\t\t\t\t\t\t\tonValueChange={() =>\n\t\t\t\t\t\t\t\t\tpatch({ handover: { ...handover, method: DEFAULT_METHOD } })\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tskipSelectingOff\n\t\t\t\t\t\t\t\tactiveColor={BASE_COLORS.brand['800']}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<RadioCardText>\n\t\t\t\t\t\t\t\t<TitleSmall color={COLORS.content.primary}>\n\t\t\t\t\t\t\t\t\tUse default settings\n\t\t\t\t\t\t\t\t</TitleSmall>\n\t\t\t\t\t\t\t\t<BodyCaption color={COLORS.content.secondary}>\n\t\t\t\t\t\t\t\t\tAs defined in{' '}\n\t\t\t\t\t\t\t\t\t{onSmartAgentHandover ? (\n\t\t\t\t\t\t\t\t\t\t<ChannelsLink\n\t\t\t\t\t\t\t\t\t\t\tdata-test=\"handover-smart-agent-link\"\n\t\t\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t\t\t\t// The link sits inside the card's own click target, so\n\t\t\t\t\t\t\t\t\t\t\t// stop the click bubbling up and re-selecting the card.\n\t\t\t\t\t\t\t\t\t\t\tonClick={(event) => {\n\t\t\t\t\t\t\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t\t\t\t\t\t\tonSmartAgentHandover();\n\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\tstyle={{ display: 'inline-flex' }}\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\tSmart agent handover\n\t\t\t\t\t\t\t\t\t\t\t<RedirectIcon width={12} height={12} />\n\t\t\t\t\t\t\t\t\t\t</ChannelsLink>\n\t\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t\t'Smart agent handover'\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t</BodyCaption>\n\t\t\t\t\t\t\t</RadioCardText>\n\t\t\t\t\t\t</RadioCard>\n\n\t\t\t\t\t\t{/* Custom handover rules aren't built yet — the card is shown so the\n\t\t\t\t\t\t    merchant knows it's coming, but it can't be selected. */}\n\t\t\t\t\t\t<Tooltip\n\t\t\t\t\t\t\tbody=\"Custom handover rules are coming soon. For now this agent follows your smart agent handover settings.\"\n\t\t\t\t\t\t\tplacement=\"top\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{/* A disabled <button> fires no mouse events, so the tooltip would\n\t\t\t\t\t\t\t    never open on the card itself — the span is the hover target\n\t\t\t\t\t\t\t    (same wrapper IconButton uses for its disabled tooltip). It also\n\t\t\t\t\t\t\t    has to carry the card's `flex: 1`, since it is now the flex item. */}\n\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\tflex: 1,\n\t\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\t\tcursor: 'not-allowed',\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<RadioCard\n\t\t\t\t\t\t\t\t\tdata-test=\"handover-method-custom\"\n\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t\tdisabled\n\t\t\t\t\t\t\t\t\tselected={usesCustom}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<RadioButton\n\t\t\t\t\t\t\t\t\t\tisActive={usesCustom}\n\t\t\t\t\t\t\t\t\t\tisDisabled\n\t\t\t\t\t\t\t\t\t\tonValueChange={() => undefined}\n\t\t\t\t\t\t\t\t\t\tskipSelectingOff\n\t\t\t\t\t\t\t\t\t\tactiveColor={BASE_COLORS.brand['800']}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t<RadioCardText>\n\t\t\t\t\t\t\t\t\t\t<TitleSmall color={COLORS.content.inactive}>\n\t\t\t\t\t\t\t\t\t\t\tCustom instructions\n\t\t\t\t\t\t\t\t\t\t</TitleSmall>\n\t\t\t\t\t\t\t\t\t\t<BodyCaption color={COLORS.content.inactive}>\n\t\t\t\t\t\t\t\t\t\t\tWrite custom handover rules for this agent.\n\t\t\t\t\t\t\t\t\t\t</BodyCaption>\n\t\t\t\t\t\t\t\t\t</RadioCardText>\n\t\t\t\t\t\t\t\t</RadioCard>\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t</CardRow>\n\t\t\t\t</FieldBlock>\n\n\t\t\t\t{usesCustom && <HandoverWhenField />}\n\t\t\t</SectionBodyWrap>\n\t\t</div>\n\t);\n};\n\n/** The free-text \"Handover when\" field, shared by both layouts. */\nconst HandoverWhenField: React.FC = () => {\n\tconst { value, patch, charLimits } = useAgentBuilderContext();\n\tconst { handover } = value;\n\n\treturn (\n\t\t<AiTextArea\n\t\t\tdata-test=\"handover-when\"\n\t\t\tlabel=\"Handover when\"\n\t\t\tvalue={handover.when}\n\t\t\tonChange={(text) => patch({ handover: { ...handover, when: text } })}\n\t\t\tmaxLength={charLimits.handoverWhen}\n\t\t\tplaceholder=\"e.g. Hand over if the customer is angry or asks for a human three times. Hand over if the order value exceeds ₹5,000.\"\n\t\t\tminHeight=\"120px\"\n\t\t/>\n\t);\n};\n"],"names":["STEP","STEP_DEFINITIONS","DEFAULT_METHOD","Step4HandoverRules","value","patch","applicationType","onSmartAgentHandover","useAgentBuilderContext","handover","isBik","appTypeLabel","usesCustom","jsxs","jsx","StepSectionHeader","SectionBodyWrap","FieldBlock","TitleSmall","COLORS","CardRow","RadioCard","RadioButton","BASE_COLORS","RadioCardText","BodyCaption","ChannelsLink","event","RedirectIcon","Tooltip","HandoverWhenField","charLimits","AiTextArea","text"],"mappings":"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"}
+{"version":3,"file":"Step4HandoverRules.js","sources":["../../../../../src/components/agent-builder/steps/Step4HandoverRules.tsx"],"sourcesContent":["import React from 'react';\nimport type { HandoverMethod } from '../AgentBuilder.model';\nimport { SectionBodyWrap } from '../AgentBuilder.styled';\nimport { AiTextArea } from '../components/AiTextArea';\nimport { HandoverMethodSection } from '../components/HandoverMethodSection';\nimport { StepSectionHeader } from '../components/StepSectionHeader';\nimport { STEP_DEFINITIONS } from '../constants/steps';\nimport { useAgentBuilderContext } from '../context/AgentBuilderContext';\nimport { appTypeLabel } from '../utils/mentionSerialization';\n\nconst STEP = STEP_DEFINITIONS[3];\n\n/**\n * The stored `handover.method` that means \"inherit the store's smart-agent\n * handover settings\" — the BIK default, and the only method selectable today.\n */\nconst DEFAULT_METHOD: HandoverMethod = 'default';\n\n/**\n * Step 4.\n *\n * **Manifest** (and any other host) keeps the original single free-text field:\n * the method is implicit and the consumer always sends the seeded `'default'`.\n *\n * **BIK** picks a handover *method* first, via the shared\n * {@link HandoverMethodSection}: \"Use default settings\" is selected by default\n * and links out to where those defaults live; \"Custom instructions\" is\n * deliberately disabled until that flow is built, so the free-text field only\n * appears for an agent already saved with a non-default method.\n */\nexport const Step4HandoverRules: React.FC = () => {\n\tconst { value, patch, applicationType, onSmartAgentHandover } =\n\t\tuseAgentBuilderContext();\n\tconst { handover } = value;\n\n\tconst isBik = appTypeLabel(applicationType) === 'BIK';\n\t// Anything other than the default method means the merchant is on custom\n\t// instructions, so the free-text field is what they need to see.\n\tconst usesCustom = handover.method !== DEFAULT_METHOD;\n\n\tif (!isBik) {\n\t\treturn (\n\t\t\t<div className=\"bik-agent-step bik-agent-step--handover\">\n\t\t\t\t<StepSectionHeader title={STEP.title} helper={STEP.helper} />\n\t\t\t\t<SectionBodyWrap>\n\t\t\t\t\t<HandoverWhenField />\n\t\t\t\t</SectionBodyWrap>\n\t\t\t</div>\n\t\t);\n\t}\n\n\treturn (\n\t\t<div className=\"bik-agent-step bik-agent-step--handover\">\n\t\t\t<StepSectionHeader title={STEP.title} helper={STEP.helper} />\n\n\t\t\t<SectionBodyWrap>\n\t\t\t\t<HandoverMethodSection\n\t\t\t\t\tmethod={handover.method}\n\t\t\t\t\tonMethodChange={(method) =>\n\t\t\t\t\t\tpatch({ handover: { ...handover, method } })\n\t\t\t\t\t}\n\t\t\t\t\tonSmartAgentHandover={onSmartAgentHandover}\n\t\t\t\t/>\n\n\t\t\t\t{usesCustom && <HandoverWhenField />}\n\t\t\t</SectionBodyWrap>\n\t\t</div>\n\t);\n};\n\n/** The free-text \"Handover when\" field, shared by both layouts. */\nconst HandoverWhenField: React.FC = () => {\n\tconst { value, patch, charLimits } = useAgentBuilderContext();\n\tconst { handover } = value;\n\n\treturn (\n\t\t<AiTextArea\n\t\t\tdata-test=\"handover-when\"\n\t\t\tlabel=\"Handover when\"\n\t\t\tvalue={handover.when}\n\t\t\tonChange={(text) => patch({ handover: { ...handover, when: text } })}\n\t\t\tmaxLength={charLimits.handoverWhen}\n\t\t\tplaceholder=\"e.g. Hand over if the customer is angry or asks for a human three times. Hand over if the order value exceeds ₹5,000.\"\n\t\t\tminHeight=\"120px\"\n\t\t/>\n\t);\n};\n"],"names":["STEP","STEP_DEFINITIONS","DEFAULT_METHOD","Step4HandoverRules","value","patch","applicationType","onSmartAgentHandover","useAgentBuilderContext","handover","isBik","appTypeLabel","usesCustom","jsxs","jsx","StepSectionHeader","SectionBodyWrap","HandoverMethodSection","method","HandoverWhenField","charLimits","AiTextArea","text"],"mappings":";;;;;;;;AAUA,MAAMA,IAAOC,EAAiB,CAAC,GAMzBC,IAAiC,WAc1BC,IAA+B,MAAM;AACjD,QAAM,EAAE,OAAAC,GAAO,OAAAC,GAAO,iBAAAC,GAAiB,sBAAAC,EAAA,IACtCC,EAAA,GACK,EAAE,UAAAC,MAAaL,GAEfM,IAAQC,EAAaL,CAAe,MAAM,OAG1CM,IAAaH,EAAS,WAAWP;AAEvC,SAAKQ,IAYJ,gBAAAG,EAAC,OAAA,EAAI,WAAU,2CACd,UAAA;AAAA,IAAA,gBAAAC,EAACC,KAAkB,OAAOf,EAAK,OAAO,QAAQA,EAAK,QAAQ;AAAA,sBAE1DgB,GAAA,EACA,UAAA;AAAA,MAAA,gBAAAF;AAAA,QAACG;AAAA,QAAA;AAAA,UACA,QAAQR,EAAS;AAAA,UACjB,gBAAgB,CAACS,MAChBb,EAAM,EAAE,UAAU,EAAE,GAAGI,GAAU,QAAAS,EAAA,GAAU;AAAA,UAE5C,sBAAAX;AAAA,QAAA;AAAA,MAAA;AAAA,MAGAK,uBAAeO,GAAA,CAAA,CAAkB;AAAA,IAAA,EAAA,CACnC;AAAA,EAAA,GACD,IAxBC,gBAAAN,EAAC,OAAA,EAAI,WAAU,2CACd,UAAA;AAAA,IAAA,gBAAAC,EAACC,KAAkB,OAAOf,EAAK,OAAO,QAAQA,EAAK,QAAQ;AAAA,IAC3D,gBAAAc,EAACE,GAAA,EACA,UAAA,gBAAAF,EAACK,GAAA,CAAA,CAAkB,EAAA,CACpB;AAAA,EAAA,GACD;AAqBH,GAGMA,IAA8B,MAAM;AACzC,QAAM,EAAE,OAAAf,GAAO,OAAAC,GAAO,YAAAe,EAAA,IAAeZ,EAAA,GAC/B,EAAE,UAAAC,MAAaL;AAErB,SACC,gBAAAU;AAAA,IAACO;AAAA,IAAA;AAAA,MACA,aAAU;AAAA,MACV,OAAM;AAAA,MACN,OAAOZ,EAAS;AAAA,MAChB,UAAU,CAACa,MAASjB,EAAM,EAAE,UAAU,EAAE,GAAGI,GAAU,MAAMa,EAAA,GAAQ;AAAA,MACnE,WAAWF,EAAW;AAAA,MACtB,aAAY;AAAA,MACZ,WAAU;AAAA,IAAA;AAAA,EAAA;AAGb;"}