@uipath/apollo-react 4.44.1 → 4.45.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/NodePropertiesPanel/NodePropertiesPanel.cjs +14 -13
- package/dist/canvas/components/NodePropertiesPanel/NodePropertiesPanel.d.ts.map +1 -1
- package/dist/canvas/components/NodePropertiesPanel/NodePropertiesPanel.js +12 -11
- package/dist/canvas/components/NodePropertiesPanel/fields/CheckboxField.cjs +14 -16
- package/dist/canvas/components/NodePropertiesPanel/fields/CheckboxField.d.ts.map +1 -1
- package/dist/canvas/components/NodePropertiesPanel/fields/CheckboxField.js +14 -16
- package/dist/canvas/components/NodePropertiesPanel/fields/NumberField.cjs +18 -16
- package/dist/canvas/components/NodePropertiesPanel/fields/NumberField.d.ts.map +1 -1
- package/dist/canvas/components/NodePropertiesPanel/fields/NumberField.js +18 -16
- package/dist/canvas/components/NodePropertiesPanel/fields/SelectField.cjs +40 -22
- package/dist/canvas/components/NodePropertiesPanel/fields/SelectField.d.ts.map +1 -1
- package/dist/canvas/components/NodePropertiesPanel/fields/SelectField.js +40 -22
- package/dist/canvas/components/NodePropertiesPanel/fields/TextField.cjs +24 -20
- package/dist/canvas/components/NodePropertiesPanel/fields/TextField.d.ts.map +1 -1
- package/dist/canvas/components/NodePropertiesPanel/fields/TextField.js +24 -20
- package/dist/canvas/components/NodePropertiesPanel/index.cjs +12 -55
- package/dist/canvas/components/NodePropertiesPanel/index.d.ts +0 -1
- package/dist/canvas/components/NodePropertiesPanel/index.d.ts.map +1 -1
- package/dist/canvas/components/NodePropertiesPanel/index.js +0 -1
- package/dist/canvas/components/index.cjs +2 -2
- package/dist/canvas/controls/NodePropertyTrigger/NodePropertyTrigger.cjs +395 -0
- package/dist/canvas/controls/NodePropertyTrigger/NodePropertyTrigger.d.ts +57 -0
- package/dist/canvas/controls/NodePropertyTrigger/NodePropertyTrigger.d.ts.map +1 -0
- package/dist/canvas/controls/NodePropertyTrigger/NodePropertyTrigger.js +349 -0
- package/dist/canvas/controls/NodePropertyTrigger/index.cjs +48 -0
- package/dist/canvas/controls/NodePropertyTrigger/index.d.ts +3 -0
- package/dist/canvas/controls/NodePropertyTrigger/index.d.ts.map +1 -0
- package/dist/canvas/controls/NodePropertyTrigger/index.js +2 -0
- package/dist/canvas/controls/index.cjs +18 -2
- package/dist/canvas/controls/index.d.ts +2 -0
- package/dist/canvas/controls/index.d.ts.map +1 -1
- package/dist/canvas/controls/index.js +2 -1
- package/dist/canvas/locales/en.cjs +1 -1
- package/dist/canvas/locales/en.d.ts.map +1 -1
- package/dist/canvas/locales/en.js +1 -1
- package/dist/canvas/styles/tailwind.canvas.css +1 -1
- package/package.json +1 -1
- package/dist/canvas/components/NodePropertiesPanel/NodePropertiesPanel.styles.cjs +0 -284
- package/dist/canvas/components/NodePropertiesPanel/NodePropertiesPanel.styles.d.ts +0 -69
- package/dist/canvas/components/NodePropertiesPanel/NodePropertiesPanel.styles.d.ts.map +0 -1
- package/dist/canvas/components/NodePropertiesPanel/NodePropertiesPanel.styles.js +0 -195
|
@@ -27,15 +27,13 @@ __webpack_require__.d(__webpack_exports__, {
|
|
|
27
27
|
NodePropertiesPanel: ()=>NodePropertiesPanel_NodePropertiesPanel
|
|
28
28
|
});
|
|
29
29
|
const jsx_runtime_namespaceObject = require("react/jsx-runtime");
|
|
30
|
-
const index_cjs_namespaceObject = require("../../layouts/index.cjs");
|
|
31
30
|
const react_cjs_namespaceObject = require("../../xyflow/react.cjs");
|
|
32
31
|
const apollo_wind_namespaceObject = require("@uipath/apollo-wind");
|
|
33
32
|
const external_react_namespaceObject = require("react");
|
|
34
33
|
const icon_registry_cjs_namespaceObject = require("../../utils/icon-registry.cjs");
|
|
35
|
-
const
|
|
34
|
+
const index_cjs_namespaceObject = require("../FloatingCanvasPanel/index.cjs");
|
|
36
35
|
const external_fields_index_cjs_namespaceObject = require("./fields/index.cjs");
|
|
37
36
|
const external_hooks_index_cjs_namespaceObject = require("./hooks/index.cjs");
|
|
38
|
-
const external_NodePropertiesPanel_styles_cjs_namespaceObject = require("./NodePropertiesPanel.styles.cjs");
|
|
39
37
|
const PINNED_PANEL_WIDTH = 320;
|
|
40
38
|
function renderField(field, value, onChange, error) {
|
|
41
39
|
switch(field.type){
|
|
@@ -117,14 +115,16 @@ const NodePropertiesPanel_NodePropertiesPanel = /*#__PURE__*/ (0, external_react
|
|
|
117
115
|
const internalNode = selectedNode ? getInternalNode(selectedNode.id) : null;
|
|
118
116
|
const renderSection = (section)=>{
|
|
119
117
|
if (!selectedNode) return null;
|
|
120
|
-
return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(
|
|
118
|
+
return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
|
|
119
|
+
className: "px-4 py-4 border-b border-(--canvas-border-de-emp) last:border-b-0",
|
|
121
120
|
children: [
|
|
122
|
-
section.title && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(
|
|
121
|
+
section.title && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
|
|
122
|
+
className: "font-medium text-[14px] text-(--canvas-foreground) mb-2",
|
|
123
123
|
children: section.title
|
|
124
124
|
}),
|
|
125
|
-
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(
|
|
126
|
-
|
|
127
|
-
children: section.fields.map((field)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(
|
|
125
|
+
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
|
|
126
|
+
className: "flex flex-col gap-4",
|
|
127
|
+
children: section.fields.map((field)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
|
|
128
128
|
children: renderField(field, selectedNode.data[field.key], (value)=>handleFieldChange(field.key, value), errors[field.key])
|
|
129
129
|
}, field.key))
|
|
130
130
|
})
|
|
@@ -143,7 +143,7 @@ const NodePropertiesPanel_NodePropertiesPanel = /*#__PURE__*/ (0, external_react
|
|
|
143
143
|
size: 16
|
|
144
144
|
})
|
|
145
145
|
});
|
|
146
|
-
return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(
|
|
146
|
+
return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(index_cjs_namespaceObject.FloatingCanvasPanel, {
|
|
147
147
|
open: !!selectedNode,
|
|
148
148
|
nodeId: isPinned ? void 0 : selectedNode.id,
|
|
149
149
|
anchorRect: isPinned ? {
|
|
@@ -159,10 +159,11 @@ const NodePropertiesPanel_NodePropertiesPanel = /*#__PURE__*/ (0, external_react
|
|
|
159
159
|
onClose: handleClose,
|
|
160
160
|
scrollKey: selectedNode.id,
|
|
161
161
|
isPinned: isPinned,
|
|
162
|
-
children: schema.sections ? schema.sections.map((section)=>renderSection(section)) : /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
162
|
+
children: schema.sections ? schema.sections.map((section)=>renderSection(section)) : /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
|
|
163
|
+
className: "px-4 py-4",
|
|
164
|
+
children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
|
|
165
|
+
className: "flex flex-col gap-4",
|
|
166
|
+
children: schema.fields?.map((field)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
|
|
166
167
|
children: selectedNode && renderField(field, selectedNode.data[field.key], (value)=>handleFieldChange(field.key, value), errors[field.key])
|
|
167
168
|
}, field.key))
|
|
168
169
|
})
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NodePropertiesPanel.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/NodePropertiesPanel/NodePropertiesPanel.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"NodePropertiesPanel.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/NodePropertiesPanel/NodePropertiesPanel.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAGV,wBAAwB,EACzB,MAAM,6BAA6B,CAAC;AAoCrC,eAAO,MAAM,mBAAmB,gEAqI9B,CAAC"}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { Column } from "../../layouts/index.js";
|
|
3
2
|
import { useReactFlow } from "../../xyflow/react.js";
|
|
4
3
|
import { Button } from "@uipath/apollo-wind";
|
|
5
4
|
import { memo, useCallback, useEffect, useState } from "react";
|
|
@@ -7,7 +6,6 @@ import { CanvasIcon } from "../../utils/icon-registry.js";
|
|
|
7
6
|
import { FloatingCanvasPanel } from "../FloatingCanvasPanel/index.js";
|
|
8
7
|
import { CheckboxField, NumberField, SelectField, TextField } from "./fields/index.js";
|
|
9
8
|
import { useNodeConfiguration, useNodeSelection } from "./hooks/index.js";
|
|
10
|
-
import { ConfigSection, FieldContainer, SectionTitle } from "./NodePropertiesPanel.styles.js";
|
|
11
9
|
const PINNED_PANEL_WIDTH = 320;
|
|
12
10
|
function renderField(field, value, onChange, error) {
|
|
13
11
|
switch(field.type){
|
|
@@ -89,14 +87,16 @@ const NodePropertiesPanel_NodePropertiesPanel = /*#__PURE__*/ memo(function({ no
|
|
|
89
87
|
const internalNode = selectedNode ? getInternalNode(selectedNode.id) : null;
|
|
90
88
|
const renderSection = (section)=>{
|
|
91
89
|
if (!selectedNode) return null;
|
|
92
|
-
return /*#__PURE__*/ jsxs(
|
|
90
|
+
return /*#__PURE__*/ jsxs("div", {
|
|
91
|
+
className: "px-4 py-4 border-b border-(--canvas-border-de-emp) last:border-b-0",
|
|
93
92
|
children: [
|
|
94
|
-
section.title && /*#__PURE__*/ jsx(
|
|
93
|
+
section.title && /*#__PURE__*/ jsx("div", {
|
|
94
|
+
className: "font-medium text-[14px] text-(--canvas-foreground) mb-2",
|
|
95
95
|
children: section.title
|
|
96
96
|
}),
|
|
97
|
-
/*#__PURE__*/ jsx(
|
|
98
|
-
|
|
99
|
-
children: section.fields.map((field)=>/*#__PURE__*/ jsx(
|
|
97
|
+
/*#__PURE__*/ jsx("div", {
|
|
98
|
+
className: "flex flex-col gap-4",
|
|
99
|
+
children: section.fields.map((field)=>/*#__PURE__*/ jsx("div", {
|
|
100
100
|
children: renderField(field, selectedNode.data[field.key], (value)=>handleFieldChange(field.key, value), errors[field.key])
|
|
101
101
|
}, field.key))
|
|
102
102
|
})
|
|
@@ -131,10 +131,11 @@ const NodePropertiesPanel_NodePropertiesPanel = /*#__PURE__*/ memo(function({ no
|
|
|
131
131
|
onClose: handleClose,
|
|
132
132
|
scrollKey: selectedNode.id,
|
|
133
133
|
isPinned: isPinned,
|
|
134
|
-
children: schema.sections ? schema.sections.map((section)=>renderSection(section)) : /*#__PURE__*/ jsx(
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
134
|
+
children: schema.sections ? schema.sections.map((section)=>renderSection(section)) : /*#__PURE__*/ jsx("div", {
|
|
135
|
+
className: "px-4 py-4",
|
|
136
|
+
children: /*#__PURE__*/ jsx("div", {
|
|
137
|
+
className: "flex flex-col gap-4",
|
|
138
|
+
children: schema.fields?.map((field)=>/*#__PURE__*/ jsx("div", {
|
|
138
139
|
children: selectedNode && renderField(field, selectedNode.data[field.key], (value)=>handleFieldChange(field.key, value), errors[field.key])
|
|
139
140
|
}, field.key))
|
|
140
141
|
})
|
|
@@ -27,23 +27,24 @@ __webpack_require__.d(__webpack_exports__, {
|
|
|
27
27
|
CheckboxField: ()=>CheckboxField_CheckboxField
|
|
28
28
|
});
|
|
29
29
|
const jsx_runtime_namespaceObject = require("react/jsx-runtime");
|
|
30
|
-
const
|
|
30
|
+
const apollo_wind_namespaceObject = require("@uipath/apollo-wind");
|
|
31
31
|
const external_react_namespaceObject = require("react");
|
|
32
|
-
const external_NodePropertiesPanel_styles_cjs_namespaceObject = require("../NodePropertiesPanel.styles.cjs");
|
|
33
32
|
const CheckboxField_CheckboxField = /*#__PURE__*/ (0, external_react_namespaceObject.memo)(function({ field, value, onChange, error }) {
|
|
34
33
|
const handleChange = (0, external_react_namespaceObject.useCallback)((e)=>{
|
|
35
34
|
onChange(e.target.checked);
|
|
36
35
|
}, [
|
|
37
36
|
onChange
|
|
38
37
|
]);
|
|
39
|
-
return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(
|
|
40
|
-
|
|
38
|
+
return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
|
|
39
|
+
className: "flex flex-col gap-1",
|
|
41
40
|
children: [
|
|
42
|
-
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(
|
|
43
|
-
|
|
41
|
+
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
|
|
42
|
+
className: (0, apollo_wind_namespaceObject.cn)('py-2 rounded transition', field.disabled ? 'opacity-50 cursor-not-allowed' : 'hover:bg-(--canvas-background-hover)'),
|
|
43
|
+
children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("label", {
|
|
44
|
+
className: (0, apollo_wind_namespaceObject.cn)('flex items-center text-[13px] text-(--canvas-foreground) select-none', field.disabled ? 'cursor-not-allowed' : 'cursor-pointer'),
|
|
44
45
|
children: [
|
|
45
|
-
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(
|
|
46
|
-
className: "nodrag",
|
|
46
|
+
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("input", {
|
|
47
|
+
className: "nodrag size-[18px] mr-2 cursor-pointer disabled:cursor-not-allowed accent-(--canvas-primary)",
|
|
47
48
|
type: "checkbox",
|
|
48
49
|
checked: !!value,
|
|
49
50
|
onChange: handleChange,
|
|
@@ -53,21 +54,18 @@ const CheckboxField_CheckboxField = /*#__PURE__*/ (0, external_react_namespaceOb
|
|
|
53
54
|
children: field.label
|
|
54
55
|
}),
|
|
55
56
|
field.icon && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
|
|
56
|
-
|
|
57
|
-
marginLeft: '8px'
|
|
58
|
-
},
|
|
57
|
+
className: "ml-2",
|
|
59
58
|
children: field.icon
|
|
60
59
|
})
|
|
61
60
|
]
|
|
62
61
|
})
|
|
63
62
|
}),
|
|
64
|
-
field.helpText && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(
|
|
63
|
+
field.helpText && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
|
|
64
|
+
className: "text-[12px] text-(--canvas-foreground-de-emp) block ml-[26px]",
|
|
65
65
|
children: field.helpText
|
|
66
66
|
}),
|
|
67
|
-
error && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(
|
|
68
|
-
|
|
69
|
-
marginLeft: '26px'
|
|
70
|
-
},
|
|
67
|
+
error && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
|
|
68
|
+
className: "text-[12px] text-(--canvas-error-text) block ml-[26px]",
|
|
71
69
|
children: error
|
|
72
70
|
})
|
|
73
71
|
]
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CheckboxField.d.ts","sourceRoot":"","sources":["../../../../../src/canvas/components/NodePropertiesPanel/fields/CheckboxField.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"CheckboxField.d.ts","sourceRoot":"","sources":["../../../../../src/canvas/components/NodePropertiesPanel/fields/CheckboxField.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,8BAA8B,CAAC;AAEhE,UAAU,kBAAkB;IAC1B,KAAK,EAAE,WAAW,CAAC;IACnB,KAAK,EAAE,OAAO,CAAC;IACf,QAAQ,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;IACnC,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,eAAO,MAAM,aAAa,0DAgDxB,CAAC"}
|
|
@@ -1,21 +1,22 @@
|
|
|
1
1
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
-
import {
|
|
2
|
+
import { cn } from "@uipath/apollo-wind";
|
|
3
3
|
import { memo, useCallback } from "react";
|
|
4
|
-
import { CheckboxContainer, CheckboxHelpText, CheckboxInput, CheckboxLabel, FieldError } from "../NodePropertiesPanel.styles.js";
|
|
5
4
|
const CheckboxField_CheckboxField = /*#__PURE__*/ memo(function({ field, value, onChange, error }) {
|
|
6
5
|
const handleChange = useCallback((e)=>{
|
|
7
6
|
onChange(e.target.checked);
|
|
8
7
|
}, [
|
|
9
8
|
onChange
|
|
10
9
|
]);
|
|
11
|
-
return /*#__PURE__*/ jsxs(
|
|
12
|
-
|
|
10
|
+
return /*#__PURE__*/ jsxs("div", {
|
|
11
|
+
className: "flex flex-col gap-1",
|
|
13
12
|
children: [
|
|
14
|
-
/*#__PURE__*/ jsx(
|
|
15
|
-
|
|
13
|
+
/*#__PURE__*/ jsx("div", {
|
|
14
|
+
className: cn('py-2 rounded transition', field.disabled ? 'opacity-50 cursor-not-allowed' : 'hover:bg-(--canvas-background-hover)'),
|
|
15
|
+
children: /*#__PURE__*/ jsxs("label", {
|
|
16
|
+
className: cn('flex items-center text-[13px] text-(--canvas-foreground) select-none', field.disabled ? 'cursor-not-allowed' : 'cursor-pointer'),
|
|
16
17
|
children: [
|
|
17
|
-
/*#__PURE__*/ jsx(
|
|
18
|
-
className: "nodrag",
|
|
18
|
+
/*#__PURE__*/ jsx("input", {
|
|
19
|
+
className: "nodrag size-[18px] mr-2 cursor-pointer disabled:cursor-not-allowed accent-(--canvas-primary)",
|
|
19
20
|
type: "checkbox",
|
|
20
21
|
checked: !!value,
|
|
21
22
|
onChange: handleChange,
|
|
@@ -25,21 +26,18 @@ const CheckboxField_CheckboxField = /*#__PURE__*/ memo(function({ field, value,
|
|
|
25
26
|
children: field.label
|
|
26
27
|
}),
|
|
27
28
|
field.icon && /*#__PURE__*/ jsx("span", {
|
|
28
|
-
|
|
29
|
-
marginLeft: '8px'
|
|
30
|
-
},
|
|
29
|
+
className: "ml-2",
|
|
31
30
|
children: field.icon
|
|
32
31
|
})
|
|
33
32
|
]
|
|
34
33
|
})
|
|
35
34
|
}),
|
|
36
|
-
field.helpText && /*#__PURE__*/ jsx(
|
|
35
|
+
field.helpText && /*#__PURE__*/ jsx("span", {
|
|
36
|
+
className: "text-[12px] text-(--canvas-foreground-de-emp) block ml-[26px]",
|
|
37
37
|
children: field.helpText
|
|
38
38
|
}),
|
|
39
|
-
error && /*#__PURE__*/ jsx(
|
|
40
|
-
|
|
41
|
-
marginLeft: '26px'
|
|
42
|
-
},
|
|
39
|
+
error && /*#__PURE__*/ jsx("span", {
|
|
40
|
+
className: "text-[12px] text-(--canvas-error-text) block ml-[26px]",
|
|
43
41
|
children: error
|
|
44
42
|
})
|
|
45
43
|
]
|
|
@@ -27,9 +27,8 @@ __webpack_require__.d(__webpack_exports__, {
|
|
|
27
27
|
NumberField: ()=>NumberField_NumberField
|
|
28
28
|
});
|
|
29
29
|
const jsx_runtime_namespaceObject = require("react/jsx-runtime");
|
|
30
|
-
const
|
|
30
|
+
const apollo_wind_namespaceObject = require("@uipath/apollo-wind");
|
|
31
31
|
const external_react_namespaceObject = require("react");
|
|
32
|
-
const external_NodePropertiesPanel_styles_cjs_namespaceObject = require("../NodePropertiesPanel.styles.cjs");
|
|
33
32
|
const NumberField_NumberField = /*#__PURE__*/ (0, external_react_namespaceObject.memo)(function({ field, value, onChange, error }) {
|
|
34
33
|
const [localValue, setLocalValue] = (0, external_react_namespaceObject.useState)(value ?? field.defaultValue ?? '');
|
|
35
34
|
const debounceTimer = (0, external_react_namespaceObject.useRef)(null);
|
|
@@ -66,16 +65,20 @@ const NumberField_NumberField = /*#__PURE__*/ (0, external_react_namespaceObject
|
|
|
66
65
|
field.debounce,
|
|
67
66
|
onChange
|
|
68
67
|
]);
|
|
69
|
-
return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(
|
|
70
|
-
|
|
68
|
+
return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
|
|
69
|
+
className: "flex flex-col gap-1",
|
|
71
70
|
children: [
|
|
72
|
-
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(
|
|
71
|
+
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("label", {
|
|
72
|
+
htmlFor: `field-${field.key}`,
|
|
73
|
+
className: "text-[13px] text-(--canvas-foreground-de-emp)",
|
|
73
74
|
children: field.label
|
|
74
75
|
}),
|
|
75
|
-
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(
|
|
76
|
+
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
|
|
77
|
+
className: "flex items-center gap-2",
|
|
76
78
|
children: [
|
|
77
|
-
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(
|
|
78
|
-
|
|
79
|
+
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("input", {
|
|
80
|
+
id: `field-${field.key}`,
|
|
81
|
+
className: (0, apollo_wind_namespaceObject.cn)('nodrag flex-1 px-3 py-2 text-[13px] font-mono border border-(--canvas-border) rounded bg-(--canvas-background) text-(--canvas-foreground) outline-none transition-colors', 'focus:border-(--canvas-primary)', 'disabled:opacity-50 disabled:cursor-not-allowed', '[appearance:textfield] [&::-webkit-inner-spin-button]:hidden [&::-webkit-outer-spin-button]:hidden', error && 'border-(--canvas-error)'),
|
|
79
82
|
type: "number",
|
|
80
83
|
value: localValue,
|
|
81
84
|
onChange: handleChange,
|
|
@@ -83,21 +86,20 @@ const NumberField_NumberField = /*#__PURE__*/ (0, external_react_namespaceObject
|
|
|
83
86
|
disabled: field.disabled,
|
|
84
87
|
min: field.min,
|
|
85
88
|
max: field.max,
|
|
86
|
-
step: field.step
|
|
87
|
-
hasError: !!error,
|
|
88
|
-
style: {
|
|
89
|
-
flex: 1
|
|
90
|
-
}
|
|
89
|
+
step: field.step
|
|
91
90
|
}),
|
|
92
|
-
field.suffix && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(
|
|
91
|
+
field.suffix && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
|
|
92
|
+
className: "shrink-0 text-[13px] text-(--canvas-foreground-de-emp) whitespace-nowrap",
|
|
93
93
|
children: field.suffix
|
|
94
94
|
})
|
|
95
95
|
]
|
|
96
96
|
}),
|
|
97
|
-
field.helpText && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(
|
|
97
|
+
field.helpText && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
|
|
98
|
+
className: "text-[12px] text-(--canvas-foreground-de-emp) block",
|
|
98
99
|
children: field.helpText
|
|
99
100
|
}),
|
|
100
|
-
error && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(
|
|
101
|
+
error && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
|
|
102
|
+
className: "text-[12px] text-(--canvas-error-text) block",
|
|
101
103
|
children: error
|
|
102
104
|
})
|
|
103
105
|
]
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NumberField.d.ts","sourceRoot":"","sources":["../../../../../src/canvas/components/NodePropertiesPanel/fields/NumberField.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"NumberField.d.ts","sourceRoot":"","sources":["../../../../../src/canvas/components/NodePropertiesPanel/fields/NumberField.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,8BAA8B,CAAC;AAEhE,UAAU,gBAAgB;IACxB,KAAK,EAAE,WAAW,CAAC;IACnB,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,KAAK,IAAI,CAAC;IAC9C,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,eAAO,MAAM,WAAW,wDA0FtB,CAAC"}
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
-
import {
|
|
2
|
+
import { cn } from "@uipath/apollo-wind";
|
|
3
3
|
import { memo, useCallback, useEffect, useRef, useState } from "react";
|
|
4
|
-
import { FieldError, FieldHelpText, FieldLabel, InputSuffix, InputWrapper, NumberInput } from "../NodePropertiesPanel.styles.js";
|
|
5
4
|
const NumberField_NumberField = /*#__PURE__*/ memo(function({ field, value, onChange, error }) {
|
|
6
5
|
const [localValue, setLocalValue] = useState(value ?? field.defaultValue ?? '');
|
|
7
6
|
const debounceTimer = useRef(null);
|
|
@@ -38,16 +37,20 @@ const NumberField_NumberField = /*#__PURE__*/ memo(function({ field, value, onCh
|
|
|
38
37
|
field.debounce,
|
|
39
38
|
onChange
|
|
40
39
|
]);
|
|
41
|
-
return /*#__PURE__*/ jsxs(
|
|
42
|
-
|
|
40
|
+
return /*#__PURE__*/ jsxs("div", {
|
|
41
|
+
className: "flex flex-col gap-1",
|
|
43
42
|
children: [
|
|
44
|
-
/*#__PURE__*/ jsx(
|
|
43
|
+
/*#__PURE__*/ jsx("label", {
|
|
44
|
+
htmlFor: `field-${field.key}`,
|
|
45
|
+
className: "text-[13px] text-(--canvas-foreground-de-emp)",
|
|
45
46
|
children: field.label
|
|
46
47
|
}),
|
|
47
|
-
/*#__PURE__*/ jsxs(
|
|
48
|
+
/*#__PURE__*/ jsxs("div", {
|
|
49
|
+
className: "flex items-center gap-2",
|
|
48
50
|
children: [
|
|
49
|
-
/*#__PURE__*/ jsx(
|
|
50
|
-
|
|
51
|
+
/*#__PURE__*/ jsx("input", {
|
|
52
|
+
id: `field-${field.key}`,
|
|
53
|
+
className: cn('nodrag flex-1 px-3 py-2 text-[13px] font-mono border border-(--canvas-border) rounded bg-(--canvas-background) text-(--canvas-foreground) outline-none transition-colors', 'focus:border-(--canvas-primary)', 'disabled:opacity-50 disabled:cursor-not-allowed', '[appearance:textfield] [&::-webkit-inner-spin-button]:hidden [&::-webkit-outer-spin-button]:hidden', error && 'border-(--canvas-error)'),
|
|
51
54
|
type: "number",
|
|
52
55
|
value: localValue,
|
|
53
56
|
onChange: handleChange,
|
|
@@ -55,21 +58,20 @@ const NumberField_NumberField = /*#__PURE__*/ memo(function({ field, value, onCh
|
|
|
55
58
|
disabled: field.disabled,
|
|
56
59
|
min: field.min,
|
|
57
60
|
max: field.max,
|
|
58
|
-
step: field.step
|
|
59
|
-
hasError: !!error,
|
|
60
|
-
style: {
|
|
61
|
-
flex: 1
|
|
62
|
-
}
|
|
61
|
+
step: field.step
|
|
63
62
|
}),
|
|
64
|
-
field.suffix && /*#__PURE__*/ jsx(
|
|
63
|
+
field.suffix && /*#__PURE__*/ jsx("span", {
|
|
64
|
+
className: "shrink-0 text-[13px] text-(--canvas-foreground-de-emp) whitespace-nowrap",
|
|
65
65
|
children: field.suffix
|
|
66
66
|
})
|
|
67
67
|
]
|
|
68
68
|
}),
|
|
69
|
-
field.helpText && /*#__PURE__*/ jsx(
|
|
69
|
+
field.helpText && /*#__PURE__*/ jsx("span", {
|
|
70
|
+
className: "text-[12px] text-(--canvas-foreground-de-emp) block",
|
|
70
71
|
children: field.helpText
|
|
71
72
|
}),
|
|
72
|
-
error && /*#__PURE__*/ jsx(
|
|
73
|
+
error && /*#__PURE__*/ jsx("span", {
|
|
74
|
+
className: "text-[12px] text-(--canvas-error-text) block",
|
|
73
75
|
children: error
|
|
74
76
|
})
|
|
75
77
|
]
|
|
@@ -27,43 +27,61 @@ __webpack_require__.d(__webpack_exports__, {
|
|
|
27
27
|
SelectField: ()=>SelectField_SelectField
|
|
28
28
|
});
|
|
29
29
|
const jsx_runtime_namespaceObject = require("react/jsx-runtime");
|
|
30
|
-
const
|
|
30
|
+
const apollo_wind_namespaceObject = require("@uipath/apollo-wind");
|
|
31
|
+
const external_lucide_react_namespaceObject = require("lucide-react");
|
|
31
32
|
const external_react_namespaceObject = require("react");
|
|
32
|
-
const external_NodePropertiesPanel_styles_cjs_namespaceObject = require("../NodePropertiesPanel.styles.cjs");
|
|
33
33
|
const SelectField_SelectField = /*#__PURE__*/ (0, external_react_namespaceObject.memo)(function({ field, value, onChange, error }) {
|
|
34
34
|
const handleChange = (0, external_react_namespaceObject.useCallback)((e)=>{
|
|
35
|
-
|
|
35
|
+
const raw = e.target.value;
|
|
36
|
+
const matched = field.options?.find((o)=>String(o.value) === raw);
|
|
37
|
+
onChange(matched ? matched.value : raw);
|
|
36
38
|
}, [
|
|
39
|
+
field.options,
|
|
37
40
|
onChange
|
|
38
41
|
]);
|
|
39
|
-
|
|
40
|
-
|
|
42
|
+
const selectId = `field-${field.key}`;
|
|
43
|
+
return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
|
|
44
|
+
className: "flex flex-col gap-1",
|
|
41
45
|
children: [
|
|
42
|
-
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(
|
|
46
|
+
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("label", {
|
|
47
|
+
htmlFor: selectId,
|
|
48
|
+
className: "text-[13px] text-(--canvas-foreground-de-emp)",
|
|
43
49
|
children: field.label
|
|
44
50
|
}),
|
|
45
|
-
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(
|
|
46
|
-
className: "
|
|
47
|
-
value: value || field.defaultValue || '',
|
|
48
|
-
onChange: handleChange,
|
|
49
|
-
disabled: field.disabled,
|
|
50
|
-
hasError: !!error,
|
|
51
|
+
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
|
|
52
|
+
className: "relative",
|
|
51
53
|
children: [
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
disabled:
|
|
55
|
-
|
|
54
|
+
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("select", {
|
|
55
|
+
id: selectId,
|
|
56
|
+
className: (0, apollo_wind_namespaceObject.cn)('nodrag w-full px-3 py-2 pr-8 text-[13px] border border-(--canvas-border) rounded bg-(--canvas-background) text-(--canvas-foreground) outline-none transition-colors appearance-none cursor-pointer', 'focus:border-(--canvas-primary)', 'disabled:opacity-50 disabled:cursor-not-allowed', error && 'border-(--canvas-error)'),
|
|
57
|
+
value: value ?? field.defaultValue ?? '',
|
|
58
|
+
onChange: handleChange,
|
|
59
|
+
disabled: field.disabled,
|
|
60
|
+
children: [
|
|
61
|
+
field.placeholder && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("option", {
|
|
62
|
+
value: "",
|
|
63
|
+
disabled: true,
|
|
64
|
+
children: field.placeholder
|
|
65
|
+
}),
|
|
66
|
+
field.options?.map((option)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("option", {
|
|
67
|
+
value: option.value,
|
|
68
|
+
children: option.label
|
|
69
|
+
}, option.value))
|
|
70
|
+
]
|
|
56
71
|
}),
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
72
|
+
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.ChevronDown, {
|
|
73
|
+
size: 14,
|
|
74
|
+
className: "pointer-events-none absolute right-2.5 top-1/2 -translate-y-1/2 text-(--canvas-foreground-de-emp)",
|
|
75
|
+
"aria-hidden": true
|
|
76
|
+
})
|
|
61
77
|
]
|
|
62
78
|
}),
|
|
63
|
-
field.helpText && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(
|
|
79
|
+
field.helpText && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
|
|
80
|
+
className: "text-[12px] text-(--canvas-foreground-de-emp) block",
|
|
64
81
|
children: field.helpText
|
|
65
82
|
}),
|
|
66
|
-
error && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(
|
|
83
|
+
error && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
|
|
84
|
+
className: "text-[12px] text-(--canvas-error-text) block",
|
|
67
85
|
children: error
|
|
68
86
|
})
|
|
69
87
|
]
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SelectField.d.ts","sourceRoot":"","sources":["../../../../../src/canvas/components/NodePropertiesPanel/fields/SelectField.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,8BAA8B,CAAC;AAEhE,UAAU,gBAAgB;IACxB,KAAK,EAAE,WAAW,CAAC;IACnB,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC;IACnC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;IAC3C,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,eAAO,MAAM,WAAW,
|
|
1
|
+
{"version":3,"file":"SelectField.d.ts","sourceRoot":"","sources":["../../../../../src/canvas/components/NodePropertiesPanel/fields/SelectField.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,8BAA8B,CAAC;AAEhE,UAAU,gBAAgB;IACxB,KAAK,EAAE,WAAW,CAAC;IACnB,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC;IACnC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;IAC3C,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,eAAO,MAAM,WAAW,wDA8DtB,CAAC"}
|
|
@@ -1,41 +1,59 @@
|
|
|
1
1
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
-
import {
|
|
2
|
+
import { cn } from "@uipath/apollo-wind";
|
|
3
|
+
import { ChevronDown } from "lucide-react";
|
|
3
4
|
import { memo, useCallback } from "react";
|
|
4
|
-
import { FieldError, FieldHelpText, FieldLabel, SelectInput } from "../NodePropertiesPanel.styles.js";
|
|
5
5
|
const SelectField_SelectField = /*#__PURE__*/ memo(function({ field, value, onChange, error }) {
|
|
6
6
|
const handleChange = useCallback((e)=>{
|
|
7
|
-
|
|
7
|
+
const raw = e.target.value;
|
|
8
|
+
const matched = field.options?.find((o)=>String(o.value) === raw);
|
|
9
|
+
onChange(matched ? matched.value : raw);
|
|
8
10
|
}, [
|
|
11
|
+
field.options,
|
|
9
12
|
onChange
|
|
10
13
|
]);
|
|
11
|
-
|
|
12
|
-
|
|
14
|
+
const selectId = `field-${field.key}`;
|
|
15
|
+
return /*#__PURE__*/ jsxs("div", {
|
|
16
|
+
className: "flex flex-col gap-1",
|
|
13
17
|
children: [
|
|
14
|
-
/*#__PURE__*/ jsx(
|
|
18
|
+
/*#__PURE__*/ jsx("label", {
|
|
19
|
+
htmlFor: selectId,
|
|
20
|
+
className: "text-[13px] text-(--canvas-foreground-de-emp)",
|
|
15
21
|
children: field.label
|
|
16
22
|
}),
|
|
17
|
-
/*#__PURE__*/ jsxs(
|
|
18
|
-
className: "
|
|
19
|
-
value: value || field.defaultValue || '',
|
|
20
|
-
onChange: handleChange,
|
|
21
|
-
disabled: field.disabled,
|
|
22
|
-
hasError: !!error,
|
|
23
|
+
/*#__PURE__*/ jsxs("div", {
|
|
24
|
+
className: "relative",
|
|
23
25
|
children: [
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
disabled:
|
|
27
|
-
|
|
26
|
+
/*#__PURE__*/ jsxs("select", {
|
|
27
|
+
id: selectId,
|
|
28
|
+
className: cn('nodrag w-full px-3 py-2 pr-8 text-[13px] border border-(--canvas-border) rounded bg-(--canvas-background) text-(--canvas-foreground) outline-none transition-colors appearance-none cursor-pointer', 'focus:border-(--canvas-primary)', 'disabled:opacity-50 disabled:cursor-not-allowed', error && 'border-(--canvas-error)'),
|
|
29
|
+
value: value ?? field.defaultValue ?? '',
|
|
30
|
+
onChange: handleChange,
|
|
31
|
+
disabled: field.disabled,
|
|
32
|
+
children: [
|
|
33
|
+
field.placeholder && /*#__PURE__*/ jsx("option", {
|
|
34
|
+
value: "",
|
|
35
|
+
disabled: true,
|
|
36
|
+
children: field.placeholder
|
|
37
|
+
}),
|
|
38
|
+
field.options?.map((option)=>/*#__PURE__*/ jsx("option", {
|
|
39
|
+
value: option.value,
|
|
40
|
+
children: option.label
|
|
41
|
+
}, option.value))
|
|
42
|
+
]
|
|
28
43
|
}),
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
44
|
+
/*#__PURE__*/ jsx(ChevronDown, {
|
|
45
|
+
size: 14,
|
|
46
|
+
className: "pointer-events-none absolute right-2.5 top-1/2 -translate-y-1/2 text-(--canvas-foreground-de-emp)",
|
|
47
|
+
"aria-hidden": true
|
|
48
|
+
})
|
|
33
49
|
]
|
|
34
50
|
}),
|
|
35
|
-
field.helpText && /*#__PURE__*/ jsx(
|
|
51
|
+
field.helpText && /*#__PURE__*/ jsx("span", {
|
|
52
|
+
className: "text-[12px] text-(--canvas-foreground-de-emp) block",
|
|
36
53
|
children: field.helpText
|
|
37
54
|
}),
|
|
38
|
-
error && /*#__PURE__*/ jsx(
|
|
55
|
+
error && /*#__PURE__*/ jsx("span", {
|
|
56
|
+
className: "text-[12px] text-(--canvas-error-text) block",
|
|
39
57
|
children: error
|
|
40
58
|
})
|
|
41
59
|
]
|