@uipath/apollo-react 6.74.0 → 6.75.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.
Files changed (41) hide show
  1. package/dist/canvas/components/BaseCanvas/BaseCanvas.cjs +2 -0
  2. package/dist/canvas/components/BaseCanvas/BaseCanvas.d.ts.map +1 -1
  3. package/dist/canvas/components/BaseCanvas/BaseCanvas.js +2 -0
  4. package/dist/canvas/components/BaseCanvas/CanvasProviders.cjs +10 -4
  5. package/dist/canvas/components/BaseCanvas/CanvasProviders.d.ts +5 -2
  6. package/dist/canvas/components/BaseCanvas/CanvasProviders.d.ts.map +1 -1
  7. package/dist/canvas/components/BaseCanvas/CanvasProviders.js +10 -4
  8. package/dist/canvas/components/BaseNode/BaseNode.cjs +4 -2
  9. package/dist/canvas/components/BaseNode/BaseNode.d.ts.map +1 -1
  10. package/dist/canvas/components/BaseNode/BaseNode.js +5 -3
  11. package/dist/canvas/components/ContainerNode/ContainerNode.cjs +4 -2
  12. package/dist/canvas/components/ContainerNode/ContainerNode.d.ts.map +1 -1
  13. package/dist/canvas/components/ContainerNode/ContainerNode.js +5 -3
  14. package/dist/canvas/components/JsonTree/JsonTree.cjs +7 -0
  15. package/dist/canvas/components/JsonTree/JsonTree.d.ts.map +1 -1
  16. package/dist/canvas/components/JsonTree/JsonTree.js +7 -0
  17. package/dist/canvas/components/JsonTree/index.d.ts +1 -1
  18. package/dist/canvas/components/JsonTree/index.d.ts.map +1 -1
  19. package/dist/canvas/components/NodePropertyPanel/NodePropertyPanel.cjs +60 -1
  20. package/dist/canvas/components/NodePropertyPanel/NodePropertyPanel.d.ts +1 -1
  21. package/dist/canvas/components/NodePropertyPanel/NodePropertyPanel.d.ts.map +1 -1
  22. package/dist/canvas/components/NodePropertyPanel/NodePropertyPanel.js +61 -2
  23. package/dist/canvas/components/NodePropertyPanel/NodePropertyPanel.types.d.ts +1 -0
  24. package/dist/canvas/components/NodePropertyPanel/NodePropertyPanel.types.d.ts.map +1 -1
  25. package/dist/canvas/hooks/ToolbarActionContext.cjs +53 -9
  26. package/dist/canvas/hooks/ToolbarActionContext.d.ts +6 -2
  27. package/dist/canvas/hooks/ToolbarActionContext.d.ts.map +1 -1
  28. package/dist/canvas/hooks/ToolbarActionContext.js +48 -10
  29. package/dist/canvas/hooks/mountedCanvases.cjs +52 -0
  30. package/dist/canvas/hooks/mountedCanvases.d.ts +8 -0
  31. package/dist/canvas/hooks/mountedCanvases.d.ts.map +1 -0
  32. package/dist/canvas/hooks/mountedCanvases.js +12 -0
  33. package/dist/canvas/locales/en.cjs +1 -1
  34. package/dist/canvas/locales/en.d.ts.map +1 -1
  35. package/dist/canvas/locales/en.js +1 -1
  36. package/dist/canvas/styles/tailwind.canvas.css +1 -1
  37. package/dist/canvas/utils/toolbar-resolver.cjs +5 -5
  38. package/dist/canvas/utils/toolbar-resolver.d.ts +2 -1
  39. package/dist/canvas/utils/toolbar-resolver.d.ts.map +1 -1
  40. package/dist/canvas/utils/toolbar-resolver.js +5 -5
  41. package/package.json +2 -2
@@ -111,6 +111,8 @@ const BaseCanvasInnerComponent = (props)=>{
111
111
  locale: locale,
112
112
  stickyNoteOptions: stickyNoteOptions,
113
113
  readOnlyNodeIds: stableReadOnlyNodeIds,
114
+ onToolbarAction: onToolbarAction,
115
+ breakpoints: breakpoints,
114
116
  children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(react_cjs_namespaceObject.ReactFlow, {
115
117
  ...reactFlowProps,
116
118
  colorMode: '',
@@ -1 +1 @@
1
- {"version":3,"file":"BaseCanvas.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/BaseCanvas/BaseCanvas.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAEV,IAAI,EACJ,IAAI,EAEL,MAAM,0CAA0C,CAAC;AAElD,OAAO,EAIL,KAAK,YAAY,EAKlB,MAAM,OAAO,CAAC;AAUf,OAAO,KAAK,EAAE,eAAe,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAwQzE,eAAO,MAAM,UAAU,EAKjB,CAAC,QAAQ,SAAS,IAAI,GAAG,IAAI,EAAE,QAAQ,SAAS,IAAI,GAAG,IAAI,EAC/D,KAAK,EAAE,eAAe,CAAC,QAAQ,EAAE,QAAQ,CAAC,GAAG;IAC3C,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,aAAa,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC;CACpD,KACE,YAAY,CAAC"}
1
+ {"version":3,"file":"BaseCanvas.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/BaseCanvas/BaseCanvas.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAEV,IAAI,EACJ,IAAI,EAEL,MAAM,0CAA0C,CAAC;AAElD,OAAO,EAIL,KAAK,YAAY,EAKlB,MAAM,OAAO,CAAC;AAUf,OAAO,KAAK,EAAE,eAAe,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AA0QzE,eAAO,MAAM,UAAU,EAKjB,CAAC,QAAQ,SAAS,IAAI,GAAG,IAAI,EAAE,QAAQ,SAAS,IAAI,GAAG,IAAI,EAC/D,KAAK,EAAE,eAAe,CAAC,QAAQ,EAAE,QAAQ,CAAC,GAAG;IAC3C,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,aAAa,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC;CACpD,KACE,YAAY,CAAC"}
@@ -83,6 +83,8 @@ const BaseCanvasInnerComponent = (props)=>{
83
83
  locale: locale,
84
84
  stickyNoteOptions: stickyNoteOptions,
85
85
  readOnlyNodeIds: stableReadOnlyNodeIds,
86
+ onToolbarAction: onToolbarAction,
87
+ breakpoints: breakpoints,
86
88
  children: /*#__PURE__*/ jsxs(ReactFlow, {
87
89
  ...reactFlowProps,
88
90
  colorMode: '',
@@ -29,6 +29,7 @@ __webpack_require__.d(__webpack_exports__, {
29
29
  const jsx_runtime_namespaceObject = require("react/jsx-runtime");
30
30
  const tooltip_namespaceObject = require("@uipath/apollo-wind/components/ui/tooltip");
31
31
  const index_cjs_namespaceObject = require("../../../i18n/index.cjs");
32
+ const ToolbarActionContext_cjs_namespaceObject = require("../../hooks/ToolbarActionContext.cjs");
32
33
  const external_CanvasTooltip_cjs_namespaceObject = require("../CanvasTooltip.cjs");
33
34
  const crossings_index_cjs_namespaceObject = require("../Edges/shared/crossings/index.cjs");
34
35
  const StickyNoteCanvasOptionsContext_cjs_namespaceObject = require("../StickyNoteNode/StickyNoteCanvasOptionsContext.cjs");
@@ -37,7 +38,7 @@ const external_CanvasThemeContext_cjs_namespaceObject = require("./CanvasThemeCo
37
38
  const external_ConnectedHandlesContext_cjs_namespaceObject = require("./ConnectedHandlesContext.cjs");
38
39
  const external_ReadOnlyNodesContext_cjs_namespaceObject = require("./ReadOnlyNodesContext.cjs");
39
40
  const external_SelectionStateContext_cjs_namespaceObject = require("./SelectionStateContext.cjs");
40
- function CanvasProviders({ nodes, edges, mode, isDarkMode, locale, stickyNoteOptions, readOnlyNodeIds, children }) {
41
+ function CanvasProviders({ nodes, edges, mode, isDarkMode, locale, stickyNoteOptions, readOnlyNodeIds, onToolbarAction, breakpoints, children }) {
41
42
  return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(index_cjs_namespaceObject.ApI18nProvider, {
42
43
  component: "canvas",
43
44
  locale: locale,
@@ -56,9 +57,14 @@ function CanvasProviders({ nodes, edges, mode, isDarkMode, locale, stickyNoteOpt
56
57
  readOnlyNodeIds: readOnlyNodeIds,
57
58
  children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(StickyNoteCanvasOptionsContext_cjs_namespaceObject.StickyNoteCanvasOptionsProvider, {
58
59
  options: stickyNoteOptions,
59
- children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_SelectionStateContext_cjs_namespaceObject.SelectionStateProvider, {
60
- nodes: nodes,
61
- children: children
60
+ children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(ToolbarActionContext_cjs_namespaceObject.ToolbarActionStoreProvider, {
61
+ mode: mode,
62
+ onToolbarAction: onToolbarAction,
63
+ breakpoints: breakpoints,
64
+ children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_SelectionStateContext_cjs_namespaceObject.SelectionStateProvider, {
65
+ nodes: nodes,
66
+ children: children
67
+ })
62
68
  })
63
69
  })
64
70
  })
@@ -1,17 +1,20 @@
1
1
  import type { Edge, Node } from '../../xyflow/react.ts';
2
2
  import type { ReactNode } from 'react';
3
+ import type { ToolbarActionHandler } from '../../schema/toolbar';
3
4
  import type { StickyNoteCanvasOptions } from '../StickyNoteNode/StickyNoteNode.types';
4
5
  import type { BaseCanvasProps } from './BaseCanvas.types';
5
6
  interface CanvasProvidersProps {
6
7
  children: ReactNode;
7
8
  nodes: Node[];
8
9
  edges: Edge[];
9
- mode: BaseCanvasProps['mode'];
10
+ mode: NonNullable<BaseCanvasProps['mode']>;
10
11
  isDarkMode?: boolean;
11
12
  locale?: BaseCanvasProps['locale'];
12
13
  stickyNoteOptions?: StickyNoteCanvasOptions;
13
14
  readOnlyNodeIds?: ReadonlySet<string>;
15
+ onToolbarAction?: ToolbarActionHandler;
16
+ breakpoints?: Set<string>;
14
17
  }
15
- export declare function CanvasProviders({ nodes, edges, mode, isDarkMode, locale, stickyNoteOptions, readOnlyNodeIds, children, }: CanvasProvidersProps): import("react/jsx-runtime").JSX.Element;
18
+ export declare function CanvasProviders({ nodes, edges, mode, isDarkMode, locale, stickyNoteOptions, readOnlyNodeIds, onToolbarAction, breakpoints, children, }: CanvasProvidersProps): import("react/jsx-runtime").JSX.Element;
16
19
  export {};
17
20
  //# sourceMappingURL=CanvasProviders.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"CanvasProviders.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/BaseCanvas/CanvasProviders.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,0CAA0C,CAAC;AAE3E,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAKvC,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,wCAAwC,CAAC;AACtF,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAO1D,UAAU,oBAAoB;IAC5B,QAAQ,EAAE,SAAS,CAAC;IACpB,KAAK,EAAE,IAAI,EAAE,CAAC;IACd,KAAK,EAAE,IAAI,EAAE,CAAC;IACd,IAAI,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IAC9B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,MAAM,CAAC,EAAE,eAAe,CAAC,QAAQ,CAAC,CAAC;IACnC,iBAAiB,CAAC,EAAE,uBAAuB,CAAC;IAC5C,eAAe,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;CACvC;AAQD,wBAAgB,eAAe,CAAC,EAC9B,KAAK,EACL,KAAK,EACL,IAAI,EACJ,UAAU,EACV,MAAM,EACN,iBAAiB,EACjB,eAAe,EACf,QAAQ,GACT,EAAE,oBAAoB,2CAsBtB"}
1
+ {"version":3,"file":"CanvasProviders.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/BaseCanvas/CanvasProviders.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,0CAA0C,CAAC;AAE3E,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AAIjE,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,wCAAwC,CAAC;AACtF,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAO1D,UAAU,oBAAoB;IAC5B,QAAQ,EAAE,SAAS,CAAC;IACpB,KAAK,EAAE,IAAI,EAAE,CAAC;IACd,KAAK,EAAE,IAAI,EAAE,CAAC;IAEd,IAAI,EAAE,WAAW,CAAC,eAAe,CAAC,MAAM,CAAC,CAAC,CAAC;IAC3C,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,MAAM,CAAC,EAAE,eAAe,CAAC,QAAQ,CAAC,CAAC;IACnC,iBAAiB,CAAC,EAAE,uBAAuB,CAAC;IAC5C,eAAe,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IACtC,eAAe,CAAC,EAAE,oBAAoB,CAAC;IACvC,WAAW,CAAC,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;CAC3B;AAQD,wBAAgB,eAAe,CAAC,EAC9B,KAAK,EACL,KAAK,EACL,IAAI,EACJ,UAAU,EACV,MAAM,EACN,iBAAiB,EACjB,eAAe,EACf,eAAe,EACf,WAAW,EACX,QAAQ,GACT,EAAE,oBAAoB,2CA4BtB"}
@@ -1,6 +1,7 @@
1
1
  import { jsx } from "react/jsx-runtime";
2
2
  import { TooltipProvider } from "@uipath/apollo-wind/components/ui/tooltip";
3
3
  import { ApI18nProvider } from "../../../i18n/index.js";
4
+ import { ToolbarActionStoreProvider } from "../../hooks/ToolbarActionContext.js";
4
5
  import { CanvasTooltipProviderMarker } from "../CanvasTooltip.js";
5
6
  import { EdgeCrossingsProvider } from "../Edges/shared/crossings/index.js";
6
7
  import { StickyNoteCanvasOptionsProvider } from "../StickyNoteNode/StickyNoteCanvasOptionsContext.js";
@@ -9,7 +10,7 @@ import { CanvasThemeProvider } from "./CanvasThemeContext.js";
9
10
  import { ConnectedHandlesProvider } from "./ConnectedHandlesContext.js";
10
11
  import { ReadOnlyNodesProvider } from "./ReadOnlyNodesContext.js";
11
12
  import { SelectionStateProvider } from "./SelectionStateContext.js";
12
- function CanvasProviders({ nodes, edges, mode, isDarkMode, locale, stickyNoteOptions, readOnlyNodeIds, children }) {
13
+ function CanvasProviders({ nodes, edges, mode, isDarkMode, locale, stickyNoteOptions, readOnlyNodeIds, onToolbarAction, breakpoints, children }) {
13
14
  return /*#__PURE__*/ jsx(ApI18nProvider, {
14
15
  component: "canvas",
15
16
  locale: locale,
@@ -28,9 +29,14 @@ function CanvasProviders({ nodes, edges, mode, isDarkMode, locale, stickyNoteOpt
28
29
  readOnlyNodeIds: readOnlyNodeIds,
29
30
  children: /*#__PURE__*/ jsx(StickyNoteCanvasOptionsProvider, {
30
31
  options: stickyNoteOptions,
31
- children: /*#__PURE__*/ jsx(SelectionStateProvider, {
32
- nodes: nodes,
33
- children: children
32
+ children: /*#__PURE__*/ jsx(ToolbarActionStoreProvider, {
33
+ mode: mode,
34
+ onToolbarAction: onToolbarAction,
35
+ breakpoints: breakpoints,
36
+ children: /*#__PURE__*/ jsx(SelectionStateProvider, {
37
+ nodes: nodes,
38
+ children: children
39
+ })
34
40
  })
35
41
  })
36
42
  })
@@ -169,13 +169,15 @@ const BaseNodeComponent = (props)=>{
169
169
  data,
170
170
  id
171
171
  ]);
172
+ const toolbarActionStore = (0, external_hooks_index_cjs_namespaceObject.useToolbarActionStoreContext)();
172
173
  const toolbarConfig = (0, external_react_namespaceObject.useMemo)(()=>{
173
174
  if (void 0 !== toolbarConfigProp) return null === toolbarConfigProp ? void 0 : toolbarConfigProp;
174
- return manifest ? (0, toolbar_resolver_cjs_namespaceObject.resolveToolbar)(manifest, statusContext) : void 0;
175
+ return manifest ? (0, toolbar_resolver_cjs_namespaceObject.resolveToolbar)(manifest, statusContext, void 0, toolbarActionStore) : void 0;
175
176
  }, [
176
177
  toolbarConfigProp,
177
178
  manifest,
178
- statusContext
179
+ statusContext,
180
+ toolbarActionStore
179
181
  ]);
180
182
  const effectiveToolbarConfig = (0, external_react_namespaceObject.useMemo)(()=>toolbarConfig && isNodeReadOnly ? (0, NodeToolbar_utils_cjs_namespaceObject.lockToolbarConfig)(toolbarConfig) : toolbarConfig, [
181
183
  toolbarConfig,
@@ -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;AA+ChF,OAAO,KAAK,EACV,YAAY,EAIb,MAAM,kBAAkB,CAAC;AA2sB1B,eAAO,MAAM,QAAQ,8CAtqBa,SAAS,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,6CAsqBmB,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;AAmDhF,OAAO,KAAK,EACV,YAAY,EAIb,MAAM,kBAAkB,CAAC;AAgtB1B,eAAO,MAAM,QAAQ,8CA3qBa,SAAS,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,6CA2qBmB,CAAC"}
@@ -3,7 +3,7 @@ import { Position, useReactFlow, useStore, useUpdateNodeInternals } from "../../
3
3
  import { memo, useCallback, useEffect, useMemo, useRef, useState } from "react";
4
4
  import { DEFAULT_NODE_SIZE, DEFAULT_RECTANGLE_NODE_WIDTH, GRID_SPACING, NODE_BADGE_INSET_CIRCLE, NODE_BADGE_INSET_SQUARE, NODE_BADGE_SIZE, NODE_BORDER_SIZE, NODE_CONTAINER_RADIUS_RATIO, NODE_HEIGHT_DEFAULT, NODE_HEIGHT_FOOTER_BUTTON, NODE_HEIGHT_FOOTER_DOUBLE, NODE_HEIGHT_FOOTER_SINGLE, NODE_INNER_ICON_RATIO, NODE_INNER_RADIUS_RATIO, NODE_INNER_SHAPE_RATIO } from "../../constants.js";
5
5
  import { useNodeTypeRegistry } from "../../core/index.js";
6
- import { useElementValidationStatus, useNodeExecutionState } from "../../hooks/index.js";
6
+ import { useElementValidationStatus, useNodeExecutionState, useToolbarActionStoreContext } from "../../hooks/index.js";
7
7
  import { isWideNodeShape } from "../../schema/index.js";
8
8
  import { resolveAdornments } from "../../utils/adornment-resolver.js";
9
9
  import { CanvasIcon, getIcon } from "../../utils/icon-registry.js";
@@ -141,13 +141,15 @@ const BaseNodeComponent = (props)=>{
141
141
  data,
142
142
  id
143
143
  ]);
144
+ const toolbarActionStore = useToolbarActionStoreContext();
144
145
  const toolbarConfig = useMemo(()=>{
145
146
  if (void 0 !== toolbarConfigProp) return null === toolbarConfigProp ? void 0 : toolbarConfigProp;
146
- return manifest ? resolveToolbar(manifest, statusContext) : void 0;
147
+ return manifest ? resolveToolbar(manifest, statusContext, void 0, toolbarActionStore) : void 0;
147
148
  }, [
148
149
  toolbarConfigProp,
149
150
  manifest,
150
- statusContext
151
+ statusContext,
152
+ toolbarActionStore
151
153
  ]);
152
154
  const effectiveToolbarConfig = useMemo(()=>toolbarConfig && isNodeReadOnly ? lockToolbarConfig(toolbarConfig) : toolbarConfig, [
153
155
  toolbarConfig,
@@ -168,14 +168,16 @@ function ContainerNodeComponent(props) {
168
168
  minWidth: container_cjs_namespaceObject.DEFAULT_CONTAINER_MIN_WIDTH,
169
169
  minHeight: container_cjs_namespaceObject.DEFAULT_CONTAINER_MIN_HEIGHT
170
170
  };
171
+ const toolbarActionStore = (0, external_hooks_index_cjs_namespaceObject.useToolbarActionStoreContext)();
171
172
  const toolbarConfig = (0, external_react_namespaceObject.useMemo)(()=>{
172
173
  if (void 0 !== toolbarConfigProp) return null === toolbarConfigProp ? void 0 : toolbarConfigProp;
173
- return manifest ? (0, toolbar_resolver_cjs_namespaceObject.resolveToolbar)(manifest, statusContext, data) : void 0;
174
+ return manifest ? (0, toolbar_resolver_cjs_namespaceObject.resolveToolbar)(manifest, statusContext, data, toolbarActionStore) : void 0;
174
175
  }, [
175
176
  data,
176
177
  manifest,
177
178
  statusContext,
178
- toolbarConfigProp
179
+ toolbarConfigProp,
180
+ toolbarActionStore
179
181
  ]);
180
182
  const effectiveToolbarConfig = (0, external_react_namespaceObject.useMemo)(()=>toolbarConfig && isNodeReadOnly ? (0, NodeToolbar_utils_cjs_namespaceObject.lockToolbarConfig)(toolbarConfig) : toolbarConfig, [
181
183
  toolbarConfig,
@@ -1 +1 @@
1
- {"version":3,"file":"ContainerNode.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/ContainerNode/ContainerNode.tsx"],"names":[],"mappings":"AAiDA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAWhE,iBAAS,sBAAsB,CAAC,KAAK,EAAE,kBAAkB,2CAsXxD;AAOD,eAAO,MAAM,aAAa,oEAAkE,CAAC"}
1
+ {"version":3,"file":"ContainerNode.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/ContainerNode/ContainerNode.tsx"],"names":[],"mappings":"AAqDA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAWhE,iBAAS,sBAAsB,CAAC,KAAK,EAAE,kBAAkB,2CAyXxD;AAOD,eAAO,MAAM,aAAa,oEAAkE,CAAC"}
@@ -4,7 +4,7 @@ import { cn } from "@uipath/apollo-wind";
4
4
  import { memo, useCallback, useMemo, useState } from "react";
5
5
  import { useSafeLingui } from "../../../i18n/index.js";
6
6
  import { useOptionalNodeTypeRegistry } from "../../core/index.js";
7
- import { useElementValidationStatus, useNodeExecutionState } from "../../hooks/index.js";
7
+ import { useElementValidationStatus, useNodeExecutionState, useToolbarActionStoreContext } from "../../hooks/index.js";
8
8
  import { resolveAdornments } from "../../utils/adornment-resolver.js";
9
9
  import { DEFAULT_CONTAINER_HEIGHT, DEFAULT_CONTAINER_MIN_HEIGHT, DEFAULT_CONTAINER_MIN_WIDTH, DEFAULT_CONTAINER_WIDTH } from "../../utils/container.js";
10
10
  import { resolveDisplay, resolveHandles } from "../../utils/manifest-resolver.js";
@@ -140,14 +140,16 @@ function ContainerNodeComponent(props) {
140
140
  minWidth: DEFAULT_CONTAINER_MIN_WIDTH,
141
141
  minHeight: DEFAULT_CONTAINER_MIN_HEIGHT
142
142
  };
143
+ const toolbarActionStore = useToolbarActionStoreContext();
143
144
  const toolbarConfig = useMemo(()=>{
144
145
  if (void 0 !== toolbarConfigProp) return null === toolbarConfigProp ? void 0 : toolbarConfigProp;
145
- return manifest ? resolveToolbar(manifest, statusContext, data) : void 0;
146
+ return manifest ? resolveToolbar(manifest, statusContext, data, toolbarActionStore) : void 0;
146
147
  }, [
147
148
  data,
148
149
  manifest,
149
150
  statusContext,
150
- toolbarConfigProp
151
+ toolbarConfigProp,
152
+ toolbarActionStore
151
153
  ]);
152
154
  const effectiveToolbarConfig = useMemo(()=>toolbarConfig && isNodeReadOnly ? lockToolbarConfig(toolbarConfig) : toolbarConfig, [
153
155
  toolbarConfig,
@@ -86,6 +86,13 @@ function useCanvasJsonTreeViewStrings() {
86
86
  id: 'canvas.json_value_panel.required_marker',
87
87
  message: 'required'
88
88
  }),
89
+ referenceType: (typeLabel)=>_({
90
+ id: 'canvas.json_value_panel.reference_type',
91
+ message: '{typeLabel} · reference',
92
+ values: {
93
+ typeLabel
94
+ }
95
+ }),
89
96
  pathCopied: _({
90
97
  id: 'canvas.json_value_panel.path_copied',
91
98
  message: 'Path copied'
@@ -1 +1 @@
1
- {"version":3,"file":"JsonTree.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/JsonTree/JsonTree.tsx"],"names":[],"mappings":"AAAA,OAAO,EAML,KAAK,iBAAiB,EAEtB,KAAK,yBAAyB,EAC9B,KAAK,mBAAmB,EAEzB,MAAM,qBAAqB,CAAC;AAgB7B,wBAAgB,4BAA4B,IAAI,mBAAmB,CAwHlE;AAWD,wBAAgB,oBAAoB,CAAC,EACnC,OAAO,EACP,uBAAuB,EACvB,QAAQ,GACT,EAAE,yBAAyB,2CAqB3B;AAuBD,eAAO,MAAM,YAAY;;;CAAsD,CAAC;AAChF,eAAO,MAAM,eAAe;;;CAA4D,CAAC;AACzF,eAAO,MAAM,mBAAmB;;;CAG/B,CAAC;AACF,eAAO,MAAM,mBAAmB;;;CAG/B,CAAC;AACF,eAAO,MAAM,uBAAuB;;;CAGnC,CAAC;AAEF,eAAO,MAAM,aAAa;;;CAAwD,CAAC;AAGnF,MAAM,MAAM,aAAa,GAAG,iBAAiB,CAAC;AAE9C,eAAO,MAAM,QAAQ;;;CAAe,CAAC"}
1
+ {"version":3,"file":"JsonTree.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/JsonTree/JsonTree.tsx"],"names":[],"mappings":"AAAA,OAAO,EAML,KAAK,iBAAiB,EAEtB,KAAK,yBAAyB,EAC9B,KAAK,mBAAmB,EAEzB,MAAM,qBAAqB,CAAC;AAgB7B,wBAAgB,4BAA4B,IAAI,mBAAmB,CA8HlE;AAWD,wBAAgB,oBAAoB,CAAC,EACnC,OAAO,EACP,uBAAuB,EACvB,QAAQ,GACT,EAAE,yBAAyB,2CAqB3B;AAuBD,eAAO,MAAM,YAAY;;;CAAsD,CAAC;AAChF,eAAO,MAAM,eAAe;;;CAA4D,CAAC;AACzF,eAAO,MAAM,mBAAmB;;;CAG/B,CAAC;AACF,eAAO,MAAM,mBAAmB;;;CAG/B,CAAC;AACF,eAAO,MAAM,uBAAuB;;;CAGnC,CAAC;AAEF,eAAO,MAAM,aAAa;;;CAAwD,CAAC;AAGnF,MAAM,MAAM,aAAa,GAAG,iBAAiB,CAAC;AAE9C,eAAO,MAAM,QAAQ;;;CAAe,CAAC"}
@@ -50,6 +50,13 @@ function useCanvasJsonTreeViewStrings() {
50
50
  id: 'canvas.json_value_panel.required_marker',
51
51
  message: 'required'
52
52
  }),
53
+ referenceType: (typeLabel)=>_({
54
+ id: 'canvas.json_value_panel.reference_type',
55
+ message: '{typeLabel} · reference',
56
+ values: {
57
+ typeLabel
58
+ }
59
+ }),
53
60
  pathCopied: _({
54
61
  id: 'canvas.json_value_panel.path_copied',
55
62
  message: 'Path copied'
@@ -1,4 +1,4 @@
1
- export type { BuildJsonTreeOptions, ContainerPath, CopyEvent, DeriveTypeIcon, FlatJsonTreeRow, FlattenOptions, JsonCodeEditorRenderProps, JsonContainer, JsonContainerEditorProps, JsonLeafValueEditorProps, JsonMultilineLeafEditorProps, JsonObject, JsonSchema, JsonSchemaTypeName, JsonTreeChange, JsonTreeFilterOption, JsonTreeNode, JsonTreeNodeType, JsonTreeRowWrapper, JsonTreeRowWrapperProps, JsonTreeToolbarProps, JsonTreeViewStrings, JsonTreeViewProps, JsonTreeViewProviderProps, JsonTypeBadgeProps, JsonValue, NodeAction, NodeActionContext, NodeActionsResolver, NodeDecoration, NodeDecorationBadge, NodeDecorationChip, NodeDecorationTone, NodeDisplayTexts, PathSegment, RenderCodeEditor, RenderValueCell, RenderValueContext, } from '@uipath/apollo-wind';
1
+ export type { BuildJsonTreeOptions, ContainerPath, CopyEvent, DeriveTypeIcon, FlatJsonTreeRow, FlattenOptions, JsonCodeEditorRenderProps, JsonContainer, JsonContainerEditorProps, JsonLeafValueEditorProps, JsonMultilineLeafEditorProps, JsonObject, JsonSchema, JsonSchemaTypeName, JsonTreeChange, JsonTreeFilterOption, JsonTreeNode, JsonTreeNodeType, JsonTreeRowWrapper, JsonTreeRowWrapperProps, JsonTreeToolbarProps, JsonTreeViewStrings, JsonTreeViewProps, JsonTreeViewProviderProps, JsonTypeBadgeProps, JsonValue, NodeAction, NodeActionContext, NodeActionsResolver, NodeBadgeReference, NodeDecoration, NodeDecorationBadge, NodeDecorationChip, NodeDecorationTone, NodeDisplayTexts, PathSegment, RenderCodeEditor, RenderValueCell, RenderValueContext, ResolvedJsonTreeViewStrings, } from '@uipath/apollo-wind';
2
2
  export { appendPathSegment, buildJsonTree, collectContainerPaths, copyTextToClipboard, DEFAULT_JSON_TREE_VIEW_STRINGS, flattenJsonTree, formatLeafValue, getValueAtPath, inferValueType, isArrayItemTemplateRoot, isJsonObject, removeValueAtPath, schemaDisplayType, setValueAtPath, } from '@uipath/apollo-wind';
3
3
  export * from './JsonTree';
4
4
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/JsonTree/index.ts"],"names":[],"mappings":"AAEA,YAAY,EACV,oBAAoB,EACpB,aAAa,EACb,SAAS,EACT,cAAc,EACd,eAAe,EACf,cAAc,EACd,yBAAyB,EACzB,aAAa,EACb,wBAAwB,EACxB,wBAAwB,EACxB,4BAA4B,EAC5B,UAAU,EACV,UAAU,EACV,kBAAkB,EAClB,cAAc,EACd,oBAAoB,EACpB,YAAY,EACZ,gBAAgB,EAChB,kBAAkB,EAClB,uBAAuB,EACvB,oBAAoB,EACpB,mBAAmB,EACnB,iBAAiB,EACjB,yBAAyB,EACzB,kBAAkB,EAClB,SAAS,EACT,UAAU,EACV,iBAAiB,EACjB,mBAAmB,EACnB,cAAc,EACd,mBAAmB,EACnB,kBAAkB,EAClB,kBAAkB,EAClB,gBAAgB,EAChB,WAAW,EACX,gBAAgB,EAChB,eAAe,EACf,kBAAkB,GACnB,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EACL,iBAAiB,EACjB,aAAa,EACb,qBAAqB,EACrB,mBAAmB,EACnB,8BAA8B,EAC9B,eAAe,EACf,eAAe,EACf,cAAc,EACd,cAAc,EACd,uBAAuB,EACvB,YAAY,EACZ,iBAAiB,EACjB,iBAAiB,EACjB,cAAc,GACf,MAAM,qBAAqB,CAAC;AAC7B,cAAc,YAAY,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/JsonTree/index.ts"],"names":[],"mappings":"AAEA,YAAY,EACV,oBAAoB,EACpB,aAAa,EACb,SAAS,EACT,cAAc,EACd,eAAe,EACf,cAAc,EACd,yBAAyB,EACzB,aAAa,EACb,wBAAwB,EACxB,wBAAwB,EACxB,4BAA4B,EAC5B,UAAU,EACV,UAAU,EACV,kBAAkB,EAClB,cAAc,EACd,oBAAoB,EACpB,YAAY,EACZ,gBAAgB,EAChB,kBAAkB,EAClB,uBAAuB,EACvB,oBAAoB,EACpB,mBAAmB,EACnB,iBAAiB,EACjB,yBAAyB,EACzB,kBAAkB,EAClB,SAAS,EACT,UAAU,EACV,iBAAiB,EACjB,mBAAmB,EACnB,kBAAkB,EAClB,cAAc,EACd,mBAAmB,EACnB,kBAAkB,EAClB,kBAAkB,EAClB,gBAAgB,EAChB,WAAW,EACX,gBAAgB,EAChB,eAAe,EACf,kBAAkB,EAClB,2BAA2B,GAC5B,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EACL,iBAAiB,EACjB,aAAa,EACb,qBAAqB,EACrB,mBAAmB,EACnB,8BAA8B,EAC9B,eAAe,EACf,eAAe,EACf,cAAc,EACd,cAAc,EACd,uBAAuB,EACvB,YAAY,EACZ,iBAAiB,EACjB,iBAAiB,EACjB,cAAc,GACf,MAAM,qBAAqB,CAAC;AAC7B,cAAc,YAAY,CAAC"}
@@ -33,8 +33,62 @@ const external_react_namespaceObject = require("react");
33
33
  const index_cjs_namespaceObject = require("../../../i18n/index.cjs");
34
34
  const external_EditableText_cjs_namespaceObject = require("./EditableText.cjs");
35
35
  const SURFACE_REMAP = 'future:[--surface-raised:var(--surface-overlay)]';
36
- function NodePropertyPanel({ panelTitle, dragHandleProps, onClose, nodeIcon, nodeLabel, nodeCategory, nodeDescription, nodeLabelPlaceholder, nodeDescriptionPlaceholder, onNodeLabelChange, onNodeLabelSubmit, onNodeDescriptionChange, onNodeDescriptionSubmit, nodeLabelError, nodeDescriptionError, action, schema, plugins, onSubmit, disabled, autoComplete, resetKey, className, contentInset = '1.5rem', children, headerExtra, sectionVariant, activeStepId, onActiveStepChange }) {
36
+ function findFieldElement(root, name) {
37
+ const fields = root.querySelectorAll('[data-field-name]');
38
+ for (const field of fields)if (field.getAttribute('data-field-name') === name) return field;
39
+ return null;
40
+ }
41
+ function NodePropertyPanel({ panelTitle, dragHandleProps, onClose, nodeIcon, nodeLabel, nodeCategory, nodeDescription, nodeLabelPlaceholder, nodeDescriptionPlaceholder, onNodeLabelChange, onNodeLabelSubmit, onNodeDescriptionChange, onNodeDescriptionSubmit, nodeLabelError, nodeDescriptionError, action, schema, plugins, onSubmit, disabled, autoComplete, resetKey, className, contentInset = '1.5rem', children, headerExtra, sectionVariant, activeStepId, onActiveStepChange, changedFields }) {
37
42
  const { _ } = (0, index_cjs_namespaceObject.useSafeLingui)();
43
+ const rootRef = (0, external_react_namespaceObject.useRef)(null);
44
+ const scrolledKeyRef = (0, external_react_namespaceObject.useRef)(null);
45
+ const changedFieldLabel = _({
46
+ id: 'canvas.node_property_panel.changed_field',
47
+ message: 'Changed'
48
+ });
49
+ (0, external_react_namespaceObject.useEffect)(()=>{
50
+ if (children || !changedFields || 0 === changedFields.length) return;
51
+ const scrollKey = JSON.stringify([
52
+ resetKey ?? null,
53
+ changedFields
54
+ ]);
55
+ if (scrolledKeyRef.current === scrollKey) return;
56
+ const root = rootRef.current;
57
+ if (!root) return;
58
+ const findTarget = ()=>{
59
+ for (const name of changedFields){
60
+ const el = findFieldElement(root, name);
61
+ if (el) return el;
62
+ }
63
+ return null;
64
+ };
65
+ const scrollToTarget = (target)=>{
66
+ scrolledKeyRef.current = scrollKey;
67
+ const prefersReducedMotion = "u" > typeof window && window.matchMedia?.('(prefers-reduced-motion: reduce)').matches;
68
+ target.scrollIntoView({
69
+ block: 'nearest',
70
+ behavior: prefersReducedMotion ? 'auto' : 'smooth'
71
+ });
72
+ };
73
+ const immediateTarget = findTarget();
74
+ if (immediateTarget) return void scrollToTarget(immediateTarget);
75
+ const observer = new MutationObserver(()=>{
76
+ const target = findTarget();
77
+ if (target) {
78
+ scrollToTarget(target);
79
+ observer.disconnect();
80
+ }
81
+ });
82
+ observer.observe(root, {
83
+ childList: true,
84
+ subtree: true
85
+ });
86
+ return ()=>observer.disconnect();
87
+ }, [
88
+ children,
89
+ changedFields,
90
+ resetKey
91
+ ]);
38
92
  const isLabelEditable = !!onNodeLabelChange && !!onNodeLabelSubmit;
39
93
  const isDescriptionEditable = !!onNodeDescriptionChange && !!onNodeDescriptionSubmit;
40
94
  const showsDescription = !!nodeDescription || isDescriptionEditable || !!nodeDescriptionError;
@@ -47,6 +101,7 @@ function NodePropertyPanel({ panelTitle, dragHandleProps, onClose, nodeIcon, nod
47
101
  schema
48
102
  ]);
49
103
  return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
104
+ ref: rootRef,
50
105
  className: (0, apollo_wind_namespaceObject.cn)('flex min-h-0 flex-col bg-surface future:bg-surface-raised', className),
51
106
  style: {
52
107
  '--mf-content-inset': contentInset
@@ -177,6 +232,8 @@ function NodePropertyPanel({ panelTitle, dragHandleProps, onClose, nodeIcon, nod
177
232
  onSubmit: onSubmit,
178
233
  disabled: disabled,
179
234
  autoComplete: autoComplete,
235
+ changedFields: changedFields,
236
+ changedFieldLabel: changedFieldLabel,
180
237
  className: "flex min-h-0 flex-1 flex-col"
181
238
  }, resetKey)
182
239
  })
@@ -191,6 +248,8 @@ function NodePropertyPanel({ panelTitle, dragHandleProps, onClose, nodeIcon, nod
191
248
  onSubmit: onSubmit,
192
249
  disabled: disabled,
193
250
  autoComplete: autoComplete,
251
+ changedFields: changedFields,
252
+ changedFieldLabel: changedFieldLabel,
194
253
  className: "flex flex-col gap-4 pb-6 pt-3 [padding-inline:var(--mf-content-inset)]"
195
254
  }, resetKey)
196
255
  })
@@ -1,3 +1,3 @@
1
1
  import type { NodePropertyPanelProps } from './NodePropertyPanel.types';
2
- export declare function NodePropertyPanel({ panelTitle, dragHandleProps, onClose, nodeIcon, nodeLabel, nodeCategory, nodeDescription, nodeLabelPlaceholder, nodeDescriptionPlaceholder, onNodeLabelChange, onNodeLabelSubmit, onNodeDescriptionChange, onNodeDescriptionSubmit, nodeLabelError, nodeDescriptionError, action, schema, plugins, onSubmit, disabled, autoComplete, resetKey, className, contentInset, children, headerExtra, sectionVariant, activeStepId, onActiveStepChange, }: NodePropertyPanelProps): import("react/jsx-runtime").JSX.Element;
2
+ export declare function NodePropertyPanel({ panelTitle, dragHandleProps, onClose, nodeIcon, nodeLabel, nodeCategory, nodeDescription, nodeLabelPlaceholder, nodeDescriptionPlaceholder, onNodeLabelChange, onNodeLabelSubmit, onNodeDescriptionChange, onNodeDescriptionSubmit, nodeLabelError, nodeDescriptionError, action, schema, plugins, onSubmit, disabled, autoComplete, resetKey, className, contentInset, children, headerExtra, sectionVariant, activeStepId, onActiveStepChange, changedFields, }: NodePropertyPanelProps): import("react/jsx-runtime").JSX.Element;
3
3
  //# sourceMappingURL=NodePropertyPanel.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"NodePropertyPanel.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/NodePropertyPanel/NodePropertyPanel.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,2BAA2B,CAAC;AA2CxE,wBAAgB,iBAAiB,CAAC,EAChC,UAAU,EACV,eAAe,EACf,OAAO,EACP,QAAQ,EACR,SAAS,EACT,YAAY,EACZ,eAAe,EACf,oBAAoB,EACpB,0BAA0B,EAC1B,iBAAiB,EACjB,iBAAiB,EACjB,uBAAuB,EACvB,uBAAuB,EACvB,cAAc,EACd,oBAAoB,EACpB,MAAM,EACN,MAAM,EACN,OAAO,EACP,QAAQ,EACR,QAAQ,EACR,YAAY,EACZ,QAAQ,EACR,SAAS,EACT,YAAuB,EACvB,QAAQ,EACR,WAAW,EACX,cAAc,EACd,YAAY,EACZ,kBAAkB,GACnB,EAAE,sBAAsB,2CAyKxB"}
1
+ {"version":3,"file":"NodePropertyPanel.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/NodePropertyPanel/NodePropertyPanel.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,2BAA2B,CAAC;AAuDxE,wBAAgB,iBAAiB,CAAC,EAChC,UAAU,EACV,eAAe,EACf,OAAO,EACP,QAAQ,EACR,SAAS,EACT,YAAY,EACZ,eAAe,EACf,oBAAoB,EACpB,0BAA0B,EAC1B,iBAAiB,EACjB,iBAAiB,EACjB,uBAAuB,EACvB,uBAAuB,EACvB,cAAc,EACd,oBAAoB,EACpB,MAAM,EACN,MAAM,EACN,OAAO,EACP,QAAQ,EACR,QAAQ,EACR,YAAY,EACZ,QAAQ,EACR,SAAS,EACT,YAAuB,EACvB,QAAQ,EACR,WAAW,EACX,cAAc,EACd,YAAY,EACZ,kBAAkB,EAClB,aAAa,GACd,EAAE,sBAAsB,2CA8OxB"}
@@ -1,12 +1,66 @@
1
1
  import { jsx, jsxs } from "react/jsx-runtime";
2
2
  import { MetadataForm, cn } from "@uipath/apollo-wind";
3
3
  import { GripVertical, X } from "lucide-react";
4
- import { useMemo } from "react";
4
+ import { useEffect, useMemo, useRef } from "react";
5
5
  import { useSafeLingui } from "../../../i18n/index.js";
6
6
  import { EditableText } from "./EditableText.js";
7
7
  const SURFACE_REMAP = 'future:[--surface-raised:var(--surface-overlay)]';
8
- function NodePropertyPanel({ panelTitle, dragHandleProps, onClose, nodeIcon, nodeLabel, nodeCategory, nodeDescription, nodeLabelPlaceholder, nodeDescriptionPlaceholder, onNodeLabelChange, onNodeLabelSubmit, onNodeDescriptionChange, onNodeDescriptionSubmit, nodeLabelError, nodeDescriptionError, action, schema, plugins, onSubmit, disabled, autoComplete, resetKey, className, contentInset = '1.5rem', children, headerExtra, sectionVariant, activeStepId, onActiveStepChange }) {
8
+ function findFieldElement(root, name) {
9
+ const fields = root.querySelectorAll('[data-field-name]');
10
+ for (const field of fields)if (field.getAttribute('data-field-name') === name) return field;
11
+ return null;
12
+ }
13
+ function NodePropertyPanel({ panelTitle, dragHandleProps, onClose, nodeIcon, nodeLabel, nodeCategory, nodeDescription, nodeLabelPlaceholder, nodeDescriptionPlaceholder, onNodeLabelChange, onNodeLabelSubmit, onNodeDescriptionChange, onNodeDescriptionSubmit, nodeLabelError, nodeDescriptionError, action, schema, plugins, onSubmit, disabled, autoComplete, resetKey, className, contentInset = '1.5rem', children, headerExtra, sectionVariant, activeStepId, onActiveStepChange, changedFields }) {
9
14
  const { _ } = useSafeLingui();
15
+ const rootRef = useRef(null);
16
+ const scrolledKeyRef = useRef(null);
17
+ const changedFieldLabel = _({
18
+ id: 'canvas.node_property_panel.changed_field',
19
+ message: 'Changed'
20
+ });
21
+ useEffect(()=>{
22
+ if (children || !changedFields || 0 === changedFields.length) return;
23
+ const scrollKey = JSON.stringify([
24
+ resetKey ?? null,
25
+ changedFields
26
+ ]);
27
+ if (scrolledKeyRef.current === scrollKey) return;
28
+ const root = rootRef.current;
29
+ if (!root) return;
30
+ const findTarget = ()=>{
31
+ for (const name of changedFields){
32
+ const el = findFieldElement(root, name);
33
+ if (el) return el;
34
+ }
35
+ return null;
36
+ };
37
+ const scrollToTarget = (target)=>{
38
+ scrolledKeyRef.current = scrollKey;
39
+ const prefersReducedMotion = "u" > typeof window && window.matchMedia?.('(prefers-reduced-motion: reduce)').matches;
40
+ target.scrollIntoView({
41
+ block: 'nearest',
42
+ behavior: prefersReducedMotion ? 'auto' : 'smooth'
43
+ });
44
+ };
45
+ const immediateTarget = findTarget();
46
+ if (immediateTarget) return void scrollToTarget(immediateTarget);
47
+ const observer = new MutationObserver(()=>{
48
+ const target = findTarget();
49
+ if (target) {
50
+ scrollToTarget(target);
51
+ observer.disconnect();
52
+ }
53
+ });
54
+ observer.observe(root, {
55
+ childList: true,
56
+ subtree: true
57
+ });
58
+ return ()=>observer.disconnect();
59
+ }, [
60
+ children,
61
+ changedFields,
62
+ resetKey
63
+ ]);
10
64
  const isLabelEditable = !!onNodeLabelChange && !!onNodeLabelSubmit;
11
65
  const isDescriptionEditable = !!onNodeDescriptionChange && !!onNodeDescriptionSubmit;
12
66
  const showsDescription = !!nodeDescription || isDescriptionEditable || !!nodeDescriptionError;
@@ -19,6 +73,7 @@ function NodePropertyPanel({ panelTitle, dragHandleProps, onClose, nodeIcon, nod
19
73
  schema
20
74
  ]);
21
75
  return /*#__PURE__*/ jsxs("div", {
76
+ ref: rootRef,
22
77
  className: cn('flex min-h-0 flex-col bg-surface future:bg-surface-raised', className),
23
78
  style: {
24
79
  '--mf-content-inset': contentInset
@@ -149,6 +204,8 @@ function NodePropertyPanel({ panelTitle, dragHandleProps, onClose, nodeIcon, nod
149
204
  onSubmit: onSubmit,
150
205
  disabled: disabled,
151
206
  autoComplete: autoComplete,
207
+ changedFields: changedFields,
208
+ changedFieldLabel: changedFieldLabel,
152
209
  className: "flex min-h-0 flex-1 flex-col"
153
210
  }, resetKey)
154
211
  })
@@ -163,6 +220,8 @@ function NodePropertyPanel({ panelTitle, dragHandleProps, onClose, nodeIcon, nod
163
220
  onSubmit: onSubmit,
164
221
  disabled: disabled,
165
222
  autoComplete: autoComplete,
223
+ changedFields: changedFields,
224
+ changedFieldLabel: changedFieldLabel,
166
225
  className: "flex flex-col gap-4 pb-6 pt-3 [padding-inline:var(--mf-content-inset)]"
167
226
  }, resetKey)
168
227
  })
@@ -30,5 +30,6 @@ export interface NodePropertyPanelProps {
30
30
  contentInset?: string;
31
31
  headerExtra?: ReactNode;
32
32
  children?: ReactNode;
33
+ changedFields?: readonly string[];
33
34
  }
34
35
  //# sourceMappingURL=NodePropertyPanel.types.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"NodePropertyPanel.types.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/NodePropertyPanel/NodePropertyPanel.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAClE,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvD,MAAM,WAAW,sBAAsB;IAKrC,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB,eAAe,CAAC,EAAE,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,WAAW,CAAC,CAAC;IAEpE,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IAErB,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAE9B,0BAA0B,CAAC,EAAE,MAAM,CAAC;IAEpC,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAE5C,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAE5C,uBAAuB,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAC;IAExD,uBAAuB,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAC;IAKxD,cAAc,CAAC,EAAE,SAAS,CAAC;IAE3B,oBAAoB,CAAC,EAAE,SAAS,CAAC;IAEjC,MAAM,CAAC,EAAE,SAAS,CAAC;IAMnB,MAAM,CAAC,EAAE,UAAU,CAAC;IAMpB,OAAO,CAAC,EAAE,UAAU,EAAE,CAAC;IAOvB,cAAc,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAMlC,YAAY,CAAC,EAAE,MAAM,CAAC;IAKtB,kBAAkB,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAE9C,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAEnD,QAAQ,CAAC,EAAE,OAAO,CAAC;IAMnB,YAAY,CAAC,EAAE,KAAK,GAAG,IAAI,CAAC;IAM5B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IAMnB,YAAY,CAAC,EAAE,MAAM,CAAC;IAKtB,WAAW,CAAC,EAAE,SAAS,CAAC;IAQxB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB"}
1
+ {"version":3,"file":"NodePropertyPanel.types.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/NodePropertyPanel/NodePropertyPanel.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAClE,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvD,MAAM,WAAW,sBAAsB;IAKrC,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB,eAAe,CAAC,EAAE,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,WAAW,CAAC,CAAC;IAEpE,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IAErB,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAE9B,0BAA0B,CAAC,EAAE,MAAM,CAAC;IAEpC,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAE5C,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAE5C,uBAAuB,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAC;IAExD,uBAAuB,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAC;IAKxD,cAAc,CAAC,EAAE,SAAS,CAAC;IAE3B,oBAAoB,CAAC,EAAE,SAAS,CAAC;IAEjC,MAAM,CAAC,EAAE,SAAS,CAAC;IAMnB,MAAM,CAAC,EAAE,UAAU,CAAC;IAMpB,OAAO,CAAC,EAAE,UAAU,EAAE,CAAC;IAOvB,cAAc,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAMlC,YAAY,CAAC,EAAE,MAAM,CAAC;IAKtB,kBAAkB,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAE9C,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAEnD,QAAQ,CAAC,EAAE,OAAO,CAAC;IAMnB,YAAY,CAAC,EAAE,KAAK,GAAG,IAAI,CAAC;IAM5B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IAMnB,YAAY,CAAC,EAAE,MAAM,CAAC;IAKtB,WAAW,CAAC,EAAE,SAAS,CAAC;IAQxB,QAAQ,CAAC,EAAE,SAAS,CAAC;IAOrB,aAAa,CAAC,EAAE,SAAS,MAAM,EAAE,CAAC;CACnC"}
@@ -26,9 +26,13 @@ __webpack_require__.r(__webpack_exports__);
26
26
  __webpack_require__.d(__webpack_exports__, {
27
27
  getToolbarActionStore: ()=>getToolbarActionStore,
28
28
  useToolbarActionStore: ()=>useToolbarActionStore,
29
+ ToolbarActionStoreProvider: ()=>ToolbarActionStoreProvider,
30
+ useToolbarActionStoreContext: ()=>useToolbarActionStoreContext,
29
31
  setToolbarActionStore: ()=>setToolbarActionStore
30
32
  });
33
+ const jsx_runtime_namespaceObject = require("react/jsx-runtime");
31
34
  const external_react_namespaceObject = require("react");
35
+ const external_mountedCanvases_cjs_namespaceObject = require("./mountedCanvases.cjs");
32
36
  let toolbarActionStore = {
33
37
  mode: 'design',
34
38
  onToolbarAction: void 0,
@@ -40,33 +44,73 @@ function setToolbarActionStore(store) {
40
44
  function getToolbarActionStore() {
41
45
  return toolbarActionStore;
42
46
  }
47
+ function syncToNewestCanvas() {
48
+ setToolbarActionStore((0, external_mountedCanvases_cjs_namespaceObject.newestMountedCanvas)()?.store ?? {
49
+ mode: 'design',
50
+ onToolbarAction: void 0,
51
+ breakpoints: void 0
52
+ });
53
+ }
43
54
  function useToolbarActionStore(mode, onToolbarAction, breakpoints) {
44
- (0, external_react_namespaceObject.useEffect)(()=>{
45
- setToolbarActionStore({
55
+ const entryRef = (0, external_react_namespaceObject.useRef)({
56
+ store: {
46
57
  mode,
47
58
  onToolbarAction,
48
59
  breakpoints
49
- });
60
+ }
61
+ });
62
+ (0, external_react_namespaceObject.useEffect)(()=>{
63
+ const entry = entryRef.current;
64
+ (0, external_mountedCanvases_cjs_namespaceObject.addMountedCanvas)(entry);
65
+ syncToNewestCanvas();
50
66
  return ()=>{
51
- setToolbarActionStore({
52
- mode: 'design',
53
- onToolbarAction: void 0,
54
- breakpoints: void 0
55
- });
67
+ (0, external_mountedCanvases_cjs_namespaceObject.removeMountedCanvas)(entry);
68
+ syncToNewestCanvas();
69
+ };
70
+ }, []);
71
+ (0, external_react_namespaceObject.useEffect)(()=>{
72
+ entryRef.current.store = {
73
+ mode,
74
+ onToolbarAction,
75
+ breakpoints
56
76
  };
77
+ syncToNewestCanvas();
57
78
  }, [
58
79
  mode,
59
80
  onToolbarAction,
60
81
  breakpoints
61
82
  ]);
62
83
  }
84
+ const ToolbarActionStoreContext = /*#__PURE__*/ (0, external_react_namespaceObject.createContext)(void 0);
85
+ function ToolbarActionStoreProvider({ mode, onToolbarAction, breakpoints, children }) {
86
+ const value = (0, external_react_namespaceObject.useMemo)(()=>({
87
+ mode,
88
+ onToolbarAction,
89
+ breakpoints
90
+ }), [
91
+ mode,
92
+ onToolbarAction,
93
+ breakpoints
94
+ ]);
95
+ return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(ToolbarActionStoreContext.Provider, {
96
+ value: value,
97
+ children: children
98
+ });
99
+ }
100
+ function useToolbarActionStoreContext() {
101
+ return (0, external_react_namespaceObject.useContext)(ToolbarActionStoreContext);
102
+ }
103
+ exports.ToolbarActionStoreProvider = __webpack_exports__.ToolbarActionStoreProvider;
63
104
  exports.getToolbarActionStore = __webpack_exports__.getToolbarActionStore;
64
105
  exports.setToolbarActionStore = __webpack_exports__.setToolbarActionStore;
65
106
  exports.useToolbarActionStore = __webpack_exports__.useToolbarActionStore;
107
+ exports.useToolbarActionStoreContext = __webpack_exports__.useToolbarActionStoreContext;
66
108
  for(var __rspack_i in __webpack_exports__)if (-1 === [
109
+ "ToolbarActionStoreProvider",
67
110
  "getToolbarActionStore",
68
111
  "setToolbarActionStore",
69
- "useToolbarActionStore"
112
+ "useToolbarActionStore",
113
+ "useToolbarActionStoreContext"
70
114
  ].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
71
115
  Object.defineProperty(exports, '__esModule', {
72
116
  value: true
@@ -1,5 +1,6 @@
1
+ import { type ReactNode } from 'react';
1
2
  import type { ToolbarActionHandler } from '../schema/toolbar';
2
- interface ToolbarActionStore {
3
+ export interface ToolbarActionStore {
3
4
  mode: string;
4
5
  onToolbarAction?: ToolbarActionHandler;
5
6
  breakpoints?: Set<string>;
@@ -7,5 +8,8 @@ interface ToolbarActionStore {
7
8
  export declare function setToolbarActionStore(store: ToolbarActionStore): void;
8
9
  export declare function getToolbarActionStore(): ToolbarActionStore;
9
10
  export declare function useToolbarActionStore(mode: string, onToolbarAction?: ToolbarActionHandler, breakpoints?: Set<string>): void;
10
- export {};
11
+ export declare function ToolbarActionStoreProvider({ mode, onToolbarAction, breakpoints, children, }: ToolbarActionStore & {
12
+ children: ReactNode;
13
+ }): import("react/jsx-runtime").JSX.Element;
14
+ export declare function useToolbarActionStoreContext(): ToolbarActionStore | undefined;
11
15
  //# sourceMappingURL=ToolbarActionContext.d.ts.map