@tradly/asset 1.0.18 → 1.0.20
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/core/MediaApiService.js +91 -50
- package/dist/esm/core/MediaApiService.js +91 -50
- package/dist/esm/native/FileUpload.native.js +51 -11
- package/dist/esm/native/Icons.native.js +44 -8
- package/dist/esm/native/MediaGallery.native.js +31 -23
- package/dist/esm/native/MediaPopup.native.js +6 -2
- package/dist/esm/native/MediaTab.native.js +12 -3
- package/dist/esm/native/VideosGallery.native.js +14 -6
- package/dist/native/FileUpload.native.js +51 -12
- package/dist/native/Icons.native.js +43 -7
- package/dist/native/MediaGallery.native.js +25 -18
- package/dist/native/MediaPopup.native.js +6 -2
- package/dist/native/MediaTab.native.js +12 -3
- package/dist/native/VideosGallery.native.js +15 -7
- package/package.json +1 -1
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import React from
|
|
2
|
-
import { View, Text, StyleSheet } from
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { View, Text, StyleSheet } from "react-native";
|
|
3
3
|
// Note: For better icons, you can use react-native-svg or react-native-vector-icons
|
|
4
4
|
// This is a simple implementation using Text/View
|
|
5
5
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
@@ -7,7 +7,7 @@ export var CloseIcon = function CloseIcon(_ref) {
|
|
|
7
7
|
var _ref$size = _ref.size,
|
|
8
8
|
size = _ref$size === void 0 ? 32 : _ref$size,
|
|
9
9
|
_ref$color = _ref.color,
|
|
10
|
-
color = _ref$color === void 0 ?
|
|
10
|
+
color = _ref$color === void 0 ? "#000000" : _ref$color;
|
|
11
11
|
return /*#__PURE__*/_jsx(View, {
|
|
12
12
|
style: [styles.closeIcon, {
|
|
13
13
|
width: size,
|
|
@@ -31,21 +31,57 @@ export var CameraIcon = function CameraIcon() {
|
|
|
31
31
|
})
|
|
32
32
|
});
|
|
33
33
|
};
|
|
34
|
+
export var VideoIcon = function VideoIcon() {
|
|
35
|
+
return /*#__PURE__*/_jsx(View, {
|
|
36
|
+
style: styles.videoIcon,
|
|
37
|
+
children: /*#__PURE__*/_jsx(Text, {
|
|
38
|
+
style: styles.videoIconText,
|
|
39
|
+
children: "\uD83C\uDFA5"
|
|
40
|
+
})
|
|
41
|
+
});
|
|
42
|
+
};
|
|
43
|
+
export var UploadIcon = function UploadIcon() {
|
|
44
|
+
return /*#__PURE__*/_jsx(View, {
|
|
45
|
+
style: styles.uploadIcon,
|
|
46
|
+
children: /*#__PURE__*/_jsx(Text, {
|
|
47
|
+
style: styles.uploadIconText,
|
|
48
|
+
children: "\uD83D\uDCE4"
|
|
49
|
+
})
|
|
50
|
+
});
|
|
51
|
+
};
|
|
34
52
|
var styles = StyleSheet.create({
|
|
35
53
|
closeIcon: {
|
|
36
|
-
justifyContent:
|
|
37
|
-
alignItems:
|
|
54
|
+
justifyContent: "center",
|
|
55
|
+
alignItems: "center"
|
|
38
56
|
},
|
|
39
57
|
closeIconText: {
|
|
40
|
-
fontWeight:
|
|
58
|
+
fontWeight: "bold"
|
|
41
59
|
},
|
|
42
60
|
cameraIcon: {
|
|
43
61
|
width: 22,
|
|
44
62
|
height: 18,
|
|
45
|
-
justifyContent:
|
|
46
|
-
alignItems:
|
|
63
|
+
justifyContent: "center",
|
|
64
|
+
alignItems: "center"
|
|
47
65
|
},
|
|
48
66
|
cameraIconText: {
|
|
49
67
|
fontSize: 18
|
|
68
|
+
},
|
|
69
|
+
videoIcon: {
|
|
70
|
+
width: 22,
|
|
71
|
+
height: 18,
|
|
72
|
+
justifyContent: "center",
|
|
73
|
+
alignItems: "center"
|
|
74
|
+
},
|
|
75
|
+
videoIconText: {
|
|
76
|
+
fontSize: 18
|
|
77
|
+
},
|
|
78
|
+
uploadIcon: {
|
|
79
|
+
width: 22,
|
|
80
|
+
height: 18,
|
|
81
|
+
justifyContent: "center",
|
|
82
|
+
alignItems: "center"
|
|
83
|
+
},
|
|
84
|
+
uploadIconText: {
|
|
85
|
+
fontSize: 18
|
|
50
86
|
}
|
|
51
87
|
});
|
|
@@ -12,21 +12,27 @@ function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r)
|
|
|
12
12
|
function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
|
|
13
13
|
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
|
14
14
|
function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
|
|
15
|
-
import React, { useState, useEffect } from
|
|
16
|
-
import { View, FlatList, Image, TouchableOpacity, StyleSheet, Dimensions } from
|
|
17
|
-
import FileUpload from
|
|
18
|
-
import ImagesSkeleton from
|
|
19
|
-
import Pagination from
|
|
20
|
-
|
|
21
|
-
import { defaultTheme } from
|
|
15
|
+
import React, { useState, useEffect } from "react";
|
|
16
|
+
import { View, FlatList, Image, TouchableOpacity, StyleSheet, Dimensions } from "react-native";
|
|
17
|
+
import FileUpload from "./FileUpload.native";
|
|
18
|
+
import ImagesSkeleton from "./ImagesSkeleton.native";
|
|
19
|
+
import Pagination from "./Pagination.native";
|
|
20
|
+
// Icons are now passed via props, no need to import here
|
|
21
|
+
import { defaultTheme } from "./theme";
|
|
22
22
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
23
|
-
var _Dimensions$get = Dimensions.get(
|
|
23
|
+
var _Dimensions$get = Dimensions.get("window"),
|
|
24
24
|
SCREEN_WIDTH = _Dimensions$get.width;
|
|
25
25
|
var NUM_COLUMNS = 3;
|
|
26
|
-
var ITEM_MARGIN =
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
26
|
+
var ITEM_MARGIN = 4; // Reduced margin for better fit
|
|
27
|
+
// Calculate item size accounting for:
|
|
28
|
+
// - Container padding (md = 12px on each side = 24px total)
|
|
29
|
+
// - Grid padding (2px on each side = 4px total)
|
|
30
|
+
// - Item margins between items (4px * 2 gaps = 8px total)
|
|
31
|
+
var CONTAINER_PADDING = 24; // paddingHorizontal md (12 * 2)
|
|
32
|
+
var GRID_PADDING = 4; // padding 2 on each side (2 * 2)
|
|
33
|
+
var TOTAL_MARGINS = ITEM_MARGIN * (NUM_COLUMNS - 1) * 2; // margins between items (4px * 2 gaps = 8px)
|
|
34
|
+
var ITEM_SIZE = (SCREEN_WIDTH - CONTAINER_PADDING - GRID_PADDING - TOTAL_MARGINS) / NUM_COLUMNS;
|
|
35
|
+
var IMAGE_MIME_TYPES = ["image/png", "image/jpeg", "image/webp", "image/svg+xml", "image/gif", "image/avif", "image/x-icon", "image/vnd.microsoft.icon", "image/heic", "image/heif"];
|
|
30
36
|
var ImagesGallery = function ImagesGallery(_ref) {
|
|
31
37
|
var update_data = _ref.update_data,
|
|
32
38
|
closePopup = _ref.closePopup,
|
|
@@ -34,6 +40,7 @@ var ImagesGallery = function ImagesGallery(_ref) {
|
|
|
34
40
|
onError = _ref.onError,
|
|
35
41
|
picker = _ref.picker,
|
|
36
42
|
pickerOptions = _ref.pickerOptions,
|
|
43
|
+
icons = _ref.icons,
|
|
37
44
|
_ref$theme = _ref.theme,
|
|
38
45
|
theme = _ref$theme === void 0 ? defaultTheme : _ref$theme,
|
|
39
46
|
containerStyle = _ref.containerStyle,
|
|
@@ -96,7 +103,7 @@ var ImagesGallery = function ImagesGallery(_ref) {
|
|
|
96
103
|
case 3:
|
|
97
104
|
_context.p = 3;
|
|
98
105
|
_t = _context.v;
|
|
99
|
-
console.error(
|
|
106
|
+
console.error("Error loading media:", _t);
|
|
100
107
|
if (onError) {
|
|
101
108
|
onError(_t);
|
|
102
109
|
}
|
|
@@ -135,13 +142,13 @@ var ImagesGallery = function ImagesGallery(_ref) {
|
|
|
135
142
|
onUploadError: onError,
|
|
136
143
|
picker: picker,
|
|
137
144
|
pickerOptions: pickerOptions,
|
|
138
|
-
|
|
139
|
-
|
|
145
|
+
icons: icons,
|
|
146
|
+
theme: theme
|
|
140
147
|
})
|
|
141
148
|
});
|
|
142
149
|
}
|
|
143
150
|
var image = images[index - 1];
|
|
144
|
-
var imageUrl = typeof image ===
|
|
151
|
+
var imageUrl = typeof image === "string" ? image : image.url;
|
|
145
152
|
var imageKey = image.id || image.url || index;
|
|
146
153
|
return /*#__PURE__*/_jsx(TouchableOpacity, {
|
|
147
154
|
onPress: function onPress() {
|
|
@@ -163,7 +170,7 @@ var ImagesGallery = function ImagesGallery(_ref) {
|
|
|
163
170
|
});
|
|
164
171
|
};
|
|
165
172
|
var data = isLoading ? [] : [{
|
|
166
|
-
type:
|
|
173
|
+
type: "upload"
|
|
167
174
|
}].concat(_toConsumableArray(images));
|
|
168
175
|
return /*#__PURE__*/_jsx(View, {
|
|
169
176
|
style: [styles.container, containerStyle],
|
|
@@ -171,7 +178,7 @@ var ImagesGallery = function ImagesGallery(_ref) {
|
|
|
171
178
|
data: data,
|
|
172
179
|
renderItem: renderItem,
|
|
173
180
|
keyExtractor: function keyExtractor(item, index) {
|
|
174
|
-
if (index === 0) return
|
|
181
|
+
if (index === 0) return "upload";
|
|
175
182
|
var image = images[index - 1];
|
|
176
183
|
return image.id || image.url || "image-".concat(index);
|
|
177
184
|
},
|
|
@@ -202,15 +209,16 @@ var styles = StyleSheet.create({
|
|
|
202
209
|
flex: 1
|
|
203
210
|
},
|
|
204
211
|
grid: {
|
|
205
|
-
padding:
|
|
212
|
+
padding: 2 // Reduced padding for better fit
|
|
206
213
|
},
|
|
207
214
|
uploadContainer: {
|
|
208
|
-
margin: ITEM_MARGIN
|
|
215
|
+
margin: ITEM_MARGIN,
|
|
216
|
+
overflow: "hidden"
|
|
209
217
|
},
|
|
210
218
|
imageItem: {
|
|
211
219
|
margin: ITEM_MARGIN,
|
|
212
220
|
borderRadius: 8,
|
|
213
|
-
overflow:
|
|
221
|
+
overflow: "hidden",
|
|
214
222
|
shadowOffset: {
|
|
215
223
|
width: 0,
|
|
216
224
|
height: 2
|
|
@@ -220,8 +228,8 @@ var styles = StyleSheet.create({
|
|
|
220
228
|
elevation: 5
|
|
221
229
|
},
|
|
222
230
|
image: {
|
|
223
|
-
width:
|
|
224
|
-
height:
|
|
231
|
+
width: "100%",
|
|
232
|
+
height: "100%"
|
|
225
233
|
},
|
|
226
234
|
paginationContainer: {
|
|
227
235
|
// Styles applied via theme
|
|
@@ -25,6 +25,7 @@ var MediaPopup = function MediaPopup(_ref) {
|
|
|
25
25
|
title = _ref$title === void 0 ? "Media Gallery" : _ref$title,
|
|
26
26
|
picker = _ref.picker,
|
|
27
27
|
pickerOptions = _ref.pickerOptions,
|
|
28
|
+
icons = _ref.icons,
|
|
28
29
|
theme = _ref.theme,
|
|
29
30
|
overlayStyle = _ref.overlayStyle,
|
|
30
31
|
containerStyle = _ref.containerStyle,
|
|
@@ -86,7 +87,9 @@ var MediaPopup = function MediaPopup(_ref) {
|
|
|
86
87
|
borderTopRightRadius: currentTheme.radius.xxl,
|
|
87
88
|
height: SCREEN_HEIGHT * sheetHeight,
|
|
88
89
|
maxHeight: SCREEN_HEIGHT * sheetHeight,
|
|
89
|
-
|
|
90
|
+
paddingTop: currentTheme.spacing.sm,
|
|
91
|
+
paddingBottom: currentTheme.spacing.xl,
|
|
92
|
+
paddingHorizontal: currentTheme.spacing.md // Reduced from xl to md for better fit
|
|
90
93
|
}, containerStyle, {
|
|
91
94
|
transform: [{
|
|
92
95
|
translateY: slideAnim
|
|
@@ -94,7 +97,7 @@ var MediaPopup = function MediaPopup(_ref) {
|
|
|
94
97
|
}],
|
|
95
98
|
children: [/*#__PURE__*/_jsxs(View, {
|
|
96
99
|
style: [styles.header, {
|
|
97
|
-
marginBottom: currentTheme.spacing.
|
|
100
|
+
marginBottom: currentTheme.spacing.sm
|
|
98
101
|
}, headerStyle],
|
|
99
102
|
children: [/*#__PURE__*/_jsx(Text, {
|
|
100
103
|
style: [styles.title, {
|
|
@@ -127,6 +130,7 @@ var MediaPopup = function MediaPopup(_ref) {
|
|
|
127
130
|
onError: onError,
|
|
128
131
|
picker: picker,
|
|
129
132
|
pickerOptions: pickerOptions,
|
|
133
|
+
icons: icons,
|
|
130
134
|
theme: currentTheme
|
|
131
135
|
})]
|
|
132
136
|
})
|
|
@@ -20,6 +20,7 @@ var MediaTab = function MediaTab(_ref) {
|
|
|
20
20
|
onError = _ref.onError,
|
|
21
21
|
picker = _ref.picker,
|
|
22
22
|
pickerOptions = _ref.pickerOptions,
|
|
23
|
+
icons = _ref.icons,
|
|
23
24
|
_ref$theme = _ref.theme,
|
|
24
25
|
theme = _ref$theme === void 0 ? defaultTheme : _ref$theme,
|
|
25
26
|
containerStyle = _ref.containerStyle,
|
|
@@ -66,6 +67,7 @@ var MediaTab = function MediaTab(_ref) {
|
|
|
66
67
|
onError: onError,
|
|
67
68
|
picker: picker,
|
|
68
69
|
pickerOptions: pickerOptions,
|
|
70
|
+
icons: icons,
|
|
69
71
|
theme: theme
|
|
70
72
|
});
|
|
71
73
|
}
|
|
@@ -79,6 +81,7 @@ var MediaTab = function MediaTab(_ref) {
|
|
|
79
81
|
onError: onError,
|
|
80
82
|
picker: picker,
|
|
81
83
|
pickerOptions: pickerOptions,
|
|
84
|
+
icons: icons,
|
|
82
85
|
theme: theme
|
|
83
86
|
});
|
|
84
87
|
}
|
|
@@ -93,6 +96,7 @@ var MediaTab = function MediaTab(_ref) {
|
|
|
93
96
|
onError: onError,
|
|
94
97
|
picker: picker,
|
|
95
98
|
pickerOptions: pickerOptions,
|
|
99
|
+
icons: icons,
|
|
96
100
|
theme: theme
|
|
97
101
|
});
|
|
98
102
|
}
|
|
@@ -105,11 +109,13 @@ var MediaTab = function MediaTab(_ref) {
|
|
|
105
109
|
backgroundColor: theme.colors.tabBackground,
|
|
106
110
|
borderBottomColor: theme.colors.border,
|
|
107
111
|
paddingHorizontal: theme.spacing.xs,
|
|
108
|
-
// Always left align
|
|
109
|
-
justifyContent: "flex-start"
|
|
112
|
+
// Always left align - no center alignment
|
|
113
|
+
justifyContent: "flex-start",
|
|
114
|
+
alignItems: "flex-start"
|
|
110
115
|
}, tabListStyle],
|
|
111
116
|
children: availableTabs.map(function (type, index) {
|
|
112
117
|
var isSelected = index === selectedIndex;
|
|
118
|
+
var isSingleTab = availableTabs.length === 1;
|
|
113
119
|
return /*#__PURE__*/_jsxs(TouchableOpacity, {
|
|
114
120
|
onPress: function onPress() {
|
|
115
121
|
return setSelectedIndex(index);
|
|
@@ -117,7 +123,10 @@ var MediaTab = function MediaTab(_ref) {
|
|
|
117
123
|
style: [styles.tabButton, {
|
|
118
124
|
paddingVertical: theme.spacing.md,
|
|
119
125
|
paddingHorizontal: theme.spacing.lg,
|
|
120
|
-
flex: 1
|
|
126
|
+
// For single tab, don't use flex: 1 to prevent centering
|
|
127
|
+
// Use auto width so it stays left-aligned
|
|
128
|
+
flex: isSingleTab ? 0 : 1,
|
|
129
|
+
alignSelf: "flex-start"
|
|
121
130
|
}, tabButtonStyle, isSelected ? [styles.tabButtonActive, tabButtonActiveStyle] : [styles.tabButtonInactive, tabButtonInactiveStyle]],
|
|
122
131
|
children: [/*#__PURE__*/_jsx(Text, {
|
|
123
132
|
style: [styles.tabButtonText, {
|
|
@@ -17,7 +17,7 @@ import { View, FlatList, TouchableOpacity, StyleSheet, Dimensions, Text } from '
|
|
|
17
17
|
import FileUpload from './FileUpload.native';
|
|
18
18
|
import ImagesSkeleton from './ImagesSkeleton.native';
|
|
19
19
|
import Pagination from './Pagination.native';
|
|
20
|
-
|
|
20
|
+
// Icons are now passed via props, no need to import here
|
|
21
21
|
import { defaultTheme } from './theme';
|
|
22
22
|
// Note: You'll need to install react-native-video for video playback
|
|
23
23
|
// import Video from 'react-native-video'
|
|
@@ -25,8 +25,15 @@ import { jsx as _jsx } from "react/jsx-runtime";
|
|
|
25
25
|
var _Dimensions$get = Dimensions.get('window'),
|
|
26
26
|
SCREEN_WIDTH = _Dimensions$get.width;
|
|
27
27
|
var NUM_COLUMNS = 3;
|
|
28
|
-
var ITEM_MARGIN =
|
|
29
|
-
|
|
28
|
+
var ITEM_MARGIN = 4; // Reduced margin for better fit
|
|
29
|
+
// Calculate item size accounting for:
|
|
30
|
+
// - Container padding (md = 12px on each side = 24px total)
|
|
31
|
+
// - Grid padding (2px on each side = 4px total)
|
|
32
|
+
// - Item margins between items (4px * 2 gaps = 8px total)
|
|
33
|
+
var CONTAINER_PADDING = 24; // paddingHorizontal md (12 * 2)
|
|
34
|
+
var GRID_PADDING = 4; // padding 2 on each side (2 * 2)
|
|
35
|
+
var TOTAL_MARGINS = ITEM_MARGIN * (NUM_COLUMNS - 1) * 2; // margins between items (4px * 2 gaps = 8px)
|
|
36
|
+
var ITEM_SIZE = (SCREEN_WIDTH - CONTAINER_PADDING - GRID_PADDING - TOTAL_MARGINS) / NUM_COLUMNS;
|
|
30
37
|
var VIDEO_MIME_TYPES = ['video/mp4', 'video/quicktime', 'video/x-ms-wmv', 'video/h265', 'video/hevc', 'video/webm'];
|
|
31
38
|
var VideosGallery = function VideosGallery(_ref) {
|
|
32
39
|
var update_data = _ref.update_data,
|
|
@@ -35,6 +42,7 @@ var VideosGallery = function VideosGallery(_ref) {
|
|
|
35
42
|
onError = _ref.onError,
|
|
36
43
|
picker = _ref.picker,
|
|
37
44
|
pickerOptions = _ref.pickerOptions,
|
|
45
|
+
icons = _ref.icons,
|
|
38
46
|
_ref$theme = _ref.theme,
|
|
39
47
|
theme = _ref$theme === void 0 ? defaultTheme : _ref$theme,
|
|
40
48
|
containerStyle = _ref.containerStyle,
|
|
@@ -136,8 +144,8 @@ var VideosGallery = function VideosGallery(_ref) {
|
|
|
136
144
|
onUploadError: onError,
|
|
137
145
|
picker: picker,
|
|
138
146
|
pickerOptions: pickerOptions,
|
|
139
|
-
|
|
140
|
-
|
|
147
|
+
icons: icons,
|
|
148
|
+
theme: theme
|
|
141
149
|
})
|
|
142
150
|
});
|
|
143
151
|
}
|
|
@@ -201,7 +209,7 @@ var styles = StyleSheet.create({
|
|
|
201
209
|
flex: 1
|
|
202
210
|
},
|
|
203
211
|
grid: {
|
|
204
|
-
padding:
|
|
212
|
+
padding: 2 // Reduced padding for better fit
|
|
205
213
|
},
|
|
206
214
|
uploadContainer: {
|
|
207
215
|
margin: ITEM_MARGIN
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
4
3
|
Object.defineProperty(exports, "__esModule", {
|
|
5
4
|
value: true
|
|
6
5
|
});
|
|
@@ -15,6 +14,7 @@ function _regenerator() { /*! regenerator-runtime -- Copyright (c) 2014-present,
|
|
|
15
14
|
function _regeneratorDefine2(e, r, n, t) { var i = Object.defineProperty; try { i({}, "", {}); } catch (e) { i = 0; } _regeneratorDefine2 = function _regeneratorDefine(e, r, n, t) { function o(r, n) { _regeneratorDefine2(e, r, function (e) { return this._invoke(r, n, e); }); } r ? i ? i(e, r, { value: n, enumerable: !t, configurable: !t, writable: !t }) : e[r] = n : (o("next", 0), o("throw", 1), o("return", 2)); }, _regeneratorDefine2(e, r, n, t); }
|
|
16
15
|
function asyncGeneratorStep(n, t, e, r, o, a, c) { try { var i = n[a](c), u = i.value; } catch (n) { return void e(n); } i.done ? t(u) : Promise.resolve(u).then(r, o); }
|
|
17
16
|
function _asyncToGenerator(n) { return function () { var t = this, e = arguments; return new Promise(function (r, o) { var a = n.apply(t, e); function _next(n) { asyncGeneratorStep(a, r, o, _next, _throw, "next", n); } function _throw(n) { asyncGeneratorStep(a, r, o, _next, _throw, "throw", n); } _next(void 0); }); }; }
|
|
17
|
+
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
18
18
|
function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
|
|
19
19
|
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
20
20
|
function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
|
|
@@ -86,6 +86,7 @@ var FileUpload = function FileUpload(_ref) {
|
|
|
86
86
|
picker = _ref.picker,
|
|
87
87
|
pickerOptions = _ref.pickerOptions,
|
|
88
88
|
icon = _ref.icon,
|
|
89
|
+
icons = _ref.icons,
|
|
89
90
|
_ref$theme = _ref.theme,
|
|
90
91
|
theme = _ref$theme === void 0 ? _theme.defaultTheme : _ref$theme,
|
|
91
92
|
containerStyle = _ref.containerStyle,
|
|
@@ -102,6 +103,26 @@ var FileUpload = function FileUpload(_ref) {
|
|
|
102
103
|
uploadProgress = _useState4[0],
|
|
103
104
|
setUploadProgress = _useState4[1];
|
|
104
105
|
|
|
106
|
+
// Determine which icon to use based on accept type and icons prop
|
|
107
|
+
var getIcon = function getIcon() {
|
|
108
|
+
// If icons object is provided, use it to select based on accept type
|
|
109
|
+
if (icons && _typeof(icons) === "object") {
|
|
110
|
+
var isImage = accept === null || accept === void 0 ? void 0 : accept.includes("image");
|
|
111
|
+
var isVideo = accept === null || accept === void 0 ? void 0 : accept.includes("video");
|
|
112
|
+
if (isImage && icons.image) {
|
|
113
|
+
return icons.image;
|
|
114
|
+
} else if (isVideo && icons.video) {
|
|
115
|
+
return icons.video;
|
|
116
|
+
} else if (icons.default) {
|
|
117
|
+
return icons.default;
|
|
118
|
+
}
|
|
119
|
+
}
|
|
120
|
+
|
|
121
|
+
// Fallback to single icon prop (backward compatibility)
|
|
122
|
+
return icon;
|
|
123
|
+
};
|
|
124
|
+
var selectedIcon = getIcon();
|
|
125
|
+
|
|
105
126
|
// Convert file picker result to File-like object for apiService
|
|
106
127
|
var convertToFile = function convertToFile(pickerResult) {
|
|
107
128
|
// Handle different picker formats:
|
|
@@ -122,22 +143,39 @@ var FileUpload = function FileUpload(_ref) {
|
|
|
122
143
|
fileName = lastPart ? lastPart.split("?")[0] : null; // Remove query params if any
|
|
123
144
|
}
|
|
124
145
|
|
|
125
|
-
// Final fallback
|
|
146
|
+
// Final fallback - generate a meaningful filename
|
|
126
147
|
if (!fileName) {
|
|
127
148
|
// Try to guess from mimeType
|
|
128
149
|
var _mimeType = pickerResult.mimeType || pickerResult.type || "";
|
|
150
|
+
var timestamp = Date.now();
|
|
129
151
|
if (_mimeType.includes("image")) {
|
|
130
|
-
fileName = _mimeType.includes("jpeg") || _mimeType.includes("jpg") ? "
|
|
152
|
+
fileName = _mimeType.includes("jpeg") || _mimeType.includes("jpg") ? "image_".concat(timestamp, ".jpg") : _mimeType.includes("png") ? "image_".concat(timestamp, ".png") : _mimeType.includes("gif") ? "image_".concat(timestamp, ".gif") : _mimeType.includes("webp") ? "image_".concat(timestamp, ".webp") : "image_".concat(timestamp, ".jpg");
|
|
131
153
|
} else if (_mimeType.includes("video")) {
|
|
132
|
-
fileName = "
|
|
154
|
+
fileName = _mimeType.includes("mp4") ? "video_".concat(timestamp, ".mp4") : _mimeType.includes("mov") ? "video_".concat(timestamp, ".mov") : "video_".concat(timestamp, ".mp4");
|
|
133
155
|
} else {
|
|
134
|
-
fileName = "
|
|
156
|
+
fileName = "file_".concat(timestamp);
|
|
135
157
|
}
|
|
136
158
|
}
|
|
137
159
|
|
|
138
160
|
// Extract MIME type (handle different property names)
|
|
139
|
-
|
|
140
|
-
|
|
161
|
+
// Use a helper function to determine MIME type from filename if needed
|
|
162
|
+
var getMimeType = function getMimeType(name, fallbackType) {
|
|
163
|
+
var _name$split$pop;
|
|
164
|
+
if (fallbackType) return fallbackType;
|
|
165
|
+
var ext = (_name$split$pop = name.split(".").pop()) === null || _name$split$pop === void 0 ? void 0 : _name$split$pop.toLowerCase();
|
|
166
|
+
var mimeMap = {
|
|
167
|
+
jpg: "image/jpeg",
|
|
168
|
+
jpeg: "image/jpeg",
|
|
169
|
+
png: "image/png",
|
|
170
|
+
gif: "image/gif",
|
|
171
|
+
webp: "image/webp",
|
|
172
|
+
mp4: "video/mp4",
|
|
173
|
+
mov: "video/quicktime",
|
|
174
|
+
mp3: "audio/mpeg"
|
|
175
|
+
};
|
|
176
|
+
return mimeMap[ext] || "image/jpeg";
|
|
177
|
+
};
|
|
178
|
+
var mimeType = pickerResult.mimeType || pickerResult.type || getMimeType(fileName, null);
|
|
141
179
|
return {
|
|
142
180
|
uri: uri,
|
|
143
181
|
name: fileName,
|
|
@@ -294,20 +332,20 @@ var FileUpload = function FileUpload(_ref) {
|
|
|
294
332
|
borderRadius: theme.radius.md
|
|
295
333
|
}, buttonStyle],
|
|
296
334
|
disabled: isLoading,
|
|
297
|
-
children: [
|
|
335
|
+
children: [selectedIcon && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
|
|
298
336
|
style: [styles.iconContainer, {
|
|
299
337
|
backgroundColor: theme.colors.uploadIconBackground,
|
|
300
338
|
borderRadius: theme.radius.xl,
|
|
301
339
|
marginBottom: theme.spacing.sm,
|
|
302
340
|
padding: theme.spacing.md
|
|
303
341
|
}, iconContainerStyle],
|
|
304
|
-
children:
|
|
342
|
+
children: selectedIcon
|
|
305
343
|
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
|
|
306
344
|
style: [styles.title, {
|
|
307
345
|
color: theme.colors.uploadText,
|
|
308
346
|
fontSize: theme.typography.body.fontSize,
|
|
309
347
|
fontWeight: theme.typography.body.fontWeight,
|
|
310
|
-
marginTop:
|
|
348
|
+
marginTop: selectedIcon ? theme.spacing.sm : 0
|
|
311
349
|
}, titleStyle],
|
|
312
350
|
children: title
|
|
313
351
|
})]
|
|
@@ -317,7 +355,7 @@ var FileUpload = function FileUpload(_ref) {
|
|
|
317
355
|
var styles = _reactNative.StyleSheet.create({
|
|
318
356
|
container: {
|
|
319
357
|
width: "100%",
|
|
320
|
-
height:
|
|
358
|
+
height: "100%"
|
|
321
359
|
},
|
|
322
360
|
button: {
|
|
323
361
|
width: "100%",
|
|
@@ -333,11 +371,12 @@ var styles = _reactNative.StyleSheet.create({
|
|
|
333
371
|
// Colors and spacing applied via theme
|
|
334
372
|
},
|
|
335
373
|
title: {
|
|
374
|
+
textAlign: "center"
|
|
336
375
|
// Colors and typography applied via theme
|
|
337
376
|
},
|
|
338
377
|
loadingContainer: {
|
|
339
378
|
width: "100%",
|
|
340
|
-
height:
|
|
379
|
+
height: "100%",
|
|
341
380
|
justifyContent: "center",
|
|
342
381
|
alignItems: "center"
|
|
343
382
|
// Colors applied via theme
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.CloseIcon = exports.CameraIcon = void 0;
|
|
6
|
+
exports.VideoIcon = exports.UploadIcon = exports.CloseIcon = exports.CameraIcon = void 0;
|
|
7
7
|
var _react = _interopRequireDefault(require("react"));
|
|
8
8
|
var _reactNative = require("react-native");
|
|
9
9
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
@@ -15,7 +15,7 @@ var CloseIcon = exports.CloseIcon = function CloseIcon(_ref) {
|
|
|
15
15
|
var _ref$size = _ref.size,
|
|
16
16
|
size = _ref$size === void 0 ? 32 : _ref$size,
|
|
17
17
|
_ref$color = _ref.color,
|
|
18
|
-
color = _ref$color === void 0 ?
|
|
18
|
+
color = _ref$color === void 0 ? "#000000" : _ref$color;
|
|
19
19
|
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
|
|
20
20
|
style: [styles.closeIcon, {
|
|
21
21
|
width: size,
|
|
@@ -39,21 +39,57 @@ var CameraIcon = exports.CameraIcon = function CameraIcon() {
|
|
|
39
39
|
})
|
|
40
40
|
});
|
|
41
41
|
};
|
|
42
|
+
var VideoIcon = exports.VideoIcon = function VideoIcon() {
|
|
43
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
|
|
44
|
+
style: styles.videoIcon,
|
|
45
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
|
|
46
|
+
style: styles.videoIconText,
|
|
47
|
+
children: "\uD83C\uDFA5"
|
|
48
|
+
})
|
|
49
|
+
});
|
|
50
|
+
};
|
|
51
|
+
var UploadIcon = exports.UploadIcon = function UploadIcon() {
|
|
52
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
|
|
53
|
+
style: styles.uploadIcon,
|
|
54
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
|
|
55
|
+
style: styles.uploadIconText,
|
|
56
|
+
children: "\uD83D\uDCE4"
|
|
57
|
+
})
|
|
58
|
+
});
|
|
59
|
+
};
|
|
42
60
|
var styles = _reactNative.StyleSheet.create({
|
|
43
61
|
closeIcon: {
|
|
44
|
-
justifyContent:
|
|
45
|
-
alignItems:
|
|
62
|
+
justifyContent: "center",
|
|
63
|
+
alignItems: "center"
|
|
46
64
|
},
|
|
47
65
|
closeIconText: {
|
|
48
|
-
fontWeight:
|
|
66
|
+
fontWeight: "bold"
|
|
49
67
|
},
|
|
50
68
|
cameraIcon: {
|
|
51
69
|
width: 22,
|
|
52
70
|
height: 18,
|
|
53
|
-
justifyContent:
|
|
54
|
-
alignItems:
|
|
71
|
+
justifyContent: "center",
|
|
72
|
+
alignItems: "center"
|
|
55
73
|
},
|
|
56
74
|
cameraIconText: {
|
|
57
75
|
fontSize: 18
|
|
76
|
+
},
|
|
77
|
+
videoIcon: {
|
|
78
|
+
width: 22,
|
|
79
|
+
height: 18,
|
|
80
|
+
justifyContent: "center",
|
|
81
|
+
alignItems: "center"
|
|
82
|
+
},
|
|
83
|
+
videoIconText: {
|
|
84
|
+
fontSize: 18
|
|
85
|
+
},
|
|
86
|
+
uploadIcon: {
|
|
87
|
+
width: 22,
|
|
88
|
+
height: 18,
|
|
89
|
+
justifyContent: "center",
|
|
90
|
+
alignItems: "center"
|
|
91
|
+
},
|
|
92
|
+
uploadIconText: {
|
|
93
|
+
fontSize: 18
|
|
58
94
|
}
|
|
59
95
|
});
|