@rahmatsaputra-my-id/react-js-library 0.0.18 → 0.0.19

package/dist/components/ImageInput/ImageInput.component.d.ts

@@ -1,4 +1,4 @@
-import { ImageInputProps } from './ImageInput.component.types';
 import React from 'react';
+import { ImageInputProps } from './ImageInput.component.types';
 declare const ImageInput: React.FC<ImageInputProps>;
 export default ImageInput;

package/dist/components/ImageInput/ImageInput.component.types.d.ts

@@ -1,10 +1,9 @@
 export interface ImageInputProps {
     label?: string;
     subLabel?: string;
-    imageUrl?: string | null;
-    handleOnUpload: () => void;
-    handleOnPreview: () => void;
+    imageUrl?: string;
     containerStyle?: any;
     isMandatory?: boolean;
     isEditAble?: boolean;
+    handleOnPickImage: () => void;
 }

package/dist/index.es.js

@@ -840,7 +840,7 @@ var Text = function (_a) {
 };
 
 var BottomSheetPhoto = function (_a) {
-    var visible = _a.visible, onClose = _a.onClose, _b = _a.title, title = _b === void 0 ? '' : _b, onUploadBase64 = _a.onUploadBase64;
+    var visible = _a.visible, onClose = _a.onClose, _b = _a.title, title = _b === void 0 ? 'Pilihan' : _b, onUploadBase64 = _a.onUploadBase64;
     var fileInputRef = useRef(null);
     var _c = useState(false), cameraVisible = _c[0], setCameraVisible = _c[1];
     var _d = useState(20), paddingBottom = _d[0], setPaddingBottom = _d[1];
@@ -1176,12 +1176,6 @@ var styles$7 = {
     },
 };
 
-var ImageInput = function (_a) {
-    var label = _a.label, subLabel = _a.subLabel, _b = _a.imageUrl, imageUrl = _b === void 0 ? null : _b, handleOnUpload = _a.handleOnUpload, handleOnPreview = _a.handleOnPreview, containerStyle = _a.containerStyle, _c = _a.isMandatory, isMandatory = _c === void 0 ? false : _c, _d = _a.isEditAble, isEditAble = _d === void 0 ? false : _d;
-    var renderScreen = function () { return (jsxs(View, __assign({ style: __assign(__assign({}, styles$7.container), containerStyle) }, { children: [jsx(TouchableOpacity, __assign({ style: styles$7.containerImage, onPress: imageUrl ? handleOnPreview : handleOnUpload }, { children: jsx(Images, { src: imageUrl ? imageUrl : Icons.camera, style: imageUrl ? styles$7.image : styles$7.iconCamera }) })), jsxs(View, __assign({ style: styles$7.containerText }, { children: [label && (jsx(Text, __assign({ type: "bold_16", style: styles$7.label }, { children: label }))), subLabel && jsx(Text, { children: subLabel }), isMandatory && jsx(Text, __assign({ type: "normal_14_red" }, { children: '*Wajib' }))] })), isEditAble && imageUrl && (jsx(TouchableOpacity, __assign({ onPress: handleOnUpload }, { children: jsx(Images, { src: Icons.edit, style: styles$7.iconEdit }) })))] }))); };
-    return renderScreen();
-};
-
 var styles$6 = {
     backdrop: {
         position: 'fixed',
@@ -1240,6 +1234,23 @@ var PhotoPreviewModal = function (_a) {
                 }, style: styles$6.image })) : (jsx("p", __assign({ style: styles$6.noImageContainer }, { children: "No image provided" }))) })) })), document.body);
 };
 
+var ImageInput = function (_a) {
+    var label = _a.label, subLabel = _a.subLabel, _b = _a.imageUrl, imageUrl = _b === void 0 ? null : _b, containerStyle = _a.containerStyle, _c = _a.isMandatory, isMandatory = _c === void 0 ? false : _c, _d = _a.isEditAble, isEditAble = _d === void 0 ? false : _d, _e = _a.handleOnPickImage, handleOnPickImage = _e === void 0 ? function (_base64) { } : _e;
+    var _f = useState(imageUrl !== null && imageUrl !== void 0 ? imageUrl : undefined), imagePreview = _f[0], setImagePreview = _f[1];
+    var _g = useState(false), isVisibleBottomSheet = _g[0], setIsVisibleBottomSheet = _g[1];
+    var _h = useState(false), isPreviewVisible = _h[0], setIsPreviewVisible = _h[1];
+    var handleOnUpload = function () { return setIsVisibleBottomSheet(true); };
+    var handleOnPreview = function () { return setIsPreviewVisible(true); };
+    return (jsxs(View, __assign({ style: __assign(__assign({}, styles$7.container), containerStyle) }, { children: [jsx(TouchableOpacity, __assign({ style: styles$7.containerImage, onPress: imagePreview ? handleOnPreview : handleOnUpload }, { children: jsx(Images, { src: imagePreview ? imagePreview : Icons.camera, style: imagePreview ? styles$7.image : styles$7.iconCamera }) })), jsxs(View, __assign({ style: styles$7.containerText }, { children: [label && (jsx(Text, __assign({ type: "bold_16", style: styles$7.label }, { children: label }))), subLabel && jsx(Text, { children: subLabel }), isMandatory && jsx(Text, __assign({ type: "normal_14_red" }, { children: '*Wajib' }))] })), isEditAble && imagePreview && (jsx(TouchableOpacity, __assign({ onPress: handleOnUpload }, { children: jsx(Images, { src: Icons.edit, style: styles$7.iconEdit }) }))), jsx(PhotoPreviewModal, { visible: isPreviewVisible, onDismiss: function () { return setIsPreviewVisible(false); }, imageUrl: imagePreview }), jsx(BottomSheetPhoto, { visible: isVisibleBottomSheet, onClose: function () { return setIsVisibleBottomSheet(false); }, onUploadBase64: function (base64) {
+                    if (typeof base64 === 'string') {
+                        setImagePreview(base64);
+                        if (typeof handleOnPickImage === 'function') {
+                            handleOnPickImage(base64);
+                        }
+                    }
+                } })] })));
+};
+
 var styles$5 = {
     sliderContainer: {
         position: 'relative',