@searpent/react-image-annotate 2.3.3 → 2.3.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (60) hide show
  1. package/Annotator/examplePhotos.js +30 -30
  2. package/Annotator/examplePhotos_repr.js +28 -28
  3. package/Annotator/index.js +69 -32
  4. package/Annotator/index.story_bugdemo_15_1.js +895 -773
  5. package/Annotator/index.story_repr.js +1048 -933
  6. package/Annotator/reducers/convert-expanding-line-to-polygon.js +15 -16
  7. package/ClassSelectionMenu/index.js +55 -35
  8. package/Crosshairs/index.js +30 -23
  9. package/DebugSidebarBox/index.js +40 -9
  10. package/DemoSite/Editor.js +124 -79
  11. package/DemoSite/ErrorBoundaryDialog.js +19 -6
  12. package/DemoSite/index.js +26 -17
  13. package/Editor/index.js +70 -36
  14. package/Editor/index_bugdemo_15_1.js +68 -35
  15. package/Editor/readOnly.js +178 -127
  16. package/Errorer/index.js +8 -3
  17. package/FullImageSegmentationAnnotator/index.js +6 -3
  18. package/GroupSelectorSidebarBox/index.js +48 -32
  19. package/GroupsEditorSidebarBox/index.js +75 -40
  20. package/HelpSidebarBox/index.js +24 -13
  21. package/HighlightBox/index.js +37 -30
  22. package/HistorySidebarBox/index.js +51 -29
  23. package/ImageCanvas/index.js +165 -130
  24. package/ImageMask/index.js +9 -6
  25. package/ImageSelectorSidebarBox/index.js +44 -26
  26. package/KeyframeTimeline/index.js +65 -45
  27. package/KeyframesSelectorSidebarBox/index.js +76 -54
  28. package/LandingPage/index.js +76 -38
  29. package/Locker/index.js +8 -3
  30. package/MainLayout/RightSidebarItemsWrapper.js +7 -4
  31. package/MainLayout/icon-dictionary.js +99 -66
  32. package/MainLayout/index.js +256 -196
  33. package/MainLayout/index_bugdemo_15_1.js +253 -195
  34. package/MetadataEditorSidebarBox/index.js +152 -102
  35. package/MetadataEditorSidebarBox/index_14_01_25.js +152 -102
  36. package/MetadataEditorSidebarBox/index_repr.js +183 -128
  37. package/PageSelector/UpdatedBySemaphore.js +54 -0
  38. package/PageSelector/index.js +172 -96
  39. package/PageSelector/page-selector.css +126 -2
  40. package/PointDistances/index.js +45 -33
  41. package/PreventScrollToParents/index.js +16 -9
  42. package/RegionLabel/index.js +217 -165
  43. package/RegionSelectAndTransformBoxes/index.js +131 -105
  44. package/RegionSelectorSidebarBox/index.js +243 -165
  45. package/RegionShapes/index.js +213 -153
  46. package/RegionTags/index.js +83 -69
  47. package/SettingsDialog/index.js +50 -37
  48. package/SettingsProvider/index.js +8 -5
  49. package/Shortcuts/ShortcutField.js +21 -14
  50. package/Shortcuts/index.js +18 -12
  51. package/ShortcutsManager/index.js +7 -4
  52. package/Sidebar/index.js +46 -29
  53. package/SidebarBoxContainer/index.js +14 -7
  54. package/SmallToolButton/index.js +23 -16
  55. package/TagsSidebarBox/index.js +41 -28
  56. package/TaskDescriptionSidebarBox/index.js +24 -13
  57. package/Theme/index.js +8 -3
  58. package/VideoOrImageCanvasBackground/index.js +30 -17
  59. package/package.json +1 -1
  60. package/utils/spellcheck-nspell.js +2 -2
@@ -63,57 +63,84 @@ var MetadataItem = function MetadataItem(_ref2) {
63
63
  });
64
64
  };
65
65
 
66
- return React.createElement(MetadataItemDiv, null, React.createElement("label", {
67
- for: name
68
- }, name), React.createElement("div", {
69
- style: {
70
- width: "50%"
71
- }
72
- }, (metadataConfig === null || metadataConfig === void 0 ? void 0 : metadataConfig.selectable) !== true && React.createElement(React.Fragment, null, React.createElement("input", {
73
- type: "text",
74
- value: allowUncontrolledForDebug ? value : value !== null && value !== void 0 ? value : "",
75
- name: name,
76
- onChange: handleChange,
77
- id: name,
78
- list: "".concat(name, "-list"),
79
- style: {
80
- width: "100%"
81
- }
82
- }), React.createElement("datalist", {
83
- id: "".concat(name, "-list")
84
- }, metadataConfig === null || metadataConfig === void 0 ? void 0 : (_metadataConfig$optio = metadataConfig.options) === null || _metadataConfig$optio === void 0 ? void 0 : _metadataConfig$optio.map(function (opt) {
85
- if (opt.value && opt.label) {
86
- return React.createElement("option", {
87
- key: opt.value,
88
- value: opt.value
89
- }, opt.label);
90
- }
66
+ return (
67
+ /*#__PURE__*/
68
+ React.createElement(MetadataItemDiv, null,
69
+ /*#__PURE__*/
70
+ React.createElement("label", {
71
+ "for": name
72
+ }, name),
73
+ /*#__PURE__*/
74
+ React.createElement("div", {
75
+ style: {
76
+ width: "50%"
77
+ }
78
+ }, (metadataConfig === null || metadataConfig === void 0 ? void 0 : metadataConfig.selectable) !== true &&
79
+ /*#__PURE__*/
80
+ React.createElement(React.Fragment, null,
81
+ /*#__PURE__*/
82
+ React.createElement("input", {
83
+ type: "text",
84
+ value: allowUncontrolledForDebug ? value : value !== null && value !== void 0 ? value : "",
85
+ name: name,
86
+ onChange: handleChange,
87
+ id: name,
88
+ list: "".concat(name, "-list"),
89
+ style: {
90
+ width: "100%"
91
+ }
92
+ }),
93
+ /*#__PURE__*/
94
+ React.createElement("datalist", {
95
+ id: "".concat(name, "-list")
96
+ }, metadataConfig === null || metadataConfig === void 0 ? void 0 : (_metadataConfig$optio = metadataConfig.options) === null || _metadataConfig$optio === void 0 ? void 0 : _metadataConfig$optio.map(function (opt) {
97
+ if (opt.value && opt.label) {
98
+ return (
99
+ /*#__PURE__*/
100
+ React.createElement("option", {
101
+ key: opt.value,
102
+ value: opt.value
103
+ }, opt.label)
104
+ );
105
+ }
91
106
 
92
- return React.createElement("option", {
93
- key: opt,
94
- value: opt
95
- });
96
- }))), (metadataConfig === null || metadataConfig === void 0 ? void 0 : metadataConfig.selectable) === true && React.createElement("select", {
97
- name: name,
98
- id: name,
99
- value: value || '',
100
- onChange: handleChange,
101
- style: {
102
- width: '100%'
103
- }
104
- }, metadataConfig === null || metadataConfig === void 0 ? void 0 : (_metadataConfig$optio2 = metadataConfig.options) === null || _metadataConfig$optio2 === void 0 ? void 0 : _metadataConfig$optio2.map(function (opt) {
105
- if (opt.value && opt.label) {
106
- return React.createElement("option", {
107
- key: opt.value,
108
- value: opt.value
109
- }, opt.label);
110
- }
107
+ return (
108
+ /*#__PURE__*/
109
+ React.createElement("option", {
110
+ key: opt,
111
+ value: opt
112
+ })
113
+ );
114
+ }))), (metadataConfig === null || metadataConfig === void 0 ? void 0 : metadataConfig.selectable) === true &&
115
+ /*#__PURE__*/
116
+ React.createElement("select", {
117
+ name: name,
118
+ id: name,
119
+ value: value || '',
120
+ onChange: handleChange,
121
+ style: {
122
+ width: '100%'
123
+ }
124
+ }, metadataConfig === null || metadataConfig === void 0 ? void 0 : (_metadataConfig$optio2 = metadataConfig.options) === null || _metadataConfig$optio2 === void 0 ? void 0 : _metadataConfig$optio2.map(function (opt) {
125
+ if (opt.value && opt.label) {
126
+ return (
127
+ /*#__PURE__*/
128
+ React.createElement("option", {
129
+ key: opt.value,
130
+ value: opt.value
131
+ }, opt.label)
132
+ );
133
+ }
111
134
 
112
- return React.createElement("option", {
113
- key: opt,
114
- value: opt
115
- });
116
- }))));
135
+ return (
136
+ /*#__PURE__*/
137
+ React.createElement("option", {
138
+ key: opt,
139
+ value: opt
140
+ })
141
+ );
142
+ }))))
143
+ );
117
144
  };
118
145
 
119
146
  var MetadataList = function MetadataList(_ref3) {
@@ -124,40 +151,51 @@ var MetadataList = function MetadataList(_ref3) {
124
151
  _ref3$metadataConfigs = _ref3.metadataConfigs,
125
152
  metadataConfigs = _ref3$metadataConfigs === void 0 ? [] : _ref3$metadataConfigs,
126
153
  groupId = _ref3.groupId;
127
- return React.createElement("div", null, React.createElement("h2", null, title), metadata && metadata.map(function (_ref4) {
128
- var key = _ref4.key,
129
- value = _ref4.value,
130
- metadataId = _ref4.metadataId;
154
+ return (
155
+ /*#__PURE__*/
156
+ React.createElement("div", null,
157
+ /*#__PURE__*/
158
+ React.createElement("h2", null, title), metadata && metadata.map(function (_ref4) {
159
+ var key = _ref4.key,
160
+ value = _ref4.value,
161
+ metadataId = _ref4.metadataId;
131
162
 
132
- // In Storybook hang repro mode, deliberately remove React keys so React is
133
- // more likely to reuse the same DOM <input> across article switches.
134
- if (isStorybookHangReproModeEnabled()) {
135
- return React.createElement(MetadataItem, {
136
- name: key,
137
- value: value,
138
- imageIndex: imageIndex,
139
- metadataId: metadataId,
140
- groupId: groupId,
141
- onChange: onMetadataChange,
142
- metadataConfig: metadataConfigs.find(function (i) {
143
- return i.key === key;
144
- })
145
- });
146
- }
163
+ // In Storybook hang repro mode, deliberately remove React keys so React is
164
+ // more likely to reuse the same DOM <input> across article switches.
165
+ if (isStorybookHangReproModeEnabled()) {
166
+ return (
167
+ /*#__PURE__*/
168
+ React.createElement(MetadataItem, {
169
+ name: key,
170
+ value: value,
171
+ imageIndex: imageIndex,
172
+ metadataId: metadataId,
173
+ groupId: groupId,
174
+ onChange: onMetadataChange,
175
+ metadataConfig: metadataConfigs.find(function (i) {
176
+ return i.key === key;
177
+ })
178
+ })
179
+ );
180
+ }
147
181
 
148
- return React.createElement(MetadataItem, {
149
- key: "".concat(groupId, "-").concat(key),
150
- name: key,
151
- value: value,
152
- imageIndex: imageIndex,
153
- metadataId: metadataId,
154
- groupId: groupId,
155
- onChange: onMetadataChange,
156
- metadataConfig: metadataConfigs.find(function (i) {
157
- return i.key === key;
158
- })
159
- });
160
- }));
182
+ return (
183
+ /*#__PURE__*/
184
+ React.createElement(MetadataItem, {
185
+ key: "".concat(groupId, "-").concat(key),
186
+ name: key,
187
+ value: value,
188
+ imageIndex: imageIndex,
189
+ metadataId: metadataId,
190
+ groupId: groupId,
191
+ onChange: onMetadataChange,
192
+ metadataConfig: metadataConfigs.find(function (i) {
193
+ return i.key === key;
194
+ })
195
+ })
196
+ );
197
+ }))
198
+ );
161
199
  };
162
200
 
163
201
  var theme = createTheme();
@@ -217,55 +255,72 @@ export var MetadataEditorSidebarBox = function MetadataEditorSidebarBox(_ref6) {
217
255
  }
218
256
  }
219
257
 
220
- return React.createElement(ThemeProvider, {
221
- theme: theme
222
- }, React.createElement(SidebarBoxContainer, {
223
- title: "Metadata",
224
- icon: React.createElement(DescriptionIcon, {
258
+ return (
259
+ /*#__PURE__*/
260
+ React.createElement(ThemeProvider, {
261
+ theme: theme
262
+ },
263
+ /*#__PURE__*/
264
+ React.createElement(SidebarBoxContainer, {
265
+ title: "Metadata",
266
+ icon:
267
+ /*#__PURE__*/
268
+ React.createElement(DescriptionIcon, {
269
+ style: {
270
+ color: grey[700]
271
+ }
272
+ }),
273
+ expandedByDefault: true
274
+ },
275
+ /*#__PURE__*/
276
+ React.createElement(DivContainer, {
225
277
  style: {
226
- color: grey[700]
278
+ height: "600px"
227
279
  }
280
+ }, articleMetadata.length > 0 && (isStorybookHangReproModeEnabled() ?
281
+ /*#__PURE__*/
282
+ React.createElement(MetadataList, {
283
+ title: "Article",
284
+ metadata: articleMetadata,
285
+ imageIndex: state.selectedImage,
286
+ groupId: selectedGroupId,
287
+ onMetadataChange: onMetadataChange,
288
+ metadataConfigs: metadataConfigs.filter(function (mfc) {
289
+ return mfc.level === 'photo_metadata-engine';
290
+ })
291
+ }) :
292
+ /*#__PURE__*/
293
+ React.createElement(MetadataList, {
294
+ key: "article-".concat(selectedGroupId),
295
+ title: "Article",
296
+ metadata: articleMetadata,
297
+ imageIndex: state.selectedImage,
298
+ groupId: selectedGroupId,
299
+ onMetadataChange: onMetadataChange,
300
+ metadataConfigs: metadataConfigs.filter(function (mfc) {
301
+ return mfc.level === 'photo_metadata-engine';
302
+ })
303
+ })), selectedPhotoMetadata &&
304
+ /*#__PURE__*/
305
+ React.createElement(MetadataList, {
306
+ title: "Page",
307
+ metadata: selectedPhotoMetadata,
308
+ imageIndex: state.selectedImage,
309
+ onMetadataChange: onMetadataChange,
310
+ metadataConfigs: metadataConfigs.filter(function (mfc) {
311
+ return mfc.level === 'photo';
312
+ })
228
313
  }),
229
- expandedByDefault: true
230
- }, React.createElement(DivContainer, {
231
- style: {
232
- height: "600px"
233
- }
234
- }, articleMetadata.length > 0 && (isStorybookHangReproModeEnabled() ? React.createElement(MetadataList, {
235
- title: "Article",
236
- metadata: articleMetadata,
237
- imageIndex: state.selectedImage,
238
- groupId: selectedGroupId,
239
- onMetadataChange: onMetadataChange,
240
- metadataConfigs: metadataConfigs.filter(function (mfc) {
241
- return mfc.level === 'photo_metadata-engine';
242
- })
243
- }) : React.createElement(MetadataList, {
244
- key: "article-".concat(selectedGroupId),
245
- title: "Article",
246
- metadata: articleMetadata,
247
- imageIndex: state.selectedImage,
248
- groupId: selectedGroupId,
249
- onMetadataChange: onMetadataChange,
250
- metadataConfigs: metadataConfigs.filter(function (mfc) {
251
- return mfc.level === 'photo_metadata-engine';
252
- })
253
- })), selectedPhotoMetadata && React.createElement(MetadataList, {
254
- title: "Page",
255
- metadata: selectedPhotoMetadata,
256
- imageIndex: state.selectedImage,
257
- onMetadataChange: onMetadataChange,
258
- metadataConfigs: metadataConfigs.filter(function (mfc) {
259
- return mfc.level === 'photo';
260
- })
261
- }), React.createElement(MetadataList, {
262
- title: "Issue",
263
- metadata: state.albumMetadata,
264
- onMetadataChange: onMetadataChange,
265
- id: "metadata-album",
266
- metadataConfigs: metadataConfigs.filter(function (mfc) {
267
- return mfc.level === 'album';
268
- })
269
- }))));
314
+ /*#__PURE__*/
315
+ React.createElement(MetadataList, {
316
+ title: "Issue",
317
+ metadata: state.albumMetadata,
318
+ onMetadataChange: onMetadataChange,
319
+ id: "metadata-album",
320
+ metadataConfigs: metadataConfigs.filter(function (mfc) {
321
+ return mfc.level === 'album';
322
+ })
323
+ }))))
324
+ );
270
325
  };
271
326
  export default memo(MetadataEditorSidebarBox);
@@ -0,0 +1,54 @@
1
+ import React from "react";
2
+ import classnames from "classnames";
3
+ export function isUpdatedByAggregator(updatedBy) {
4
+ if (updatedBy == null) return false;
5
+ return String(updatedBy).trim() === "AGGREGATOR";
6
+ }
7
+ /**
8
+ * Case-level “UPDATED BY” indicator for the page strip (left panel).
9
+ * Red (left) / green (right) discs, left-aligned with the page-strip switch column; “Ready” after them.
10
+ * Green lit only when value is exactly AGGREGATOR.
11
+ * `selectionKey` should change per selected page so the control remounts when paging.
12
+ */
13
+
14
+ export default function UpdatedBySemaphore(_ref) {
15
+ var updatedBy = _ref.updatedBy,
16
+ selectionKey = _ref.selectionKey;
17
+ var green = isUpdatedByAggregator(updatedBy);
18
+ var source = updatedBy == null || updatedBy === "" ? "—" : String(updatedBy);
19
+ return (
20
+ /*#__PURE__*/
21
+ React.createElement("div", {
22
+ key: selectionKey,
23
+ className: "ps-updated-by-semaphore",
24
+ title: "Case last updated by: ".concat(source, ". Green disc: AGGREGATOR \u2014 OK to start manual edits. Red disc: other source \u2014 review before editing."),
25
+ role: "img",
26
+ "aria-label": green ? "OK to start manual edits (AGGREGATOR)" : "Review before manual edits (not AGGREGATOR)"
27
+ },
28
+ /*#__PURE__*/
29
+ React.createElement("span", {
30
+ className: "ps-semaphore-toggle-column",
31
+ "aria-hidden": true
32
+ },
33
+ /*#__PURE__*/
34
+ React.createElement("span", {
35
+ className: "ps-semaphore-lamps"
36
+ },
37
+ /*#__PURE__*/
38
+ React.createElement("span", {
39
+ className: classnames("ps-semaphore-lamp", "ps-semaphore-red", {
40
+ "ps-semaphore-lit": !green
41
+ })
42
+ }),
43
+ /*#__PURE__*/
44
+ React.createElement("span", {
45
+ className: classnames("ps-semaphore-lamp", "ps-semaphore-green", {
46
+ "ps-semaphore-lit": green
47
+ })
48
+ }))),
49
+ /*#__PURE__*/
50
+ React.createElement("span", {
51
+ className: "ps-top-bar-label ps-updated-by-semaphore__label"
52
+ }, "Ready"))
53
+ );
54
+ }