@teamnhz/rn-ui-toolkit 1.2.1 → 1.2.2

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.
Files changed (3) hide show
  1. package/dist/components/ImagePicker/index.d.ts +1 -2
  2. package/dist/components/ImagePicker/index.js +48 -27
  3. package/package.json +1 -1
package/dist/components/ImagePicker/index.d.ts CHANGED
@@ -1,9 +1,8 @@
1
1
  import React from "react";
2
2
  type Props = {
3
3
  mediaType: "photo" | "video";
4
- isMultiSelect?: boolean;
5
- onSuccess: (res: any) => void;
6
4
  visible: boolean;
5
+ onSuccess: (res: any) => void;
7
6
  onClose: () => void;
8
7
  enableCompression?: boolean;
9
8
  };
package/dist/components/ImagePicker/index.js CHANGED
@@ -7,25 +7,29 @@ import { Image as ImageCompressor, Video as VideoCompressor, } from "react-nativ
7
7
  import { cameraPermissions, galleryPermissions, checkMicroPhonePermission, } from "../../utils/permissions";
8
8
  import { Colors, Images, Scale, Typography } from "../../styles";
9
9
  //--------------------------------------
10
- // 🟦 FORMAT RESPONSE (single standard)
10
+ // 🟦 FORMAT PATH (always file:// format)
11
11
  //--------------------------------------
12
12
  const normalizePath = (p) => {
13
13
  if (!p)
14
14
  return "";
15
15
  return p.startsWith("file://") ? p : `file://${p}`;
16
16
  };
17
- const buildResponse = (raw, compressed) => {
18
- return {
19
- path: normalizePath(compressed || raw?.path || raw?.uri),
20
- originalPath: normalizePath(raw?.path || raw?.uri),
21
- fileName: raw?.fileName || "",
22
- type: raw?.type || "",
23
- duration: raw?.duration || undefined,
24
- };
25
- };
26
- const ImagePicker = ({ mediaType, onSuccess, visible, onClose, enableCompression = true, }) => {
17
+ //--------------------------------------
18
+ // 🟦 FINAL RESPONSE FORMAT
19
+ //--------------------------------------
20
+ const buildResponse = (raw, compressed) => ({
21
+ path: normalizePath(compressed || raw?.path || raw?.uri),
22
+ originalPath: normalizePath(raw?.path || raw?.uri),
23
+ fileName: raw?.fileName || "",
24
+ type: raw?.type || "",
25
+ duration: raw?.duration || undefined,
26
+ });
27
+ //--------------------------------------
28
+ // 🟦 MAIN COMPONENT
29
+ //--------------------------------------
30
+ const ImagePicker = ({ mediaType, visible, onSuccess, onClose, enableCompression = true, }) => {
27
31
  //--------------------------------------
28
- // 🟦 SEND RAW (loading true)
32
+ // SEND RAW (loader ON)
29
33
  //--------------------------------------
30
34
  const sendRaw = (raw) => {
31
35
  onSuccess({
@@ -34,16 +38,16 @@ const ImagePicker = ({ mediaType, onSuccess, visible, onClose, enableCompression
34
38
  });
35
39
  };
36
40
  //--------------------------------------
37
- // 🟦 SEND FINAL COMPRESSED
41
+ // SEND FINAL (loader OFF)
38
42
  //--------------------------------------
39
- const sendFinal = (raw, compressedPath) => {
43
+ const sendFinal = (raw, compressed) => {
40
44
  onSuccess({
41
45
  loading: false,
42
- data: buildResponse(raw, compressedPath),
46
+ data: buildResponse(raw, compressed),
43
47
  });
44
48
  };
45
49
  //--------------------------------------
46
- // 🟦 COMPRESS IMAGE
50
+ // COMPRESS IMAGE
47
51
  //--------------------------------------
48
52
  const compressImage = async (path) => {
49
53
  try {
@@ -57,7 +61,7 @@ const ImagePicker = ({ mediaType, onSuccess, visible, onClose, enableCompression
57
61
  }
58
62
  };
59
63
  //--------------------------------------
60
- // 🟦 COMPRESS VIDEO
64
+ // COMPRESS VIDEO
61
65
  //--------------------------------------
62
66
  const compressVideo = async (uri) => {
63
67
  try {
@@ -70,13 +74,14 @@ const ImagePicker = ({ mediaType, onSuccess, visible, onClose, enableCompression
70
74
  }
71
75
  };
72
76
  //--------------------------------------
73
- // 🟦 TAKE PHOTO / VIDEO FROM CAMERA
77
+ // CAMERA HANDLER
74
78
  //--------------------------------------
75
79
  const handleCamera = async () => {
80
+ onClose(); // 🔥 CLOSE FIRST (best UX)
76
81
  await cameraPermissions(async (granted) => {
77
82
  if (!granted)
78
83
  return;
79
- // PHOTO FROM CAMERA
84
+ // PHOTO
80
85
  if (mediaType === "photo") {
81
86
  try {
82
87
  const img = await ImageCropPicker.openCamera({
@@ -90,10 +95,10 @@ const ImagePicker = ({ mediaType, onSuccess, visible, onClose, enableCompression
90
95
  sendFinal(img, compressed);
91
96
  }
92
97
  catch (e) {
93
- console.log("Camera Photo Error", e);
98
+ console.log("Camera Photo Error:", e);
94
99
  }
95
100
  }
96
- // VIDEO FROM CAMERA
101
+ // VIDEO
97
102
  else {
98
103
  const mic = await checkMicroPhonePermission();
99
104
  if (!mic)
@@ -112,13 +117,14 @@ const ImagePicker = ({ mediaType, onSuccess, visible, onClose, enableCompression
112
117
  });
113
118
  };
114
119
  //--------------------------------------
115
- // 🟦 PICK FROM GALLERY
120
+ // GALLERY HANDLER
116
121
  //--------------------------------------
117
122
  const handleGallery = async () => {
123
+ onClose(); // 🔥 CLOSE IMMEDIATELY
118
124
  await galleryPermissions(async (granted) => {
119
125
  if (!granted)
120
126
  return;
121
- // PHOTO FROM GALLERY (CROP PICKER)
127
+ // PHOTO (Crop Picker)
122
128
  if (mediaType === "photo") {
123
129
  try {
124
130
  const img = await ImageCropPicker.openPicker({
@@ -132,10 +138,10 @@ const ImagePicker = ({ mediaType, onSuccess, visible, onClose, enableCompression
132
138
  sendFinal(img, compressed);
133
139
  }
134
140
  catch (e) {
135
- console.log("Gallery Photo Error", e);
141
+ console.log("Gallery Photo Error:", e);
136
142
  }
137
143
  }
138
- // VIDEO FROM GALLERY
144
+ // VIDEO
139
145
  else {
140
146
  launchImageLibrary({ mediaType: "video" }, async (res) => {
141
147
  const raw = res?.assets?.[0];
@@ -151,6 +157,8 @@ const ImagePicker = ({ mediaType, onSuccess, visible, onClose, enableCompression
151
157
  });
152
158
  };
153
159
  //--------------------------------------
160
+ // RETURN UI
161
+ //--------------------------------------
154
162
  return (React.createElement(BottomSheet, { visible: visible, onClose: onClose, height: 230 },
155
163
  React.createElement(View, { style: styles.container },
156
164
  React.createElement(TouchableOpacity, { style: styles.row, onPress: handleCamera },
@@ -166,10 +174,23 @@ const ImagePicker = ({ mediaType, onSuccess, visible, onClose, enableCompression
166
174
  React.createElement(Text, { style: styles.text }, "Cancel")))));
167
175
  };
168
176
  export default ImagePicker;
177
+ //--------------------------------------
178
+ // STYLES
179
+ //--------------------------------------
169
180
  const styles = StyleSheet.create({
170
181
  container: { flex: 1, padding: 16 },
171
- row: { flexDirection: "row", alignItems: "center" },
172
- text: { ...Typography.style.standardU(), color: Colors.white },
182
+ row: {
183
+ flexDirection: "row",
184
+ alignItems: "center",
185
+ justifyContent: "center", // 🔥 TEXT CENTERED
186
+ paddingVertical: 14,
187
+ },
188
+ text: {
189
+ ...Typography.style.standardU(),
190
+ color: Colors.white,
191
+ marginLeft: 10,
192
+ textAlign: "center",
193
+ },
173
194
  icon: {
174
195
  width: Scale.moderateScale(20),
175
196
  height: Scale.moderateScale(20),
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@teamnhz/rn-ui-toolkit",
3
- "version": "1.2.1",
3
+ "version": "1.2.2",
4
4
  "main": "dist/index.js",
5
5
  "types": "dist/index.d.ts",
6
6
  "files": [