@tradly/asset 1.0.4 → 1.0.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/FileUpload.js +23 -15
- package/dist/components/Icons.js +15 -8
- package/dist/components/ImagesSkeleton.js +11 -4
- package/dist/components/MediaGallery.js +27 -18
- package/dist/components/MediaPopup.js +21 -14
- package/dist/components/MediaTab.js +146 -92
- package/dist/components/Pagination.js +20 -13
- package/dist/components/VideosGallery.js +27 -18
- package/dist/esm/components/FileUpload.js +155 -0
- package/dist/esm/components/Icons.js +32 -0
- package/dist/esm/components/ImagesSkeleton.js +14 -0
- package/dist/esm/components/MediaGallery.js +144 -0
- package/dist/esm/components/MediaPopup.js +97 -0
- package/dist/esm/components/MediaTab.js +177 -0
- package/dist/esm/components/Pagination.js +134 -0
- package/dist/esm/components/VideosGallery.js +144 -0
- package/dist/esm/index.js +26 -0
- package/dist/esm/services/apiService.js +373 -0
- package/dist/index.js +50 -16
- package/dist/services/apiService.js +11 -5
- package/package.json +2 -3
|
@@ -1,3 +1,14 @@
|
|
|
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 _Icons = require("./Icons");
|
|
10
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
11
|
+
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 _t2 in e) "default" !== _t2 && {}.hasOwnProperty.call(e, _t2) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t2)) && (i.get || i.set) ? o(f, _t2, i) : f[_t2] = e[_t2]); return f; })(e, t); }
|
|
1
12
|
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 }; })(); }
|
|
2
13
|
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); }
|
|
3
14
|
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); }
|
|
@@ -8,9 +19,6 @@ function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r)
|
|
|
8
19
|
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; }
|
|
9
20
|
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; } }
|
|
10
21
|
function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
|
|
11
|
-
import React, { useState } from 'react';
|
|
12
|
-
import { CameraIcon } from './Icons';
|
|
13
|
-
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
14
22
|
var FileUpload = function FileUpload(_ref) {
|
|
15
23
|
var loadMedia = _ref.loadMedia,
|
|
16
24
|
accept = _ref.accept,
|
|
@@ -24,15 +32,15 @@ var FileUpload = function FileUpload(_ref) {
|
|
|
24
32
|
iconContainerClassName = _ref.iconContainerClassName,
|
|
25
33
|
titleClassName = _ref.titleClassName,
|
|
26
34
|
loadingClassName = _ref.loadingClassName;
|
|
27
|
-
var _useState = useState([]),
|
|
35
|
+
var _useState = (0, _react.useState)([]),
|
|
28
36
|
_useState2 = _slicedToArray(_useState, 2),
|
|
29
37
|
files = _useState2[0],
|
|
30
38
|
setFiles = _useState2[1];
|
|
31
|
-
var _useState3 = useState(false),
|
|
39
|
+
var _useState3 = (0, _react.useState)(false),
|
|
32
40
|
_useState4 = _slicedToArray(_useState3, 2),
|
|
33
41
|
isLoading = _useState4[0],
|
|
34
42
|
setISLoading = _useState4[1];
|
|
35
|
-
var _useState5 = useState(0),
|
|
43
|
+
var _useState5 = (0, _react.useState)(0),
|
|
36
44
|
_useState6 = _slicedToArray(_useState5, 2),
|
|
37
45
|
length = _useState6[0],
|
|
38
46
|
setLength = _useState6[1];
|
|
@@ -90,10 +98,10 @@ var FileUpload = function FileUpload(_ref) {
|
|
|
90
98
|
var defaultIconContainerClass = 'p-[10px] bg-primary rounded-full';
|
|
91
99
|
var defaultTitleClass = 'mt-2';
|
|
92
100
|
var defaultLoadingClass = 'flex items-center justify-center h-40 bg-gray-200 rounded-lg shadow-md animate-pulse';
|
|
93
|
-
return /*#__PURE__*/
|
|
94
|
-
children: [/*#__PURE__*/
|
|
101
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
|
|
102
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
|
|
95
103
|
className: className || defaultContainerClass,
|
|
96
|
-
children: [/*#__PURE__*/
|
|
104
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
|
|
97
105
|
required: true,
|
|
98
106
|
id: "media_select_".concat(files === null || files === void 0 ? void 0 : files.length),
|
|
99
107
|
type: "file",
|
|
@@ -127,17 +135,17 @@ var FileUpload = function FileUpload(_ref) {
|
|
|
127
135
|
};
|
|
128
136
|
}()),
|
|
129
137
|
multiple: true
|
|
130
|
-
}), /*#__PURE__*/
|
|
138
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsxs)("button", {
|
|
131
139
|
type: "button",
|
|
132
140
|
className: buttonClassName || defaultButtonClass,
|
|
133
141
|
onClick: function onClick() {
|
|
134
142
|
return document.getElementById("media_select_".concat(files === null || files === void 0 ? void 0 : files.length)).click();
|
|
135
143
|
},
|
|
136
144
|
disabled: isLoading,
|
|
137
|
-
children: [/*#__PURE__*/
|
|
145
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
|
|
138
146
|
className: iconContainerClassName || defaultIconContainerClass,
|
|
139
|
-
children: /*#__PURE__*/
|
|
140
|
-
}), /*#__PURE__*/
|
|
147
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icons.CameraIcon, {})
|
|
148
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
|
|
141
149
|
className: titleClassName || defaultTitleClass,
|
|
142
150
|
children: title
|
|
143
151
|
})]
|
|
@@ -145,11 +153,11 @@ var FileUpload = function FileUpload(_ref) {
|
|
|
145
153
|
}), isLoading && Array.from({
|
|
146
154
|
length: length
|
|
147
155
|
}).map(function (_, index) {
|
|
148
|
-
return /*#__PURE__*/
|
|
156
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
|
|
149
157
|
className: loadingClassName || defaultLoadingClass,
|
|
150
158
|
children: ["File Uploading... ", index + 1, "/", length]
|
|
151
159
|
}, index);
|
|
152
160
|
})]
|
|
153
161
|
});
|
|
154
162
|
};
|
|
155
|
-
|
|
163
|
+
var _default = exports.default = FileUpload;
|
package/dist/components/Icons.js
CHANGED
|
@@ -1,30 +1,37 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.CloseIcon = exports.CameraIcon = void 0;
|
|
7
|
+
var _react = _interopRequireDefault(require("react"));
|
|
8
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
9
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
10
|
+
var CloseIcon = exports.CloseIcon = function CloseIcon(_ref) {
|
|
4
11
|
var _ref$className = _ref.className,
|
|
5
12
|
className = _ref$className === void 0 ? 'w-8 h-8' : _ref$className;
|
|
6
|
-
return /*#__PURE__*/
|
|
13
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)("svg", {
|
|
7
14
|
xmlns: "http://www.w3.org/2000/svg",
|
|
8
15
|
fill: "none",
|
|
9
16
|
viewBox: "0 0 24 24",
|
|
10
17
|
strokeWidth: "1.5",
|
|
11
18
|
stroke: "currentColor",
|
|
12
19
|
className: className,
|
|
13
|
-
children: /*#__PURE__*/
|
|
20
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
|
|
14
21
|
strokeLinecap: "round",
|
|
15
22
|
strokeLinejoin: "round",
|
|
16
23
|
d: "M6 18L18 6M6 6l12 12"
|
|
17
24
|
})
|
|
18
25
|
});
|
|
19
26
|
};
|
|
20
|
-
|
|
21
|
-
return /*#__PURE__*/
|
|
27
|
+
var CameraIcon = exports.CameraIcon = function CameraIcon() {
|
|
28
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)("svg", {
|
|
22
29
|
width: "22",
|
|
23
30
|
height: "18",
|
|
24
31
|
viewBox: "0 0 22 20",
|
|
25
32
|
fill: "none",
|
|
26
33
|
xmlns: "http://www.w3.org/2000/svg",
|
|
27
|
-
children: /*#__PURE__*/
|
|
34
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
|
|
28
35
|
d: "M7.75033 0.166672L5.76783 2.33334H2.33366C1.14199 2.33334 0.166992 3.30834 0.166992 4.50001V17.5C0.166992 18.6917 1.14199 19.6667 2.33366 19.6667H19.667C20.8587 19.6667 21.8337 18.6917 21.8337 17.5V4.50001C21.8337 3.30834 20.8587 2.33334 19.667 2.33334H16.2328L14.2503 0.166672H7.75033ZM11.0003 16.4167C8.01033 16.4167 5.58366 13.99 5.58366 11C5.58366 8.01001 8.01033 5.58334 11.0003 5.58334C13.9903 5.58334 16.417 8.01001 16.417 11C16.417 13.99 13.9903 16.4167 11.0003 16.4167Z",
|
|
29
36
|
fill: "white"
|
|
30
37
|
})
|
|
@@ -1,14 +1,21 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
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 _jsxRuntime = require("react/jsx-runtime");
|
|
9
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
3
10
|
var ImagesSkeleton = function ImagesSkeleton(_ref) {
|
|
4
11
|
var _ref$per_page = _ref.per_page,
|
|
5
12
|
per_page = _ref$per_page === void 0 ? 30 : _ref$per_page;
|
|
6
13
|
var gridItems = [];
|
|
7
14
|
for (var i = 0; i < per_page; i++) {
|
|
8
|
-
gridItems.push(/*#__PURE__*/
|
|
15
|
+
gridItems.push(/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
9
16
|
className: "w-full min-h-[160px] bg-[#3B3269] bg-opacity-[20%] rounded-card animate-pulse"
|
|
10
17
|
}, i));
|
|
11
18
|
}
|
|
12
19
|
return gridItems;
|
|
13
20
|
};
|
|
14
|
-
|
|
21
|
+
var _default = exports.default = ImagesSkeleton;
|
|
@@ -1,3 +1,17 @@
|
|
|
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 _FileUpload = _interopRequireDefault(require("./FileUpload"));
|
|
10
|
+
var _ImagesSkeleton = _interopRequireDefault(require("./ImagesSkeleton"));
|
|
11
|
+
var _Pagination = _interopRequireDefault(require("./Pagination"));
|
|
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 _t2 in e) "default" !== _t2 && {}.hasOwnProperty.call(e, _t2) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t2)) && (i.get || i.set) ? o(f, _t2, i) : f[_t2] = e[_t2]); return f; })(e, t); }
|
|
1
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 }; })(); }
|
|
2
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); }
|
|
3
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); }
|
|
@@ -8,11 +22,6 @@ function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r)
|
|
|
8
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; }
|
|
9
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; } }
|
|
10
24
|
function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
|
|
11
|
-
import React, { useState, useEffect } from 'react';
|
|
12
|
-
import FileUpload from './FileUpload';
|
|
13
|
-
import ImagesSkeleton from './ImagesSkeleton';
|
|
14
|
-
import Pagination from './Pagination';
|
|
15
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
16
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'];
|
|
17
26
|
var ImagesGallery = function ImagesGallery(_ref) {
|
|
18
27
|
var update_data = _ref.update_data,
|
|
@@ -23,25 +32,25 @@ var ImagesGallery = function ImagesGallery(_ref) {
|
|
|
23
32
|
gridClassName = _ref.gridClassName,
|
|
24
33
|
imageItemClassName = _ref.imageItemClassName,
|
|
25
34
|
paginationContainerClassName = _ref.paginationContainerClassName;
|
|
26
|
-
var _useState = useState([]),
|
|
35
|
+
var _useState = (0, _react.useState)([]),
|
|
27
36
|
_useState2 = _slicedToArray(_useState, 2),
|
|
28
37
|
images = _useState2[0],
|
|
29
38
|
setImages = _useState2[1];
|
|
30
|
-
var _useState3 = useState(0),
|
|
39
|
+
var _useState3 = (0, _react.useState)(0),
|
|
31
40
|
_useState4 = _slicedToArray(_useState3, 2),
|
|
32
41
|
total_count = _useState4[0],
|
|
33
42
|
setTotalCount = _useState4[1];
|
|
34
|
-
var _useState5 = useState(1),
|
|
43
|
+
var _useState5 = (0, _react.useState)(1),
|
|
35
44
|
_useState6 = _slicedToArray(_useState5, 2),
|
|
36
45
|
currentPage = _useState6[0],
|
|
37
46
|
setCurrentPage = _useState6[1];
|
|
38
|
-
var _useState7 = useState(false),
|
|
47
|
+
var _useState7 = (0, _react.useState)(false),
|
|
39
48
|
_useState8 = _slicedToArray(_useState7, 2),
|
|
40
49
|
isLoading = _useState8[0],
|
|
41
50
|
setISLoading = _useState8[1];
|
|
42
51
|
|
|
43
52
|
// Fetch images
|
|
44
|
-
useEffect(function () {
|
|
53
|
+
(0, _react.useEffect)(function () {
|
|
45
54
|
loadMedia();
|
|
46
55
|
}, []);
|
|
47
56
|
var loadMedia = /*#__PURE__*/function () {
|
|
@@ -107,20 +116,20 @@ var ImagesGallery = function ImagesGallery(_ref) {
|
|
|
107
116
|
var defaultGridClass = 'grid grid-cols-[repeat(auto-fill,minmax(calc(160px),1fr))] gap-5';
|
|
108
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';
|
|
109
118
|
var defaultPaginationContainerClass = 'mb-4 bg-gray-100/90 p-4 sticky bottom-0';
|
|
110
|
-
return /*#__PURE__*/
|
|
119
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
|
|
111
120
|
className: className || defaultContainerClass,
|
|
112
|
-
children: [/*#__PURE__*/
|
|
121
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
|
|
113
122
|
className: gridClassName || defaultGridClass,
|
|
114
|
-
children: [/*#__PURE__*/
|
|
123
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_FileUpload.default, {
|
|
115
124
|
loadMedia: loadMedia,
|
|
116
125
|
accept: "image/*",
|
|
117
126
|
title: "Add Image",
|
|
118
127
|
apiService: apiService,
|
|
119
128
|
onUploadError: onError
|
|
120
|
-
}), isLoading ? /*#__PURE__*/
|
|
129
|
+
}), isLoading ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_ImagesSkeleton.default, {}) : images === null || images === void 0 ? void 0 : images.map(function (image, index) {
|
|
121
130
|
var imageUrl = typeof image === 'string' ? image : image.url;
|
|
122
131
|
var imageKey = image.id || image.url || index;
|
|
123
|
-
return /*#__PURE__*/
|
|
132
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
|
|
124
133
|
onClick: function onClick() {
|
|
125
134
|
return handleImageClick(image);
|
|
126
135
|
},
|
|
@@ -129,9 +138,9 @@ var ImagesGallery = function ImagesGallery(_ref) {
|
|
|
129
138
|
alt: image.name || 'Media item'
|
|
130
139
|
}, imageKey);
|
|
131
140
|
})]
|
|
132
|
-
}), /*#__PURE__*/
|
|
141
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
133
142
|
className: paginationContainerClassName || defaultPaginationContainerClass,
|
|
134
|
-
children: total_count > 0 && /*#__PURE__*/
|
|
143
|
+
children: total_count > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Pagination.default, {
|
|
135
144
|
nextPage: function nextPage(value) {
|
|
136
145
|
return loadMedia(value);
|
|
137
146
|
},
|
|
@@ -141,4 +150,4 @@ var ImagesGallery = function ImagesGallery(_ref) {
|
|
|
141
150
|
})]
|
|
142
151
|
});
|
|
143
152
|
};
|
|
144
|
-
|
|
153
|
+
var _default = exports.default = ImagesGallery;
|
|
@@ -1,8 +1,15 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
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 _reactDom = require("react-dom");
|
|
9
|
+
var _MediaTab = _interopRequireDefault(require("./MediaTab"));
|
|
10
|
+
var _Icons = require("./Icons");
|
|
11
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
12
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
6
13
|
var MediaPopup = function MediaPopup(_ref) {
|
|
7
14
|
var isOpen = _ref.isOpen,
|
|
8
15
|
onClose = _ref.onClose,
|
|
@@ -47,31 +54,31 @@ var MediaPopup = function MediaPopup(_ref) {
|
|
|
47
54
|
var defaultHeaderClass = 'flex items-center justify-between gap-4';
|
|
48
55
|
var defaultTitleClass = 'text-[#000] font-bold text-2xl';
|
|
49
56
|
var defaultCloseButtonClass = 'bg-transparent rounded-full hover:bg-gray-100 p-1 transition-colors';
|
|
50
|
-
return /*#__PURE__*/createPortal(/*#__PURE__*/
|
|
51
|
-
children: [/*#__PURE__*/
|
|
57
|
+
return /*#__PURE__*/(0, _reactDom.createPortal)(/*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
|
|
58
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
52
59
|
className: overlayClassName || defaultOverlayClass,
|
|
53
60
|
style: {
|
|
54
61
|
zIndex: 9998
|
|
55
62
|
},
|
|
56
63
|
onClick: handleClose
|
|
57
|
-
}), /*#__PURE__*/
|
|
64
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
|
|
58
65
|
className: containerClassName || defaultContainerClass,
|
|
59
66
|
style: {
|
|
60
67
|
zIndex: 9999
|
|
61
68
|
},
|
|
62
|
-
children: [/*#__PURE__*/
|
|
69
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
|
|
63
70
|
className: headerClassName || defaultHeaderClass,
|
|
64
|
-
children: [/*#__PURE__*/
|
|
71
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
|
|
65
72
|
className: titleClassName || defaultTitleClass,
|
|
66
73
|
children: title
|
|
67
|
-
}), /*#__PURE__*/
|
|
74
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
|
|
68
75
|
className: closeButtonClassName || defaultCloseButtonClass,
|
|
69
76
|
type: "button",
|
|
70
77
|
onClick: handleClose,
|
|
71
78
|
"aria-label": "Close",
|
|
72
|
-
children: /*#__PURE__*/
|
|
79
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icons.CloseIcon, {})
|
|
73
80
|
})]
|
|
74
|
-
}), /*#__PURE__*/
|
|
81
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_MediaTab.default, {
|
|
75
82
|
imagePopup: isOpen,
|
|
76
83
|
update_data: handleUpdate,
|
|
77
84
|
current_data: currentData,
|
|
@@ -94,4 +101,4 @@ var MediaPopup = function MediaPopup(_ref) {
|
|
|
94
101
|
})]
|
|
95
102
|
}), document.body);
|
|
96
103
|
};
|
|
97
|
-
|
|
104
|
+
var _default = exports.default = MediaPopup;
|
|
@@ -1,19 +1,27 @@
|
|
|
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 _MediaGallery = _interopRequireDefault(require("./MediaGallery"));
|
|
10
|
+
var _VideosGallery = _interopRequireDefault(require("./VideosGallery"));
|
|
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); }
|
|
1
14
|
function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
|
|
2
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."); }
|
|
3
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; } }
|
|
4
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; }
|
|
5
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; } }
|
|
6
19
|
function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
|
|
7
|
-
import React, { useState } from 'react';
|
|
8
|
-
import { Tab } from '@headlessui/react';
|
|
9
|
-
import ImagesGallery from './MediaGallery';
|
|
10
|
-
import VideosGallery from './VideosGallery';
|
|
11
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
12
20
|
function classNames() {
|
|
13
21
|
for (var _len = arguments.length, classes = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
14
22
|
classes[_key] = arguments[_key];
|
|
15
23
|
}
|
|
16
|
-
return classes.filter(Boolean).join(
|
|
24
|
+
return classes.filter(Boolean).join(" ");
|
|
17
25
|
}
|
|
18
26
|
var MediaTab = function MediaTab(_ref) {
|
|
19
27
|
var imagePopup = _ref.imagePopup,
|
|
@@ -33,100 +41,146 @@ var MediaTab = function MediaTab(_ref) {
|
|
|
33
41
|
imageItemClassName = _ref.imageItemClassName,
|
|
34
42
|
videoItemClassName = _ref.videoItemClassName,
|
|
35
43
|
paginationContainerClassName = _ref.paginationContainerClassName;
|
|
36
|
-
|
|
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),
|
|
37
53
|
_useState2 = _slicedToArray(_useState, 2),
|
|
38
54
|
selectedIndex = _useState2[0],
|
|
39
55
|
setSelectedIndex = _useState2[1];
|
|
40
56
|
|
|
57
|
+
// Guard: if no options passed, render nothing
|
|
58
|
+
if (!availableTabs.length) {
|
|
59
|
+
return null;
|
|
60
|
+
}
|
|
61
|
+
|
|
41
62
|
// Default classes with customization support
|
|
42
|
-
var defaultTabGroupClass =
|
|
43
|
-
var defaultTabListClass =
|
|
44
|
-
var defaultTabButtonBaseClass =
|
|
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";
|
|
45
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';
|
|
46
|
-
var defaultTabButtonInactiveClass =
|
|
47
|
-
var defaultTabPanelClass =
|
|
48
|
-
|
|
49
|
-
|
|
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", {
|
|
50
137
|
className: className || defaultTabGroupClass,
|
|
51
|
-
|
|
52
|
-
selectedIndex: selectedIndex,
|
|
53
|
-
children: [/*#__PURE__*/_jsxs(Tab.List, {
|
|
138
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
54
139
|
className: tabListClassName || defaultTabListClass,
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
},
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
})
|
|
85
|
-
})]
|
|
86
|
-
}), /*#__PURE__*/_jsxs(Tab.Panels, {
|
|
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", {
|
|
87
169
|
className: "h-full",
|
|
88
|
-
|
|
89
|
-
children:
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
})
|
|
102
|
-
}), options.includes('video') && /*#__PURE__*/_jsx(Tab.Panel, {
|
|
103
|
-
className: tabPanelClassName || defaultTabPanelClass,
|
|
104
|
-
children: /*#__PURE__*/_jsx(VideosGallery, {
|
|
105
|
-
imagePopup: imagePopup,
|
|
106
|
-
update_data: update_data,
|
|
107
|
-
current_data: current_data,
|
|
108
|
-
closePopup: closePopup,
|
|
109
|
-
apiService: apiService,
|
|
110
|
-
onError: onError,
|
|
111
|
-
gridClassName: gridClassName,
|
|
112
|
-
videoItemClassName: videoItemClassName,
|
|
113
|
-
paginationContainerClassName: paginationContainerClassName
|
|
114
|
-
})
|
|
115
|
-
}), options.includes('file') && /*#__PURE__*/_jsx(Tab.Panel, {
|
|
116
|
-
className: tabPanelClassName || defaultTabPanelClass,
|
|
117
|
-
children: /*#__PURE__*/_jsx(ImagesGallery, {
|
|
118
|
-
imagePopup: imagePopup,
|
|
119
|
-
update_data: update_data,
|
|
120
|
-
current_data: current_data,
|
|
121
|
-
closePopup: closePopup,
|
|
122
|
-
apiService: apiService,
|
|
123
|
-
onError: onError,
|
|
124
|
-
gridClassName: gridClassName,
|
|
125
|
-
imageItemClassName: imageItemClassName,
|
|
126
|
-
paginationContainerClassName: paginationContainerClassName
|
|
127
|
-
})
|
|
128
|
-
})]
|
|
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
|
+
})
|
|
129
183
|
})]
|
|
130
|
-
}
|
|
184
|
+
});
|
|
131
185
|
};
|
|
132
|
-
|
|
186
|
+
var _default = exports.default = MediaTab;
|