@searpent/react-image-annotate 2.0.17 → 2.0.18

package/MainLayout/index.js

@@ -66,7 +66,9 @@ var EditorWrapper = styled("div")(function (_ref3) {
   return {
     width: "45%",
     padding: "1rem",
-    paddingLeft: "2rem"
+    paddingLeft: "2rem",
+    height: "100vh",
+    overflowY: "scroll"
   };
 });
 export var MainLayout = function MainLayout(_ref4) {

package/PageSelector/index.js

@@ -44,66 +44,11 @@ function PageSelector(_ref2) {
       'page-selector--opened': showMetadata
     })
   }, React.createElement("div", {
-    className: "top-buttons"
-  }, React.createElement("button", {
-    onClick: onRecalc,
-    disabled: !recalcActive,
-    className: "info"
-  }, "Recalc"), React.createElement("button", {
-    onClick: onSave,
-    disabled: !saveActive,
-    className: "success"
-  }, "Save"), React.createElement("div", {
-    className: "show-metadata-wrapper"
-  }, React.createElement("label", {
-    className: "switch mr-2"
-  }, React.createElement("input", {
-    id: "show-metadata",
-    type: "checkbox",
-    value: showMetadata,
-    onChange: function onChange() {
-      return setShowMetadata(function (prev) {
-        return !prev;
-      });
-    }
-  }), React.createElement("span", {
-    className: "slider round"
-  })), React.createElement("label", null, "Metadata"))), React.createElement("div", {
     className: "pages"
   }, pages.map(function (page, idx) {
-    var _page$metadata;
-
     return React.createElement("div", {
       className: "page-thumbnail__wrapper"
-    }, React.createElement(PageThumbnail, {
-      key: "".concat(page.id),
-      src: page.src,
-      isActive: page.isActive,
-      onClick: function onClick() {
-        return onPageClick(idx);
-      }
-    }), showMetadata && React.createElement("div", {
-      className: "page-thumbnail__metadata"
-    }, React.createElement("h5", null, "Metadata"), page === null || page === void 0 ? void 0 : (_page$metadata = page.metadata) === null || _page$metadata === void 0 ? void 0 : _page$metadata.map(function (_ref3) {
-      var key = _ref3.key,
-          value = _ref3.value;
-      return React.createElement("div", {
-        key: key
-      }, React.createElement("label", {
-        htmlFor: key
-      }, key), React.createElement("input", {
-        id: key,
-        type: "text",
-        value: value,
-        onChange: function onChange(e) {
-          return onMetadataChange({
-            name: key,
-            value: e.target.value,
-            imageIndex: idx
-          });
-        }
-      }));
-    })));
+    }, "This is thumbnail ", page.id);
   })));
 }
 

package/PageSelector/page-selector.css

@@ -1,26 +1,29 @@
 .page-selector {
   height: 100vh;
   overflow-y: scroll;
-  max-width: 10%;
+  /* max-width: 10%; */
   transition: max-width .5s;
 }
 
 .page-selector--opened {
-  max-width: 20%;
+  /* max-width: 20%; */
 }
 
 .pages {
   list-style: none;
-  padding: 1rem;
 }
 
 .page-thumbnail__wrapper {
   display: flex;
   flex-direction: row;
   align-items: flex-start;
+  background-color: #2dce89;
+  /* width: 240px; */
+  width: 480px;
 }
 
 .page-thumbnail {
+  /* width: 300px; */
   margin-bottom: 1rem;
   border-radius: .25rem !important;
   overflow: hidden;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@searpent/react-image-annotate",
-  "version": "2.0.17",
+  "version": "2.0.18",
   "dependencies": {
     "@editorjs/editorjs": "^2.25.0",
     "@editorjs/paragraph": "^2.8.0",