@uipath/apollo-react 6.43.0 → 6.44.1
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/JsonTree/JsonTree.cjs +5 -6
- package/dist/canvas/components/JsonTree/JsonTree.d.ts.map +1 -1
- package/dist/canvas/components/JsonTree/JsonTree.js +5 -6
- package/dist/canvas/components/JsonTree/buildJsonTree.cjs +2 -2
- package/dist/canvas/components/JsonTree/buildJsonTree.d.ts.map +1 -1
- package/dist/canvas/components/JsonTree/buildJsonTree.js +2 -2
- package/dist/canvas/components/NodePropertyPanel/EditableText.cjs +28 -16
- package/dist/canvas/components/NodePropertyPanel/EditableText.d.ts +4 -2
- package/dist/canvas/components/NodePropertyPanel/EditableText.d.ts.map +1 -1
- package/dist/canvas/components/NodePropertyPanel/EditableText.js +28 -16
- package/dist/canvas/components/NodePropertyPanel/NodePropertyPanel.cjs +7 -3
- package/dist/canvas/components/NodePropertyPanel/NodePropertyPanel.d.ts +1 -1
- package/dist/canvas/components/NodePropertyPanel/NodePropertyPanel.d.ts.map +1 -1
- package/dist/canvas/components/NodePropertyPanel/NodePropertyPanel.js +7 -3
- package/dist/canvas/components/NodePropertyPanel/NodePropertyPanel.types.d.ts +2 -0
- package/dist/canvas/components/NodePropertyPanel/NodePropertyPanel.types.d.ts.map +1 -1
- package/dist/canvas/styles/tailwind.canvas.css +1 -1
- package/package.json +3 -3
|
@@ -41,21 +41,20 @@ const VIRTUAL_OVERSCAN = 10;
|
|
|
41
41
|
function scrollMarginOf(element, scrollElement) {
|
|
42
42
|
return Math.round(element.getBoundingClientRect().top - scrollElement.getBoundingClientRect().top + scrollElement.scrollTop);
|
|
43
43
|
}
|
|
44
|
-
function VirtualRows({ rows,
|
|
44
|
+
function VirtualRows({ rows, container, scrollElement, pinnedPaths }) {
|
|
45
45
|
const [scrollMargin, setScrollMargin] = (0, external_react_namespaceObject.useState)(0);
|
|
46
46
|
const getItemKey = (0, external_react_namespaceObject.useCallback)((index)=>rows[index]?.node.path ?? index, [
|
|
47
47
|
rows
|
|
48
48
|
]);
|
|
49
49
|
const virtualizer = (0, react_virtual_namespaceObject.useVirtualizer)({
|
|
50
50
|
count: rows.length,
|
|
51
|
-
getScrollElement: ()=>scrollElement ??
|
|
51
|
+
getScrollElement: ()=>scrollElement ?? container,
|
|
52
52
|
estimateSize: ()=>external_JsonTreeRow_cjs_namespaceObject.ROW_MIN_HEIGHT_PX,
|
|
53
53
|
getItemKey,
|
|
54
54
|
overscan: VIRTUAL_OVERSCAN,
|
|
55
55
|
scrollMargin
|
|
56
56
|
});
|
|
57
57
|
(0, useIsomorphicLayoutEffect_cjs_namespaceObject.useIsomorphicLayoutEffect)(()=>{
|
|
58
|
-
const container = containerRef.current;
|
|
59
58
|
if (!container || !scrollElement) {
|
|
60
59
|
if (0 !== scrollMargin) setScrollMargin(0);
|
|
61
60
|
return;
|
|
@@ -125,7 +124,7 @@ const DefaultRowWrapper = ({ className, style, onClick, children })=>/*#__PURE__
|
|
|
125
124
|
});
|
|
126
125
|
function JsonTree({ nodes, collapsed = {}, onToggleCollapsed, query, filterPredicate, readOnly = false, onEdit, rowWrapper, decorateNode, deriveTypeIcon, renderValue, nodeActions, maxInlineActions = 3, renderCodeEditor, pathForCopy, onCopy, virtualized = false, scrollElement, emptyMessage, className }) {
|
|
127
126
|
const { _ } = (0, index_cjs_namespaceObject.useSafeLingui)();
|
|
128
|
-
const
|
|
127
|
+
const [container, setContainer] = (0, external_react_namespaceObject.useState)(null);
|
|
129
128
|
const usesAncestorScroller = virtualized && !!scrollElement;
|
|
130
129
|
const RowWrapper = rowWrapper ?? DefaultRowWrapper;
|
|
131
130
|
const [editingPath, setEditingPath] = (0, external_react_namespaceObject.useState)(null);
|
|
@@ -228,12 +227,12 @@ function JsonTree({ nodes, collapsed = {}, onToggleCollapsed, query, filterPredi
|
|
|
228
227
|
children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_JsonTreeRow_cjs_namespaceObject.JsonTreeRowContextProvider, {
|
|
229
228
|
value: rowContext,
|
|
230
229
|
children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
|
|
231
|
-
ref:
|
|
230
|
+
ref: setContainer,
|
|
232
231
|
className: (0, apollo_wind_namespaceObject.cn)(usesAncestorScroller ? 'overflow-x-clip' : 'h-full overflow-y-auto overflow-x-hidden', virtualized && !usesAncestorScroller && 'max-h-screen', virtualized && '[overflow-anchor:none]', className),
|
|
233
232
|
children: [
|
|
234
233
|
virtualized ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(VirtualRows, {
|
|
235
234
|
rows: rows,
|
|
236
|
-
|
|
235
|
+
container: container,
|
|
237
236
|
scrollElement: scrollElement,
|
|
238
237
|
pinnedPaths: pinnedPaths
|
|
239
238
|
}) : rows.map(({ node, depth })=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_JsonTreeRow_cjs_namespaceObject.JsonTreeRow, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"JsonTree.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/JsonTree/JsonTree.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EACV,SAAS,EACT,cAAc,EACd,YAAY,EACZ,kBAAkB,EAClB,SAAS,EACT,mBAAmB,EACnB,cAAc,EACd,gBAAgB,EAChB,eAAe,EAChB,MAAM,kBAAkB,CAAC;AAQ1B,MAAM,WAAW,aAAa;IAE5B,KAAK,EAAE,YAAY,EAAE,CAAC;IAEtB,SAAS,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACpC,iBAAiB,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAE3C,KAAK,CAAC,EAAE,MAAM,CAAC;IAKf,eAAe,CAAC,EAAE,CAAC,IAAI,EAAE,YAAY,KAAK,OAAO,CAAC;IAElD,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,YAAY,EAAE,KAAK,EAAE,SAAS,GAAG,SAAS,KAAK,IAAI,CAAC;IAMpE,UAAU,CAAC,EAAE,kBAAkB,CAAC;IAEhC,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,YAAY,KAAK,cAAc,GAAG,SAAS,CAAC;IAElE,cAAc,CAAC,EAAE,cAAc,CAAC;IAEhC,WAAW,CAAC,EAAE,eAAe,CAAC;IAM9B,WAAW,CAAC,EAAE,mBAAmB,CAAC;IAKlC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAE1B,gBAAgB,CAAC,EAAE,gBAAgB,CAAC;IAEpC,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,MAAM,CAAC;IAEvC,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;IAQpC,WAAW,CAAC,EAAE,OAAO,CAAC;IAQtB,aAAa,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IACnC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;
|
|
1
|
+
{"version":3,"file":"JsonTree.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/JsonTree/JsonTree.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EACV,SAAS,EACT,cAAc,EACd,YAAY,EACZ,kBAAkB,EAClB,SAAS,EACT,mBAAmB,EACnB,cAAc,EACd,gBAAgB,EAChB,eAAe,EAChB,MAAM,kBAAkB,CAAC;AAQ1B,MAAM,WAAW,aAAa;IAE5B,KAAK,EAAE,YAAY,EAAE,CAAC;IAEtB,SAAS,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACpC,iBAAiB,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAE3C,KAAK,CAAC,EAAE,MAAM,CAAC;IAKf,eAAe,CAAC,EAAE,CAAC,IAAI,EAAE,YAAY,KAAK,OAAO,CAAC;IAElD,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,YAAY,EAAE,KAAK,EAAE,SAAS,GAAG,SAAS,KAAK,IAAI,CAAC;IAMpE,UAAU,CAAC,EAAE,kBAAkB,CAAC;IAEhC,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,YAAY,KAAK,cAAc,GAAG,SAAS,CAAC;IAElE,cAAc,CAAC,EAAE,cAAc,CAAC;IAEhC,WAAW,CAAC,EAAE,eAAe,CAAC;IAM9B,WAAW,CAAC,EAAE,mBAAmB,CAAC;IAKlC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAE1B,gBAAgB,CAAC,EAAE,gBAAgB,CAAC;IAEpC,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,MAAM,CAAC;IAEvC,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;IAQpC,WAAW,CAAC,EAAE,OAAO,CAAC;IAQtB,aAAa,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IACnC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAqJD,wBAAgB,QAAQ,CAAC,EACvB,KAAK,EACL,SAAc,EACd,iBAAiB,EACjB,KAAK,EACL,eAAe,EACf,QAAgB,EAChB,MAAM,EACN,UAAU,EACV,YAAY,EACZ,cAAc,EACd,WAAW,EACX,WAAW,EACX,gBAAoB,EACpB,gBAAgB,EAChB,WAAW,EACX,MAAM,EACN,WAAmB,EACnB,aAAa,EACb,YAAY,EACZ,SAAS,GACV,EAAE,aAAa,2CA6Jf"}
|
|
@@ -13,21 +13,20 @@ const VIRTUAL_OVERSCAN = 10;
|
|
|
13
13
|
function scrollMarginOf(element, scrollElement) {
|
|
14
14
|
return Math.round(element.getBoundingClientRect().top - scrollElement.getBoundingClientRect().top + scrollElement.scrollTop);
|
|
15
15
|
}
|
|
16
|
-
function VirtualRows({ rows,
|
|
16
|
+
function VirtualRows({ rows, container, scrollElement, pinnedPaths }) {
|
|
17
17
|
const [scrollMargin, setScrollMargin] = useState(0);
|
|
18
18
|
const getItemKey = useCallback((index)=>rows[index]?.node.path ?? index, [
|
|
19
19
|
rows
|
|
20
20
|
]);
|
|
21
21
|
const virtualizer = useVirtualizer({
|
|
22
22
|
count: rows.length,
|
|
23
|
-
getScrollElement: ()=>scrollElement ??
|
|
23
|
+
getScrollElement: ()=>scrollElement ?? container,
|
|
24
24
|
estimateSize: ()=>ROW_MIN_HEIGHT_PX,
|
|
25
25
|
getItemKey,
|
|
26
26
|
overscan: VIRTUAL_OVERSCAN,
|
|
27
27
|
scrollMargin
|
|
28
28
|
});
|
|
29
29
|
useIsomorphicLayoutEffect(()=>{
|
|
30
|
-
const container = containerRef.current;
|
|
31
30
|
if (!container || !scrollElement) {
|
|
32
31
|
if (0 !== scrollMargin) setScrollMargin(0);
|
|
33
32
|
return;
|
|
@@ -97,7 +96,7 @@ const DefaultRowWrapper = ({ className, style, onClick, children })=>/*#__PURE__
|
|
|
97
96
|
});
|
|
98
97
|
function JsonTree({ nodes, collapsed = {}, onToggleCollapsed, query, filterPredicate, readOnly = false, onEdit, rowWrapper, decorateNode, deriveTypeIcon, renderValue, nodeActions, maxInlineActions = 3, renderCodeEditor, pathForCopy, onCopy, virtualized = false, scrollElement, emptyMessage, className }) {
|
|
99
98
|
const { _ } = useSafeLingui();
|
|
100
|
-
const
|
|
99
|
+
const [container, setContainer] = useState(null);
|
|
101
100
|
const usesAncestorScroller = virtualized && !!scrollElement;
|
|
102
101
|
const RowWrapper = rowWrapper ?? DefaultRowWrapper;
|
|
103
102
|
const [editingPath, setEditingPath] = useState(null);
|
|
@@ -200,12 +199,12 @@ function JsonTree({ nodes, collapsed = {}, onToggleCollapsed, query, filterPredi
|
|
|
200
199
|
children: /*#__PURE__*/ jsx(JsonTreeRowContextProvider, {
|
|
201
200
|
value: rowContext,
|
|
202
201
|
children: /*#__PURE__*/ jsxs("div", {
|
|
203
|
-
ref:
|
|
202
|
+
ref: setContainer,
|
|
204
203
|
className: cn(usesAncestorScroller ? 'overflow-x-clip' : 'h-full overflow-y-auto overflow-x-hidden', virtualized && !usesAncestorScroller && 'max-h-screen', virtualized && '[overflow-anchor:none]', className),
|
|
205
204
|
children: [
|
|
206
205
|
virtualized ? /*#__PURE__*/ jsx(VirtualRows, {
|
|
207
206
|
rows: rows,
|
|
208
|
-
|
|
207
|
+
container: container,
|
|
209
208
|
scrollElement: scrollElement,
|
|
210
209
|
pinnedPaths: pinnedPaths
|
|
211
210
|
}) : rows.map(({ node, depth })=>/*#__PURE__*/ jsx(JsonTreeRow, {
|
|
@@ -200,7 +200,7 @@ function flattenJsonTree(nodes, options = {}, depth = 0) {
|
|
|
200
200
|
query: selfQueryMatch ? '' : options.query,
|
|
201
201
|
filterPredicate: selfPredicateMatch ? void 0 : filterPredicate
|
|
202
202
|
} : options;
|
|
203
|
-
|
|
203
|
+
for (const row of flattenJsonTree(node.children, childOptions, depth + 1))rows.push(row);
|
|
204
204
|
}
|
|
205
205
|
}
|
|
206
206
|
}
|
|
@@ -213,7 +213,7 @@ function collectContainerPaths(nodes, depth = 0) {
|
|
|
213
213
|
path: node.path,
|
|
214
214
|
depth
|
|
215
215
|
});
|
|
216
|
-
|
|
216
|
+
for (const child of collectContainerPaths(node.children, depth + 1))paths.push(child);
|
|
217
217
|
}
|
|
218
218
|
return paths;
|
|
219
219
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"buildJsonTree.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/JsonTree/buildJsonTree.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,aAAa,EACb,UAAU,EACV,UAAU,EAEV,YAAY,EACZ,gBAAgB,EAChB,SAAS,EACT,WAAW,EACZ,MAAM,kBAAkB,CAAC;AAI1B,wBAAgB,YAAY,CAAC,KAAK,EAAE,SAAS,GAAG,SAAS,GAAG,KAAK,IAAI,UAAU,CAE9E;AAGD,wBAAgB,iBAAiB,CAAC,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,WAAW,GAAG,MAAM,CAI5E;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,SAAS,GAAG,gBAAgB,CAajE;AAQD,wBAAgB,iBAAiB,CAAC,MAAM,EAAE,UAAU,GAAG,SAAS,GAAG,gBAAgB,CASlF;AAuJD,MAAM,WAAW,oBAAoB;IACnC,MAAM,CAAC,EAAE,UAAU,CAAC;IAEpB,KAAK,CAAC,EAAE,aAAa,CAAC;IAEtB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AASD,wBAAgB,aAAa,CAAC,OAAO,EAAE,oBAAoB,GAAG,YAAY,EAAE,CAc3E;AASD,wBAAgB,uBAAuB,CAAC,IAAI,EAAE,YAAY,GAAG,OAAO,CAEnE;AAED,MAAM,WAAW,eAAe;IAC9B,IAAI,EAAE,YAAY,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;CACf;AAGD,MAAM,MAAM,gBAAgB,GAAG,CAC7B,IAAI,EAAE,YAAY,KACf;IAAE,KAAK,CAAC,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,EAAE,MAAM,CAAA;CAAE,GAAG,SAAS,CAAC;AAoCvD,MAAM,WAAW,cAAc;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACpC,KAAK,CAAC,EAAE,MAAM,CAAC;IAKf,eAAe,CAAC,EAAE,CAAC,IAAI,EAAE,YAAY,KAAK,OAAO,CAAC;IAElD,YAAY,CAAC,EAAE,gBAAgB,CAAC;CACjC;AAGD,wBAAgB,eAAe,CAC7B,KAAK,EAAE,YAAY,EAAE,EACrB,OAAO,GAAE,cAAmB,EAC5B,KAAK,SAAI,GACR,eAAe,EAAE,
|
|
1
|
+
{"version":3,"file":"buildJsonTree.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/JsonTree/buildJsonTree.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,aAAa,EACb,UAAU,EACV,UAAU,EAEV,YAAY,EACZ,gBAAgB,EAChB,SAAS,EACT,WAAW,EACZ,MAAM,kBAAkB,CAAC;AAI1B,wBAAgB,YAAY,CAAC,KAAK,EAAE,SAAS,GAAG,SAAS,GAAG,KAAK,IAAI,UAAU,CAE9E;AAGD,wBAAgB,iBAAiB,CAAC,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,WAAW,GAAG,MAAM,CAI5E;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,SAAS,GAAG,gBAAgB,CAajE;AAQD,wBAAgB,iBAAiB,CAAC,MAAM,EAAE,UAAU,GAAG,SAAS,GAAG,gBAAgB,CASlF;AAuJD,MAAM,WAAW,oBAAoB;IACnC,MAAM,CAAC,EAAE,UAAU,CAAC;IAEpB,KAAK,CAAC,EAAE,aAAa,CAAC;IAEtB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AASD,wBAAgB,aAAa,CAAC,OAAO,EAAE,oBAAoB,GAAG,YAAY,EAAE,CAc3E;AASD,wBAAgB,uBAAuB,CAAC,IAAI,EAAE,YAAY,GAAG,OAAO,CAEnE;AAED,MAAM,WAAW,eAAe;IAC9B,IAAI,EAAE,YAAY,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;CACf;AAGD,MAAM,MAAM,gBAAgB,GAAG,CAC7B,IAAI,EAAE,YAAY,KACf;IAAE,KAAK,CAAC,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,EAAE,MAAM,CAAA;CAAE,GAAG,SAAS,CAAC;AAoCvD,MAAM,WAAW,cAAc;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACpC,KAAK,CAAC,EAAE,MAAM,CAAC;IAKf,eAAe,CAAC,EAAE,CAAC,IAAI,EAAE,YAAY,KAAK,OAAO,CAAC;IAElD,YAAY,CAAC,EAAE,gBAAgB,CAAC;CACjC;AAGD,wBAAgB,eAAe,CAC7B,KAAK,EAAE,YAAY,EAAE,EACrB,OAAO,GAAE,cAAmB,EAC5B,KAAK,SAAI,GACR,eAAe,EAAE,CA2CnB;AAED,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;CACf;AAGD,wBAAgB,qBAAqB,CAAC,KAAK,EAAE,YAAY,EAAE,EAAE,KAAK,SAAI,GAAG,aAAa,EAAE,CAYvF;AAED,wBAAgB,cAAc,CAC5B,IAAI,EAAE,SAAS,GAAG,SAAS,EAC3B,QAAQ,EAAE,WAAW,EAAE,GACtB,SAAS,GAAG,SAAS,CAcvB;AAOD,wBAAgB,cAAc,CAC5B,IAAI,EAAE,SAAS,GAAG,SAAS,EAC3B,QAAQ,EAAE,WAAW,EAAE,EACvB,KAAK,EAAE,SAAS,GACf,SAAS,CAoBX;AAOD,wBAAgB,iBAAiB,CAC/B,IAAI,EAAE,SAAS,GAAG,SAAS,EAC3B,QAAQ,EAAE,WAAW,EAAE,GACtB,SAAS,GAAG,SAAS,CAyBvB;AAGD,wBAAgB,eAAe,CAC7B,IAAI,EAAE,gBAAgB,EACtB,KAAK,EAAE,SAAS,GAAG,SAAS,EAC5B,OAAO,CAAC,EAAE;IAAE,wBAAwB,CAAC,EAAE,OAAO,CAAA;CAAE,GAC/C,MAAM,CAMR"}
|
|
@@ -161,7 +161,7 @@ function flattenJsonTree(nodes, options = {}, depth = 0) {
|
|
|
161
161
|
query: selfQueryMatch ? '' : options.query,
|
|
162
162
|
filterPredicate: selfPredicateMatch ? void 0 : filterPredicate
|
|
163
163
|
} : options;
|
|
164
|
-
|
|
164
|
+
for (const row of flattenJsonTree(node.children, childOptions, depth + 1))rows.push(row);
|
|
165
165
|
}
|
|
166
166
|
}
|
|
167
167
|
}
|
|
@@ -174,7 +174,7 @@ function collectContainerPaths(nodes, depth = 0) {
|
|
|
174
174
|
path: node.path,
|
|
175
175
|
depth
|
|
176
176
|
});
|
|
177
|
-
|
|
177
|
+
for (const child of collectContainerPaths(node.children, depth + 1))paths.push(child);
|
|
178
178
|
}
|
|
179
179
|
return paths;
|
|
180
180
|
}
|
|
@@ -31,6 +31,7 @@ const apollo_wind_namespaceObject = require("@uipath/apollo-wind");
|
|
|
31
31
|
const external_react_namespaceObject = require("react");
|
|
32
32
|
const useIsomorphicLayoutEffect_cjs_namespaceObject = require("../../hooks/useIsomorphicLayoutEffect.cjs");
|
|
33
33
|
const external_CanvasTooltip_cjs_namespaceObject = require("../CanvasTooltip.cjs");
|
|
34
|
+
const stripNewlines = (text)=>text.replace(/\n+/g, ' ');
|
|
34
35
|
const READ_CLASS = {
|
|
35
36
|
lg: 'text-base font-semibold leading-5 tracking-[-0.3px] text-foreground',
|
|
36
37
|
sm: 'text-xs leading-4 text-foreground-muted'
|
|
@@ -47,34 +48,43 @@ const VERTICAL_PADDING = 4;
|
|
|
47
48
|
const CLAMP_CLASS = 'line-clamp-[var(--editable-text-lines)] whitespace-pre-line wrap-break-word';
|
|
48
49
|
const INTERACTIVE_CLASS = 'rounded px-1.5 py-0.5 -mx-1.5';
|
|
49
50
|
const ERROR_RING_CLASS = 'ring-1 ring-error';
|
|
50
|
-
function EditableText({ value, placeholder, size = 'lg', multiline, maxLines = 3, onChange, error, 'aria-label': ariaLabel, className, 'data-testid': dataTestId }) {
|
|
51
|
+
function EditableText({ value, placeholder, size = 'lg', multiline, maxLines = 3, onChange, onSubmit, disabled, error, 'aria-label': ariaLabel, className, 'data-testid': dataTestId }) {
|
|
52
|
+
const allowNewlines = true === multiline;
|
|
53
|
+
const editable = !!onChange && !!onSubmit;
|
|
51
54
|
const [isEditing, setIsEditing] = (0, external_react_namespaceObject.useState)(false);
|
|
52
|
-
const [draft, setDraft] = (0, external_react_namespaceObject.useState)(value);
|
|
53
55
|
const inputRef = (0, external_react_namespaceObject.useRef)(null);
|
|
56
|
+
const openedWith = (0, external_react_namespaceObject.useRef)(value);
|
|
54
57
|
const errorId = `editable-text-${(0, external_react_namespaceObject.useId)().replace(/:/g, '')}-error`;
|
|
55
58
|
const hasError = !!error;
|
|
56
59
|
const describedBy = hasError ? errorId : void 0;
|
|
57
60
|
(0, useIsomorphicLayoutEffect_cjs_namespaceObject.useIsomorphicLayoutEffect)(()=>{
|
|
61
|
+
if (disabled) return setIsEditing(false);
|
|
58
62
|
if (!isEditing) return;
|
|
59
63
|
inputRef.current?.focus();
|
|
60
64
|
inputRef.current?.select();
|
|
61
65
|
}, [
|
|
62
|
-
isEditing
|
|
66
|
+
isEditing,
|
|
67
|
+
disabled
|
|
63
68
|
]);
|
|
64
69
|
const commit = (0, external_react_namespaceObject.useCallback)(()=>{
|
|
65
70
|
setIsEditing(false);
|
|
66
|
-
const next =
|
|
71
|
+
const next = value.trim();
|
|
67
72
|
if (next !== value) onChange?.(next);
|
|
73
|
+
if (next !== openedWith.current) onSubmit?.(next);
|
|
68
74
|
}, [
|
|
69
|
-
draft,
|
|
70
75
|
value,
|
|
71
|
-
onChange
|
|
76
|
+
onChange,
|
|
77
|
+
onSubmit
|
|
72
78
|
]);
|
|
73
79
|
const cancel = (0, external_react_namespaceObject.useCallback)(()=>{
|
|
74
80
|
setIsEditing(false);
|
|
75
|
-
|
|
81
|
+
if (openedWith.current !== value) onChange?.(openedWith.current);
|
|
82
|
+
}, [
|
|
83
|
+
value,
|
|
84
|
+
onChange
|
|
85
|
+
]);
|
|
76
86
|
const handleKeyDown = (0, external_react_namespaceObject.useCallback)((e)=>{
|
|
77
|
-
if ('Enter' !== e.key ||
|
|
87
|
+
if ('Enter' !== e.key || allowNewlines && e.shiftKey) {
|
|
78
88
|
if ('Escape' === e.key) {
|
|
79
89
|
e.preventDefault();
|
|
80
90
|
cancel();
|
|
@@ -87,7 +97,7 @@ function EditableText({ value, placeholder, size = 'lg', multiline, maxLines = 3
|
|
|
87
97
|
}, [
|
|
88
98
|
commit,
|
|
89
99
|
cancel,
|
|
90
|
-
|
|
100
|
+
allowNewlines
|
|
91
101
|
]);
|
|
92
102
|
const editorMaxHeight = multiline ? {
|
|
93
103
|
maxHeight: maxLines * LINE_HEIGHT[size] + VERTICAL_PADDING
|
|
@@ -102,7 +112,7 @@ function EditableText({ value, placeholder, size = 'lg', multiline, maxLines = 3
|
|
|
102
112
|
className: "-ml-1 mt-1",
|
|
103
113
|
children: error
|
|
104
114
|
});
|
|
105
|
-
if (!
|
|
115
|
+
if (!editable) return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(jsx_runtime_namespaceObject.Fragment, {
|
|
106
116
|
children: [
|
|
107
117
|
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_CanvasTooltip_cjs_namespaceObject.CanvasTooltip, {
|
|
108
118
|
content: value || placeholder,
|
|
@@ -120,11 +130,11 @@ function EditableText({ value, placeholder, size = 'lg', multiline, maxLines = 3
|
|
|
120
130
|
message
|
|
121
131
|
]
|
|
122
132
|
});
|
|
123
|
-
if (isEditing) {
|
|
133
|
+
if (isEditing && !disabled) {
|
|
124
134
|
const sharedProps = {
|
|
125
135
|
'data-slot': 'editable-text-input',
|
|
126
136
|
'data-testid': dataTestId ? `${dataTestId}-input` : void 0,
|
|
127
|
-
value
|
|
137
|
+
value,
|
|
128
138
|
placeholder,
|
|
129
139
|
'aria-label': ariaLabel,
|
|
130
140
|
'aria-describedby': describedBy,
|
|
@@ -142,12 +152,12 @@ function EditableText({ value, placeholder, size = 'lg', multiline, maxLines = 3
|
|
|
142
152
|
rows: 1,
|
|
143
153
|
style: editorMaxHeight,
|
|
144
154
|
className: (0, apollo_wind_namespaceObject.cn)(sharedProps.className, 'field-sizing-content max-w-full resize-none overflow-y-auto wrap-break-word'),
|
|
145
|
-
onChange: (e)=>
|
|
155
|
+
onChange: (e)=>onChange?.(allowNewlines ? e.target.value : stripNewlines(e.target.value))
|
|
146
156
|
}) : /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("input", {
|
|
147
157
|
...sharedProps,
|
|
148
158
|
ref: inputRef,
|
|
149
159
|
autoComplete: "off",
|
|
150
|
-
onChange: (e)=>
|
|
160
|
+
onChange: (e)=>onChange?.(e.target.value)
|
|
151
161
|
}),
|
|
152
162
|
message
|
|
153
163
|
]
|
|
@@ -167,12 +177,14 @@ function EditableText({ value, placeholder, size = 'lg', multiline, maxLines = 3
|
|
|
167
177
|
"aria-describedby": describedBy,
|
|
168
178
|
"aria-errormessage": hasError ? errorId : void 0,
|
|
169
179
|
"aria-invalid": hasError || void 0,
|
|
180
|
+
"aria-disabled": disabled || void 0,
|
|
170
181
|
onClick: ()=>{
|
|
171
|
-
|
|
182
|
+
if (disabled) return;
|
|
183
|
+
openedWith.current = value;
|
|
172
184
|
setIsEditing(true);
|
|
173
185
|
},
|
|
174
186
|
style: readClampStyle,
|
|
175
|
-
className: (0, apollo_wind_namespaceObject.cn)('nodrag max-w-full cursor-text border-none bg-transparent text-left transition hover:bg-surface-overlay', readClampClass, INTERACTIVE_CLASS, READ_CLASS[size], !value && 'text-foreground-subtle', hasError && ERROR_RING_CLASS, className),
|
|
187
|
+
className: (0, apollo_wind_namespaceObject.cn)('nodrag max-w-full cursor-text border-none bg-transparent text-left transition hover:bg-surface-overlay', 'aria-disabled:cursor-not-allowed aria-disabled:opacity-50 aria-disabled:hover:bg-transparent', readClampClass, INTERACTIVE_CLASS, READ_CLASS[size], !value && 'text-foreground-subtle', hasError && ERROR_RING_CLASS, className),
|
|
176
188
|
children: value || placeholder
|
|
177
189
|
})
|
|
178
190
|
}),
|
|
@@ -3,13 +3,15 @@ export interface EditableTextProps {
|
|
|
3
3
|
value: string;
|
|
4
4
|
placeholder?: string;
|
|
5
5
|
size?: 'sm' | 'lg';
|
|
6
|
-
multiline?: boolean;
|
|
6
|
+
multiline?: boolean | 'wrap';
|
|
7
7
|
maxLines?: number;
|
|
8
8
|
onChange?: (next: string) => void;
|
|
9
|
+
onSubmit?: (next: string) => void;
|
|
10
|
+
disabled?: boolean;
|
|
9
11
|
error?: ReactNode;
|
|
10
12
|
'aria-label'?: string;
|
|
11
13
|
className?: string;
|
|
12
14
|
'data-testid'?: string;
|
|
13
15
|
}
|
|
14
|
-
export declare function EditableText({ value, placeholder, size, multiline, maxLines, onChange, error, 'aria-label': ariaLabel, className, 'data-testid': dataTestId, }: EditableTextProps): import("react/jsx-runtime").JSX.Element;
|
|
16
|
+
export declare function EditableText({ value, placeholder, size, multiline, maxLines, onChange, onSubmit, disabled, error, 'aria-label': ariaLabel, className, 'data-testid': dataTestId, }: EditableTextProps): import("react/jsx-runtime").JSX.Element;
|
|
15
17
|
//# sourceMappingURL=EditableText.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EditableText.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/NodePropertyPanel/EditableText.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,SAAS,EAAwC,MAAM,OAAO,CAAC;AAI7E,MAAM,WAAW,iBAAiB;
|
|
1
|
+
{"version":3,"file":"EditableText.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/NodePropertyPanel/EditableText.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,SAAS,EAAwC,MAAM,OAAO,CAAC;AAI7E,MAAM,WAAW,iBAAiB;IAEhC,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IAKnB,SAAS,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAE7B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAElC,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAElC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,KAAK,CAAC,EAAE,SAAS,CAAC;IAElB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAuCD,wBAAgB,YAAY,CAAC,EAC3B,KAAK,EACL,WAAW,EACX,IAAW,EACX,SAAS,EACT,QAAY,EACZ,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,KAAK,EACL,YAAY,EAAE,SAAS,EACvB,SAAS,EACT,aAAa,EAAE,UAAU,GAC1B,EAAE,iBAAiB,2CAoLnB"}
|
|
@@ -3,6 +3,7 @@ import { FormFieldError, cn } from "@uipath/apollo-wind";
|
|
|
3
3
|
import { useCallback, useId, useRef, useState } from "react";
|
|
4
4
|
import { useIsomorphicLayoutEffect } from "../../hooks/useIsomorphicLayoutEffect.js";
|
|
5
5
|
import { CanvasTooltip } from "../CanvasTooltip.js";
|
|
6
|
+
const stripNewlines = (text)=>text.replace(/\n+/g, ' ');
|
|
6
7
|
const READ_CLASS = {
|
|
7
8
|
lg: 'text-base font-semibold leading-5 tracking-[-0.3px] text-foreground',
|
|
8
9
|
sm: 'text-xs leading-4 text-foreground-muted'
|
|
@@ -19,34 +20,43 @@ const VERTICAL_PADDING = 4;
|
|
|
19
20
|
const CLAMP_CLASS = 'line-clamp-[var(--editable-text-lines)] whitespace-pre-line wrap-break-word';
|
|
20
21
|
const INTERACTIVE_CLASS = 'rounded px-1.5 py-0.5 -mx-1.5';
|
|
21
22
|
const ERROR_RING_CLASS = 'ring-1 ring-error';
|
|
22
|
-
function EditableText({ value, placeholder, size = 'lg', multiline, maxLines = 3, onChange, error, 'aria-label': ariaLabel, className, 'data-testid': dataTestId }) {
|
|
23
|
+
function EditableText({ value, placeholder, size = 'lg', multiline, maxLines = 3, onChange, onSubmit, disabled, error, 'aria-label': ariaLabel, className, 'data-testid': dataTestId }) {
|
|
24
|
+
const allowNewlines = true === multiline;
|
|
25
|
+
const editable = !!onChange && !!onSubmit;
|
|
23
26
|
const [isEditing, setIsEditing] = useState(false);
|
|
24
|
-
const [draft, setDraft] = useState(value);
|
|
25
27
|
const inputRef = useRef(null);
|
|
28
|
+
const openedWith = useRef(value);
|
|
26
29
|
const errorId = `editable-text-${useId().replace(/:/g, '')}-error`;
|
|
27
30
|
const hasError = !!error;
|
|
28
31
|
const describedBy = hasError ? errorId : void 0;
|
|
29
32
|
useIsomorphicLayoutEffect(()=>{
|
|
33
|
+
if (disabled) return setIsEditing(false);
|
|
30
34
|
if (!isEditing) return;
|
|
31
35
|
inputRef.current?.focus();
|
|
32
36
|
inputRef.current?.select();
|
|
33
37
|
}, [
|
|
34
|
-
isEditing
|
|
38
|
+
isEditing,
|
|
39
|
+
disabled
|
|
35
40
|
]);
|
|
36
41
|
const commit = useCallback(()=>{
|
|
37
42
|
setIsEditing(false);
|
|
38
|
-
const next =
|
|
43
|
+
const next = value.trim();
|
|
39
44
|
if (next !== value) onChange?.(next);
|
|
45
|
+
if (next !== openedWith.current) onSubmit?.(next);
|
|
40
46
|
}, [
|
|
41
|
-
draft,
|
|
42
47
|
value,
|
|
43
|
-
onChange
|
|
48
|
+
onChange,
|
|
49
|
+
onSubmit
|
|
44
50
|
]);
|
|
45
51
|
const cancel = useCallback(()=>{
|
|
46
52
|
setIsEditing(false);
|
|
47
|
-
|
|
53
|
+
if (openedWith.current !== value) onChange?.(openedWith.current);
|
|
54
|
+
}, [
|
|
55
|
+
value,
|
|
56
|
+
onChange
|
|
57
|
+
]);
|
|
48
58
|
const handleKeyDown = useCallback((e)=>{
|
|
49
|
-
if ('Enter' !== e.key ||
|
|
59
|
+
if ('Enter' !== e.key || allowNewlines && e.shiftKey) {
|
|
50
60
|
if ('Escape' === e.key) {
|
|
51
61
|
e.preventDefault();
|
|
52
62
|
cancel();
|
|
@@ -59,7 +69,7 @@ function EditableText({ value, placeholder, size = 'lg', multiline, maxLines = 3
|
|
|
59
69
|
}, [
|
|
60
70
|
commit,
|
|
61
71
|
cancel,
|
|
62
|
-
|
|
72
|
+
allowNewlines
|
|
63
73
|
]);
|
|
64
74
|
const editorMaxHeight = multiline ? {
|
|
65
75
|
maxHeight: maxLines * LINE_HEIGHT[size] + VERTICAL_PADDING
|
|
@@ -74,7 +84,7 @@ function EditableText({ value, placeholder, size = 'lg', multiline, maxLines = 3
|
|
|
74
84
|
className: "-ml-1 mt-1",
|
|
75
85
|
children: error
|
|
76
86
|
});
|
|
77
|
-
if (!
|
|
87
|
+
if (!editable) return /*#__PURE__*/ jsxs(Fragment, {
|
|
78
88
|
children: [
|
|
79
89
|
/*#__PURE__*/ jsx(CanvasTooltip, {
|
|
80
90
|
content: value || placeholder,
|
|
@@ -92,11 +102,11 @@ function EditableText({ value, placeholder, size = 'lg', multiline, maxLines = 3
|
|
|
92
102
|
message
|
|
93
103
|
]
|
|
94
104
|
});
|
|
95
|
-
if (isEditing) {
|
|
105
|
+
if (isEditing && !disabled) {
|
|
96
106
|
const sharedProps = {
|
|
97
107
|
'data-slot': 'editable-text-input',
|
|
98
108
|
'data-testid': dataTestId ? `${dataTestId}-input` : void 0,
|
|
99
|
-
value
|
|
109
|
+
value,
|
|
100
110
|
placeholder,
|
|
101
111
|
'aria-label': ariaLabel,
|
|
102
112
|
'aria-describedby': describedBy,
|
|
@@ -114,12 +124,12 @@ function EditableText({ value, placeholder, size = 'lg', multiline, maxLines = 3
|
|
|
114
124
|
rows: 1,
|
|
115
125
|
style: editorMaxHeight,
|
|
116
126
|
className: cn(sharedProps.className, 'field-sizing-content max-w-full resize-none overflow-y-auto wrap-break-word'),
|
|
117
|
-
onChange: (e)=>
|
|
127
|
+
onChange: (e)=>onChange?.(allowNewlines ? e.target.value : stripNewlines(e.target.value))
|
|
118
128
|
}) : /*#__PURE__*/ jsx("input", {
|
|
119
129
|
...sharedProps,
|
|
120
130
|
ref: inputRef,
|
|
121
131
|
autoComplete: "off",
|
|
122
|
-
onChange: (e)=>
|
|
132
|
+
onChange: (e)=>onChange?.(e.target.value)
|
|
123
133
|
}),
|
|
124
134
|
message
|
|
125
135
|
]
|
|
@@ -139,12 +149,14 @@ function EditableText({ value, placeholder, size = 'lg', multiline, maxLines = 3
|
|
|
139
149
|
"aria-describedby": describedBy,
|
|
140
150
|
"aria-errormessage": hasError ? errorId : void 0,
|
|
141
151
|
"aria-invalid": hasError || void 0,
|
|
152
|
+
"aria-disabled": disabled || void 0,
|
|
142
153
|
onClick: ()=>{
|
|
143
|
-
|
|
154
|
+
if (disabled) return;
|
|
155
|
+
openedWith.current = value;
|
|
144
156
|
setIsEditing(true);
|
|
145
157
|
},
|
|
146
158
|
style: readClampStyle,
|
|
147
|
-
className: cn('nodrag max-w-full cursor-text border-none bg-transparent text-left transition hover:bg-surface-overlay', readClampClass, INTERACTIVE_CLASS, READ_CLASS[size], !value && 'text-foreground-subtle', hasError && ERROR_RING_CLASS, className),
|
|
159
|
+
className: cn('nodrag max-w-full cursor-text border-none bg-transparent text-left transition hover:bg-surface-overlay', 'aria-disabled:cursor-not-allowed aria-disabled:opacity-50 aria-disabled:hover:bg-transparent', readClampClass, INTERACTIVE_CLASS, READ_CLASS[size], !value && 'text-foreground-subtle', hasError && ERROR_RING_CLASS, className),
|
|
148
160
|
children: value || placeholder
|
|
149
161
|
})
|
|
150
162
|
}),
|
|
@@ -33,10 +33,10 @@ 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, onNodeDescriptionChange, nodeLabelError, nodeDescriptionError, action, schema, plugins, onSubmit, disabled, autoComplete, resetKey, className, contentInset = '1.5rem', children, headerExtra, sectionVariant, activeStepId, onActiveStepChange }) {
|
|
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 }) {
|
|
37
37
|
const { _ } = (0, index_cjs_namespaceObject.useSafeLingui)();
|
|
38
|
-
const isLabelEditable = !!onNodeLabelChange;
|
|
39
|
-
const isDescriptionEditable = !!onNodeDescriptionChange;
|
|
38
|
+
const isLabelEditable = !!onNodeLabelChange && !!onNodeLabelSubmit;
|
|
39
|
+
const isDescriptionEditable = !!onNodeDescriptionChange && !!onNodeDescriptionSubmit;
|
|
40
40
|
const showsDescription = !!nodeDescription || isDescriptionEditable || !!nodeDescriptionError;
|
|
41
41
|
const showsLabel = !!nodeLabel || isLabelEditable || !!nodeLabelError;
|
|
42
42
|
const hasNodeHeader = !!(showsLabel || nodeCategory || nodeIcon || action || showsDescription);
|
|
@@ -118,6 +118,8 @@ function NodePropertyPanel({ panelTitle, dragHandleProps, onClose, nodeIcon, nod
|
|
|
118
118
|
}),
|
|
119
119
|
size: "lg",
|
|
120
120
|
onChange: onNodeLabelChange,
|
|
121
|
+
onSubmit: onNodeLabelSubmit,
|
|
122
|
+
disabled: disabled,
|
|
121
123
|
error: nodeLabelError,
|
|
122
124
|
"aria-label": _({
|
|
123
125
|
id: 'canvas.node_property_panel.node_name',
|
|
@@ -135,6 +137,8 @@ function NodePropertyPanel({ panelTitle, dragHandleProps, onClose, nodeIcon, nod
|
|
|
135
137
|
multiline: true,
|
|
136
138
|
maxLines: 3,
|
|
137
139
|
onChange: onNodeDescriptionChange,
|
|
140
|
+
onSubmit: onNodeDescriptionSubmit,
|
|
141
|
+
disabled: disabled,
|
|
138
142
|
error: nodeDescriptionError,
|
|
139
143
|
"aria-label": _({
|
|
140
144
|
id: "canvas.node_property_panel.node_description",
|
|
@@ -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, onNodeDescriptionChange, 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, }: 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;
|
|
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"}
|
|
@@ -5,10 +5,10 @@ import { useMemo } 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, onNodeDescriptionChange, nodeLabelError, nodeDescriptionError, action, schema, plugins, onSubmit, disabled, autoComplete, resetKey, className, contentInset = '1.5rem', children, headerExtra, sectionVariant, activeStepId, onActiveStepChange }) {
|
|
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 }) {
|
|
9
9
|
const { _ } = useSafeLingui();
|
|
10
|
-
const isLabelEditable = !!onNodeLabelChange;
|
|
11
|
-
const isDescriptionEditable = !!onNodeDescriptionChange;
|
|
10
|
+
const isLabelEditable = !!onNodeLabelChange && !!onNodeLabelSubmit;
|
|
11
|
+
const isDescriptionEditable = !!onNodeDescriptionChange && !!onNodeDescriptionSubmit;
|
|
12
12
|
const showsDescription = !!nodeDescription || isDescriptionEditable || !!nodeDescriptionError;
|
|
13
13
|
const showsLabel = !!nodeLabel || isLabelEditable || !!nodeLabelError;
|
|
14
14
|
const hasNodeHeader = !!(showsLabel || nodeCategory || nodeIcon || action || showsDescription);
|
|
@@ -90,6 +90,8 @@ function NodePropertyPanel({ panelTitle, dragHandleProps, onClose, nodeIcon, nod
|
|
|
90
90
|
}),
|
|
91
91
|
size: "lg",
|
|
92
92
|
onChange: onNodeLabelChange,
|
|
93
|
+
onSubmit: onNodeLabelSubmit,
|
|
94
|
+
disabled: disabled,
|
|
93
95
|
error: nodeLabelError,
|
|
94
96
|
"aria-label": _({
|
|
95
97
|
id: 'canvas.node_property_panel.node_name',
|
|
@@ -107,6 +109,8 @@ function NodePropertyPanel({ panelTitle, dragHandleProps, onClose, nodeIcon, nod
|
|
|
107
109
|
multiline: true,
|
|
108
110
|
maxLines: 3,
|
|
109
111
|
onChange: onNodeDescriptionChange,
|
|
112
|
+
onSubmit: onNodeDescriptionSubmit,
|
|
113
|
+
disabled: disabled,
|
|
110
114
|
error: nodeDescriptionError,
|
|
111
115
|
"aria-label": _({
|
|
112
116
|
id: "canvas.node_property_panel.node_description",
|
|
@@ -11,7 +11,9 @@ export interface NodePropertyPanelProps {
|
|
|
11
11
|
nodeLabelPlaceholder?: string;
|
|
12
12
|
nodeDescriptionPlaceholder?: string;
|
|
13
13
|
onNodeLabelChange?: (label: string) => void;
|
|
14
|
+
onNodeLabelSubmit?: (label: string) => void;
|
|
14
15
|
onNodeDescriptionChange?: (description: string) => void;
|
|
16
|
+
onNodeDescriptionSubmit?: (description: string) => void;
|
|
15
17
|
nodeLabelError?: ReactNode;
|
|
16
18
|
nodeDescriptionError?: ReactNode;
|
|
17
19
|
action?: ReactNode;
|
|
@@ -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,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;CACtB"}
|