@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
|
@@ -3,19 +3,11 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
var ImagesSkeleton = function ImagesSkeleton(_ref) {
|
|
11
|
-
var _ref$per_page = _ref.per_page,
|
|
12
|
-
per_page = _ref$per_page === void 0 ? 30 : _ref$per_page;
|
|
13
|
-
var gridItems = [];
|
|
14
|
-
for (var i = 0; i < per_page; i++) {
|
|
15
|
-
gridItems.push(/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
16
|
-
className: "w-full min-h-[160px] bg-[#3B3269] bg-opacity-[20%] rounded-card animate-pulse"
|
|
17
|
-
}, i));
|
|
6
|
+
Object.defineProperty(exports, "default", {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: function get() {
|
|
9
|
+
return _ImagesSkeleton.default;
|
|
18
10
|
}
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
11
|
+
});
|
|
12
|
+
var _ImagesSkeleton = _interopRequireDefault(require("../web/ImagesSkeleton.web"));
|
|
13
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
Object.defineProperty(exports, "default", {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: function get() {
|
|
9
|
+
return _ImagesSkeleton.default;
|
|
10
|
+
}
|
|
11
|
+
});
|
|
12
|
+
var _ImagesSkeleton = _interopRequireDefault(require("../native/ImagesSkeleton.native"));
|
|
13
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
@@ -1,153 +1,13 @@
|
|
|
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
|
});
|
|
7
|
-
exports
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
function
|
|
15
|
-
function _regenerator() { /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/babel/babel/blob/main/packages/babel-helpers/LICENSE */ var e, t, r = "function" == typeof Symbol ? Symbol : {}, n = r.iterator || "@@iterator", o = r.toStringTag || "@@toStringTag"; function i(r, n, o, i) { var c = n && n.prototype instanceof Generator ? n : Generator, u = Object.create(c.prototype); return _regeneratorDefine2(u, "_invoke", function (r, n, o) { var i, c, u, f = 0, p = o || [], y = !1, G = { p: 0, n: 0, v: e, a: d, f: d.bind(e, 4), d: function d(t, r) { return i = t, c = 0, u = e, G.n = r, a; } }; function d(r, n) { for (c = r, u = n, t = 0; !y && f && !o && t < p.length; t++) { var o, i = p[t], d = G.p, l = i[2]; r > 3 ? (o = l === n) && (u = i[(c = i[4]) ? 5 : (c = 3, 3)], i[4] = i[5] = e) : i[0] <= d && ((o = r < 2 && d < i[1]) ? (c = 0, G.v = n, G.n = i[1]) : d < l && (o = r < 3 || i[0] > n || n > l) && (i[4] = r, i[5] = n, G.n = l, c = 0)); } if (o || r > 1) return a; throw y = !0, n; } return function (o, p, l) { if (f > 1) throw TypeError("Generator is already running"); for (y && 1 === p && d(p, l), c = p, u = l; (t = c < 2 ? e : u) || !y;) { i || (c ? c < 3 ? (c > 1 && (G.n = -1), d(c, u)) : G.n = u : G.v = u); try { if (f = 2, i) { if (c || (o = "next"), t = i[o]) { if (!(t = t.call(i, u))) throw TypeError("iterator result is not an object"); if (!t.done) return t; u = t.value, c < 2 && (c = 0); } else 1 === c && (t = i.return) && t.call(i), c < 2 && (u = TypeError("The iterator does not provide a '" + o + "' method"), c = 1); i = e; } else if ((t = (y = G.n < 0) ? u : r.call(n, G)) !== a) break; } catch (t) { i = e, c = 1, u = t; } finally { f = 1; } } return { value: t, done: y }; }; }(r, o, i), !0), u; } var a = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} t = Object.getPrototypeOf; var c = [][n] ? t(t([][n]())) : (_regeneratorDefine2(t = {}, n, function () { return this; }), t), u = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(c); function f(e) { return Object.setPrototypeOf ? Object.setPrototypeOf(e, GeneratorFunctionPrototype) : (e.__proto__ = GeneratorFunctionPrototype, _regeneratorDefine2(e, o, "GeneratorFunction")), e.prototype = Object.create(u), e; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, _regeneratorDefine2(u, "constructor", GeneratorFunctionPrototype), _regeneratorDefine2(GeneratorFunctionPrototype, "constructor", GeneratorFunction), GeneratorFunction.displayName = "GeneratorFunction", _regeneratorDefine2(GeneratorFunctionPrototype, o, "GeneratorFunction"), _regeneratorDefine2(u), _regeneratorDefine2(u, o, "Generator"), _regeneratorDefine2(u, n, function () { return this; }), _regeneratorDefine2(u, "toString", function () { return "[object Generator]"; }), (_regenerator = function _regenerator() { return { w: i, m: f }; })(); }
|
|
16
|
-
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); }
|
|
17
|
-
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); }
|
|
18
|
-
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); }); }; }
|
|
19
|
-
function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
|
|
20
|
-
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."); }
|
|
21
|
-
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; } }
|
|
22
|
-
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; }
|
|
23
|
-
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; } }
|
|
24
|
-
function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
|
|
25
|
-
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'];
|
|
26
|
-
var ImagesGallery = function ImagesGallery(_ref) {
|
|
27
|
-
var update_data = _ref.update_data,
|
|
28
|
-
closePopup = _ref.closePopup,
|
|
29
|
-
apiService = _ref.apiService,
|
|
30
|
-
onError = _ref.onError,
|
|
31
|
-
className = _ref.className,
|
|
32
|
-
gridClassName = _ref.gridClassName,
|
|
33
|
-
imageItemClassName = _ref.imageItemClassName,
|
|
34
|
-
paginationContainerClassName = _ref.paginationContainerClassName;
|
|
35
|
-
var _useState = (0, _react.useState)([]),
|
|
36
|
-
_useState2 = _slicedToArray(_useState, 2),
|
|
37
|
-
images = _useState2[0],
|
|
38
|
-
setImages = _useState2[1];
|
|
39
|
-
var _useState3 = (0, _react.useState)(0),
|
|
40
|
-
_useState4 = _slicedToArray(_useState3, 2),
|
|
41
|
-
total_count = _useState4[0],
|
|
42
|
-
setTotalCount = _useState4[1];
|
|
43
|
-
var _useState5 = (0, _react.useState)(1),
|
|
44
|
-
_useState6 = _slicedToArray(_useState5, 2),
|
|
45
|
-
currentPage = _useState6[0],
|
|
46
|
-
setCurrentPage = _useState6[1];
|
|
47
|
-
var _useState7 = (0, _react.useState)(false),
|
|
48
|
-
_useState8 = _slicedToArray(_useState7, 2),
|
|
49
|
-
isLoading = _useState8[0],
|
|
50
|
-
setISLoading = _useState8[1];
|
|
51
|
-
|
|
52
|
-
// Fetch images
|
|
53
|
-
(0, _react.useEffect)(function () {
|
|
54
|
-
loadMedia();
|
|
55
|
-
}, []);
|
|
56
|
-
var loadMedia = /*#__PURE__*/function () {
|
|
57
|
-
var _ref2 = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee() {
|
|
58
|
-
var page_number,
|
|
59
|
-
_response$data,
|
|
60
|
-
_response$data2,
|
|
61
|
-
response,
|
|
62
|
-
mediaData,
|
|
63
|
-
count,
|
|
64
|
-
_args = arguments,
|
|
65
|
-
_t;
|
|
66
|
-
return _regenerator().w(function (_context) {
|
|
67
|
-
while (1) switch (_context.p = _context.n) {
|
|
68
|
-
case 0:
|
|
69
|
-
page_number = _args.length > 0 && _args[0] !== undefined ? _args[0] : 1;
|
|
70
|
-
_context.p = 1;
|
|
71
|
-
_context.n = 2;
|
|
72
|
-
return apiService.fetchMedia({
|
|
73
|
-
mimeTypes: IMAGE_MIME_TYPES,
|
|
74
|
-
page: page_number,
|
|
75
|
-
setISLoading: setISLoading,
|
|
76
|
-
isLoading: isLoading
|
|
77
|
-
});
|
|
78
|
-
case 2:
|
|
79
|
-
response = _context.v;
|
|
80
|
-
// Handle different response formats
|
|
81
|
-
// Response might be: { media: [...], count: ... } or { data: { media: [...], count: ... } } or directly [...]
|
|
82
|
-
mediaData = (response === null || response === void 0 ? void 0 : response.media) || (response === null || response === void 0 || (_response$data = response.data) === null || _response$data === void 0 ? void 0 : _response$data.media) || (response === null || response === void 0 ? void 0 : response.data) || response || [];
|
|
83
|
-
count = (response === null || response === void 0 ? void 0 : response.count) || (response === null || response === void 0 || (_response$data2 = response.data) === null || _response$data2 === void 0 ? void 0 : _response$data2.count) || (response === null || response === void 0 ? void 0 : response.total) || 0;
|
|
84
|
-
setImages(Array.isArray(mediaData) ? mediaData : []);
|
|
85
|
-
setTotalCount(count);
|
|
86
|
-
setCurrentPage(page_number);
|
|
87
|
-
_context.n = 4;
|
|
88
|
-
break;
|
|
89
|
-
case 3:
|
|
90
|
-
_context.p = 3;
|
|
91
|
-
_t = _context.v;
|
|
92
|
-
console.error('Error loading media:', _t);
|
|
93
|
-
if (onError) {
|
|
94
|
-
onError(_t);
|
|
95
|
-
}
|
|
96
|
-
case 4:
|
|
97
|
-
return _context.a(2);
|
|
98
|
-
}
|
|
99
|
-
}, _callee, null, [[1, 3]]);
|
|
100
|
-
}));
|
|
101
|
-
return function loadMedia() {
|
|
102
|
-
return _ref2.apply(this, arguments);
|
|
103
|
-
};
|
|
104
|
-
}();
|
|
105
|
-
var handleImageClick = function handleImageClick(image) {
|
|
106
|
-
if (update_data) {
|
|
107
|
-
update_data(image.url || image);
|
|
108
|
-
}
|
|
109
|
-
if (closePopup) {
|
|
110
|
-
closePopup();
|
|
111
|
-
}
|
|
112
|
-
};
|
|
113
|
-
|
|
114
|
-
// Default classes with customization support
|
|
115
|
-
var defaultContainerClass = 'h-full flex flex-col justify-between';
|
|
116
|
-
var defaultGridClass = 'grid grid-cols-[repeat(auto-fill,minmax(calc(160px),1fr))] gap-5';
|
|
117
|
-
var defaultImageItemClass = 'cursor-pointer w-full h-40 object-contain p-3 overflow-hidden bg-white rounded-md shadow-md hover:shadow-lg transition-shadow';
|
|
118
|
-
var defaultPaginationContainerClass = 'mb-4 bg-gray-100/90 p-4 sticky bottom-0';
|
|
119
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
|
|
120
|
-
className: className || defaultContainerClass,
|
|
121
|
-
children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
|
|
122
|
-
className: gridClassName || defaultGridClass,
|
|
123
|
-
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_FileUpload.default, {
|
|
124
|
-
loadMedia: loadMedia,
|
|
125
|
-
accept: "image/*",
|
|
126
|
-
title: "Add Image",
|
|
127
|
-
apiService: apiService,
|
|
128
|
-
onUploadError: onError
|
|
129
|
-
}), isLoading ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_ImagesSkeleton.default, {}) : images === null || images === void 0 ? void 0 : images.map(function (image, index) {
|
|
130
|
-
var imageUrl = typeof image === 'string' ? image : image.url;
|
|
131
|
-
var imageKey = image.id || image.url || index;
|
|
132
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
|
|
133
|
-
onClick: function onClick() {
|
|
134
|
-
return handleImageClick(image);
|
|
135
|
-
},
|
|
136
|
-
className: imageItemClassName || defaultImageItemClass,
|
|
137
|
-
src: imageUrl,
|
|
138
|
-
alt: image.name || 'Media item'
|
|
139
|
-
}, imageKey);
|
|
140
|
-
})]
|
|
141
|
-
}), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
142
|
-
className: paginationContainerClassName || defaultPaginationContainerClass,
|
|
143
|
-
children: total_count > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Pagination.default, {
|
|
144
|
-
nextPage: function nextPage(value) {
|
|
145
|
-
return loadMedia(value);
|
|
146
|
-
},
|
|
147
|
-
pageCount: Math.ceil(total_count / 30),
|
|
148
|
-
current_page: currentPage
|
|
149
|
-
})
|
|
150
|
-
})]
|
|
151
|
-
});
|
|
152
|
-
};
|
|
153
|
-
var _default = exports.default = ImagesGallery;
|
|
6
|
+
Object.defineProperty(exports, "default", {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: function get() {
|
|
9
|
+
return _MediaGallery.default;
|
|
10
|
+
}
|
|
11
|
+
});
|
|
12
|
+
var _MediaGallery = _interopRequireDefault(require("../web/MediaGallery.web"));
|
|
13
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
Object.defineProperty(exports, "default", {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: function get() {
|
|
9
|
+
return _MediaGallery.default;
|
|
10
|
+
}
|
|
11
|
+
});
|
|
12
|
+
var _MediaGallery = _interopRequireDefault(require("../native/MediaGallery.native"));
|
|
13
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
@@ -3,102 +3,11 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
var isOpen = _ref.isOpen,
|
|
15
|
-
onClose = _ref.onClose,
|
|
16
|
-
onSelect = _ref.onSelect,
|
|
17
|
-
currentData = _ref.currentData,
|
|
18
|
-
_ref$options = _ref.options,
|
|
19
|
-
options = _ref$options === void 0 ? ['image'] : _ref$options,
|
|
20
|
-
apiService = _ref.apiService,
|
|
21
|
-
onError = _ref.onError,
|
|
22
|
-
_ref$title = _ref.title,
|
|
23
|
-
title = _ref$title === void 0 ? 'Media Gallery' : _ref$title,
|
|
24
|
-
className = _ref.className,
|
|
25
|
-
overlayClassName = _ref.overlayClassName,
|
|
26
|
-
containerClassName = _ref.containerClassName,
|
|
27
|
-
headerClassName = _ref.headerClassName,
|
|
28
|
-
titleClassName = _ref.titleClassName,
|
|
29
|
-
closeButtonClassName = _ref.closeButtonClassName,
|
|
30
|
-
tabListClassName = _ref.tabListClassName,
|
|
31
|
-
tabButtonClassName = _ref.tabButtonClassName,
|
|
32
|
-
tabButtonActiveClassName = _ref.tabButtonActiveClassName,
|
|
33
|
-
tabButtonInactiveClassName = _ref.tabButtonInactiveClassName,
|
|
34
|
-
tabPanelClassName = _ref.tabPanelClassName,
|
|
35
|
-
gridClassName = _ref.gridClassName,
|
|
36
|
-
imageItemClassName = _ref.imageItemClassName,
|
|
37
|
-
videoItemClassName = _ref.videoItemClassName,
|
|
38
|
-
paginationContainerClassName = _ref.paginationContainerClassName;
|
|
39
|
-
if (!isOpen) return null;
|
|
40
|
-
var handleUpdate = function handleUpdate(data) {
|
|
41
|
-
if (onSelect) {
|
|
42
|
-
onSelect(data);
|
|
43
|
-
}
|
|
44
|
-
};
|
|
45
|
-
var handleClose = function handleClose() {
|
|
46
|
-
if (onClose) {
|
|
47
|
-
onClose();
|
|
48
|
-
}
|
|
49
|
-
};
|
|
50
|
-
|
|
51
|
-
// Default classes with customization support
|
|
52
|
-
var defaultOverlayClass = 'fixed inset-0 w-screen h-screen bg-black opacity-10';
|
|
53
|
-
var defaultContainerClass = 'origin-top-right z-[9999] absolute inset-0 max-w-3xl mx-auto my-auto min-h-[200px] h-[600px] bg-white rounded shadow-inner cursor-auto p-6';
|
|
54
|
-
var defaultHeaderClass = 'flex items-center justify-between gap-4';
|
|
55
|
-
var defaultTitleClass = 'text-[#000] font-bold text-2xl';
|
|
56
|
-
var defaultCloseButtonClass = 'bg-transparent rounded-full hover:bg-gray-100 p-1 transition-colors';
|
|
57
|
-
return /*#__PURE__*/(0, _reactDom.createPortal)(/*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
|
|
58
|
-
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
59
|
-
className: overlayClassName || defaultOverlayClass,
|
|
60
|
-
style: {
|
|
61
|
-
zIndex: 9998
|
|
62
|
-
},
|
|
63
|
-
onClick: handleClose
|
|
64
|
-
}), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
|
|
65
|
-
className: containerClassName || defaultContainerClass,
|
|
66
|
-
style: {
|
|
67
|
-
zIndex: 9999
|
|
68
|
-
},
|
|
69
|
-
children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
|
|
70
|
-
className: headerClassName || defaultHeaderClass,
|
|
71
|
-
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
|
|
72
|
-
className: titleClassName || defaultTitleClass,
|
|
73
|
-
children: title
|
|
74
|
-
}), /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
|
|
75
|
-
className: closeButtonClassName || defaultCloseButtonClass,
|
|
76
|
-
type: "button",
|
|
77
|
-
onClick: handleClose,
|
|
78
|
-
"aria-label": "Close",
|
|
79
|
-
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icons.CloseIcon, {})
|
|
80
|
-
})]
|
|
81
|
-
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_MediaTab.default, {
|
|
82
|
-
imagePopup: isOpen,
|
|
83
|
-
update_data: handleUpdate,
|
|
84
|
-
current_data: currentData,
|
|
85
|
-
closePopup: handleClose,
|
|
86
|
-
options: options,
|
|
87
|
-
apiService: apiService,
|
|
88
|
-
onError: onError
|
|
89
|
-
// Pass styling props through
|
|
90
|
-
,
|
|
91
|
-
tabListClassName: tabListClassName,
|
|
92
|
-
tabButtonClassName: tabButtonClassName,
|
|
93
|
-
tabButtonActiveClassName: tabButtonActiveClassName,
|
|
94
|
-
tabButtonInactiveClassName: tabButtonInactiveClassName,
|
|
95
|
-
tabPanelClassName: tabPanelClassName,
|
|
96
|
-
gridClassName: gridClassName,
|
|
97
|
-
imageItemClassName: imageItemClassName,
|
|
98
|
-
videoItemClassName: videoItemClassName,
|
|
99
|
-
paginationContainerClassName: paginationContainerClassName
|
|
100
|
-
})]
|
|
101
|
-
})]
|
|
102
|
-
}), document.body);
|
|
103
|
-
};
|
|
104
|
-
var _default = exports.default = MediaPopup;
|
|
6
|
+
Object.defineProperty(exports, "default", {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: function get() {
|
|
9
|
+
return _MediaPopup.default;
|
|
10
|
+
}
|
|
11
|
+
});
|
|
12
|
+
var _MediaPopup = _interopRequireDefault(require("../web/MediaPopup.web"));
|
|
13
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
Object.defineProperty(exports, "default", {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: function get() {
|
|
9
|
+
return _MediaPopup.default;
|
|
10
|
+
}
|
|
11
|
+
});
|
|
12
|
+
var _MediaPopup = _interopRequireDefault(require("../native/MediaPopup.native"));
|
|
13
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
@@ -1,186 +1,13 @@
|
|
|
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
|
});
|
|
7
|
-
exports
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
|
12
|
-
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
13
|
-
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); }
|
|
14
|
-
function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
|
|
15
|
-
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."); }
|
|
16
|
-
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; } }
|
|
17
|
-
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; }
|
|
18
|
-
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; } }
|
|
19
|
-
function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
|
|
20
|
-
function classNames() {
|
|
21
|
-
for (var _len = arguments.length, classes = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
22
|
-
classes[_key] = arguments[_key];
|
|
6
|
+
Object.defineProperty(exports, "default", {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: function get() {
|
|
9
|
+
return _MediaTab.default;
|
|
23
10
|
}
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
var imagePopup = _ref.imagePopup,
|
|
28
|
-
current_data = _ref.current_data,
|
|
29
|
-
update_data = _ref.update_data,
|
|
30
|
-
closePopup = _ref.closePopup,
|
|
31
|
-
options = _ref.options,
|
|
32
|
-
apiService = _ref.apiService,
|
|
33
|
-
onError = _ref.onError,
|
|
34
|
-
className = _ref.className,
|
|
35
|
-
tabListClassName = _ref.tabListClassName,
|
|
36
|
-
tabButtonClassName = _ref.tabButtonClassName,
|
|
37
|
-
tabButtonActiveClassName = _ref.tabButtonActiveClassName,
|
|
38
|
-
tabButtonInactiveClassName = _ref.tabButtonInactiveClassName,
|
|
39
|
-
tabPanelClassName = _ref.tabPanelClassName,
|
|
40
|
-
gridClassName = _ref.gridClassName,
|
|
41
|
-
imageItemClassName = _ref.imageItemClassName,
|
|
42
|
-
videoItemClassName = _ref.videoItemClassName,
|
|
43
|
-
paginationContainerClassName = _ref.paginationContainerClassName;
|
|
44
|
-
// Build a stable list of enabled tabs in order
|
|
45
|
-
var availableTabs = (0, _react.useMemo)(function () {
|
|
46
|
-
var tabs = [];
|
|
47
|
-
if (options !== null && options !== void 0 && options.includes("image")) tabs.push("image");
|
|
48
|
-
if (options !== null && options !== void 0 && options.includes("video")) tabs.push("video");
|
|
49
|
-
if (options !== null && options !== void 0 && options.includes("file")) tabs.push("file");
|
|
50
|
-
return tabs;
|
|
51
|
-
}, [options]);
|
|
52
|
-
var _useState = (0, _react.useState)(0),
|
|
53
|
-
_useState2 = _slicedToArray(_useState, 2),
|
|
54
|
-
selectedIndex = _useState2[0],
|
|
55
|
-
setSelectedIndex = _useState2[1];
|
|
56
|
-
|
|
57
|
-
// Guard: if no options passed, render nothing
|
|
58
|
-
if (!availableTabs.length) {
|
|
59
|
-
return null;
|
|
60
|
-
}
|
|
61
|
-
|
|
62
|
-
// Default classes with customization support
|
|
63
|
-
var defaultTabGroupClass = "h-[520px] overflow-y-auto scrollbar-none";
|
|
64
|
-
var defaultTabListClass = "sticky top-0 z-30 bg-white w-full flex border-b-2 border-gray-200";
|
|
65
|
-
var defaultTabButtonBaseClass = "rounded-lg py-2.5 px-8 text-base font-medium leading-5 flex flex-col md:flex-row items-center justify-center gap-3 ring-0 focus:outline-none";
|
|
66
|
-
var defaultTabButtonActiveClass = 'relative text-primary after:content-[""] after:h-1 after:w-full after:block after:absolute after:-bottom-0.5 after:bg-primary after:rounded-card';
|
|
67
|
-
var defaultTabButtonInactiveClass = "text-[#4F4F4F]";
|
|
68
|
-
var defaultTabPanelClass = "h-full py-4 relative";
|
|
69
|
-
var handleKeyDown = function handleKeyDown(event, index) {
|
|
70
|
-
if (event.key === "Enter" || event.key === " ") {
|
|
71
|
-
event.preventDefault();
|
|
72
|
-
setSelectedIndex(index);
|
|
73
|
-
}
|
|
74
|
-
if (event.key === "ArrowRight") {
|
|
75
|
-
event.preventDefault();
|
|
76
|
-
setSelectedIndex(function (prev) {
|
|
77
|
-
return (prev + 1) % availableTabs.length;
|
|
78
|
-
});
|
|
79
|
-
}
|
|
80
|
-
if (event.key === "ArrowLeft") {
|
|
81
|
-
event.preventDefault();
|
|
82
|
-
setSelectedIndex(function (prev) {
|
|
83
|
-
return (prev - 1 + availableTabs.length) % availableTabs.length;
|
|
84
|
-
});
|
|
85
|
-
}
|
|
86
|
-
};
|
|
87
|
-
var renderTabLabel = function renderTabLabel(type) {
|
|
88
|
-
if (type === "image") return "Images";
|
|
89
|
-
if (type === "video") return "Videos";
|
|
90
|
-
if (type === "file") return "Files";
|
|
91
|
-
return type;
|
|
92
|
-
};
|
|
93
|
-
var renderPanel = function renderPanel(type) {
|
|
94
|
-
if (type === "image") {
|
|
95
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_MediaGallery.default, {
|
|
96
|
-
imagePopup: imagePopup,
|
|
97
|
-
update_data: update_data,
|
|
98
|
-
current_data: current_data,
|
|
99
|
-
closePopup: closePopup,
|
|
100
|
-
apiService: apiService,
|
|
101
|
-
onError: onError,
|
|
102
|
-
gridClassName: gridClassName,
|
|
103
|
-
imageItemClassName: imageItemClassName,
|
|
104
|
-
paginationContainerClassName: paginationContainerClassName
|
|
105
|
-
});
|
|
106
|
-
}
|
|
107
|
-
if (type === "video") {
|
|
108
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_VideosGallery.default, {
|
|
109
|
-
imagePopup: imagePopup,
|
|
110
|
-
update_data: update_data,
|
|
111
|
-
current_data: current_data,
|
|
112
|
-
closePopup: closePopup,
|
|
113
|
-
apiService: apiService,
|
|
114
|
-
onError: onError,
|
|
115
|
-
gridClassName: gridClassName,
|
|
116
|
-
videoItemClassName: videoItemClassName,
|
|
117
|
-
paginationContainerClassName: paginationContainerClassName
|
|
118
|
-
});
|
|
119
|
-
}
|
|
120
|
-
if (type === "file") {
|
|
121
|
-
// Reuse ImagesGallery for files as in original implementation
|
|
122
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_MediaGallery.default, {
|
|
123
|
-
imagePopup: imagePopup,
|
|
124
|
-
update_data: update_data,
|
|
125
|
-
current_data: current_data,
|
|
126
|
-
closePopup: closePopup,
|
|
127
|
-
apiService: apiService,
|
|
128
|
-
onError: onError,
|
|
129
|
-
gridClassName: gridClassName,
|
|
130
|
-
imageItemClassName: imageItemClassName,
|
|
131
|
-
paginationContainerClassName: paginationContainerClassName
|
|
132
|
-
});
|
|
133
|
-
}
|
|
134
|
-
return null;
|
|
135
|
-
};
|
|
136
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
|
|
137
|
-
className: className || defaultTabGroupClass,
|
|
138
|
-
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
139
|
-
className: tabListClassName || defaultTabListClass,
|
|
140
|
-
role: "tablist",
|
|
141
|
-
"aria-orientation": "horizontal",
|
|
142
|
-
children: availableTabs.map(function (type, index) {
|
|
143
|
-
var isSelected = index === selectedIndex;
|
|
144
|
-
var baseClass = tabButtonClassName || defaultTabButtonBaseClass;
|
|
145
|
-
var activeClass = tabButtonActiveClassName || defaultTabButtonActiveClass;
|
|
146
|
-
var inactiveClass = tabButtonInactiveClassName || defaultTabButtonInactiveClass;
|
|
147
|
-
var tabClassName = classNames(baseClass, isSelected ? activeClass : inactiveClass);
|
|
148
|
-
var id = type === "image" ? "image-tab-button" : type === "video" ? "video-tab-button" : "file-tab-button";
|
|
149
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
|
|
150
|
-
id: id,
|
|
151
|
-
type: "button",
|
|
152
|
-
role: "tab",
|
|
153
|
-
"aria-selected": isSelected,
|
|
154
|
-
"aria-controls": "".concat(id, "-panel"),
|
|
155
|
-
tabIndex: isSelected ? 0 : -1,
|
|
156
|
-
className: tabClassName,
|
|
157
|
-
onClick: function onClick() {
|
|
158
|
-
return setSelectedIndex(index);
|
|
159
|
-
},
|
|
160
|
-
onKeyDown: function onKeyDown(e) {
|
|
161
|
-
return handleKeyDown(e, index);
|
|
162
|
-
},
|
|
163
|
-
children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
|
|
164
|
-
children: renderTabLabel(type)
|
|
165
|
-
})
|
|
166
|
-
}, type);
|
|
167
|
-
})
|
|
168
|
-
}), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
169
|
-
className: "h-full",
|
|
170
|
-
role: "tabpanel",
|
|
171
|
-
children: availableTabs.map(function (type, index) {
|
|
172
|
-
var isSelected = index === selectedIndex;
|
|
173
|
-
var id = type === "image" ? "image-tab-button" : type === "video" ? "video-tab-button" : "file-tab-button";
|
|
174
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
175
|
-
id: "".concat(id, "-panel"),
|
|
176
|
-
role: "tabpanel",
|
|
177
|
-
"aria-labelledby": id,
|
|
178
|
-
hidden: !isSelected,
|
|
179
|
-
className: tabPanelClassName || defaultTabPanelClass,
|
|
180
|
-
children: isSelected && renderPanel(type)
|
|
181
|
-
}, type);
|
|
182
|
-
})
|
|
183
|
-
})]
|
|
184
|
-
});
|
|
185
|
-
};
|
|
186
|
-
var _default = exports.default = MediaTab;
|
|
11
|
+
});
|
|
12
|
+
var _MediaTab = _interopRequireDefault(require("../web/MediaTab.web"));
|
|
13
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
Object.defineProperty(exports, "default", {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: function get() {
|
|
9
|
+
return _MediaTab.default;
|
|
10
|
+
}
|
|
11
|
+
});
|
|
12
|
+
var _MediaTab = _interopRequireDefault(require("../native/MediaTab.native"));
|
|
13
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|