@tradly/asset 1.0.21 → 1.0.23

package/dist/web/MediaGallery.web.js

@@ -9,6 +9,7 @@ var _react = _interopRequireWildcard(require("react"));
 var _FileUpload = _interopRequireDefault(require("./FileUpload.web"));
 var _ImagesSkeleton = _interopRequireDefault(require("./ImagesSkeleton.web"));
 var _Pagination = _interopRequireDefault(require("./Pagination.web"));
+var _FileTypes = require("../core/FileTypes");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 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); }
@@ -22,7 +23,6 @@ function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r)
 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; }
 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; } }
 function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
-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'];
 var ImagesGallery = function ImagesGallery(_ref) {
   var update_data = _ref.update_data,
     closePopup = _ref.closePopup,
@@ -70,7 +70,7 @@ var ImagesGallery = function ImagesGallery(_ref) {
             _context.p = 1;
             _context.n = 2;
             return apiService.fetchMedia({
-              mimeTypes: IMAGE_MIME_TYPES,
+              mimeTypes: _FileTypes.IMAGE_MIME_TYPES,
               page: page_number,
               setISLoading: setISLoading,
               isLoading: isLoading
@@ -89,7 +89,7 @@ var ImagesGallery = function ImagesGallery(_ref) {
           case 3:
             _context.p = 3;
             _t = _context.v;
-            console.error('Error loading media:', _t);
+            console.error("Error loading media:", _t);
             if (onError) {
               onError(_t);
             }
@@ -112,10 +112,10 @@ var ImagesGallery = function ImagesGallery(_ref) {
   };
 
   // Default classes with customization support
-  var defaultContainerClass = 'h-full flex flex-col justify-between';
-  var defaultGridClass = 'grid grid-cols-[repeat(auto-fill,minmax(calc(160px),1fr))] gap-5';
-  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';
-  var defaultPaginationContainerClass = 'mb-4 bg-gray-100/90 p-4 sticky bottom-0';
+  var defaultContainerClass = "h-full flex flex-col justify-between";
+  var defaultGridClass = "grid grid-cols-[repeat(auto-fill,minmax(calc(160px),1fr))] gap-5";
+  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";
+  var defaultPaginationContainerClass = "mb-4 bg-gray-100/90 p-4 sticky bottom-0";
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
     className: className || defaultContainerClass,
     children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
@@ -127,7 +127,7 @@ var ImagesGallery = function ImagesGallery(_ref) {
         apiService: apiService,
         onUploadError: onError
       }), isLoading ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_ImagesSkeleton.default, {}) : images === null || images === void 0 ? void 0 : images.map(function (image, index) {
-        var imageUrl = typeof image === 'string' ? image : image.url;
+        var imageUrl = typeof image === "string" ? image : image.url;
         var imageKey = image.id || image.url || index;
         return /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
           onClick: function onClick() {
@@ -135,7 +135,7 @@ var ImagesGallery = function ImagesGallery(_ref) {
           },
           className: imageItemClassName || defaultImageItemClass,
           src: imageUrl,
-          alt: image.name || 'Media item'
+          alt: image.name || "Media item"
         }, imageKey);
       })]
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {

package/dist/web/MediaTab.web.js

@@ -21,7 +21,7 @@ function classNames() {
   for (var _len = arguments.length, classes = new Array(_len), _key = 0; _key < _len; _key++) {
     classes[_key] = arguments[_key];
   }
-  return classes.filter(Boolean).join(' ');
+  return classes.filter(Boolean).join(" ");
 }
 var MediaTab = function MediaTab(_ref) {
   var imagePopup = _ref.imagePopup,
@@ -44,9 +44,9 @@ var MediaTab = function MediaTab(_ref) {
   // Build a stable list of enabled tabs in order
   var availableTabs = (0, _react.useMemo)(function () {
     var tabs = [];
-    if (options !== null && options !== void 0 && options.includes('image')) tabs.push('image');
-    if (options !== null && options !== void 0 && options.includes('video')) tabs.push('video');
-    if (options !== null && options !== void 0 && options.includes('file')) tabs.push('file');
+    if (options !== null && options !== void 0 && options.includes("image")) tabs.push("image");
+    if (options !== null && options !== void 0 && options.includes("video")) tabs.push("video");
+    if (options !== null && options !== void 0 && options.includes("file")) tabs.push("file");
     return tabs;
   }, [options]);
   var _useState = (0, _react.useState)(0),
@@ -60,24 +60,24 @@ var MediaTab = function MediaTab(_ref) {
   }
 
   // Default classes with customization support
-  var defaultTabGroupClass = 'h-[520px] overflow-y-auto scrollbar-none';
-  var defaultTabListClass = 'sticky top-0 z-30 bg-white w-full flex border-b-2 border-gray-200';
-  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';
+  var defaultTabGroupClass = "h-[520px] overflow-y-auto scrollbar-none";
+  var defaultTabListClass = "sticky top-0 z-30 bg-white w-full flex border-b-2 border-gray-200";
+  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";
   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';
-  var defaultTabButtonInactiveClass = 'text-[#4F4F4F]';
-  var defaultTabPanelClass = 'h-full py-4 relative';
+  var defaultTabButtonInactiveClass = "text-[#4F4F4F]";
+  var defaultTabPanelClass = "h-full py-4 relative";
   var handleKeyDown = function handleKeyDown(event, index) {
-    if (event.key === 'Enter' || event.key === ' ') {
+    if (event.key === "Enter" || event.key === " ") {
       event.preventDefault();
       setSelectedIndex(index);
     }
-    if (event.key === 'ArrowRight') {
+    if (event.key === "ArrowRight") {
       event.preventDefault();
       setSelectedIndex(function (prev) {
         return (prev + 1) % availableTabs.length;
       });
     }
-    if (event.key === 'ArrowLeft') {
+    if (event.key === "ArrowLeft") {
       event.preventDefault();
       setSelectedIndex(function (prev) {
         return (prev - 1 + availableTabs.length) % availableTabs.length;
@@ -85,13 +85,13 @@ var MediaTab = function MediaTab(_ref) {
     }
   };
   var renderTabLabel = function renderTabLabel(type) {
-    if (type === 'image') return 'Images';
-    if (type === 'video') return 'Videos';
-    if (type === 'file') return 'Files';
+    if (type === "image") return "Images";
+    if (type === "video") return "Videos";
+    if (type === "file") return "Files";
     return type;
   };
   var renderPanel = function renderPanel(type) {
-    if (type === 'image') {
+    if (type === "image") {
       return /*#__PURE__*/(0, _jsxRuntime.jsx)(_MediaGallery.default, {
         imagePopup: imagePopup,
         update_data: update_data,
@@ -104,7 +104,7 @@ var MediaTab = function MediaTab(_ref) {
         paginationContainerClassName: paginationContainerClassName
       });
     }
-    if (type === 'video') {
+    if (type === "video") {
       return /*#__PURE__*/(0, _jsxRuntime.jsx)(_VideosGallery.default, {
         imagePopup: imagePopup,
         update_data: update_data,
@@ -117,9 +117,9 @@ var MediaTab = function MediaTab(_ref) {
         paginationContainerClassName: paginationContainerClassName
       });
     }
-    if (type === 'file') {
-      // Reuse ImagesGallery for files as in original implementation
-      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_MediaGallery.default, {
+    if (type === "file") {
+      // Use FilesGallery for non-image, non-video files
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(FilesGallery, {
         imagePopup: imagePopup,
         update_data: update_data,
         current_data: current_data,
@@ -127,7 +127,7 @@ var MediaTab = function MediaTab(_ref) {
         apiService: apiService,
         onError: onError,
         gridClassName: gridClassName,
-        imageItemClassName: imageItemClassName,
+        fileItemClassName: imageItemClassName,
         paginationContainerClassName: paginationContainerClassName
       });
     }
@@ -145,7 +145,7 @@ var MediaTab = function MediaTab(_ref) {
         var activeClass = tabButtonActiveClassName || defaultTabButtonActiveClass;
         var inactiveClass = tabButtonInactiveClassName || defaultTabButtonInactiveClass;
         var tabClassName = classNames(baseClass, isSelected ? activeClass : inactiveClass);
-        var id = type === 'image' ? 'image-tab-button' : type === 'video' ? 'video-tab-button' : 'file-tab-button';
+        var id = type === "image" ? "image-tab-button" : type === "video" ? "video-tab-button" : "file-tab-button";
         return /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
           id: id,
           type: "button",
@@ -170,7 +170,7 @@ var MediaTab = function MediaTab(_ref) {
       role: "tabpanel",
       children: availableTabs.map(function (type, index) {
         var isSelected = index === selectedIndex;
-        var id = type === 'image' ? 'image-tab-button' : type === 'video' ? 'video-tab-button' : 'file-tab-button';
+        var id = type === "image" ? "image-tab-button" : type === "video" ? "video-tab-button" : "file-tab-button";
         return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
           id: "".concat(id, "-panel"),
           role: "tabpanel",

package/dist/web/VideosGallery.web.js

@@ -9,6 +9,7 @@ var _react = _interopRequireWildcard(require("react"));
 var _FileUpload = _interopRequireDefault(require("./FileUpload.web"));
 var _ImagesSkeleton = _interopRequireDefault(require("./ImagesSkeleton.web"));
 var _Pagination = _interopRequireDefault(require("./Pagination.web"));
+var _FileTypes = require("../core/FileTypes");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 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); }
@@ -22,7 +23,6 @@ function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r)
 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; }
 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; } }
 function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
-var VIDEO_MIME_TYPES = ['video/mp4', 'video/quicktime', 'video/x-ms-wmv', 'video/h265', 'video/hevc', 'video/webm'];
 var VideosGallery = function VideosGallery(_ref) {
   var update_data = _ref.update_data,
     closePopup = _ref.closePopup,
@@ -70,7 +70,7 @@ var VideosGallery = function VideosGallery(_ref) {
             _context.p = 1;
             _context.n = 2;
             return apiService.fetchMedia({
-              mimeTypes: VIDEO_MIME_TYPES,
+              mimeTypes: _FileTypes.VIDEO_MIME_TYPES,
               page: page_number,
               setISLoading: setISLoading,
               isLoading: isLoading
@@ -89,7 +89,7 @@ var VideosGallery = function VideosGallery(_ref) {
           case 3:
             _context.p = 3;
             _t = _context.v;
-            console.error('Error loading videos:', _t);
+            console.error("Error loading videos:", _t);
             if (onError) {
               onError(_t);
             }
@@ -112,10 +112,10 @@ var VideosGallery = function VideosGallery(_ref) {
   };
 
   // Default classes with customization support
-  var defaultContainerClass = 'h-full flex flex-col justify-between';
-  var defaultGridClass = 'grid grid-cols-[repeat(auto-fill,minmax(calc(180px),1fr))] gap-5';
-  var defaultVideoItemClass = 'cursor-pointer w-full h-40 object-contain overflow-hidden bg-white rounded-md shadow-md hover:shadow-lg transition-shadow';
-  var defaultPaginationContainerClass = 'mb-4 bg-gray-100/90 p-4 sticky bottom-0';
+  var defaultContainerClass = "h-full flex flex-col justify-between";
+  var defaultGridClass = "grid grid-cols-[repeat(auto-fill,minmax(calc(180px),1fr))] gap-5";
+  var defaultVideoItemClass = "cursor-pointer w-full h-40 object-contain overflow-hidden bg-white rounded-md shadow-md hover:shadow-lg transition-shadow";
+  var defaultPaginationContainerClass = "mb-4 bg-gray-100/90 p-4 sticky bottom-0";
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
     className: className || defaultContainerClass,
     children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
@@ -127,7 +127,7 @@ var VideosGallery = function VideosGallery(_ref) {
         apiService: apiService,
         onUploadError: onError
       }), isLoading ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_ImagesSkeleton.default, {}) : videos === null || videos === void 0 ? void 0 : videos.map(function (video, index) {
-        var videoUrl = typeof video === 'string' ? video : video.url;
+        var videoUrl = typeof video === "string" ? video : video.url;
         var videoKey = video.id || video.url || index;
         return /*#__PURE__*/(0, _jsxRuntime.jsx)("video", {
           onClick: function onClick() {

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@tradly/asset",
-    "version": "1.0.21",
+    "version": "1.0.23",
     "description": "A reusable media gallery component for uploading and selecting images, videos, and files with Tradly authentication",
     "main": "dist/index.js",
     "module": "dist/esm/index.js",