@solidxai/core-ui 0.1.13-beta.2 → 0.1.13-beta.4

package/dist/components/core/list/columns/SolidMediaMultipleColumn.tsx

@@ -1,49 +1,32 @@
 
 import React, { useState } from 'react';
-import { Download, Volume2 } from "lucide-react";
+import { Volume2 } from "lucide-react";
 import { Column } from "../SolidDataTable";
 import { SolidListViewColumnParams } from '../SolidListViewColumn';
 import { SolidMediaListFieldWidgetProps } from '../../../../types/solid-core';
 import { getExtensionComponent } from '../../../../helpers/registry';
 import { FileReaderExt } from '../../../../components/common/FileReaderExt';
-import { SolidButton, SolidDialog } from "../../../shad-cn-ui";
+import { SolidDialog, SolidDialogBody, SolidDialogClose, SolidDialogHeader, SolidDialogTitle, SolidIcon } from "../../../shad-cn-ui";
 import { SolidFileTypeIcon } from '../../../../helpers/fileTypeIcon';
-
-const getCleanUrl = (url: string) => url.split("?")[0];
-
-const isImageFile = (url: string) => /\.(jpg|jpeg|png|gif|bmp|webp)$/i.test(getCleanUrl(url));
-
-const isVideoFile = (url: string) => /\.(mp4|webm|ogg)$/i.test(getCleanUrl(url));
-
-const isAudioFile = (url: string) => /\.(mp3|wav|ogg)$/i.test(getCleanUrl(url));
-
-const isDocumentType = (url: string) => {
-    const ext = getCleanUrl(url).split(".").pop()?.toLowerCase();
-    return ext ? downloadOnlyExt.includes(ext) : false;
-};
-
-const downloadOnlyExt = [
-    "txt", "zip", "rar",
-    "doc", "docx",
-    "xls", "xlsx",
-    "ppt", "pptx",
-    "pdf", "csv"
-];
-
-const downloadFile = (url: string, name: string = "") => {
-    const link = document.createElement("a");
-    link.href = url;
-    link.download = name;
-    link.target = "_blank";
-    document.body.appendChild(link);
-    link.click();
-    document.body.removeChild(link);
-};
+import { getMediaPreviewKind, isLightboxMediaKind, type MediaPreviewKind } from '../../../../helpers/mediaType';
+import { openMediaInNewTab } from '../../../../helpers/mediaUrl';
+import { downloadMediaFile } from '../../../../helpers/downloadMediaFile';
+import styles from "../../form/fields/solidFields.module.css";
 
 
 
 // Thumbnail preview component
-const MediaPreview = ({ src, onClick }: { src: string; onClick: (event: React.MouseEvent) => void }) => {
+const MediaPreview = ({
+    src,
+    fileName,
+    previewKind,
+    onClick
+}: {
+    src: string;
+    fileName?: string;
+    previewKind: MediaPreviewKind;
+    onClick: (event: React.MouseEvent) => void
+}) => {
     const [isBroken, setIsBroken] = useState(false);
 
     const handleClick = (event: React.MouseEvent) => {
@@ -51,7 +34,7 @@ const MediaPreview = ({ src, onClick }: { src: string; onClick: (event: React.Mo
     };
 
     if (!isBroken) {
-        if (isImageFile(src)) {
+        if (previewKind === "image") {
             return (
                 <img
                     src={src}
@@ -66,7 +49,7 @@ const MediaPreview = ({ src, onClick }: { src: string; onClick: (event: React.Mo
             );
         }
 
-        if (isVideoFile(src)) {
+        if (previewKind === "video") {
             return (
                 <video
                     src={src}
@@ -81,7 +64,7 @@ const MediaPreview = ({ src, onClick }: { src: string; onClick: (event: React.Mo
             );
         }
 
-        if (isAudioFile(src)) {
+        if (previewKind === "audio") {
             return (
                 <div
                     className="flex items-center justify-center rounded bg-gray-100 shadow-md"
@@ -99,7 +82,7 @@ const MediaPreview = ({ src, onClick }: { src: string; onClick: (event: React.Mo
             style={{ width: 40, height: 40, display: "flex", alignItems: "center", justifyContent: "center" }}
             onClick={handleClick}
         >
-            <SolidFileTypeIcon fileUrl={src} size={24} />
+            <SolidFileTypeIcon fileUrl={src} fileName={fileName} size={24} />
         </div>
     );
 };
@@ -155,7 +138,12 @@ export const DefaultMediaMultipleListWidget = ({ rowData, fieldMetadata, setLigh
         type: file.mimeType,
         size: file.fileSize,
         id: file.id,
-        fileUrl: file._full_url
+        fileUrl: file?._full_url,
+        previewKind: getMediaPreviewKind({
+            url: file?._full_url,
+            fileName: file?.originalFileName,
+            mimeType: file?.mimeType,
+        })
     }));
 
 
@@ -164,49 +152,67 @@ export const DefaultMediaMultipleListWidget = ({ rowData, fieldMetadata, setLigh
 
 
     const handleFileView = (file: any) => {
-        const fileUrl = file?.fileUrl || "";
-        // const cleanUrl = fileUrl.split("?")[0];
-        // const ext = cleanUrl.split(".").pop()?.toLowerCase();
-
-        if (isDocumentType(fileUrl)) {
-            downloadFile(file?.fileUrl, "")
-
-        } else {
-            setLightboxUrls?.([{ src: file.fileUrl, downloadUrl: file.fileUrl }]);
+        if (isLightboxMediaKind(file?.previewKind)) {
+            setLightboxUrls?.([{
+                src: file.fileUrl,
+                downloadUrl: file.fileUrl,
+                type: file.previewKind === "video" ? "video" : undefined
+            }]);
             setOpenLightbox?.(true);
+            return;
         }
+
+        openMediaInNewTab(file?.fileUrl);
     };
 
+    const renderMediaFileCard = (file: any, className = "") => (
+        <div className={`${styles.mediaAttachmentCard} ${className}`.trim()}>
+            <div className={`${styles.mediaAttachmentRow} flex items-center md:gap-2`}>
+                <FileReaderExt fileDetails={file} />
+                <div className={`${styles.mediaAttachmentMeta} w-full`}>
+                    <div className="flex items-start justify-between gap-4">
+                        <button
+                            type="button"
+                            className={styles.mediaAttachmentName}
+                            onClick={() => handleFileView(file)}
+                            title={file.name}
+                        >
+                            {file.name}
+                        </button>
+                        <div className={`${styles.mediaAttachmentActions} flex items-center md:gap-2`}>
+                            <button
+                                type="button"
+                                className="solid-file-icon-btn"
+                                aria-label="Download file"
+                                onClick={(event) => {
+                                    event.preventDefault();
+                                    event.stopPropagation();
+                                    downloadMediaFile(file?.fileUrl, file?.name);
+                                }}
+                            >
+                                <SolidIcon name="si-download" aria-hidden />
+                            </button>
+                        </div>
+                    </div>
+                    <div className={styles.mediaAttachmentSize}>
+                        {formatFileSize(file.size)}
+                    </div>
+                </div>
+            </div>
+        </div>
+    );
 
 
     return fullrecord.length > 0 ? (
         <div className='flex items-end gap-2'>
 
-            {/* THUMBNAIL - FIXED BEHAVIOR */}
             <MediaPreview
                 src={fullrecord[0]?.fileUrl}
+                fileName={fullrecord[0]?.name}
+                previewKind={fullrecord[0]?.previewKind}
                 onClick={(event) => {
                     event.stopPropagation();
-
-                    // const cleanUrl = fullrecord[0]?.fileUrl.split("?")[0];
-                    // const ext = cleanUrl.split(".").pop()?.toLowerCase();
-
-                    if (isDocumentType(fullrecord[0]?.fileUrl) && fullrecord?.length > 1) {
-                        setShowAllFiles(true)
-                        return;
-                    }
-
-                    else if (isDocumentType(fullrecord[0]?.fileUrl)) {
-                        downloadFile(fullrecord[0]?.fileUrl, "")
-                        return;
-                    }
-                    // FIRST FILE IS MEDIA ⇒ OPEN LIGHTBOX
-                    const urlsWithType = fullrecord.map((file: any) => ({
-                        src: file.fileUrl,
-                        downloadUrl: file.fileUrl,
-                    }));
-                    setLightboxUrls(urlsWithType);
-                    setOpenLightbox(true);
+                    handleFileView(fullrecord[0]);
                 }}
             />
 
@@ -219,17 +225,7 @@ export const DefaultMediaMultipleListWidget = ({ rowData, fieldMetadata, setLigh
                 }}
                 onClick={(event) => {
                     event.stopPropagation();
-
-                    if (isDocumentType(fullrecord[0]?.fileUrl)) {
-                        setShowAllFiles(true);
-                    } else {
-                        const urlsWithType = fullrecord.map((file: any) => ({
-                            src: file.fileUrl,
-                            downloadUrl: file.fileUrl
-                        }));
-                        setLightboxUrls(urlsWithType);
-                        setOpenLightbox(true);
-                    }
+                    setShowAllFiles(true);
                 }}
             >
                 +{fullrecord.length - 1}
@@ -242,48 +238,22 @@ export const DefaultMediaMultipleListWidget = ({ rowData, fieldMetadata, setLigh
             <SolidDialog
                 open={isShowAllFiles}
                 onOpenChange={setShowAllFiles}
-                header="Items Uploaded"
-                style={{ width: '32rem', maxWidth: '94vw' }}
+                style={{ minWidth: 450 }}
             >
-                {fullrecord?.map((file: any) => {
-                    const fileId = `${file.name}-${file.size}`;
-                    return (
-                        <div key={fileId} className="solid-file-upload-wrapper mb-3">
-                            <div className="flex items-center gap-2">
-
-                                <FileReaderExt fileDetails={file} />
-
-                                <div className="flex w-full flex-col gap-1">
-                                    <div className="flex items-center justify-between">
-
-                                        <p
-                                            className="m-0 w-11 font-normal text-[var(--primary-color)] solid-media-column-text-wrapper"
-                                            style={{ cursor: "pointer" }}
-                                            onClick={() => handleFileView(file)}
-                                        >
-                                            {file?.name}
-                                        </p>
-
-                                        <SolidButton
-                                            type="button"
-                                            size="small"
-                                            variant="ghost"
-                                            leftIcon={<Download size={14} />}
-                                            onClick={() => {
-                                                downloadFile(file?.fileUrl, "")
-                                            }}
-                                            style={{ height: 16, width: 16 }}
-                                        />
-                                    </div>
-
-                                    <div className="text-sm">{formatFileSize(file.size)}</div>
-                                </div>
-
+                <SolidDialogHeader>
+                    <SolidDialogTitle>Items Uploaded</SolidDialogTitle>
+                    <SolidDialogClose />
+                </SolidDialogHeader>
+                <SolidDialogBody>
+                    {fullrecord?.map((file: any, index: number) => {
+                        const fileId = `${file.name}-${file.size}`;
+                        return (
+                            <div key={fileId} className={index === fullrecord.length - 1 ? "" : "mb-3"}>
+                                {renderMediaFileCard(file)}
                             </div>
-                        </div>
-                    )
-                }
-                )}
+                        )
+                    })}
+                </SolidDialogBody>
             </SolidDialog>
         </div>
     ) : (

package/dist/components/core/list/columns/SolidMediaSingleColumn.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SolidMediaSingleColumn.d.ts","sourceRoot":"","sources":["../../../../../src/components/core/list/columns/SolidMediaSingleColumn.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,yBAAyB,EAAE,MAAM,wBAAwB,CAAC;AACnE,OAAO,EAAE,8BAA8B,EAAE,MAAM,8BAA8B,CAAC;AAmG9E,QAAA,MAAM,sBAAsB,uFAAwF,yBAAyB,4CAkC5I,CAAC;AAEF,eAAe,sBAAsB,CAAC;AAGtC,eAAO,MAAM,4BAA4B,gGAOtC,8BAA8B,mDAqBhC,CAAC"}
+{"version":3,"file":"SolidMediaSingleColumn.d.ts","sourceRoot":"","sources":["../../../../../src/components/core/list/columns/SolidMediaSingleColumn.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,yBAAyB,EAAE,MAAM,wBAAwB,CAAC;AACnE,OAAO,EAAE,8BAA8B,EAAE,MAAM,8BAA8B,CAAC;AAmF9E,QAAA,MAAM,sBAAsB,uFAAwF,yBAAyB,4CAkC5I,CAAC;AAEF,eAAe,sBAAsB,CAAC;AAGtC,eAAO,MAAM,4BAA4B,gGAOtC,8BAA8B,mDA0ChC,CAAC"}

package/dist/components/core/list/columns/SolidMediaSingleColumn.js

@@ -15,55 +15,29 @@ import { Volume2 } from "lucide-react";
 import { Column } from "../SolidDataTable";
 import { getExtensionComponent } from '../../../../helpers/registry';
 import { SolidFileTypeIcon } from '../../../../helpers/fileTypeIcon';
-var getCleanUrl = function (url) { return url.split("?")[0]; };
-// Helpers for file type detection
-var isImageFile = function (url) { return /\.(jpg|jpeg|png|gif|bmp|webp)$/i.test(getCleanUrl(url)); };
-var isVideoFile = function (url) { return /\.(mp4|webm|ogg)$/i.test(getCleanUrl(url)); };
-var isAudioFile = function (url) { return /\.(mp3|wav|ogg)$/i.test(getCleanUrl(url)); };
-// Extensions that should be downloaded directly
-var downloadOnlyExt = [
-    "txt", "zip", "rar",
-    "doc", "docx",
-    "xls", "xlsx",
-    "ppt", "pptx",
-    "pdf"
-];
+import { getMediaPreviewKind, isLightboxMediaKind } from '../../../../helpers/mediaType';
+import { openMediaInNewTab } from '../../../../helpers/mediaUrl';
 // Media component with fallback for broken links
 var MediaWithFallback = function (_a) {
-    var src = _a.src, alt = _a.alt, onClick = _a.onClick;
+    var src = _a.src, alt = _a.alt, fileName = _a.fileName, previewKind = _a.previewKind, onClick = _a.onClick;
     var _b = useState(false), isBroken = _b[0], setIsBroken = _b[1];
     var handleClick = function (event) {
-        var _a;
         event.stopPropagation();
-        var cleanUrl = src.split("?")[0];
-        var ext = (_a = cleanUrl.split(".").pop()) === null || _a === void 0 ? void 0 : _a.toLowerCase();
-        if (ext && downloadOnlyExt.includes(ext)) {
-            // Trigger download for docs/archives
-            var link = document.createElement("a");
-            link.href = src;
-            link.download = "";
-            link.target = "_blank";
-            document.body.appendChild(link);
-            link.click();
-            document.body.removeChild(link);
-        }
-        else {
-            onClick(event);
-        }
+        onClick(event);
     };
     if (!isBroken) {
-        if (isImageFile(src)) {
+        if (previewKind === "image") {
             return (_jsx("img", { src: src, alt: alt, className: "rounded shadow-md", width: 40, height: 40, style: { objectFit: "cover", cursor: "pointer" }, onError: function () { return setIsBroken(true); }, onClick: handleClick }));
         }
-        if (isVideoFile(src)) {
+        if (previewKind === "video") {
             return (_jsx("video", { src: src, width: 40, height: 40, className: "rounded shadow-md", style: { objectFit: "cover", cursor: "pointer" }, onError: function () { return setIsBroken(true); }, onClick: handleClick, muted: true }));
         }
-        if (isAudioFile(src)) {
+        if (previewKind === "audio") {
             return (_jsx("div", { className: "flex items-center justify-center rounded bg-gray-100 shadow-md", style: { width: 40, height: 40, cursor: "pointer" }, onClick: handleClick, children: _jsx(Volume2, { size: 18, className: "text-gray-600" }) }));
         }
     }
     // fallback icon (docs/others)
-    return (_jsx("div", { style: { width: 40, height: 40, display: "flex", alignItems: "center", justifyContent: "center", cursor: "pointer" }, onClick: handleClick, children: _jsx(SolidFileTypeIcon, { fileUrl: src, size: 24 }) }));
+    return (_jsx("div", { style: { width: 40, height: 40, display: "flex", alignItems: "center", justifyContent: "center", cursor: "pointer" }, onClick: handleClick, children: _jsx(SolidFileTypeIcon, { fileUrl: src, fileName: fileName, size: 24 }) }));
 };
 // Main column renderer
 var SolidMediaSingleColumn = function (_a) {
@@ -94,18 +68,36 @@ export var DefaultMediaSingleListWidget = function (_a) {
     var rowData = _a.rowData, solidListViewMetaData = _a.solidListViewMetaData, fieldMetadata = _a.fieldMetadata, column = _a.column, setLightboxUrls = _a.setLightboxUrls, setOpenLightbox = _a.setOpenLightbox;
     if (!((_b = rowData === null || rowData === void 0 ? void 0 : rowData._media) === null || _b === void 0 ? void 0 : _b[fieldMetadata.name]))
         return null;
-    var mediaUrls = rowData._media[fieldMetadata.name].map(function (i) { return i._full_url; });
-    var firstUrl = mediaUrls[0];
-    if (!firstUrl)
+    var mediaFiles = rowData._media[fieldMetadata.name].map(function (file) {
+        var fileUrl = file === null || file === void 0 ? void 0 : file._full_url;
+        var previewKind = getMediaPreviewKind({
+            url: fileUrl,
+            fileName: file === null || file === void 0 ? void 0 : file.originalFileName,
+            mimeType: file === null || file === void 0 ? void 0 : file.mimeType,
+        });
+        return {
+            fileUrl: fileUrl,
+            fileName: file === null || file === void 0 ? void 0 : file.originalFileName,
+            previewKind: previewKind,
+            opensInLightbox: isLightboxMediaKind(previewKind),
+            lightboxType: previewKind === "video" ? "video" : undefined,
+        };
+    });
+    var firstFile = mediaFiles[0];
+    if (!(firstFile === null || firstFile === void 0 ? void 0 : firstFile.fileUrl))
         return _jsx("div", { style: { height: 40, width: 40 } });
-    var cleanUrl = getCleanUrl(firstUrl);
-    return (_jsx(MediaWithFallback, { src: firstUrl, alt: "media", onClick: function (event) {
-            // Only open lightbox for image, video, or audio
+    return (_jsx(MediaWithFallback, { src: firstFile.fileUrl, alt: "media", fileName: firstFile.fileName, previewKind: firstFile.previewKind, onClick: function (event) {
             event.stopPropagation();
-            if (isImageFile(cleanUrl) || isVideoFile(cleanUrl) || isAudioFile(cleanUrl)) {
-                setLightboxUrls([{ src: firstUrl, downloadUrl: firstUrl }]);
+            if (firstFile.opensInLightbox) {
+                setLightboxUrls([{
+                        src: firstFile.fileUrl,
+                        downloadUrl: firstFile.fileUrl,
+                        type: firstFile.lightboxType
+                    }]);
                 setOpenLightbox(true);
+                return;
             }
+            openMediaInNewTab(firstFile.fileUrl);
         } }));
 };
 //# sourceMappingURL=SolidMediaSingleColumn.js.map

package/dist/components/core/list/columns/SolidMediaSingleColumn.js.map

@@ -1 +1 @@
-{"version":3,"file":"SolidMediaSingleColumn.js","sourceRoot":"","sources":["../../../../../src/components/core/list/columns/SolidMediaSingleColumn.tsx"],"names":[],"mappings":"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","sourcesContent":["\nimport React, { useState } from 'react';\nimport { Volume2 } from \"lucide-react\";\nimport { Column } from \"../SolidDataTable\";\nimport { SolidListViewColumnParams } from '../SolidListViewColumn';\nimport { SolidMediaListFieldWidgetProps } from '../../../../types/solid-core';\nimport { getExtensionComponent } from '../../../../helpers/registry';\nimport { SolidFileTypeIcon } from '../../../../helpers/fileTypeIcon';\n\nconst getCleanUrl = (url: string) => url.split(\"?\")[0];\n\n// Helpers for file type detection\nconst isImageFile = (url: string) => /\\.(jpg|jpeg|png|gif|bmp|webp)$/i.test(getCleanUrl(url));\nconst isVideoFile = (url: string) => /\\.(mp4|webm|ogg)$/i.test(getCleanUrl(url));\nconst isAudioFile = (url: string) => /\\.(mp3|wav|ogg)$/i.test(getCleanUrl(url));\n\n// Extensions that should be downloaded directly\nconst downloadOnlyExt = [\n    \"txt\", \"zip\", \"rar\",\n    \"doc\", \"docx\",\n    \"xls\", \"xlsx\",\n    \"ppt\", \"pptx\",\n    \"pdf\"\n];\n\n// Media component with fallback for broken links\nconst MediaWithFallback = ({ src, alt, onClick }: { src: string; alt: string; onClick: (event: React.MouseEvent) => void }) => {\n    const [isBroken, setIsBroken] = useState(false);\n\n    const handleClick = (event: React.MouseEvent) => {\n        event.stopPropagation();\n        const cleanUrl = src.split(\"?\")[0];\n        const ext = cleanUrl.split(\".\").pop()?.toLowerCase();\n\n        if (ext && downloadOnlyExt.includes(ext)) {\n            // Trigger download for docs/archives\n            const link = document.createElement(\"a\");\n            link.href = src;\n            link.download = \"\";\n            link.target = \"_blank\";\n            document.body.appendChild(link);\n            link.click();\n            document.body.removeChild(link);\n        } else {\n            onClick(event);\n        }\n    };\n\n    if (!isBroken) {\n        if (isImageFile(src)) {\n            return (\n                <img\n                    src={src}\n                    alt={alt}\n                    className=\"rounded shadow-md\"\n                    width={40}\n                    height={40}\n                    style={{ objectFit: \"cover\", cursor: \"pointer\" }}\n                    onError={() => setIsBroken(true)}\n                    onClick={handleClick}\n                />\n            );\n        }\n\n        if (isVideoFile(src)) {\n            return (\n                <video\n                    src={src}\n                    width={40}\n                    height={40}\n                    className=\"rounded shadow-md\"\n                    style={{ objectFit: \"cover\", cursor: \"pointer\" }}\n                    onError={() => setIsBroken(true)}\n                    onClick={handleClick}\n                    muted\n                />\n            );\n        }\n\n        if (isAudioFile(src)) {\n            return (\n                <div\n                    className=\"flex items-center justify-center rounded bg-gray-100 shadow-md\"\n                    style={{ width: 40, height: 40, cursor: \"pointer\" }}\n                    onClick={handleClick}\n                >\n                    <Volume2 size={18} className=\"text-gray-600\" />\n                </div>\n            );\n        }\n    }\n\n    // fallback icon (docs/others)\n    return (\n        <div\n            style={{ width: 40, height: 40, display: \"flex\", alignItems: \"center\", justifyContent: \"center\", cursor: \"pointer\" }}\n            onClick={handleClick}\n        >\n            <SolidFileTypeIcon fileUrl={src} size={24} />\n        </div>\n    );\n};\n\n// Main column renderer\nconst SolidMediaSingleColumn = ({ solidListViewMetaData, fieldMetadata, column, setLightboxUrls, setOpenLightbox }: SolidListViewColumnParams) => {\n    const header = column.attrs.label ?? fieldMetadata.displayName;\n\n    return (\n        <Column\n            key={fieldMetadata.name}\n            field={fieldMetadata.name}\n            header={header}\n            body={(rowData) => {\n                let viewWidget = column.attrs.viewWidget;\n                if (!viewWidget) {\n                    viewWidget = 'DefaultMediaSingleListWidget';\n                }\n                let DynamicWidget = getExtensionComponent(viewWidget);\n                const widgetProps: SolidMediaListFieldWidgetProps = {\n                    rowData,\n                    solidListViewMetaData,\n                    fieldMetadata,\n                    column,\n                    setLightboxUrls,\n                    setOpenLightbox\n                }\n                return (\n                    <>\n                        {DynamicWidget && <DynamicWidget {...widgetProps} />}\n                    </>\n                )\n            }}\n            sortable={column.attrs.sortable}\n            showFilterOperator={false}\n            style={{ minWidth: \"12rem\" }}\n            headerClassName=\"table-header-fs\"\n        />\n    );\n};\n\nexport default SolidMediaSingleColumn;\n\n// Default widget for single media field\nexport const DefaultMediaSingleListWidget = ({\n    rowData,\n    solidListViewMetaData,\n    fieldMetadata,\n    column,\n    setLightboxUrls,\n    setOpenLightbox\n}: SolidMediaListFieldWidgetProps) => {\n    if (!rowData?._media?.[fieldMetadata.name]) return null;\n    const mediaUrls = rowData._media[fieldMetadata.name].map((i: any) => i._full_url);\n\n    const firstUrl = mediaUrls[0];\n    if (!firstUrl) return <div style={{ height: 40, width: 40 }} />;\n    const cleanUrl = getCleanUrl(firstUrl);\n    return (\n        <MediaWithFallback\n            src={firstUrl}\n            alt=\"media\"\n            onClick={(event) => {\n                // Only open lightbox for image, video, or audio\n                event.stopPropagation()\n                if (isImageFile(cleanUrl) || isVideoFile(cleanUrl) || isAudioFile(cleanUrl)) {\n                    setLightboxUrls([{ src: firstUrl, downloadUrl: firstUrl }]);\n                    setOpenLightbox(true);\n                }\n            }}\n        />\n    );\n};\n"]}
+{"version":3,"file":"SolidMediaSingleColumn.js","sourceRoot":"","sources":["../../../../../src/components/core/list/columns/SolidMediaSingleColumn.tsx"],"names":[],"mappings":"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","sourcesContent":["\nimport React, { useState } from 'react';\nimport { Volume2 } from \"lucide-react\";\nimport { Column } from \"../SolidDataTable\";\nimport { SolidListViewColumnParams } from '../SolidListViewColumn';\nimport { SolidMediaListFieldWidgetProps } from '../../../../types/solid-core';\nimport { getExtensionComponent } from '../../../../helpers/registry';\nimport { SolidFileTypeIcon } from '../../../../helpers/fileTypeIcon';\nimport { getMediaPreviewKind, isLightboxMediaKind, type MediaPreviewKind } from '../../../../helpers/mediaType';\nimport { openMediaInNewTab } from '../../../../helpers/mediaUrl';\n\n// Media component with fallback for broken links\nconst MediaWithFallback = ({\n    src,\n    alt,\n    fileName,\n    previewKind,\n    onClick\n}: {\n    src: string;\n    alt: string;\n    fileName?: string;\n    previewKind: MediaPreviewKind;\n    onClick: (event: React.MouseEvent) => void\n}) => {\n    const [isBroken, setIsBroken] = useState(false);\n\n    const handleClick = (event: React.MouseEvent) => {\n        event.stopPropagation();\n        onClick(event);\n    };\n\n    if (!isBroken) {\n        if (previewKind === \"image\") {\n            return (\n                <img\n                    src={src}\n                    alt={alt}\n                    className=\"rounded shadow-md\"\n                    width={40}\n                    height={40}\n                    style={{ objectFit: \"cover\", cursor: \"pointer\" }}\n                    onError={() => setIsBroken(true)}\n                    onClick={handleClick}\n                />\n            );\n        }\n\n        if (previewKind === \"video\") {\n            return (\n                <video\n                    src={src}\n                    width={40}\n                    height={40}\n                    className=\"rounded shadow-md\"\n                    style={{ objectFit: \"cover\", cursor: \"pointer\" }}\n                    onError={() => setIsBroken(true)}\n                    onClick={handleClick}\n                    muted\n                />\n            );\n        }\n\n        if (previewKind === \"audio\") {\n            return (\n                <div\n                    className=\"flex items-center justify-center rounded bg-gray-100 shadow-md\"\n                    style={{ width: 40, height: 40, cursor: \"pointer\" }}\n                    onClick={handleClick}\n                >\n                    <Volume2 size={18} className=\"text-gray-600\" />\n                </div>\n            );\n        }\n    }\n\n    // fallback icon (docs/others)\n    return (\n        <div\n            style={{ width: 40, height: 40, display: \"flex\", alignItems: \"center\", justifyContent: \"center\", cursor: \"pointer\" }}\n            onClick={handleClick}\n        >\n            <SolidFileTypeIcon fileUrl={src} fileName={fileName} size={24} />\n        </div>\n    );\n};\n\n// Main column renderer\nconst SolidMediaSingleColumn = ({ solidListViewMetaData, fieldMetadata, column, setLightboxUrls, setOpenLightbox }: SolidListViewColumnParams) => {\n    const header = column.attrs.label ?? fieldMetadata.displayName;\n\n    return (\n        <Column\n            key={fieldMetadata.name}\n            field={fieldMetadata.name}\n            header={header}\n            body={(rowData) => {\n                let viewWidget = column.attrs.viewWidget;\n                if (!viewWidget) {\n                    viewWidget = 'DefaultMediaSingleListWidget';\n                }\n                let DynamicWidget = getExtensionComponent(viewWidget);\n                const widgetProps: SolidMediaListFieldWidgetProps = {\n                    rowData,\n                    solidListViewMetaData,\n                    fieldMetadata,\n                    column,\n                    setLightboxUrls,\n                    setOpenLightbox\n                }\n                return (\n                    <>\n                        {DynamicWidget && <DynamicWidget {...widgetProps} />}\n                    </>\n                )\n            }}\n            sortable={column.attrs.sortable}\n            showFilterOperator={false}\n            style={{ minWidth: \"12rem\" }}\n            headerClassName=\"table-header-fs\"\n        />\n    );\n};\n\nexport default SolidMediaSingleColumn;\n\n// Default widget for single media field\nexport const DefaultMediaSingleListWidget = ({\n    rowData,\n    solidListViewMetaData,\n    fieldMetadata,\n    column,\n    setLightboxUrls,\n    setOpenLightbox\n}: SolidMediaListFieldWidgetProps) => {\n    if (!rowData?._media?.[fieldMetadata.name]) return null;\n    const mediaFiles = rowData._media[fieldMetadata.name].map((file: any) => {\n        const fileUrl = file?._full_url;\n        const previewKind = getMediaPreviewKind({\n            url: fileUrl,\n            fileName: file?.originalFileName,\n            mimeType: file?.mimeType,\n        });\n        return {\n            fileUrl,\n            fileName: file?.originalFileName,\n            previewKind,\n            opensInLightbox: isLightboxMediaKind(previewKind),\n            lightboxType: previewKind === \"video\" ? \"video\" : undefined,\n        };\n    });\n\n    const firstFile = mediaFiles[0];\n    if (!firstFile?.fileUrl) return <div style={{ height: 40, width: 40 }} />;\n    return (\n        <MediaWithFallback\n            src={firstFile.fileUrl}\n            alt=\"media\"\n            fileName={firstFile.fileName}\n            previewKind={firstFile.previewKind}\n            onClick={(event) => {\n                event.stopPropagation();\n                if (firstFile.opensInLightbox) {\n                    setLightboxUrls([{\n                        src: firstFile.fileUrl,\n                        downloadUrl: firstFile.fileUrl,\n                        type: firstFile.lightboxType\n                    }]);\n                    setOpenLightbox(true);\n                    return;\n                }\n\n                openMediaInNewTab(firstFile.fileUrl);\n            }}\n        />\n    );\n};\n"]}

package/dist/components/core/list/columns/SolidMediaSingleColumn.tsx

@@ -6,48 +6,32 @@ import { SolidListViewColumnParams } from '../SolidListViewColumn';
 import { SolidMediaListFieldWidgetProps } from '../../../../types/solid-core';
 import { getExtensionComponent } from '../../../../helpers/registry';
 import { SolidFileTypeIcon } from '../../../../helpers/fileTypeIcon';
-
-const getCleanUrl = (url: string) => url.split("?")[0];
-
-// Helpers for file type detection
-const isImageFile = (url: string) => /\.(jpg|jpeg|png|gif|bmp|webp)$/i.test(getCleanUrl(url));
-const isVideoFile = (url: string) => /\.(mp4|webm|ogg)$/i.test(getCleanUrl(url));
-const isAudioFile = (url: string) => /\.(mp3|wav|ogg)$/i.test(getCleanUrl(url));
-
-// Extensions that should be downloaded directly
-const downloadOnlyExt = [
-    "txt", "zip", "rar",
-    "doc", "docx",
-    "xls", "xlsx",
-    "ppt", "pptx",
-    "pdf"
-];
+import { getMediaPreviewKind, isLightboxMediaKind, type MediaPreviewKind } from '../../../../helpers/mediaType';
+import { openMediaInNewTab } from '../../../../helpers/mediaUrl';
 
 // Media component with fallback for broken links
-const MediaWithFallback = ({ src, alt, onClick }: { src: string; alt: string; onClick: (event: React.MouseEvent) => void }) => {
+const MediaWithFallback = ({
+    src,
+    alt,
+    fileName,
+    previewKind,
+    onClick
+}: {
+    src: string;
+    alt: string;
+    fileName?: string;
+    previewKind: MediaPreviewKind;
+    onClick: (event: React.MouseEvent) => void
+}) => {
     const [isBroken, setIsBroken] = useState(false);
 
     const handleClick = (event: React.MouseEvent) => {
         event.stopPropagation();
-        const cleanUrl = src.split("?")[0];
-        const ext = cleanUrl.split(".").pop()?.toLowerCase();
-
-        if (ext && downloadOnlyExt.includes(ext)) {
-            // Trigger download for docs/archives
-            const link = document.createElement("a");
-            link.href = src;
-            link.download = "";
-            link.target = "_blank";
-            document.body.appendChild(link);
-            link.click();
-            document.body.removeChild(link);
-        } else {
-            onClick(event);
-        }
+        onClick(event);
     };
 
     if (!isBroken) {
-        if (isImageFile(src)) {
+        if (previewKind === "image") {
             return (
                 <img
                     src={src}
@@ -62,7 +46,7 @@ const MediaWithFallback = ({ src, alt, onClick }: { src: string; alt: string; on
             );
         }
 
-        if (isVideoFile(src)) {
+        if (previewKind === "video") {
             return (
                 <video
                     src={src}
@@ -77,7 +61,7 @@ const MediaWithFallback = ({ src, alt, onClick }: { src: string; alt: string; on
             );
         }
 
-        if (isAudioFile(src)) {
+        if (previewKind === "audio") {
             return (
                 <div
                     className="flex items-center justify-center rounded bg-gray-100 shadow-md"
@@ -96,7 +80,7 @@ const MediaWithFallback = ({ src, alt, onClick }: { src: string; alt: string; on
             style={{ width: 40, height: 40, display: "flex", alignItems: "center", justifyContent: "center", cursor: "pointer" }}
             onClick={handleClick}
         >
-            <SolidFileTypeIcon fileUrl={src} size={24} />
+            <SolidFileTypeIcon fileUrl={src} fileName={fileName} size={24} />
         </div>
     );
 };
@@ -150,22 +134,43 @@ export const DefaultMediaSingleListWidget = ({
     setOpenLightbox
 }: SolidMediaListFieldWidgetProps) => {
     if (!rowData?._media?.[fieldMetadata.name]) return null;
-    const mediaUrls = rowData._media[fieldMetadata.name].map((i: any) => i._full_url);
-
-    const firstUrl = mediaUrls[0];
-    if (!firstUrl) return <div style={{ height: 40, width: 40 }} />;
-    const cleanUrl = getCleanUrl(firstUrl);
+    const mediaFiles = rowData._media[fieldMetadata.name].map((file: any) => {
+        const fileUrl = file?._full_url;
+        const previewKind = getMediaPreviewKind({
+            url: fileUrl,
+            fileName: file?.originalFileName,
+            mimeType: file?.mimeType,
+        });
+        return {
+            fileUrl,
+            fileName: file?.originalFileName,
+            previewKind,
+            opensInLightbox: isLightboxMediaKind(previewKind),
+            lightboxType: previewKind === "video" ? "video" : undefined,
+        };
+    });
+
+    const firstFile = mediaFiles[0];
+    if (!firstFile?.fileUrl) return <div style={{ height: 40, width: 40 }} />;
     return (
         <MediaWithFallback
-            src={firstUrl}
+            src={firstFile.fileUrl}
             alt="media"
+            fileName={firstFile.fileName}
+            previewKind={firstFile.previewKind}
             onClick={(event) => {
-                // Only open lightbox for image, video, or audio
-                event.stopPropagation()
-                if (isImageFile(cleanUrl) || isVideoFile(cleanUrl) || isAudioFile(cleanUrl)) {
-                    setLightboxUrls([{ src: firstUrl, downloadUrl: firstUrl }]);
+                event.stopPropagation();
+                if (firstFile.opensInLightbox) {
+                    setLightboxUrls([{
+                        src: firstFile.fileUrl,
+                        downloadUrl: firstFile.fileUrl,
+                        type: firstFile.lightboxType
+                    }]);
                     setOpenLightbox(true);
+                    return;
                 }
+
+                openMediaInNewTab(firstFile.fileUrl);
             }}
         />
     );

package/dist/components/core/list/widgets/SolidChatterMessageCoModelEntityIdListViewWidget.d.ts

@@ -0,0 +1,3 @@
+import { SolidListFieldWidgetProps } from "../../../../types/solid-core";
+export declare const SolidChatterMessageCoModelEntityIdListViewWidget: ({ rowData, solidListViewMetaData, fieldMetadata, column }: SolidListFieldWidgetProps) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=SolidChatterMessageCoModelEntityIdListViewWidget.d.ts.map

package/dist/components/core/list/widgets/SolidChatterMessageCoModelEntityIdListViewWidget.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SolidChatterMessageCoModelEntityIdListViewWidget.d.ts","sourceRoot":"","sources":["../../../../../src/components/core/list/widgets/SolidChatterMessageCoModelEntityIdListViewWidget.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,yBAAyB,EAAE,MAAM,8BAA8B,CAAC;AAMzE,eAAO,MAAM,gDAAgD,8DAA+D,yBAAyB,4CA2DpJ,CAAC"}