@cannyminds/dms-file-viewers 0.1.0

package/dist/chunk-QQDQJ7TS.mjs

@@ -0,0 +1,263 @@
+"use client";
+
+// src/utils/fileUtils.ts
+var getFileExtension = (fileName) => {
+  const extension = fileName.toLowerCase().split(".").pop();
+  return extension || "";
+};
+var getMimeTypeFromExtension = (extension) => {
+  const mimeTypes = {
+    "pdf": "application/pdf",
+    "txt": "text/plain",
+    "json": "application/json",
+    "xml": "text/xml",
+    "csv": "text/csv",
+    "jpg": "image/jpeg",
+    "jpeg": "image/jpeg",
+    "png": "image/png",
+    "gif": "image/gif",
+    "svg": "image/svg+xml",
+    "mp4": "video/mp4",
+    "webm": "video/webm",
+    "mp3": "audio/mpeg",
+    "wav": "audio/wav",
+    "doc": "application/msword",
+    "docx": "application/vnd.openxmlformats-officedocument.wordprocessingml.document",
+    "xls": "application/vnd.ms-excel",
+    "xlsx": "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
+  };
+  return mimeTypes[extension] || "application/octet-stream";
+};
+
+// src/components/FileIcon.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var FileIcon = ({ ext, size = 48, sx = {} }) => {
+  const extension = ext?.toLowerCase().replace(/^\./, "") || "";
+  const getIconConfig = (extension2) => {
+    switch (extension2) {
+      case "pdf":
+        return { color: "#d32f2f", bgColor: "#ffebee", label: "PDF" };
+      case "doc":
+      case "docx":
+        return { color: "#1976d2", bgColor: "#e3f2fd", label: extension2.toUpperCase() };
+      case "xls":
+      case "xlsx":
+        return { color: "#388e3c", bgColor: "#e8f5e8", label: extension2.toUpperCase() };
+      case "ppt":
+      case "pptx":
+        return { color: "#f57c00", bgColor: "#fff3e0", label: extension2.toUpperCase() };
+      case "jpg":
+      case "jpeg":
+      case "png":
+      case "gif":
+      case "svg":
+      case "webp":
+      case "bmp":
+      case "tiff":
+      case "tif":
+        return { color: "#7b1fa2", bgColor: "#f3e5f5", label: extension2.toUpperCase() };
+      case "mp4":
+      case "avi":
+      case "mov":
+      case "wmv":
+      case "webm":
+      case "mkv":
+        return { color: "#c2185b", bgColor: "#fce4ec", label: extension2.toUpperCase() };
+      case "mp3":
+      case "wav":
+      case "flac":
+      case "aac":
+      case "ogg":
+      case "m4a":
+        return { color: "#303f9f", bgColor: "#e8eaf6", label: extension2.toUpperCase() };
+      case "zip":
+      case "rar":
+      case "7z":
+      case "tar":
+      case "gz":
+        return { color: "#f9a825", bgColor: "#fffde7", label: extension2.toUpperCase() };
+      case "txt":
+      case "md":
+      case "csv":
+        return { color: "#424242", bgColor: "#f5f5f5", label: extension2.toUpperCase() };
+      case "js":
+      case "jsx":
+      case "ts":
+      case "tsx":
+      case "html":
+      case "css":
+      case "json":
+      case "xml":
+      case "py":
+      case "java":
+      case "cpp":
+      case "c":
+        return { color: "#424242", bgColor: "#f5f5f5", label: extension2.toUpperCase() };
+      default:
+        return { color: "#757575", bgColor: "#fafafa", label: extension2 ? extension2.toUpperCase() : "FILE" };
+    }
+  };
+  const iconConfig = getIconConfig(extension);
+  const getSVGIcon = (ext2) => {
+    const iconSize = size * 0.6;
+    switch (ext2) {
+      case "pdf":
+      case "doc":
+      case "docx":
+      case "ppt":
+      case "pptx":
+        return /* @__PURE__ */ jsxs("svg", { width: iconSize, height: iconSize, viewBox: "0 0 24 24", fill: "none", children: [
+          /* @__PURE__ */ jsx("path", { d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z", stroke: iconConfig.color, strokeWidth: "2", fill: "none" }),
+          /* @__PURE__ */ jsx("polyline", { points: "14,2 14,8 20,8", stroke: iconConfig.color, strokeWidth: "2", fill: "none" }),
+          /* @__PURE__ */ jsx("line", { x1: "16", y1: "13", x2: "8", y2: "13", stroke: iconConfig.color, strokeWidth: "2" }),
+          /* @__PURE__ */ jsx("line", { x1: "16", y1: "17", x2: "8", y2: "17", stroke: iconConfig.color, strokeWidth: "2" }),
+          /* @__PURE__ */ jsx("polyline", { points: "10,9 9,9 8,9", stroke: iconConfig.color, strokeWidth: "2" })
+        ] });
+      case "xls":
+      case "xlsx":
+        return /* @__PURE__ */ jsxs("svg", { width: iconSize, height: iconSize, viewBox: "0 0 24 24", fill: "none", children: [
+          /* @__PURE__ */ jsx("path", { d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z", stroke: iconConfig.color, strokeWidth: "2", fill: "none" }),
+          /* @__PURE__ */ jsx("polyline", { points: "14,2 14,8 20,8", stroke: iconConfig.color, strokeWidth: "2", fill: "none" }),
+          /* @__PURE__ */ jsx("line", { x1: "8", y1: "13", x2: "16", y2: "13", stroke: iconConfig.color, strokeWidth: "2" }),
+          /* @__PURE__ */ jsx("line", { x1: "8", y1: "17", x2: "16", y2: "17", stroke: iconConfig.color, strokeWidth: "2" }),
+          /* @__PURE__ */ jsx("line", { x1: "12", y1: "9", x2: "12", y2: "21", stroke: iconConfig.color, strokeWidth: "2" })
+        ] });
+      case "jpg":
+      case "jpeg":
+      case "png":
+      case "gif":
+      case "svg":
+      case "webp":
+      case "bmp":
+      case "tiff":
+      case "tif":
+        return /* @__PURE__ */ jsxs("svg", { width: iconSize, height: iconSize, viewBox: "0 0 24 24", fill: "none", children: [
+          /* @__PURE__ */ jsx("rect", { x: "3", y: "3", width: "18", height: "18", rx: "2", ry: "2", stroke: iconConfig.color, strokeWidth: "2", fill: "none" }),
+          /* @__PURE__ */ jsx("circle", { cx: "8.5", cy: "8.5", r: "1.5", stroke: iconConfig.color, strokeWidth: "2", fill: "none" }),
+          /* @__PURE__ */ jsx("polyline", { points: "21,15 16,10 5,21", stroke: iconConfig.color, strokeWidth: "2", fill: "none" })
+        ] });
+      case "mp4":
+      case "avi":
+      case "mov":
+      case "wmv":
+      case "webm":
+      case "mkv":
+        return /* @__PURE__ */ jsxs("svg", { width: iconSize, height: iconSize, viewBox: "0 0 24 24", fill: "none", children: [
+          /* @__PURE__ */ jsx("polygon", { points: "23 12 8 2 8 22 23 12", stroke: iconConfig.color, strokeWidth: "2", fill: "none" }),
+          /* @__PURE__ */ jsx("rect", { x: "1", y: "5", width: "6", height: "14", rx: "1", stroke: iconConfig.color, strokeWidth: "2", fill: "none" })
+        ] });
+      case "mp3":
+      case "wav":
+      case "flac":
+      case "aac":
+      case "ogg":
+      case "m4a":
+        return /* @__PURE__ */ jsxs("svg", { width: iconSize, height: iconSize, viewBox: "0 0 24 24", fill: "none", children: [
+          /* @__PURE__ */ jsx("path", { d: "M9 18V5l12-2v13", stroke: iconConfig.color, strokeWidth: "2", fill: "none" }),
+          /* @__PURE__ */ jsx("circle", { cx: "6", cy: "18", r: "3", stroke: iconConfig.color, strokeWidth: "2", fill: "none" }),
+          /* @__PURE__ */ jsx("circle", { cx: "18", cy: "16", r: "3", stroke: iconConfig.color, strokeWidth: "2", fill: "none" })
+        ] });
+      case "zip":
+      case "rar":
+      case "7z":
+      case "tar":
+      case "gz":
+        return /* @__PURE__ */ jsxs("svg", { width: iconSize, height: iconSize, viewBox: "0 0 24 24", fill: "none", children: [
+          /* @__PURE__ */ jsx("rect", { x: "3", y: "11", width: "18", height: "10", rx: "2", ry: "2", stroke: iconConfig.color, strokeWidth: "2", fill: "none" }),
+          /* @__PURE__ */ jsx("circle", { cx: "12", cy: "16", r: "1", stroke: iconConfig.color, strokeWidth: "2", fill: "none" }),
+          /* @__PURE__ */ jsx("path", { d: "M7 11V7a5 5 0 0 1 10 0v4", stroke: iconConfig.color, strokeWidth: "2", fill: "none" })
+        ] });
+      case "txt":
+      case "md":
+      case "csv":
+        return /* @__PURE__ */ jsxs("svg", { width: iconSize, height: iconSize, viewBox: "0 0 24 24", fill: "none", children: [
+          /* @__PURE__ */ jsx("path", { d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z", stroke: iconConfig.color, strokeWidth: "2", fill: "none" }),
+          /* @__PURE__ */ jsx("polyline", { points: "14,2 14,8 20,8", stroke: iconConfig.color, strokeWidth: "2", fill: "none" }),
+          /* @__PURE__ */ jsx("line", { x1: "16", y1: "13", x2: "8", y2: "13", stroke: iconConfig.color, strokeWidth: "2" }),
+          /* @__PURE__ */ jsx("line", { x1: "16", y1: "17", x2: "8", y2: "17", stroke: iconConfig.color, strokeWidth: "2" })
+        ] });
+      case "js":
+      case "jsx":
+      case "ts":
+      case "tsx":
+      case "html":
+      case "css":
+      case "json":
+      case "xml":
+      case "py":
+      case "java":
+      case "cpp":
+      case "c":
+        return /* @__PURE__ */ jsxs("svg", { width: iconSize, height: iconSize, viewBox: "0 0 24 24", fill: "none", children: [
+          /* @__PURE__ */ jsx("polyline", { points: "16 18 22 12 16 6", stroke: iconConfig.color, strokeWidth: "2", fill: "none" }),
+          /* @__PURE__ */ jsx("polyline", { points: "8 6 2 12 8 18", stroke: iconConfig.color, strokeWidth: "2", fill: "none" })
+        ] });
+      default:
+        return /* @__PURE__ */ jsxs("svg", { width: iconSize, height: iconSize, viewBox: "0 0 24 24", fill: "none", children: [
+          /* @__PURE__ */ jsx("path", { d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z", stroke: iconConfig.color, strokeWidth: "2", fill: "none" }),
+          /* @__PURE__ */ jsx("polyline", { points: "14,2 14,8 20,8", stroke: iconConfig.color, strokeWidth: "2", fill: "none" })
+        ] });
+    }
+  };
+  const containerStyle = {
+    position: "relative",
+    display: "inline-flex",
+    alignItems: "center",
+    justifyContent: "center",
+    ...sx
+  };
+  const iconBoxStyle = {
+    position: "relative",
+    width: size,
+    height: size,
+    backgroundColor: iconConfig.bgColor,
+    borderRadius: "8px",
+    border: "1px solid rgba(0, 0, 0, 0.12)",
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center",
+    transition: "all 0.2s ease-in-out",
+    cursor: "default"
+  };
+  const labelStyle = {
+    position: "absolute",
+    bottom: "-4px",
+    right: "-4px",
+    padding: "2px 4px",
+    backgroundColor: "#ffffff",
+    border: "1px solid rgba(0, 0, 0, 0.12)",
+    borderRadius: "4px",
+    boxShadow: "0px 2px 4px rgba(0, 0, 0, 0.1)",
+    fontSize: "10px",
+    fontWeight: 600,
+    color: iconConfig.color,
+    lineHeight: 1,
+    fontFamily: '"Roboto", "Helvetica", "Arial", sans-serif'
+  };
+  return /* @__PURE__ */ jsx("div", { style: containerStyle, children: /* @__PURE__ */ jsxs(
+    "div",
+    {
+      style: iconBoxStyle,
+      onMouseEnter: (e) => {
+        e.currentTarget.style.boxShadow = "0px 4px 8px rgba(0, 0, 0, 0.12)";
+        e.currentTarget.style.transform = "translateY(-1px)";
+      },
+      onMouseLeave: (e) => {
+        e.currentTarget.style.boxShadow = "none";
+        e.currentTarget.style.transform = "translateY(0)";
+      },
+      children: [
+        getSVGIcon(extension),
+        /* @__PURE__ */ jsx("div", { style: labelStyle, children: iconConfig.label })
+      ]
+    }
+  ) });
+};
+var FileIcon_default = FileIcon;
+
+export {
+  getFileExtension,
+  getMimeTypeFromExtension,
+  FileIcon_default
+};
+//# sourceMappingURL=chunk-QQDQJ7TS.mjs.map

package/dist/chunk-QQDQJ7TS.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/utils/fileUtils.ts","../src/components/FileIcon.tsx"],"sourcesContent":["export const getFileExtension = (fileName: string): string => {\r\n  const extension = fileName.toLowerCase().split('.').pop();\r\n  return extension || '';\r\n};\r\n\r\nexport const getMimeTypeFromExtension = (extension: string): string => {\r\n  const mimeTypes: Record<string, string> = {\r\n    'pdf': 'application/pdf',\r\n    'txt': 'text/plain',\r\n    'json': 'application/json',\r\n    'xml': 'text/xml',\r\n    'csv': 'text/csv',\r\n    'jpg': 'image/jpeg',\r\n    'jpeg': 'image/jpeg',\r\n    'png': 'image/png',\r\n    'gif': 'image/gif',\r\n    'svg': 'image/svg+xml',\r\n    'mp4': 'video/mp4',\r\n    'webm': 'video/webm',\r\n    'mp3': 'audio/mpeg',\r\n    'wav': 'audio/wav',\r\n    'doc': 'application/msword',\r\n    'docx': 'application/vnd.openxmlformats-officedocument.wordprocessingml.document',\r\n    'xls': 'application/vnd.ms-excel',\r\n    'xlsx': 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'\r\n  };\r\n\r\n  return mimeTypes[extension] || 'application/octet-stream';\r\n};","import React from 'react';\r\n\r\ninterface FileIconProps {\r\n  ext?: string;\r\n  size?: number;\r\n  sx?: React.CSSProperties;\r\n}\r\n\r\nconst FileIcon: React.FC<FileIconProps> = ({ ext, size = 48, sx = {} }) => {\r\n  const extension = (ext?.toLowerCase().replace(/^\\./, '')) || '';\r\n\r\n  const getIconConfig = (extension: string) => {\r\n    switch (extension) {\r\n      case 'pdf':\r\n        return { color: '#d32f2f', bgColor: '#ffebee', label: 'PDF' };\r\n      case 'doc':\r\n      case 'docx':\r\n        return { color: '#1976d2', bgColor: '#e3f2fd', label: extension.toUpperCase() };\r\n      case 'xls':\r\n      case 'xlsx':\r\n        return { color: '#388e3c', bgColor: '#e8f5e8', label: extension.toUpperCase() };\r\n      case 'ppt':\r\n      case 'pptx':\r\n        return { color: '#f57c00', bgColor: '#fff3e0', label: extension.toUpperCase() };\r\n      case 'jpg':\r\n      case 'jpeg':\r\n      case 'png':\r\n      case 'gif':\r\n      case 'svg':\r\n      case 'webp':\r\n      case 'bmp':\r\n      case 'tiff':\r\n      case 'tif':\r\n        return { color: '#7b1fa2', bgColor: '#f3e5f5', label: extension.toUpperCase() };\r\n      case 'mp4':\r\n      case 'avi':\r\n      case 'mov':\r\n      case 'wmv':\r\n      case 'webm':\r\n      case 'mkv':\r\n        return { color: '#c2185b', bgColor: '#fce4ec', label: extension.toUpperCase() };\r\n      case 'mp3':\r\n      case 'wav':\r\n      case 'flac':\r\n      case 'aac':\r\n      case 'ogg':\r\n      case 'm4a':\r\n        return { color: '#303f9f', bgColor: '#e8eaf6', label: extension.toUpperCase() };\r\n      case 'zip':\r\n      case 'rar':\r\n      case '7z':\r\n      case 'tar':\r\n      case 'gz':\r\n        return { color: '#f9a825', bgColor: '#fffde7', label: extension.toUpperCase() };\r\n      case 'txt':\r\n      case 'md':\r\n      case 'csv':\r\n        return { color: '#424242', bgColor: '#f5f5f5', label: extension.toUpperCase() };\r\n      case 'js':\r\n      case 'jsx':\r\n      case 'ts':\r\n      case 'tsx':\r\n      case 'html':\r\n      case 'css':\r\n      case 'json':\r\n      case 'xml':\r\n      case 'py':\r\n      case 'java':\r\n      case 'cpp':\r\n      case 'c':\r\n        return { color: '#424242', bgColor: '#f5f5f5', label: extension.toUpperCase() };\r\n      default:\r\n        return { color: '#757575', bgColor: '#fafafa', label: extension ? extension.toUpperCase() : 'FILE' };\r\n    }\r\n  };\r\n\r\n  const iconConfig = getIconConfig(extension);\r\n\r\n  const getSVGIcon = (ext: string) => {\r\n    const iconSize = size * 0.6;\r\n    \r\n    switch (ext) {\r\n      case 'pdf':\r\n      case 'doc':\r\n      case 'docx':\r\n      case 'ppt':\r\n      case 'pptx':\r\n        return (\r\n          <svg width={iconSize} height={iconSize} viewBox=\"0 0 24 24\" fill=\"none\">\r\n            <path d=\"M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z\" stroke={iconConfig.color} strokeWidth=\"2\" fill=\"none\"/>\r\n            <polyline points=\"14,2 14,8 20,8\" stroke={iconConfig.color} strokeWidth=\"2\" fill=\"none\"/>\r\n            <line x1=\"16\" y1=\"13\" x2=\"8\" y2=\"13\" stroke={iconConfig.color} strokeWidth=\"2\"/>\r\n            <line x1=\"16\" y1=\"17\" x2=\"8\" y2=\"17\" stroke={iconConfig.color} strokeWidth=\"2\"/>\r\n            <polyline points=\"10,9 9,9 8,9\" stroke={iconConfig.color} strokeWidth=\"2\"/>\r\n          </svg>\r\n        );\r\n      case 'xls':\r\n      case 'xlsx':\r\n        return (\r\n          <svg width={iconSize} height={iconSize} viewBox=\"0 0 24 24\" fill=\"none\">\r\n            <path d=\"M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z\" stroke={iconConfig.color} strokeWidth=\"2\" fill=\"none\"/>\r\n            <polyline points=\"14,2 14,8 20,8\" stroke={iconConfig.color} strokeWidth=\"2\" fill=\"none\"/>\r\n            <line x1=\"8\" y1=\"13\" x2=\"16\" y2=\"13\" stroke={iconConfig.color} strokeWidth=\"2\"/>\r\n            <line x1=\"8\" y1=\"17\" x2=\"16\" y2=\"17\" stroke={iconConfig.color} strokeWidth=\"2\"/>\r\n            <line x1=\"12\" y1=\"9\" x2=\"12\" y2=\"21\" stroke={iconConfig.color} strokeWidth=\"2\"/>\r\n          </svg>\r\n        );\r\n      case 'jpg':\r\n      case 'jpeg':\r\n      case 'png':\r\n      case 'gif':\r\n      case 'svg':\r\n      case 'webp':\r\n      case 'bmp':\r\n      case 'tiff':\r\n      case 'tif':\r\n        return (\r\n          <svg width={iconSize} height={iconSize} viewBox=\"0 0 24 24\" fill=\"none\">\r\n            <rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"2\" ry=\"2\" stroke={iconConfig.color} strokeWidth=\"2\" fill=\"none\"/>\r\n            <circle cx=\"8.5\" cy=\"8.5\" r=\"1.5\" stroke={iconConfig.color} strokeWidth=\"2\" fill=\"none\"/>\r\n            <polyline points=\"21,15 16,10 5,21\" stroke={iconConfig.color} strokeWidth=\"2\" fill=\"none\"/>\r\n          </svg>\r\n        );\r\n      case 'mp4':\r\n      case 'avi':\r\n      case 'mov':\r\n      case 'wmv':\r\n      case 'webm':\r\n      case 'mkv':\r\n        return (\r\n          <svg width={iconSize} height={iconSize} viewBox=\"0 0 24 24\" fill=\"none\">\r\n            <polygon points=\"23 12 8 2 8 22 23 12\" stroke={iconConfig.color} strokeWidth=\"2\" fill=\"none\"/>\r\n            <rect x=\"1\" y=\"5\" width=\"6\" height=\"14\" rx=\"1\" stroke={iconConfig.color} strokeWidth=\"2\" fill=\"none\"/>\r\n          </svg>\r\n        );\r\n      case 'mp3':\r\n      case 'wav':\r\n      case 'flac':\r\n      case 'aac':\r\n      case 'ogg':\r\n      case 'm4a':\r\n        return (\r\n          <svg width={iconSize} height={iconSize} viewBox=\"0 0 24 24\" fill=\"none\">\r\n            <path d=\"M9 18V5l12-2v13\" stroke={iconConfig.color} strokeWidth=\"2\" fill=\"none\"/>\r\n            <circle cx=\"6\" cy=\"18\" r=\"3\" stroke={iconConfig.color} strokeWidth=\"2\" fill=\"none\"/>\r\n            <circle cx=\"18\" cy=\"16\" r=\"3\" stroke={iconConfig.color} strokeWidth=\"2\" fill=\"none\"/>\r\n          </svg>\r\n        );\r\n      case 'zip':\r\n      case 'rar':\r\n      case '7z':\r\n      case 'tar':\r\n      case 'gz':\r\n        return (\r\n          <svg width={iconSize} height={iconSize} viewBox=\"0 0 24 24\" fill=\"none\">\r\n            <rect x=\"3\" y=\"11\" width=\"18\" height=\"10\" rx=\"2\" ry=\"2\" stroke={iconConfig.color} strokeWidth=\"2\" fill=\"none\"/>\r\n            <circle cx=\"12\" cy=\"16\" r=\"1\" stroke={iconConfig.color} strokeWidth=\"2\" fill=\"none\"/>\r\n            <path d=\"M7 11V7a5 5 0 0 1 10 0v4\" stroke={iconConfig.color} strokeWidth=\"2\" fill=\"none\"/>\r\n          </svg>\r\n        );\r\n      case 'txt':\r\n      case 'md':\r\n      case 'csv':\r\n        return (\r\n          <svg width={iconSize} height={iconSize} viewBox=\"0 0 24 24\" fill=\"none\">\r\n            <path d=\"M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z\" stroke={iconConfig.color} strokeWidth=\"2\" fill=\"none\"/>\r\n            <polyline points=\"14,2 14,8 20,8\" stroke={iconConfig.color} strokeWidth=\"2\" fill=\"none\"/>\r\n            <line x1=\"16\" y1=\"13\" x2=\"8\" y2=\"13\" stroke={iconConfig.color} strokeWidth=\"2\"/>\r\n            <line x1=\"16\" y1=\"17\" x2=\"8\" y2=\"17\" stroke={iconConfig.color} strokeWidth=\"2\"/>\r\n          </svg>\r\n        );\r\n      case 'js':\r\n      case 'jsx':\r\n      case 'ts':\r\n      case 'tsx':\r\n      case 'html':\r\n      case 'css':\r\n      case 'json':\r\n      case 'xml':\r\n      case 'py':\r\n      case 'java':\r\n      case 'cpp':\r\n      case 'c':\r\n        return (\r\n          <svg width={iconSize} height={iconSize} viewBox=\"0 0 24 24\" fill=\"none\">\r\n            <polyline points=\"16 18 22 12 16 6\" stroke={iconConfig.color} strokeWidth=\"2\" fill=\"none\"/>\r\n            <polyline points=\"8 6 2 12 8 18\" stroke={iconConfig.color} strokeWidth=\"2\" fill=\"none\"/>\r\n          </svg>\r\n        );\r\n      default:\r\n        return (\r\n          <svg width={iconSize} height={iconSize} viewBox=\"0 0 24 24\" fill=\"none\">\r\n            <path d=\"M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z\" stroke={iconConfig.color} strokeWidth=\"2\" fill=\"none\"/>\r\n            <polyline points=\"14,2 14,8 20,8\" stroke={iconConfig.color} strokeWidth=\"2\" fill=\"none\"/>\r\n          </svg>\r\n        );\r\n    }\r\n  };\r\n\r\n  const containerStyle: React.CSSProperties = {\r\n    position: 'relative',\r\n    display: 'inline-flex',\r\n    alignItems: 'center',\r\n    justifyContent: 'center',\r\n    ...sx\r\n  };\r\n\r\n  const iconBoxStyle: React.CSSProperties = {\r\n    position: 'relative',\r\n    width: size,\r\n    height: size,\r\n    backgroundColor: iconConfig.bgColor,\r\n    borderRadius: '8px',\r\n    border: '1px solid rgba(0, 0, 0, 0.12)',\r\n    display: 'flex',\r\n    alignItems: 'center',\r\n    justifyContent: 'center',\r\n    transition: 'all 0.2s ease-in-out',\r\n    cursor: 'default'\r\n  };\r\n\r\n  const labelStyle: React.CSSProperties = {\r\n    position: 'absolute',\r\n    bottom: '-4px',\r\n    right: '-4px',\r\n    padding: '2px 4px',\r\n    backgroundColor: '#ffffff',\r\n    border: '1px solid rgba(0, 0, 0, 0.12)',\r\n    borderRadius: '4px',\r\n    boxShadow: '0px 2px 4px rgba(0, 0, 0, 0.1)',\r\n    fontSize: '10px',\r\n    fontWeight: 600,\r\n    color: iconConfig.color,\r\n    lineHeight: 1,\r\n    fontFamily: '\"Roboto\", \"Helvetica\", \"Arial\", sans-serif'\r\n  };\r\n\r\n  return (\r\n    <div style={containerStyle}>\r\n      <div \r\n        style={iconBoxStyle}\r\n        onMouseEnter={(e) => {\r\n          e.currentTarget.style.boxShadow = '0px 4px 8px rgba(0, 0, 0, 0.12)';\r\n          e.currentTarget.style.transform = 'translateY(-1px)';\r\n        }}\r\n        onMouseLeave={(e) => {\r\n          e.currentTarget.style.boxShadow = 'none';\r\n          e.currentTarget.style.transform = 'translateY(0)';\r\n        }}\r\n      >\r\n        {getSVGIcon(extension)}\r\n        <div style={labelStyle}>\r\n          {iconConfig.label}\r\n        </div>\r\n      </div>\r\n    </div>\r\n  );\r\n};\r\n\r\nexport default FileIcon;\r\n"],"mappings":"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","names":["extension","ext"]}

package/dist/chunk-QRYIHDRT.mjs

@@ -0,0 +1,196 @@
+"use client";
+import {
+  FileIcon_default,
+  getFileExtension
+} from "./chunk-QQDQJ7TS.mjs";
+
+// src/components/viewers/VideoViewer.tsx
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { Box, Card, CardContent, CardHeader, LinearProgress, Typography, IconButton, Tooltip } from "@mui/material";
+import DownloadIcon from "@mui/icons-material/Download";
+import { jsx, jsxs } from "react/jsx-runtime";
+var VideoViewer = ({
+  file,
+  url,
+  fileName,
+  className = "",
+  style = {},
+  width = "100%",
+  height = "100%",
+  onLoad,
+  onError,
+  onDownloadClick,
+  // Filter out props that shouldn't be passed to DOM
+  mimeType: _mimeType,
+  fileSize: _fileSize,
+  showPageCount: _showPageCount,
+  showPageNavigation: _showPageNavigation,
+  showZoomControls: _showZoomControls,
+  showDownload: _showDownload,
+  showPrint: _showPrint,
+  showSearch: _showSearch,
+  showMetadata: _showMetadata,
+  showProperties: _showProperties,
+  onMetadataClick: _onMetadataClick,
+  onPropertiesClick: _onPropertiesClick,
+  onPrintClick: _onPrintClick,
+  customRegistry: _customRegistry,
+  ...props
+}) => {
+  const videoRef = useRef(null);
+  const [videoSource, setVideoSource] = useState(null);
+  const [isLoading, setIsLoading] = useState(false);
+  const [error, setError] = useState(null);
+  const [videoDimensions, setVideoDimensions] = useState(null);
+  useEffect(() => {
+    let objectUrl = null;
+    if (file) {
+      objectUrl = URL.createObjectURL(file);
+      setVideoSource(objectUrl);
+      setIsLoading(true);
+    } else if (url) {
+      setVideoSource(url);
+    } else {
+      setVideoSource(null);
+    }
+    setError(null);
+    return () => {
+      if (objectUrl) {
+        URL.revokeObjectURL(objectUrl);
+      }
+    };
+  }, [file, url]);
+  useEffect(() => {
+    const element = videoRef.current;
+    if (!element) {
+      return;
+    }
+    const handleLoaded = () => {
+      setIsLoading(false);
+      setVideoDimensions({
+        width: element.videoWidth,
+        height: element.videoHeight
+      });
+      onLoad?.();
+    };
+    const handleError = () => {
+      const message = "Failed to load video resource";
+      setIsLoading(false);
+      setError(message);
+      onError?.(new Error(message));
+    };
+    element.addEventListener("loadedmetadata", handleLoaded);
+    element.addEventListener("error", handleError);
+    return () => {
+      element.removeEventListener("loadedmetadata", handleLoaded);
+      element.removeEventListener("error", handleError);
+    };
+  }, [onLoad, onError, videoSource]);
+  const resolvedFileName = useMemo(
+    () => fileName || file?.name || (url ? url.split("/").pop() : "video"),
+    [fileName, file, url]
+  );
+  const fileExtension = useMemo(
+    () => getFileExtension(resolvedFileName || ""),
+    [resolvedFileName]
+  );
+  const handleDownload = useCallback(async () => {
+    if (!file && !url) return;
+    try {
+      let blob;
+      let filename = resolvedFileName || "video.mp4";
+      if (file) {
+        blob = file;
+        filename = file.name;
+      } else if (url) {
+        const response = await fetch(url);
+        if (!response.ok) {
+          throw new Error(`Failed to fetch video (${response.status})`);
+        }
+        blob = await response.blob();
+      } else {
+        return;
+      }
+      const downloadUrl = URL.createObjectURL(blob);
+      const link = document.createElement("a");
+      link.href = downloadUrl;
+      link.download = filename;
+      document.body.appendChild(link);
+      link.click();
+      document.body.removeChild(link);
+      URL.revokeObjectURL(downloadUrl);
+    } catch (err) {
+      onError?.(err instanceof Error ? err : new Error("Download failed"));
+    }
+  }, [file, url, resolvedFileName, onError]);
+  return /* @__PURE__ */ jsx(
+    Box,
+    {
+      className: `video-viewer ${className}`,
+      sx: { width, height, ...style },
+      ...props,
+      children: /* @__PURE__ */ jsxs(Card, { sx: { height: "100%", display: "flex", flexDirection: "column" }, elevation: 1, children: [
+        /* @__PURE__ */ jsx(
+          CardHeader,
+          {
+            avatar: /* @__PURE__ */ jsx(FileIcon_default, { ext: fileExtension, size: 32 }),
+            title: /* @__PURE__ */ jsx(Typography, { variant: "subtitle1", fontWeight: 500, children: resolvedFileName }),
+            action: /* @__PURE__ */ jsx(Tooltip, { title: "Download", children: /* @__PURE__ */ jsx(
+              IconButton,
+              {
+                size: "small",
+                onClick: onDownloadClick,
+                children: /* @__PURE__ */ jsx(DownloadIcon, {})
+              }
+            ) }),
+            sx: { pb: 1.5 }
+          }
+        ),
+        isLoading && /* @__PURE__ */ jsx(LinearProgress, { sx: { mx: 3, mb: 2 } }),
+        error && /* @__PURE__ */ jsx(Typography, { color: "error", variant: "body2", sx: { px: 3, pb: 1 }, children: error }),
+        /* @__PURE__ */ jsx(CardContent, { sx: {
+          flexGrow: 1,
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+          p: 2,
+          overflow: "hidden"
+        }, children: videoSource ? /* @__PURE__ */ jsx(
+          Box,
+          {
+            sx: {
+              width: "100%",
+              height: "100%",
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "center",
+              backgroundColor: "#000",
+              borderRadius: 2
+            },
+            children: /* @__PURE__ */ jsx(
+              "video",
+              {
+                ref: videoRef,
+                controls: true,
+                controlsList: "nodownload",
+                style: {
+                  maxWidth: "100%",
+                  maxHeight: "100%",
+                  width: "auto",
+                  height: "auto",
+                  objectFit: "contain"
+                },
+                src: videoSource
+              }
+            )
+          }
+        ) : /* @__PURE__ */ jsx(Typography, { variant: "body2", color: "text.secondary", children: "No video source provided." }) })
+      ] })
+    }
+  );
+};
+
+export {
+  VideoViewer
+};
+//# sourceMappingURL=chunk-QRYIHDRT.mjs.map

package/dist/chunk-QRYIHDRT.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/viewers/VideoViewer.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';\r\nimport { Box, Card, CardContent, CardHeader, LinearProgress, Typography, Stack, IconButton, Tooltip } from '@mui/material';\r\nimport DownloadIcon from '@mui/icons-material/Download';\r\nimport { FileViewerProps } from '../../types';\r\nimport { getFileExtension } from '../../utils/fileUtils';\r\nimport FileIcon from '../FileIcon';\r\n\r\nexport const VideoViewer: React.FC<FileViewerProps> = ({\r\n  file,\r\n  url,\r\n  fileName,\r\n  className = '',\r\n  style = {},\r\n  width = '100%',\r\n  height = '100%',\r\n  onLoad,\r\n  onError,\r\n  onDownloadClick,\r\n  // Filter out props that shouldn't be passed to DOM\r\n  mimeType: _mimeType,\r\n  fileSize: _fileSize,\r\n  showPageCount: _showPageCount,\r\n  showPageNavigation: _showPageNavigation,\r\n  showZoomControls: _showZoomControls,\r\n  showDownload: _showDownload,\r\n  showPrint: _showPrint,\r\n  showSearch: _showSearch,\r\n  showMetadata: _showMetadata,\r\n  showProperties: _showProperties,\r\n  onMetadataClick: _onMetadataClick,\r\n  onPropertiesClick: _onPropertiesClick,\r\n  onPrintClick: _onPrintClick,\r\n  customRegistry: _customRegistry,\r\n  ...props\r\n}) => {\r\n  const videoRef = useRef<HTMLVideoElement | null>(null);\r\n  const [videoSource, setVideoSource] = useState<string | null>(null);\r\n  const [isLoading, setIsLoading] = useState(false);\r\n  const [error, setError] = useState<string | null>(null);\r\n  const [videoDimensions, setVideoDimensions] = useState<{ width: number; height: number } | null>(null);\r\n\r\n  useEffect(() => {\r\n    let objectUrl: string | null = null;\r\n\r\n    if (file) {\r\n      objectUrl = URL.createObjectURL(file);\r\n      setVideoSource(objectUrl);\r\n      setIsLoading(true);\r\n    } else if (url) {\r\n      setVideoSource(url);\r\n    } else {\r\n      setVideoSource(null);\r\n    }\r\n\r\n    setError(null);\r\n\r\n    return () => {\r\n      if (objectUrl) {\r\n        URL.revokeObjectURL(objectUrl);\r\n      }\r\n    };\r\n  }, [file, url]);\r\n\r\n  useEffect(() => {\r\n    const element = videoRef.current;\r\n    if (!element) {\r\n      return;\r\n    }\r\n\r\n    const handleLoaded = () => {\r\n      setIsLoading(false);\r\n      // Capture video dimensions\r\n      setVideoDimensions({\r\n        width: element.videoWidth,\r\n        height: element.videoHeight\r\n      });\r\n      onLoad?.();\r\n    };\r\n\r\n    const handleError = () => {\r\n      const message = 'Failed to load video resource';\r\n      setIsLoading(false);\r\n      setError(message);\r\n      onError?.(new Error(message));\r\n    };\r\n\r\n    element.addEventListener('loadedmetadata', handleLoaded);\r\n    element.addEventListener('error', handleError);\r\n\r\n    return () => {\r\n      element.removeEventListener('loadedmetadata', handleLoaded);\r\n      element.removeEventListener('error', handleError);\r\n    };\r\n  }, [onLoad, onError, videoSource]);\r\n\r\n  const resolvedFileName = useMemo(\r\n    () => fileName || file?.name || (url ? url.split('/').pop() : 'video'),\r\n    [fileName, file, url]\r\n  );\r\n\r\n  const fileExtension = useMemo(\r\n    () => getFileExtension(resolvedFileName || ''),\r\n    [resolvedFileName]\r\n  );\r\n\r\n  const handleDownload = useCallback(async () => {\r\n    if (!file && !url) return;\r\n    \r\n    try {\r\n      let blob: Blob;\r\n      let filename = resolvedFileName || 'video.mp4';\r\n      \r\n      if (file) {\r\n        blob = file;\r\n        filename = file.name;\r\n      } else if (url) {\r\n        const response = await fetch(url);\r\n        if (!response.ok) {\r\n          throw new Error(`Failed to fetch video (${response.status})`);\r\n        }\r\n        blob = await response.blob();\r\n      } else {\r\n        return;\r\n      }\r\n      \r\n      const downloadUrl = URL.createObjectURL(blob);\r\n      const link = document.createElement('a');\r\n      link.href = downloadUrl;\r\n      link.download = filename;\r\n      document.body.appendChild(link);\r\n      link.click();\r\n      document.body.removeChild(link);\r\n      URL.revokeObjectURL(downloadUrl);\r\n    } catch (err) {\r\n      // Handle download errors silently or show user-friendly message\r\n      onError?.(err instanceof Error ? err : new Error('Download failed'));\r\n    }\r\n  }, [file, url, resolvedFileName, onError]);\r\n\r\n  return (\r\n    <Box\r\n      className={`video-viewer ${className}`}\r\n      sx={{ width, height, ...style }}\r\n      {...props}\r\n    >\r\n      <Card sx={{ height: '100%', display: 'flex', flexDirection: 'column' }} elevation={1}>\r\n        <CardHeader\r\n          avatar={<FileIcon ext={fileExtension} size={32} />}\r\n          title={\r\n            <Typography variant=\"subtitle1\" fontWeight={500}>\r\n              {resolvedFileName}\r\n            </Typography>\r\n          }\r\n          action={\r\n            <Tooltip title=\"Download\">\r\n              <IconButton\r\n                size=\"small\"\r\n                onClick={onDownloadClick}\r\n              >\r\n                <DownloadIcon />\r\n              </IconButton>\r\n            </Tooltip>\r\n          }\r\n          sx={{ pb: 1.5 }}\r\n        />\r\n        {isLoading && <LinearProgress sx={{ mx: 3, mb: 2 }} />}\r\n        {error && (\r\n          <Typography color=\"error\" variant=\"body2\" sx={{ px: 3, pb: 1 }}>\r\n            {error}\r\n          </Typography>\r\n        )}\r\n        <CardContent sx={{ \r\n          flexGrow: 1, \r\n          display: 'flex', \r\n          alignItems: 'center', \r\n          justifyContent: 'center', \r\n          p: 2,\r\n          overflow: 'hidden'\r\n        }}>\r\n          {videoSource ? (\r\n            <Box\r\n              sx={{\r\n                width: '100%',\r\n                height: '100%',\r\n                display: 'flex',\r\n                alignItems: 'center',\r\n                justifyContent: 'center',\r\n                backgroundColor: '#000',\r\n                borderRadius: 2\r\n              }}\r\n            >\r\n              <video\r\n                ref={videoRef}\r\n                controls\r\n                controlsList=\"nodownload\"\r\n                style={{\r\n                  maxWidth: '100%',\r\n                  maxHeight: '100%',\r\n                  width: 'auto',\r\n                  height: 'auto',\r\n                  objectFit: 'contain'\r\n                }}\r\n                src={videoSource}\r\n              />\r\n            </Box>\r\n          ) : (\r\n            <Typography variant=\"body2\" color=\"text.secondary\">\r\n              No video source provided.\r\n            </Typography>\r\n          )}\r\n        </CardContent>\r\n      </Card>\r\n    </Box>\r\n  );\r\n};"],"mappings":"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","names":[]}