@searpent/react-image-annotate 2.3.3 → 2.3.5

package/GroupsEditorSidebarBox/index.js

@@ -23,17 +23,28 @@ var GroupItemDiv = styled("div")(function (_ref) {
 
 var GroupItem = function GroupItem(_ref2) {
   var group = _ref2.group;
-  return React.createElement(GroupItemDiv, null, uuidToHash(group.id));
+  return (
+    /*#__PURE__*/
+    React.createElement(GroupItemDiv, null, uuidToHash(group.id))
+  );
 };
 
 var GroupList = function GroupList(_ref3) {
   var groups = _ref3.groups;
-  return React.createElement("div", null, React.createElement("h2", null, "Groups"), groups.map(function (g, idx) {
-    return React.createElement(GroupItem, {
-      key: "".concat(g, "-").concat(idx),
-      group: g
-    });
-  }));
+  return (
+    /*#__PURE__*/
+    React.createElement("div", null,
+    /*#__PURE__*/
+    React.createElement("h2", null, "Groups"), groups.map(function (g, idx) {
+      return (
+        /*#__PURE__*/
+        React.createElement(GroupItem, {
+          key: "".concat(g, "-").concat(idx),
+          group: g
+        })
+      );
+    }))
+  );
 };
 
 var AddGroupFormDiv = styled("div")(function (_ref4) {
@@ -62,25 +73,34 @@ var AddGroupFrom = function AddGroupFrom(_ref5) {
     setValue('');
   };
 
-  return React.createElement(AddGroupFormDiv, null, React.createElement("form", {
-    onSubmit: handleSubmit,
-    style: {
-      display: "flex",
-      paddingRight: "6px"
-    }
-  }, React.createElement("input", {
-    type: "text",
-    value: value,
-    name: "new-group",
-    placeholder: "New group name",
-    onChange: handleChange,
-    style: {
-      marginRight: "1rem"
-    }
-  }), React.createElement("input", {
-    type: "submit",
-    value: "Create group"
-  })));
+  return (
+    /*#__PURE__*/
+    React.createElement(AddGroupFormDiv, null,
+    /*#__PURE__*/
+    React.createElement("form", {
+      onSubmit: handleSubmit,
+      style: {
+        display: "flex",
+        paddingRight: "6px"
+      }
+    },
+    /*#__PURE__*/
+    React.createElement("input", {
+      type: "text",
+      value: value,
+      name: "new-group",
+      placeholder: "New group name",
+      onChange: handleChange,
+      style: {
+        marginRight: "1rem"
+      }
+    }),
+    /*#__PURE__*/
+    React.createElement("input", {
+      type: "submit",
+      value: "Create group"
+    })))
+  );
 };
 
 var DivContainer = styled("div")(function (_ref6) {
@@ -119,20 +139,35 @@ var DivContainer = styled("div")(function (_ref6) {
 export var GroupsEditorSidebarBox = function GroupsEditorSidebarBox(_ref7) {
   var groups = _ref7.groups,
       onAddGroup = _ref7.onAddGroup;
-  return React.createElement(ThemeProvider, {
-    theme: theme
-  }, React.createElement(SidebarBoxContainer, {
-    title: "Groups",
-    icon: React.createElement(FilterNoneIcon, {
-      style: {
-        color: grey[700]
-      }
+  return (
+    /*#__PURE__*/
+    React.createElement(ThemeProvider, {
+      theme: theme
+    },
+    /*#__PURE__*/
+    React.createElement(SidebarBoxContainer, {
+      title: "Groups",
+      icon:
+      /*#__PURE__*/
+      React.createElement(FilterNoneIcon, {
+        style: {
+          color: grey[700]
+        }
+      }),
+      expandedByDefault: true
+    },
+    /*#__PURE__*/
+    React.createElement(DivContainer, null,
+    /*#__PURE__*/
+    React.createElement("h2", null, "Add new group"),
+    /*#__PURE__*/
+    React.createElement(AddGroupFrom, {
+      onAddGroup: onAddGroup
     }),
-    expandedByDefault: true
-  }, React.createElement(DivContainer, null, React.createElement("h2", null, "Add new group"), React.createElement(AddGroupFrom, {
-    onAddGroup: onAddGroup
-  }), React.createElement(GroupList, {
-    groups: groups
-  }))));
+    /*#__PURE__*/
+    React.createElement(GroupList, {
+      groups: groups
+    }))))
+  );
 };
 export default memo(GroupsEditorSidebarBox);

package/HelpSidebarBox/index.js

@@ -41,18 +41,29 @@ var MarkdownContainer = styled("div")(function (_ref) {
 });
 export var HelpSidebarBox = function HelpSidebarBox(_ref2) {
   var help = _ref2.help;
-  return React.createElement(ThemeProvider, {
-    theme: theme
-  }, React.createElement(SidebarBoxContainer, {
-    title: "Help",
-    icon: React.createElement(HelpIcon, {
-      style: {
-        color: grey[700]
-      }
-    }),
-    expandedByDefault: help && help !== "" ? false : true
-  }, React.createElement(MarkdownContainer, null, React.createElement(Markdown, {
-    source: help
-  }))));
+  return (
+    /*#__PURE__*/
+    React.createElement(ThemeProvider, {
+      theme: theme
+    },
+    /*#__PURE__*/
+    React.createElement(SidebarBoxContainer, {
+      title: "Help",
+      icon:
+      /*#__PURE__*/
+      React.createElement(HelpIcon, {
+        style: {
+          color: grey[700]
+        }
+      }),
+      expandedByDefault: help && help !== "" ? false : true
+    },
+    /*#__PURE__*/
+    React.createElement(MarkdownContainer, null,
+    /*#__PURE__*/
+    React.createElement(Markdown, {
+      source: help
+    }))))
+  );
 };
 export default memo(HelpSidebarBox);

package/HighlightBox/index.js

@@ -67,36 +67,43 @@ export var HighlightBox = function HighlightBox(_ref) {
     height: pbox.h + 10
   };
   var pathD = r.type === "point" ? "M5,5 L".concat(styleCoords.width - 5, " 5L").concat(styleCoords.width - 5, " ").concat(styleCoords.height - 5, "L5 ").concat(styleCoords.height - 5, "Z") : "M5,5 L".concat(pbox.w + 5, ",5 L").concat(pbox.w + 5, ",").concat(pbox.h + 5, " L5,").concat(pbox.h + 5, " Z");
-  return React.createElement(ThemeProvider, {
-    theme: theme
-  }, React.createElement("svg", Object.assign({
-    key: r.id,
-    className: classnames(classes.highlightBox, {
-      highlighted: r.highlighted
-    })
-  }, mouseEvents, !zoomWithPrimary && !dragWithPrimary ? {
-    onMouseDown: function onMouseDown(e) {
-      if (!r.locked && r.type === "point" && r.highlighted && e.button === 0) {
-        return onBeginMovePoint(r);
-      }
+  return (
+    /*#__PURE__*/
+    React.createElement(ThemeProvider, {
+      theme: theme
+    },
+    /*#__PURE__*/
+    React.createElement("svg", Object.assign({
+      key: r.id,
+      className: classnames(classes.highlightBox, {
+        highlighted: r.highlighted
+      })
+    }, mouseEvents, !zoomWithPrimary && !dragWithPrimary ? {
+      onMouseDown: function onMouseDown(e) {
+        if (!r.locked && r.type === "point" && r.highlighted && e.button === 0) {
+          return onBeginMovePoint(r);
+        }
 
-      if (e.button === 0 && !createWithPrimary) return onSelectRegion(_objectSpread({}, r, {
-        ctrlKey: e.ctrlKey
-      }));
-      mouseEvents.onMouseDown(e);
-    }
-  } : {}, {
-    style: _objectSpread({}, r.highlighted ? {
-      pointerEvents: r.type !== "point" ? "none" : undefined,
-      cursor: "grab"
-    } : {
-      cursor: !(zoomWithPrimary || dragWithPrimary || createWithPrimary) ? "pointer" : undefined,
-      pointerEvents: zoomWithPrimary || dragWithPrimary || createWithPrimary && !r.highlighted ? "none" : undefined
-    }, {
-      position: "absolute"
-    }, styleCoords)
-  }), React.createElement("path", {
-    d: pathD
-  })));
+        if (e.button === 0 && !createWithPrimary) return onSelectRegion(_objectSpread({}, r, {
+          ctrlKey: e.ctrlKey
+        }));
+        mouseEvents.onMouseDown(e);
+      }
+    } : {}, {
+      style: _objectSpread({}, r.highlighted ? {
+        pointerEvents: r.type !== "point" ? "none" : undefined,
+        cursor: "grab"
+      } : {
+        cursor: !(zoomWithPrimary || dragWithPrimary || createWithPrimary) ? "pointer" : undefined,
+        pointerEvents: zoomWithPrimary || dragWithPrimary || createWithPrimary && !r.highlighted ? "none" : undefined
+      }, {
+        position: "absolute"
+      }, styleCoords)
+    }),
+    /*#__PURE__*/
+    React.createElement("path", {
+      d: pathD
+    })))
+  );
 };
 export default HighlightBox;

package/HistorySidebarBox/index.js

@@ -32,35 +32,57 @@ export var HistorySidebarBox = function HistorySidebarBox(_ref) {
   var history = _ref.history,
       onRestoreHistory = _ref.onRestoreHistory;
   var classes = useStyles();
-  return React.createElement(ThemeProvider, {
-    theme: theme
-  }, React.createElement(SidebarBoxContainer, {
-    title: "History",
-    icon: React.createElement(HistoryIcon, {
-      style: {
-        color: grey[700]
-      }
-    }),
-    expandedByDefault: true
-  }, React.createElement(List, null, history.length === 0 && React.createElement("div", {
-    className: classes.emptyText
-  }, "No History Yet"), history.map(function (_ref2, i) {
-    var name = _ref2.name,
-        time = _ref2.time;
-    return React.createElement(ListItem, {
-      button: true,
-      dense: true,
-      key: i
-    }, React.createElement(ListItemText, {
-      style: listItemTextStyle,
-      primary: name,
-      secondary: moment(time).format("LT")
-    }), i === 0 && React.createElement(ListItemSecondaryAction, {
-      onClick: function onClick() {
-        return onRestoreHistory();
-      }
-    }, React.createElement(IconButton, null, React.createElement(UndoIcon, null))));
-  }))));
+  return (
+    /*#__PURE__*/
+    React.createElement(ThemeProvider, {
+      theme: theme
+    },
+    /*#__PURE__*/
+    React.createElement(SidebarBoxContainer, {
+      title: "History",
+      icon:
+      /*#__PURE__*/
+      React.createElement(HistoryIcon, {
+        style: {
+          color: grey[700]
+        }
+      }),
+      expandedByDefault: true
+    },
+    /*#__PURE__*/
+    React.createElement(List, null, history.length === 0 &&
+    /*#__PURE__*/
+    React.createElement("div", {
+      className: classes.emptyText
+    }, "No History Yet"), history.map(function (_ref2, i) {
+      var name = _ref2.name,
+          time = _ref2.time;
+      return (
+        /*#__PURE__*/
+        React.createElement(ListItem, {
+          button: true,
+          dense: true,
+          key: i
+        },
+        /*#__PURE__*/
+        React.createElement(ListItemText, {
+          style: listItemTextStyle,
+          primary: name,
+          secondary: moment(time).format("LT")
+        }), i === 0 &&
+        /*#__PURE__*/
+        React.createElement(ListItemSecondaryAction, {
+          onClick: function onClick() {
+            return onRestoreHistory();
+          }
+        },
+        /*#__PURE__*/
+        React.createElement(IconButton, null,
+        /*#__PURE__*/
+        React.createElement(UndoIcon, null))))
+      );
+    }))))
+  );
 };
 export default memo(HistorySidebarBox, function (prevProps, nextProps) {
   return isEqual(prevProps.history.map(function (a) {

package/ImageCanvas/index.js

@@ -306,136 +306,171 @@ export var ImageCanvas = function ImageCanvas(_ref2) {
     if (highlightedRegions.length !== 1) return null;
     return highlightedRegions[0];
   }, [regions]);
-  return React.createElement(ThemeProvider, {
-    theme: theme
-  }, React.createElement("div", {
-    style: {
-      width: "100%",
-      height: "100vh",
-      position: "relative",
-      overflow: "hidden",
-      cursor: createWithPrimary ? "crosshair" : dragging ? "grabbing" : dragWithPrimary ? "grab" : zoomWithPrimary ? mat.a < 1 ? "zoom-out" : "zoom-in" : undefined
-    }
-  }, showCrosshairs && React.createElement(Crosshairs, {
-    key: "crossHairs",
-    mousePosition: mousePosition
-  }), imageLoaded && !dragging && React.createElement(RegionSelectAndTransformBoxes, {
-    key: "regionSelectAndTransformBoxes",
-    regions: !modifyingAllowedArea || !allowedArea ? regions : [{
-      type: "box",
-      id: "$$allowed_area",
-      cls: "allowed_area",
-      highlighted: true,
-      x: allowedArea.x,
-      y: allowedArea.y,
-      w: allowedArea.w,
-      h: allowedArea.h,
-      visible: true,
-      color: "#ff0"
-    }],
-    mouseEvents: mouseEvents,
-    projectRegionBox: projectRegionBox,
-    dragWithPrimary: dragWithPrimary,
-    createWithPrimary: createWithPrimary,
-    zoomWithPrimary: zoomWithPrimary,
-    onBeginMovePoint: onBeginMovePoint,
-    onSelectRegion: onSelectRegion,
-    layoutParams: layoutParams,
-    mat: mat,
-    onBeginBoxTransform: onBeginBoxTransform,
-    onBeginMovePolygonPoint: onBeginMovePolygonPoint,
-    onBeginMoveKeypoint: onBeginMoveKeypoint,
-    onAddPolygonPoint: onAddPolygonPoint,
-    showHighlightBox: showHighlightBox
-  }), imageLoaded && showTags && !dragging && React.createElement(PreventScrollToParents, {
-    key: "regionTags"
-  }, React.createElement(RegionTags, {
-    regions: regions,
-    projectRegionBox: projectRegionBox,
-    mouseEvents: mouseEvents,
-    regionClsList: regionClsList,
-    regionTagList: regionTagList,
-    onBeginRegionEdit: onBeginRegionEdit,
-    onChangeRegion: onChangeRegion,
-    onCloseRegionEdit: onCloseRegionEdit,
-    onDeleteRegion: onDeleteRegion,
-    onDeleteGroup: onDeleteGroup,
-    layoutParams: layoutParams,
-    imageSrc: imageSrc,
-    RegionEditLabel: RegionEditLabel,
-    onRegionClassAdded: onRegionClassAdded,
-    allowComments: allowComments,
-    hideNotEditingLabel: hideNotEditingLabel,
-    allowedGroups: allowedGroups
-  })), !showTags && highlightedRegion && React.createElement("div", {
-    key: "topLeftTag",
-    className: classes.fixedRegionLabel
-  }, React.createElement(RegionLabel, {
-    disableClose: true,
-    allowedClasses: regionClsList,
-    allowedTags: regionTagList,
-    onChange: onChangeRegion,
-    onDelete: onDeleteRegion,
-    onDeleteGroup: onDeleteGroup,
-    editing: true,
-    region: highlightedRegion,
-    imageSrc: imageSrc,
-    allowComments: allowComments
-  })), zoomWithPrimary && zoomBox !== null && React.createElement("div", {
-    key: "zoomBox",
-    style: {
-      position: "absolute",
-      zIndex: 1,
-      border: "1px solid #fff",
-      pointerEvents: "none",
-      left: zoomBox.x,
-      top: zoomBox.y,
-      width: zoomBox.w,
-      height: zoomBox.h
-    }
-  }), showPointDistances && React.createElement(PointDistances, {
-    key: "pointDistances",
-    regions: regions,
-    realSize: realSize,
-    projectRegionBox: projectRegionBox,
-    pointDistancePrecision: pointDistancePrecision
-  }), React.createElement(PreventScrollToParents, Object.assign({
-    style: {
-      width: "100%",
-      height: "100%"
-    }
-  }, mouseEvents), React.createElement(React.Fragment, null, fullImageSegmentationMode && React.createElement(ImageMask, {
-    hide: !showMask,
-    autoSegmentationOptions: autoSegmentationOptions,
-    imagePosition: imagePosition,
-    regionClsList: regionClsList,
-    imageSrc: imageSrc,
-    regions: regions
-  }), React.createElement("canvas", {
-    style: {
-      opacity: 0.25
+  return (
+    /*#__PURE__*/
+    React.createElement(ThemeProvider, {
+      theme: theme
     },
-    className: classes.canvas,
-    ref: canvasEl
-  }), React.createElement(RegionShapes, {
-    mat: mat,
-    keypointDefinitions: keypointDefinitions,
-    imagePosition: imagePosition,
-    regions: regions,
-    fullSegmentationMode: fullImageSegmentationMode
-  }), React.createElement(VideoOrImageCanvasBackground, {
-    videoPlaying: videoPlaying,
-    imagePosition: imagePosition,
-    mouseEvents: mouseEvents,
-    onLoad: onVideoOrImageLoaded,
-    videoTime: videoTime,
-    videoSrc: videoSrc,
-    imageSrc: imageSrc,
-    useCrossOrigin: fullImageSegmentationMode,
-    onChangeVideoTime: onChangeVideoTime,
-    onChangeVideoPlaying: onChangeVideoPlaying
-  }))), React.createElement("div", {
-    className: classes.zoomIndicator
-  }, (1 / mat.a * 100).toFixed(0), "%")));
+    /*#__PURE__*/
+    React.createElement("div", {
+      style: {
+        width: "100%",
+        height: "100vh",
+        position: "relative",
+        overflow: "hidden",
+        cursor: createWithPrimary ? "crosshair" : dragging ? "grabbing" : dragWithPrimary ? "grab" : zoomWithPrimary ? mat.a < 1 ? "zoom-out" : "zoom-in" : undefined
+      }
+    }, showCrosshairs &&
+    /*#__PURE__*/
+    React.createElement(Crosshairs, {
+      key: "crossHairs",
+      mousePosition: mousePosition
+    }), imageLoaded && !dragging &&
+    /*#__PURE__*/
+    React.createElement(RegionSelectAndTransformBoxes, {
+      key: "regionSelectAndTransformBoxes",
+      regions: !modifyingAllowedArea || !allowedArea ? regions : [{
+        type: "box",
+        id: "$$allowed_area",
+        cls: "allowed_area",
+        highlighted: true,
+        x: allowedArea.x,
+        y: allowedArea.y,
+        w: allowedArea.w,
+        h: allowedArea.h,
+        visible: true,
+        color: "#ff0"
+      }],
+      mouseEvents: mouseEvents,
+      projectRegionBox: projectRegionBox,
+      dragWithPrimary: dragWithPrimary,
+      createWithPrimary: createWithPrimary,
+      zoomWithPrimary: zoomWithPrimary,
+      onBeginMovePoint: onBeginMovePoint,
+      onSelectRegion: onSelectRegion,
+      layoutParams: layoutParams,
+      mat: mat,
+      onBeginBoxTransform: onBeginBoxTransform,
+      onBeginMovePolygonPoint: onBeginMovePolygonPoint,
+      onBeginMoveKeypoint: onBeginMoveKeypoint,
+      onAddPolygonPoint: onAddPolygonPoint,
+      showHighlightBox: showHighlightBox
+    }), imageLoaded && showTags && !dragging &&
+    /*#__PURE__*/
+    React.createElement(PreventScrollToParents, {
+      key: "regionTags"
+    },
+    /*#__PURE__*/
+    React.createElement(RegionTags, {
+      regions: regions,
+      projectRegionBox: projectRegionBox,
+      mouseEvents: mouseEvents,
+      regionClsList: regionClsList,
+      regionTagList: regionTagList,
+      onBeginRegionEdit: onBeginRegionEdit,
+      onChangeRegion: onChangeRegion,
+      onCloseRegionEdit: onCloseRegionEdit,
+      onDeleteRegion: onDeleteRegion,
+      onDeleteGroup: onDeleteGroup,
+      layoutParams: layoutParams,
+      imageSrc: imageSrc,
+      RegionEditLabel: RegionEditLabel,
+      onRegionClassAdded: onRegionClassAdded,
+      allowComments: allowComments,
+      hideNotEditingLabel: hideNotEditingLabel,
+      allowedGroups: allowedGroups
+    })), !showTags && highlightedRegion &&
+    /*#__PURE__*/
+    React.createElement("div", {
+      key: "topLeftTag",
+      className: classes.fixedRegionLabel
+    },
+    /*#__PURE__*/
+    React.createElement(RegionLabel, {
+      disableClose: true,
+      allowedClasses: regionClsList,
+      allowedTags: regionTagList,
+      onChange: onChangeRegion,
+      onDelete: onDeleteRegion,
+      onDeleteGroup: onDeleteGroup,
+      editing: true,
+      region: highlightedRegion,
+      imageSrc: imageSrc,
+      allowComments: allowComments
+    })), zoomWithPrimary && zoomBox !== null &&
+    /*#__PURE__*/
+    React.createElement("div", {
+      key: "zoomBox",
+      style: {
+        position: "absolute",
+        zIndex: 1,
+        border: "1px solid #fff",
+        pointerEvents: "none",
+        left: zoomBox.x,
+        top: zoomBox.y,
+        width: zoomBox.w,
+        height: zoomBox.h
+      }
+    }), showPointDistances &&
+    /*#__PURE__*/
+    React.createElement(PointDistances, {
+      key: "pointDistances",
+      regions: regions,
+      realSize: realSize,
+      projectRegionBox: projectRegionBox,
+      pointDistancePrecision: pointDistancePrecision
+    }),
+    /*#__PURE__*/
+    React.createElement(PreventScrollToParents, Object.assign({
+      style: {
+        width: "100%",
+        height: "100%"
+      }
+    }, mouseEvents),
+    /*#__PURE__*/
+    React.createElement(React.Fragment, null, fullImageSegmentationMode &&
+    /*#__PURE__*/
+    React.createElement(ImageMask, {
+      hide: !showMask,
+      autoSegmentationOptions: autoSegmentationOptions,
+      imagePosition: imagePosition,
+      regionClsList: regionClsList,
+      imageSrc: imageSrc,
+      regions: regions
+    }),
+    /*#__PURE__*/
+    React.createElement("canvas", {
+      style: {
+        opacity: 0.25
+      },
+      className: classes.canvas,
+      ref: canvasEl
+    }),
+    /*#__PURE__*/
+    React.createElement(RegionShapes, {
+      mat: mat,
+      keypointDefinitions: keypointDefinitions,
+      imagePosition: imagePosition,
+      regions: regions,
+      fullSegmentationMode: fullImageSegmentationMode
+    }),
+    /*#__PURE__*/
+    React.createElement(VideoOrImageCanvasBackground, {
+      videoPlaying: videoPlaying,
+      imagePosition: imagePosition,
+      mouseEvents: mouseEvents,
+      onLoad: onVideoOrImageLoaded,
+      videoTime: videoTime,
+      videoSrc: videoSrc,
+      imageSrc: imageSrc,
+      useCrossOrigin: fullImageSegmentationMode,
+      onChangeVideoTime: onChangeVideoTime,
+      onChangeVideoPlaying: onChangeVideoPlaying
+    }))),
+    /*#__PURE__*/
+    React.createElement("div", {
+      className: classes.zoomIndicator
+    }, (1 / mat.a * 100).toFixed(0), "%")))
+  );
 };
 export default ImageCanvas;

package/ImageMask/index.js

@@ -123,11 +123,14 @@ export var ImageMask = function ImageMask(_ref3) {
       pointerEvents: "none"
     };
   }, [imagePosition.topLeft.x, imagePosition.topLeft.y, imagePosition.bottomRight.x, imagePosition.bottomRight.y, zIndex, hide]);
-  return React.createElement("canvas", {
-    style: style,
-    width: sampleImageData ? sampleImageData.width : 0,
-    height: sampleImageData ? sampleImageData.height : 0,
-    ref: setCanvasRef
-  });
+  return (
+    /*#__PURE__*/
+    React.createElement("canvas", {
+      style: style,
+      width: sampleImageData ? sampleImageData.width : 0,
+      height: sampleImageData ? sampleImageData.height : 0,
+      ref: setCanvasRef
+    })
+  );
 };
 export default ImageMask;