@uipath/apollo-react 3.44.3 → 3.45.1-pr280.8f162e1

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.
@@ -28,6 +28,7 @@ __webpack_require__.d(__webpack_exports__, {
28
28
  });
29
29
  const jsx_runtime_namespaceObject = require("react/jsx-runtime");
30
30
  const index_cjs_namespaceObject = require("../../../icons/index.cjs");
31
+ const external_utils_index_cjs_namespaceObject = require("../../../utils/index.cjs");
31
32
  const external_layouts_index_cjs_namespaceObject = require("../../../layouts/index.cjs");
32
33
  const react_cjs_namespaceObject = require("../../../xyflow/react.cjs");
33
34
  const components_index_cjs_namespaceObject = require("../../../../material/components/index.cjs");
@@ -177,19 +178,25 @@ const ResourceNode = /*#__PURE__*/ (0, external_react_namespaceObject.memo)(({ d
177
178
  data
178
179
  ]);
179
180
  const toolbarConfig = (0, external_react_namespaceObject.useMemo)(()=>{
180
- if ('view' === mode) return null;
181
+ if ('view' === mode || data.isPlaceholder && (!isSuggestion || !suggestionId)) return null;
181
182
  if (isSuggestion && suggestionId) {
182
183
  if ('0.0.1' === suggestionGroupVersion) return null;
183
184
  const rejectAction = {
184
185
  id: 'reject-suggestion',
185
- icon: 'close',
186
+ icon: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_utils_index_cjs_namespaceObject.NodeIcon, {
187
+ icon: "X",
188
+ size: 14
189
+ }),
186
190
  label: suggestTranslations.reject,
187
191
  disabled: false,
188
192
  onAction: ()=>handleActOnSuggestion(suggestionId, 'reject')
189
193
  };
190
194
  const acceptAction = {
191
195
  id: 'accept-suggestion',
192
- icon: 'check',
196
+ icon: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_utils_index_cjs_namespaceObject.NodeIcon, {
197
+ icon: "check",
198
+ size: 14
199
+ }),
193
200
  label: suggestTranslations.accept,
194
201
  disabled: false,
195
202
  onAction: ()=>handleActOnSuggestion(suggestionId, 'accept')
@@ -228,7 +235,10 @@ const ResourceNode = /*#__PURE__*/ (0, external_react_namespaceObject.memo)(({ d
228
235
  };
229
236
  const removeAction = {
230
237
  id: 'remove',
231
- icon: 'delete',
238
+ icon: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_utils_index_cjs_namespaceObject.NodeIcon, {
239
+ icon: "trash",
240
+ size: 14
241
+ }),
232
242
  label: translations?.remove ?? '',
233
243
  disabled: false,
234
244
  onAction: handleClickRemove
@@ -361,7 +371,7 @@ const ResourceNode = /*#__PURE__*/ (0, external_react_namespaceObject.memo)(({ d
361
371
  ]);
362
372
  const statusAdornment = (0, external_react_namespaceObject.useMemo)(()=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(ExecutionStatusIcon_cjs_namespaceObject.ExecutionStatusIcon, {
363
373
  status: executionStatus,
364
- size: 16
374
+ size: 14
365
375
  }), [
366
376
  executionStatus
367
377
  ]);
@@ -1 +1 @@
1
- {"version":3,"file":"ResourceNode.d.ts","sourceRoot":"","sources":["../../../../../src/canvas/components/AgentCanvas/nodes/ResourceNode.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,SAAS,EAAY,MAAM,0CAA0C,CAAC;AAGpF,OAAO,EACL,KAAK,qBAAqB,EAC1B,KAAK,yBAAyB,EAE9B,KAAK,wBAAwB,EAC7B,KAAK,sBAAsB,EAC5B,MAAM,gBAAgB,CAAC;AAexB,UAAU,iBAAkB,SAAQ,SAAS,CAAC,qBAAqB,CAAC;IAClE,IAAI,CAAC,EAAE,QAAQ,GAAG,MAAM,CAAC;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,QAAQ,EAAE,yBAAyB,KAAK,IAAI,CAAC;IAC7E,SAAS,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,QAAQ,EAAE,yBAAyB,KAAK,IAAI,CAAC;IAC9E,eAAe,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,QAAQ,EAAE,yBAAyB,KAAK,IAAI,CAAC;IACpF,kBAAkB,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,QAAQ,EAAE,yBAAyB,KAAK,IAAI,CAAC;IACvF,cAAc,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,QAAQ,EAAE,yBAAyB,KAAK,IAAI,CAAC;IACnF,YAAY,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,QAAQ,EAAE,yBAAyB,KAAK,IAAI,CAAC;IACjF,aAAa,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,QAAQ,EAAE,yBAAyB,KAAK,IAAI,CAAC;IAClF,gBAAgB,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,QAAQ,EAAE,yBAAyB,KAAK,IAAI,CAAC;IACrF,kBAAkB,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,QAAQ,EAAE,yBAAyB,KAAK,IAAI,CAAC;IACvF,gBAAgB,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IAChD,YAAY,CAAC,EAAE,wBAAwB,CAAC;IACxC,sBAAsB,CAAC,EAAE,sBAAsB,CAAC;IAEhD,sBAAsB,CAAC,EAAE,MAAM,CAAC;CACjC;AAED,eAAO,MAAM,YAAY,0RAoBpB,iBAAiB,6CAqcrB,CAAC"}
1
+ {"version":3,"file":"ResourceNode.d.ts","sourceRoot":"","sources":["../../../../../src/canvas/components/AgentCanvas/nodes/ResourceNode.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,SAAS,EAAY,MAAM,0CAA0C,CAAC;AAGpF,OAAO,EACL,KAAK,qBAAqB,EAC1B,KAAK,yBAAyB,EAE9B,KAAK,wBAAwB,EAC7B,KAAK,sBAAsB,EAC5B,MAAM,gBAAgB,CAAC;AAexB,UAAU,iBAAkB,SAAQ,SAAS,CAAC,qBAAqB,CAAC;IAClE,IAAI,CAAC,EAAE,QAAQ,GAAG,MAAM,CAAC;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,QAAQ,EAAE,yBAAyB,KAAK,IAAI,CAAC;IAC7E,SAAS,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,QAAQ,EAAE,yBAAyB,KAAK,IAAI,CAAC;IAC9E,eAAe,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,QAAQ,EAAE,yBAAyB,KAAK,IAAI,CAAC;IACpF,kBAAkB,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,QAAQ,EAAE,yBAAyB,KAAK,IAAI,CAAC;IACvF,cAAc,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,QAAQ,EAAE,yBAAyB,KAAK,IAAI,CAAC;IACnF,YAAY,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,QAAQ,EAAE,yBAAyB,KAAK,IAAI,CAAC;IACjF,aAAa,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,QAAQ,EAAE,yBAAyB,KAAK,IAAI,CAAC;IAClF,gBAAgB,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,QAAQ,EAAE,yBAAyB,KAAK,IAAI,CAAC;IACrF,kBAAkB,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,QAAQ,EAAE,yBAAyB,KAAK,IAAI,CAAC;IACvF,gBAAgB,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IAChD,YAAY,CAAC,EAAE,wBAAwB,CAAC;IACxC,sBAAsB,CAAC,EAAE,sBAAsB,CAAC;IAEhD,sBAAsB,CAAC,EAAE,MAAM,CAAC;CACjC;AAED,eAAO,MAAM,YAAY,0RAoBpB,iBAAiB,6CAocrB,CAAC"}
@@ -1,5 +1,6 @@
1
1
  import { jsx } from "react/jsx-runtime";
2
2
  import { McpIcon, MemoryIcon } from "../../../icons/index.js";
3
+ import { NodeIcon } from "../../../utils/index.js";
3
4
  import { Row } from "../../../layouts/index.js";
4
5
  import { Position } from "../../../xyflow/react.js";
5
6
  import { ApIcon } from "../../../../material/components/index.js";
@@ -149,19 +150,25 @@ const ResourceNode = /*#__PURE__*/ memo(({ data, selected, id, mode, hasError =
149
150
  data
150
151
  ]);
151
152
  const toolbarConfig = useMemo(()=>{
152
- if ('view' === mode) return null;
153
+ if ('view' === mode || data.isPlaceholder && (!isSuggestion || !suggestionId)) return null;
153
154
  if (isSuggestion && suggestionId) {
154
155
  if ('0.0.1' === suggestionGroupVersion) return null;
155
156
  const rejectAction = {
156
157
  id: 'reject-suggestion',
157
- icon: 'close',
158
+ icon: /*#__PURE__*/ jsx(NodeIcon, {
159
+ icon: "X",
160
+ size: 14
161
+ }),
158
162
  label: suggestTranslations.reject,
159
163
  disabled: false,
160
164
  onAction: ()=>handleActOnSuggestion(suggestionId, 'reject')
161
165
  };
162
166
  const acceptAction = {
163
167
  id: 'accept-suggestion',
164
- icon: 'check',
168
+ icon: /*#__PURE__*/ jsx(NodeIcon, {
169
+ icon: "check",
170
+ size: 14
171
+ }),
165
172
  label: suggestTranslations.accept,
166
173
  disabled: false,
167
174
  onAction: ()=>handleActOnSuggestion(suggestionId, 'accept')
@@ -200,7 +207,10 @@ const ResourceNode = /*#__PURE__*/ memo(({ data, selected, id, mode, hasError =
200
207
  };
201
208
  const removeAction = {
202
209
  id: 'remove',
203
- icon: 'delete',
210
+ icon: /*#__PURE__*/ jsx(NodeIcon, {
211
+ icon: "trash",
212
+ size: 14
213
+ }),
204
214
  label: translations?.remove ?? '',
205
215
  disabled: false,
206
216
  onAction: handleClickRemove
@@ -333,7 +343,7 @@ const ResourceNode = /*#__PURE__*/ memo(({ data, selected, id, mode, hasError =
333
343
  ]);
334
344
  const statusAdornment = useMemo(()=>/*#__PURE__*/ jsx(ExecutionStatusIcon, {
335
345
  status: executionStatus,
336
- size: 16
346
+ size: 14
337
347
  }), [
338
348
  executionStatus
339
349
  ]);
@@ -102,9 +102,7 @@ const BaseCanvasInnerComponent = (props)=>{
102
102
  panOnScroll: isInteractive,
103
103
  zoomOnScroll: isInteractive,
104
104
  zoomOnDoubleClick: isInteractive && zoomOnDoubleClick,
105
- panOnDrag: isInteractive ? [
106
- 1
107
- ] : false,
105
+ panOnDrag: isInteractive ? external_BaseCanvas_constants_cjs_namespaceObject.PAN_ON_DRAG : false,
108
106
  onInit: handleInit,
109
107
  onNodesChange: isInteractive ? onNodesChange : void 0,
110
108
  onEdgesChange: isInteractive ? onEdgesChange : void 0,
@@ -24,13 +24,14 @@ var __webpack_require__ = {};
24
24
  var __webpack_exports__ = {};
25
25
  __webpack_require__.r(__webpack_exports__);
26
26
  __webpack_require__.d(__webpack_exports__, {
27
- FLOW_LAYOUT: ()=>FLOW_LAYOUT,
28
- BASE_CANVAS_DEFAULTS: ()=>BASE_CANVAS_DEFAULTS,
29
- NODE_DIMENSIONS: ()=>NODE_DIMENSIONS,
30
27
  FIT_VIEW_DELAY_MS: ()=>FIT_VIEW_DELAY_MS,
31
28
  CANVAS_READY_DELAY_MS: ()=>CANVAS_READY_DELAY_MS,
32
29
  BASE_CANVAS_GRID_SPACING: ()=>BASE_CANVAS_GRID_SPACING,
33
- EDGE_STYLES: ()=>EDGE_STYLES
30
+ EDGE_STYLES: ()=>EDGE_STYLES,
31
+ FLOW_LAYOUT: ()=>FLOW_LAYOUT,
32
+ BASE_CANVAS_DEFAULTS: ()=>BASE_CANVAS_DEFAULTS,
33
+ NODE_DIMENSIONS: ()=>NODE_DIMENSIONS,
34
+ PAN_ON_DRAG: ()=>PAN_ON_DRAG
34
35
  });
35
36
  const react_cjs_namespaceObject = require("../../xyflow/react.cjs");
36
37
  const external_constants_cjs_namespaceObject = require("../../constants.cjs");
@@ -81,6 +82,9 @@ const BASE_CANVAS_DEFAULTS = {
81
82
  },
82
83
  organizeAnimationDuration: 500
83
84
  };
85
+ const PAN_ON_DRAG = [
86
+ 1
87
+ ];
84
88
  const FIT_VIEW_DELAY_MS = 50;
85
89
  const CANVAS_READY_DELAY_MS = 50;
86
90
  const EDGE_STYLES = {
@@ -117,6 +121,7 @@ exports.EDGE_STYLES = __webpack_exports__.EDGE_STYLES;
117
121
  exports.FIT_VIEW_DELAY_MS = __webpack_exports__.FIT_VIEW_DELAY_MS;
118
122
  exports.FLOW_LAYOUT = __webpack_exports__.FLOW_LAYOUT;
119
123
  exports.NODE_DIMENSIONS = __webpack_exports__.NODE_DIMENSIONS;
124
+ exports.PAN_ON_DRAG = __webpack_exports__.PAN_ON_DRAG;
120
125
  for(var __webpack_i__ in __webpack_exports__)if (-1 === [
121
126
  "BASE_CANVAS_DEFAULTS",
122
127
  "BASE_CANVAS_GRID_SPACING",
@@ -124,7 +129,8 @@ for(var __webpack_i__ in __webpack_exports__)if (-1 === [
124
129
  "EDGE_STYLES",
125
130
  "FIT_VIEW_DELAY_MS",
126
131
  "FLOW_LAYOUT",
127
- "NODE_DIMENSIONS"
132
+ "NODE_DIMENSIONS",
133
+ "PAN_ON_DRAG"
128
134
  ].indexOf(__webpack_i__)) exports[__webpack_i__] = __webpack_exports__[__webpack_i__];
129
135
  Object.defineProperty(exports, '__esModule', {
130
136
  value: true
@@ -43,6 +43,7 @@ export declare const BASE_CANVAS_DEFAULTS: {
43
43
  };
44
44
  readonly organizeAnimationDuration: 500;
45
45
  };
46
+ export declare const PAN_ON_DRAG: [number];
46
47
  export declare const FIT_VIEW_DELAY_MS = 50;
47
48
  export declare const CANVAS_READY_DELAY_MS = 50;
48
49
  export declare const EDGE_STYLES: {
@@ -1 +1 @@
1
- {"version":3,"file":"BaseCanvas.constants.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/BaseCanvas/BaseCanvas.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,0CAA0C,CAAC;AAG7E,eAAO,MAAM,wBAAwB,KAAe,CAAC;AAErD,eAAO,MAAM,oBAAoB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;uBAoCmC,CAAC,MAAM,EAAE,MAAM,CAAC;;;;;;CAM1E,CAAC;AAGX,eAAO,MAAM,iBAAiB,KAAK,CAAC;AACpC,eAAO,MAAM,qBAAqB,KAAK,CAAC;AAGxC,eAAO,MAAM,WAAW;;;CAGd,CAAC;AAGX,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;CAKlB,CAAC;AAGX,eAAO,MAAM,WAAW;;;;CAId,CAAC"}
1
+ {"version":3,"file":"BaseCanvas.constants.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/BaseCanvas/BaseCanvas.constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,0CAA0C,CAAC;AAG7E,eAAO,MAAM,wBAAwB,KAAe,CAAC;AAErD,eAAO,MAAM,oBAAoB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;uBAoCmC,CAAC,MAAM,EAAE,MAAM,CAAC;;;;;;CAM1E,CAAC;AAGX,eAAO,MAAM,WAAW,EAAE,CAAC,MAAM,CAAO,CAAC;AAGzC,eAAO,MAAM,iBAAiB,KAAK,CAAC;AACpC,eAAO,MAAM,qBAAqB,KAAK,CAAC;AAGxC,eAAO,MAAM,WAAW;;;CAGd,CAAC;AAGX,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;CAKlB,CAAC;AAGX,eAAO,MAAM,WAAW;;;;CAId,CAAC"}
@@ -47,6 +47,9 @@ const BASE_CANVAS_DEFAULTS = {
47
47
  },
48
48
  organizeAnimationDuration: 500
49
49
  };
50
+ const PAN_ON_DRAG = [
51
+ 1
52
+ ];
50
53
  const FIT_VIEW_DELAY_MS = 50;
51
54
  const CANVAS_READY_DELAY_MS = 50;
52
55
  const EDGE_STYLES = {
@@ -76,4 +79,4 @@ const FLOW_LAYOUT = {
76
79
  groupDistanceHorizontal: 200,
77
80
  groupDistanceVertical: 160
78
81
  };
79
- export { BASE_CANVAS_DEFAULTS, BASE_CANVAS_GRID_SPACING, CANVAS_READY_DELAY_MS, EDGE_STYLES, FIT_VIEW_DELAY_MS, FLOW_LAYOUT, NODE_DIMENSIONS };
82
+ export { BASE_CANVAS_DEFAULTS, BASE_CANVAS_GRID_SPACING, CANVAS_READY_DELAY_MS, EDGE_STYLES, FIT_VIEW_DELAY_MS, FLOW_LAYOUT, NODE_DIMENSIONS, PAN_ON_DRAG };
@@ -2,7 +2,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
2
2
  import { ConnectionMode, ReactFlow } from "../../xyflow/react.js";
3
3
  import { forwardRef, memo, useCallback, useImperativeHandle, useMemo, useState } from "react";
4
4
  import { useToolbarActionStore } from "../../hooks/ToolbarActionContext.js";
5
- import { BASE_CANVAS_DEFAULTS } from "./BaseCanvas.constants.js";
5
+ import { BASE_CANVAS_DEFAULTS, PAN_ON_DRAG } from "./BaseCanvas.constants.js";
6
6
  import { useAutoLayout, useEnsureNodesInView, useMaintainNodesInView } from "./BaseCanvas.hooks.js";
7
7
  import { CanvasBackground } from "./CanvasBackground.js";
8
8
  import { CanvasProviders } from "./CanvasProviders.js";
@@ -74,9 +74,7 @@ const BaseCanvasInnerComponent = (props)=>{
74
74
  panOnScroll: isInteractive,
75
75
  zoomOnScroll: isInteractive,
76
76
  zoomOnDoubleClick: isInteractive && zoomOnDoubleClick,
77
- panOnDrag: isInteractive ? [
78
- 1
79
- ] : false,
77
+ panOnDrag: isInteractive ? PAN_ON_DRAG : false,
80
78
  onInit: handleInit,
81
79
  onNodesChange: isInteractive ? onNodesChange : void 0,
82
80
  onEdgesChange: isInteractive ? onEdgesChange : void 0,
@@ -476,17 +476,14 @@ const StageNodeComponent = (props)=>{
476
476
  })
477
477
  }),
478
478
  (onTaskAdd || onAddTaskFromToolbox) && !isReadOnly && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApTooltip, {
479
- content: addTaskLoading ? 'Loading...' : addTaskLabel,
479
+ content: addTaskLabel,
480
480
  placement: "top",
481
481
  children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
482
482
  children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApIconButton, {
483
483
  onClick: handleTaskAddClick,
484
484
  size: "small",
485
- disabled: addTaskLoading,
486
485
  label: addTaskLabel,
487
- children: addTaskLoading ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApCircularProgress, {
488
- size: 20
489
- }) : /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApIcon, {
486
+ children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApIcon, {
490
487
  name: "add",
491
488
  size: "20px"
492
489
  })
@@ -601,6 +598,7 @@ const StageNodeComponent = (props)=>{
601
598
  children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_Toolbox_index_cjs_namespaceObject.Toolbox, {
602
599
  title: addTaskLabel,
603
600
  initialItems: taskOptions,
601
+ loading: addTaskLoading,
604
602
  onClose: ()=>setIsAddingTask(false),
605
603
  onItemSelect: handleAddTaskToolboxItemSelected,
606
604
  onSearch: onTaskToolboxSearch
@@ -1 +1 @@
1
- {"version":3,"file":"StageNode.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/StageNode.tsx"],"names":[],"mappings":"AAsDA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAspBxD,eAAO,MAAM,SAAS,8CA5oBa,cAAc,6CA4oBA,CAAC"}
1
+ {"version":3,"file":"StageNode.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/StageNode.tsx"],"names":[],"mappings":"AAqDA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAkpBxD,eAAO,MAAM,SAAS,8CAxoBa,cAAc,6CAwoBA,CAAC"}
@@ -4,7 +4,7 @@ import { SortableContext, sortableKeyboardCoordinates, verticalListSortingStrate
4
4
  import { FontVariantToken, Padding, Spacing } from "@uipath/apollo-core";
5
5
  import { Column, Row } from "../../layouts/index.js";
6
6
  import { Position, useStore, useViewport } from "../../xyflow/react.js";
7
- import { ApCircularProgress, ApIcon, ApIconButton, ApLink, ApTooltip, ApTypography } from "../../../material/index.js";
7
+ import { ApIcon, ApIconButton, ApLink, ApTooltip, ApTypography } from "../../../material/index.js";
8
8
  import { memo, useCallback, useEffect, useMemo, useRef, useState } from "react";
9
9
  import { createPortal } from "react-dom";
10
10
  import { useConnectedHandles } from "../BaseCanvas/ConnectedHandlesContext.js";
@@ -448,17 +448,14 @@ const StageNodeComponent = (props)=>{
448
448
  })
449
449
  }),
450
450
  (onTaskAdd || onAddTaskFromToolbox) && !isReadOnly && /*#__PURE__*/ jsx(ApTooltip, {
451
- content: addTaskLoading ? 'Loading...' : addTaskLabel,
451
+ content: addTaskLabel,
452
452
  placement: "top",
453
453
  children: /*#__PURE__*/ jsx("span", {
454
454
  children: /*#__PURE__*/ jsx(ApIconButton, {
455
455
  onClick: handleTaskAddClick,
456
456
  size: "small",
457
- disabled: addTaskLoading,
458
457
  label: addTaskLabel,
459
- children: addTaskLoading ? /*#__PURE__*/ jsx(ApCircularProgress, {
460
- size: 20
461
- }) : /*#__PURE__*/ jsx(ApIcon, {
458
+ children: /*#__PURE__*/ jsx(ApIcon, {
462
459
  name: "add",
463
460
  size: "20px"
464
461
  })
@@ -573,6 +570,7 @@ const StageNodeComponent = (props)=>{
573
570
  children: /*#__PURE__*/ jsx(Toolbox, {
574
571
  title: addTaskLabel,
575
572
  initialItems: taskOptions,
573
+ loading: addTaskLoading,
576
574
  onClose: ()=>setIsAddingTask(false),
577
575
  onItemSelect: handleAddTaskToolboxItemSelected,
578
576
  onSearch: onTaskToolboxSearch
@@ -1651,6 +1651,59 @@ const AddAndReplaceTasks = {
1651
1651
  render: ()=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(AddAndReplaceTasksStory, {}),
1652
1652
  args: {}
1653
1653
  };
1654
+ const fetchChildren = (id)=>new Promise((resolve)=>{
1655
+ setTimeout(()=>{
1656
+ resolve([
1657
+ {
1658
+ id: `${id}-sub-1`,
1659
+ name: `${id} - Subtask A`,
1660
+ data: {
1661
+ type: `${id}-a`
1662
+ }
1663
+ },
1664
+ {
1665
+ id: `${id}-sub-2`,
1666
+ name: `${id} - Subtask B`,
1667
+ data: {
1668
+ type: `${id}-b`
1669
+ }
1670
+ },
1671
+ {
1672
+ id: `${id}-sub-3`,
1673
+ name: `${id} - Subtask C`,
1674
+ data: {
1675
+ type: `${id}-c`
1676
+ }
1677
+ }
1678
+ ]);
1679
+ }, 2000);
1680
+ });
1681
+ const loadedTaskOptionsWithChildren = [
1682
+ {
1683
+ id: 'email',
1684
+ name: 'Email',
1685
+ data: {
1686
+ type: 'email'
1687
+ },
1688
+ children: (id)=>fetchChildren(id)
1689
+ },
1690
+ {
1691
+ id: 'approval',
1692
+ name: 'Approval',
1693
+ data: {
1694
+ type: 'approval'
1695
+ },
1696
+ children: (id)=>fetchChildren(id)
1697
+ },
1698
+ {
1699
+ id: "script",
1700
+ name: 'Script',
1701
+ data: {
1702
+ type: "script"
1703
+ },
1704
+ children: (id)=>fetchChildren(id)
1705
+ }
1706
+ ];
1654
1707
  const AddTaskLoadingStory = ()=>{
1655
1708
  const StageNodeWrapper = (0, external_react_namespaceObject.useMemo)(()=>function(props) {
1656
1709
  return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_StageNode_cjs_namespaceObject.StageNode, {
@@ -1677,14 +1730,15 @@ const AddTaskLoadingStory = ()=>{
1677
1730
  width: 304,
1678
1731
  data: {
1679
1732
  stageDetails: {
1680
- label: 'Empty Stage (click +)',
1733
+ label: 'Top-level loading (click +)',
1681
1734
  tasks: []
1682
1735
  },
1683
- addTaskLoading: false
1736
+ addTaskLoading: true,
1737
+ taskOptions: []
1684
1738
  }
1685
1739
  },
1686
1740
  {
1687
- id: 'loading-stage-with-tasks',
1741
+ id: 'loading-stage-children',
1688
1742
  type: 'stage',
1689
1743
  position: {
1690
1744
  x: 400,
@@ -1693,7 +1747,7 @@ const AddTaskLoadingStory = ()=>{
1693
1747
  width: 304,
1694
1748
  data: {
1695
1749
  stageDetails: {
1696
- label: 'With Tasks (click +)',
1750
+ label: 'Async children (click +)',
1697
1751
  tasks: [
1698
1752
  [
1699
1753
  {
@@ -1701,50 +1755,41 @@ const AddTaskLoadingStory = ()=>{
1701
1755
  label: 'Existing Task',
1702
1756
  icon: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(VerificationIcon, {})
1703
1757
  }
1704
- ],
1705
- [
1706
- {
1707
- id: 'task-2',
1708
- label: 'Another Task',
1709
- icon: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(DocumentIcon, {})
1710
- }
1711
1758
  ]
1712
1759
  ]
1713
1760
  },
1714
- addTaskLoading: false
1761
+ addTaskLoading: false,
1762
+ taskOptions: loadedTaskOptionsWithChildren
1715
1763
  }
1716
1764
  }
1717
1765
  ], []);
1718
1766
  const [nodesState, setNodes, onNodesChange] = (0, react_cjs_namespaceObject.useNodesState)(initialNodes);
1719
1767
  const [edges, setEdges, onEdgesChange] = (0, react_cjs_namespaceObject.useEdgesState)([]);
1720
- const setNodeLoading = (0, external_react_namespaceObject.useCallback)((nodeId, loading)=>{
1721
- setNodes((nds)=>nds.map((node)=>node.id === nodeId ? {
1722
- ...node,
1723
- data: {
1724
- ...node.data,
1725
- addTaskLoading: loading
1726
- }
1727
- } : node));
1728
- }, [
1729
- setNodes
1730
- ]);
1731
- const handleTaskAddForNode = (0, external_react_namespaceObject.useCallback)((nodeId)=>{
1732
- setNodeLoading(nodeId, true);
1733
- setTimeout(()=>{
1734
- setNodeLoading(nodeId, false);
1768
+ (0, external_react_namespaceObject.useEffect)(()=>{
1769
+ const timeout = setTimeout(()=>{
1770
+ setNodes((nds)=>nds.map((node)=>'loading-stage-empty' === node.id ? {
1771
+ ...node,
1772
+ data: {
1773
+ ...node.data,
1774
+ addTaskLoading: false,
1775
+ taskOptions: loadedTaskOptionsWithChildren
1776
+ }
1777
+ } : node));
1735
1778
  }, 3000);
1779
+ return ()=>clearTimeout(timeout);
1736
1780
  }, [
1737
- setNodeLoading
1781
+ setNodes
1738
1782
  ]);
1739
1783
  const nodesWithHandler = (0, external_react_namespaceObject.useMemo)(()=>nodesState.map((node)=>({
1740
1784
  ...node,
1741
1785
  data: {
1742
1786
  ...node.data,
1743
- onTaskAdd: ()=>handleTaskAddForNode(node.id)
1787
+ onAddTaskFromToolbox: (taskItem)=>{
1788
+ window.alert(`Added task "${taskItem.name}" to ${node.id}`);
1789
+ }
1744
1790
  }
1745
1791
  })), [
1746
- nodesState,
1747
- handleTaskAddForNode
1792
+ nodesState
1748
1793
  ]);
1749
1794
  const onConnect = (0, external_react_namespaceObject.useCallback)((connection)=>setEdges((eds)=>(0, react_cjs_namespaceObject.addEdge)(connection, eds)), [
1750
1795
  setEdges
@@ -1 +1 @@
1
- {"version":3,"file":"StageNode.stories.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/StageNode.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAyBvD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAGxC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,SAAS,CA0FD,CAAC;AAEjC,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AA4CnC,eAAO,MAAM,OAAO,EAAE,KA2DrB,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAsE3B,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KA8M7B,CAAC;AAEF,eAAO,MAAM,yBAAyB,EAAE,KA+HvC,CAAC;AAEF,eAAO,MAAM,sBAAsB,EAAE,KAoKpC,CAAC;AA8GF,eAAO,MAAM,uBAAuB,EAAE,KAOrC,CAAC;AAkVF,eAAO,MAAM,kBAAkB,EAAE,KAOhC,CAAC;AAuHF,eAAO,MAAM,cAAc,EAAE,KAO5B,CAAC"}
1
+ {"version":3,"file":"StageNode.stories.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/StageNode.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAyBvD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAGxC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,SAAS,CA0FD,CAAC;AAEjC,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AA4CnC,eAAO,MAAM,OAAO,EAAE,KA2DrB,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAsE3B,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KA8M7B,CAAC;AAEF,eAAO,MAAM,yBAAyB,EAAE,KA+HvC,CAAC;AAEF,eAAO,MAAM,sBAAsB,EAAE,KAoKpC,CAAC;AA8GF,eAAO,MAAM,uBAAuB,EAAE,KAOrC,CAAC;AAkVF,eAAO,MAAM,kBAAkB,EAAE,KAOhC,CAAC;AAmJF,eAAO,MAAM,cAAc,EAAE,KAO5B,CAAC"}
@@ -1,7 +1,7 @@
1
1
  import { jsx, jsxs } from "react/jsx-runtime";
2
2
  import { ConnectionMode, Panel, ReactFlowProvider, addEdge, useEdgesState, useNodesState } from "../../xyflow/react.js";
3
3
  import { ApButton, ApMenu } from "../../../material/components/index.js";
4
- import { useCallback, useMemo, useState } from "react";
4
+ import { useCallback, useEffect, useMemo, useState } from "react";
5
5
  import { DefaultCanvasTranslations } from "../../types.js";
6
6
  import { createGroupModificationHandlers, getHandlerForModificationType } from "../../utils/GroupModificationUtils.js";
7
7
  import { BaseCanvas } from "../BaseCanvas/index.js";
@@ -1615,6 +1615,59 @@ const AddAndReplaceTasks = {
1615
1615
  render: ()=>/*#__PURE__*/ jsx(AddAndReplaceTasksStory, {}),
1616
1616
  args: {}
1617
1617
  };
1618
+ const fetchChildren = (id)=>new Promise((resolve)=>{
1619
+ setTimeout(()=>{
1620
+ resolve([
1621
+ {
1622
+ id: `${id}-sub-1`,
1623
+ name: `${id} - Subtask A`,
1624
+ data: {
1625
+ type: `${id}-a`
1626
+ }
1627
+ },
1628
+ {
1629
+ id: `${id}-sub-2`,
1630
+ name: `${id} - Subtask B`,
1631
+ data: {
1632
+ type: `${id}-b`
1633
+ }
1634
+ },
1635
+ {
1636
+ id: `${id}-sub-3`,
1637
+ name: `${id} - Subtask C`,
1638
+ data: {
1639
+ type: `${id}-c`
1640
+ }
1641
+ }
1642
+ ]);
1643
+ }, 2000);
1644
+ });
1645
+ const loadedTaskOptionsWithChildren = [
1646
+ {
1647
+ id: 'email',
1648
+ name: 'Email',
1649
+ data: {
1650
+ type: 'email'
1651
+ },
1652
+ children: (id)=>fetchChildren(id)
1653
+ },
1654
+ {
1655
+ id: 'approval',
1656
+ name: 'Approval',
1657
+ data: {
1658
+ type: 'approval'
1659
+ },
1660
+ children: (id)=>fetchChildren(id)
1661
+ },
1662
+ {
1663
+ id: "script",
1664
+ name: 'Script',
1665
+ data: {
1666
+ type: "script"
1667
+ },
1668
+ children: (id)=>fetchChildren(id)
1669
+ }
1670
+ ];
1618
1671
  const AddTaskLoadingStory = ()=>{
1619
1672
  const StageNodeWrapper = useMemo(()=>function(props) {
1620
1673
  return /*#__PURE__*/ jsx(StageNode, {
@@ -1641,14 +1694,15 @@ const AddTaskLoadingStory = ()=>{
1641
1694
  width: 304,
1642
1695
  data: {
1643
1696
  stageDetails: {
1644
- label: 'Empty Stage (click +)',
1697
+ label: 'Top-level loading (click +)',
1645
1698
  tasks: []
1646
1699
  },
1647
- addTaskLoading: false
1700
+ addTaskLoading: true,
1701
+ taskOptions: []
1648
1702
  }
1649
1703
  },
1650
1704
  {
1651
- id: 'loading-stage-with-tasks',
1705
+ id: 'loading-stage-children',
1652
1706
  type: 'stage',
1653
1707
  position: {
1654
1708
  x: 400,
@@ -1657,7 +1711,7 @@ const AddTaskLoadingStory = ()=>{
1657
1711
  width: 304,
1658
1712
  data: {
1659
1713
  stageDetails: {
1660
- label: 'With Tasks (click +)',
1714
+ label: 'Async children (click +)',
1661
1715
  tasks: [
1662
1716
  [
1663
1717
  {
@@ -1665,50 +1719,41 @@ const AddTaskLoadingStory = ()=>{
1665
1719
  label: 'Existing Task',
1666
1720
  icon: /*#__PURE__*/ jsx(VerificationIcon, {})
1667
1721
  }
1668
- ],
1669
- [
1670
- {
1671
- id: 'task-2',
1672
- label: 'Another Task',
1673
- icon: /*#__PURE__*/ jsx(DocumentIcon, {})
1674
- }
1675
1722
  ]
1676
1723
  ]
1677
1724
  },
1678
- addTaskLoading: false
1725
+ addTaskLoading: false,
1726
+ taskOptions: loadedTaskOptionsWithChildren
1679
1727
  }
1680
1728
  }
1681
1729
  ], []);
1682
1730
  const [nodesState, setNodes, onNodesChange] = useNodesState(initialNodes);
1683
1731
  const [edges, setEdges, onEdgesChange] = useEdgesState([]);
1684
- const setNodeLoading = useCallback((nodeId, loading)=>{
1685
- setNodes((nds)=>nds.map((node)=>node.id === nodeId ? {
1686
- ...node,
1687
- data: {
1688
- ...node.data,
1689
- addTaskLoading: loading
1690
- }
1691
- } : node));
1692
- }, [
1693
- setNodes
1694
- ]);
1695
- const handleTaskAddForNode = useCallback((nodeId)=>{
1696
- setNodeLoading(nodeId, true);
1697
- setTimeout(()=>{
1698
- setNodeLoading(nodeId, false);
1732
+ useEffect(()=>{
1733
+ const timeout = setTimeout(()=>{
1734
+ setNodes((nds)=>nds.map((node)=>'loading-stage-empty' === node.id ? {
1735
+ ...node,
1736
+ data: {
1737
+ ...node.data,
1738
+ addTaskLoading: false,
1739
+ taskOptions: loadedTaskOptionsWithChildren
1740
+ }
1741
+ } : node));
1699
1742
  }, 3000);
1743
+ return ()=>clearTimeout(timeout);
1700
1744
  }, [
1701
- setNodeLoading
1745
+ setNodes
1702
1746
  ]);
1703
1747
  const nodesWithHandler = useMemo(()=>nodesState.map((node)=>({
1704
1748
  ...node,
1705
1749
  data: {
1706
1750
  ...node.data,
1707
- onTaskAdd: ()=>handleTaskAddForNode(node.id)
1751
+ onAddTaskFromToolbox: (taskItem)=>{
1752
+ window.alert(`Added task "${taskItem.name}" to ${node.id}`);
1753
+ }
1708
1754
  }
1709
1755
  })), [
1710
- nodesState,
1711
- handleTaskAddForNode
1756
+ nodesState
1712
1757
  ]);
1713
1758
  const onConnect = useCallback((connection)=>setEdges((eds)=>addEdge(connection, eds)), [
1714
1759
  setEdges
@@ -1 +1 @@
1
- {"version":3,"file":"TriggerNode.stories.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/TriggerNode/TriggerNode.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,KAAK,EAEV,IAAI,EAEJ,IAAI,EAEL,MAAM,0CAA0C,CAAC;AAsNlD,QAAA,MAAM,IAAI;;;WAyB07E,CAAC;;yBArBz7E,GAAG;;;;CAaoB,CAAC;AAEpC,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAErB,CAAC"}
1
+ {"version":3,"file":"TriggerNode.stories.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/TriggerNode/TriggerNode.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,KAAK,EAEV,IAAI,EAEJ,IAAI,EAEL,MAAM,0CAA0C,CAAC;AAsNlD,QAAA,MAAM,IAAI;;;WAyB+8E,CAAC;;yBArB98E,GAAG;;;;CAaoB,CAAC;AAEpC,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAErB,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@uipath/apollo-react",
3
- "version": "3.44.3",
3
+ "version": "3.45.1-pr280.8f162e1",
4
4
  "description": "Apollo Design System - React component library with Material UI theming",
5
5
  "repository": {
6
6
  "type": "git",