@factorearth/component-library 5.1.3-alpha.0 → 5.1.4-alpha.0
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.
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React, { useState, useRef, useEffect, } from "react";
|
|
2
2
|
import styled from "@emotion/styled";
|
|
3
|
-
import { FiTrash2, FiEye, FiEyeOff, FiSettings } from "react-icons/fi";
|
|
3
|
+
import { FiTrash2, FiEye, FiEyeOff, FiSettings, FiRotateCcw } from "react-icons/fi";
|
|
4
4
|
import { Button } from "../../Atoms/Buttons/Button";
|
|
5
5
|
const Container = styled.div `
|
|
6
6
|
display: flex;
|
|
@@ -55,6 +55,7 @@ const PreviewImage = styled.img `
|
|
|
55
55
|
export const Thumbnail = ({ colorPalette, handleSubmit, settingsChildren, showImage, setShowImage, fieldInstance, s3Key, signedUrl, uploadButtonText, handleRemove, changed, handleChange, }) => {
|
|
56
56
|
const [selectedImage, setSelectedImage] = useState(null);
|
|
57
57
|
const [showSettings, setShowSettings] = useState(false);
|
|
58
|
+
const [prevImage, setPrevImage] = useState(null);
|
|
58
59
|
const acceptedFileTypes = [
|
|
59
60
|
"image/jpeg",
|
|
60
61
|
"image/png",
|
|
@@ -69,10 +70,12 @@ export const Thumbnail = ({ colorPalette, handleSubmit, settingsChildren, showIm
|
|
|
69
70
|
if (file) {
|
|
70
71
|
const imageUrl = URL.createObjectURL(file);
|
|
71
72
|
setSelectedImage(imageUrl);
|
|
73
|
+
setPrevImage(null);
|
|
72
74
|
}
|
|
73
75
|
}
|
|
74
76
|
else if (signedUrl && typeof signedUrl === "string") {
|
|
75
77
|
setSelectedImage(signedUrl);
|
|
78
|
+
setPrevImage(null);
|
|
76
79
|
}
|
|
77
80
|
else {
|
|
78
81
|
setSelectedImage(null);
|
|
@@ -80,7 +83,6 @@ export const Thumbnail = ({ colorPalette, handleSubmit, settingsChildren, showIm
|
|
|
80
83
|
}, [signedUrl, s3Key]);
|
|
81
84
|
const handleImageUpload = (event) => {
|
|
82
85
|
const file = event.target.files?.[0];
|
|
83
|
-
console.log(`the file in image upload: `, file);
|
|
84
86
|
if (file) {
|
|
85
87
|
const imageUrl = URL.createObjectURL(file);
|
|
86
88
|
setSelectedImage(imageUrl);
|
|
@@ -115,18 +117,27 @@ export const Thumbnail = ({ colorPalette, handleSubmit, settingsChildren, showIm
|
|
|
115
117
|
};
|
|
116
118
|
const clearInput = () => {
|
|
117
119
|
if (inputRef.current) {
|
|
120
|
+
setPrevImage(selectedImage);
|
|
121
|
+
console.log(`just set prevImage to selected image right before its nulled out: `, selectedImage);
|
|
122
|
+
setSelectedImage(null);
|
|
118
123
|
inputRef.current.value = "";
|
|
119
124
|
}
|
|
120
125
|
if (handleRemove) {
|
|
121
126
|
handleRemove();
|
|
122
127
|
}
|
|
123
128
|
};
|
|
129
|
+
const undoDelete = () => {
|
|
130
|
+
console.log(`in undo delete the prevImage: `, prevImage);
|
|
131
|
+
setSelectedImage(prevImage);
|
|
132
|
+
setPrevImage(null);
|
|
133
|
+
};
|
|
124
134
|
return (React.createElement(Container, { colors: colorPalette, showImage: showImage, showSettings: showSettings, key: `thumbnail_${fieldInstance.id}` },
|
|
125
135
|
React.createElement("div", { style: { display: "flex" } },
|
|
126
136
|
React.createElement(Button, { colorPalette: colorPalette, icon: !showImage ? React.createElement(FiEye, null) : React.createElement(FiEyeOff, null), variant: "outlined", onClick: handleToggleImage, "aria-label": !showImage ? "show-image" : "hide-image" }),
|
|
127
137
|
showImage && selectedImage && (React.createElement(React.Fragment, null,
|
|
128
138
|
React.createElement(Button, { colorPalette: colorPalette, icon: React.createElement(FiSettings, null), variant: "outlined", style: { borderColor: "transparent" }, onClick: handleToggleSettings }),
|
|
129
|
-
React.createElement(Button, { colorPalette: colorPalette, icon: React.createElement(FiTrash2, null), variant: "destructive", onClick: clearInput })))
|
|
139
|
+
React.createElement(Button, { colorPalette: colorPalette, icon: React.createElement(FiTrash2, null), variant: "destructive", onClick: clearInput }))),
|
|
140
|
+
prevImage && (React.createElement(Button, { colorPalette: colorPalette, icon: React.createElement(FiRotateCcw, null), variant: "outlined", onClick: undoDelete }))),
|
|
130
141
|
showImage && !showSettings && (React.createElement(InputArea, { onDrop: handleDrop, onDragOver: handleDragOver, colors: colorPalette },
|
|
131
142
|
selectedImage && (React.createElement(PreviewImage, { alt: s3Key || "Uploaded Image", src: selectedImage })),
|
|
132
143
|
React.createElement(Button, { colorPalette: colorPalette, label: "Browse", variant: "filled", onClick: handleBrowseClick },
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Thumbnail.js","sourceRoot":"","sources":["../../../lib/Molecules/Thumbnail/Thumbnail.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EACb,QAAQ,EAER,MAAM,EAGN,SAAS,GACT,MAAM,OAAO,CAAC;AACf,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAErC,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;
|
|
1
|
+
{"version":3,"file":"Thumbnail.js","sourceRoot":"","sources":["../../../lib/Molecules/Thumbnail/Thumbnail.tsx"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@factorearth/component-library",
|
|
3
|
-
"version": "5.1.
|
|
3
|
+
"version": "5.1.4-alpha.0",
|
|
4
4
|
"description": " A storybook component library for FactorEarth",
|
|
5
5
|
"author": "madtrx <marlin.makori@gmail.com>",
|
|
6
6
|
"homepage": "https://github.com/FactorEarth/RecordMiddleware#readme",
|
|
@@ -46,7 +46,7 @@
|
|
|
46
46
|
"access": "public",
|
|
47
47
|
"registry": "https://registry.npmjs.org/"
|
|
48
48
|
},
|
|
49
|
-
"gitHead": "
|
|
49
|
+
"gitHead": "c3975852e7143e40e6c77666cedcde606950b734",
|
|
50
50
|
"dependencies": {
|
|
51
51
|
"@emotion/react": "^11.13.0",
|
|
52
52
|
"@emotion/styled": "^11.13.0",
|