@iblai/web-containers 1.52.0 → 1.52.1

package/dist/esm/components/workflows/node-config-panel.js

@@ -0,0 +1,574 @@
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import { useState, useRef, useEffect, useCallback } from 'react';
+import { useGetMentorSettingsQuery, useGetToolsQuery } from '@iblai/data-layer';
+import { WithFormPermissions } from '@iblai/web-utils';
+import { useT } from '../../i18n/context.js';
+import '../../packages/i18n/dist/index.esm.js';
+import { Button } from '../ui/button.js';
+import { Input } from '../ui/input.js';
+import { Label } from '../ui/label.js';
+import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogDescription, DialogFooter } from '../ui/dialog.js';
+import { Textarea } from '../ui/textarea.js';
+import { Switch } from '../ui/switch.js';
+import { TooltipProvider, Tooltip, TooltipTrigger, TooltipContent } from '../ui/tooltip.js';
+import { Select, SelectTrigger, SelectValue, SelectContent, SelectItem } from '../ui/select.js';
+import { MentorSelectionGrid } from '../mentors/mentor-selection-grid.js';
+import { AgentSettingsProvider } from '../modals/edit-mentor-modal/agent-settings-context.js';
+import { AgentDatasetsTab } from '../modals/edit-mentor-modal/tabs/datasets-tab.js';
+import { McpTab } from '../modals/edit-mentor-modal/tabs/mcp-tab/index.js';
+import { useToggleTools } from '../modals/edit-mentor-modal/tabs/tools-tab/use-toggle-tools.js';
+import { useCopyToClipboard } from '../chat/markdown/use-copy-to-clipboard.js';
+import { ActionTooltip } from './action-tooltip.js';
+import { parseVariableDefault, EXPRESSION_EXAMPLES, WHILE_DEFAULT_MAX_ITERATIONS, isValidVariableName } from './workflow-definition.js';
+import Check from '../../node_modules/.pnpm/lucide-react@0.528.0_react@19.1.0/node_modules/lucide-react/dist/esm/icons/check.js';
+import Copy from '../../node_modules/.pnpm/lucide-react@0.528.0_react@19.1.0/node_modules/lucide-react/dist/esm/icons/copy.js';
+import X from '../../node_modules/.pnpm/lucide-react@0.528.0_react@19.1.0/node_modules/lucide-react/dist/esm/icons/x.js';
+import Trash2 from '../../node_modules/.pnpm/lucide-react@0.528.0_react@19.1.0/node_modules/lucide-react/dist/esm/icons/trash-2.js';
+import Plus from '../../node_modules/.pnpm/lucide-react@0.528.0_react@19.1.0/node_modules/lucide-react/dist/esm/icons/plus.js';
+import Info from '../../node_modules/.pnpm/lucide-react@0.528.0_react@19.1.0/node_modules/lucide-react/dist/esm/icons/info.js';
+import Settings from '../../node_modules/.pnpm/lucide-react@0.528.0_react@19.1.0/node_modules/lucide-react/dist/esm/icons/settings.js';
+import Plug from '../../node_modules/.pnpm/lucide-react@0.528.0_react@19.1.0/node_modules/lucide-react/dist/esm/icons/plug.js';
+import Cable from '../../node_modules/.pnpm/lucide-react@0.528.0_react@19.1.0/node_modules/lucide-react/dist/esm/icons/cable.js';
+
+const INPUT_VARIABLES = [{ id: '1', name: 'input', type: 'string' }];
+const VARIABLE_TYPES = ['String', 'Number', 'Boolean', 'Object', 'List'];
+// Blank first rows are only shown, never saved, until the user types in them.
+const blankCondition = () => [{ id: '1', caseName: '', expression: '' }];
+const blankTransformRow = () => [{ id: '1', target: '', expression: '' }];
+const blankAssignment = () => [{ id: '1', variable: '', expression: '' }];
+const DEFAULT_INSTRUCTIONS = 'You are a helpful assistant.';
+const DEFAULT_MENTOR_LABELS = new Set([
+    'my agent',
+    'agent',
+    'agent node',
+    'my mentor',
+    'mentor',
+    'mentor node',
+]);
+const isDefaultMentorLabel = (label) => {
+    if (!label)
+        return true;
+    return DEFAULT_MENTOR_LABELS.has(label.trim().toLowerCase());
+};
+function NodeConfigPanel({ nodeId, nodeType, nodeData, onClose, onUpdateNode, onDeleteNode, workflowVariables = [], stepReferences = [], variableUsages = {}, org, defaultMentorId, username, agentSettings, }) {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y;
+    const t = useT();
+    const [nodeName, setNodeName] = useState(nodeData.label);
+    const [instructions, setInstructions] = useState((_a = nodeData.instructions) !== null && _a !== void 0 ? _a : DEFAULT_INSTRUCTIONS);
+    const [model, setModel] = useState((_b = nodeData.model) !== null && _b !== void 0 ? _b : '');
+    const [continueOnError, setContinueOnError] = useState((_c = nodeData.continueOnError) !== null && _c !== void 0 ? _c : false);
+    const [stateVariables, setStateVariables] = useState((_d = nodeData.stateVariables) !== null && _d !== void 0 ? _d : []);
+    // Track if we're in the middle of a local update to avoid sync loops
+    const isLocalUpdate = useRef(false);
+    // Sync state with props when nodeData changes from external source
+    // This handles cases where the workflow is reloaded from API
+    useEffect(() => {
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
+        if (isLocalUpdate.current) {
+            isLocalUpdate.current = false;
+            return;
+        }
+        setNodeName(nodeData.label);
+        setInstructions((_a = nodeData.instructions) !== null && _a !== void 0 ? _a : DEFAULT_INSTRUCTIONS);
+        setModel((_b = nodeData.model) !== null && _b !== void 0 ? _b : '');
+        setContinueOnError((_c = nodeData.continueOnError) !== null && _c !== void 0 ? _c : false);
+        setStateVariables((_d = nodeData.stateVariables) !== null && _d !== void 0 ? _d : []);
+        setConditions(((_e = nodeData.conditions) === null || _e === void 0 ? void 0 : _e.length) ? nodeData.conditions : blankCondition());
+        setWhileCondition((_f = nodeData.condition) !== null && _f !== void 0 ? _f : '');
+        setMaxIterations((_h = (_g = nodeData.maxIterations) === null || _g === void 0 ? void 0 : _g.toString()) !== null && _h !== void 0 ? _h : '');
+        setUserApprovalMessage((_j = nodeData.userApprovalMessage) !== null && _j !== void 0 ? _j : '');
+        setTransformExpressions(((_k = nodeData.expressions) === null || _k === void 0 ? void 0 : _k.length) ? nodeData.expressions : blankTransformRow());
+        setAssignments(((_l = nodeData.assignments) === null || _l === void 0 ? void 0 : _l.length) ? nodeData.assignments : blankAssignment());
+        setMaxIterationsBadInput(false);
+        setMcpConnectors((_m = nodeData.mcpConnectors) !== null && _m !== void 0 ? _m : []);
+        setDatasetId((_o = nodeData.datasetId) !== null && _o !== void 0 ? _o : '');
+        setDatasetName((_p = nodeData.datasetName) !== null && _p !== void 0 ? _p : '');
+        setMaxResults((_q = nodeData.maxResults) !== null && _q !== void 0 ? _q : 10);
+        setFileSearchQuery((_r = nodeData.fileSearchQuery) !== null && _r !== void 0 ? _r : '');
+    }, [nodeData]);
+    const [showAddModal, setShowAddModal] = useState(false);
+    const [selectedType, setSelectedType] = useState('String');
+    const [newVarName, setNewVarName] = useState('');
+    const [newVarDefault, setNewVarDefault] = useState('');
+    const [showMentorModal, setShowMentorModal] = useState(false);
+    const [mentorSearchQuery, setMentorSearchQuery] = useState('');
+    const [conditions, setConditions] = useState(((_e = nodeData.conditions) === null || _e === void 0 ? void 0 : _e.length) ? nodeData.conditions : blankCondition());
+    const [whileCondition, setWhileCondition] = useState((_f = nodeData.condition) !== null && _f !== void 0 ? _f : '');
+    const [maxIterations, setMaxIterations] = useState((_h = (_g = nodeData.maxIterations) === null || _g === void 0 ? void 0 : _g.toString()) !== null && _h !== void 0 ? _h : '');
+    const [userApprovalMessage, setUserApprovalMessage] = useState((_j = nodeData.userApprovalMessage) !== null && _j !== void 0 ? _j : '');
+    const [transformExpressions, setTransformExpressions] = useState(((_k = nodeData.expressions) === null || _k === void 0 ? void 0 : _k.length) ? nodeData.expressions : blankTransformRow());
+    const [assignments, setAssignments] = useState(((_l = nodeData.assignments) === null || _l === void 0 ? void 0 : _l.length) ? nodeData.assignments : blankAssignment());
+    const [newVariableRowId, setNewVariableRowId] = useState(null);
+    const [newVariableName, setNewVariableName] = useState('');
+    const [showConnectorManagement, setShowConnectorManagement] = useState(false);
+    const [mcpConnectors, setMcpConnectors] = useState((_m = nodeData.mcpConnectors) !== null && _m !== void 0 ? _m : []);
+    const [datasetId, setDatasetId] = useState((_o = nodeData.datasetId) !== null && _o !== void 0 ? _o : '');
+    const [datasetName, setDatasetName] = useState((_p = nodeData.datasetName) !== null && _p !== void 0 ? _p : '');
+    const [maxResults, setMaxResults] = useState((_q = nodeData.maxResults) !== null && _q !== void 0 ? _q : 10);
+    const [fileSearchQuery, setFileSearchQuery] = useState((_r = nodeData.fileSearchQuery) !== null && _r !== void 0 ? _r : '');
+    const [showDatasetDialog, setShowDatasetDialog] = useState(false);
+    const pickerSettings = {
+        tenantKey: org !== null && org !== void 0 ? org : '',
+        mentorId: defaultMentorId !== null && defaultMentorId !== void 0 ? defaultMentorId : '',
+        username: username !== null && username !== void 0 ? username : '',
+        enableRBAC: (_s = agentSettings === null || agentSettings === void 0 ? void 0 : agentSettings.enableRBAC) !== null && _s !== void 0 ? _s : false,
+        rbacPermissions: agentSettings === null || agentSettings === void 0 ? void 0 : agentSettings.rbacPermissions,
+        executeGatedAction: agentSettings === null || agentSettings === void 0 ? void 0 : agentSettings.executeGatedAction,
+        dmUrl: agentSettings === null || agentSettings === void 0 ? void 0 : agentSettings.dmUrl,
+    };
+    const selectedMentorId = (_t = nodeData.mentor_id) !== null && _t !== void 0 ? _t : nodeData.entry_mentor_id;
+    const shouldFetchMentorSettings = Boolean(nodeType === 'mentor' && selectedMentorId && org && username);
+    const { data: mentorSettings, isLoading: isMentorSettingsLoading } = useGetMentorSettingsQuery({
+        mentor: selectedMentorId !== null && selectedMentorId !== void 0 ? selectedMentorId : '',
+        org: org !== null && org !== void 0 ? org : '',
+    }, { skip: !shouldFetchMentorSettings });
+    const { data: tools, isLoading: isToolsLoading } = useGetToolsQuery({
+        mentor: selectedMentorId !== null && selectedMentorId !== void 0 ? selectedMentorId : '',
+        org: org !== null && org !== void 0 ? org : '',
+    }, { skip: !shouldFetchMentorSettings });
+    const mentorToolSlugs = Array.isArray(mentorSettings === null || mentorSettings === void 0 ? void 0 : mentorSettings.mentor_tools)
+        ? mentorSettings === null || mentorSettings === void 0 ? void 0 : mentorSettings.mentor_tools.map((tool) => tool === null || tool === void 0 ? void 0 : tool.slug).filter((slug) => Boolean(slug))
+        : [];
+    const { toggleTools, isLoading: isToggleToolsLoading } = useToggleTools({
+        tools: mentorToolSlugs,
+        activeMentorId: selectedMentorId !== null && selectedMentorId !== void 0 ? selectedMentorId : '',
+        tenantKey: org !== null && org !== void 0 ? org : '',
+        username: username !== null && username !== void 0 ? username : '',
+    });
+    const isToolsDisabled = !selectedMentorId ||
+        !org ||
+        !username ||
+        isMentorSettingsLoading ||
+        isToolsLoading ||
+        isToggleToolsLoading;
+    const forceMentorPrefill = useRef(false);
+    const updateNodeConfig = useCallback((updates) => {
+        if (onUpdateNode) {
+            // Mark that this is a local update to prevent sync effect from resetting state
+            isLocalUpdate.current = true;
+            onUpdateNode(nodeId, updates);
+        }
+    }, [nodeId, onUpdateNode]);
+    useEffect(() => {
+        if (nodeType !== 'mentor' || !mentorSettings)
+            return;
+        const mentorName = mentorSettings.mentor_name || mentorSettings.display_name || nodeData.label;
+        const mentorPrompt = mentorSettings.system_prompt;
+        const mentorModel = mentorSettings.llm_name;
+        const forcePrefill = forceMentorPrefill.current;
+        const updates = {};
+        if (mentorName && (forcePrefill || isDefaultMentorLabel(nodeData.label))) {
+            if (mentorName !== nodeData.label) {
+                setNodeName(mentorName);
+                updates.label = mentorName;
+            }
+        }
+        if (mentorPrompt &&
+            (forcePrefill || !nodeData.instructions || nodeData.instructions === DEFAULT_INSTRUCTIONS)) {
+            if (mentorPrompt !== nodeData.instructions) {
+                setInstructions(mentorPrompt);
+                updates.instructions = mentorPrompt;
+            }
+        }
+        if (mentorModel && mentorModel !== nodeData.model) {
+            setModel(mentorModel);
+            updates.model = mentorModel;
+        }
+        if (Object.keys(updates).length > 0) {
+            updateNodeConfig(updates);
+        }
+        if (forcePrefill) {
+            forceMentorPrefill.current = false;
+        }
+    }, [
+        mentorSettings,
+        nodeType,
+        nodeData.label,
+        nodeData.instructions,
+        nodeData.model,
+        updateNodeConfig,
+    ]);
+    const newVarNameTrimmed = newVarName.trim();
+    const newVarNameInvalid = newVarNameTrimmed !== '' && !isValidVariableName(newVarNameTrimmed);
+    const newVarNameTaken = stateVariables.some((variable) => variable.name === newVarNameTrimmed);
+    const parsedNewVarDefault = parseVariableDefault(selectedType.toLowerCase(), newVarDefault);
+    const canSaveVariable = newVarNameTrimmed !== '' && !newVarNameInvalid && !newVarNameTaken && parsedNewVarDefault.ok;
+    const defaultValueError = parsedNewVarDefault.ok
+        ? null
+        : selectedType === 'Number'
+            ? t('workflowsNodeConfigPanel.invalidNumberDefault')
+            : selectedType === 'List'
+                ? t('workflowsNodeConfigPanel.invalidListDefault')
+                : t('workflowsNodeConfigPanel.invalidObjectDefault');
+    const handleSaveVariable = () => {
+        if (!canSaveVariable || !parsedNewVarDefault.ok)
+            return;
+        const newVar = {
+            id: Date.now().toString(),
+            name: newVarNameTrimmed,
+            type: selectedType.toLowerCase(),
+            defaultValue: parsedNewVarDefault.value,
+        };
+        const newStateVariables = [...stateVariables, newVar];
+        setStateVariables(newStateVariables);
+        updateNodeConfig({ stateVariables: newStateVariables });
+        setShowAddModal(false);
+        setNewVarName('');
+        setNewVarDefault('');
+        setSelectedType('String');
+    };
+    // The variable stays set after closing so the dialog keeps its text while
+    // it animates out.
+    const [variablePendingDelete, setVariablePendingDelete] = useState(null);
+    const [isDeleteVariableOpen, setIsDeleteVariableOpen] = useState(false);
+    const pendingDeleteUsages = variablePendingDelete
+        ? ((_u = variableUsages[variablePendingDelete.name]) !== null && _u !== void 0 ? _u : [])
+        : [];
+    const handleRemoveVariable = (id) => {
+        const newStateVariables = stateVariables.filter((v) => v.id !== id);
+        setStateVariables(newStateVariables);
+        updateNodeConfig({ stateVariables: newStateVariables });
+    };
+    const handleNameChange = (newName) => {
+        setNodeName(newName);
+        updateNodeConfig({ label: newName });
+    };
+    const handleMentorSelect = (mentor) => {
+        const mentorId = mentor.unique_id;
+        if (!mentorId)
+            return;
+        forceMentorPrefill.current = true;
+        const updates = {
+            entry_mentor_id: mentorId,
+            mentor_id: mentorId,
+        };
+        if (mentor.name) {
+            setNodeName(mentor.name);
+            updates.label = mentor.name;
+        }
+        updateNodeConfig(updates);
+        setShowMentorModal(false);
+        setMentorSearchQuery('');
+    };
+    const handleAddCondition = () => {
+        const newCondition = {
+            id: Date.now().toString(),
+            caseName: '',
+            expression: '',
+        };
+        const newConditions = [...conditions, newCondition];
+        setConditions(newConditions);
+        updateNodeConfig({
+            conditions: newConditions,
+            conditionCount: newConditions.length,
+        });
+    };
+    const handleRemoveCondition = (id) => {
+        const newConditions = conditions.filter((c) => c.id !== id);
+        setConditions(newConditions);
+        updateNodeConfig({
+            conditions: newConditions,
+            conditionCount: newConditions.length,
+        });
+    };
+    const handleUpdateCondition = (id, updates) => {
+        const newConditions = conditions.map((c) => (c.id === id ? { ...c, ...updates } : c));
+        setConditions(newConditions);
+        updateNodeConfig({ conditions: newConditions });
+    };
+    const handleAddTransformExpression = () => {
+        const newExpressions = [
+            ...transformExpressions,
+            { id: Date.now().toString(), target: '', expression: '' },
+        ];
+        setTransformExpressions(newExpressions);
+        updateNodeConfig({ expressions: newExpressions });
+    };
+    const handleRemoveTransformExpression = (id) => {
+        if (transformExpressions.length > 1) {
+            const newExpressions = transformExpressions.filter((e) => e.id !== id);
+            setTransformExpressions(newExpressions);
+            updateNodeConfig({ expressions: newExpressions });
+        }
+    };
+    const handleUpdateTransformExpression = (id, updates) => {
+        const newExpressions = transformExpressions.map((e) => e.id === id ? { ...e, ...updates } : e);
+        setTransformExpressions(newExpressions);
+        updateNodeConfig({ expressions: newExpressions });
+    };
+    const handleAddAssignment = () => {
+        const newAssignments = [
+            ...assignments,
+            { id: Date.now().toString(), variable: '', expression: '' },
+        ];
+        setAssignments(newAssignments);
+        updateNodeConfig({ assignments: newAssignments });
+    };
+    const handleRemoveAssignment = (id) => {
+        if (assignments.length > 1) {
+            const newAssignments = assignments.filter((a) => a.id !== id);
+            setAssignments(newAssignments);
+            updateNodeConfig({ assignments: newAssignments });
+        }
+    };
+    const handleUpdateAssignment = (id, updates) => {
+        const newAssignments = assignments.map((a) => (a.id === id ? { ...a, ...updates } : a));
+        setAssignments(newAssignments);
+        updateNodeConfig({ assignments: newAssignments });
+    };
+    const newVariableNameTrimmed = newVariableName.trim();
+    const canAddNewVariable = isValidVariableName(newVariableNameTrimmed);
+    const closeNewVariableDialog = () => {
+        setNewVariableRowId(null);
+        setNewVariableName('');
+    };
+    const handleAddNewVariable = () => {
+        if (!newVariableRowId || !canAddNewVariable)
+            return;
+        handleUpdateAssignment(newVariableRowId, {
+            variable: newVariableNameTrimmed,
+        });
+        closeNewVariableDialog();
+    };
+    const handleRemoveConnector = (connectorId) => {
+        const newConnectors = mcpConnectors.filter((c) => c.id !== connectorId);
+        setMcpConnectors(newConnectors);
+        updateNodeConfig({ mcpConnectors: newConnectors });
+    };
+    const handleInstructionsChange = (value) => {
+        setInstructions(value);
+        updateNodeConfig({ instructions: value });
+    };
+    const handleContinueOnErrorChange = (value) => {
+        setContinueOnError(value);
+        updateNodeConfig({ continueOnError: value });
+    };
+    // An empty condition passes validation and ends the loop at once, so it is
+    // left out to get the backend's "missing required field" error instead.
+    const handleWhileConditionChange = (value) => {
+        setWhileCondition(value);
+        updateNodeConfig({ condition: value.trim() ? value : undefined });
+    };
+    // The backend rejects anything but a positive whole number; leaving it out
+    // falls back to its default instead of failing validation. Huge values
+    // serialize as 1e+21, which the backend reads as a float.
+    const toMaxIterations = (value) => {
+        const parsed = Number(value);
+        return value.trim() !== '' && Number.isSafeInteger(parsed) && parsed >= 1 ? parsed : undefined;
+    };
+    // A number field reports letters as an empty value; validity.badInput is
+    // the only sign they were typed.
+    const [maxIterationsBadInput, setMaxIterationsBadInput] = useState(false);
+    const maxIterationsInvalid = maxIterationsBadInput ||
+        (maxIterations.trim() !== '' && toMaxIterations(maxIterations) === undefined);
+    const handleMaxIterationsChange = (value, badInput = false) => {
+        setMaxIterations(value);
+        setMaxIterationsBadInput(badInput);
+        updateNodeConfig({ maxIterations: toMaxIterations(value) });
+    };
+    const [copiedStepId, setCopiedStepId] = useState(null);
+    const { copy: copyToClipboard, status: copyStatus } = useCopyToClipboard(1500);
+    const copyStepReference = async (id) => {
+        await copyToClipboard(`step_results['${id}']`);
+        setCopiedStepId(id);
+    };
+    const handleUserApprovalMessageChange = (value) => {
+        setUserApprovalMessage(value);
+        updateNodeConfig({ userApprovalMessage: value });
+    };
+    const panelHeader = (description) => (jsxs("div", { className: "flex items-start justify-between", children: [jsxs("div", { className: "flex-1", children: [jsx("h3", { className: "text-foreground mb-0.5 text-base font-semibold", children: nodeData.label }), jsx("p", { className: "text-muted-foreground text-[11px]", children: description })] }), jsxs("div", { className: "flex items-center gap-0.5", children: [onDeleteNode && (jsx(ActionTooltip, { label: t('workflowsNodeConfigPanel.deleteNodeLabel', { label: nodeData.label }), children: jsx(Button, { variant: "ghost", size: "icon", className: "h-6 w-6", "aria-label": t('workflowsNodeConfigPanel.deleteNodeLabel', { label: nodeData.label }), onClick: onDeleteNode, children: jsx(Trash2, { className: "text-muted-foreground h-3 w-3" }) }) })), jsx(Button, { variant: "ghost", size: "icon", className: "h-6 w-6", "aria-label": t('workflowsNodeConfigPanel.closeLabel'), onClick: onClose, children: jsx(X, { className: "text-muted-foreground h-3 w-3" }) })] })] }));
+    const expressionHint = (jsxs(Fragment, { children: [jsx("p", { className: "text-muted-foreground text-[10px]", children: t('workflowsNodeConfigPanel.expressionHint') }), stepReferences.length > 0 && (jsxs("div", { className: "space-y-1", children: [jsx("h4", { className: "text-foreground text-[11px] font-medium", children: t('workflowsNodeConfigPanel.stepIdsLabel') }), stepReferences.map((step) => (jsxs("div", { className: "bg-muted/50 border-border flex items-center justify-between gap-2 rounded-lg border p-1.5", children: [jsxs("div", { className: "min-w-0", children: [jsx("p", { className: "text-foreground truncate text-xs", children: step.label }), jsx("p", { id: `${nodeId}-step-ref-${step.id}`, className: "text-muted-foreground truncate font-mono text-[10px]", children: step.id })] }), jsx(ActionTooltip, { label: t('workflowsNodeConfigPanel.copyStepReference', { label: step.label }), children: jsx(Button, { variant: "ghost", size: "icon", className: "h-5 w-5 shrink-0", "aria-label": t('workflowsNodeConfigPanel.copyStepReference', {
+                                        label: step.label,
+                                    }), "aria-describedby": `${nodeId}-step-ref-${step.id}`, onClick: () => void copyStepReference(step.id), children: copyStatus === 'success' && copiedStepId === step.id ? (jsx(Check, { className: "text-muted-foreground h-3 w-3" })) : (jsx(Copy, { className: "text-muted-foreground h-3 w-3" })) }) })] }, step.id)))] }))] }));
+    if (nodeType === 'start') {
+        return (jsxs(Fragment, { children: [jsx("div", { "data-testid": "workflow-node-panel", className: "bg-card border-border absolute top-4 right-4 z-20 flex max-h-[calc(100vh-14rem)] w-[320px] flex-col rounded-xl border shadow-xl", onClick: (e) => e.stopPropagation(), onMouseDown: (e) => e.stopPropagation(), children: jsxs("div", { className: "flex-1 space-y-2 overflow-y-auto p-3", children: [jsxs("div", { className: "flex items-start justify-between", children: [jsxs("div", { className: "flex-1", children: [jsx("h3", { className: "text-foreground mb-0.5 text-base font-semibold", children: t('workflowsNodeConfigPanel.startTitle') }), jsx("p", { className: "text-muted-foreground text-xs", children: t('workflowsNodeConfigPanel.startDescription') })] }), jsx(Button, { variant: "ghost", size: "icon", className: "h-5 w-5", "aria-label": t('workflowsNodeConfigPanel.closeLabel'), onClick: onClose, children: jsx(X, { className: "h-3 w-3" }) })] }), jsxs("div", { className: "space-y-1.5", children: [jsx("h4", { className: "text-foreground text-xs font-medium", children: t('workflowsNodeConfigPanel.inputVariables') }), jsx("div", { className: "space-y-1", children: INPUT_VARIABLES.map((variable) => (jsxs("div", { className: "bg-muted/50 border-border flex items-center justify-between rounded-lg border p-1.5", children: [jsxs("div", { className: "flex items-center gap-1.5", children: [jsx("div", { className: "flex h-3.5 w-3.5 items-center justify-center rounded bg-green-500/20", children: jsx("span", { className: "font-mono text-[10px] text-green-500", children: "=" }) }), jsx("span", { className: "text-foreground font-mono text-xs", children: variable.name })] }), jsx("span", { className: "text-muted-foreground text-xs", children: variable.type })] }, variable.id))) })] }), jsxs("div", { className: "space-y-1.5", children: [jsx("h4", { className: "text-foreground text-xs font-medium", children: t('workflowsNodeConfigPanel.stateVariables') }), jsx("div", { className: "space-y-1", children: stateVariables.map((variable) => (jsxs("div", { className: "bg-muted/50 border-border flex items-center justify-between rounded-lg border p-1.5", children: [jsxs("div", { className: "flex items-center gap-1.5", children: [jsx("div", { className: "flex h-3.5 w-3.5 items-center justify-center rounded bg-purple-500/20", children: jsx("span", { className: "font-mono text-[10px] text-purple-500", children: "$" }) }), jsx("span", { className: "text-foreground font-mono text-xs", children: variable.name })] }), jsxs("div", { className: "flex items-center gap-1", children: [jsx("span", { className: "text-muted-foreground text-xs", children: variable.type }), jsx(ActionTooltip, { label: t('workflowsNodeConfigPanel.removeItemLabel', {
+                                                                name: variable.name,
+                                                            }), children: jsx(Button, { variant: "ghost", size: "icon", className: "h-4 w-4", "aria-label": t('workflowsNodeConfigPanel.removeItemLabel', {
+                                                                    name: variable.name,
+                                                                }), onClick: () => {
+                                                                    setVariablePendingDelete(variable);
+                                                                    setIsDeleteVariableOpen(true);
+                                                                }, children: jsx(Trash2, { className: "text-muted-foreground h-2.5 w-2.5" }) }) })] })] }, variable.id))) }), jsxs(Button, { variant: "secondary", size: "sm", className: "h-7 w-full gap-1.5 text-xs has-[>svg]:px-2.5", onClick: () => setShowAddModal(true), children: [jsx(Plus, { className: "mr-1 h-3 w-3" }), t('workflowsNodeConfigPanel.addButton')] })] })] }) }), jsx(Dialog, { open: isDeleteVariableOpen, onOpenChange: setIsDeleteVariableOpen, children: jsx(DialogContent, { onClick: (e) => e.stopPropagation(), onMouseDown: (e) => e.stopPropagation(), children: pendingDeleteUsages.length > 0 ? (jsxs(Fragment, { children: [jsxs(DialogHeader, { className: "space-y-3", children: [jsx(DialogTitle, { className: "ibl-dialog-title", children: t('workflowsNodeConfigPanel.variableInUseTitle') }), jsx(DialogDescription, { className: "text-gray-600 text-sm pt-2", children: t('workflowsNodeConfigPanel.variableInUseDescription', {
+                                                name: (_v = variablePendingDelete === null || variablePendingDelete === void 0 ? void 0 : variablePendingDelete.name) !== null && _v !== void 0 ? _v : '',
+                                            }) })] }), jsx("ul", { className: "text-foreground list-disc space-y-1 pl-5 text-sm", children: pendingDeleteUsages.map((step) => (jsx("li", { children: step.label }, step.id))) }), jsx(DialogFooter, { className: "gap-2 sm:gap-0 mt-4", children: jsx(Button, { type: "button", className: "ibl-button-primary", onClick: () => setIsDeleteVariableOpen(false), children: t('workflowsNodeConfigPanel.cancelButton') }) })] })) : (jsxs(Fragment, { children: [jsxs(DialogHeader, { className: "space-y-3", children: [jsx(DialogTitle, { className: "ibl-dialog-title", children: t('workflowsNodeConfigPanel.deleteVariableTitle') }), jsx(DialogDescription, { className: "text-gray-600 text-sm pt-2", children: t('workflowsNodeConfigPanel.deleteVariableDescription', {
+                                                name: (_w = variablePendingDelete === null || variablePendingDelete === void 0 ? void 0 : variablePendingDelete.name) !== null && _w !== void 0 ? _w : '',
+                                            }) })] }), jsxs(DialogFooter, { className: "gap-2 sm:gap-0 mt-4", children: [jsx(Button, { type: "button", variant: "outline", onClick: () => setIsDeleteVariableOpen(false), children: t('workflowsNodeConfigPanel.cancelButton') }), jsx(Button, { type: "button", className: "ibl-button-primary", onClick: () => {
+                                                if (variablePendingDelete) {
+                                                    handleRemoveVariable(variablePendingDelete.id);
+                                                }
+                                                setIsDeleteVariableOpen(false);
+                                            }, children: t('workflowsNodeConfigPanel.deleteButton') })] })] })) }) }), jsx(Dialog, { open: showAddModal, onOpenChange: setShowAddModal, children: jsxs(DialogContent, { className: "bg-card w-[calc(100%-2rem)] rounded-lg sm:max-w-[500px]", onClick: (e) => e.stopPropagation(), onMouseDown: (e) => e.stopPropagation(), children: [jsx(DialogHeader, { children: jsx(DialogTitle, { className: "sr-only", children: t('workflowsNodeConfigPanel.addStateVariableDialogTitle') }) }), jsxs("div", { className: "space-y-6 pt-4", children: [jsx("div", { className: "bg-muted flex gap-2 rounded-lg p-1", children: VARIABLE_TYPES.map((type) => (jsx("button", { type: "button", onClick: () => {
+                                                setSelectedType(type);
+                                                // Reset default value when type changes to avoid invalid data
+                                                if (type === 'Boolean') {
+                                                    setNewVarDefault('false');
+                                                }
+                                                else if (type === 'Number') {
+                                                    setNewVarDefault('');
+                                                }
+                                                else if (type === 'Object') {
+                                                    setNewVarDefault('{}');
+                                                }
+                                                else if (type === 'List') {
+                                                    setNewVarDefault('[]');
+                                                }
+                                                else {
+                                                    setNewVarDefault('');
+                                                }
+                                            }, className: `flex-1 rounded-md px-4 py-2 text-sm font-medium transition-colors ${selectedType === type
+                                                ? 'bg-background text-foreground shadow-sm'
+                                                : 'text-muted-foreground hover:text-foreground'}`, children: type }, type))) }), jsxs("div", { className: "space-y-2", children: [jsx(Label, { htmlFor: "var-name", className: "text-sm font-medium", children: t('workflowsNodeConfigPanel.nameLabel') }), jsx(Input, { id: "var-name", placeholder: t('workflowsNodeConfigPanel.variableNamePlaceholder'), value: newVarName, onChange: (e) => setNewVarName(e.target.value), "aria-invalid": newVarNameInvalid || newVarNameTaken, className: "bg-muted border-border" }), jsx("p", { className: `text-xs ${newVarNameInvalid || newVarNameTaken ? 'text-destructive' : 'text-muted-foreground'}`, children: newVarNameTaken
+                                                    ? t('workflowsNodeConfigPanel.variableNameTaken')
+                                                    : t('workflowsNodeConfigPanel.variableNameHint') })] }), jsxs("div", { className: "space-y-2", children: [jsxs(Label, { htmlFor: "var-default", className: "text-sm font-medium", children: [t('workflowsNodeConfigPanel.defaultValueLabel'), ' ', jsx("span", { className: "text-muted-foreground font-normal", children: t('workflowsNodeConfigPanel.defaultValueOptional') })] }), selectedType === 'Boolean' ? (jsxs("div", { className: "bg-muted border-border flex items-center gap-3 rounded-lg border p-3", children: [jsx(Switch, { id: "var-default", checked: newVarDefault === 'true', onCheckedChange: (checked) => setNewVarDefault(checked ? 'true' : 'false') }), jsx("span", { className: "text-muted-foreground text-sm", children: newVarDefault === 'true'
+                                                            ? t('workflowsNodeConfigPanel.booleanTrue')
+                                                            : t('workflowsNodeConfigPanel.booleanFalse') })] })) : selectedType === 'Number' ? (jsx(Input, { id: "var-default", type: "number", placeholder: "0", value: newVarDefault, onChange: (e) => setNewVarDefault(e.target.value), className: "bg-muted border-border" })) : selectedType === 'Object' ? (jsx(Textarea, { id: "var-default", placeholder: '{ "key": "value" }', value: newVarDefault, onChange: (e) => setNewVarDefault(e.target.value), className: "bg-muted border-border min-h-[100px] font-mono text-sm" })) : selectedType === 'List' ? (jsx(Textarea, { id: "var-default", placeholder: '["item1", "item2"]', value: newVarDefault, onChange: (e) => setNewVarDefault(e.target.value), className: "bg-muted border-border min-h-[100px] font-mono text-sm" })) : (jsx(Input, { id: "var-default", placeholder: t('workflowsNodeConfigPanel.defaultValueStringPlaceholder'), value: newVarDefault, onChange: (e) => setNewVarDefault(e.target.value), className: "bg-muted border-border" })), defaultValueError && (jsx("p", { className: "text-destructive text-xs", children: defaultValueError }))] }), jsx("div", { className: "flex justify-end", children: jsx(Button, { onClick: handleSaveVariable, disabled: !canSaveVariable, className: "bg-background hover:bg-muted text-foreground border-border h-9 border", children: t('workflowsNodeConfigPanel.saveButton') }) })] })] }) })] }));
+    }
+    if (nodeType === 'mentor') {
+        const modelDisplay = (mentorSettings === null || mentorSettings === void 0 ? void 0 : mentorSettings.llm_provider)
+            ? `${mentorSettings.llm_provider}${model ? ` · ${model}` : ''}`
+            : model;
+        const enabledToolSlugs = new Set(mentorToolSlugs);
+        return (jsxs(Fragment, { children: [jsx("div", { "data-testid": "workflow-node-panel", className: "bg-card border-border absolute top-4 right-4 z-[22] flex max-h-[calc(100vh-14rem)] w-[320px] flex-col rounded-xl border shadow-xl", onClick: (e) => e.stopPropagation(), onMouseDown: (e) => e.stopPropagation(), children: jsxs("div", { className: "flex-1 space-y-2 overflow-y-auto p-3", children: [panelHeader(t('workflowsNodeConfigPanel.mentorDescription')), jsxs("div", { className: "space-y-1", children: [jsxs("div", { className: "flex items-center justify-between", children: [jsx(Label, { className: "text-foreground text-[11px] font-medium", children: t('workflowsNodeConfigPanel.nameLabel') }), jsx(Button, { variant: "ghost", size: "sm", className: "h-6 px-2 text-[11px]", onClick: () => setShowMentorModal(true), children: selectedMentorId
+                                                    ? t('workflowsNodeConfigPanel.changeButton')
+                                                    : t('workflowsNodeConfigPanel.selectButton') })] }), jsx(Input, { value: nodeName, onChange: (e) => handleNameChange(e.target.value), className: "bg-muted border-border h-8 text-sm" }), !selectedMentorId && (jsx("p", { className: "text-muted-foreground text-[10px]", children: t('workflowsNodeConfigPanel.selectAgentHint') }))] }), jsxs("div", { className: "space-y-1", children: [jsx(Label, { className: "text-foreground text-[11px] font-medium", children: t('workflowsNodeConfigPanel.instructionsLabel') }), jsx(Textarea, { value: instructions, onChange: (e) => handleInstructionsChange(e.target.value), className: "bg-muted border-border min-h-[80px] resize-none text-xs" })] }), jsxs("div", { className: "space-y-1", children: [jsx(Label, { className: "text-foreground text-[11px] font-medium", children: t('workflowsNodeConfigPanel.modelLabel') }), jsx(Input, { value: modelDisplay, readOnly: true, placeholder: selectedMentorId
+                                            ? isMentorSettingsLoading
+                                                ? t('workflowsNodeConfigPanel.loadingModelPlaceholder')
+                                                : t('workflowsNodeConfigPanel.noModelConfiguredPlaceholder')
+                                            : t('workflowsNodeConfigPanel.selectAgentModelPlaceholder'), className: "bg-muted border-border h-8 text-sm" })] }), jsxs("div", { className: "space-y-1", children: [jsx(Label, { className: "text-foreground text-[11px] font-medium", children: t('workflowsNodeConfigPanel.toolsLabel') }), !selectedMentorId && (jsx("p", { className: "text-muted-foreground text-[10px]", children: t('workflowsNodeConfigPanel.selectAgentToolsHint') })), selectedMentorId && (isToolsLoading || isMentorSettingsLoading) && (jsx("p", { className: "text-muted-foreground text-[10px]", children: t('workflowsNodeConfigPanel.loadingTools') })), selectedMentorId && !isToolsLoading && (tools === null || tools === void 0 ? void 0 : tools.length) === 0 && (jsx("p", { className: "text-muted-foreground text-[10px]", children: t('workflowsNodeConfigPanel.noToolsAvailable') })), selectedMentorId && !isToolsLoading && (tools === null || tools === void 0 ? void 0 : tools.length) ? (jsx(WithFormPermissions, { name: "mentor_tools", 
+                                        // @ts-ignore
+                                        permissions: (_x = mentorSettings === null || mentorSettings === void 0 ? void 0 : mentorSettings.permissions) === null || _x === void 0 ? void 0 : _x.field, enableRBAC: (_y = agentSettings === null || agentSettings === void 0 ? void 0 : agentSettings.enableRBAC) !== null && _y !== void 0 ? _y : false, children: ({ disabled }) => (jsx("div", { className: "space-y-1", children: tools === null || tools === void 0 ? void 0 : tools.map((tool) => {
+                                                var _a;
+                                                const slug = (_a = tool === null || tool === void 0 ? void 0 : tool.slug) !== null && _a !== void 0 ? _a : '';
+                                                const toolLabel = (tool === null || tool === void 0 ? void 0 : tool.display_name) ||
+                                                    (tool === null || tool === void 0 ? void 0 : tool.name) ||
+                                                    t('workflowsNodeConfigPanel.toolFallbackLabel');
+                                                const isEnabled = enabledToolSlugs.has(slug);
+                                                const isDisabled = isToolsDisabled || disabled || !slug;
+                                                return (jsxs("div", { className: "bg-muted/50 border-border flex items-center justify-between rounded-lg border p-1.5", children: [jsxs("div", { className: "flex items-center gap-1.5", children: [jsx("span", { className: "text-foreground text-xs", children: toolLabel }), (tool === null || tool === void 0 ? void 0 : tool.description) ? (jsx(TooltipProvider, { children: jsxs(Tooltip, { children: [jsx(TooltipTrigger, { "aria-label": t('workflowsNodeConfigPanel.toolInfoAriaLabel', {
+                                                                                    toolLabel,
+                                                                                }), children: jsx(Info, { className: "text-muted-foreground h-3 w-3" }) }), jsx(TooltipContent, { className: "ibl-tooltip-content", children: jsx("p", { children: tool === null || tool === void 0 ? void 0 : tool.description }) })] }) })) : null] }), jsx(Switch, { checked: isEnabled, onCheckedChange: () => {
+                                                                if (!slug || isDisabled)
+                                                                    return;
+                                                                toggleTools(slug);
+                                                            }, disabled: isDisabled, "aria-label": t('workflowsNodeConfigPanel.toolSwitchAriaLabel', {
+                                                                toolLabel,
+                                                                status: isEnabled
+                                                                    ? t('workflowsNodeConfigPanel.toolEnabled')
+                                                                    : t('workflowsNodeConfigPanel.toolDisabled'),
+                                                            }) })] }, slug || toolLabel));
+                                            }) })) })) : null] })] }) }), jsx(Dialog, { open: showMentorModal, onOpenChange: (open) => {
+                        setShowMentorModal(open);
+                        if (!open) {
+                            setMentorSearchQuery('');
+                        }
+                    }, children: jsxs(DialogContent, { className: "w-[95vw] max-w-7xl gap-0 overflow-hidden rounded-lg p-0", onClick: (e) => e.stopPropagation(), onMouseDown: (e) => e.stopPropagation(), children: [jsx(DialogHeader, { className: "border-b border-gray-200 bg-white px-6 py-4", children: jsx(DialogTitle, { className: "text-lg font-semibold text-gray-900", children: t('workflowsNodeConfigPanel.selectAgentDialogTitle') }) }), jsx("div", { className: "px-6 py-4", children: jsx(MentorSelectionGrid, { selectedMentorIds: selectedMentorId ? [selectedMentorId] : [], onMentorSelect: handleMentorSelect, searchQuery: mentorSearchQuery, onSearchChange: setMentorSearchQuery, tenantKey: org !== null && org !== void 0 ? org : '', itemsPerPage: 8, showSearch: true, minHeight: "400px" }) })] }) })] }));
+    }
+    if (nodeType === 'guardrails') {
+        return (jsx("div", { "data-testid": "workflow-node-panel", className: "bg-card border-border absolute top-4 right-4 z-[22] flex max-h-[calc(100vh-14rem)] w-[320px] flex-col rounded-xl border shadow-xl", onClick: (e) => e.stopPropagation(), onMouseDown: (e) => e.stopPropagation(), children: jsxs("div", { className: "flex-1 space-y-2 overflow-y-auto p-3", children: [panelHeader(t('workflowsNodeConfigPanel.guardrailsDescription')), jsxs("div", { className: "space-y-1", children: [jsx(Label, { className: "text-foreground text-[11px] font-medium", children: t('workflowsNodeConfigPanel.nameLabel') }), jsx(Input, { value: nodeName, onChange: (e) => handleNameChange(e.target.value), className: "bg-muted border-border h-8 text-sm" })] }), jsxs("div", { className: "space-y-1", children: [jsx(Label, { className: "text-foreground text-[11px] font-medium", children: t('workflowsNodeConfigPanel.inputLabel') }), jsxs("div", { className: "bg-muted border-border flex items-center gap-2 rounded-lg border p-2", children: [jsx("div", { className: "flex h-4 w-4 items-center justify-center rounded bg-green-500/20", children: jsx("span", { className: "font-mono text-[10px] text-green-500", children: "=" }) }), jsx("span", { className: "text-foreground font-mono text-xs", children: "input" }), jsxs(Select, { defaultValue: "STRING", children: [jsx(SelectTrigger, { className: "bg-background border-border ml-auto h-6 w-[90px] text-xs", children: jsx(SelectValue, {}) }), jsxs(SelectContent, { children: [jsx(SelectItem, { value: "STRING", children: "STRING" }), jsx(SelectItem, { value: "NUMBER", children: "NUMBER" }), jsx(SelectItem, { value: "BOOLEAN", children: "BOOLEAN" })] })] })] })] }), jsxs("div", { className: "space-y-2 pt-2", children: [jsxs("div", { className: "flex items-center justify-between py-1", children: [jsxs("div", { className: "flex items-center gap-1", children: [jsx(Label, { className: "text-foreground text-[11px] font-medium", children: t('workflowsNodeConfigPanel.piiLabel') }), jsx(Info, { className: "text-muted-foreground h-3 w-3" })] }), jsxs("div", { className: "flex items-center gap-1", children: [jsx(Button, { variant: "ghost", size: "icon", className: "h-5 w-5", children: jsx(Settings, { className: "text-muted-foreground h-3 w-3" }) }), jsx(Switch, {})] })] }), jsxs("div", { className: "flex items-center justify-between py-1", children: [jsxs("div", { className: "flex items-center gap-1", children: [jsx(Label, { className: "text-foreground text-[11px] font-medium", children: t('workflowsNodeConfigPanel.moderationLabel') }), jsx(Info, { className: "text-muted-foreground h-3 w-3" })] }), jsxs("div", { className: "flex items-center gap-1", children: [jsx(Button, { variant: "ghost", size: "icon", className: "h-5 w-5", children: jsx(Settings, { className: "text-muted-foreground h-3 w-3" }) }), jsx(Switch, {})] })] }), jsxs("div", { className: "flex items-center justify-between py-1", children: [jsxs("div", { className: "flex items-center gap-1", children: [jsx(Label, { className: "text-foreground text-[11px] font-medium", children: t('workflowsNodeConfigPanel.jailbreakLabel') }), jsx(Info, { className: "text-muted-foreground h-3 w-3" })] }), jsxs("div", { className: "flex items-center gap-1", children: [jsx(Button, { variant: "ghost", size: "icon", className: "h-5 w-5", children: jsx(Settings, { className: "text-muted-foreground h-3 w-3" }) }), jsx(Switch, {})] })] }), jsxs("div", { className: "flex items-center justify-between py-1", children: [jsxs("div", { className: "flex items-center gap-1", children: [jsx(Label, { className: "text-foreground text-[11px] font-medium", children: t('workflowsNodeConfigPanel.hallucinationLabel') }), jsx(Info, { className: "text-muted-foreground h-3 w-3" })] }), jsxs("div", { className: "flex items-center gap-1", children: [jsx(Button, { variant: "ghost", size: "icon", className: "h-5 w-5", children: jsx(Settings, { className: "text-muted-foreground h-3 w-3" }) }), jsx(Switch, {})] })] })] }), jsxs("div", { className: "border-border flex items-center justify-between border-t py-1 pt-2", children: [jsx(Label, { className: "text-foreground text-[11px] font-medium", children: t('workflowsNodeConfigPanel.continueOnErrorLabel') }), jsx(Switch, { checked: continueOnError, onCheckedChange: handleContinueOnErrorChange })] })] }) }));
+    }
+    if (nodeType === 'file-search') {
+        const handleDatasetSelect = (dataset) => {
+            const name = dataset.document_name || dataset.url;
+            setDatasetId(dataset.id);
+            setDatasetName(name);
+            updateNodeConfig({ datasetId: dataset.id, datasetName: name });
+            setShowDatasetDialog(false);
+        };
+        const handleMaxResultsChange = (value) => {
+            const num = parseInt(value, 10);
+            const val = isNaN(num) ? 10 : num;
+            setMaxResults(val);
+            updateNodeConfig({ maxResults: val });
+        };
+        const handleFileSearchQueryChange = (value) => {
+            setFileSearchQuery(value);
+            updateNodeConfig({ fileSearchQuery: value });
+        };
+        const openDatasetDialog = () => setShowDatasetDialog(true);
+        return (jsxs(Fragment, { children: [jsx("div", { "data-testid": "workflow-node-panel", className: "bg-card border-border absolute top-4 right-4 z-[22] flex max-h-[calc(100vh-14rem)] w-[320px] flex-col rounded-xl border shadow-xl", onClick: (e) => e.stopPropagation(), onMouseDown: (e) => e.stopPropagation(), children: jsxs("div", { className: "flex-1 space-y-2 overflow-y-auto p-3", children: [panelHeader(t('workflowsNodeConfigPanel.fileSearchDescription')), jsxs("div", { className: "space-y-1", children: [jsxs("div", { className: "flex items-center justify-between", children: [jsx(Label, { className: "text-foreground text-[11px] font-medium", children: t('workflowsNodeConfigPanel.datasetLabel') }), jsx(Button, { variant: "ghost", size: "sm", className: "h-6 px-2 text-[11px]", onClick: openDatasetDialog, children: datasetId
+                                                    ? t('workflowsNodeConfigPanel.changeButton')
+                                                    : t('workflowsNodeConfigPanel.selectButton') })] }), datasetId ? (jsx("p", { className: "text-foreground bg-muted truncate rounded-md px-2 py-1.5 text-xs", children: datasetName })) : (jsx("p", { className: "text-muted-foreground text-[10px]", children: t('workflowsNodeConfigPanel.selectDatasetHint') }))] }), jsxs("div", { className: "space-y-1", children: [jsx(Label, { className: "text-foreground text-[11px] font-medium", children: t('workflowsNodeConfigPanel.maxResultsLabel') }), jsx(Input, { type: "number", value: maxResults, onChange: (e) => handleMaxResultsChange(e.target.value), className: "bg-muted border-border h-8 text-sm" })] }), jsxs("div", { className: "space-y-1", children: [jsx(Label, { className: "text-foreground text-[11px] font-medium", children: t('workflowsNodeConfigPanel.queryLabel') }), jsx(Textarea, { value: fileSearchQuery, onChange: (e) => handleFileSearchQueryChange(e.target.value), placeholder: t('workflowsNodeConfigPanel.fileSearchQueryPlaceholder'), className: "bg-muted border-border min-h-[100px] resize-none text-xs" })] })] }) }), jsx(Dialog, { open: showDatasetDialog, onOpenChange: setShowDatasetDialog, children: jsxs(DialogContent, { className: "flex max-h-[80vh] w-[90vw] max-w-3xl flex-col gap-0 overflow-hidden rounded-lg p-0", onClick: (e) => e.stopPropagation(), onMouseDown: (e) => e.stopPropagation(), children: [jsx(DialogHeader, { className: "sr-only", children: jsx(DialogTitle, { children: t('workflowsNodeConfigPanel.selectDatasetDialogTitle') }) }), jsx(AgentSettingsProvider, { ...pickerSettings, children: jsx(AgentDatasetsTab, { ...agentSettings === null || agentSettings === void 0 ? void 0 : agentSettings.datasetResourceConfig, onSelect: handleDatasetSelect, selectedDatasetId: datasetId }) })] }) })] }));
+    }
+    if (nodeType === 'mcp') {
+        const openMcpDialog = () => setShowConnectorManagement(true);
+        const closeMcpDialog = () => setShowConnectorManagement(false);
+        const handleMcpSelect = (server) => {
+            const serverId = String(server.id);
+            if (mcpConnectors.some((c) => c.id === serverId)) {
+                closeMcpDialog();
+                return;
+            }
+            const newConnector = {
+                id: serverId,
+                name: server.name,
+                icon: server.image || undefined,
+            };
+            const newConnectors = [...mcpConnectors, newConnector];
+            setMcpConnectors(newConnectors);
+            updateNodeConfig({ mcpConnectors: newConnectors });
+            closeMcpDialog();
+        };
+        return (jsxs(Fragment, { children: [jsx("div", { "data-testid": "workflow-node-panel", className: "bg-card border-border absolute top-4 right-4 z-[22] flex max-h-[calc(100vh-14rem)] w-[320px] flex-col rounded-xl border shadow-xl", onClick: (e) => e.stopPropagation(), onMouseDown: (e) => e.stopPropagation(), children: jsxs("div", { className: "flex-1 space-y-2 overflow-y-auto p-3", children: [panelHeader(t('workflowsNodeConfigPanel.mcpDescription')), mcpConnectors.length === 0 ? (jsxs("div", { className: "flex flex-col items-center justify-center space-y-4 py-8", children: [jsxs("div", { className: "flex items-center gap-3", children: [jsx("div", { className: "border-border flex h-16 w-16 items-center justify-center rounded-2xl border bg-white shadow-sm", children: jsx(Plug, { className: "h-8 w-8 text-[#38A1E5]" }) }), jsx("div", { className: "flex h-16 w-16 items-center justify-center rounded-2xl bg-[#38A1E5] shadow-sm", children: jsx(Cable, { className: "h-8 w-8 text-white" }) })] }), jsxs(Button, { variant: "secondary", size: "sm", className: "h-8 gap-1.5 text-xs has-[>svg]:px-2.5", onClick: openMcpDialog, children: [jsx(Plus, { className: "mr-1 h-3 w-3" }), t('workflowsNodeConfigPanel.addButton')] })] })) : (jsxs("div", { className: "space-y-2", children: [jsxs("div", { className: "flex items-center justify-between", children: [jsx(Label, { className: "text-foreground text-[11px] font-medium", children: t('workflowsNodeConfigPanel.connectedToolsLabel') }), jsx(ActionTooltip, { label: t('workflowsNodeConfigPanel.addButton'), children: jsx(Button, { variant: "ghost", size: "icon", className: "h-5 w-5", "aria-label": t('workflowsNodeConfigPanel.addButton'), onClick: openMcpDialog, children: jsx(Plus, { className: "text-muted-foreground h-3 w-3" }) }) })] }), jsx("div", { className: "space-y-1", children: mcpConnectors.map((connector) => (jsxs("div", { className: "bg-muted/50 border-border flex items-center justify-between rounded-lg border p-1.5", children: [jsxs("div", { className: "flex items-center gap-1.5", children: [jsx("div", { className: "bg-background flex h-6 w-6 items-center justify-center rounded", children: connector.icon ? (jsx("img", { src: connector.icon, alt: connector.name, className: "h-4 w-4 object-contain" })) : (jsx("span", { className: "text-sm", children: "\uD83D\uDD0C" })) }), jsx("span", { className: "text-foreground text-xs", children: connector.name })] }), jsx(ActionTooltip, { label: t('workflowsNodeConfigPanel.removeItemLabel', {
+                                                        name: connector.name,
+                                                    }), children: jsx(Button, { variant: "ghost", size: "icon", className: "h-4 w-4", "aria-label": t('workflowsNodeConfigPanel.removeItemLabel', {
+                                                            name: connector.name,
+                                                        }), onClick: () => handleRemoveConnector(connector.id), children: jsx(Trash2, { className: "text-muted-foreground h-2.5 w-2.5" }) }) })] }, connector.id))) })] }))] }) }), jsx(Dialog, { open: showConnectorManagement, onOpenChange: (open) => {
+                        if (!open)
+                            closeMcpDialog();
+                    }, children: jsxs(DialogContent, { className: "flex max-h-[80vh] w-[90vw] max-w-4xl flex-col gap-0 overflow-hidden rounded-lg p-0", onClick: (e) => e.stopPropagation(), onMouseDown: (e) => e.stopPropagation(), children: [jsx(DialogHeader, { className: "sr-only", children: jsx(DialogTitle, { children: t('workflowsNodeConfigPanel.selectMcpDialogTitle') }) }), jsx(AgentSettingsProvider, { ...pickerSettings, children: jsx(McpTab, { onSelect: handleMcpSelect }) })] }) })] }));
+    }
+    if (nodeType === 'while') {
+        return (jsx("div", { "data-testid": "workflow-node-panel", className: "bg-card border-border absolute top-4 right-4 z-[22] flex max-h-[calc(100vh-14rem)] w-[320px] flex-col rounded-xl border shadow-xl", onClick: (e) => e.stopPropagation(), onMouseDown: (e) => e.stopPropagation(), children: jsxs("div", { className: "flex-1 space-y-2 overflow-y-auto p-3", children: [panelHeader(t('workflowsNodeConfigPanel.whileDescription')), jsxs("div", { className: "space-y-1", children: [jsx(Label, { className: "text-foreground text-[11px] font-medium", children: t('workflowsNodeConfigPanel.nameLabel') }), jsx(Input, { value: nodeName, onChange: (e) => handleNameChange(e.target.value), className: "bg-muted border-border h-8 text-sm" })] }), jsxs("div", { className: "space-y-1", children: [jsx(Label, { htmlFor: `${nodeId}-while-condition`, className: "text-foreground text-[11px] font-medium", children: t('workflowsNodeConfigPanel.conditionLabel') }), jsx(Textarea, { id: `${nodeId}-while-condition`, value: whileCondition, onChange: (e) => handleWhileConditionChange(e.target.value), placeholder: EXPRESSION_EXAMPLES.whileCondition, className: "bg-muted border-border min-h-[100px] resize-none font-mono text-xs" }), expressionHint] }), jsxs("div", { className: "space-y-1", children: [jsx(Label, { htmlFor: `${nodeId}-max-iterations`, className: "text-foreground text-[11px] font-medium", children: t('workflowsNodeConfigPanel.maxIterationsLabel') }), jsx(Input, { id: `${nodeId}-max-iterations`, type: "number", min: 1, step: 1, value: maxIterations, onChange: (e) => { var _a; return handleMaxIterationsChange(e.target.value, (_a = e.target.validity) === null || _a === void 0 ? void 0 : _a.badInput); }, 
+                                // React drops input events that leave the value '' unchanged,
+                                // which is what letters in a number field look like.
+                                onInput: (e) => { var _a, _b; return setMaxIterationsBadInput((_b = (_a = e.currentTarget.validity) === null || _a === void 0 ? void 0 : _a.badInput) !== null && _b !== void 0 ? _b : false); }, placeholder: String(WHILE_DEFAULT_MAX_ITERATIONS), "aria-invalid": maxIterationsInvalid, className: "bg-muted border-border h-8 text-sm" }), jsx("p", { className: `text-[10px] ${maxIterationsInvalid ? 'text-destructive' : 'text-muted-foreground'}`, children: maxIterationsInvalid
+                                    ? t('workflowsNodeConfigPanel.maxIterationsInvalid')
+                                    : t('workflowsNodeConfigPanel.maxIterationsHint', {
+                                        count: WHILE_DEFAULT_MAX_ITERATIONS,
+                                    }) })] }), jsx("p", { className: "text-muted-foreground border-border border-t pt-2 text-[10px]", children: t('workflowsNodeConfigPanel.whileConnectHint') })] }) }));
+    }
+    if (nodeType === 'user-approval') {
+        return (jsx("div", { "data-testid": "workflow-node-panel", className: "bg-card border-border absolute top-4 right-4 z-[22] flex max-h-[calc(100vh-14rem)] w-[320px] flex-col rounded-xl border shadow-xl", onClick: (e) => e.stopPropagation(), onMouseDown: (e) => e.stopPropagation(), children: jsxs("div", { className: "flex-1 space-y-2 overflow-y-auto p-3", children: [panelHeader(t('workflowsNodeConfigPanel.userApprovalDescription')), jsxs("div", { className: "space-y-1", children: [jsx(Label, { className: "text-foreground text-[11px] font-medium", children: t('workflowsNodeConfigPanel.nameLabel') }), jsx(Input, { value: nodeName, onChange: (e) => handleNameChange(e.target.value), className: "bg-muted border-border h-8 text-sm" })] }), jsxs("div", { className: "space-y-1", children: [jsx(Label, { className: "text-foreground text-[11px] font-medium", children: t('workflowsNodeConfigPanel.messageLabel') }), jsx(Textarea, { value: userApprovalMessage, onChange: (e) => handleUserApprovalMessageChange(e.target.value), placeholder: t('workflowsNodeConfigPanel.approvalMessagePlaceholder'), className: "bg-muted border-border min-h-[120px] resize-none text-xs" })] })] }) }));
+    }
+    if (nodeType === 'transform') {
+        return (jsx("div", { "data-testid": "workflow-node-panel", className: "bg-card border-border absolute top-4 right-4 z-[22] flex max-h-[calc(100vh-14rem)] w-[320px] flex-col rounded-xl border shadow-xl", onClick: (e) => e.stopPropagation(), onMouseDown: (e) => e.stopPropagation(), children: jsxs("div", { className: "flex-1 space-y-2 overflow-y-auto p-3", children: [panelHeader(t('workflowsNodeConfigPanel.transformDescription')), jsxs("div", { className: "space-y-1", children: [jsx(Label, { className: "text-foreground text-[11px] font-medium", children: t('workflowsNodeConfigPanel.nameLabel') }), jsx(Input, { value: nodeName, onChange: (e) => handleNameChange(e.target.value), className: "bg-muted border-border h-8 text-sm" })] }), jsxs("div", { className: "space-y-2", children: [transformExpressions.map((expr) => (jsxs("div", { className: "border-border bg-muted/30 space-y-1.5 rounded-lg border p-2", children: [jsxs("div", { className: "flex items-center justify-between", children: [jsx(Label, { htmlFor: `${nodeId}-${expr.id}-target`, className: "text-foreground text-[10px] font-medium", children: t('workflowsNodeConfigPanel.keyLabel') }), transformExpressions.length > 1 && (jsx(Button, { variant: "ghost", size: "icon", className: "h-4 w-4", "aria-label": t('workflowsNodeConfigPanel.removeRowLabel'), onClick: () => handleRemoveTransformExpression(expr.id), children: jsx(Trash2, { className: "text-muted-foreground h-2.5 w-2.5" }) }))] }), jsx(Input, { id: `${nodeId}-${expr.id}-target`, value: expr.target, onChange: (e) => handleUpdateTransformExpression(expr.id, {
+                                            target: e.target.value,
+                                        }), placeholder: EXPRESSION_EXAMPLES.transformTarget, className: "bg-background border-border h-7 text-xs" }), jsx(Label, { htmlFor: `${nodeId}-${expr.id}-expression`, className: "text-foreground text-[10px] font-medium", children: t('workflowsNodeConfigPanel.valueLabel') }), jsx(Textarea, { id: `${nodeId}-${expr.id}-expression`, value: expr.expression, onChange: (e) => handleUpdateTransformExpression(expr.id, {
+                                            expression: e.target.value,
+                                        }), placeholder: EXPRESSION_EXAMPLES.transform, className: "bg-background border-border min-h-[60px] font-mono text-xs" })] }, expr.id))), expressionHint, jsxs(Button, { variant: "secondary", size: "sm", className: "h-7 w-full gap-1.5 text-xs has-[>svg]:px-2.5", onClick: handleAddTransformExpression, children: [jsx(Plus, { className: "mr-1 h-3 w-3" }), t('workflowsNodeConfigPanel.addButton')] })] })] }) }));
+    }
+    if (nodeType === 'set-state') {
+        return (jsxs("div", { "data-testid": "workflow-node-panel", className: "bg-card border-border absolute top-4 right-4 z-[22] flex max-h-[calc(100vh-14rem)] w-[320px] flex-col rounded-xl border shadow-xl", onClick: (e) => e.stopPropagation(), onMouseDown: (e) => e.stopPropagation(), children: [jsxs("div", { className: "flex-1 space-y-2 overflow-y-auto p-3", children: [panelHeader(t('workflowsNodeConfigPanel.setStateDescription')), jsxs("div", { className: "space-y-2", children: [assignments.map((assignment) => {
+                                    const variableOptions = Array.from(new Set([...workflowVariables, assignment.variable].filter(Boolean)));
+                                    return (jsxs("div", { className: "border-border bg-muted/30 space-y-1.5 rounded-lg border p-2", children: [jsxs("div", { className: "flex items-center justify-between", children: [jsx(Label, { htmlFor: `${nodeId}-${assignment.id}-expression`, className: "text-foreground text-[10px] font-medium", children: t('workflowsNodeConfigPanel.assignValueLabel') }), assignments.length > 1 && (jsx(Button, { variant: "ghost", size: "icon", className: "h-4 w-4", "aria-label": t('workflowsNodeConfigPanel.removeRowLabel'), onClick: () => handleRemoveAssignment(assignment.id), children: jsx(Trash2, { className: "text-muted-foreground h-2.5 w-2.5" }) }))] }), jsx(Textarea, { id: `${nodeId}-${assignment.id}-expression`, value: assignment.expression, onChange: (e) => handleUpdateAssignment(assignment.id, {
+                                                    expression: e.target.value,
+                                                }), placeholder: EXPRESSION_EXAMPLES.setState, className: "bg-background border-border min-h-[60px] font-mono text-xs" }), jsx(Label, { className: "text-foreground text-[10px] font-medium", children: t('workflowsNodeConfigPanel.toVariableLabel') }), jsxs("div", { className: "flex gap-1", children: [jsxs(Select, { value: assignment.variable, onValueChange: (value) => handleUpdateAssignment(assignment.id, {
+                                                            variable: value,
+                                                        }), children: [jsx(SelectTrigger, { "aria-label": t('workflowsNodeConfigPanel.toVariableLabel'), className: "bg-background border-border h-7 flex-1 text-xs", children: jsx(SelectValue, { placeholder: t('workflowsNodeConfigPanel.selectPlaceholder') }) }), jsx(SelectContent, { children: variableOptions.length === 0 ? (jsx("p", { className: "text-muted-foreground px-2 py-1.5 text-xs", children: t('workflowsNodeConfigPanel.noVariablesYet') })) : (variableOptions.map((name) => (jsx(SelectItem, { value: name, className: "font-mono text-xs", children: name }, name)))) })] }), jsxs(Button, { variant: "outline", size: "sm", className: "h-7 gap-1.5 bg-transparent px-2 text-xs has-[>svg]:px-2.5", onClick: () => setNewVariableRowId(assignment.id), children: [jsx(Plus, { className: "mr-0.5 h-2.5 w-2.5" }), t('workflowsNodeConfigPanel.newButton')] })] })] }, assignment.id));
+                                }), expressionHint, jsxs(Button, { variant: "secondary", size: "sm", className: "h-7 w-full gap-1.5 text-xs has-[>svg]:px-2.5", onClick: handleAddAssignment, children: [jsx(Plus, { className: "mr-1 h-3 w-3" }), t('workflowsNodeConfigPanel.addButton')] })] })] }), jsx(Dialog, { open: newVariableRowId !== null, onOpenChange: (open) => {
+                        if (!open)
+                            closeNewVariableDialog();
+                    }, children: jsxs(DialogContent, { className: "bg-card w-[calc(100%-2rem)] rounded-lg sm:max-w-[420px]", onClick: (e) => e.stopPropagation(), onMouseDown: (e) => e.stopPropagation(), children: [jsx(DialogHeader, { children: jsx(DialogTitle, { children: t('workflowsNodeConfigPanel.newVariableDialogTitle') }) }), jsxs("form", { className: "space-y-4", onSubmit: (e) => {
+                                    e.preventDefault();
+                                    handleAddNewVariable();
+                                }, children: [jsxs("div", { className: "space-y-2", children: [jsx(Label, { htmlFor: "new-variable-name", className: "text-sm font-medium", children: t('workflowsNodeConfigPanel.nameLabel') }), jsx(Input, { id: "new-variable-name", autoFocus: true, placeholder: t('workflowsNodeConfigPanel.variableNamePlaceholder'), value: newVariableName, onChange: (e) => setNewVariableName(e.target.value), "aria-invalid": newVariableNameTrimmed !== '' && !canAddNewVariable, className: "bg-muted border-border font-mono" }), jsx("p", { className: `text-xs ${newVariableNameTrimmed !== '' && !canAddNewVariable ? 'text-destructive' : 'text-muted-foreground'}`, children: t('workflowsNodeConfigPanel.variableNameHint') })] }), jsx("div", { className: "flex justify-end", children: jsx(Button, { type: "submit", disabled: !canAddNewVariable, className: "h-9", children: t('workflowsNodeConfigPanel.addButton') }) })] })] }) })] }));
+    }
+    if (nodeType === 'if-else' || nodeType === 'conditional') {
+        return (jsx("div", { "data-testid": "workflow-node-panel", className: "bg-card border-border absolute top-4 right-4 z-[22] flex max-h-[calc(100vh-14rem)] w-[320px] flex-col rounded-xl border shadow-xl", onClick: (e) => e.stopPropagation(), onMouseDown: (e) => e.stopPropagation(), children: jsxs("div", { className: "flex-1 space-y-2 overflow-y-auto p-3", children: [panelHeader(t('workflowsNodeConfigPanel.ifElseDescription')), conditions.map((condition, index) => (jsxs("div", { className: "bg-muted/30 border-border space-y-2 rounded-lg border p-3", children: [jsxs("div", { className: "flex items-center justify-between", children: [jsx(Label, { className: "text-foreground text-[11px] font-medium", children: index === 0
+                                            ? t('workflowsNodeConfigPanel.conditionIf')
+                                            : t('workflowsNodeConfigPanel.conditionElseIf', { index }) }), conditions.length > 1 && (jsx(Button, { variant: "ghost", size: "icon", className: "h-5 w-5", "aria-label": t('workflowsNodeConfigPanel.removeRowLabel'), onClick: () => handleRemoveCondition(condition.id), children: jsx(Trash2, { className: "text-muted-foreground h-3 w-3" }) }))] }), jsx(Input, { placeholder: t('workflowsNodeConfigPanel.caseNamePlaceholder'), className: "bg-background border-border h-8 text-sm", value: condition.caseName, onChange: (e) => handleUpdateCondition(condition.id, {
+                                    caseName: e.target.value,
+                                }) }), jsx(Textarea, { "aria-label": index === 0
+                                    ? t('workflowsNodeConfigPanel.conditionIf')
+                                    : t('workflowsNodeConfigPanel.conditionElseIf', { index }), placeholder: t('workflowsNodeConfigPanel.conditionPlaceholder'), className: "bg-background border-border min-h-[60px] resize-none font-mono text-xs", value: condition.expression, onChange: (e) => handleUpdateCondition(condition.id, {
+                                    expression: e.target.value,
+                                }) })] }, condition.id))), expressionHint, jsxs(Button, { variant: "secondary", size: "sm", className: "h-7 w-full gap-1.5 text-xs has-[>svg]:px-2.5", onClick: handleAddCondition, children: [jsx(Plus, { className: "mr-1 h-3 w-3" }), t('workflowsNodeConfigPanel.addButton')] })] }) }));
+    }
+    if (nodeType === 'end') {
+        return (jsx("div", { "data-testid": "workflow-node-panel", className: "bg-card border-border absolute top-4 right-4 z-[22] flex max-h-[calc(100vh-14rem)] w-[320px] flex-col rounded-xl border shadow-xl", onClick: (e) => e.stopPropagation(), onMouseDown: (e) => e.stopPropagation(), children: jsx("div", { className: "flex-1 space-y-2 overflow-y-auto p-3", children: panelHeader(t('workflowsNodeConfigPanel.endDescription')) }) }));
+    }
+    return null;
+}
+
+export { NodeConfigPanel };
+//# sourceMappingURL=node-config-panel.js.map