@searpent/react-image-annotate 2.0.75 → 2.0.77

package/Editor/index.js

@@ -1,93 +0,0 @@
-import _regeneratorRuntime from "@babel/runtime/regenerator";
-import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
-import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-import React, { useState } from 'react';
-import { createReactEditorJS } from 'react-editor-js';
-import blocksToArticle from '../utils/blocks-to-article';
-import { EDITOR_JS_TOOLS } from './tools';
-import ReadOnly from './readOnly';
-var ReactEditorJS = createReactEditorJS();
-
-function Editor(_ref) {
-  var _ref$blocks = _ref.blocks,
-      blocks = _ref$blocks === void 0 ? [] : _ref$blocks,
-      onChange = _ref.onChange,
-      imageIndex = _ref.imageIndex,
-      selectedFrame = _ref.selectedFrame;
-
-  var _useState = useState(false),
-      _useState2 = _slicedToArray(_useState, 2),
-      editMode = _useState2[0],
-      setEditMode = _useState2[1];
-
-  var handleChange =
-  /*#__PURE__*/
-  function () {
-    var _ref2 = _asyncToGenerator(
-    /*#__PURE__*/
-    _regeneratorRuntime.mark(function _callee(instance) {
-      var data;
-      return _regeneratorRuntime.wrap(function _callee$(_context) {
-        while (1) {
-          switch (_context.prev = _context.next) {
-            case 0:
-              _context.next = 2;
-              return instance.saver.save();
-
-            case 2:
-              data = _context.sent;
-              onChange({
-                imageIndex: imageIndex,
-                data: data
-              });
-
-            case 4:
-            case "end":
-              return _context.stop();
-          }
-        }
-      }, _callee);
-    }));
-
-    return function handleChange(_x) {
-      return _ref2.apply(this, arguments);
-    };
-  }();
-
-  var toggleEditMode = function toggleEditMode() {
-    setEditMode(function (prev) {
-      return !prev;
-    });
-  };
-
-  if (blocks.length < 1) {
-    return React.createElement("div", {
-      className: "instructions"
-    }, React.createElement("h1", null, "Click article to display text."));
-  }
-
-  return React.createElement("div", null, React.createElement("div", {
-    className: "show-metadata-wrapper"
-  }, React.createElement("label", {
-    className: "switch mr-2"
-  }, React.createElement("input", {
-    id: "show-metadata",
-    type: "checkbox",
-    value: editMode,
-    onChange: toggleEditMode
-  }), React.createElement("span", {
-    className: "slider round"
-  })), React.createElement("label", null, "Edit mode")), !editMode ? React.createElement(ReadOnly, {
-    article: blocksToArticle(blocks)
-  }) : React.createElement(ReactEditorJS, {
-    defaultValue: {
-      blocks: blocks
-    },
-    tools: EDITOR_JS_TOOLS,
-    onChange: handleChange,
-    enableReInitialize: true,
-    key: selectedFrame
-  }));
-}
-
-export default Editor;

package/Editor/readOnly.js

@@ -1,73 +0,0 @@
-import React from 'react';
-
-function ReadOnly(_ref) {
-  var article = _ref.article;
-  return React.createElement("div", null, React.createElement("h1", {
-    className: "ro-title",
-    dangerouslySetInnerHTML: {
-      __html: article.title
-    }
-  }), React.createElement("h2", {
-    className: "ro-subtitle",
-    dangerouslySetInnerHTML: {
-      __html: article.subtitle
-    }
-  }), React.createElement("p", {
-    className: "ro-text",
-    dangerouslySetInnerHTML: {
-      __html: article.text
-    }
-  }), React.createElement("p", {
-    className: "ro-author",
-    dangerouslySetInnerHTML: {
-      __html: article.author
-    }
-  }), React.createElement("p", {
-    className: "ro-about-author",
-    dangerouslySetInnerHTML: {
-      __html: article.about_author
-    }
-  }), React.createElement("p", {
-    className: "ro-appendix",
-    dangerouslySetInnerHTML: {
-      __html: article.appendix
-    }
-  }), React.createElement("p", {
-    className: "ro-photo-author",
-    dangerouslySetInnerHTML: {
-      __html: article.photo_author
-    }
-  }), React.createElement("p", {
-    className: "ro-photo-caption",
-    dangerouslySetInnerHTML: {
-      __html: article.photo_caption
-    }
-  }), React.createElement("p", {
-    className: "ro-advertisment",
-    dangerouslySetInnerHTML: {
-      __html: article.advertisement
-    }
-  }), React.createElement("p", {
-    className: "ro-other-graphics",
-    dangerouslySetInnerHTML: {
-      __html: article.other_graphics
-    }
-  }), React.createElement("p", {
-    className: "ro-unknown",
-    dangerouslySetInnerHTML: {
-      __html: article.unknown
-    }
-  }), React.createElement("p", {
-    className: "ro-table",
-    dangerouslySetInnerHTML: {
-      __html: article.table
-    }
-  }), React.createElement("p", {
-    className: "ro-section",
-    dangerouslySetInnerHTML: {
-      __html: article.section
-    }
-  }));
-}
-
-export default ReadOnly;

package/Errorer/index.js

@@ -1,11 +0,0 @@
-import React from 'react';
-import ErrorIcon from '@mui/icons-material/Error';
-import './errorer.css';
-
-function Errorer() {
-  return React.createElement("div", {
-    className: "errorer"
-  }, React.createElement(ErrorIcon, null));
-}
-
-export default Errorer;

package/FullImageSegmentationAnnotator/index.js

@@ -1,7 +0,0 @@
-import React from "react";
-import Annotator from "../Annotator";
-export default (function (props) {
-  return React.createElement(Annotator, Object.assign({}, props, {
-    fullImageSegmentationMode: true
-  }));
-});

package/GroupSelectorSidebarBox/index.js

@@ -1,63 +0,0 @@
-import React, { memo } from "react";
-import { makeStyles } from "@mui/styles";
-import { createTheme, ThemeProvider } from "@mui/material/styles";
-import SidebarBoxContainer from "../SidebarBoxContainer";
-import CollectionsIcon from "@mui/icons-material/Collections";
-import { grey } from "@mui/material/colors";
-import List from "@mui/material/List";
-import ListItem from "@mui/material/ListItem";
-import ListItemText from "@mui/material/ListItemText";
-import uuidToHash from '../utils/uuid-to-hash';
-var theme = createTheme();
-var useStyles = makeStyles(function (theme) {
-  return {
-    img: {
-      width: 40,
-      height: 40,
-      borderRadius: 8
-    }
-  };
-});
-export var GroupSelectorSidebarBox = function GroupSelectorSidebarBox(_ref) {
-  var title = _ref.title,
-      subtitle = _ref.subtitle,
-      groups = _ref.groups,
-      onSelect = _ref.onSelect,
-      selectedGroupId = _ref.selectedGroupId;
-  var classes = useStyles();
-  return React.createElement(ThemeProvider, {
-    theme: theme
-  }, React.createElement(SidebarBoxContainer, {
-    title: title || '',
-    subTitle: subtitle || '',
-    icon: React.createElement(CollectionsIcon, {
-      style: {
-        color: grey[700]
-      }
-    })
-  }, React.createElement(List, null, groups.map(function (_ref2, i) {
-    var id = _ref2.id,
-        groupTitle = _ref2.title,
-        groupSubtitle = _ref2.subtitle,
-        color = _ref2.color;
-    return React.createElement(ListItem, {
-      button: true,
-      onClick: function onClick() {
-        return onSelect(id);
-      },
-      dense: true,
-      key: id,
-      style: {
-        backgroundColor: id === selectedGroupId ? '#bbdefb' : null
-      }
-    }, React.createElement(ListItemText, {
-      primary: React.createElement("strong", {
-        style: {
-          color: color
-        }
-      }, uuidToHash(groupTitle)),
-      secondary: groupSubtitle
-    }));
-  }))));
-};
-export default GroupSelectorSidebarBox;

package/GroupsEditorSidebarBox/index.js

@@ -1,138 +0,0 @@
-import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-import React, { memo, useState } from "react";
-import SidebarBoxContainer from "../SidebarBoxContainer";
-import FilterNoneIcon from '@mui/icons-material/FilterNone';
-import { styled } from "@mui/material/styles";
-import { createTheme, ThemeProvider } from "@mui/material/styles";
-import { grey } from "@mui/material/colors";
-import uuidToHash from "../utils/uuid-to-hash";
-var theme = createTheme();
-var GroupItemDiv = styled("div")(function (_ref) {
-  var theme = _ref.theme;
-  return {
-    display: "flex",
-    flexDirection: "column",
-    marginBottom: "1rem",
-    "& > label": {
-      fontSize: "1rem",
-      marginBottom: ".5rem",
-      textTransform: "capitalize"
-    }
-  };
-});
-
-var GroupItem = function GroupItem(_ref2) {
-  var group = _ref2.group;
-  return 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
-    });
-  }));
-};
-
-var AddGroupFormDiv = styled("div")(function (_ref4) {
-  var theme = _ref4.theme;
-  return {
-    display: "flex",
-    flexDirection: "row"
-  };
-});
-
-var AddGroupFrom = function AddGroupFrom(_ref5) {
-  var onAddGroup = _ref5.onAddGroup;
-
-  var _useState = useState(""),
-      _useState2 = _slicedToArray(_useState, 2),
-      value = _useState2[0],
-      setValue = _useState2[1];
-
-  var handleChange = function handleChange(e) {
-    setValue(e.target.value);
-  };
-
-  var handleSubmit = function handleSubmit(e) {
-    e.preventDefault();
-    onAddGroup(value);
-    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"
-  })));
-};
-
-var DivContainer = styled("div")(function (_ref6) {
-  var theme = _ref6.theme;
-  return {
-    paddingLeft: 16,
-    paddingRight: 16,
-    fontSize: 12,
-    "& h1": {
-      fontSize: 18
-    },
-    "& h2": {
-      fontSize: 14
-    },
-    "& h3": {
-      fontSize: 12
-    },
-    "& h4": {
-      fontSize: 12
-    },
-    "& h5": {
-      fontSize: 12
-    },
-    "& h6": {
-      fontSize: 12
-    },
-    "& p": {
-      fontSize: 12
-    },
-    "& a": {},
-    "& img": {
-      width: "100%"
-    }
-  };
-});
-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]
-      }
-    }),
-    expandedByDefault: true
-  }, React.createElement(DivContainer, null, React.createElement("h2", null, "Add new group"), React.createElement(AddGroupFrom, {
-    onAddGroup: onAddGroup
-  }), React.createElement(GroupList, {
-    groups: groups
-  }))));
-};
-export default memo(GroupsEditorSidebarBox);

package/HelpSidebarBox/index.js

@@ -1,58 +0,0 @@
-import React, { memo } from "react";
-import SidebarBoxContainer from "../SidebarBoxContainer";
-import HelpIcon from '@mui/icons-material/Help';
-import { styled } from "@mui/material/styles";
-import { createTheme, ThemeProvider } from "@mui/material/styles";
-import { grey } from "@mui/material/colors";
-import Markdown from "react-markdown";
-var theme = createTheme();
-var MarkdownContainer = styled("div")(function (_ref) {
-  var theme = _ref.theme;
-  return {
-    paddingLeft: 16,
-    paddingRight: 16,
-    fontSize: 12,
-    "& h1": {
-      fontSize: 18
-    },
-    "& h2": {
-      fontSize: 14
-    },
-    "& h3": {
-      fontSize: 12
-    },
-    "& h4": {
-      fontSize: 12
-    },
-    "& h5": {
-      fontSize: 12
-    },
-    "& h6": {
-      fontSize: 12
-    },
-    "& p": {
-      fontSize: 12
-    },
-    "& a": {},
-    "& img": {
-      width: "100%"
-    }
-  };
-});
-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
-  }))));
-};
-export default memo(HelpSidebarBox);

package/HighlightBox/index.js

@@ -1,102 +0,0 @@
-import _objectSpread from "@babel/runtime/helpers/esm/objectSpread";
-import React from "react";
-import classnames from "classnames";
-import { makeStyles } from "@mui/styles";
-import { createTheme, ThemeProvider } from "@mui/material/styles";
-var theme = createTheme();
-var useStyles = makeStyles(function (theme) {
-  return {
-    "@keyframes borderDance": {
-      from: {
-        strokeDashoffset: 0
-      },
-      to: {
-        strokeDashoffset: 100
-      }
-    },
-    highlightBox: {
-      zIndex: 2,
-      transition: "opacity 500ms",
-      "&.highlighted": {
-        zIndex: 3
-      },
-      "&:not(.highlighted)": {
-        opacity: 0
-      },
-      "&:not(.highlighted):hover": {
-        opacity: 0.6
-      },
-      "& path": {
-        // NOTE: attributes below commnted because resetting screen caused old frame to highlight
-        // vectorEffect: "non-scaling-stroke",
-        // strokeWidth: 2,
-        // stroke: "#FFF",
-        // strokeDasharray: 5,
-        fill: "none",
-        animationName: "$borderDance",
-        animationDuration: "4s",
-        animationTimingFunction: "linear",
-        animationIterationCount: "infinite",
-        animationPlayState: "running"
-      }
-    }
-  };
-});
-export var HighlightBox = function HighlightBox(_ref) {
-  var mouseEvents = _ref.mouseEvents,
-      dragWithPrimary = _ref.dragWithPrimary,
-      zoomWithPrimary = _ref.zoomWithPrimary,
-      createWithPrimary = _ref.createWithPrimary,
-      onBeginMovePoint = _ref.onBeginMovePoint,
-      onSelectRegion = _ref.onSelectRegion,
-      r = _ref.region,
-      pbox = _ref.pbox;
-  var classes = useStyles();
-  if (!pbox.w || pbox.w === Infinity) return null;
-  if (!pbox.h || pbox.h === Infinity) return null;
-  if (r.unfinished) return null;
-  var styleCoords = r.type === "point" ? {
-    left: pbox.x + pbox.w / 2 - 30,
-    top: pbox.y + pbox.h / 2 - 30,
-    width: 60,
-    height: 60
-  } : {
-    left: pbox.x - 5,
-    top: pbox.y - 5,
-    width: pbox.w + 10,
-    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);
-      }
-
-      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
-  })));
-};
-export default HighlightBox;

package/HistorySidebarBox/index.js

@@ -1,71 +0,0 @@
-import React, { setState, memo } from "react";
-import { makeStyles } from "@mui/styles";
-import { createTheme, ThemeProvider } from "@mui/material/styles";
-import SidebarBoxContainer from "../SidebarBoxContainer";
-import HistoryIcon from "@mui/icons-material/History";
-import List from "@mui/material/List";
-import ListItem from "@mui/material/ListItem";
-import ListItemText from "@mui/material/ListItemText";
-import IconButton from "@mui/material/IconButton";
-import ListItemSecondaryAction from "@mui/material/ListItemSecondaryAction";
-import UndoIcon from "@mui/icons-material/Undo";
-import moment from "moment";
-import { grey } from "@mui/material/colors";
-import isEqual from "lodash/isEqual";
-import Box from "@mui/material/Box";
-var theme = createTheme();
-var useStyles = makeStyles(function (theme) {
-  return {
-    emptyText: {
-      fontSize: 14,
-      fontWeight: "bold",
-      color: grey[500],
-      textAlign: "center",
-      padding: 20
-    }
-  };
-});
-var listItemTextStyle = {
-  paddingLeft: 16
-};
-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))));
-  }))));
-};
-export default memo(HistorySidebarBox, function (prevProps, nextProps) {
-  return isEqual(prevProps.history.map(function (a) {
-    return [a.name, a.time];
-  }), nextProps.history.map(function (a) {
-    return [a.name, a.time];
-  }));
-});