@tradly/asset 1.0.12 → 1.0.14
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/README.md +257 -13
- package/dist/components/FileUpload.js +8 -247
- package/dist/components/FileUpload.native.js +13 -0
- package/dist/components/Icons.js +10 -33
- package/dist/components/Icons.native.js +16 -0
- package/dist/components/ImagesSkeleton.js +7 -15
- package/dist/components/ImagesSkeleton.native.js +13 -0
- package/dist/components/MediaGallery.js +8 -148
- package/dist/components/MediaGallery.native.js +13 -0
- package/dist/components/MediaPopup.js +8 -99
- package/dist/components/MediaPopup.native.js +13 -0
- package/dist/components/MediaTab.js +7 -180
- package/dist/components/MediaTab.native.js +13 -0
- package/dist/components/Pagination.js +8 -136
- package/dist/components/Pagination.native.js +13 -0
- package/dist/components/VideosGallery.js +8 -148
- package/dist/components/VideosGallery.native.js +13 -0
- package/dist/core/MediaApiService.js +396 -0
- package/dist/esm/components/FileUpload.js +1 -246
- package/dist/esm/components/FileUpload.native.js +1 -0
- package/dist/esm/components/Icons.js +1 -32
- package/dist/esm/components/Icons.native.js +1 -0
- package/dist/esm/components/ImagesSkeleton.js +1 -14
- package/dist/esm/components/ImagesSkeleton.native.js +1 -0
- package/dist/esm/components/MediaGallery.js +1 -144
- package/dist/esm/components/MediaGallery.native.js +1 -0
- package/dist/esm/components/MediaPopup.js +1 -97
- package/dist/esm/components/MediaPopup.native.js +1 -0
- package/dist/esm/components/MediaTab.js +1 -177
- package/dist/esm/components/MediaTab.native.js +1 -0
- package/dist/esm/components/Pagination.js +1 -134
- package/dist/esm/components/Pagination.native.js +1 -0
- package/dist/esm/components/VideosGallery.js +1 -144
- package/dist/esm/components/VideosGallery.native.js +1 -0
- package/dist/esm/core/MediaApiService.js +390 -0
- package/dist/esm/index.js +1 -1
- package/dist/esm/native/FileUpload.native.js +298 -0
- package/dist/esm/native/Icons.native.js +51 -0
- package/dist/esm/native/ImagesSkeleton.native.js +45 -0
- package/dist/esm/native/MediaGallery.native.js +221 -0
- package/dist/esm/native/MediaPopup.native.js +151 -0
- package/dist/esm/native/MediaTab.native.js +175 -0
- package/dist/esm/native/Pagination.native.js +186 -0
- package/dist/esm/native/VideosGallery.native.js +233 -0
- package/dist/esm/services/apiService.js +1 -372
- package/dist/esm/web/FileUpload.web.js +253 -0
- package/dist/esm/web/Icons.web.js +32 -0
- package/dist/esm/web/ImagesSkeleton.web.js +14 -0
- package/dist/esm/web/MediaGallery.web.js +144 -0
- package/dist/esm/web/MediaPopup.web.js +97 -0
- package/dist/esm/web/MediaTab.web.js +177 -0
- package/dist/esm/web/Pagination.web.js +134 -0
- package/dist/esm/web/VideosGallery.web.js +144 -0
- package/dist/index.js +2 -2
- package/dist/native/FileUpload.native.js +304 -0
- package/dist/native/Icons.native.js +59 -0
- package/dist/native/ImagesSkeleton.native.js +52 -0
- package/dist/native/MediaGallery.native.js +230 -0
- package/dist/native/MediaPopup.native.js +158 -0
- package/dist/native/MediaTab.native.js +184 -0
- package/dist/native/Pagination.native.js +193 -0
- package/dist/native/VideosGallery.native.js +241 -0
- package/dist/services/apiService.js +2 -372
- package/dist/web/FileUpload.web.js +259 -0
- package/dist/web/Icons.web.js +39 -0
- package/dist/web/ImagesSkeleton.web.js +21 -0
- package/dist/web/MediaGallery.web.js +153 -0
- package/dist/web/MediaPopup.web.js +104 -0
- package/dist/web/MediaTab.web.js +186 -0
- package/dist/web/Pagination.web.js +141 -0
- package/dist/web/VideosGallery.web.js +153 -0
- package/package.json +4 -3
|
@@ -0,0 +1,158 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var _react = _interopRequireDefault(require("react"));
|
|
8
|
+
var _reactNative = require("react-native");
|
|
9
|
+
var _MediaTab = _interopRequireDefault(require("./MediaTab.native"));
|
|
10
|
+
var _Icons = require("./Icons.native");
|
|
11
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
12
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
13
|
+
function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
|
|
14
|
+
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."); }
|
|
15
|
+
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; } }
|
|
16
|
+
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; }
|
|
17
|
+
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; } }
|
|
18
|
+
function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
|
|
19
|
+
var _Dimensions$get = _reactNative.Dimensions.get('window'),
|
|
20
|
+
SCREEN_HEIGHT = _Dimensions$get.height;
|
|
21
|
+
var MediaPopup = function MediaPopup(_ref) {
|
|
22
|
+
var isOpen = _ref.isOpen,
|
|
23
|
+
onClose = _ref.onClose,
|
|
24
|
+
onSelect = _ref.onSelect,
|
|
25
|
+
currentData = _ref.currentData,
|
|
26
|
+
_ref$options = _ref.options,
|
|
27
|
+
options = _ref$options === void 0 ? ['image'] : _ref$options,
|
|
28
|
+
apiService = _ref.apiService,
|
|
29
|
+
onError = _ref.onError,
|
|
30
|
+
_ref$title = _ref.title,
|
|
31
|
+
title = _ref$title === void 0 ? 'Media Gallery' : _ref$title,
|
|
32
|
+
picker = _ref.picker,
|
|
33
|
+
pickerOptions = _ref.pickerOptions,
|
|
34
|
+
containerStyle = _ref.containerStyle,
|
|
35
|
+
headerStyle = _ref.headerStyle,
|
|
36
|
+
titleStyle = _ref.titleStyle,
|
|
37
|
+
closeButtonStyle = _ref.closeButtonStyle;
|
|
38
|
+
var _React$useState = _react.default.useState(new _reactNative.Animated.Value(SCREEN_HEIGHT)),
|
|
39
|
+
_React$useState2 = _slicedToArray(_React$useState, 1),
|
|
40
|
+
slideAnim = _React$useState2[0];
|
|
41
|
+
_react.default.useEffect(function () {
|
|
42
|
+
if (isOpen) {
|
|
43
|
+
_reactNative.Animated.spring(slideAnim, {
|
|
44
|
+
toValue: 0,
|
|
45
|
+
useNativeDriver: true,
|
|
46
|
+
tension: 65,
|
|
47
|
+
friction: 11
|
|
48
|
+
}).start();
|
|
49
|
+
} else {
|
|
50
|
+
_reactNative.Animated.timing(slideAnim, {
|
|
51
|
+
toValue: SCREEN_HEIGHT,
|
|
52
|
+
duration: 250,
|
|
53
|
+
useNativeDriver: true
|
|
54
|
+
}).start();
|
|
55
|
+
}
|
|
56
|
+
}, [isOpen]);
|
|
57
|
+
var handleUpdate = function handleUpdate(data) {
|
|
58
|
+
if (onSelect) {
|
|
59
|
+
onSelect(data);
|
|
60
|
+
}
|
|
61
|
+
};
|
|
62
|
+
var handleClose = function handleClose() {
|
|
63
|
+
if (onClose) {
|
|
64
|
+
onClose();
|
|
65
|
+
}
|
|
66
|
+
};
|
|
67
|
+
if (!isOpen) return null;
|
|
68
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Modal, {
|
|
69
|
+
visible: isOpen,
|
|
70
|
+
transparent: true,
|
|
71
|
+
animationType: "none",
|
|
72
|
+
onRequestClose: handleClose,
|
|
73
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.TouchableWithoutFeedback, {
|
|
74
|
+
onPress: handleClose,
|
|
75
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
|
|
76
|
+
style: styles.overlay,
|
|
77
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.TouchableWithoutFeedback, {
|
|
78
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.Animated.View, {
|
|
79
|
+
style: [styles.container, containerStyle, {
|
|
80
|
+
transform: [{
|
|
81
|
+
translateY: slideAnim
|
|
82
|
+
}]
|
|
83
|
+
}],
|
|
84
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
|
|
85
|
+
style: [styles.header, headerStyle],
|
|
86
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
|
|
87
|
+
style: [styles.title, titleStyle],
|
|
88
|
+
children: title
|
|
89
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.TouchableOpacity, {
|
|
90
|
+
onPress: handleClose,
|
|
91
|
+
style: [styles.closeButton, closeButtonStyle],
|
|
92
|
+
hitSlop: {
|
|
93
|
+
top: 10,
|
|
94
|
+
bottom: 10,
|
|
95
|
+
left: 10,
|
|
96
|
+
right: 10
|
|
97
|
+
},
|
|
98
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icons.CloseIcon, {})
|
|
99
|
+
})]
|
|
100
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_MediaTab.default, {
|
|
101
|
+
imagePopup: isOpen,
|
|
102
|
+
update_data: handleUpdate,
|
|
103
|
+
current_data: currentData,
|
|
104
|
+
closePopup: handleClose,
|
|
105
|
+
options: options,
|
|
106
|
+
apiService: apiService,
|
|
107
|
+
onError: onError,
|
|
108
|
+
picker: picker,
|
|
109
|
+
pickerOptions: pickerOptions
|
|
110
|
+
})]
|
|
111
|
+
})
|
|
112
|
+
})
|
|
113
|
+
})
|
|
114
|
+
})
|
|
115
|
+
});
|
|
116
|
+
};
|
|
117
|
+
var styles = _reactNative.StyleSheet.create({
|
|
118
|
+
overlay: {
|
|
119
|
+
flex: 1,
|
|
120
|
+
backgroundColor: 'rgba(0, 0, 0, 0.5)',
|
|
121
|
+
justifyContent: 'flex-end'
|
|
122
|
+
},
|
|
123
|
+
container: {
|
|
124
|
+
backgroundColor: '#FFFFFF',
|
|
125
|
+
borderTopLeftRadius: 20,
|
|
126
|
+
borderTopRightRadius: 20,
|
|
127
|
+
maxHeight: SCREEN_HEIGHT * 0.85,
|
|
128
|
+
minHeight: 200,
|
|
129
|
+
padding: 20,
|
|
130
|
+
shadowColor: '#000',
|
|
131
|
+
shadowOffset: {
|
|
132
|
+
width: 0,
|
|
133
|
+
height: -2
|
|
134
|
+
},
|
|
135
|
+
shadowOpacity: 0.25,
|
|
136
|
+
shadowRadius: 3.84,
|
|
137
|
+
elevation: 5
|
|
138
|
+
},
|
|
139
|
+
header: {
|
|
140
|
+
flexDirection: 'row',
|
|
141
|
+
alignItems: 'center',
|
|
142
|
+
justifyContent: 'space-between',
|
|
143
|
+
marginBottom: 16,
|
|
144
|
+
paddingBottom: 12,
|
|
145
|
+
borderBottomWidth: 1,
|
|
146
|
+
borderBottomColor: '#E5E5E5'
|
|
147
|
+
},
|
|
148
|
+
title: {
|
|
149
|
+
fontSize: 24,
|
|
150
|
+
fontWeight: 'bold',
|
|
151
|
+
color: '#000000'
|
|
152
|
+
},
|
|
153
|
+
closeButton: {
|
|
154
|
+
padding: 8,
|
|
155
|
+
borderRadius: 20
|
|
156
|
+
}
|
|
157
|
+
});
|
|
158
|
+
var _default = exports.default = MediaPopup;
|
|
@@ -0,0 +1,184 @@
|
|
|
1
|
+
"use strict";
|
|
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
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports.default = void 0;
|
|
8
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
9
|
+
var _reactNative = require("react-native");
|
|
10
|
+
var _MediaGallery = _interopRequireDefault(require("./MediaGallery.native"));
|
|
11
|
+
var _VideosGallery = _interopRequireDefault(require("./VideosGallery.native"));
|
|
12
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
13
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
14
|
+
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
|
|
15
|
+
function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
|
|
16
|
+
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."); }
|
|
17
|
+
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; } }
|
|
18
|
+
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; }
|
|
19
|
+
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; } }
|
|
20
|
+
function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
|
|
21
|
+
var MediaTab = function MediaTab(_ref) {
|
|
22
|
+
var imagePopup = _ref.imagePopup,
|
|
23
|
+
current_data = _ref.current_data,
|
|
24
|
+
update_data = _ref.update_data,
|
|
25
|
+
closePopup = _ref.closePopup,
|
|
26
|
+
options = _ref.options,
|
|
27
|
+
apiService = _ref.apiService,
|
|
28
|
+
onError = _ref.onError,
|
|
29
|
+
picker = _ref.picker,
|
|
30
|
+
pickerOptions = _ref.pickerOptions,
|
|
31
|
+
containerStyle = _ref.containerStyle,
|
|
32
|
+
tabListStyle = _ref.tabListStyle,
|
|
33
|
+
tabButtonStyle = _ref.tabButtonStyle,
|
|
34
|
+
tabButtonActiveStyle = _ref.tabButtonActiveStyle,
|
|
35
|
+
tabButtonInactiveStyle = _ref.tabButtonInactiveStyle,
|
|
36
|
+
tabPanelStyle = _ref.tabPanelStyle;
|
|
37
|
+
// Build a stable list of enabled tabs in order
|
|
38
|
+
var availableTabs = (0, _react.useMemo)(function () {
|
|
39
|
+
var tabs = [];
|
|
40
|
+
if (options !== null && options !== void 0 && options.includes('image')) tabs.push('image');
|
|
41
|
+
if (options !== null && options !== void 0 && options.includes('video')) tabs.push('video');
|
|
42
|
+
if (options !== null && options !== void 0 && options.includes('file')) tabs.push('file');
|
|
43
|
+
return tabs;
|
|
44
|
+
}, [options]);
|
|
45
|
+
var _useState = (0, _react.useState)(0),
|
|
46
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
47
|
+
selectedIndex = _useState2[0],
|
|
48
|
+
setSelectedIndex = _useState2[1];
|
|
49
|
+
|
|
50
|
+
// Guard: if no options passed, render nothing
|
|
51
|
+
if (!availableTabs.length) {
|
|
52
|
+
return null;
|
|
53
|
+
}
|
|
54
|
+
var renderTabLabel = function renderTabLabel(type) {
|
|
55
|
+
if (type === 'image') return 'Images';
|
|
56
|
+
if (type === 'video') return 'Videos';
|
|
57
|
+
if (type === 'file') return 'Files';
|
|
58
|
+
return type;
|
|
59
|
+
};
|
|
60
|
+
var renderPanel = function renderPanel(type) {
|
|
61
|
+
if (type === 'image') {
|
|
62
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_MediaGallery.default, {
|
|
63
|
+
imagePopup: imagePopup,
|
|
64
|
+
update_data: update_data,
|
|
65
|
+
current_data: current_data,
|
|
66
|
+
closePopup: closePopup,
|
|
67
|
+
apiService: apiService,
|
|
68
|
+
onError: onError,
|
|
69
|
+
picker: picker,
|
|
70
|
+
pickerOptions: pickerOptions
|
|
71
|
+
});
|
|
72
|
+
}
|
|
73
|
+
if (type === 'video') {
|
|
74
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_VideosGallery.default, {
|
|
75
|
+
imagePopup: imagePopup,
|
|
76
|
+
update_data: update_data,
|
|
77
|
+
current_data: current_data,
|
|
78
|
+
closePopup: closePopup,
|
|
79
|
+
apiService: apiService,
|
|
80
|
+
onError: onError,
|
|
81
|
+
picker: picker,
|
|
82
|
+
pickerOptions: pickerOptions
|
|
83
|
+
});
|
|
84
|
+
}
|
|
85
|
+
if (type === 'file') {
|
|
86
|
+
// Reuse ImagesGallery for files as in original implementation
|
|
87
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_MediaGallery.default, {
|
|
88
|
+
imagePopup: imagePopup,
|
|
89
|
+
update_data: update_data,
|
|
90
|
+
current_data: current_data,
|
|
91
|
+
closePopup: closePopup,
|
|
92
|
+
apiService: apiService,
|
|
93
|
+
onError: onError,
|
|
94
|
+
picker: picker,
|
|
95
|
+
pickerOptions: pickerOptions
|
|
96
|
+
});
|
|
97
|
+
}
|
|
98
|
+
return null;
|
|
99
|
+
};
|
|
100
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
|
|
101
|
+
style: [styles.container, containerStyle],
|
|
102
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
|
|
103
|
+
style: [styles.tabList, tabListStyle],
|
|
104
|
+
children: availableTabs.map(function (type, index) {
|
|
105
|
+
var isSelected = index === selectedIndex;
|
|
106
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.TouchableOpacity, {
|
|
107
|
+
onPress: function onPress() {
|
|
108
|
+
return setSelectedIndex(index);
|
|
109
|
+
},
|
|
110
|
+
style: [styles.tabButton, tabButtonStyle, isSelected ? [styles.tabButtonActive, tabButtonActiveStyle] : [styles.tabButtonInactive, tabButtonInactiveStyle]],
|
|
111
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
|
|
112
|
+
style: [styles.tabButtonText, isSelected ? styles.tabButtonTextActive : styles.tabButtonTextInactive],
|
|
113
|
+
children: renderTabLabel(type)
|
|
114
|
+
}), isSelected && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
|
|
115
|
+
style: styles.tabIndicator
|
|
116
|
+
})]
|
|
117
|
+
}, type);
|
|
118
|
+
})
|
|
119
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
|
|
120
|
+
style: [styles.tabPanel, tabPanelStyle],
|
|
121
|
+
children: availableTabs.map(function (type, index) {
|
|
122
|
+
var isSelected = index === selectedIndex;
|
|
123
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
|
|
124
|
+
style: isSelected ? styles.panelVisible : styles.panelHidden,
|
|
125
|
+
children: isSelected && renderPanel(type)
|
|
126
|
+
}, type);
|
|
127
|
+
})
|
|
128
|
+
})]
|
|
129
|
+
});
|
|
130
|
+
};
|
|
131
|
+
var styles = _reactNative.StyleSheet.create({
|
|
132
|
+
container: {
|
|
133
|
+
flex: 1
|
|
134
|
+
},
|
|
135
|
+
tabList: {
|
|
136
|
+
flexDirection: 'row',
|
|
137
|
+
borderBottomWidth: 2,
|
|
138
|
+
borderBottomColor: '#E5E5E5',
|
|
139
|
+
backgroundColor: '#FFFFFF',
|
|
140
|
+
paddingHorizontal: 4
|
|
141
|
+
},
|
|
142
|
+
tabButton: {
|
|
143
|
+
flex: 1,
|
|
144
|
+
paddingVertical: 12,
|
|
145
|
+
paddingHorizontal: 16,
|
|
146
|
+
alignItems: 'center',
|
|
147
|
+
justifyContent: 'center',
|
|
148
|
+
position: 'relative'
|
|
149
|
+
},
|
|
150
|
+
tabButtonActive: {
|
|
151
|
+
// Active state styling
|
|
152
|
+
},
|
|
153
|
+
tabButtonInactive: {
|
|
154
|
+
// Inactive state styling
|
|
155
|
+
},
|
|
156
|
+
tabButtonText: {
|
|
157
|
+
fontSize: 16,
|
|
158
|
+
fontWeight: '500'
|
|
159
|
+
},
|
|
160
|
+
tabButtonTextActive: {
|
|
161
|
+
color: '#3B3269' // primary color
|
|
162
|
+
},
|
|
163
|
+
tabButtonTextInactive: {
|
|
164
|
+
color: '#4F4F4F'
|
|
165
|
+
},
|
|
166
|
+
tabIndicator: {
|
|
167
|
+
position: 'absolute',
|
|
168
|
+
bottom: -2,
|
|
169
|
+
left: 0,
|
|
170
|
+
right: 0,
|
|
171
|
+
height: 2,
|
|
172
|
+
backgroundColor: '#3B3269' // primary color
|
|
173
|
+
},
|
|
174
|
+
tabPanel: {
|
|
175
|
+
flex: 1
|
|
176
|
+
},
|
|
177
|
+
panelVisible: {
|
|
178
|
+
flex: 1
|
|
179
|
+
},
|
|
180
|
+
panelHidden: {
|
|
181
|
+
display: 'none'
|
|
182
|
+
}
|
|
183
|
+
});
|
|
184
|
+
var _default = exports.default = MediaTab;
|
|
@@ -0,0 +1,193 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var _react = _interopRequireDefault(require("react"));
|
|
8
|
+
var _reactNative = require("react-native");
|
|
9
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
10
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
11
|
+
var Pagination = function Pagination(_ref) {
|
|
12
|
+
var nextPage = _ref.nextPage,
|
|
13
|
+
current_page = _ref.current_page,
|
|
14
|
+
pageCount = _ref.pageCount,
|
|
15
|
+
containerStyle = _ref.containerStyle,
|
|
16
|
+
navStyle = _ref.navStyle,
|
|
17
|
+
previousButtonStyle = _ref.previousButtonStyle,
|
|
18
|
+
nextButtonStyle = _ref.nextButtonStyle,
|
|
19
|
+
pageButtonStyle = _ref.pageButtonStyle,
|
|
20
|
+
pageButtonActiveStyle = _ref.pageButtonActiveStyle,
|
|
21
|
+
ellipsisStyle = _ref.ellipsisStyle;
|
|
22
|
+
var totalPages = Math.ceil(pageCount) || 1;
|
|
23
|
+
var currentPage = current_page || 1;
|
|
24
|
+
|
|
25
|
+
// Generate page numbers to display
|
|
26
|
+
var getPageNumbers = function getPageNumbers() {
|
|
27
|
+
var pages = [];
|
|
28
|
+
var maxVisible = 5;
|
|
29
|
+
var startPage = Math.max(1, currentPage - Math.floor(maxVisible / 2));
|
|
30
|
+
var endPage = Math.min(totalPages, startPage + maxVisible - 1);
|
|
31
|
+
if (endPage - startPage < maxVisible - 1) {
|
|
32
|
+
startPage = Math.max(1, endPage - maxVisible + 1);
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
// Add first page and ellipsis
|
|
36
|
+
if (startPage > 1) {
|
|
37
|
+
pages.push(1);
|
|
38
|
+
if (startPage > 2) {
|
|
39
|
+
pages.push('...');
|
|
40
|
+
}
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
// Add visible pages
|
|
44
|
+
for (var i = startPage; i <= endPage; i++) {
|
|
45
|
+
pages.push(i);
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
// Add ellipsis and last page
|
|
49
|
+
if (endPage < totalPages) {
|
|
50
|
+
if (endPage < totalPages - 1) {
|
|
51
|
+
pages.push('...');
|
|
52
|
+
}
|
|
53
|
+
pages.push(totalPages);
|
|
54
|
+
}
|
|
55
|
+
return pages;
|
|
56
|
+
};
|
|
57
|
+
var handlePageClick = function handlePageClick(page) {
|
|
58
|
+
if (page !== currentPage && page >= 1 && page <= totalPages && typeof page === 'number') {
|
|
59
|
+
nextPage(page);
|
|
60
|
+
}
|
|
61
|
+
};
|
|
62
|
+
var handlePrevious = function handlePrevious() {
|
|
63
|
+
if (currentPage > 1) {
|
|
64
|
+
nextPage(currentPage - 1);
|
|
65
|
+
}
|
|
66
|
+
};
|
|
67
|
+
var handleNext = function handleNext() {
|
|
68
|
+
if (currentPage < totalPages) {
|
|
69
|
+
nextPage(currentPage + 1);
|
|
70
|
+
}
|
|
71
|
+
};
|
|
72
|
+
if (totalPages <= 1) return null;
|
|
73
|
+
var pageNumbers = getPageNumbers();
|
|
74
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
|
|
75
|
+
style: [styles.container, containerStyle],
|
|
76
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
|
|
77
|
+
style: [styles.nav, navStyle],
|
|
78
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.TouchableOpacity, {
|
|
79
|
+
onPress: handlePrevious,
|
|
80
|
+
disabled: currentPage === 1,
|
|
81
|
+
style: [styles.button, styles.previousButton, previousButtonStyle, currentPage === 1 && styles.buttonDisabled],
|
|
82
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
|
|
83
|
+
style: styles.buttonText,
|
|
84
|
+
children: "\u2039"
|
|
85
|
+
})
|
|
86
|
+
}), pageNumbers.map(function (page, index) {
|
|
87
|
+
if (page === '...') {
|
|
88
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
|
|
89
|
+
style: [styles.ellipsis, ellipsisStyle],
|
|
90
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
|
|
91
|
+
style: styles.ellipsisText,
|
|
92
|
+
children: "..."
|
|
93
|
+
})
|
|
94
|
+
}, "ellipsis-".concat(index));
|
|
95
|
+
}
|
|
96
|
+
var isActive = page === currentPage;
|
|
97
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.TouchableOpacity, {
|
|
98
|
+
onPress: function onPress() {
|
|
99
|
+
return handlePageClick(page);
|
|
100
|
+
},
|
|
101
|
+
style: [styles.button, styles.pageButton, pageButtonStyle, isActive && [styles.pageButtonActive, pageButtonActiveStyle]],
|
|
102
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
|
|
103
|
+
style: [styles.pageButtonText, isActive && styles.pageButtonTextActive],
|
|
104
|
+
children: page
|
|
105
|
+
})
|
|
106
|
+
}, page);
|
|
107
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.TouchableOpacity, {
|
|
108
|
+
onPress: handleNext,
|
|
109
|
+
disabled: currentPage === totalPages,
|
|
110
|
+
style: [styles.button, styles.nextButton, nextButtonStyle, currentPage === totalPages && styles.buttonDisabled],
|
|
111
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
|
|
112
|
+
style: styles.buttonText,
|
|
113
|
+
children: "\u203A"
|
|
114
|
+
})
|
|
115
|
+
})]
|
|
116
|
+
})
|
|
117
|
+
});
|
|
118
|
+
};
|
|
119
|
+
var styles = _reactNative.StyleSheet.create({
|
|
120
|
+
container: {
|
|
121
|
+
alignItems: 'center',
|
|
122
|
+
justifyContent: 'center'
|
|
123
|
+
},
|
|
124
|
+
nav: {
|
|
125
|
+
flexDirection: 'row',
|
|
126
|
+
alignItems: 'center',
|
|
127
|
+
justifyContent: 'center',
|
|
128
|
+
flexWrap: 'wrap'
|
|
129
|
+
},
|
|
130
|
+
button: {
|
|
131
|
+
minWidth: 40,
|
|
132
|
+
height: 40,
|
|
133
|
+
paddingHorizontal: 12,
|
|
134
|
+
justifyContent: 'center',
|
|
135
|
+
alignItems: 'center',
|
|
136
|
+
borderWidth: 1,
|
|
137
|
+
borderColor: '#D1D5DB',
|
|
138
|
+
backgroundColor: '#FFFFFF'
|
|
139
|
+
},
|
|
140
|
+
previousButton: {
|
|
141
|
+
borderTopLeftRadius: 6,
|
|
142
|
+
borderBottomLeftRadius: 6,
|
|
143
|
+
borderRightWidth: 0
|
|
144
|
+
},
|
|
145
|
+
nextButton: {
|
|
146
|
+
borderTopRightRadius: 6,
|
|
147
|
+
borderBottomRightRadius: 6,
|
|
148
|
+
borderLeftWidth: 0
|
|
149
|
+
},
|
|
150
|
+
pageButton: {
|
|
151
|
+
borderLeftWidth: 0,
|
|
152
|
+
borderRightWidth: 0
|
|
153
|
+
},
|
|
154
|
+
pageButtonActive: {
|
|
155
|
+
backgroundColor: '#3B3269',
|
|
156
|
+
borderColor: '#3B3269'
|
|
157
|
+
},
|
|
158
|
+
buttonDisabled: {
|
|
159
|
+
opacity: 0.5
|
|
160
|
+
},
|
|
161
|
+
buttonText: {
|
|
162
|
+
fontSize: 18,
|
|
163
|
+
color: '#6B7280',
|
|
164
|
+
fontWeight: '500'
|
|
165
|
+
},
|
|
166
|
+
pageButtonText: {
|
|
167
|
+
fontSize: 14,
|
|
168
|
+
color: '#6B7280',
|
|
169
|
+
fontWeight: '500'
|
|
170
|
+
},
|
|
171
|
+
pageButtonTextActive: {
|
|
172
|
+
color: '#FFFFFF',
|
|
173
|
+
fontWeight: '600'
|
|
174
|
+
},
|
|
175
|
+
ellipsis: {
|
|
176
|
+
minWidth: 40,
|
|
177
|
+
height: 40,
|
|
178
|
+
paddingHorizontal: 12,
|
|
179
|
+
justifyContent: 'center',
|
|
180
|
+
alignItems: 'center',
|
|
181
|
+
borderWidth: 1,
|
|
182
|
+
borderColor: '#D1D5DB',
|
|
183
|
+
borderLeftWidth: 0,
|
|
184
|
+
borderRightWidth: 0,
|
|
185
|
+
backgroundColor: '#FFFFFF'
|
|
186
|
+
},
|
|
187
|
+
ellipsisText: {
|
|
188
|
+
fontSize: 14,
|
|
189
|
+
color: '#374151',
|
|
190
|
+
fontWeight: '500'
|
|
191
|
+
}
|
|
192
|
+
});
|
|
193
|
+
var _default = exports.default = Pagination;
|