@searpent/react-image-annotate 2.3.4 → 2.3.6

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 +28 -28
  2. package/Annotator/examplePhotos_repr.js +28 -28
  3. package/Annotator/index.js +40 -31
  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 +258 -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 +95 -0
  38. package/PageSelector/index.js +181 -97
  39. package/PageSelector/page-selector.css +118 -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
package/MetadataEditorSidebarBox/index.js CHANGED
@@ -54,57 +54,84 @@ var MetadataItem = function MetadataItem(_ref2) {
54
54
  });
55
55
  };
56
56
 
57
- return React.createElement(MetadataItemDiv, null, React.createElement("label", {
58
- for: name
59
- }, name), React.createElement("div", {
60
- style: {
61
- width: "50%"
62
- }
63
- }, (metadataConfig === null || metadataConfig === void 0 ? void 0 : metadataConfig.selectable) !== true && React.createElement(React.Fragment, null, React.createElement("input", {
64
- type: "text",
65
- value: normalizedValue,
66
- name: name,
67
- onChange: handleChange,
68
- id: name,
69
- list: "".concat(name, "-list"),
70
- style: {
71
- width: "100%"
72
- }
73
- }), React.createElement("datalist", {
74
- id: "".concat(name, "-list")
75
- }, metadataConfig === null || metadataConfig === void 0 ? void 0 : (_metadataConfig$optio = metadataConfig.options) === null || _metadataConfig$optio === void 0 ? void 0 : _metadataConfig$optio.map(function (opt) {
76
- if (opt.value && opt.label) {
77
- return React.createElement("option", {
78
- key: opt.value,
79
- value: opt.value
80
- }, opt.label);
81
- }
57
+ return (
58
+ /*#__PURE__*/
59
+ React.createElement(MetadataItemDiv, null,
60
+ /*#__PURE__*/
61
+ React.createElement("label", {
62
+ "for": name
63
+ }, name),
64
+ /*#__PURE__*/
65
+ React.createElement("div", {
66
+ style: {
67
+ width: "50%"
68
+ }
69
+ }, (metadataConfig === null || metadataConfig === void 0 ? void 0 : metadataConfig.selectable) !== true &&
70
+ /*#__PURE__*/
71
+ React.createElement(React.Fragment, null,
72
+ /*#__PURE__*/
73
+ React.createElement("input", {
74
+ type: "text",
75
+ value: normalizedValue,
76
+ name: name,
77
+ onChange: handleChange,
78
+ id: name,
79
+ list: "".concat(name, "-list"),
80
+ style: {
81
+ width: "100%"
82
+ }
83
+ }),
84
+ /*#__PURE__*/
85
+ React.createElement("datalist", {
86
+ id: "".concat(name, "-list")
87
+ }, metadataConfig === null || metadataConfig === void 0 ? void 0 : (_metadataConfig$optio = metadataConfig.options) === null || _metadataConfig$optio === void 0 ? void 0 : _metadataConfig$optio.map(function (opt) {
88
+ if (opt.value && opt.label) {
89
+ return (
90
+ /*#__PURE__*/
91
+ React.createElement("option", {
92
+ key: opt.value,
93
+ value: opt.value
94
+ }, opt.label)
95
+ );
96
+ }
82
97
 
83
- return React.createElement("option", {
84
- key: opt,
85
- value: opt
86
- });
87
- }))), (metadataConfig === null || metadataConfig === void 0 ? void 0 : metadataConfig.selectable) === true && React.createElement("select", {
88
- name: name,
89
- id: name,
90
- onChange: handleChange,
91
- style: {
92
- width: '100%'
93
- }
94
- }, metadataConfig === null || metadataConfig === void 0 ? void 0 : (_metadataConfig$optio2 = metadataConfig.options) === null || _metadataConfig$optio2 === void 0 ? void 0 : _metadataConfig$optio2.map(function (opt) {
95
- if (opt.value && opt.label) {
96
- return React.createElement("option", {
97
- key: opt.value,
98
- value: opt.value,
99
- selected: opt.value === normalizedValue
100
- }, opt.label);
101
- }
98
+ return (
99
+ /*#__PURE__*/
100
+ React.createElement("option", {
101
+ key: opt,
102
+ value: opt
103
+ })
104
+ );
105
+ }))), (metadataConfig === null || metadataConfig === void 0 ? void 0 : metadataConfig.selectable) === true &&
106
+ /*#__PURE__*/
107
+ React.createElement("select", {
108
+ name: name,
109
+ id: name,
110
+ onChange: handleChange,
111
+ style: {
112
+ width: '100%'
113
+ }
114
+ }, metadataConfig === null || metadataConfig === void 0 ? void 0 : (_metadataConfig$optio2 = metadataConfig.options) === null || _metadataConfig$optio2 === void 0 ? void 0 : _metadataConfig$optio2.map(function (opt) {
115
+ if (opt.value && opt.label) {
116
+ return (
117
+ /*#__PURE__*/
118
+ React.createElement("option", {
119
+ key: opt.value,
120
+ value: opt.value,
121
+ selected: opt.value === normalizedValue
122
+ }, opt.label)
123
+ );
124
+ }
102
125
 
103
- return React.createElement("option", {
104
- key: opt,
105
- value: opt
106
- });
107
- }))));
126
+ return (
127
+ /*#__PURE__*/
128
+ React.createElement("option", {
129
+ key: opt,
130
+ value: opt
131
+ })
132
+ );
133
+ }))))
134
+ );
108
135
  };
109
136
 
110
137
  var MetadataList = function MetadataList(_ref3) {
@@ -115,22 +142,30 @@ var MetadataList = function MetadataList(_ref3) {
115
142
  _ref3$metadataConfigs = _ref3.metadataConfigs,
116
143
  metadataConfigs = _ref3$metadataConfigs === void 0 ? [] : _ref3$metadataConfigs,
117
144
  groupId = _ref3.groupId;
118
- return React.createElement("div", null, React.createElement("h2", null, title), metadata && metadata.map(function (_ref4) {
119
- var key = _ref4.key,
120
- value = _ref4.value,
121
- metadataId = _ref4.metadataId;
122
- return React.createElement(MetadataItem, {
123
- name: key,
124
- value: value,
125
- imageIndex: imageIndex,
126
- metadataId: metadataId,
127
- groupId: groupId,
128
- onChange: onMetadataChange,
129
- metadataConfig: metadataConfigs.find(function (i) {
130
- return i.key === key;
131
- })
132
- });
133
- }));
145
+ return (
146
+ /*#__PURE__*/
147
+ React.createElement("div", null,
148
+ /*#__PURE__*/
149
+ React.createElement("h2", null, title), metadata && metadata.map(function (_ref4) {
150
+ var key = _ref4.key,
151
+ value = _ref4.value,
152
+ metadataId = _ref4.metadataId;
153
+ return (
154
+ /*#__PURE__*/
155
+ React.createElement(MetadataItem, {
156
+ name: key,
157
+ value: value,
158
+ imageIndex: imageIndex,
159
+ metadataId: metadataId,
160
+ groupId: groupId,
161
+ onChange: onMetadataChange,
162
+ metadataConfig: metadataConfigs.find(function (i) {
163
+ return i.key === key;
164
+ })
165
+ })
166
+ );
167
+ }))
168
+ );
134
169
  };
135
170
 
136
171
  var theme = createTheme();
@@ -190,45 +225,60 @@ export var MetadataEditorSidebarBox = function MetadataEditorSidebarBox(_ref6) {
190
225
  }
191
226
  }
192
227
 
193
- return React.createElement(ThemeProvider, {
194
- theme: theme
195
- }, React.createElement(SidebarBoxContainer, {
196
- title: "Metadata",
197
- icon: React.createElement(DescriptionIcon, {
228
+ return (
229
+ /*#__PURE__*/
230
+ React.createElement(ThemeProvider, {
231
+ theme: theme
232
+ },
233
+ /*#__PURE__*/
234
+ React.createElement(SidebarBoxContainer, {
235
+ title: "Metadata",
236
+ icon:
237
+ /*#__PURE__*/
238
+ React.createElement(DescriptionIcon, {
239
+ style: {
240
+ color: grey[700]
241
+ }
242
+ }),
243
+ expandedByDefault: true
244
+ },
245
+ /*#__PURE__*/
246
+ React.createElement(DivContainer, {
198
247
  style: {
199
- color: grey[700]
248
+ height: "600px"
200
249
  }
250
+ }, articleMetadata.length > 0 &&
251
+ /*#__PURE__*/
252
+ React.createElement(MetadataList, {
253
+ title: "Article",
254
+ metadata: articleMetadata,
255
+ imageIndex: state.selectedImage,
256
+ groupId: selectedGroupId,
257
+ onMetadataChange: onMetadataChange,
258
+ metadataConfigs: metadataConfigs.filter(function (mfc) {
259
+ return mfc.level === 'photo_metadata-engine';
260
+ })
261
+ }), selectedPhotoMetadata &&
262
+ /*#__PURE__*/
263
+ React.createElement(MetadataList, {
264
+ title: "Page",
265
+ metadata: selectedPhotoMetadata,
266
+ imageIndex: state.selectedImage,
267
+ onMetadataChange: onMetadataChange,
268
+ metadataConfigs: metadataConfigs.filter(function (mfc) {
269
+ return mfc.level === 'photo';
270
+ })
201
271
  }),
202
- expandedByDefault: true
203
- }, React.createElement(DivContainer, {
204
- style: {
205
- height: "600px"
206
- }
207
- }, articleMetadata.length > 0 && React.createElement(MetadataList, {
208
- title: "Article",
209
- metadata: articleMetadata,
210
- imageIndex: state.selectedImage,
211
- groupId: selectedGroupId,
212
- onMetadataChange: onMetadataChange,
213
- metadataConfigs: metadataConfigs.filter(function (mfc) {
214
- return mfc.level === 'photo_metadata-engine';
215
- })
216
- }), selectedPhotoMetadata && React.createElement(MetadataList, {
217
- title: "Page",
218
- metadata: selectedPhotoMetadata,
219
- imageIndex: state.selectedImage,
220
- onMetadataChange: onMetadataChange,
221
- metadataConfigs: metadataConfigs.filter(function (mfc) {
222
- return mfc.level === 'photo';
223
- })
224
- }), React.createElement(MetadataList, {
225
- title: "Issue",
226
- metadata: state.albumMetadata,
227
- onMetadataChange: onMetadataChange,
228
- id: "metadata-album",
229
- metadataConfigs: metadataConfigs.filter(function (mfc) {
230
- return mfc.level === 'album';
231
- })
232
- }))));
272
+ /*#__PURE__*/
273
+ React.createElement(MetadataList, {
274
+ title: "Issue",
275
+ metadata: state.albumMetadata,
276
+ onMetadataChange: onMetadataChange,
277
+ id: "metadata-album",
278
+ metadataConfigs: metadataConfigs.filter(function (mfc) {
279
+ return mfc.level === 'album';
280
+ })
281
+ }))))
282
+ );
233
283
  };
234
284
  export default memo(MetadataEditorSidebarBox);
package/MetadataEditorSidebarBox/index_14_01_25.js CHANGED
@@ -51,57 +51,84 @@ var MetadataItem = function MetadataItem(_ref2) {
51
51
  });
52
52
  };
53
53
 
54
- return React.createElement(MetadataItemDiv, null, React.createElement("label", {
55
- for: name
56
- }, name), React.createElement("div", {
57
- style: {
58
- width: "50%"
59
- }
60
- }, (metadataConfig === null || metadataConfig === void 0 ? void 0 : metadataConfig.selectable) !== true && React.createElement(React.Fragment, null, React.createElement("input", {
61
- type: "text",
62
- value: value,
63
- name: name,
64
- onChange: handleChange,
65
- id: name,
66
- list: "".concat(name, "-list"),
67
- style: {
68
- width: "100%"
69
- }
70
- }), React.createElement("datalist", {
71
- id: "".concat(name, "-list")
72
- }, metadataConfig === null || metadataConfig === void 0 ? void 0 : (_metadataConfig$optio = metadataConfig.options) === null || _metadataConfig$optio === void 0 ? void 0 : _metadataConfig$optio.map(function (opt) {
73
- if (opt.value && opt.label) {
74
- return React.createElement("option", {
75
- key: opt.value,
76
- value: opt.value
77
- }, opt.label);
78
- }
54
+ return (
55
+ /*#__PURE__*/
56
+ React.createElement(MetadataItemDiv, null,
57
+ /*#__PURE__*/
58
+ React.createElement("label", {
59
+ "for": name
60
+ }, name),
61
+ /*#__PURE__*/
62
+ React.createElement("div", {
63
+ style: {
64
+ width: "50%"
65
+ }
66
+ }, (metadataConfig === null || metadataConfig === void 0 ? void 0 : metadataConfig.selectable) !== true &&
67
+ /*#__PURE__*/
68
+ React.createElement(React.Fragment, null,
69
+ /*#__PURE__*/
70
+ React.createElement("input", {
71
+ type: "text",
72
+ value: value,
73
+ name: name,
74
+ onChange: handleChange,
75
+ id: name,
76
+ list: "".concat(name, "-list"),
77
+ style: {
78
+ width: "100%"
79
+ }
80
+ }),
81
+ /*#__PURE__*/
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 (
87
+ /*#__PURE__*/
88
+ React.createElement("option", {
89
+ key: opt.value,
90
+ value: opt.value
91
+ }, opt.label)
92
+ );
93
+ }
79
94
 
80
- return React.createElement("option", {
81
- key: opt,
82
- value: opt
83
- });
84
- }))), (metadataConfig === null || metadataConfig === void 0 ? void 0 : metadataConfig.selectable) === true && React.createElement("select", {
85
- name: name,
86
- id: name,
87
- value: value || '',
88
- onChange: handleChange,
89
- style: {
90
- width: '100%'
91
- }
92
- }, metadataConfig === null || metadataConfig === void 0 ? void 0 : (_metadataConfig$optio2 = metadataConfig.options) === null || _metadataConfig$optio2 === void 0 ? void 0 : _metadataConfig$optio2.map(function (opt) {
93
- if (opt.value && opt.label) {
94
- return React.createElement("option", {
95
- key: opt.value,
96
- value: opt.value
97
- }, opt.label);
98
- }
95
+ return (
96
+ /*#__PURE__*/
97
+ React.createElement("option", {
98
+ key: opt,
99
+ value: opt
100
+ })
101
+ );
102
+ }))), (metadataConfig === null || metadataConfig === void 0 ? void 0 : metadataConfig.selectable) === true &&
103
+ /*#__PURE__*/
104
+ React.createElement("select", {
105
+ name: name,
106
+ id: name,
107
+ value: value || '',
108
+ onChange: handleChange,
109
+ style: {
110
+ width: '100%'
111
+ }
112
+ }, metadataConfig === null || metadataConfig === void 0 ? void 0 : (_metadataConfig$optio2 = metadataConfig.options) === null || _metadataConfig$optio2 === void 0 ? void 0 : _metadataConfig$optio2.map(function (opt) {
113
+ if (opt.value && opt.label) {
114
+ return (
115
+ /*#__PURE__*/
116
+ React.createElement("option", {
117
+ key: opt.value,
118
+ value: opt.value
119
+ }, opt.label)
120
+ );
121
+ }
99
122
 
100
- return React.createElement("option", {
101
- key: opt,
102
- value: opt
103
- });
104
- }))));
123
+ return (
124
+ /*#__PURE__*/
125
+ React.createElement("option", {
126
+ key: opt,
127
+ value: opt
128
+ })
129
+ );
130
+ }))))
131
+ );
105
132
  };
106
133
 
107
134
  var MetadataList = function MetadataList(_ref3) {
@@ -112,22 +139,30 @@ var MetadataList = function MetadataList(_ref3) {
112
139
  _ref3$metadataConfigs = _ref3.metadataConfigs,
113
140
  metadataConfigs = _ref3$metadataConfigs === void 0 ? [] : _ref3$metadataConfigs,
114
141
  groupId = _ref3.groupId;
115
- return React.createElement("div", null, React.createElement("h2", null, title), metadata && metadata.map(function (_ref4) {
116
- var key = _ref4.key,
117
- value = _ref4.value,
118
- metadataId = _ref4.metadataId;
119
- return React.createElement(MetadataItem, {
120
- name: key,
121
- value: value,
122
- imageIndex: imageIndex,
123
- metadataId: metadataId,
124
- groupId: groupId,
125
- onChange: onMetadataChange,
126
- metadataConfig: metadataConfigs.find(function (i) {
127
- return i.key === key;
128
- })
129
- });
130
- }));
142
+ return (
143
+ /*#__PURE__*/
144
+ React.createElement("div", null,
145
+ /*#__PURE__*/
146
+ React.createElement("h2", null, title), metadata && metadata.map(function (_ref4) {
147
+ var key = _ref4.key,
148
+ value = _ref4.value,
149
+ metadataId = _ref4.metadataId;
150
+ return (
151
+ /*#__PURE__*/
152
+ React.createElement(MetadataItem, {
153
+ name: key,
154
+ value: value,
155
+ imageIndex: imageIndex,
156
+ metadataId: metadataId,
157
+ groupId: groupId,
158
+ onChange: onMetadataChange,
159
+ metadataConfig: metadataConfigs.find(function (i) {
160
+ return i.key === key;
161
+ })
162
+ })
163
+ );
164
+ }))
165
+ );
131
166
  };
132
167
 
133
168
  var theme = createTheme();
@@ -187,45 +222,60 @@ export var MetadataEditorSidebarBox = function MetadataEditorSidebarBox(_ref6) {
187
222
  }
188
223
  }
189
224
 
190
- return React.createElement(ThemeProvider, {
191
- theme: theme
192
- }, React.createElement(SidebarBoxContainer, {
193
- title: "Metadata",
194
- icon: React.createElement(DescriptionIcon, {
225
+ return (
226
+ /*#__PURE__*/
227
+ React.createElement(ThemeProvider, {
228
+ theme: theme
229
+ },
230
+ /*#__PURE__*/
231
+ React.createElement(SidebarBoxContainer, {
232
+ title: "Metadata",
233
+ icon:
234
+ /*#__PURE__*/
235
+ React.createElement(DescriptionIcon, {
236
+ style: {
237
+ color: grey[700]
238
+ }
239
+ }),
240
+ expandedByDefault: true
241
+ },
242
+ /*#__PURE__*/
243
+ React.createElement(DivContainer, {
195
244
  style: {
196
- color: grey[700]
245
+ height: "600px"
197
246
  }
247
+ }, articleMetadata.length > 0 &&
248
+ /*#__PURE__*/
249
+ React.createElement(MetadataList, {
250
+ title: "Article",
251
+ metadata: articleMetadata,
252
+ imageIndex: state.selectedImage,
253
+ groupId: selectedGroupId,
254
+ onMetadataChange: onMetadataChange,
255
+ metadataConfigs: metadataConfigs.filter(function (mfc) {
256
+ return mfc.level === 'photo_metadata-engine';
257
+ })
258
+ }), selectedPhotoMetadata &&
259
+ /*#__PURE__*/
260
+ React.createElement(MetadataList, {
261
+ title: "Page",
262
+ metadata: selectedPhotoMetadata,
263
+ imageIndex: state.selectedImage,
264
+ onMetadataChange: onMetadataChange,
265
+ metadataConfigs: metadataConfigs.filter(function (mfc) {
266
+ return mfc.level === 'photo';
267
+ })
198
268
  }),
199
- expandedByDefault: true
200
- }, React.createElement(DivContainer, {
201
- style: {
202
- height: "600px"
203
- }
204
- }, articleMetadata.length > 0 && React.createElement(MetadataList, {
205
- title: "Article",
206
- metadata: articleMetadata,
207
- imageIndex: state.selectedImage,
208
- groupId: selectedGroupId,
209
- onMetadataChange: onMetadataChange,
210
- metadataConfigs: metadataConfigs.filter(function (mfc) {
211
- return mfc.level === 'photo_metadata-engine';
212
- })
213
- }), selectedPhotoMetadata && React.createElement(MetadataList, {
214
- title: "Page",
215
- metadata: selectedPhotoMetadata,
216
- imageIndex: state.selectedImage,
217
- onMetadataChange: onMetadataChange,
218
- metadataConfigs: metadataConfigs.filter(function (mfc) {
219
- return mfc.level === 'photo';
220
- })
221
- }), React.createElement(MetadataList, {
222
- title: "Issue",
223
- metadata: state.albumMetadata,
224
- onMetadataChange: onMetadataChange,
225
- id: "metadata-album",
226
- metadataConfigs: metadataConfigs.filter(function (mfc) {
227
- return mfc.level === 'album';
228
- })
229
- }))));
269
+ /*#__PURE__*/
270
+ React.createElement(MetadataList, {
271
+ title: "Issue",
272
+ metadata: state.albumMetadata,
273
+ onMetadataChange: onMetadataChange,
274
+ id: "metadata-album",
275
+ metadataConfigs: metadataConfigs.filter(function (mfc) {
276
+ return mfc.level === 'album';
277
+ })
278
+ }))))
279
+ );
230
280
  };
231
281
  export default memo(MetadataEditorSidebarBox);