@uipath/apollo-react 6.72.0 → 6.74.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/canvas/components/JsonTree/JsonTree.cjs +256 -214
- package/dist/canvas/components/JsonTree/JsonTree.d.ts +31 -25
- package/dist/canvas/components/JsonTree/JsonTree.d.ts.map +1 -1
- package/dist/canvas/components/JsonTree/JsonTree.js +238 -217
- package/dist/canvas/components/JsonTree/index.cjs +67 -58
- package/dist/canvas/components/JsonTree/index.d.ts +2 -8
- package/dist/canvas/components/JsonTree/index.d.ts.map +1 -1
- package/dist/canvas/components/JsonTree/index.js +2 -8
- package/dist/canvas/components/NodeIOView/NodeIOView.types.d.ts +1 -1
- package/dist/canvas/components/NodeIOView/NodeIOView.types.d.ts.map +1 -1
- package/dist/canvas/components/StageNode/StageNode.types.d.ts +1 -1
- package/dist/canvas/components/StageNode/StageNode.types.d.ts.map +1 -1
- package/dist/canvas/components/StageNode/StageNodeHeader.cjs +15 -6
- package/dist/canvas/components/StageNode/StageNodeHeader.d.ts.map +1 -1
- package/dist/canvas/components/StageNode/StageNodeHeader.js +15 -6
- package/dist/canvas/stories/templates/LayoutPreviewsPage.cjs +1257 -0
- package/dist/canvas/stories/templates/LayoutPreviewsPage.d.ts +2 -0
- package/dist/canvas/stories/templates/LayoutPreviewsPage.d.ts.map +1 -0
- package/dist/canvas/stories/templates/LayoutPreviewsPage.js +1223 -0
- package/dist/canvas/styles/tailwind.canvas.css +1 -1
- package/package.json +2 -2
- package/dist/canvas/components/JsonTree/DecorationChip.cjs +0 -81
- package/dist/canvas/components/JsonTree/DecorationChip.d.ts +0 -5
- package/dist/canvas/components/JsonTree/DecorationChip.d.ts.map +0 -1
- package/dist/canvas/components/JsonTree/DecorationChip.js +0 -47
- package/dist/canvas/components/JsonTree/EditorChrome.cjs +0 -93
- package/dist/canvas/components/JsonTree/EditorChrome.d.ts +0 -18
- package/dist/canvas/components/JsonTree/EditorChrome.d.ts.map +0 -1
- package/dist/canvas/components/JsonTree/EditorChrome.js +0 -56
- package/dist/canvas/components/JsonTree/JsonContainerEditor.cjs +0 -103
- package/dist/canvas/components/JsonTree/JsonContainerEditor.d.ts +0 -10
- package/dist/canvas/components/JsonTree/JsonContainerEditor.d.ts.map +0 -1
- package/dist/canvas/components/JsonTree/JsonContainerEditor.js +0 -69
- package/dist/canvas/components/JsonTree/JsonLeafValueEditor.cjs +0 -98
- package/dist/canvas/components/JsonTree/JsonLeafValueEditor.d.ts +0 -9
- package/dist/canvas/components/JsonTree/JsonLeafValueEditor.d.ts.map +0 -1
- package/dist/canvas/components/JsonTree/JsonLeafValueEditor.js +0 -64
- package/dist/canvas/components/JsonTree/JsonMultilineLeafEditor.cjs +0 -86
- package/dist/canvas/components/JsonTree/JsonMultilineLeafEditor.d.ts +0 -9
- package/dist/canvas/components/JsonTree/JsonMultilineLeafEditor.d.ts.map +0 -1
- package/dist/canvas/components/JsonTree/JsonMultilineLeafEditor.js +0 -52
- package/dist/canvas/components/JsonTree/JsonTree.types.cjs +0 -18
- package/dist/canvas/components/JsonTree/JsonTree.types.d.ts +0 -110
- package/dist/canvas/components/JsonTree/JsonTree.types.d.ts.map +0 -1
- package/dist/canvas/components/JsonTree/JsonTree.types.js +0 -0
- package/dist/canvas/components/JsonTree/JsonTreeRow.cjs +0 -358
- package/dist/canvas/components/JsonTree/JsonTreeRow.d.ts +0 -36
- package/dist/canvas/components/JsonTree/JsonTreeRow.d.ts.map +0 -1
- package/dist/canvas/components/JsonTree/JsonTreeRow.js +0 -318
- package/dist/canvas/components/JsonTree/JsonTreeToolbar.cjs +0 -224
- package/dist/canvas/components/JsonTree/JsonTreeToolbar.d.ts +0 -17
- package/dist/canvas/components/JsonTree/JsonTreeToolbar.d.ts.map +0 -1
- package/dist/canvas/components/JsonTree/JsonTreeToolbar.js +0 -190
- package/dist/canvas/components/JsonTree/JsonTypeBadge.cjs +0 -70
- package/dist/canvas/components/JsonTree/JsonTypeBadge.d.ts +0 -10
- package/dist/canvas/components/JsonTree/JsonTypeBadge.d.ts.map +0 -1
- package/dist/canvas/components/JsonTree/JsonTypeBadge.js +0 -36
- package/dist/canvas/components/JsonTree/NodeKey.cjs +0 -86
- package/dist/canvas/components/JsonTree/NodeKey.d.ts +0 -10
- package/dist/canvas/components/JsonTree/NodeKey.d.ts.map +0 -1
- package/dist/canvas/components/JsonTree/NodeKey.js +0 -52
- package/dist/canvas/components/JsonTree/RowActions.cjs +0 -121
- package/dist/canvas/components/JsonTree/RowActions.d.ts +0 -8
- package/dist/canvas/components/JsonTree/RowActions.d.ts.map +0 -1
- package/dist/canvas/components/JsonTree/RowActions.js +0 -87
- package/dist/canvas/components/JsonTree/ScalarValueCell.cjs +0 -132
- package/dist/canvas/components/JsonTree/ScalarValueCell.d.ts +0 -12
- package/dist/canvas/components/JsonTree/ScalarValueCell.d.ts.map +0 -1
- package/dist/canvas/components/JsonTree/ScalarValueCell.js +0 -95
- package/dist/canvas/components/JsonTree/buildJsonTree.cjs +0 -321
- package/dist/canvas/components/JsonTree/buildJsonTree.d.ts +0 -39
- package/dist/canvas/components/JsonTree/buildJsonTree.d.ts.map +0 -1
- package/dist/canvas/components/JsonTree/buildJsonTree.js +0 -254
- package/dist/canvas/components/JsonTree/clipboard.cjs +0 -63
- package/dist/canvas/components/JsonTree/clipboard.d.ts +0 -2
- package/dist/canvas/components/JsonTree/clipboard.d.ts.map +0 -1
- package/dist/canvas/components/JsonTree/clipboard.js +0 -29
- package/dist/canvas/components/JsonTree/leafEditTypes.cjs +0 -74
- package/dist/canvas/components/JsonTree/leafEditTypes.d.ts +0 -6
- package/dist/canvas/components/JsonTree/leafEditTypes.d.ts.map +0 -1
- package/dist/canvas/components/JsonTree/leafEditTypes.js +0 -34
|
@@ -1,87 +0,0 @@
|
|
|
1
|
-
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { Button, DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger, cn } from "@uipath/apollo-wind";
|
|
3
|
-
import { MoreHorizontal } from "lucide-react";
|
|
4
|
-
import { useState } from "react";
|
|
5
|
-
import { useSafeLingui } from "../../../i18n/index.js";
|
|
6
|
-
import { CanvasTooltip } from "../CanvasTooltip.js";
|
|
7
|
-
const ACTION_BUTTON_CLASS = 'shrink-0 rounded text-foreground-subtle opacity-0 hover:text-foreground hover:bg-surface-raised group-hover:opacity-100 focus-visible:opacity-100';
|
|
8
|
-
const ACTION_TONE_CLASS = {
|
|
9
|
-
neutral: '',
|
|
10
|
-
info: 'text-info hover:text-info',
|
|
11
|
-
warning: 'text-warning hover:text-warning',
|
|
12
|
-
error: 'text-error hover:text-error'
|
|
13
|
-
};
|
|
14
|
-
function RowActions({ node, actions, maxInline }) {
|
|
15
|
-
const { _ } = useSafeLingui();
|
|
16
|
-
const [menuOpen, setMenuOpen] = useState(false);
|
|
17
|
-
if (0 === actions.length) return null;
|
|
18
|
-
const overflowing = actions.length > maxInline;
|
|
19
|
-
const inline = overflowing ? [] : actions;
|
|
20
|
-
const overflow = overflowing ? actions : [];
|
|
21
|
-
const moreLabel = _({
|
|
22
|
-
id: 'canvas.json_value_panel.more_actions',
|
|
23
|
-
message: 'More actions'
|
|
24
|
-
});
|
|
25
|
-
return /*#__PURE__*/ jsxs("span", {
|
|
26
|
-
className: "ml-auto flex shrink-0 items-center gap-0.5",
|
|
27
|
-
children: [
|
|
28
|
-
inline.map((action)=>/*#__PURE__*/ jsx(CanvasTooltip, {
|
|
29
|
-
content: action.tooltip ?? action.label,
|
|
30
|
-
placement: "top",
|
|
31
|
-
delay: true,
|
|
32
|
-
children: /*#__PURE__*/ jsx(Button, {
|
|
33
|
-
variant: "ghost",
|
|
34
|
-
size: "4xs",
|
|
35
|
-
icon: true,
|
|
36
|
-
disabled: action.disabled,
|
|
37
|
-
onClick: ()=>action.onSelect(node),
|
|
38
|
-
"aria-label": action.label,
|
|
39
|
-
className: cn(ACTION_BUTTON_CLASS, '[&_svg]:size-2.75', action.tone && ACTION_TONE_CLASS[action.tone], action.active && 'text-brand opacity-100 hover:text-brand'),
|
|
40
|
-
children: action.icon
|
|
41
|
-
})
|
|
42
|
-
}, action.id)),
|
|
43
|
-
overflow.length > 0 && /*#__PURE__*/ jsxs(DropdownMenu, {
|
|
44
|
-
open: menuOpen,
|
|
45
|
-
onOpenChange: setMenuOpen,
|
|
46
|
-
children: [
|
|
47
|
-
/*#__PURE__*/ jsx(CanvasTooltip, {
|
|
48
|
-
content: moreLabel,
|
|
49
|
-
placement: "top",
|
|
50
|
-
delay: true,
|
|
51
|
-
hide: menuOpen,
|
|
52
|
-
children: /*#__PURE__*/ jsx(DropdownMenuTrigger, {
|
|
53
|
-
asChild: true,
|
|
54
|
-
children: /*#__PURE__*/ jsx(Button, {
|
|
55
|
-
variant: "ghost",
|
|
56
|
-
size: "4xs",
|
|
57
|
-
icon: true,
|
|
58
|
-
"aria-label": moreLabel,
|
|
59
|
-
className: cn(ACTION_BUTTON_CLASS, '[&_svg]:size-2.75', menuOpen && 'opacity-100'),
|
|
60
|
-
children: /*#__PURE__*/ jsx(MoreHorizontal, {})
|
|
61
|
-
})
|
|
62
|
-
})
|
|
63
|
-
}),
|
|
64
|
-
/*#__PURE__*/ jsx(DropdownMenuContent, {
|
|
65
|
-
side: "left",
|
|
66
|
-
align: "start",
|
|
67
|
-
sideOffset: -12,
|
|
68
|
-
className: "min-w-40",
|
|
69
|
-
children: overflow.map((action)=>/*#__PURE__*/ jsxs(DropdownMenuItem, {
|
|
70
|
-
disabled: action.disabled,
|
|
71
|
-
onClick: ()=>action.onSelect(node),
|
|
72
|
-
className: cn('gap-2 text-xs', 'error' === action.tone && 'text-error'),
|
|
73
|
-
children: [
|
|
74
|
-
/*#__PURE__*/ jsx("span", {
|
|
75
|
-
className: "grid size-3.5 shrink-0 place-items-center [&_svg]:size-3.5",
|
|
76
|
-
children: action.icon
|
|
77
|
-
}),
|
|
78
|
-
action.label
|
|
79
|
-
]
|
|
80
|
-
}, action.id))
|
|
81
|
-
})
|
|
82
|
-
]
|
|
83
|
-
})
|
|
84
|
-
]
|
|
85
|
-
});
|
|
86
|
-
}
|
|
87
|
-
export { RowActions };
|
|
@@ -1,132 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __webpack_require__ = {};
|
|
3
|
-
(()=>{
|
|
4
|
-
__webpack_require__.d = (exports1, definition)=>{
|
|
5
|
-
for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
|
|
6
|
-
enumerable: true,
|
|
7
|
-
get: definition[key]
|
|
8
|
-
});
|
|
9
|
-
};
|
|
10
|
-
})();
|
|
11
|
-
(()=>{
|
|
12
|
-
__webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
|
|
13
|
-
})();
|
|
14
|
-
(()=>{
|
|
15
|
-
__webpack_require__.r = (exports1)=>{
|
|
16
|
-
if ("u" > typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
|
|
17
|
-
value: 'Module'
|
|
18
|
-
});
|
|
19
|
-
Object.defineProperty(exports1, '__esModule', {
|
|
20
|
-
value: true
|
|
21
|
-
});
|
|
22
|
-
};
|
|
23
|
-
})();
|
|
24
|
-
var __webpack_exports__ = {};
|
|
25
|
-
__webpack_require__.r(__webpack_exports__);
|
|
26
|
-
__webpack_require__.d(__webpack_exports__, {
|
|
27
|
-
valueColorClass: ()=>valueColorClass,
|
|
28
|
-
ScalarValueCell: ()=>ScalarValueCell
|
|
29
|
-
});
|
|
30
|
-
const jsx_runtime_namespaceObject = require("react/jsx-runtime");
|
|
31
|
-
const apollo_wind_namespaceObject = require("@uipath/apollo-wind");
|
|
32
|
-
const index_cjs_namespaceObject = require("../../../i18n/index.cjs");
|
|
33
|
-
const external_buildJsonTree_cjs_namespaceObject = require("./buildJsonTree.cjs");
|
|
34
|
-
const external_JsonLeafValueEditor_cjs_namespaceObject = require("./JsonLeafValueEditor.cjs");
|
|
35
|
-
function valueColorClass(type, value) {
|
|
36
|
-
if (null == value) return 'text-foreground-subtle';
|
|
37
|
-
if ('string' === type) return 'text-success';
|
|
38
|
-
if ('number' === type) return 'text-info';
|
|
39
|
-
if ('boolean' === type) return value ? 'text-success' : 'text-error';
|
|
40
|
-
return 'text-foreground';
|
|
41
|
-
}
|
|
42
|
-
const VALUE_CELL_CLASS = 'min-w-0 truncate rounded font-mono text-xs transition hover:bg-surface-raised';
|
|
43
|
-
function ScalarValueCell({ node, readOnly, editing, onStartEdit, onStopEdit, onEdit }) {
|
|
44
|
-
const { _ } = (0, index_cjs_namespaceObject.useSafeLingui)();
|
|
45
|
-
const missing = void 0 === node.value;
|
|
46
|
-
const display = missing ? _({
|
|
47
|
-
id: 'canvas.json_value_panel.unset_value',
|
|
48
|
-
message: 'unset'
|
|
49
|
-
}) : (0, external_buildJsonTree_cjs_namespaceObject.formatLeafValue)(node.type, node.value);
|
|
50
|
-
const colorClass = missing ? 'italic text-foreground-subtle' : valueColorClass(node.type, node.value);
|
|
51
|
-
const enumOptions = node.schema?.enum;
|
|
52
|
-
const isBoolean = 'boolean' === node.type;
|
|
53
|
-
if (editing) return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_JsonLeafValueEditor_cjs_namespaceObject.JsonLeafValueEditor, {
|
|
54
|
-
node: node,
|
|
55
|
-
onCommit: (value)=>{
|
|
56
|
-
onStopEdit();
|
|
57
|
-
onEdit?.(node, value);
|
|
58
|
-
},
|
|
59
|
-
onCancel: onStopEdit
|
|
60
|
-
});
|
|
61
|
-
if (readOnly || !onEdit) return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
|
|
62
|
-
className: (0, apollo_wind_namespaceObject.cn)('min-w-0 truncate font-mono text-xs', colorClass),
|
|
63
|
-
children: display
|
|
64
|
-
});
|
|
65
|
-
const editTitle = _({
|
|
66
|
-
id: 'canvas.json_value_panel.edit_value_of',
|
|
67
|
-
message: 'Edit value of {key}',
|
|
68
|
-
values: {
|
|
69
|
-
key: node.key
|
|
70
|
-
}
|
|
71
|
-
});
|
|
72
|
-
if (isBoolean && !enumOptions?.length) return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("button", {
|
|
73
|
-
type: "button",
|
|
74
|
-
onClick: ()=>onEdit(node, true !== node.value),
|
|
75
|
-
"aria-label": editTitle,
|
|
76
|
-
title: _({
|
|
77
|
-
id: 'canvas.json_value_panel.toggle_hint',
|
|
78
|
-
message: 'Click to toggle'
|
|
79
|
-
}),
|
|
80
|
-
className: (0, apollo_wind_namespaceObject.cn)(VALUE_CELL_CLASS, 'cursor-pointer', colorClass),
|
|
81
|
-
children: display
|
|
82
|
-
});
|
|
83
|
-
if (enumOptions?.length) return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(apollo_wind_namespaceObject.DropdownMenu, {
|
|
84
|
-
children: [
|
|
85
|
-
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(apollo_wind_namespaceObject.DropdownMenuTrigger, {
|
|
86
|
-
asChild: true,
|
|
87
|
-
children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("button", {
|
|
88
|
-
type: "button",
|
|
89
|
-
"aria-label": editTitle,
|
|
90
|
-
title: _({
|
|
91
|
-
id: 'canvas.json_value_panel.edit_hint',
|
|
92
|
-
message: 'Click to edit'
|
|
93
|
-
}),
|
|
94
|
-
className: (0, apollo_wind_namespaceObject.cn)(VALUE_CELL_CLASS, 'cursor-pointer', colorClass),
|
|
95
|
-
children: display
|
|
96
|
-
})
|
|
97
|
-
}),
|
|
98
|
-
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(apollo_wind_namespaceObject.DropdownMenuContent, {
|
|
99
|
-
align: "start",
|
|
100
|
-
className: "min-w-32",
|
|
101
|
-
children: enumOptions.map((option)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(apollo_wind_namespaceObject.DropdownMenuItem, {
|
|
102
|
-
onClick: ()=>onEdit(node, option),
|
|
103
|
-
className: (0, apollo_wind_namespaceObject.cn)('font-mono text-xs', option === node.value ? 'text-foreground' : 'text-foreground-muted'),
|
|
104
|
-
children: (0, external_buildJsonTree_cjs_namespaceObject.formatLeafValue)((0, external_buildJsonTree_cjs_namespaceObject.inferValueType)(option), option)
|
|
105
|
-
}, String(option)))
|
|
106
|
-
})
|
|
107
|
-
]
|
|
108
|
-
});
|
|
109
|
-
return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("button", {
|
|
110
|
-
type: "button",
|
|
111
|
-
onClick: ()=>onStartEdit(node),
|
|
112
|
-
"aria-label": editTitle,
|
|
113
|
-
title: missing ? _({
|
|
114
|
-
id: 'canvas.json_value_panel.unset_edit_hint',
|
|
115
|
-
message: 'Click to set a value'
|
|
116
|
-
}) : _({
|
|
117
|
-
id: 'canvas.json_value_panel.edit_hint',
|
|
118
|
-
message: 'Click to edit'
|
|
119
|
-
}),
|
|
120
|
-
className: (0, apollo_wind_namespaceObject.cn)(VALUE_CELL_CLASS, 'cursor-text', colorClass),
|
|
121
|
-
children: display
|
|
122
|
-
});
|
|
123
|
-
}
|
|
124
|
-
exports.ScalarValueCell = __webpack_exports__.ScalarValueCell;
|
|
125
|
-
exports.valueColorClass = __webpack_exports__.valueColorClass;
|
|
126
|
-
for(var __rspack_i in __webpack_exports__)if (-1 === [
|
|
127
|
-
"ScalarValueCell",
|
|
128
|
-
"valueColorClass"
|
|
129
|
-
].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
|
|
130
|
-
Object.defineProperty(exports, '__esModule', {
|
|
131
|
-
value: true
|
|
132
|
-
});
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import type { JsonTreeNode, JsonTreeNodeType, JsonValue } from './JsonTree.types';
|
|
2
|
-
export declare function valueColorClass(type: JsonTreeNodeType, value: JsonValue | undefined): string;
|
|
3
|
-
export interface ScalarValueCellProps {
|
|
4
|
-
node: JsonTreeNode;
|
|
5
|
-
readOnly: boolean;
|
|
6
|
-
editing: boolean;
|
|
7
|
-
onStartEdit: (node: JsonTreeNode) => void;
|
|
8
|
-
onStopEdit: () => void;
|
|
9
|
-
onEdit?: (node: JsonTreeNode, value: JsonValue) => void;
|
|
10
|
-
}
|
|
11
|
-
export declare function ScalarValueCell({ node, readOnly, editing, onStartEdit, onStopEdit, onEdit, }: ScalarValueCellProps): import("react/jsx-runtime").JSX.Element;
|
|
12
|
-
//# sourceMappingURL=ScalarValueCell.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ScalarValueCell.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/JsonTree/ScalarValueCell.tsx"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,YAAY,EAAE,gBAAgB,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAGlF,wBAAgB,eAAe,CAAC,IAAI,EAAE,gBAAgB,EAAE,KAAK,EAAE,SAAS,GAAG,SAAS,GAAG,MAAM,CAM5F;AASD,MAAM,WAAW,oBAAoB;IACnC,IAAI,EAAE,YAAY,CAAC;IACnB,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,OAAO,CAAC;IACjB,WAAW,EAAE,CAAC,IAAI,EAAE,YAAY,KAAK,IAAI,CAAC;IAC1C,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,YAAY,EAAE,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;CACzD;AAQD,wBAAgB,eAAe,CAAC,EAC9B,IAAI,EACJ,QAAQ,EACR,OAAO,EACP,WAAW,EACX,UAAU,EACV,MAAM,GACP,EAAE,oBAAoB,2CAkHtB"}
|
|
@@ -1,95 +0,0 @@
|
|
|
1
|
-
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger, cn } from "@uipath/apollo-wind";
|
|
3
|
-
import { useSafeLingui } from "../../../i18n/index.js";
|
|
4
|
-
import { formatLeafValue, inferValueType } from "./buildJsonTree.js";
|
|
5
|
-
import { JsonLeafValueEditor } from "./JsonLeafValueEditor.js";
|
|
6
|
-
function valueColorClass(type, value) {
|
|
7
|
-
if (null == value) return 'text-foreground-subtle';
|
|
8
|
-
if ('string' === type) return 'text-success';
|
|
9
|
-
if ('number' === type) return 'text-info';
|
|
10
|
-
if ('boolean' === type) return value ? 'text-success' : 'text-error';
|
|
11
|
-
return 'text-foreground';
|
|
12
|
-
}
|
|
13
|
-
const VALUE_CELL_CLASS = 'min-w-0 truncate rounded font-mono text-xs transition hover:bg-surface-raised';
|
|
14
|
-
function ScalarValueCell({ node, readOnly, editing, onStartEdit, onStopEdit, onEdit }) {
|
|
15
|
-
const { _ } = useSafeLingui();
|
|
16
|
-
const missing = void 0 === node.value;
|
|
17
|
-
const display = missing ? _({
|
|
18
|
-
id: 'canvas.json_value_panel.unset_value',
|
|
19
|
-
message: 'unset'
|
|
20
|
-
}) : formatLeafValue(node.type, node.value);
|
|
21
|
-
const colorClass = missing ? 'italic text-foreground-subtle' : valueColorClass(node.type, node.value);
|
|
22
|
-
const enumOptions = node.schema?.enum;
|
|
23
|
-
const isBoolean = 'boolean' === node.type;
|
|
24
|
-
if (editing) return /*#__PURE__*/ jsx(JsonLeafValueEditor, {
|
|
25
|
-
node: node,
|
|
26
|
-
onCommit: (value)=>{
|
|
27
|
-
onStopEdit();
|
|
28
|
-
onEdit?.(node, value);
|
|
29
|
-
},
|
|
30
|
-
onCancel: onStopEdit
|
|
31
|
-
});
|
|
32
|
-
if (readOnly || !onEdit) return /*#__PURE__*/ jsx("span", {
|
|
33
|
-
className: cn('min-w-0 truncate font-mono text-xs', colorClass),
|
|
34
|
-
children: display
|
|
35
|
-
});
|
|
36
|
-
const editTitle = _({
|
|
37
|
-
id: 'canvas.json_value_panel.edit_value_of',
|
|
38
|
-
message: 'Edit value of {key}',
|
|
39
|
-
values: {
|
|
40
|
-
key: node.key
|
|
41
|
-
}
|
|
42
|
-
});
|
|
43
|
-
if (isBoolean && !enumOptions?.length) return /*#__PURE__*/ jsx("button", {
|
|
44
|
-
type: "button",
|
|
45
|
-
onClick: ()=>onEdit(node, true !== node.value),
|
|
46
|
-
"aria-label": editTitle,
|
|
47
|
-
title: _({
|
|
48
|
-
id: 'canvas.json_value_panel.toggle_hint',
|
|
49
|
-
message: 'Click to toggle'
|
|
50
|
-
}),
|
|
51
|
-
className: cn(VALUE_CELL_CLASS, 'cursor-pointer', colorClass),
|
|
52
|
-
children: display
|
|
53
|
-
});
|
|
54
|
-
if (enumOptions?.length) return /*#__PURE__*/ jsxs(DropdownMenu, {
|
|
55
|
-
children: [
|
|
56
|
-
/*#__PURE__*/ jsx(DropdownMenuTrigger, {
|
|
57
|
-
asChild: true,
|
|
58
|
-
children: /*#__PURE__*/ jsx("button", {
|
|
59
|
-
type: "button",
|
|
60
|
-
"aria-label": editTitle,
|
|
61
|
-
title: _({
|
|
62
|
-
id: 'canvas.json_value_panel.edit_hint',
|
|
63
|
-
message: 'Click to edit'
|
|
64
|
-
}),
|
|
65
|
-
className: cn(VALUE_CELL_CLASS, 'cursor-pointer', colorClass),
|
|
66
|
-
children: display
|
|
67
|
-
})
|
|
68
|
-
}),
|
|
69
|
-
/*#__PURE__*/ jsx(DropdownMenuContent, {
|
|
70
|
-
align: "start",
|
|
71
|
-
className: "min-w-32",
|
|
72
|
-
children: enumOptions.map((option)=>/*#__PURE__*/ jsx(DropdownMenuItem, {
|
|
73
|
-
onClick: ()=>onEdit(node, option),
|
|
74
|
-
className: cn('font-mono text-xs', option === node.value ? 'text-foreground' : 'text-foreground-muted'),
|
|
75
|
-
children: formatLeafValue(inferValueType(option), option)
|
|
76
|
-
}, String(option)))
|
|
77
|
-
})
|
|
78
|
-
]
|
|
79
|
-
});
|
|
80
|
-
return /*#__PURE__*/ jsx("button", {
|
|
81
|
-
type: "button",
|
|
82
|
-
onClick: ()=>onStartEdit(node),
|
|
83
|
-
"aria-label": editTitle,
|
|
84
|
-
title: missing ? _({
|
|
85
|
-
id: 'canvas.json_value_panel.unset_edit_hint',
|
|
86
|
-
message: 'Click to set a value'
|
|
87
|
-
}) : _({
|
|
88
|
-
id: 'canvas.json_value_panel.edit_hint',
|
|
89
|
-
message: 'Click to edit'
|
|
90
|
-
}),
|
|
91
|
-
className: cn(VALUE_CELL_CLASS, 'cursor-text', colorClass),
|
|
92
|
-
children: display
|
|
93
|
-
});
|
|
94
|
-
}
|
|
95
|
-
export { ScalarValueCell, valueColorClass };
|
|
@@ -1,321 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __webpack_require__ = {};
|
|
3
|
-
(()=>{
|
|
4
|
-
__webpack_require__.d = (exports1, definition)=>{
|
|
5
|
-
for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
|
|
6
|
-
enumerable: true,
|
|
7
|
-
get: definition[key]
|
|
8
|
-
});
|
|
9
|
-
};
|
|
10
|
-
})();
|
|
11
|
-
(()=>{
|
|
12
|
-
__webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
|
|
13
|
-
})();
|
|
14
|
-
(()=>{
|
|
15
|
-
__webpack_require__.r = (exports1)=>{
|
|
16
|
-
if ("u" > typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
|
|
17
|
-
value: 'Module'
|
|
18
|
-
});
|
|
19
|
-
Object.defineProperty(exports1, '__esModule', {
|
|
20
|
-
value: true
|
|
21
|
-
});
|
|
22
|
-
};
|
|
23
|
-
})();
|
|
24
|
-
var __webpack_exports__ = {};
|
|
25
|
-
__webpack_require__.r(__webpack_exports__);
|
|
26
|
-
__webpack_require__.d(__webpack_exports__, {
|
|
27
|
-
appendPathSegment: ()=>appendPathSegment,
|
|
28
|
-
buildJsonTree: ()=>buildJsonTree,
|
|
29
|
-
collectContainerPaths: ()=>collectContainerPaths,
|
|
30
|
-
flattenJsonTree: ()=>flattenJsonTree,
|
|
31
|
-
formatLeafValue: ()=>formatLeafValue,
|
|
32
|
-
getValueAtPath: ()=>getValueAtPath,
|
|
33
|
-
inferValueType: ()=>inferValueType,
|
|
34
|
-
isArrayItemTemplateRoot: ()=>isArrayItemTemplateRoot,
|
|
35
|
-
isJsonObject: ()=>isJsonObject,
|
|
36
|
-
removeValueAtPath: ()=>removeValueAtPath,
|
|
37
|
-
schemaDisplayType: ()=>schemaDisplayType,
|
|
38
|
-
setValueAtPath: ()=>setValueAtPath
|
|
39
|
-
});
|
|
40
|
-
const IDENTIFIER_RE = /^[A-Za-z_$][A-Za-z0-9_$]*$/;
|
|
41
|
-
function isJsonObject(value) {
|
|
42
|
-
return 'object' == typeof value && null !== value && !Array.isArray(value);
|
|
43
|
-
}
|
|
44
|
-
function appendPathSegment(path, segment) {
|
|
45
|
-
if ('number' == typeof segment) return `${path}[${segment}]`;
|
|
46
|
-
if (IDENTIFIER_RE.test(segment)) return path ? `${path}.${segment}` : segment;
|
|
47
|
-
return `${path}[${JSON.stringify(segment)}]`;
|
|
48
|
-
}
|
|
49
|
-
function inferValueType(value) {
|
|
50
|
-
if (null === value) return 'null';
|
|
51
|
-
if (Array.isArray(value)) return 'array';
|
|
52
|
-
switch(typeof value){
|
|
53
|
-
case 'string':
|
|
54
|
-
return 'string';
|
|
55
|
-
case 'number':
|
|
56
|
-
return 'number';
|
|
57
|
-
case 'boolean':
|
|
58
|
-
return 'boolean';
|
|
59
|
-
default:
|
|
60
|
-
return 'object';
|
|
61
|
-
}
|
|
62
|
-
}
|
|
63
|
-
function declaredTypes(schema) {
|
|
64
|
-
if (!schema?.type) return;
|
|
65
|
-
return Array.isArray(schema.type) ? schema.type : [
|
|
66
|
-
schema.type
|
|
67
|
-
];
|
|
68
|
-
}
|
|
69
|
-
function schemaDisplayType(schema) {
|
|
70
|
-
const types = declaredTypes(schema);
|
|
71
|
-
const first = types?.find((t)=>'null' !== t) ?? types?.[0];
|
|
72
|
-
if (first) return 'integer' === first ? 'number' : first;
|
|
73
|
-
if (schema?.properties) return 'object';
|
|
74
|
-
if (schema?.items) return 'array';
|
|
75
|
-
const enumSample = schema?.enum?.find((v)=>null !== v);
|
|
76
|
-
if (void 0 !== enumSample) return inferValueType(enumSample);
|
|
77
|
-
return 'null';
|
|
78
|
-
}
|
|
79
|
-
function buildNode(input) {
|
|
80
|
-
const type = input.hasValue ? inferValueType(input.value) : schemaDisplayType(input.schema);
|
|
81
|
-
const node = {
|
|
82
|
-
key: input.key,
|
|
83
|
-
path: input.path,
|
|
84
|
-
segments: input.segments,
|
|
85
|
-
type,
|
|
86
|
-
required: input.required,
|
|
87
|
-
schema: input.schema
|
|
88
|
-
};
|
|
89
|
-
if (input.hasValue) node.value = input.value;
|
|
90
|
-
if (input.isTemplate) node.isArrayItemTemplate = true;
|
|
91
|
-
if ('object' === type) node.children = buildObjectChildren(input.hasValue ? input.value : void 0, input.schema, input.segments, input.path, input.isTemplate);
|
|
92
|
-
else if ('array' === type) node.children = buildArrayChildren(input.schema, input.value, input.hasValue, input.segments, input.path, input.isTemplate);
|
|
93
|
-
return node;
|
|
94
|
-
}
|
|
95
|
-
function buildArrayChildren(schema, value, hasValue, segments, path, isTemplate) {
|
|
96
|
-
const items = hasValue && Array.isArray(value) ? value : [];
|
|
97
|
-
if (items.length > 0) return items.map((item, index)=>buildNode({
|
|
98
|
-
key: String(index),
|
|
99
|
-
segments: [
|
|
100
|
-
...segments,
|
|
101
|
-
index
|
|
102
|
-
],
|
|
103
|
-
path: appendPathSegment(path, index),
|
|
104
|
-
schema: schema?.items,
|
|
105
|
-
value: item,
|
|
106
|
-
hasValue: true,
|
|
107
|
-
isTemplate
|
|
108
|
-
}));
|
|
109
|
-
if (schema?.items) return [
|
|
110
|
-
buildNode({
|
|
111
|
-
key: '0',
|
|
112
|
-
segments: [
|
|
113
|
-
...segments,
|
|
114
|
-
0
|
|
115
|
-
],
|
|
116
|
-
path: appendPathSegment(path, 0),
|
|
117
|
-
schema: schema.items,
|
|
118
|
-
hasValue: false,
|
|
119
|
-
isTemplate: true
|
|
120
|
-
})
|
|
121
|
-
];
|
|
122
|
-
return [];
|
|
123
|
-
}
|
|
124
|
-
function buildObjectChildren(value, schema, segments, path, isTemplate) {
|
|
125
|
-
const properties = schema?.properties ?? {};
|
|
126
|
-
const required = new Set(schema?.required ?? []);
|
|
127
|
-
const additional = 'object' == typeof schema?.additionalProperties ? schema.additionalProperties : void 0;
|
|
128
|
-
const children = [];
|
|
129
|
-
for (const [key, childSchema] of Object.entries(properties)){
|
|
130
|
-
const hasValue = void 0 !== value && Object.hasOwn(value, key);
|
|
131
|
-
children.push(buildNode({
|
|
132
|
-
key,
|
|
133
|
-
segments: [
|
|
134
|
-
...segments,
|
|
135
|
-
key
|
|
136
|
-
],
|
|
137
|
-
path: appendPathSegment(path, key),
|
|
138
|
-
schema: childSchema,
|
|
139
|
-
value: hasValue ? value?.[key] : void 0,
|
|
140
|
-
hasValue,
|
|
141
|
-
required: required.has(key),
|
|
142
|
-
isTemplate
|
|
143
|
-
}));
|
|
144
|
-
}
|
|
145
|
-
if (void 0 !== value) {
|
|
146
|
-
for (const [key, childValue] of Object.entries(value))if (!Object.hasOwn(properties, key)) children.push(buildNode({
|
|
147
|
-
key,
|
|
148
|
-
segments: [
|
|
149
|
-
...segments,
|
|
150
|
-
key
|
|
151
|
-
],
|
|
152
|
-
path: appendPathSegment(path, key),
|
|
153
|
-
schema: additional,
|
|
154
|
-
value: childValue,
|
|
155
|
-
hasValue: true
|
|
156
|
-
}));
|
|
157
|
-
}
|
|
158
|
-
return children;
|
|
159
|
-
}
|
|
160
|
-
function buildJsonTree(options) {
|
|
161
|
-
const { schema, value, basePath = '' } = options;
|
|
162
|
-
const rootIsArray = void 0 !== value ? Array.isArray(value) : !!schema && 'array' === schemaDisplayType(schema);
|
|
163
|
-
if (rootIsArray) return buildArrayChildren(schema, value, void 0 !== value, [], basePath);
|
|
164
|
-
return buildObjectChildren(isJsonObject(value) ? value : void 0, schema, [], basePath);
|
|
165
|
-
}
|
|
166
|
-
function isArrayItemTemplateRoot(node) {
|
|
167
|
-
return !!node.isArrayItemTemplate && 'number' == typeof node.segments[node.segments.length - 1];
|
|
168
|
-
}
|
|
169
|
-
function nodeSelfMatchesQuery(node, query, displayTexts) {
|
|
170
|
-
if (node.key.toLowerCase().includes(query)) return true;
|
|
171
|
-
const display = displayTexts?.(node);
|
|
172
|
-
if (display?.label?.toLowerCase().includes(query)) return true;
|
|
173
|
-
if (display?.sublabel?.toLowerCase().includes(query)) return true;
|
|
174
|
-
return void 0 !== node.value && null !== node.value && 'object' != typeof node.value && String(node.value).toLowerCase().includes(query);
|
|
175
|
-
}
|
|
176
|
-
function nodeMatchesQuery(node, query, displayTexts) {
|
|
177
|
-
if (nodeSelfMatchesQuery(node, query, displayTexts)) return true;
|
|
178
|
-
return node.children?.some((c)=>nodeMatchesQuery(c, query, displayTexts)) ?? false;
|
|
179
|
-
}
|
|
180
|
-
function nodeOrDescendantMatches(node, predicate) {
|
|
181
|
-
if (predicate(node)) return true;
|
|
182
|
-
return node.children?.some((c)=>nodeOrDescendantMatches(c, predicate)) ?? false;
|
|
183
|
-
}
|
|
184
|
-
function flattenJsonTree(nodes, options = {}, depth = 0) {
|
|
185
|
-
const { collapsed = {}, filterPredicate } = options;
|
|
186
|
-
const query = options.query?.trim().toLowerCase() ?? '';
|
|
187
|
-
const rows = [];
|
|
188
|
-
for (const node of nodes){
|
|
189
|
-
const selfQueryMatch = !!query && nodeSelfMatchesQuery(node, query, options.displayTexts);
|
|
190
|
-
if (query && !selfQueryMatch && !(node.children?.some((c)=>nodeMatchesQuery(c, query, options.displayTexts)) ?? false)) continue;
|
|
191
|
-
const selfPredicateMatch = !!filterPredicate && filterPredicate(node);
|
|
192
|
-
if (!filterPredicate || selfPredicateMatch || (node.children?.some((c)=>nodeOrDescendantMatches(c, filterPredicate)) ?? false)) {
|
|
193
|
-
rows.push({
|
|
194
|
-
node,
|
|
195
|
-
depth
|
|
196
|
-
});
|
|
197
|
-
if (node.children && !collapsed[node.path]) {
|
|
198
|
-
const childOptions = selfQueryMatch || selfPredicateMatch ? {
|
|
199
|
-
...options,
|
|
200
|
-
query: selfQueryMatch ? '' : options.query,
|
|
201
|
-
filterPredicate: selfPredicateMatch ? void 0 : filterPredicate
|
|
202
|
-
} : options;
|
|
203
|
-
for (const row of flattenJsonTree(node.children, childOptions, depth + 1))rows.push(row);
|
|
204
|
-
}
|
|
205
|
-
}
|
|
206
|
-
}
|
|
207
|
-
return rows;
|
|
208
|
-
}
|
|
209
|
-
function collectContainerPaths(nodes, depth = 0) {
|
|
210
|
-
const paths = [];
|
|
211
|
-
for (const node of nodes)if (node.children) {
|
|
212
|
-
paths.push({
|
|
213
|
-
path: node.path,
|
|
214
|
-
depth
|
|
215
|
-
});
|
|
216
|
-
for (const child of collectContainerPaths(node.children, depth + 1))paths.push(child);
|
|
217
|
-
}
|
|
218
|
-
return paths;
|
|
219
|
-
}
|
|
220
|
-
function getValueAtPath(root, segments) {
|
|
221
|
-
let current = root;
|
|
222
|
-
for (const segment of segments)if ('number' == typeof segment) {
|
|
223
|
-
if (!Array.isArray(current)) return;
|
|
224
|
-
current = current[segment];
|
|
225
|
-
} else {
|
|
226
|
-
if (!isJsonObject(current) || !Object.hasOwn(current, segment)) return;
|
|
227
|
-
current = current[segment];
|
|
228
|
-
}
|
|
229
|
-
return current;
|
|
230
|
-
}
|
|
231
|
-
function setValueAtPath(root, segments, value) {
|
|
232
|
-
const [head, ...rest] = segments;
|
|
233
|
-
if (void 0 === head) return value;
|
|
234
|
-
if ('number' == typeof head) {
|
|
235
|
-
const array = Array.isArray(root) ? [
|
|
236
|
-
...root
|
|
237
|
-
] : [];
|
|
238
|
-
array[head] = setValueAtPath(array[head], rest, value);
|
|
239
|
-
return array;
|
|
240
|
-
}
|
|
241
|
-
const object = isJsonObject(root) ? {
|
|
242
|
-
...root
|
|
243
|
-
} : {};
|
|
244
|
-
const previous = Object.hasOwn(object, head) ? object[head] : void 0;
|
|
245
|
-
Object.defineProperty(object, head, {
|
|
246
|
-
value: setValueAtPath(previous, rest, value),
|
|
247
|
-
enumerable: true,
|
|
248
|
-
configurable: true,
|
|
249
|
-
writable: true
|
|
250
|
-
});
|
|
251
|
-
return object;
|
|
252
|
-
}
|
|
253
|
-
function removeValueAtPath(root, segments) {
|
|
254
|
-
const [head, ...rest] = segments;
|
|
255
|
-
if (void 0 === head) return;
|
|
256
|
-
if ('number' == typeof head) {
|
|
257
|
-
if (!Array.isArray(root) || head >= root.length) return root;
|
|
258
|
-
if (0 === rest.length) {
|
|
259
|
-
const array = [
|
|
260
|
-
...root
|
|
261
|
-
];
|
|
262
|
-
array.splice(head, 1);
|
|
263
|
-
return array;
|
|
264
|
-
}
|
|
265
|
-
const child = removeValueAtPath(root[head], rest);
|
|
266
|
-
if (child === root[head]) return root;
|
|
267
|
-
const array = [
|
|
268
|
-
...root
|
|
269
|
-
];
|
|
270
|
-
array[head] = child;
|
|
271
|
-
return array;
|
|
272
|
-
}
|
|
273
|
-
if (!isJsonObject(root) || !Object.hasOwn(root, head)) return root;
|
|
274
|
-
if (0 === rest.length) {
|
|
275
|
-
const object = {
|
|
276
|
-
...root
|
|
277
|
-
};
|
|
278
|
-
delete object[head];
|
|
279
|
-
return object;
|
|
280
|
-
}
|
|
281
|
-
const child = removeValueAtPath(root[head], rest);
|
|
282
|
-
if (child === root[head]) return root;
|
|
283
|
-
return {
|
|
284
|
-
...root,
|
|
285
|
-
[head]: child
|
|
286
|
-
};
|
|
287
|
-
}
|
|
288
|
-
function formatLeafValue(type, value, options) {
|
|
289
|
-
if (null == value) return 'null';
|
|
290
|
-
if ('string' === type) return options?.preserveStringWhitespace ? `"${value}"` : JSON.stringify(value);
|
|
291
|
-
return String(value);
|
|
292
|
-
}
|
|
293
|
-
exports.appendPathSegment = __webpack_exports__.appendPathSegment;
|
|
294
|
-
exports.buildJsonTree = __webpack_exports__.buildJsonTree;
|
|
295
|
-
exports.collectContainerPaths = __webpack_exports__.collectContainerPaths;
|
|
296
|
-
exports.flattenJsonTree = __webpack_exports__.flattenJsonTree;
|
|
297
|
-
exports.formatLeafValue = __webpack_exports__.formatLeafValue;
|
|
298
|
-
exports.getValueAtPath = __webpack_exports__.getValueAtPath;
|
|
299
|
-
exports.inferValueType = __webpack_exports__.inferValueType;
|
|
300
|
-
exports.isArrayItemTemplateRoot = __webpack_exports__.isArrayItemTemplateRoot;
|
|
301
|
-
exports.isJsonObject = __webpack_exports__.isJsonObject;
|
|
302
|
-
exports.removeValueAtPath = __webpack_exports__.removeValueAtPath;
|
|
303
|
-
exports.schemaDisplayType = __webpack_exports__.schemaDisplayType;
|
|
304
|
-
exports.setValueAtPath = __webpack_exports__.setValueAtPath;
|
|
305
|
-
for(var __rspack_i in __webpack_exports__)if (-1 === [
|
|
306
|
-
"appendPathSegment",
|
|
307
|
-
"buildJsonTree",
|
|
308
|
-
"collectContainerPaths",
|
|
309
|
-
"flattenJsonTree",
|
|
310
|
-
"formatLeafValue",
|
|
311
|
-
"getValueAtPath",
|
|
312
|
-
"inferValueType",
|
|
313
|
-
"isArrayItemTemplateRoot",
|
|
314
|
-
"isJsonObject",
|
|
315
|
-
"removeValueAtPath",
|
|
316
|
-
"schemaDisplayType",
|
|
317
|
-
"setValueAtPath"
|
|
318
|
-
].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
|
|
319
|
-
Object.defineProperty(exports, '__esModule', {
|
|
320
|
-
value: true
|
|
321
|
-
});
|