@uipath/apollo-react 6.26.0 → 6.27.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/canvas/components/AgentCanvas/AgentFlow.cjs +4 -3
- package/dist/canvas/components/AgentCanvas/AgentFlow.d.ts.map +1 -1
- package/dist/canvas/components/AgentCanvas/AgentFlow.js +4 -3
- package/dist/canvas/components/AgentCanvas/nodes/AgentNode.cjs +13 -9
- package/dist/canvas/components/AgentCanvas/nodes/AgentNode.d.ts.map +1 -1
- package/dist/canvas/components/AgentCanvas/nodes/AgentNode.js +13 -9
- package/dist/canvas/components/AgentCanvas/nodes/AgentNode.styles.cjs +1 -1
- package/dist/canvas/components/AgentCanvas/nodes/AgentNode.styles.d.ts +2 -0
- package/dist/canvas/components/AgentCanvas/nodes/AgentNode.styles.d.ts.map +1 -1
- package/dist/canvas/components/AgentCanvas/nodes/AgentNode.styles.js +1 -1
- package/dist/canvas/components/BaseCanvas/BaseCanvas.types.d.ts.map +1 -1
- package/dist/canvas/components/BaseNode/BaseNode.cjs +2 -14
- package/dist/canvas/components/BaseNode/BaseNode.d.ts.map +1 -1
- package/dist/canvas/components/BaseNode/BaseNode.js +2 -14
- package/dist/canvas/components/HierarchicalCanvas/HierarchicalCanvas.cjs +2 -1
- package/dist/canvas/components/HierarchicalCanvas/HierarchicalCanvas.d.ts +1 -0
- package/dist/canvas/components/HierarchicalCanvas/HierarchicalCanvas.d.ts.map +1 -1
- package/dist/canvas/components/HierarchicalCanvas/HierarchicalCanvas.js +2 -1
- package/dist/canvas/components/LoopNode/LoopNode.cjs +13 -5
- package/dist/canvas/components/LoopNode/LoopNode.d.ts.map +1 -1
- package/dist/canvas/components/LoopNode/LoopNode.js +13 -5
- package/dist/canvas/components/StageNode/StageNode.cjs +15 -11
- package/dist/canvas/components/StageNode/StageNode.d.ts.map +1 -1
- package/dist/canvas/components/StageNode/StageNode.js +15 -11
- package/dist/canvas/components/StickyNoteNode/StickyNoteNode.cjs +29 -6
- package/dist/canvas/components/StickyNoteNode/StickyNoteNode.d.ts.map +1 -1
- package/dist/canvas/components/StickyNoteNode/StickyNoteNode.js +29 -6
- package/dist/canvas/components/Toolbar/NodeToolbar/NodeToolbar.utils.cjs +18 -2
- package/dist/canvas/components/Toolbar/NodeToolbar/NodeToolbar.utils.d.ts +2 -0
- package/dist/canvas/components/Toolbar/NodeToolbar/NodeToolbar.utils.d.ts.map +1 -1
- package/dist/canvas/components/Toolbar/NodeToolbar/NodeToolbar.utils.js +14 -1
- package/dist/canvas/storybook-utils/components/StoryPage.d.ts +15 -1
- package/dist/canvas/storybook-utils/components/StoryPage.d.ts.map +1 -1
- package/dist/canvas/styles/tailwind.canvas.css +1 -1
- package/dist/canvas/types.d.ts +1 -0
- package/dist/canvas/types.d.ts.map +1 -1
- package/package.json +1 -1
|
@@ -43,10 +43,12 @@ const react_cjs_namespaceObject = require("../../xyflow/react.cjs");
|
|
|
43
43
|
const external_lucide_react_namespaceObject = require("lucide-react");
|
|
44
44
|
const external_react_namespaceObject = require("react");
|
|
45
45
|
const external_BaseCanvas_index_cjs_namespaceObject = require("../BaseCanvas/index.cjs");
|
|
46
|
+
const NodeRegistryProvider_cjs_namespaceObject = require("../../core/NodeRegistryProvider.cjs");
|
|
46
47
|
const external_types_cjs_namespaceObject = require("../../types.cjs");
|
|
47
48
|
const props_helpers_cjs_namespaceObject = require("../../utils/props-helpers.cjs");
|
|
48
49
|
const external_CanvasPositionControls_cjs_namespaceObject = require("../CanvasPositionControls.cjs");
|
|
49
50
|
const external_StickyNoteNode_index_cjs_namespaceObject = require("../StickyNoteNode/index.cjs");
|
|
51
|
+
const external_agent_flow_manifest_cjs_namespaceObject = require("./agent-flow.manifest.cjs");
|
|
50
52
|
const PaneContextMenu_cjs_namespaceObject = require("./components/PaneContextMenu.cjs");
|
|
51
53
|
const SuggestionGroupPanel_cjs_namespaceObject = require("./components/SuggestionGroupPanel.cjs");
|
|
52
54
|
const TimelinePlayer_cjs_namespaceObject = require("./components/TimelinePlayer.cjs");
|
|
@@ -55,8 +57,6 @@ const Edge_cjs_namespaceObject = require("./edges/Edge.cjs");
|
|
|
55
57
|
const AgentNode_cjs_namespaceObject = require("./nodes/AgentNode.cjs");
|
|
56
58
|
const ResourceNode_cjs_namespaceObject = require("./nodes/ResourceNode.cjs");
|
|
57
59
|
const agent_flow_store_cjs_namespaceObject = require("./store/agent-flow-store.cjs");
|
|
58
|
-
const NodeRegistryProvider_cjs_namespaceObject = require("../../core/NodeRegistryProvider.cjs");
|
|
59
|
-
const external_agent_flow_manifest_cjs_namespaceObject = require("./agent-flow.manifest.cjs");
|
|
60
60
|
const ToolbarContainer = styled_default().div`
|
|
61
61
|
display: flex;
|
|
62
62
|
align-items: center;
|
|
@@ -166,7 +166,7 @@ const createResourceNodeWrapper = (opts)=>(props)=>{
|
|
|
166
166
|
suggestionGroupVersion: opts.suggestionGroupVersion
|
|
167
167
|
});
|
|
168
168
|
};
|
|
169
|
-
const AgentFlowInner = /*#__PURE__*/ (0, external_react_namespaceObject.memo)(({ children, mode, spans, onEnable, onDisable, onAddBreakpoint, onRemoveBreakpoint, onAddGuardrail, onGoToSource, onErrorAction, onAddResource: _onAddResource, onSelectResource, setSpanForSelectedNode, getNodeFromSelectedSpan, onExpandResource, onCollapseResource, agentNodeTranslations, resourceNodeTranslations, stickyNoteNodeTranslations, canvasTranslations, enableTimelinePlayer, canvasRef, enableMcpTools, enableMemory, enableA2a, enableStickyNotes, enableInstructions, healthScore, onHealthScoreClick, suggestionTranslations, suggestionGroup, onAgentNodePositionChange, onResourceNodePositionChange, onOrganize, onUpdateStickyNote, zoomLevel, onZoomLevelChange })=>{
|
|
169
|
+
const AgentFlowInner = /*#__PURE__*/ (0, external_react_namespaceObject.memo)(({ children, mode, readOnlyNodeIds, spans, onEnable, onDisable, onAddBreakpoint, onRemoveBreakpoint, onAddGuardrail, onGoToSource, onErrorAction, onAddResource: _onAddResource, onSelectResource, setSpanForSelectedNode, getNodeFromSelectedSpan, onExpandResource, onCollapseResource, agentNodeTranslations, resourceNodeTranslations, stickyNoteNodeTranslations, canvasTranslations, enableTimelinePlayer, canvasRef, enableMcpTools, enableMemory, enableA2a, enableStickyNotes, enableInstructions, healthScore, onHealthScoreClick, suggestionTranslations, suggestionGroup, onAgentNodePositionChange, onResourceNodePositionChange, onOrganize, onUpdateStickyNote, zoomLevel, onZoomLevelChange })=>{
|
|
170
170
|
const { nodes, edges, onNodesChange, onEdgesChange, onConnect, autoArrange, setSelectedNodeId, selectedNodeId, setDragging, expandAgent, collapseAgent, createResourcePlaceholder, actOnSuggestionGroup, currentSuggestionIndex, navigateToNextSuggestion, navigateToPreviousSuggestion, addStickyNote, paneContextMenu, openPaneContextMenu, closePaneContextMenu } = (0, agent_flow_store_cjs_namespaceObject.useAgentFlowStore)();
|
|
171
171
|
const nodeTypesBase = (0, external_react_namespaceObject.useMemo)(()=>({
|
|
172
172
|
stickyNote: (props)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_StickyNoteNode_index_cjs_namespaceObject.StickyNoteNode, {
|
|
@@ -449,6 +449,7 @@ const AgentFlowInner = /*#__PURE__*/ (0, external_react_namespaceObject.memo)(({
|
|
|
449
449
|
nodeTypes: nodeTypes,
|
|
450
450
|
edgeTypes: edgeTypes,
|
|
451
451
|
mode: mode,
|
|
452
|
+
readOnlyNodeIds: readOnlyNodeIds,
|
|
452
453
|
initialAutoLayout: autoArrange,
|
|
453
454
|
fitViewOptions: adjustedFitViewOptions,
|
|
454
455
|
defaultViewport: defaultViewport,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AgentFlow.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/AgentCanvas/AgentFlow.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"AgentFlow.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/AgentCanvas/AgentFlow.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAI/C,OAAO,EAIL,KAAK,cAAc,EAcpB,MAAM,aAAa,CAAC;AAssBrB,eAAO,MAAM,SAAS,GAAI,OAAO,iBAAiB,CAAC,cAAc,CAAC,4CAQjE,CAAC"}
|
|
@@ -5,10 +5,12 @@ import { Panel, useReactFlow } from "../../xyflow/react.js";
|
|
|
5
5
|
import { StickyNote } from "lucide-react";
|
|
6
6
|
import { memo, useCallback, useEffect, useMemo, useRef } from "react";
|
|
7
7
|
import { BaseCanvas } from "../BaseCanvas/index.js";
|
|
8
|
+
import { NodeRegistryProvider } from "../../core/NodeRegistryProvider.js";
|
|
8
9
|
import { DefaultAgentNodeTranslations, DefaultCanvasTranslations, DefaultResourceNodeTranslations, DefaultStickyNoteNodeTranslations, DefaultSuggestionTranslations, isAgentFlowAgentNode, isAgentFlowResourceNode, isStickyNoteNode } from "../../types.js";
|
|
9
10
|
import { hasAgentRunning } from "../../utils/props-helpers.js";
|
|
10
11
|
import { CanvasPositionControls } from "../CanvasPositionControls.js";
|
|
11
12
|
import { StickyNoteNode } from "../StickyNoteNode/index.js";
|
|
13
|
+
import { agentFlowManifest } from "./agent-flow.manifest.js";
|
|
12
14
|
import { PaneContextMenu } from "./components/PaneContextMenu.js";
|
|
13
15
|
import { SuggestionGroupPanel } from "./components/SuggestionGroupPanel.js";
|
|
14
16
|
import { TimelinePlayer } from "./components/TimelinePlayer.js";
|
|
@@ -17,8 +19,6 @@ import { Edge } from "./edges/Edge.js";
|
|
|
17
19
|
import { AgentNodeElement } from "./nodes/AgentNode.js";
|
|
18
20
|
import { ResourceNode } from "./nodes/ResourceNode.js";
|
|
19
21
|
import { AgentFlowProvider, useAgentFlowStore } from "./store/agent-flow-store.js";
|
|
20
|
-
import { NodeRegistryProvider } from "../../core/NodeRegistryProvider.js";
|
|
21
|
-
import { agentFlowManifest } from "./agent-flow.manifest.js";
|
|
22
22
|
const ToolbarContainer = styled.div`
|
|
23
23
|
display: flex;
|
|
24
24
|
align-items: center;
|
|
@@ -128,7 +128,7 @@ const createResourceNodeWrapper = (opts)=>(props)=>{
|
|
|
128
128
|
suggestionGroupVersion: opts.suggestionGroupVersion
|
|
129
129
|
});
|
|
130
130
|
};
|
|
131
|
-
const AgentFlowInner = /*#__PURE__*/ memo(({ children, mode, spans, onEnable, onDisable, onAddBreakpoint, onRemoveBreakpoint, onAddGuardrail, onGoToSource, onErrorAction, onAddResource: _onAddResource, onSelectResource, setSpanForSelectedNode, getNodeFromSelectedSpan, onExpandResource, onCollapseResource, agentNodeTranslations, resourceNodeTranslations, stickyNoteNodeTranslations, canvasTranslations, enableTimelinePlayer, canvasRef, enableMcpTools, enableMemory, enableA2a, enableStickyNotes, enableInstructions, healthScore, onHealthScoreClick, suggestionTranslations, suggestionGroup, onAgentNodePositionChange, onResourceNodePositionChange, onOrganize, onUpdateStickyNote, zoomLevel, onZoomLevelChange })=>{
|
|
131
|
+
const AgentFlowInner = /*#__PURE__*/ memo(({ children, mode, readOnlyNodeIds, spans, onEnable, onDisable, onAddBreakpoint, onRemoveBreakpoint, onAddGuardrail, onGoToSource, onErrorAction, onAddResource: _onAddResource, onSelectResource, setSpanForSelectedNode, getNodeFromSelectedSpan, onExpandResource, onCollapseResource, agentNodeTranslations, resourceNodeTranslations, stickyNoteNodeTranslations, canvasTranslations, enableTimelinePlayer, canvasRef, enableMcpTools, enableMemory, enableA2a, enableStickyNotes, enableInstructions, healthScore, onHealthScoreClick, suggestionTranslations, suggestionGroup, onAgentNodePositionChange, onResourceNodePositionChange, onOrganize, onUpdateStickyNote, zoomLevel, onZoomLevelChange })=>{
|
|
132
132
|
const { nodes, edges, onNodesChange, onEdgesChange, onConnect, autoArrange, setSelectedNodeId, selectedNodeId, setDragging, expandAgent, collapseAgent, createResourcePlaceholder, actOnSuggestionGroup, currentSuggestionIndex, navigateToNextSuggestion, navigateToPreviousSuggestion, addStickyNote, paneContextMenu, openPaneContextMenu, closePaneContextMenu } = useAgentFlowStore();
|
|
133
133
|
const nodeTypesBase = useMemo(()=>({
|
|
134
134
|
stickyNote: (props)=>/*#__PURE__*/ jsx(StickyNoteNode, {
|
|
@@ -411,6 +411,7 @@ const AgentFlowInner = /*#__PURE__*/ memo(({ children, mode, spans, onEnable, on
|
|
|
411
411
|
nodeTypes: nodeTypes,
|
|
412
412
|
edgeTypes: edgeTypes,
|
|
413
413
|
mode: mode,
|
|
414
|
+
readOnlyNodeIds: readOnlyNodeIds,
|
|
414
415
|
initialAutoLayout: autoArrange,
|
|
415
416
|
fitViewOptions: adjustedFitViewOptions,
|
|
416
417
|
defaultViewport: defaultViewport,
|
|
@@ -32,6 +32,7 @@ const react_cjs_namespaceObject = require("../../../xyflow/react.cjs");
|
|
|
32
32
|
const external_react_namespaceObject = require("react");
|
|
33
33
|
const external_types_cjs_namespaceObject = require("../../../types.cjs");
|
|
34
34
|
const icon_registry_cjs_namespaceObject = require("../../../utils/icon-registry.cjs");
|
|
35
|
+
const ReadOnlyNodesContext_cjs_namespaceObject = require("../../BaseCanvas/ReadOnlyNodesContext.cjs");
|
|
35
36
|
const BaseNode_cjs_namespaceObject = require("../../BaseNode/BaseNode.cjs");
|
|
36
37
|
const BaseNodeConfigContext_cjs_namespaceObject = require("../../BaseNode/BaseNodeConfigContext.cjs");
|
|
37
38
|
const external_FloatingCanvasPanel_index_cjs_namespaceObject = require("../../FloatingCanvasPanel/index.cjs");
|
|
@@ -118,6 +119,8 @@ const AgentNodeComponent = /*#__PURE__*/ (0, external_react_namespaceObject.memo
|
|
|
118
119
|
hasSuccess,
|
|
119
120
|
hasRunning
|
|
120
121
|
]);
|
|
122
|
+
const isNodeReadOnly = (0, ReadOnlyNodesContext_cjs_namespaceObject.useIsNodeReadOnly)(id);
|
|
123
|
+
const canEditNode = 'design' === mode && !isNodeReadOnly;
|
|
121
124
|
const displayMemory = true === enableMemory && ('design' === mode || 'view' === mode && hasMemory);
|
|
122
125
|
const displayContext = 'design' === mode || 'view' === mode && hasContext;
|
|
123
126
|
const displayEscalation = 'design' === mode || 'view' === mode && hasEscalation;
|
|
@@ -135,7 +138,7 @@ const AgentNodeComponent = /*#__PURE__*/ (0, external_react_namespaceObject.memo
|
|
|
135
138
|
type: 'source',
|
|
136
139
|
handleType: 'artifact',
|
|
137
140
|
label: translations.memory,
|
|
138
|
-
showButton:
|
|
141
|
+
showButton: canEditNode && !hasMemory,
|
|
139
142
|
labelBackgroundColor: 'var(--canvas-background-secondary)',
|
|
140
143
|
visible: displayMemory,
|
|
141
144
|
onAction: (_e)=>{
|
|
@@ -147,7 +150,7 @@ const AgentNodeComponent = /*#__PURE__*/ (0, external_react_namespaceObject.memo
|
|
|
147
150
|
type: 'source',
|
|
148
151
|
handleType: 'artifact',
|
|
149
152
|
label: translations.escalations,
|
|
150
|
-
showButton:
|
|
153
|
+
showButton: canEditNode,
|
|
151
154
|
labelBackgroundColor: 'var(--canvas-background-secondary)',
|
|
152
155
|
visible: displayEscalation,
|
|
153
156
|
onAction: (_e)=>{
|
|
@@ -165,7 +168,7 @@ const AgentNodeComponent = /*#__PURE__*/ (0, external_react_namespaceObject.memo
|
|
|
165
168
|
type: 'source',
|
|
166
169
|
handleType: 'artifact',
|
|
167
170
|
label: translations.context,
|
|
168
|
-
showButton:
|
|
171
|
+
showButton: canEditNode,
|
|
169
172
|
labelBackgroundColor: 'var(--canvas-background-secondary)',
|
|
170
173
|
visible: displayContext,
|
|
171
174
|
onAction: (_e)=>{
|
|
@@ -176,7 +179,7 @@ const AgentNodeComponent = /*#__PURE__*/ (0, external_react_namespaceObject.memo
|
|
|
176
179
|
type: 'source',
|
|
177
180
|
handleType: 'artifact',
|
|
178
181
|
label: translations.tools,
|
|
179
|
-
showButton:
|
|
182
|
+
showButton: canEditNode,
|
|
180
183
|
labelBackgroundColor: 'var(--canvas-background-secondary)',
|
|
181
184
|
visible: displayTool || displayMcp || displayA2a,
|
|
182
185
|
onAction: (_e)=>{
|
|
@@ -193,7 +196,7 @@ const AgentNodeComponent = /*#__PURE__*/ (0, external_react_namespaceObject.memo
|
|
|
193
196
|
}
|
|
194
197
|
return configs;
|
|
195
198
|
}, [
|
|
196
|
-
|
|
199
|
+
canEditNode,
|
|
197
200
|
displayContext,
|
|
198
201
|
displayMemory,
|
|
199
202
|
displayMcp,
|
|
@@ -253,10 +256,11 @@ const AgentNodeComponent = /*#__PURE__*/ (0, external_react_namespaceObject.memo
|
|
|
253
256
|
const hasContent = hasSystem || hasUser;
|
|
254
257
|
if (hasContent) return {
|
|
255
258
|
instructionsFooter: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(external_AgentNode_styles_cjs_namespaceObject.InstructionsPreview, {
|
|
256
|
-
|
|
259
|
+
$isInteractive: canEditNode,
|
|
260
|
+
onClick: canEditNode ? (e)=>{
|
|
257
261
|
e.stopPropagation();
|
|
258
262
|
onAddInstructions?.();
|
|
259
|
-
},
|
|
263
|
+
} : void 0,
|
|
260
264
|
children: [
|
|
261
265
|
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_AgentNode_styles_cjs_namespaceObject.InstructionsLabel, {
|
|
262
266
|
children: translations.instructions
|
|
@@ -291,7 +295,7 @@ const AgentNodeComponent = /*#__PURE__*/ (0, external_react_namespaceObject.memo
|
|
|
291
295
|
}),
|
|
292
296
|
footerVariant: hasSystem && hasUser ? 'double' : 'single'
|
|
293
297
|
};
|
|
294
|
-
if (
|
|
298
|
+
if (!canEditNode || !onAddInstructions) return {
|
|
295
299
|
instructionsFooter: null,
|
|
296
300
|
footerVariant: 'none'
|
|
297
301
|
};
|
|
@@ -315,7 +319,7 @@ const AgentNodeComponent = /*#__PURE__*/ (0, external_react_namespaceObject.memo
|
|
|
315
319
|
}, [
|
|
316
320
|
enableInstructions,
|
|
317
321
|
data.instructions,
|
|
318
|
-
|
|
322
|
+
canEditNode,
|
|
319
323
|
onAddInstructions,
|
|
320
324
|
translations
|
|
321
325
|
]);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AgentNode.d.ts","sourceRoot":"","sources":["../../../../../src/canvas/components/AgentCanvas/nodes/AgentNode.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,0CAA0C,CAAC;AAIhF,OAAO,EACL,KAAK,qBAAqB,EAE1B,KAAK,sBAAsB,EAC3B,KAAK,cAAc,EACpB,MAAM,gBAAgB,CAAC;
|
|
1
|
+
{"version":3,"file":"AgentNode.d.ts","sourceRoot":"","sources":["../../../../../src/canvas/components/AgentCanvas/nodes/AgentNode.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,0CAA0C,CAAC;AAIhF,OAAO,EACL,KAAK,qBAAqB,EAE1B,KAAK,sBAAsB,EAC3B,KAAK,cAAc,EACpB,MAAM,gBAAgB,CAAC;AAIxB,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,+BAA+B,CAAC;AA8BlE,UAAU,aAAc,SAAQ,YAAY;IAC1C,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,EAAE,MAAM,CAAC;IACpB,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACpC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,YAAY,CAAC,EAAE;QACb,MAAM,CAAC,EAAE,MAAM,CAAC;QAChB,IAAI,CAAC,EAAE,MAAM,CAAC;KACf,CAAC;IAEF,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,cAAc,CAAC,EAAE,cAAc,CAAC;CACjC;AAED,UAAU,cAAc;IACtB,IAAI,EAAE,aAAa,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,QAAQ,GAAG,MAAM,CAAC;IACzB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,aAAa,CAAC,EAAE,CAAC,IAAI,EAAE,SAAS,GAAG,YAAY,GAAG,KAAK,GAAG,MAAM,GAAG,aAAa,GAAG,KAAK,KAAK,IAAI,CAAC;IAClG,iBAAiB,CAAC,EAAE,MAAM,IAAI,CAAC;IAC/B,YAAY,EAAE,qBAAqB,CAAC;IACpC,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,kBAAkB,CAAC,EAAE,MAAM,IAAI,CAAC;IAChC,sBAAsB,CAAC,EAAE,sBAAsB,CAAC;IAEhD,sBAAsB,CAAC,EAAE,MAAM,CAAC;CACjC;AAikBD,eAAO,MAAM,gBAAgB,8CAxDI,SAAS,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,GAAG,cAAc,6CAwD1B,CAAC;AAEvD,YAAY,EAAE,aAAa,EAAE,cAAc,EAAE,CAAC"}
|
|
@@ -4,6 +4,7 @@ import { Position } from "../../../xyflow/react.js";
|
|
|
4
4
|
import { memo, useCallback, useEffect, useMemo, useRef, useState } from "react";
|
|
5
5
|
import { DefaultSuggestionTranslations } from "../../../types.js";
|
|
6
6
|
import { CanvasIcon } from "../../../utils/icon-registry.js";
|
|
7
|
+
import { useIsNodeReadOnly } from "../../BaseCanvas/ReadOnlyNodesContext.js";
|
|
7
8
|
import { BaseNode } from "../../BaseNode/BaseNode.js";
|
|
8
9
|
import { BaseNodeOverrideConfigProvider } from "../../BaseNode/BaseNodeConfigContext.js";
|
|
9
10
|
import { FloatingCanvasPanel } from "../../FloatingCanvasPanel/index.js";
|
|
@@ -90,6 +91,8 @@ const AgentNodeComponent = /*#__PURE__*/ memo((props)=>{
|
|
|
90
91
|
hasSuccess,
|
|
91
92
|
hasRunning
|
|
92
93
|
]);
|
|
94
|
+
const isNodeReadOnly = useIsNodeReadOnly(id);
|
|
95
|
+
const canEditNode = 'design' === mode && !isNodeReadOnly;
|
|
93
96
|
const displayMemory = true === enableMemory && ('design' === mode || 'view' === mode && hasMemory);
|
|
94
97
|
const displayContext = 'design' === mode || 'view' === mode && hasContext;
|
|
95
98
|
const displayEscalation = 'design' === mode || 'view' === mode && hasEscalation;
|
|
@@ -107,7 +110,7 @@ const AgentNodeComponent = /*#__PURE__*/ memo((props)=>{
|
|
|
107
110
|
type: 'source',
|
|
108
111
|
handleType: 'artifact',
|
|
109
112
|
label: translations.memory,
|
|
110
|
-
showButton:
|
|
113
|
+
showButton: canEditNode && !hasMemory,
|
|
111
114
|
labelBackgroundColor: 'var(--canvas-background-secondary)',
|
|
112
115
|
visible: displayMemory,
|
|
113
116
|
onAction: (_e)=>{
|
|
@@ -119,7 +122,7 @@ const AgentNodeComponent = /*#__PURE__*/ memo((props)=>{
|
|
|
119
122
|
type: 'source',
|
|
120
123
|
handleType: 'artifact',
|
|
121
124
|
label: translations.escalations,
|
|
122
|
-
showButton:
|
|
125
|
+
showButton: canEditNode,
|
|
123
126
|
labelBackgroundColor: 'var(--canvas-background-secondary)',
|
|
124
127
|
visible: displayEscalation,
|
|
125
128
|
onAction: (_e)=>{
|
|
@@ -137,7 +140,7 @@ const AgentNodeComponent = /*#__PURE__*/ memo((props)=>{
|
|
|
137
140
|
type: 'source',
|
|
138
141
|
handleType: 'artifact',
|
|
139
142
|
label: translations.context,
|
|
140
|
-
showButton:
|
|
143
|
+
showButton: canEditNode,
|
|
141
144
|
labelBackgroundColor: 'var(--canvas-background-secondary)',
|
|
142
145
|
visible: displayContext,
|
|
143
146
|
onAction: (_e)=>{
|
|
@@ -148,7 +151,7 @@ const AgentNodeComponent = /*#__PURE__*/ memo((props)=>{
|
|
|
148
151
|
type: 'source',
|
|
149
152
|
handleType: 'artifact',
|
|
150
153
|
label: translations.tools,
|
|
151
|
-
showButton:
|
|
154
|
+
showButton: canEditNode,
|
|
152
155
|
labelBackgroundColor: 'var(--canvas-background-secondary)',
|
|
153
156
|
visible: displayTool || displayMcp || displayA2a,
|
|
154
157
|
onAction: (_e)=>{
|
|
@@ -165,7 +168,7 @@ const AgentNodeComponent = /*#__PURE__*/ memo((props)=>{
|
|
|
165
168
|
}
|
|
166
169
|
return configs;
|
|
167
170
|
}, [
|
|
168
|
-
|
|
171
|
+
canEditNode,
|
|
169
172
|
displayContext,
|
|
170
173
|
displayMemory,
|
|
171
174
|
displayMcp,
|
|
@@ -225,10 +228,11 @@ const AgentNodeComponent = /*#__PURE__*/ memo((props)=>{
|
|
|
225
228
|
const hasContent = hasSystem || hasUser;
|
|
226
229
|
if (hasContent) return {
|
|
227
230
|
instructionsFooter: /*#__PURE__*/ jsxs(InstructionsPreview, {
|
|
228
|
-
|
|
231
|
+
$isInteractive: canEditNode,
|
|
232
|
+
onClick: canEditNode ? (e)=>{
|
|
229
233
|
e.stopPropagation();
|
|
230
234
|
onAddInstructions?.();
|
|
231
|
-
},
|
|
235
|
+
} : void 0,
|
|
232
236
|
children: [
|
|
233
237
|
/*#__PURE__*/ jsx(InstructionsLabel, {
|
|
234
238
|
children: translations.instructions
|
|
@@ -263,7 +267,7 @@ const AgentNodeComponent = /*#__PURE__*/ memo((props)=>{
|
|
|
263
267
|
}),
|
|
264
268
|
footerVariant: hasSystem && hasUser ? 'double' : 'single'
|
|
265
269
|
};
|
|
266
|
-
if (
|
|
270
|
+
if (!canEditNode || !onAddInstructions) return {
|
|
267
271
|
instructionsFooter: null,
|
|
268
272
|
footerVariant: 'none'
|
|
269
273
|
};
|
|
@@ -287,7 +291,7 @@ const AgentNodeComponent = /*#__PURE__*/ memo((props)=>{
|
|
|
287
291
|
}, [
|
|
288
292
|
enableInstructions,
|
|
289
293
|
data.instructions,
|
|
290
|
-
|
|
294
|
+
canEditNode,
|
|
291
295
|
onAddInstructions,
|
|
292
296
|
translations
|
|
293
297
|
]);
|
|
@@ -91,7 +91,7 @@ const InstructionsPreview = styled_default().div`
|
|
|
91
91
|
font-size: 9px;
|
|
92
92
|
line-height: 13px;
|
|
93
93
|
color: var(--canvas-foreground-de-emp);
|
|
94
|
-
cursor: pointer;
|
|
94
|
+
cursor: ${({ $isInteractive })=>$isInteractive ? 'pointer' : 'default'};
|
|
95
95
|
`;
|
|
96
96
|
const InstructionsLine = styled_default().div`
|
|
97
97
|
white-space: nowrap;
|
|
@@ -9,6 +9,8 @@ export declare const InstructionsLabel: import("@emotion/styled").StyledComponen
|
|
|
9
9
|
export declare const InstructionsPreview: import("@emotion/styled").StyledComponent<{
|
|
10
10
|
theme?: import("@emotion/react").Theme;
|
|
11
11
|
as?: React.ElementType;
|
|
12
|
+
} & {
|
|
13
|
+
$isInteractive: boolean;
|
|
12
14
|
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
|
|
13
15
|
export declare const InstructionsLine: import("@emotion/styled").StyledComponent<{
|
|
14
16
|
theme?: import("@emotion/react").Theme;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AgentNode.styles.d.ts","sourceRoot":"","sources":["../../../../../src/canvas/components/AgentCanvas/nodes/AgentNode.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,qBAAqB;;;qHAuBjC,CAAC;AAEF,eAAO,MAAM,iBAAiB;;;yGAK7B,CAAC;AAEF,eAAO,MAAM,mBAAmB
|
|
1
|
+
{"version":3,"file":"AgentNode.styles.d.ts","sourceRoot":"","sources":["../../../../../src/canvas/components/AgentCanvas/nodes/AgentNode.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,qBAAqB;;;qHAuBjC,CAAC;AAEF,eAAO,MAAM,iBAAiB;;;yGAK7B,CAAC;AAEF,eAAO,MAAM,mBAAmB;;;;oBAAgC,OAAO;yGAStE,CAAC;AAEF,eAAO,MAAM,gBAAgB;;;yGAQ5B,CAAC;AAEF,eAAO,MAAM,wBAAwB;;;yGAOpC,CAAC;AAEF,eAAO,MAAM,qBAAqB;;;yGAMjC,CAAC;AAEF,eAAO,MAAM,oBAAoB;;;yGAIhC,CAAC;AAEF,eAAO,MAAM,uBAAuB;;;yGAGnC,CAAC;AAEF,eAAO,MAAM,eAAe;;;yGAI3B,CAAC;AAEF,eAAO,MAAM,oBAAoB;;;yGAIhC,CAAC;AAEF,eAAO,MAAM,oBAAoB;;;yGAGhC,CAAC;AAEF,eAAO,MAAM,iBAAiB;;;;cAA0B,OAAO;yGA0B9D,CAAC;AAEF,eAAO,MAAM,WAAW;;;yGAKvB,CAAC;AAEF,eAAO,MAAM,gBAAgB;;;2GAE5B,CAAC;AAEF,eAAO,MAAM,gBAAgB;;;2GAG5B,CAAC;AAEF,eAAO,MAAM,iBAAiB;;;2GAI7B,CAAC;AAEF,eAAO,MAAM,gBAAgB;;;2GAY5B,CAAC"}
|
|
@@ -37,7 +37,7 @@ const InstructionsPreview = styled.div`
|
|
|
37
37
|
font-size: 9px;
|
|
38
38
|
line-height: 13px;
|
|
39
39
|
color: var(--canvas-foreground-de-emp);
|
|
40
|
-
cursor: pointer;
|
|
40
|
+
cursor: ${({ $isInteractive })=>$isInteractive ? 'pointer' : 'default'};
|
|
41
41
|
`;
|
|
42
42
|
const InstructionsLine = styled.div`
|
|
43
43
|
white-space: nowrap;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BaseCanvas.types.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/BaseCanvas/BaseCanvas.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,iBAAiB,EACjB,IAAI,EACJ,IAAI,EACJ,iBAAiB,EACjB,cAAc,EACf,MAAM,0CAA0C,CAAC;AAClD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AACrD,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AACjE,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,wCAAwC,CAAC;AAMtF,MAAM,WAAW,wBAAwB;IAOvC,OAAO,CAAC,EACJ,MAAM,GACN;QACE,GAAG,EAAE,MAAM,CAAC;QACZ,KAAK,EAAE,MAAM,CAAC;QACd,MAAM,EAAE,MAAM,CAAC;QACf,IAAI,EAAE,MAAM,CAAC;KACd,CAAC;IAON,QAAQ,CAAC,EAAE,MAAM,CAAC;IAMlB,OAAO,CAAC,EAAE,MAAM,CAAC;IAMjB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AASD,MAAM,WAAW,eAAe,CAAC,QAAQ,SAAS,IAAI,GAAG,IAAI,EAAE,QAAQ,SAAS,IAAI,GAAG,IAAI,CACzF,SAAQ,cAAc,CAAC,QAAQ,EAAE,QAAQ,CAAC;IAe1C,IAAI,CAAC,EAAE,QAAQ,GAAG,UAAU,GAAG,MAAM,CAAC;
|
|
1
|
+
{"version":3,"file":"BaseCanvas.types.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/BaseCanvas/BaseCanvas.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,iBAAiB,EACjB,IAAI,EACJ,IAAI,EACJ,iBAAiB,EACjB,cAAc,EACf,MAAM,0CAA0C,CAAC;AAClD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AACrD,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AACjE,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,wCAAwC,CAAC;AAMtF,MAAM,WAAW,wBAAwB;IAOvC,OAAO,CAAC,EACJ,MAAM,GACN;QACE,GAAG,EAAE,MAAM,CAAC;QACZ,KAAK,EAAE,MAAM,CAAC;QACd,MAAM,EAAE,MAAM,CAAC;QACf,IAAI,EAAE,MAAM,CAAC;KACd,CAAC;IAON,QAAQ,CAAC,EAAE,MAAM,CAAC;IAMlB,OAAO,CAAC,EAAE,MAAM,CAAC;IAMjB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AASD,MAAM,WAAW,eAAe,CAAC,QAAQ,SAAS,IAAI,GAAG,IAAI,EAAE,QAAQ,SAAS,IAAI,GAAG,IAAI,CACzF,SAAQ,cAAc,CAAC,QAAQ,EAAE,QAAQ,CAAC;IAe1C,IAAI,CAAC,EAAE,QAAQ,GAAG,UAAU,GAAG,MAAM,CAAC;IAuBtC,eAAe,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,GAAG,SAAS,MAAM,EAAE,CAAC;IAM1D,iBAAiB,CAAC,EAAE,uBAAuB,CAAC;IAO5C,QAAQ,CAAC,EAAE,SAAS,CAAC;IAOrB,cAAc,CAAC,EAAE,OAAO,CAAC;IAKzB,eAAe,CAAC,EAAE,MAAM,CAAC;IAKzB,wBAAwB,CAAC,EAAE,MAAM,CAAC;IAOlC,iBAAiB,CAAC,EAAE,iBAAiB,CAAC;IAOtC,aAAa,CAAC,EAAE,MAAM,CAAC;IAOvB,cAAc,CAAC,EAAE,MAAM,CAAC;IAcxB,iBAAiB,CAAC,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC;IAkB/C,mBAAmB,CAAC,EAAE,MAAM,EAAE,CAAC;IAM/B,4BAA4B,CAAC,EAAE,MAAM,CAAC;IAUtC,cAAc,CAAC,EAAE,wBAAwB,CAAC;IAK1C,eAAe,CAAC,EAAE,oBAAoB,CAAC;IAMvC,WAAW,CAAC,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;IAW1B,UAAU,CAAC,EAAE,OAAO,CAAC;IAOrB,MAAM,CAAC,EAAE,eAAe,CAAC;CAC1B;AAMD,MAAM,WAAW,wBAAwB;IAKvC,OAAO,CAAC,EAAE,MAAM,CAAC;IAMjB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAMlB,OAAO,CAAC,EAAE,MAAM,CAAC;IAMjB,OAAO,CAAC,EAAE,MAAM,CAAC;IAOjB,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB;AASD,MAAM,WAAW,aAAa,CAAC,QAAQ,SAAS,IAAI,GAAG,IAAI,EAAE,QAAQ,SAAS,IAAI,GAAG,IAAI;IAgBvF,iBAAiB,CAAC,OAAO,EAAE,MAAM,EAAE,EAAE,OAAO,CAAC,EAAE,wBAAwB,GAAG,IAAI,CAAC;IAa/E,oBAAoB,CAAC,OAAO,CAAC,EAAE,wBAAwB,GAAG,IAAI,CAAC;IAiB/D,UAAU,CAAC,MAAM,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,wBAAwB,GAAG,IAAI,CAAC;IAyBrE,SAAS,EAAE,iBAAiB,CAAC,QAAQ,EAAE,QAAQ,CAAC,GAAG,SAAS,CAAC;CAC9D"}
|
|
@@ -47,6 +47,7 @@ const SmartHandle_cjs_namespaceObject = require("../ButtonHandle/SmartHandle.cjs
|
|
|
47
47
|
const useButtonHandles_cjs_namespaceObject = require("../ButtonHandle/useButtonHandles.cjs");
|
|
48
48
|
const InitialsBadge_cjs_namespaceObject = require("../shared/InitialsBadge.cjs");
|
|
49
49
|
const external_Toolbar_index_cjs_namespaceObject = require("../Toolbar/index.cjs");
|
|
50
|
+
const NodeToolbar_utils_cjs_namespaceObject = require("../Toolbar/NodeToolbar/NodeToolbar.utils.cjs");
|
|
50
51
|
const external_BaseNodeBadgeSlot_cjs_namespaceObject = require("./BaseNodeBadgeSlot.cjs");
|
|
51
52
|
const external_BaseNodeConfigContext_cjs_namespaceObject = require("./BaseNodeConfigContext.cjs");
|
|
52
53
|
const external_BaseNodeContainer_cjs_namespaceObject = require("./BaseNodeContainer.cjs");
|
|
@@ -54,10 +55,6 @@ const external_BaseNodeInnerShape_cjs_namespaceObject = require("./BaseNodeInner
|
|
|
54
55
|
const external_BaseNodeMissingManifest_cjs_namespaceObject = require("./BaseNodeMissingManifest.cjs");
|
|
55
56
|
const external_NodeLabel_cjs_namespaceObject = require("./NodeLabel.cjs");
|
|
56
57
|
const NEVER_SHOW_ADD_BUTTON = ()=>false;
|
|
57
|
-
const disableToolbarActions = (actions)=>actions.map((action)=>'separator' === action.id ? action : {
|
|
58
|
-
...action,
|
|
59
|
-
disabled: true
|
|
60
|
-
});
|
|
61
58
|
const getContainerWidth = (shape, width)=>{
|
|
62
59
|
const defaultWidth = 'rectangle' === shape ? external_constants_cjs_namespaceObject.DEFAULT_RECTANGLE_NODE_WIDTH : external_constants_cjs_namespaceObject.DEFAULT_NODE_SIZE;
|
|
63
60
|
if (width && width !== external_constants_cjs_namespaceObject.DEFAULT_NODE_SIZE && width !== external_constants_cjs_namespaceObject.DEFAULT_RECTANGLE_NODE_WIDTH) return width;
|
|
@@ -179,16 +176,7 @@ const BaseNodeComponent = (props)=>{
|
|
|
179
176
|
manifest,
|
|
180
177
|
statusContext
|
|
181
178
|
]);
|
|
182
|
-
const effectiveToolbarConfig = (0, external_react_namespaceObject.useMemo)(()=>
|
|
183
|
-
if (!toolbarConfig || !isNodeReadOnly) return toolbarConfig;
|
|
184
|
-
return {
|
|
185
|
-
...toolbarConfig,
|
|
186
|
-
actions: disableToolbarActions(toolbarConfig.actions),
|
|
187
|
-
...toolbarConfig.overflowActions && {
|
|
188
|
-
overflowActions: disableToolbarActions(toolbarConfig.overflowActions)
|
|
189
|
-
}
|
|
190
|
-
};
|
|
191
|
-
}, [
|
|
179
|
+
const effectiveToolbarConfig = (0, external_react_namespaceObject.useMemo)(()=>toolbarConfig && isNodeReadOnly ? (0, NodeToolbar_utils_cjs_namespaceObject.lockToolbarConfig)(toolbarConfig) : toolbarConfig, [
|
|
192
180
|
toolbarConfig,
|
|
193
181
|
isNodeReadOnly
|
|
194
182
|
]);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BaseNode.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/BaseNode/BaseNode.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,0CAA0C,CAAC;
|
|
1
|
+
{"version":3,"file":"BaseNode.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/BaseNode/BaseNode.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,0CAA0C,CAAC;AA+ChF,OAAO,KAAK,EACV,YAAY,EAIb,MAAM,kBAAkB,CAAC;AAosB1B,eAAO,MAAM,QAAQ,8CA/pBa,SAAS,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,6CA+pBmB,CAAC"}
|
|
@@ -19,6 +19,7 @@ import { SmartHandle, SmartHandleProvider } from "../ButtonHandle/SmartHandle.js
|
|
|
19
19
|
import { useButtonHandles } from "../ButtonHandle/useButtonHandles.js";
|
|
20
20
|
import { InitialsBadge } from "../shared/InitialsBadge.js";
|
|
21
21
|
import { NodeToolbar } from "../Toolbar/index.js";
|
|
22
|
+
import { lockToolbarConfig } from "../Toolbar/NodeToolbar/NodeToolbar.utils.js";
|
|
22
23
|
import { BaseBadgeSlot } from "./BaseNodeBadgeSlot.js";
|
|
23
24
|
import { useBaseNodeOverrideConfig } from "./BaseNodeConfigContext.js";
|
|
24
25
|
import { BaseContainer } from "./BaseNodeContainer.js";
|
|
@@ -26,10 +27,6 @@ import { BaseInnerShape } from "./BaseNodeInnerShape.js";
|
|
|
26
27
|
import { MissingManifestNode } from "./BaseNodeMissingManifest.js";
|
|
27
28
|
import { NodeLabel } from "./NodeLabel.js";
|
|
28
29
|
const NEVER_SHOW_ADD_BUTTON = ()=>false;
|
|
29
|
-
const disableToolbarActions = (actions)=>actions.map((action)=>'separator' === action.id ? action : {
|
|
30
|
-
...action,
|
|
31
|
-
disabled: true
|
|
32
|
-
});
|
|
33
30
|
const getContainerWidth = (shape, width)=>{
|
|
34
31
|
const defaultWidth = 'rectangle' === shape ? DEFAULT_RECTANGLE_NODE_WIDTH : DEFAULT_NODE_SIZE;
|
|
35
32
|
if (width && width !== DEFAULT_NODE_SIZE && width !== DEFAULT_RECTANGLE_NODE_WIDTH) return width;
|
|
@@ -151,16 +148,7 @@ const BaseNodeComponent = (props)=>{
|
|
|
151
148
|
manifest,
|
|
152
149
|
statusContext
|
|
153
150
|
]);
|
|
154
|
-
const effectiveToolbarConfig = useMemo(()=>
|
|
155
|
-
if (!toolbarConfig || !isNodeReadOnly) return toolbarConfig;
|
|
156
|
-
return {
|
|
157
|
-
...toolbarConfig,
|
|
158
|
-
actions: disableToolbarActions(toolbarConfig.actions),
|
|
159
|
-
...toolbarConfig.overflowActions && {
|
|
160
|
-
overflowActions: disableToolbarActions(toolbarConfig.overflowActions)
|
|
161
|
-
}
|
|
162
|
-
};
|
|
163
|
-
}, [
|
|
151
|
+
const effectiveToolbarConfig = useMemo(()=>toolbarConfig && isNodeReadOnly ? lockToolbarConfig(toolbarConfig) : toolbarConfig, [
|
|
164
152
|
toolbarConfig,
|
|
165
153
|
isNodeReadOnly
|
|
166
154
|
]);
|
|
@@ -66,7 +66,7 @@ function shouldPersistNodeChange(change) {
|
|
|
66
66
|
function isDefaultViewport(viewport) {
|
|
67
67
|
return 0 === viewport.x && 0 === viewport.y && 1 === viewport.zoom;
|
|
68
68
|
}
|
|
69
|
-
const HierarchicalCanvas = ({ mode = 'design', initialCanvases, initialPath, onCanvasesChange, onPathChange })=>{
|
|
69
|
+
const HierarchicalCanvas = ({ mode = 'design', readOnlyNodeIds, initialCanvases, initialPath, onCanvasesChange, onPathChange })=>{
|
|
70
70
|
const canvasRef = (0, external_react_namespaceObject.useRef)(null);
|
|
71
71
|
const containerRef = (0, external_react_namespaceObject.useRef)(null);
|
|
72
72
|
const [reactFlowInstance, setReactFlowInstance] = (0, external_react_namespaceObject.useState)(null);
|
|
@@ -349,6 +349,7 @@ const HierarchicalCanvas = ({ mode = 'design', initialCanvases, initialPath, onC
|
|
|
349
349
|
onInit: handleInit,
|
|
350
350
|
onToolbarAction: handleToolbarAction,
|
|
351
351
|
mode: mode,
|
|
352
|
+
readOnlyNodeIds: readOnlyNodeIds,
|
|
352
353
|
defaultViewport: currentCanvas.viewport,
|
|
353
354
|
fitView: shouldFitView,
|
|
354
355
|
fitViewOptions: {
|
|
@@ -2,6 +2,7 @@ import type React from 'react';
|
|
|
2
2
|
import type { CanvasLevel } from '../../types/canvas.types';
|
|
3
3
|
interface HierarchicalCanvasProps {
|
|
4
4
|
mode?: 'view' | 'design' | 'readonly';
|
|
5
|
+
readOnlyNodeIds?: ReadonlySet<string>;
|
|
5
6
|
initialCanvases?: Record<string, CanvasLevel>;
|
|
6
7
|
initialPath?: string[];
|
|
7
8
|
onCanvasesChange?: (canvases: Record<string, CanvasLevel>) => void;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HierarchicalCanvas.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/HierarchicalCanvas/HierarchicalCanvas.tsx"],"names":[],"mappings":"AAqBA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AA8B/B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAe5D,UAAU,uBAAuB;IAC/B,IAAI,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,UAAU,CAAC;IAKtC,eAAe,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,WAAW,CAAC,CAAC;IAK9C,WAAW,CAAC,EAAE,MAAM,EAAE,CAAC;IAMvB,gBAAgB,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,WAAW,CAAC,KAAK,IAAI,CAAC;IAInE,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;CACzC;AAyBD,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,
|
|
1
|
+
{"version":3,"file":"HierarchicalCanvas.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/HierarchicalCanvas/HierarchicalCanvas.tsx"],"names":[],"mappings":"AAqBA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AA8B/B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAe5D,UAAU,uBAAuB;IAC/B,IAAI,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,UAAU,CAAC;IAEtC,eAAe,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAKtC,eAAe,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,WAAW,CAAC,CAAC;IAK9C,WAAW,CAAC,EAAE,MAAM,EAAE,CAAC;IAMvB,gBAAgB,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,WAAW,CAAC,KAAK,IAAI,CAAC;IAInE,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;CACzC;AAyBD,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CAqZhE,CAAC"}
|
|
@@ -38,7 +38,7 @@ function shouldPersistNodeChange(change) {
|
|
|
38
38
|
function isDefaultViewport(viewport) {
|
|
39
39
|
return 0 === viewport.x && 0 === viewport.y && 1 === viewport.zoom;
|
|
40
40
|
}
|
|
41
|
-
const HierarchicalCanvas = ({ mode = 'design', initialCanvases, initialPath, onCanvasesChange, onPathChange })=>{
|
|
41
|
+
const HierarchicalCanvas = ({ mode = 'design', readOnlyNodeIds, initialCanvases, initialPath, onCanvasesChange, onPathChange })=>{
|
|
42
42
|
const canvasRef = useRef(null);
|
|
43
43
|
const containerRef = useRef(null);
|
|
44
44
|
const [reactFlowInstance, setReactFlowInstance] = useState(null);
|
|
@@ -321,6 +321,7 @@ const HierarchicalCanvas = ({ mode = 'design', initialCanvases, initialPath, onC
|
|
|
321
321
|
onInit: handleInit,
|
|
322
322
|
onToolbarAction: handleToolbarAction,
|
|
323
323
|
mode: mode,
|
|
324
|
+
readOnlyNodeIds: readOnlyNodeIds,
|
|
324
325
|
defaultViewport: currentCanvas.viewport,
|
|
325
326
|
fitView: shouldFitView,
|
|
326
327
|
fitViewOptions: {
|
|
@@ -44,6 +44,7 @@ const nodePropsEqual_cjs_namespaceObject = require("../../utils/nodePropsEqual.c
|
|
|
44
44
|
const toolbar_resolver_cjs_namespaceObject = require("../../utils/toolbar-resolver.cjs");
|
|
45
45
|
const BaseCanvasModeProvider_cjs_namespaceObject = require("../BaseCanvas/BaseCanvasModeProvider.cjs");
|
|
46
46
|
const ConnectedHandlesContext_cjs_namespaceObject = require("../BaseCanvas/ConnectedHandlesContext.cjs");
|
|
47
|
+
const ReadOnlyNodesContext_cjs_namespaceObject = require("../BaseCanvas/ReadOnlyNodesContext.cjs");
|
|
47
48
|
const SelectionStateContext_cjs_namespaceObject = require("../BaseCanvas/SelectionStateContext.cjs");
|
|
48
49
|
const BaseNodeBadgeSlot_cjs_namespaceObject = require("../BaseNode/BaseNodeBadgeSlot.cjs");
|
|
49
50
|
const BaseNodeContainer_cjs_namespaceObject = require("../BaseNode/BaseNodeContainer.cjs");
|
|
@@ -51,6 +52,7 @@ const BaseNodeMissingManifest_cjs_namespaceObject = require("../BaseNode/BaseNod
|
|
|
51
52
|
const external_ButtonHandle_index_cjs_namespaceObject = require("../ButtonHandle/index.cjs");
|
|
52
53
|
const external_CanvasTooltip_cjs_namespaceObject = require("../CanvasTooltip.cjs");
|
|
53
54
|
const external_Toolbar_index_cjs_namespaceObject = require("../Toolbar/index.cjs");
|
|
55
|
+
const NodeToolbar_utils_cjs_namespaceObject = require("../Toolbar/NodeToolbar/NodeToolbar.utils.cjs");
|
|
54
56
|
const external_LoopNode_helpers_cjs_namespaceObject = require("./LoopNode.helpers.cjs");
|
|
55
57
|
const external_LoopNodeExecutionCount_cjs_namespaceObject = require("./LoopNodeExecutionCount.cjs");
|
|
56
58
|
const DEFAULT_LOOP_ICON = 'repeat';
|
|
@@ -173,6 +175,8 @@ function LoopNodeComponent(props) {
|
|
|
173
175
|
]);
|
|
174
176
|
const { mode } = (0, BaseCanvasModeProvider_cjs_namespaceObject.useBaseCanvasMode)();
|
|
175
177
|
const isDesignMode = 'design' === mode;
|
|
178
|
+
const isNodeReadOnly = (0, ReadOnlyNodesContext_cjs_namespaceObject.useIsNodeReadOnly)(id);
|
|
179
|
+
const canEditNode = isDesignMode && !isNodeReadOnly;
|
|
176
180
|
const connectedHandleIds = (0, ConnectedHandlesContext_cjs_namespaceObject.useConnectedHandles)(id);
|
|
177
181
|
const { multipleNodesSelected } = (0, SelectionStateContext_cjs_namespaceObject.useSelectionState)();
|
|
178
182
|
const isConnecting = (0, react_cjs_namespaceObject.useStore)(NodeUtils_cjs_namespaceObject.selectIsConnecting);
|
|
@@ -245,6 +249,10 @@ function LoopNodeComponent(props) {
|
|
|
245
249
|
statusContext,
|
|
246
250
|
toolbarConfigProp
|
|
247
251
|
]);
|
|
252
|
+
const effectiveToolbarConfig = (0, external_react_namespaceObject.useMemo)(()=>toolbarConfig && isNodeReadOnly ? (0, NodeToolbar_utils_cjs_namespaceObject.lockToolbarConfig)(toolbarConfig) : toolbarConfig, [
|
|
253
|
+
toolbarConfig,
|
|
254
|
+
isNodeReadOnly
|
|
255
|
+
]);
|
|
248
256
|
const adornments = (0, external_react_namespaceObject.useMemo)(()=>({
|
|
249
257
|
...(0, adornment_resolver_cjs_namespaceObject.resolveAdornments)(statusContext, {
|
|
250
258
|
hideExecutionStatusAdornment: true
|
|
@@ -302,8 +310,8 @@ function LoopNodeComponent(props) {
|
|
|
302
310
|
setIsHovered(false);
|
|
303
311
|
}, []);
|
|
304
312
|
const shouldShowHandles = (isConnecting || selected || isHovered) && !dragging;
|
|
305
|
-
const showHandleAddButtons =
|
|
306
|
-
const showEmptyStateButton =
|
|
313
|
+
const showHandleAddButtons = canEditNode && !multipleNodesSelected && !isConnecting && !dragging;
|
|
314
|
+
const showEmptyStateButton = canEditNode && !hasChildNodes && !!onAddFirstChild;
|
|
307
315
|
const interactionState = resolveInteractionState(dragging, selected, isHovered);
|
|
308
316
|
const activeStatus = suggestionType ?? validationState?.validationStatus ?? executionStatus;
|
|
309
317
|
const statusBorder = (0, BaseNodeContainer_cjs_namespaceObject.getStatusBorder)(activeStatus);
|
|
@@ -328,7 +336,7 @@ function LoopNodeComponent(props) {
|
|
|
328
336
|
"data-suggestion-type": suggestionType,
|
|
329
337
|
"data-validation-status": validationState?.validationStatus,
|
|
330
338
|
"aria-busy": resolvedData.loading || void 0,
|
|
331
|
-
className: (0, apollo_wind_namespaceObject.cn)('group/loop-shell relative box-border flex h-full w-full flex-col overflow-visible rounded-[20px] border bg-transparent', 'transition-[border-color,box-shadow,opacity] shadow-(--canvas-node-shadow-rest)', 'border-border', statusBorder, isHovered && 'shadow-(--canvas-node-shadow-hover)', isHovered && !hasStatusBorder && 'border-border-hover', selected && 'outline
|
|
339
|
+
className: (0, apollo_wind_namespaceObject.cn)('group/loop-shell relative box-border flex h-full w-full flex-col overflow-visible rounded-[20px] border bg-transparent', 'transition-[border-color,box-shadow,opacity] shadow-(--canvas-node-shadow-rest)', 'border-border', statusBorder, isHovered && 'shadow-(--canvas-node-shadow-hover)', isHovered && !hasStatusBorder && 'border-border-hover', selected && 'outline-2 outline-foreground-accent-muted', isDropTarget && 'bg-surface-hover outline-2 outline-brand', 'drag' === interactionState && 'cursor-grabbing shadow-(--canvas-node-shadow-lifted)'),
|
|
332
340
|
style: {
|
|
333
341
|
...nodeSizeStyle,
|
|
334
342
|
...display.background ? {
|
|
@@ -379,9 +387,9 @@ function LoopNodeComponent(props) {
|
|
|
379
387
|
onAddFirstChild: handleEmptyClick
|
|
380
388
|
})
|
|
381
389
|
}) : null,
|
|
382
|
-
|
|
390
|
+
effectiveToolbarConfig && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_Toolbar_index_cjs_namespaceObject.NodeToolbar, {
|
|
383
391
|
nodeId: id,
|
|
384
|
-
config:
|
|
392
|
+
config: effectiveToolbarConfig,
|
|
385
393
|
expanded: selected || isHovered,
|
|
386
394
|
hidden: dragging || multipleNodesSelected,
|
|
387
395
|
portalToNodeOverlay: true
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LoopNode.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/LoopNode/LoopNode.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"LoopNode.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/LoopNode/LoopNode.tsx"],"names":[],"mappings":"AA4CA,OAAO,KAAK,EAA+B,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAsInF,iBAAS,iBAAiB,CAAC,KAAK,EAAE,aAAa,2CAqS9C;AAED,eAAO,MAAM,QAAQ,+DAA6D,CAAC"}
|
|
@@ -16,6 +16,7 @@ import { areNodePropsEqualIgnoringPosition } from "../../utils/nodePropsEqual.js
|
|
|
16
16
|
import { resolveToolbar } from "../../utils/toolbar-resolver.js";
|
|
17
17
|
import { useBaseCanvasMode } from "../BaseCanvas/BaseCanvasModeProvider.js";
|
|
18
18
|
import { useConnectedHandles } from "../BaseCanvas/ConnectedHandlesContext.js";
|
|
19
|
+
import { useIsNodeReadOnly } from "../BaseCanvas/ReadOnlyNodesContext.js";
|
|
19
20
|
import { useSelectionState } from "../BaseCanvas/SelectionStateContext.js";
|
|
20
21
|
import { BaseBadgeSlot } from "../BaseNode/BaseNodeBadgeSlot.js";
|
|
21
22
|
import { getStatusBorder } from "../BaseNode/BaseNodeContainer.js";
|
|
@@ -23,6 +24,7 @@ import { MissingManifestNode } from "../BaseNode/BaseNodeMissingManifest.js";
|
|
|
23
24
|
import { ButtonHandles } from "../ButtonHandle/index.js";
|
|
24
25
|
import { CanvasTooltip } from "../CanvasTooltip.js";
|
|
25
26
|
import { NodeToolbar } from "../Toolbar/index.js";
|
|
27
|
+
import { lockToolbarConfig } from "../Toolbar/NodeToolbar/NodeToolbar.utils.js";
|
|
26
28
|
import { resolveContainerHandleGroups } from "./LoopNode.helpers.js";
|
|
27
29
|
import { LoopNodeExecutionCount } from "./LoopNodeExecutionCount.js";
|
|
28
30
|
const DEFAULT_LOOP_ICON = 'repeat';
|
|
@@ -145,6 +147,8 @@ function LoopNodeComponent(props) {
|
|
|
145
147
|
]);
|
|
146
148
|
const { mode } = useBaseCanvasMode();
|
|
147
149
|
const isDesignMode = 'design' === mode;
|
|
150
|
+
const isNodeReadOnly = useIsNodeReadOnly(id);
|
|
151
|
+
const canEditNode = isDesignMode && !isNodeReadOnly;
|
|
148
152
|
const connectedHandleIds = useConnectedHandles(id);
|
|
149
153
|
const { multipleNodesSelected } = useSelectionState();
|
|
150
154
|
const isConnecting = useStore(selectIsConnecting);
|
|
@@ -217,6 +221,10 @@ function LoopNodeComponent(props) {
|
|
|
217
221
|
statusContext,
|
|
218
222
|
toolbarConfigProp
|
|
219
223
|
]);
|
|
224
|
+
const effectiveToolbarConfig = useMemo(()=>toolbarConfig && isNodeReadOnly ? lockToolbarConfig(toolbarConfig) : toolbarConfig, [
|
|
225
|
+
toolbarConfig,
|
|
226
|
+
isNodeReadOnly
|
|
227
|
+
]);
|
|
220
228
|
const adornments = useMemo(()=>({
|
|
221
229
|
...resolveAdornments(statusContext, {
|
|
222
230
|
hideExecutionStatusAdornment: true
|
|
@@ -274,8 +282,8 @@ function LoopNodeComponent(props) {
|
|
|
274
282
|
setIsHovered(false);
|
|
275
283
|
}, []);
|
|
276
284
|
const shouldShowHandles = (isConnecting || selected || isHovered) && !dragging;
|
|
277
|
-
const showHandleAddButtons =
|
|
278
|
-
const showEmptyStateButton =
|
|
285
|
+
const showHandleAddButtons = canEditNode && !multipleNodesSelected && !isConnecting && !dragging;
|
|
286
|
+
const showEmptyStateButton = canEditNode && !hasChildNodes && !!onAddFirstChild;
|
|
279
287
|
const interactionState = resolveInteractionState(dragging, selected, isHovered);
|
|
280
288
|
const activeStatus = suggestionType ?? validationState?.validationStatus ?? executionStatus;
|
|
281
289
|
const statusBorder = getStatusBorder(activeStatus);
|
|
@@ -300,7 +308,7 @@ function LoopNodeComponent(props) {
|
|
|
300
308
|
"data-suggestion-type": suggestionType,
|
|
301
309
|
"data-validation-status": validationState?.validationStatus,
|
|
302
310
|
"aria-busy": resolvedData.loading || void 0,
|
|
303
|
-
className: cn('group/loop-shell relative box-border flex h-full w-full flex-col overflow-visible rounded-[20px] border bg-transparent', 'transition-[border-color,box-shadow,opacity] shadow-(--canvas-node-shadow-rest)', 'border-border', statusBorder, isHovered && 'shadow-(--canvas-node-shadow-hover)', isHovered && !hasStatusBorder && 'border-border-hover', selected && 'outline
|
|
311
|
+
className: cn('group/loop-shell relative box-border flex h-full w-full flex-col overflow-visible rounded-[20px] border bg-transparent', 'transition-[border-color,box-shadow,opacity] shadow-(--canvas-node-shadow-rest)', 'border-border', statusBorder, isHovered && 'shadow-(--canvas-node-shadow-hover)', isHovered && !hasStatusBorder && 'border-border-hover', selected && 'outline-2 outline-foreground-accent-muted', isDropTarget && 'bg-surface-hover outline-2 outline-brand', 'drag' === interactionState && 'cursor-grabbing shadow-(--canvas-node-shadow-lifted)'),
|
|
304
312
|
style: {
|
|
305
313
|
...nodeSizeStyle,
|
|
306
314
|
...display.background ? {
|
|
@@ -351,9 +359,9 @@ function LoopNodeComponent(props) {
|
|
|
351
359
|
onAddFirstChild: handleEmptyClick
|
|
352
360
|
})
|
|
353
361
|
}) : null,
|
|
354
|
-
|
|
362
|
+
effectiveToolbarConfig && /*#__PURE__*/ jsx(NodeToolbar, {
|
|
355
363
|
nodeId: id,
|
|
356
|
-
config:
|
|
364
|
+
config: effectiveToolbarConfig,
|
|
357
365
|
expanded: selected || isHovered,
|
|
358
366
|
hidden: dragging || multipleNodesSelected,
|
|
359
367
|
portalToNodeOverlay: true
|