@wandelbots/wandelbots-js-react-components 2.17.1 → 2.18.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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wandelbots/wandelbots-js-react-components",
3
- "version": "2.17.1",
3
+ "version": "2.18.0",
4
4
  "description": "React UI toolkit for building applications on top of the Wandelbots platform",
5
5
  "type": "module",
6
6
  "sideEffects": false,
@@ -11,6 +11,7 @@ import {
11
11
 
12
12
  export const JoggingOptions = observer(({ store }: { store: JoggingStore }) => {
13
13
  const { t } = useTranslation()
14
+ const joggingOptions = []
14
15
 
15
16
  function translateOrientation(orientation: OrientationId): string {
16
17
  switch (orientation) {
@@ -23,6 +24,108 @@ export const JoggingOptions = observer(({ store }: { store: JoggingStore }) => {
23
24
  }
24
25
  }
25
26
 
27
+ if (store.showCoordSystemSelect) {
28
+ joggingOptions.push(
29
+ <AdornedSelect
30
+ key="coord"
31
+ labelId="jogging-coord-select"
32
+ labelValue={t("Jogging.CoordinateSystem.hlb")}
33
+ value={store.selectedCoordSystemId}
34
+ size="small"
35
+ variant="filled"
36
+ displayEmpty={true}
37
+ onChange={(event) =>
38
+ store.setSelectedCoordSystemId(event.target.value as string)
39
+ }
40
+ disabled={store.isLocked}
41
+ >
42
+ {store.coordSystems.map((cs) => (
43
+ <MenuItem key={cs.coordinate_system} value={cs.coordinate_system}>
44
+ {cs.name && store.coordSystemCountByName[cs.name] > 1
45
+ ? `${cs.name} / ${cs.coordinate_system}`
46
+ : cs.name || cs.coordinate_system}
47
+ </MenuItem>
48
+ ))}
49
+ </AdornedSelect>,
50
+ )
51
+ }
52
+
53
+ if (store.showTcpSelect) {
54
+ joggingOptions.push(
55
+ <AdornedSelect
56
+ key="tcp"
57
+ labelId="jogging-tcp-select"
58
+ labelValue="TCP"
59
+ value={store.selectedTcpId}
60
+ size="small"
61
+ variant="filled"
62
+ onChange={(event) =>
63
+ store.setSelectedTcpId(event.target.value as string)
64
+ }
65
+ disabled={store.isLocked}
66
+ >
67
+ {store.tcps.map((tcp) => (
68
+ <MenuItem key={tcp.id} value={tcp.id}>
69
+ {tcp.id}
70
+ </MenuItem>
71
+ ))}
72
+ </AdornedSelect>,
73
+ )
74
+ }
75
+
76
+ if (store.showOrientationSelect) {
77
+ joggingOptions.push(
78
+ <AdornedSelect
79
+ key="orientation"
80
+ labelValue={t("Jogging.Cartesian.Orientation.lb")}
81
+ id="orientation-select"
82
+ labelId="orientation-select"
83
+ value={store.selectedOrientation}
84
+ onChange={(event) =>
85
+ store.setSelectedOrientation(event.target.value as OrientationId)
86
+ }
87
+ disabled={store.isLocked}
88
+ >
89
+ {ORIENTATION_IDS.map((orientationId) => (
90
+ <MenuItem key={orientationId} value={orientationId}>
91
+ {translateOrientation(orientationId)}
92
+ </MenuItem>
93
+ ))}
94
+ </AdornedSelect>,
95
+ )
96
+ }
97
+
98
+ if (store.showIncrementSelect) {
99
+ joggingOptions.push(
100
+ <AdornedSelect
101
+ key="increment"
102
+ labelValue={t("Jogging.Increment.hlb")}
103
+ labelId="jogging-increment-select"
104
+ size="small"
105
+ variant="filled"
106
+ value={store.activeDiscreteIncrement?.id || "continuous"}
107
+ onChange={(event) =>
108
+ store.setSelectedIncrementId(event.target.value as IncrementOptionId)
109
+ }
110
+ disabled={store.isLocked}
111
+ >
112
+ <MenuItem key="continuous" value="continuous">
113
+ {t("Jogging.Increment.Continuous.dd")}
114
+ </MenuItem>
115
+
116
+ {store.selectedOrientation === "tool"
117
+ ? null
118
+ : store.discreteIncrementOptions.map((inc) => (
119
+ <MenuItem key={inc.id} value={inc.id}>
120
+ {store.currentMotionType === "translate"
121
+ ? `${inc.mm}mm`
122
+ : `${inc.degrees}°`}
123
+ </MenuItem>
124
+ ))}
125
+ </AdornedSelect>,
126
+ )
127
+ }
128
+
26
129
  return (
27
130
  <Box
28
131
  component="div"
@@ -34,113 +137,20 @@ export const JoggingOptions = observer(({ store }: { store: JoggingStore }) => {
34
137
  "& label": { opacity: 0.7, fontSize: "12px", marginBottom: "4px" },
35
138
  }}
36
139
  >
37
- {/* Coordinate system */}
38
- {store.showCoordSystemSelect && (
39
- <Box sx={{ gridColumn: store.showTcpSelect ? "auto" : "span 2" }}>
40
- <AdornedSelect
41
- labelId="jogging-coord-select"
42
- labelValue={t("Jogging.CoordinateSystem.hlb")}
43
- value={store.selectedCoordSystemId}
44
- size="small"
45
- variant="filled"
46
- displayEmpty={true}
47
- onChange={(event) =>
48
- store.setSelectedCoordSystemId(event.target.value as string)
49
- }
50
- disabled={store.isLocked}
51
- >
52
- {store.coordSystems.map((cs) => (
53
- <MenuItem key={cs.coordinate_system} value={cs.coordinate_system}>
54
- {cs.name && store.coordSystemCountByName[cs.name] > 1
55
- ? `${cs.name} / ${cs.coordinate_system}`
56
- : cs.name || cs.coordinate_system}
57
- </MenuItem>
58
- ))}
59
- </AdornedSelect>
60
- </Box>
61
- )}
62
-
63
- {/* TCP selection */}
64
- {store.showTcpSelect && (
140
+ {joggingOptions.map((select, idx) => (
65
141
  <Box
66
- sx={{ gridColumn: store.showCoordSystemSelect ? "auto" : "span 2" }}
142
+ key={idx}
143
+ sx={{
144
+ gridColumn:
145
+ joggingOptions.length % 2 === 1 &&
146
+ idx === joggingOptions.length - 1
147
+ ? "span 2"
148
+ : "auto",
149
+ }}
67
150
  >
68
- <AdornedSelect
69
- labelId="jogging-tcp-select"
70
- labelValue="TCP"
71
- value={store.selectedTcpId}
72
- size="small"
73
- variant="filled"
74
- onChange={(event) =>
75
- store.setSelectedTcpId(event.target.value as string)
76
- }
77
- disabled={store.isLocked}
78
- >
79
- {store.tcps.map((tcp) => (
80
- <MenuItem key={tcp.id} value={tcp.id}>
81
- {tcp.id}
82
- </MenuItem>
83
- ))}
84
- </AdornedSelect>
85
- </Box>
86
- )}
87
-
88
- {/* Orientation */}
89
- {store.showOrientationSelect && (
90
- <Box sx={{ gridColumn: store.showIncrementSelect ? "auto" : "span 2" }}>
91
- <AdornedSelect
92
- labelValue={t("Jogging.Cartesian.Orientation.lb")}
93
- id="orientation-select"
94
- labelId="orientation-select"
95
- value={store.selectedOrientation}
96
- onChange={(event) =>
97
- store.setSelectedOrientation(event.target.value as OrientationId)
98
- }
99
- disabled={store.isLocked}
100
- >
101
- {ORIENTATION_IDS.map((orientationId) => (
102
- <MenuItem key={orientationId} value={orientationId}>
103
- {translateOrientation(orientationId)}
104
- </MenuItem>
105
- ))}
106
- </AdornedSelect>
107
- </Box>
108
- )}
109
-
110
- {/* Increment */}
111
- {store.showIncrementSelect && (
112
- <Box
113
- sx={{ gridColumn: store.showOrientationSelect ? "auto" : "span 2" }}
114
- >
115
- <AdornedSelect
116
- labelValue={t("Jogging.Increment.hlb")}
117
- labelId="jogging-increment-select"
118
- size="small"
119
- variant="filled"
120
- value={store.activeDiscreteIncrement?.id || "continuous"}
121
- onChange={(event) =>
122
- store.setSelectedIncrementId(
123
- event.target.value as IncrementOptionId,
124
- )
125
- }
126
- disabled={store.isLocked}
127
- >
128
- <MenuItem key="continuous" value="continuous">
129
- {t("Jogging.Increment.Continuous.dd")}
130
- </MenuItem>
131
-
132
- {store.selectedOrientation === "tool"
133
- ? null
134
- : store.discreteIncrementOptions.map((inc) => (
135
- <MenuItem key={inc.id} value={inc.id}>
136
- {store.currentMotionType === "translate"
137
- ? `${inc.mm}mm`
138
- : `${inc.degrees}°`}
139
- </MenuItem>
140
- ))}
141
- </AdornedSelect>
151
+ {select}
142
152
  </Box>
143
- )}
153
+ ))}
144
154
  </Box>
145
155
  )
146
156
  })