@rahmatsaputra-my-id/react-js-library 0.0.64 → 0.0.65
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.
- package/dist/components/RadioButtonMultiple/RadioButtonMultiple.component.d.ts +4 -0
- package/dist/components/{RadioButton/RadioButton.types.d.ts → RadioButtonMultiple/RadioButtonMultiple.types.d.ts} +1 -1
- package/dist/components/RadioButtonMultiple/index.d.ts +2 -0
- package/dist/components/RadioButtonSingle/RadioButtonSingle.component.d.ts +4 -0
- package/dist/components/RadioButtonSingle/RadioButtonSingle.component.styles.d.ts +29 -0
- package/dist/components/RadioButtonSingle/RadioButtonSingle.types.d.ts +7 -0
- package/dist/components/RadioButtonSingle/index.d.ts +2 -0
- package/dist/index.d.ts +2 -1
- package/dist/index.es.js +79 -49
- package/dist/index.es.js.map +1 -1
- package/dist/index.js +80 -49
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
- package/dist/components/RadioButton/RadioButton.component.d.ts +0 -4
- package/dist/components/RadioButton/SingleRadioButton.component.d.ts +0 -4
- package/dist/components/RadioButton/index.d.ts +0 -2
- /package/dist/components/{RadioButton/RadioButton.styles.d.ts → RadioButtonMultiple/RadioButtonMultiple.component.styles.d.ts} +0 -0
package/dist/index.js
CHANGED
|
@@ -101,7 +101,7 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
|
|
|
101
101
|
return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
|
|
102
102
|
};
|
|
103
103
|
|
|
104
|
-
var styles$
|
|
104
|
+
var styles$l = {
|
|
105
105
|
backdrop: {
|
|
106
106
|
position: 'fixed',
|
|
107
107
|
top: 0,
|
|
@@ -194,10 +194,10 @@ var BottomSheet = function (_a) {
|
|
|
194
194
|
}, [visible, onClose]);
|
|
195
195
|
if (!visible)
|
|
196
196
|
return null;
|
|
197
|
-
return ReactDOM__default["default"].createPortal(jsxRuntime.jsx("div", __assign({ style: styles$
|
|
197
|
+
return ReactDOM__default["default"].createPortal(jsxRuntime.jsx("div", __assign({ style: styles$l.backdrop, onClick: onClose }, { children: jsxRuntime.jsxs("div", __assign({ style: __assign(__assign({}, styles$l.sheet), { paddingBottom: paddingBottom }), onClick: function (e) { return e.stopPropagation(); } }, { children: [jsxRuntime.jsxs("div", __assign({ style: styles$l.header }, { children: [jsxRuntime.jsx("span", __assign({ style: styles$l.title }, { children: title })), jsxRuntime.jsx("button", __assign({ style: styles$l.closeButton, onClick: onClose }, { children: "\u00D7" }))] })), jsxRuntime.jsx("div", __assign({ style: styles$l.content }, { children: children }))] })) })), document.body);
|
|
198
198
|
};
|
|
199
199
|
|
|
200
|
-
var styles$
|
|
200
|
+
var styles$k = {
|
|
201
201
|
content: {
|
|
202
202
|
display: 'flex',
|
|
203
203
|
cursor: 'pointer',
|
|
@@ -212,7 +212,7 @@ var TouchableOpacity = function (_a) {
|
|
|
212
212
|
onPress(event);
|
|
213
213
|
}
|
|
214
214
|
};
|
|
215
|
-
return (jsxRuntime.jsx("div", __assign({ onClick: handleOnPress, style: __assign(__assign(__assign({}, styles$
|
|
215
|
+
return (jsxRuntime.jsx("div", __assign({ onClick: handleOnPress, style: __assign(__assign(__assign({}, styles$k.content), style), { opacity: disabled ? 0.5 : 1, pointerEvents: disabled ? 'none' : 'auto' }) }, props, { children: children })));
|
|
216
216
|
};
|
|
217
217
|
|
|
218
218
|
var Colors = {
|
|
@@ -625,7 +625,7 @@ var CameraModal = function (_a) {
|
|
|
625
625
|
return ReactDOM__default["default"].createPortal(jsxRuntime.jsxs("div", __assign({ style: cameraStyles$1.overlay }, { children: [capturedImage ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("img", { src: capturedImage, alt: "Captured", style: cameraStyles$1.previewImage }), jsxRuntime.jsx(TouchableOpacity, __assign({ onPress: handleUsePhoto, style: cameraStyles$1.floatingBottomButtons }, { children: jsxRuntime.jsx(View, __assign({ style: cameraStyles$1.captureButton }, { children: jsxRuntime.jsx(View, __assign({ style: cameraStyles$1.innerButton }, { children: jsxRuntime.jsx(Images, { src: Icons.send, style: cameraStyles$1.sendButton }) })) })) }))] })) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("video", { ref: videoRef, autoPlay: true, playsInline: true, style: __assign(__assign({}, cameraStyles$1.video), { transform: isFrontCamera ? 'scaleX(-1)' : 'none' }) }), jsxRuntime.jsx("canvas", { ref: canvasRef, style: { display: 'none' } }), isCameraReady && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(TouchableOpacity, __assign({ onPress: handleCapture, style: cameraStyles$1.floatingBottomButtons }, { children: jsxRuntime.jsx(View, __assign({ style: cameraStyles$1.captureButton }, { children: jsxRuntime.jsx(View, { style: cameraStyles$1.innerButton }) })) })), hasRearCamera && (jsxRuntime.jsx(TouchableOpacity, __assign({ onPress: toggleCamera, style: cameraStyles$1.floatingBottomRotateButtons }, { children: jsxRuntime.jsx(View, __assign({ style: cameraStyles$1.captureRotateButton }, { children: jsxRuntime.jsx(Images, { src: Icons.rotate, style: cameraStyles$1.rotateButton }) })) })))] }))] })), jsxRuntime.jsx("button", __assign({ onClick: handleOnPressClose, style: cameraStyles$1.closeButton }, { children: "\u00D7" }))] })), document.body);
|
|
626
626
|
};
|
|
627
627
|
|
|
628
|
-
var styles$
|
|
628
|
+
var styles$j = {
|
|
629
629
|
backdrop: {
|
|
630
630
|
position: 'fixed',
|
|
631
631
|
top: 0,
|
|
@@ -678,7 +678,7 @@ var styles$i = {
|
|
|
678
678
|
},
|
|
679
679
|
};
|
|
680
680
|
|
|
681
|
-
var styles$
|
|
681
|
+
var styles$i = {
|
|
682
682
|
h1: {
|
|
683
683
|
fontSize: 32,
|
|
684
684
|
},
|
|
@@ -857,7 +857,7 @@ var styles$h = {
|
|
|
857
857
|
|
|
858
858
|
var Text = function (_a) {
|
|
859
859
|
var _b = _a.bottom, bottom = _b === void 0 ? 0 : _b, _c = _a.center, center = _c === void 0 ? false : _c, children = _a.children, _d = _a.color, color = _d === void 0 ? Colors.black : _d, _e = _a.left, left = _e === void 0 ? 0 : _e, _f = _a.right, right = _f === void 0 ? 0 : _f, _g = _a.style, style = _g === void 0 ? {} : _g, _h = _a.top, top = _h === void 0 ? 0 : _h, _j = _a.type, type = _j === void 0 ? 'normal_16' : _j, props = __rest(_a, ["bottom", "center", "children", "color", "left", "right", "style", "top", "type"]);
|
|
860
|
-
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsx("p", __assign({ style: __assign(__assign({ marginTop: top, marginRight: right, marginBottom: bottom, marginLeft: left, color: color, textAlign: center ? 'center' : 'left' }, styles$
|
|
860
|
+
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsx("p", __assign({ style: __assign(__assign({ marginTop: top, marginRight: right, marginBottom: bottom, marginLeft: left, color: color, textAlign: center ? 'center' : 'left' }, styles$i[type]), style) }, props, { children: children })) }));
|
|
861
861
|
};
|
|
862
862
|
|
|
863
863
|
var BottomSheetPhoto = function (_a) {
|
|
@@ -939,10 +939,10 @@ var BottomSheetPhoto = function (_a) {
|
|
|
939
939
|
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("input", { type: "file", accept: ".png,.jpg,.jpeg", ref: fileInputRef, onChange: handleFileChange, style: { display: 'none' } }), cameraVisible && (jsxRuntime.jsx(CameraModal, { onClose: function () { return setCameraVisible(false); }, onCapture: function (base64) {
|
|
940
940
|
onUploadBase64 === null || onUploadBase64 === void 0 ? void 0 : onUploadBase64(base64, null);
|
|
941
941
|
} })), visible &&
|
|
942
|
-
ReactDOM__default["default"].createPortal(jsxRuntime.jsx("div", __assign({ style: styles$
|
|
942
|
+
ReactDOM__default["default"].createPortal(jsxRuntime.jsx("div", __assign({ style: styles$j.backdrop, onClick: onClose }, { children: jsxRuntime.jsxs("div", __assign({ style: __assign(__assign({}, styles$j.sheet), { paddingBottom: paddingBottom }), onClick: function (e) { return e.stopPropagation(); } }, { children: [jsxRuntime.jsxs("div", __assign({ style: styles$j.header }, { children: [jsxRuntime.jsx("span", __assign({ style: styles$j.title }, { children: title })), jsxRuntime.jsx("button", __assign({ style: styles$j.closeButton, onClick: onClose }, { children: "\u00D7" }))] })), jsxRuntime.jsx("div", __assign({ style: styles$j.content }, { children: bottomSheetData.map(function (val, idx) { return (jsxRuntime.jsx(TouchableOpacity, __assign({ onPress: val.onPress, style: styles$j.contentBottomSheet }, { children: jsxRuntime.jsx(Text, { children: val.title }) }), idx)); }) }))] })) })), document.body)] }));
|
|
943
943
|
};
|
|
944
944
|
|
|
945
|
-
var styles$
|
|
945
|
+
var styles$h = {
|
|
946
946
|
content: {
|
|
947
947
|
display: 'flex',
|
|
948
948
|
justifyContent: 'center',
|
|
@@ -953,7 +953,7 @@ var styles$g = {
|
|
|
953
953
|
};
|
|
954
954
|
|
|
955
955
|
var isMobileDisplay = window.innerWidth <= 768;
|
|
956
|
-
var styles$
|
|
956
|
+
var styles$g = {
|
|
957
957
|
content: {
|
|
958
958
|
display: 'flex',
|
|
959
959
|
justifyContent: 'center',
|
|
@@ -1020,9 +1020,9 @@ styleInject(css_248z);
|
|
|
1020
1020
|
var LoadingSpinner = function (_a) {
|
|
1021
1021
|
var _b = _a.loadingType, loadingType = _b === void 0 ? false : _b, _c = _a.loadingIcon, loadingIcon = _c === void 0 ? '' : _c;
|
|
1022
1022
|
var renderSpinnerComponent = function () { return jsxRuntime.jsx("div", { className: "loading-spinner" }); };
|
|
1023
|
-
var renderSpinnerSection = function () { return (jsxRuntime.jsx(View, __assign({ style: styles$
|
|
1024
|
-
var renderSpinnerSectionS = function () { return (jsxRuntime.jsx(View, __assign({ style: styles$
|
|
1025
|
-
var renderSpinnerPage = function () { return (jsxRuntime.jsx(View, __assign({ style: styles$
|
|
1023
|
+
var renderSpinnerSection = function () { return (jsxRuntime.jsx(View, __assign({ style: styles$g.loadingSpinnerSectionContainer }, { children: jsxRuntime.jsx("div", { className: "loading-spinner-section" }) }))); };
|
|
1024
|
+
var renderSpinnerSectionS = function () { return (jsxRuntime.jsx(View, __assign({ style: styles$g.loadingSpinnerSectionContainer }, { children: jsxRuntime.jsx("div", { className: "loading-spinner-section-s" }) }))); };
|
|
1025
|
+
var renderSpinnerPage = function () { return (jsxRuntime.jsx(View, __assign({ style: styles$g.loadingSpinnerPageContainer }, { children: jsxRuntime.jsxs(View, __assign({ style: styles$g.loadingSpinnerPageContent }, { children: [jsxRuntime.jsx("div", { className: "loading-spinner-pages" }), loadingIcon ? (jsxRuntime.jsx("img", { style: styles$g.loadingIcon, src: loadingIcon, alt: '' })) : null] })) }))); };
|
|
1026
1026
|
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: loadingType === 'page'
|
|
1027
1027
|
? renderSpinnerPage()
|
|
1028
1028
|
: loadingType === 'section'
|
|
@@ -1040,10 +1040,10 @@ var Button = function (_a) {
|
|
|
1040
1040
|
? 'transparent'
|
|
1041
1041
|
: backgroundColor
|
|
1042
1042
|
? backgroundColor
|
|
1043
|
-
: Colors.black, border: outlineColor ? '1px solid rgba(0, 0, 0, 1)' : 'none', borderRadius: borderRadius, color: outlineColor ? outlineColor : Colors.white, fontSize: size, fontWeight: bold && 'bold', marginBottom: bottom, marginLeft: left, marginRight: right, marginTop: top, outline: !outlineColor && 'none', padding: padding, textAlign: center ? 'center' : 'left' }, style), styles$
|
|
1043
|
+
: Colors.black, border: outlineColor ? '1px solid rgba(0, 0, 0, 1)' : 'none', borderRadius: borderRadius, color: outlineColor ? outlineColor : Colors.white, fontSize: size, fontWeight: bold && 'bold', marginBottom: bottom, marginLeft: left, marginRight: right, marginTop: top, outline: !outlineColor && 'none', padding: padding, textAlign: center ? 'center' : 'left' }, style), styles$h.content), disabled: isLoading || disabled, onClick: onPress, type: 'submit' }, props, { children: [!isLoading ? label : null, isLoading && jsxRuntime.jsx(LoadingSpinner, { loadingType: false })] })) }));
|
|
1044
1044
|
};
|
|
1045
1045
|
|
|
1046
|
-
var styles$
|
|
1046
|
+
var styles$f = {
|
|
1047
1047
|
label: {
|
|
1048
1048
|
display: 'flex',
|
|
1049
1049
|
alignItems: 'center',
|
|
@@ -1065,10 +1065,10 @@ var Checkbox = function (_a) {
|
|
|
1065
1065
|
handleOnChecked(event.target.checked);
|
|
1066
1066
|
}
|
|
1067
1067
|
};
|
|
1068
|
-
return (jsxRuntime.jsx("label", __assign({ style: __assign(__assign({}, styles$
|
|
1068
|
+
return (jsxRuntime.jsx("label", __assign({ style: __assign(__assign({}, styles$f.label), { cursor: disabled ? 'not-allowed' : 'pointer', opacity: disabled ? 0.6 : 1 }) }, { children: jsxRuntime.jsx("input", { type: "checkbox", checked: disabled ? false : checked, disabled: disabled, onChange: handleChange, style: __assign(__assign({}, styles$f.input), { cursor: disabled ? 'not-allowed' : 'pointer' }) }) })));
|
|
1069
1069
|
};
|
|
1070
1070
|
|
|
1071
|
-
var styles$
|
|
1071
|
+
var styles$e = {
|
|
1072
1072
|
container: {
|
|
1073
1073
|
flex: 1,
|
|
1074
1074
|
minHeight: '100vh',
|
|
@@ -1083,10 +1083,10 @@ var styles$d = {
|
|
|
1083
1083
|
|
|
1084
1084
|
var Container = function (_a) {
|
|
1085
1085
|
var children = _a.children, containerStyle = _a.containerStyle, contentStyle = _a.contentStyle;
|
|
1086
|
-
return (jsxRuntime.jsx(View, __assign({ style: __assign(__assign({}, styles$
|
|
1086
|
+
return (jsxRuntime.jsx(View, __assign({ style: __assign(__assign({}, styles$e.container), { containerStyle: containerStyle }) }, { children: jsxRuntime.jsx(View, __assign({ style: __assign(__assign({}, styles$e.content), { contentStyle: contentStyle }) }, { children: children })) })));
|
|
1087
1087
|
};
|
|
1088
1088
|
|
|
1089
|
-
var styles$
|
|
1089
|
+
var styles$d = {
|
|
1090
1090
|
badgeContainer: {
|
|
1091
1091
|
position: 'absolute',
|
|
1092
1092
|
zIndex: 1,
|
|
@@ -1123,10 +1123,10 @@ var CornerBadge = function (_a) {
|
|
|
1123
1123
|
var _b = _a.text, text = _b === void 0 ? 'NEW' : _b, _c = _a.visible, visible = _c === void 0 ? true : _c;
|
|
1124
1124
|
if (!visible)
|
|
1125
1125
|
return null;
|
|
1126
|
-
return (jsxRuntime.jsx(View, __assign({ style: styles$
|
|
1126
|
+
return (jsxRuntime.jsx(View, __assign({ style: styles$d.badgeContainer }, { children: jsxRuntime.jsx(View, __assign({ style: styles$d.ribbon }, { children: jsxRuntime.jsx(Text, __assign({ style: styles$d.text }, { children: text })) })) })));
|
|
1127
1127
|
};
|
|
1128
1128
|
|
|
1129
|
-
var styles$
|
|
1129
|
+
var styles$c = {
|
|
1130
1130
|
cardWrapper: {
|
|
1131
1131
|
flexDirection: 'row',
|
|
1132
1132
|
width: '100%',
|
|
@@ -1203,9 +1203,9 @@ var Countdown = function (_a) {
|
|
|
1203
1203
|
}, [(_b = weddingDate === null || weddingDate === void 0 ? void 0 : weddingDate.reception) === null || _b === void 0 ? void 0 : _b.start]);
|
|
1204
1204
|
var renderCardBox = function (_a, idx) {
|
|
1205
1205
|
var label = _a.label, value = _a.value;
|
|
1206
|
-
return (jsxRuntime.jsxs(View, __assign({ style: __assign(__assign({}, styles$
|
|
1206
|
+
return (jsxRuntime.jsxs(View, __assign({ style: __assign(__assign({}, styles$c.cardBox), { cardStyle: cardStyle, marginRight: idx === data.length - 1 ? 0 : 8 }) }, { children: [jsxRuntime.jsx(Text, { style: __assign(__assign({}, styles$c.cardTitle), { fontStyle: fontStyle }), children: value ? (value < 0 ? '00' : value) : '' }), jsxRuntime.jsx(Text, { children: label, style: __assign(__assign({}, styles$c.cardDescription), { fontStyle: fontStyle }) })] }), idx));
|
|
1207
1207
|
};
|
|
1208
|
-
var render = function () { return (jsxRuntime.jsx(View, __assign({ style: __assign(__assign({}, styles$
|
|
1208
|
+
var render = function () { return (jsxRuntime.jsx(View, __assign({ style: __assign(__assign({}, styles$c.cardWrapper), { containerStyle: containerStyle }) }, { children: data === null || data === void 0 ? void 0 : data.map(function (val, idx) { return renderCardBox(val, idx); }) }))); };
|
|
1209
1209
|
return render();
|
|
1210
1210
|
};
|
|
1211
1211
|
|
|
@@ -1239,7 +1239,7 @@ var translationUS = {
|
|
|
1239
1239
|
maximumLimit: 'Maximum Limit:',
|
|
1240
1240
|
};
|
|
1241
1241
|
|
|
1242
|
-
var styles$
|
|
1242
|
+
var styles$b = {
|
|
1243
1243
|
wrapper: {
|
|
1244
1244
|
width: '100%',
|
|
1245
1245
|
display: 'flex',
|
|
@@ -1384,8 +1384,8 @@ var DocumentUploader = function (_a) {
|
|
|
1384
1384
|
var ext = dot !== -1 ? name.slice(dot) : '';
|
|
1385
1385
|
return name.slice(0, max - ext.length - 3) + '...' + ext;
|
|
1386
1386
|
};
|
|
1387
|
-
return (jsxRuntime.jsxs("div", __assign({ style: styles$
|
|
1388
|
-
listErrorMessage.map(function (msg, i) { return (jsxRuntime.jsxs("p", __assign({ style: styles$
|
|
1387
|
+
return (jsxRuntime.jsxs("div", __assign({ style: styles$b.wrapper }, { children: [jsxRuntime.jsxs("div", __assign({ style: styles$b.uploadBox }, { children: [jsxRuntime.jsx("div", __assign({ style: styles$b.cloudIcon }, { children: "\u2601\uFE0F" })), jsxRuntime.jsx("p", __assign({ style: styles$b.title }, { children: t.selectFileTitle })), jsxRuntime.jsxs("p", __assign({ style: styles$b.subtitle }, { children: [t.allowedFormat(allowedExtensions.join(', ')), " \u2014 ", t.maximumLimit] })), jsxRuntime.jsxs(View, __assign({ style: styles$b.noteContainer }, { children: [jsxRuntime.jsx(Text, __assign({ type: "normal_14", style: styles$b.note }, { children: t.maxSize(maxSizeMB) })), jsxRuntime.jsx(Text, __assign({ type: "normal_14", style: styles$b.note }, { children: t.maxUpload(maxUpload) })), jsxRuntime.jsx(Text, __assign({ type: "normal_14", style: styles$b.note }, { children: t.maxData(maxData) }))] })), jsxRuntime.jsxs("label", __assign({ style: __assign(__assign({}, styles$b.button), { backgroundColor: files.length >= maxUpload ? '#9ca3af' : '#f97316', cursor: files.length >= maxUpload ? 'not-allowed' : 'pointer' }) }, { children: [t.pickFile, jsxRuntime.jsx("input", { ref: fileInputRef, type: "file", accept: allowedExtensions.join(','), disabled: files.length >= maxUpload, style: styles$b.hiddenInput, onChange: handleFileChange })] })), error && jsxRuntime.jsxs("p", __assign({ style: styles$b.error }, { children: ["\u26A0\uFE0F ", error] })), Array.isArray(listErrorMessage) &&
|
|
1388
|
+
listErrorMessage.map(function (msg, i) { return (jsxRuntime.jsxs("p", __assign({ style: styles$b.error }, { children: ["\u26A0\uFE0F ", msg] }), i)); }), successMessage && jsxRuntime.jsxs("p", __assign({ style: styles$b.success }, { children: ["\u2705 ", successMessage] }))] })), files.length > 0 && (jsxRuntime.jsxs("div", __assign({ style: styles$b.fileListBox }, { children: [jsxRuntime.jsx("p", __assign({ style: styles$b.fileListHeader }, { children: t.uploadingFiles(files.length, maxUpload) })), files.map(function (file, i) { return (jsxRuntime.jsxs("div", __assign({ style: styles$b.fileRow }, { children: [jsxRuntime.jsxs("p", __assign({ style: styles$b.fileName }, { children: ["\uD83D\uDCC4 ", shortenFileName(file.name)] })), jsxRuntime.jsx("button", __assign({ style: styles$b.removeButton, onClick: function () { return handleRemove(i); } }, { children: t.remove }))] }), i)); })] })))] })));
|
|
1389
1389
|
};
|
|
1390
1390
|
|
|
1391
1391
|
var DropDown = function (_a) {
|
|
@@ -1399,7 +1399,7 @@ var DropDown = function (_a) {
|
|
|
1399
1399
|
}) })));
|
|
1400
1400
|
};
|
|
1401
1401
|
|
|
1402
|
-
var styles$
|
|
1402
|
+
var styles$a = {
|
|
1403
1403
|
container: {
|
|
1404
1404
|
borderRadius: 8,
|
|
1405
1405
|
paddingRight: 16,
|
|
@@ -1444,7 +1444,7 @@ var styles$9 = {
|
|
|
1444
1444
|
},
|
|
1445
1445
|
};
|
|
1446
1446
|
|
|
1447
|
-
var styles$
|
|
1447
|
+
var styles$9 = {
|
|
1448
1448
|
backdrop: {
|
|
1449
1449
|
position: 'fixed',
|
|
1450
1450
|
top: 0,
|
|
@@ -1495,11 +1495,11 @@ var PhotoPreviewModal = function (_a) {
|
|
|
1495
1495
|
}, [visible, onDismiss]);
|
|
1496
1496
|
if (!visible)
|
|
1497
1497
|
return null;
|
|
1498
|
-
return ReactDOM__default["default"].createPortal(jsxRuntime.jsx("div", __assign({ onClick: onDismiss, style: styles$
|
|
1498
|
+
return ReactDOM__default["default"].createPortal(jsxRuntime.jsx("div", __assign({ onClick: onDismiss, style: styles$9.backdrop }, { children: jsxRuntime.jsx("div", __assign({ onClick: function (e) { return e.stopPropagation(); }, style: styles$9.modalContent }, { children: imageUrl ? (jsxRuntime.jsx("img", { src: imageUrl, alt: '', onError: function (_a) {
|
|
1499
1499
|
var currentTarget = _a.currentTarget;
|
|
1500
1500
|
currentTarget.onerror = null;
|
|
1501
1501
|
currentTarget.src = Icons.image_not_available;
|
|
1502
|
-
}, style: styles$
|
|
1502
|
+
}, style: styles$9.image })) : (jsxRuntime.jsx("p", __assign({ style: styles$9.noImageContainer }, { children: "No image provided" }))) })) })), document.body);
|
|
1503
1503
|
};
|
|
1504
1504
|
|
|
1505
1505
|
var ImageInput = function (_a) {
|
|
@@ -1509,7 +1509,7 @@ var ImageInput = function (_a) {
|
|
|
1509
1509
|
var _h = react.useState(false), isPreviewVisible = _h[0], setIsPreviewVisible = _h[1];
|
|
1510
1510
|
var handleOnUpload = function () { return setIsVisibleBottomSheet(true); };
|
|
1511
1511
|
var handleOnPreview = function () { return setIsPreviewVisible(true); };
|
|
1512
|
-
return (jsxRuntime.jsxs(View, __assign({ style: __assign(__assign({}, styles$
|
|
1512
|
+
return (jsxRuntime.jsxs(View, __assign({ style: __assign(__assign({}, styles$a.container), containerStyle) }, { children: [jsxRuntime.jsx(TouchableOpacity, __assign({ style: styles$a.containerImage, onPress: imagePreview ? handleOnPreview : handleOnUpload }, { children: jsxRuntime.jsx(Images, { src: imagePreview ? imagePreview : Icons.camera, style: imagePreview ? styles$a.image : styles$a.iconCamera }) })), jsxRuntime.jsxs(View, __assign({ style: styles$a.containerText }, { children: [label && (jsxRuntime.jsx(Text, __assign({ type: "bold_16", style: styles$a.label }, { children: label }))), subLabel && jsxRuntime.jsx(Text, { children: subLabel }), isMandatory && jsxRuntime.jsx(Text, __assign({ type: "normal_14_red" }, { children: '*Wajib' }))] })), isEditAble && imagePreview && (jsxRuntime.jsx(TouchableOpacity, __assign({ onPress: handleOnUpload }, { children: jsxRuntime.jsx(Images, { src: Icons.edit, style: styles$a.iconEdit }) }))), jsxRuntime.jsx(PhotoPreviewModal, { visible: isPreviewVisible, onDismiss: function () { return setIsPreviewVisible(false); }, imageUrl: imagePreview }), jsxRuntime.jsx(BottomSheetPhoto, { visible: isVisibleBottomSheet, onClose: function () { return setIsVisibleBottomSheet(false); }, onUploadBase64: function (base64) {
|
|
1513
1513
|
if (typeof base64 === 'string') {
|
|
1514
1514
|
setImagePreview(base64);
|
|
1515
1515
|
if (typeof handleOnPickImage === 'function') {
|
|
@@ -1519,7 +1519,7 @@ var ImageInput = function (_a) {
|
|
|
1519
1519
|
} })] })));
|
|
1520
1520
|
};
|
|
1521
1521
|
|
|
1522
|
-
var styles$
|
|
1522
|
+
var styles$8 = {
|
|
1523
1523
|
sliderContainer: {
|
|
1524
1524
|
position: 'relative',
|
|
1525
1525
|
maxWidth: '600px',
|
|
@@ -1619,16 +1619,16 @@ var ImageSlider = function (_a) {
|
|
|
1619
1619
|
return prevIndex === images.length - 1 ? 0 : prevIndex + 1;
|
|
1620
1620
|
});
|
|
1621
1621
|
};
|
|
1622
|
-
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [images && (images === null || images === void 0 ? void 0 : images.length) > 0 ? (jsxRuntime.jsxs(TouchableOpacity, __assign({ onPress: function () { return setIsPreviewVisible(true); }, style: __assign(__assign({}, styles$
|
|
1622
|
+
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [images && (images === null || images === void 0 ? void 0 : images.length) > 0 ? (jsxRuntime.jsxs(TouchableOpacity, __assign({ onPress: function () { return setIsPreviewVisible(true); }, style: __assign(__assign({}, styles$8.sliderContainer), style), onTouchStart: handleTouchStart, onTouchMove: handleTouchMove, onTouchEnd: handleTouchEnd, onMouseDown: handleMouseDown, onMouseMove: handleMouseMove, onMouseUp: handleMouseUp, onMouseLeave: handleMouseLeave }, { children: [jsxRuntime.jsx("img", { src: (_b = images === null || images === void 0 ? void 0 : images[currentIndex]) === null || _b === void 0 ? void 0 : _b.file, alt: "slide-".concat(currentIndex), style: styles$8.image, draggable: false, onError: function (_a) {
|
|
1623
1623
|
var currentTarget = _a.currentTarget;
|
|
1624
1624
|
currentTarget.onerror = null;
|
|
1625
1625
|
currentTarget.src = Icons.image_not_available;
|
|
1626
|
-
} }), jsxRuntime.jsxs("div", __assign({ style: styles$
|
|
1626
|
+
} }), jsxRuntime.jsxs("div", __assign({ style: styles$8.counter }, { children: [currentIndex + 1, " / ", images.length] }))] }))) : (jsxRuntime.jsx(Images, { src: '', style: __assign(__assign({}, styles$8.imageNotAvailable), style) })), jsxRuntime.jsx(PhotoPreviewModal, { visible: isPreviewVisible, onDismiss: function () { return setIsPreviewVisible(false); }, imageUrl: images.length > 0
|
|
1627
1627
|
? (_c = images === null || images === void 0 ? void 0 : images[currentIndex]) === null || _c === void 0 ? void 0 : _c.file
|
|
1628
1628
|
: Icons.image_not_available })] }));
|
|
1629
1629
|
};
|
|
1630
1630
|
|
|
1631
|
-
var styles$
|
|
1631
|
+
var styles$7 = {
|
|
1632
1632
|
container: {
|
|
1633
1633
|
padding: 16,
|
|
1634
1634
|
backgroundColor: Colors.white,
|
|
@@ -1748,20 +1748,20 @@ var MultipleImageInput = function (_a) {
|
|
|
1748
1748
|
return updated;
|
|
1749
1749
|
});
|
|
1750
1750
|
};
|
|
1751
|
-
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Text, __assign({ style: styles$
|
|
1751
|
+
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Text, __assign({ style: styles$7.title }, { children: label })), jsxRuntime.jsxs(View, __assign({ style: __assign(__assign({}, styles$7.container), style) }, { children: [jsxRuntime.jsx("div", __assign({ style: styles$7.card }, props, { children: jsxRuntime.jsxs("div", __assign({ style: styles$7.previewContainer }, { children: [images.map(function (_a, index) {
|
|
1752
1752
|
var src = _a.src;
|
|
1753
|
-
return (jsxRuntime.jsxs("div", __assign({ style: styles$
|
|
1753
|
+
return (jsxRuntime.jsxs("div", __assign({ style: styles$7.previewWrapper }, { children: [jsxRuntime.jsx("button", __assign({ onClick: function () { return removeImage(index); }, style: styles$7.closeButton, "aria-label": "Remove image" }, { children: "\u00D7" })), jsxRuntime.jsx("img", { src: src, alt: "preview", style: styles$7.previewImage }), jsxRuntime.jsx("button", __assign({ onClick: function () {
|
|
1754
1754
|
setImagePreview(src);
|
|
1755
1755
|
setIsPreviewVisible(true);
|
|
1756
|
-
}, style: styles$
|
|
1757
|
-
}), jsxRuntime.jsx("div", __assign({ onClick: function () { return setIsVisibleBottomSheet(true); }, style: styles$
|
|
1756
|
+
}, style: styles$7.eyeButton, "aria-label": "Preview image" }, { children: "\uD83D\uDC41\uFE0F" }))] }), index));
|
|
1757
|
+
}), jsxRuntime.jsx("div", __assign({ onClick: function () { return setIsVisibleBottomSheet(true); }, style: styles$7.addButton, role: "button", tabIndex: 0, onKeyDown: function (e) {
|
|
1758
1758
|
if (e.key === 'Enter' || e.key === ' ') {
|
|
1759
1759
|
setIsVisibleBottomSheet(true);
|
|
1760
1760
|
}
|
|
1761
|
-
}, "aria-label": "Add images" }, { children: jsxRuntime.jsx("span", __assign({ style: styles$
|
|
1761
|
+
}, "aria-label": "Add images" }, { children: jsxRuntime.jsx("span", __assign({ style: styles$7.plusSign }, { children: "+" })) }))] })) })), jsxRuntime.jsx(PhotoPreviewModal, { visible: isPreviewVisible, onDismiss: function () { return setIsPreviewVisible(false); }, imageUrl: imagePreview }), jsxRuntime.jsx(BottomSheetPhoto, { visible: isVisibleBottomSheet, onClose: function () { return setIsVisibleBottomSheet(false); }, title: "Pemilihan Gambar", onUploadBase64: function (data) { return handleChange(data); } })] }))] }));
|
|
1762
1762
|
};
|
|
1763
1763
|
|
|
1764
|
-
var styles$
|
|
1764
|
+
var styles$6 = {
|
|
1765
1765
|
container: {
|
|
1766
1766
|
justifyContent: 'center',
|
|
1767
1767
|
alignItems: 'center',
|
|
@@ -1771,10 +1771,10 @@ var styles$5 = {
|
|
|
1771
1771
|
|
|
1772
1772
|
var NoRecord = function (_a) {
|
|
1773
1773
|
var title = _a.title, _b = _a.style, style = _b === void 0 ? {} : _b, props = __rest(_a, ["title", "style"]);
|
|
1774
|
-
return (jsxRuntime.jsx(View, __assign({ style: __assign(__assign({}, styles$
|
|
1774
|
+
return (jsxRuntime.jsx(View, __assign({ style: __assign(__assign({}, styles$6.container), style) }, props, { children: jsxRuntime.jsx(Text, { children: title !== null && title !== void 0 ? title : 'No Record Found' }) })));
|
|
1775
1775
|
};
|
|
1776
1776
|
|
|
1777
|
-
var styles$
|
|
1777
|
+
var styles$5 = {
|
|
1778
1778
|
container: {
|
|
1779
1779
|
position: 'fixed',
|
|
1780
1780
|
left: 0,
|
|
@@ -1819,10 +1819,10 @@ var PopUp = function (_a) {
|
|
|
1819
1819
|
var _b = _a.backgroundButtonColor, backgroundButtonColor = _b === void 0 ? Colors.black : _b, _c = _a.isLoading, isLoading = _c === void 0 ? false : _c, popUpData = _a.popUpData, _d = _a.visible, visible = _d === void 0 ? false : _d, _e = _a.styleContainer, styleContainer = _e === void 0 ? {} : _e;
|
|
1820
1820
|
if (!visible)
|
|
1821
1821
|
return null;
|
|
1822
|
-
return (jsxRuntime.jsx(View, __assign({ style: __assign(__assign({}, styles$
|
|
1822
|
+
return (jsxRuntime.jsx(View, __assign({ style: __assign(__assign({}, styles$5.container), styleContainer) }, { children: jsxRuntime.jsxs(View, __assign({ style: styles$5.card }, { children: [jsxRuntime.jsxs(View, { children: [jsxRuntime.jsx(Text, __assign({ style: styles$5.headerTitle }, { children: popUpData === null || popUpData === void 0 ? void 0 : popUpData.title })), (popUpData === null || popUpData === void 0 ? void 0 : popUpData.description) && (jsxRuntime.jsx(Text, __assign({ style: styles$5.headerDescription }, { children: popUpData.description })))] }), jsxRuntime.jsxs(View, { children: [(popUpData === null || popUpData === void 0 ? void 0 : popUpData.labelDecline) && (popUpData === null || popUpData === void 0 ? void 0 : popUpData.onPressDecline) && (jsxRuntime.jsx(Button, { style: styles$5.buttonNegative, backgroundColor: backgroundButtonColor, outlineColor: Colors.black, isLoading: isLoading, label: popUpData.labelDecline, onPress: popUpData.onPressDecline })), jsxRuntime.jsx(Button, { style: styles$5.buttonPositive, backgroundColor: backgroundButtonColor, isLoading: isLoading, label: popUpData === null || popUpData === void 0 ? void 0 : popUpData.labelAccept, onPress: popUpData === null || popUpData === void 0 ? void 0 : popUpData.onPressAccept })] })] })) })));
|
|
1823
1823
|
};
|
|
1824
1824
|
|
|
1825
|
-
var styles$
|
|
1825
|
+
var styles$4 = {
|
|
1826
1826
|
label: {
|
|
1827
1827
|
marginBottom: 16,
|
|
1828
1828
|
},
|
|
@@ -1855,14 +1855,44 @@ var styles$3 = {
|
|
|
1855
1855
|
},
|
|
1856
1856
|
};
|
|
1857
1857
|
|
|
1858
|
-
var
|
|
1858
|
+
var styles$3 = {
|
|
1859
|
+
singleRadioContainer: {
|
|
1860
|
+
display: 'flex',
|
|
1861
|
+
marginBottom: '10px',
|
|
1862
|
+
flexDirection: 'row',
|
|
1863
|
+
},
|
|
1864
|
+
outterBullet: {
|
|
1865
|
+
width: 20,
|
|
1866
|
+
height: 20,
|
|
1867
|
+
borderRadius: 10,
|
|
1868
|
+
justifyContent: 'center',
|
|
1869
|
+
alignItems: 'center',
|
|
1870
|
+
backgroundColor: Colors.white,
|
|
1871
|
+
marginRight: 8,
|
|
1872
|
+
border: '1px solid rgba(0, 0, 0, 0.6)',
|
|
1873
|
+
},
|
|
1874
|
+
innerBulletActive: {
|
|
1875
|
+
width: 12,
|
|
1876
|
+
height: 12,
|
|
1877
|
+
borderRadius: 6,
|
|
1878
|
+
backgroundColor: Colors.black100,
|
|
1879
|
+
},
|
|
1880
|
+
innerBulletNotActive: {
|
|
1881
|
+
width: 12,
|
|
1882
|
+
height: 12,
|
|
1883
|
+
borderRadius: 6,
|
|
1884
|
+
backgroundColor: Colors.white,
|
|
1885
|
+
},
|
|
1886
|
+
};
|
|
1887
|
+
|
|
1888
|
+
var RadioButtonSingle = function (_a) {
|
|
1859
1889
|
var value = _a.value, handleChange = _a.handleChange, selectedOption = _a.selectedOption, children = _a.children;
|
|
1860
1890
|
return (jsxRuntime.jsxs(TouchableOpacity, __assign({ onPress: function () { return handleChange(value); }, style: styles$3.singleRadioContainer }, { children: [jsxRuntime.jsx(View, __assign({ style: styles$3.outterBullet }, { children: jsxRuntime.jsx(View, { style: selectedOption === value
|
|
1861
1891
|
? styles$3.innerBulletActive
|
|
1862
1892
|
: styles$3.innerBulletNotActive }) })), jsxRuntime.jsx(View, __assign({ style: { flex: 1 } }, { children: children }))] })));
|
|
1863
1893
|
};
|
|
1864
1894
|
|
|
1865
|
-
var
|
|
1895
|
+
var RadioButtonMultiple = function (_a) {
|
|
1866
1896
|
var label = _a.label, _b = _a.options, options = _b === void 0 ? [] : _b, selectedValue = _a.selectedValue, onSelect = _a.onSelect, _c = _a.keyField, keyField = _c === void 0 ? 'key' : _c, _d = _a.valueField, valueField = _d === void 0 ? 'value' : _d, styleContainer = _a.styleContainer, renderItem = _a.renderItem;
|
|
1867
1897
|
var _e = react.useState(selectedValue), selectedOption = _e[0], setSelectedOption = _e[1];
|
|
1868
1898
|
var handleChange = function (value) {
|
|
@@ -1870,7 +1900,7 @@ var RadioButton = function (_a) {
|
|
|
1870
1900
|
if (onSelect)
|
|
1871
1901
|
onSelect(value);
|
|
1872
1902
|
};
|
|
1873
|
-
return (jsxRuntime.jsxs(View, __assign({ style: __assign({}, styleContainer) }, { children: [jsxRuntime.jsx(Text, __assign({ type: "bold_16", style: styles$
|
|
1903
|
+
return (jsxRuntime.jsxs(View, __assign({ style: __assign({}, styleContainer) }, { children: [jsxRuntime.jsx(Text, __assign({ type: "bold_16", style: styles$4.label }, { children: label })), options.map(function (item, index) { return (jsxRuntime.jsx(RadioButtonSingle, __assign({ value: item[valueField], selectedOption: selectedOption, handleChange: handleChange }, { children: renderItem ? (renderItem(item)) : (jsxRuntime.jsx(Text, __assign({ type: "normal_14" }, { children: item[valueField] }))) }), item[keyField] || index)); })] })));
|
|
1874
1904
|
};
|
|
1875
1905
|
|
|
1876
1906
|
var cameraStyles = {
|
|
@@ -30699,7 +30729,8 @@ exports.MultipleImageInput = MultipleImageInput;
|
|
|
30699
30729
|
exports.NoRecord = NoRecord;
|
|
30700
30730
|
exports.PopUp = PopUp;
|
|
30701
30731
|
exports.PreviewPhoto = PhotoPreviewModal;
|
|
30702
|
-
exports.
|
|
30732
|
+
exports.RadioButtonMultiple = RadioButtonMultiple;
|
|
30733
|
+
exports.RadioButtonSingle = RadioButtonSingle;
|
|
30703
30734
|
exports.ScannerQR = ScannerCamera;
|
|
30704
30735
|
exports.SearchBox = SearchBox;
|
|
30705
30736
|
exports.Swipeable = Swipeable;
|