@memori.ai/memori-react 7.25.1 → 7.26.1

package/esm/components/FilePreview/FilePreview.css

@@ -1,155 +1,184 @@
-.memori--preview-container {
-    min-width: 200px;
-    padding: 12px;
-    border-radius: 8px;
-    margin-bottom: 12px;
-    animation: slide-in 0.3s ease;
-    background: white;
-    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
-    transition: all 0.3s ease;
-  }
+/* Updated FilePreview Styles */
 
-  .memori--preview-container.slide-down {
-    animation: slide-down 0.3s ease;
-  }
-
-  .memori--absolute-preview {
-    position: absolute;
-    right: 0;
-    bottom: 100%;
-    left: 0;
-  }
-
-  .memori--message-preview {
-    margin: 12px 0;
-  }
-
-  .memori--preview-list {
-    display: flex;
-    flex-direction: column;
-    gap: 8px;
-  }
-
-  .memori--preview-item {
-    position: relative;
-    display: flex;
-    max-width: fit-content;
-    align-items: center;
-    padding: 8px;
-    border-radius: 8px;
-    animation: slide-in 0.3s ease;
-    background-color: #f8f9fa;
-    cursor: pointer;
-    gap: 8px;
-    transition: all 0.2s ease;
-  }
-
-  .memori--preview-item:hover {
-    background-color: #f1f3f5;
-    transform: translateX(4px);
-  }
-
-  .memori--preview-icon {
-    width: 20px;
-    height: 20px;
-    flex-shrink: 0;
-    fill: var(--memori-primary);
-  }
-
-  .memori--preview-filename {
-    overflow: hidden;
-    max-width: 200px;
-    color: #495057;
-    font-size: 14px;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-  }
-
-  .memori--modal-title-preview {
-    margin-top: 12px;
-    margin-bottom: 12px;
-    font-size: 20px;
-    font-weight: 600;
-  }
-
-  .memori--remove-button {
-    position: absolute;
-    top: -4px;
-    right: -4px;
-    padding: 4px;
-    border: none;
-    border-radius: 50%;
-    background-color: #e03131;
-    color: white;
-    cursor: pointer;
+.memori--preview-container {
+  min-width: 100%;
+  padding: 12px;
+  border-radius: 8px;
+  margin-bottom: 12px;
+  animation: slide-in 0.3s ease;
+  background: white;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+  transition: all 0.3s ease;
+}
+
+.memori--preview-container.slide-down {
+  animation: slide-down 0.3s ease;
+}
+
+.memori--absolute-preview {
+  position: absolute;
+  bottom: 100%;
+}
+
+.memori--message-preview {
+  max-width: 100%;
+  margin: 12px 0;
+}
+
+.memori--preview-list {
+  display: flex;
+  flex-direction: row;
+  gap: 8px;
+  overflow-x: auto;
+}
+
+.memori--preview-item {
+  position: relative;
+  display: flex;
+  max-width: fit-content;
+  align-items: center;
+  padding: 8px;
+  border-radius: 8px;
+  animation: slide-in 0.3s ease;
+  background-color: #f8f9fa;
+  cursor: pointer;
+  gap: 8px;
+  transition: all 0.2s ease;
+}
+
+.memori--preview-item:hover {
+  background-color: #f1f3f5;
+  transform: translateX(4px);
+}
+
+.memori--preview-icon {
+  width: 20px;
+  height: 20px;
+  flex-shrink: 0;
+  color: #fff;
+  fill: var(--memori-primary);
+}
+
+.memori--preview-file-info {
+  display: flex;
+  overflow: hidden;
+  flex-direction: column;
+}
+
+.memori--preview-filename {
+  overflow: hidden;
+  max-width: 200px;
+  color: #495057;
+  font-size: 14px;
+  font-weight: 500;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.memori--preview-filetype {
+  margin-top: 2px;
+  color: #868e96;
+  font-size: 12px;
+}
+
+.memori--modal-title-preview {
+  margin-top: 12px;
+  margin-bottom: 12px;
+  font-size: 20px;
+  font-weight: 600;
+}
+
+.memori--remove-button {
+  position: absolute;
+  top: -4px;
+  right: -4px;
+  padding: 4px;
+  border: none;
+  border-radius: 50%;
+  background-color: #e03131;
+  color: white;
+  cursor: pointer;
+  opacity: 0;
+  transform: scale(0.75);
+  transition: all 0.2s ease;
+}
+
+.memori--remove-button.visible {
+  opacity: 1;
+  transform: scale(1);
+}
+
+.memori--remove-button:hover {
+  background-color: #c92a2a;
+  transform: scale(1.1);
+}
+
+.memori--remove-icon {
+  width: 12px;
+  height: 12px;
+}
+
+.memori--modal-preview-file {
+  width: 100%;
+  max-width: 800px;
+  height: 100%;
+  padding: 12px;
+}
+
+.memori--preview-content {
+  padding: 16px;
+  border-radius: 8px;
+  background-color: #f8f9fa;
+  font-family: monospace;
+  font-size: 14px;
+  line-height: 1.5;
+}
+
+@keyframes fadeIn {
+  from { opacity: 0; }
+  to { opacity: 1; }
+}
+
+@keyframes scaleIn {
+  from {
     opacity: 0;
-    transform: scale(0.75);
-    transition: all 0.2s ease;
+    transform: scale(0.95);
   }
-
-  .memori--remove-button.visible {
+  to {
     opacity: 1;
     transform: scale(1);
   }
+}
 
-  .memori--remove-button:hover {
-    background-color: #c92a2a;
-    transform: scale(1.1);
-  }
-
-  .memori--remove-icon {
-    width: 12px;
-    height: 12px;
+@keyframes slide-up {
+  from {
+    opacity: 0;
+    transform: translateY(10px);
   }
-
-  .memori--modal-preview-file {
-    width: 100%;
-    max-width: 800px;
-    height: 100%;
-    padding: 12px;
+  to {
+    opacity: 1;
+    transform: translateY(0);
   }
+}
 
-  @keyframes fadeIn {
-    from { opacity: 0; }
-    to { opacity: 1; }
+@keyframes slide-in {
+  from {
+    opacity: 0;
+    transform: translateY(-10px);
   }
-
-  @keyframes scaleIn {
-    from { 
-      opacity: 0;
-      transform: scale(0.95);
-    }
-    to { 
-      opacity: 1;
-      transform: scale(1);
-    }
+  to {
+    opacity: 1;
+    transform: translateY(0);
   }
+}
 
-  @keyframes slide-up {
-    from {
-      opacity: 0;
-      transform: translateY(10px);
-    }
-    to {
-      opacity: 1;
-      transform: translateY(0);
-    }
+@keyframes slide-down {
+  from {
+    opacity: 1;
+    transform: translateY(0);
   }
-  
-  @keyframes slide-in {
-    from {
-      opacity: 0;
-      transform: translateY(-10px);
-    }
-    to {
-      opacity: 1;
-      transform: translateY(0);
-    }
+  to {
+    opacity: 0;
+    transform: translateY(10px);
   }
-
-  @keyframes slide-down {
-    from {
-      opacity: 1;
-      transform: translateY(0);
-    }
-  }
+}

package/esm/components/FilePreview/FilePreview.d.ts

@@ -1,10 +1,6 @@
 type FilePreviewProps = {
-    previewFiles: {
-        name: string;
-        id: string;
-        content: string;
-    }[];
-    removeFile: (id: string) => void;
+    previewFiles: any;
+    removeFile: (id: string, mediumID: string | undefined) => void;
     allowRemove?: boolean;
     isMessagePreview?: boolean;
 };

package/esm/components/FilePreview/FilePreview.js

@@ -1,18 +1,71 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useState } from 'react';
-import PreviewIcon from '../icons/Preview';
+import { DocumentIcon } from '../icons/Document';
 import CloseIcon from '../icons/Close';
 import Button from '../ui/Button';
 import Modal from '../ui/Modal';
+import { stripHTML } from '../../helpers/utils';
 const FilePreview = ({ previewFiles, removeFile, allowRemove = true, isMessagePreview = false, }) => {
     const [selectedFile, setSelectedFile] = useState(null);
     const [hoveredId, setHoveredId] = useState(null);
-    return (_jsxs(_Fragment, { children: [previewFiles.length > 0 && (_jsx("div", { className: `memori--preview-container ${isMessagePreview
+    const getFileType = (filename, type) => {
+        var _a, _b;
+        if (type === 'image') {
+            const extension = (_a = filename.split('.').pop()) === null || _a === void 0 ? void 0 : _a.toLowerCase();
+            switch (extension) {
+                case 'jpg':
+                case 'jpeg':
+                    return 'JPEG';
+                case 'png':
+                    return 'PNG';
+                default:
+                    return 'Image';
+            }
+        }
+        const extension = (_b = filename.split('.').pop()) === null || _b === void 0 ? void 0 : _b.toLowerCase();
+        switch (extension) {
+            case 'pdf':
+                return 'PDF';
+            case 'txt':
+                return 'Text';
+            case 'json':
+                return 'JSON';
+            case 'xlsx':
+                return 'Excel';
+            case 'csv':
+                return 'CSV';
+            case 'jpg':
+            case 'jpeg':
+                return 'JPEG';
+            case 'png':
+                return 'PNG';
+            default:
+                return 'Document';
+        }
+    };
+    const isImageContent = (content, type) => {
+        if (type === 'image')
+            return true;
+        const hasImageExtension = /\.(jpg|jpeg|png|gif|webp|svg)$/i.test(content);
+        const isImageUrl = content.startsWith('http') &&
+            (content.includes('/image/') ||
+                content.includes('/img/') ||
+                hasImageExtension);
+        return isImageUrl || hasImageExtension;
+    };
+    return (_jsxs(_Fragment, { children: [previewFiles.length > 0 && (_jsx("div", { className: `memori--preview-container  ${isMessagePreview
                     ? 'memori--message-preview'
-                    : 'memori--absolute-preview'}`, children: _jsx("div", { className: "memori--preview-list", children: previewFiles.map(file => (_jsxs("div", { className: "memori--preview-item", onMouseEnter: () => setHoveredId(file.id), onMouseLeave: () => setHoveredId(null), onClick: () => setSelectedFile(file), children: [_jsx(PreviewIcon, { className: "memori--preview-icon" }), _jsx("span", { className: "memori--preview-filename", children: file.name }), allowRemove && (_jsx(Button, { shape: "rounded", icon: _jsx(CloseIcon, {}), danger: true, className: `memori--remove-button ${hoveredId === file.id ? 'visible' : ''}`, onClick: e => {
+                    : 'memori--absolute-preview'}`, children: _jsx("div", { className: "memori--preview-list", children: previewFiles.map((file) => (_jsxs("div", { className: `memori--preview-item ${isImageContent(file.content, file.type)
+                            ? 'memori--preview-item--image'
+                            : 'memori--preview-item--document'}`, onMouseEnter: () => setHoveredId(file.id), onMouseLeave: () => setHoveredId(null), onClick: () => setSelectedFile(file), children: [isImageContent(file.content, file.type) ? (_jsx("div", { className: "memori--preview-thumbnail", children: _jsx("img", { src: file.content, alt: file.name }) })) : (_jsx(DocumentIcon, { className: "memori--preview-icon" })), _jsxs("div", { className: "memori--preview-file-info", children: [_jsx("span", { className: "memori--preview-filename", children: file.name }), _jsx("span", { className: "memori--preview-filetype", children: getFileType(file.name, file.type) })] }), allowRemove && (_jsx(Button, { shape: "rounded", icon: _jsx(CloseIcon, {}), danger: true, className: `memori--remove-button ${hoveredId === file.id ? 'visible' : ''}`, onClick: e => {
                                     e.stopPropagation();
-                                    removeFile(file.id);
-                                } }))] }, file.id))) }) })), _jsx(Modal, { width: "80%", widthMd: "80%", open: !!selectedFile, className: "memori--modal-preview-file", onClose: () => setSelectedFile(null), closable: true, title: selectedFile === null || selectedFile === void 0 ? void 0 : selectedFile.name, children: _jsx("div", { className: "memori--preview-content", style: { whiteSpace: 'pre-wrap', maxHeight: '70vh', overflowY: 'auto' }, children: selectedFile === null || selectedFile === void 0 ? void 0 : selectedFile.content }) })] }));
+                                    removeFile(file.id, file === null || file === void 0 ? void 0 : file.mediumID);
+                                } }))] }, file.id))) }) })), _jsx(Modal, { width: "80%", widthMd: "80%", open: !!selectedFile, className: "memori--modal-preview-file", onClose: () => setSelectedFile(null), closable: true, title: selectedFile === null || selectedFile === void 0 ? void 0 : selectedFile.name, children: _jsx("div", { className: "memori--preview-content", style: {
+                        maxHeight: '70vh',
+                        overflowY: 'auto',
+                        textAlign: 'center',
+                        whiteSpace: selectedFile && !isImageContent(selectedFile.content, selectedFile.type) ? 'pre-wrap' : 'normal'
+                    }, children: selectedFile && isImageContent(selectedFile.content, selectedFile.type) ? (_jsx(_Fragment, { children: _jsx("img", { src: selectedFile.content, alt: selectedFile.name, style: { maxWidth: '100%', maxHeight: '60vh' } }) })) : (stripHTML((selectedFile === null || selectedFile === void 0 ? void 0 : selectedFile.content) || '')) }) })] }));
 };
 export default FilePreview;
 //# sourceMappingURL=FilePreview.js.map

package/esm/components/FilePreview/FilePreview.js.map

@@ -1 +1 @@
-{"version":3,"file":"FilePreview.js","sourceRoot":"","sources":["../../../src/components/FilePreview/FilePreview.tsx"],"names":[],"mappings":";AAAA,OAAc,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACxC,OAAO,WAAW,MAAM,kBAAkB,CAAC;AAC3C,OAAO,SAAS,MAAM,gBAAgB,CAAC;AACvC,OAAO,MAAM,MAAM,cAAc,CAAC;AAClC,OAAO,KAAK,MAAM,aAAa,CAAC;AAShC,MAAM,WAAW,GAAG,CAAC,EACnB,YAAY,EACZ,UAAU,EACV,WAAW,GAAG,IAAI,EAClB,gBAAgB,GAAG,KAAK,GACP,EAAE,EAAE;IACrB,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAGtC,IAAI,CAAC,CAAC;IAChB,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAgB,IAAI,CAAC,CAAC;IAEhE,OAAO,CACL,8BACG,YAAY,CAAC,MAAM,GAAG,CAAC,IAAI,CAC1B,cACE,SAAS,EAAE,6BACT,gBAAgB;oBACd,CAAC,CAAC,yBAAyB;oBAC3B,CAAC,CAAC,0BACN,EAAE,YAEF,cAAK,SAAS,EAAC,sBAAsB,YAClC,YAAY,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,CACxB,eAEE,SAAS,EAAC,sBAAsB,EAChC,YAAY,EAAE,GAAG,EAAE,CAAC,YAAY,CAAC,IAAI,CAAC,EAAE,CAAC,EACzC,YAAY,EAAE,GAAG,EAAE,CAAC,YAAY,CAAC,IAAI,CAAC,EACtC,OAAO,EAAE,GAAG,EAAE,CAAC,eAAe,CAAC,IAAI,CAAC,aAEpC,KAAC,WAAW,IAAC,SAAS,EAAC,sBAAsB,GAAG,EAChD,eAAM,SAAS,EAAC,0BAA0B,YAAE,IAAI,CAAC,IAAI,GAAQ,EAE5D,WAAW,IAAI,CACd,KAAC,MAAM,IACL,KAAK,EAAC,SAAS,EACf,IAAI,EAAE,KAAC,SAAS,KAAG,EACnB,MAAM,QACN,SAAS,EAAE,yBACT,SAAS,KAAK,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,EACtC,EAAE,EACF,OAAO,EAAE,CAAC,CAAC,EAAE;oCACX,CAAC,CAAC,eAAe,EAAE,CAAC;oCACpB,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;gCACtB,CAAC,GACD,CACH,KAtBI,IAAI,CAAC,EAAE,CAuBR,CACP,CAAC,GACE,GACF,CACP,EAED,KAAC,KAAK,IACJ,KAAK,EAAC,KAAK,EACX,OAAO,EAAC,KAAK,EACb,IAAI,EAAE,CAAC,CAAC,YAAY,EACpB,SAAS,EAAC,4BAA4B,EACtC,OAAO,EAAE,GAAG,EAAE,CAAC,eAAe,CAAC,IAAI,CAAC,EACpC,QAAQ,QACR,KAAK,EAAE,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,IAAI,YAEzB,cAAK,SAAS,EAAC,yBAAyB,EAAC,KAAK,EAAE,EAAE,UAAU,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,EAAE,YAC7G,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,OAAO,GAClB,GACA,IACP,CACJ,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,WAAW,CAAC"}
+{"version":3,"file":"FilePreview.js","sourceRoot":"","sources":["../../../src/components/FilePreview/FilePreview.tsx"],"names":[],"mappings":"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"}

package/esm/components/MediaWidget/LinkItemWidget.css

@@ -1,6 +1,7 @@
 .memori-link-items--grid {
     display: grid;
     padding: 1rem;
+    direction: rtl;
     grid-auto-flow: dense;
     grid-gap: 1rem;
     grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));

package/esm/components/MediaWidget/MediaItemWidget.css

@@ -1,6 +1,7 @@
 .memori-media-items--grid {
     display: grid;
     padding: 1rem;
+    direction: rtl;
     grid-auto-flow: dense;
     grid-gap: 1rem;
     grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
@@ -143,3 +144,12 @@ a.memori-media-item--link {
     border-color: #fff;
     color: #fff;
 }
+
+.memori-media-item-preview--modal {
+    z-index: 10000;
+    width: 100%;
+    max-width: 80%;
+    height: 100%;
+    max-height: 80%;
+    background: #fff;
+}

package/esm/components/MediaWidget/MediaItemWidget.d.ts

@@ -1,7 +1,9 @@
 import { Medium } from '@memori.ai/memori-api-client/dist/types';
 import React from 'react';
 export interface Props {
-    items: Medium[];
+    items: (Medium & {
+        type?: string;
+    })[];
     sessionID?: string;
     tenantID?: string;
     translateTo?: string;
@@ -11,7 +13,9 @@ export interface Props {
 }
 export declare const RenderMediaItem: ({ isChild, item, sessionID, tenantID, preview, baseURL, apiURL, onClick, customMediaRenderer, }: {
     isChild?: boolean | undefined;
-    item: Medium;
+    item: Medium & {
+        type: string;
+    };
     sessionID?: string | undefined;
     tenantID?: string | undefined;
     preview?: boolean | undefined;

package/esm/components/MediaWidget/MediaItemWidget.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useCallback, useEffect, useState, memo } from 'react';
 import { getResourceUrl } from '../../helpers/media';
 import { getTranslation } from '../../helpers/translations';
@@ -12,8 +12,10 @@ import FilePdf from '../icons/FilePdf';
 import FileExcel from '../icons/FileExcel';
 import FileWord from '../icons/FileWord';
 import { Transition } from '@headlessui/react';
+import { stripHTML } from '../../helpers/utils';
 export const RenderMediaItem = ({ isChild = false, item, sessionID, tenantID, preview = false, baseURL, apiURL, onClick, customMediaRenderer, }) => {
     var _a, _b;
+    const [modalOpen, setModalOpen] = useState(false);
     const url = getResourceUrl({
         resourceURI: item.url,
         sessionID,
@@ -25,15 +27,51 @@ export const RenderMediaItem = ({ isChild = false, item, sessionID, tenantID, pr
     if (customRenderer) {
         return customRenderer;
     }
+    const renderMediaContent = (item) => {
+        switch (item.mimeType) {
+            case 'image/jpeg':
+            case 'image/png':
+            case 'image/jpg':
+            case 'image/gif':
+                return isImageRGB ? (_jsxs("picture", { className: "memori-media-item--figure", children: [_jsx("div", { className: "memori-media-item--rgb-item", style: {
+                                backgroundColor: item.url,
+                            } }), item.title && (_jsx("figcaption", { className: "memori-media-item--figure-caption", children: item.title }))] })) : (_jsxs("picture", { className: "memori-media-item--figure", children: [!preview && (_jsx("source", { srcSet: [url, item.url, item.content].join(', '), type: item.mimeType })), _jsx("img", { alt: item.title, src: "data:image/png;base64,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" }), item.title && (_jsx("figcaption", { className: "memori-media-item--figure-caption", children: item.title }))] }));
+            case 'application/msword':
+            case 'application/vnd.openxmlformats-officedocument.wordprocessingml.document':
+                return _jsx(FileWord, { className: "memori-media-item--icon" });
+            case 'application/vnd.ms-excel':
+            case 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet':
+                return _jsx(FileExcel, { className: "memori-media-item--icon" });
+            case 'application/pdf':
+                return _jsx(FilePdf, { className: "memori-media-item--icon" });
+            case 'video/mp4':
+            case 'video/quicktime':
+            case 'video/avi':
+            case 'video/mpeg':
+                return (_jsxs("video", { style: { width: '100%', height: '100%' }, controls: true, src: url, title: item.title, children: [item.mimeType === 'video/quicktime' && (_jsx("source", { src: item.url, type: "video/mp4" })), _jsx("source", { src: item.url, type: item.mimeType }), "Your browser does not support this video format.", _jsx("br", {}), _jsx("a", { href: item.url, target: "_blank", rel: "noopener noreferrer", children: "Download the video" })] }));
+            case 'audio/mpeg3':
+            case 'audio/wav':
+            case 'audio/mpeg':
+                return (_jsx("audio", { style: { width: '100%', height: '100%' }, controls: true, src: url }));
+            case 'model/gltf-binary':
+                return (_jsx(ModelViewer, { src: url, alt: "", poster: "data:image/png;base64,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" }));
+            default:
+                return _jsx(File, { className: "memori-media-item--icon" });
+        }
+    };
+    if (!item.url && (item === null || item === void 0 ? void 0 : item.type) === 'document' && item.content) {
+        return (_jsxs(_Fragment, { children: [_jsx("a", { className: "memori-media-item--link", href: "#", onClick: e => {
+                        e.preventDefault();
+                        setModalOpen(true);
+                    }, title: item.title, children: _jsx(Card, { hoverable: true, cover: renderMediaContent(item), title: item.title }) }), _jsx(Modal, { open: modalOpen, onClose: () => setModalOpen(false), title: item.title, className: "memori-media-item-preview--modal", children: _jsx("pre", { children: stripHTML(item.content) }) })] }));
+    }
     const isImageRGB = ((_a = item.url) === null || _a === void 0 ? void 0 : _a.startsWith('rgb(')) || ((_b = item.url) === null || _b === void 0 ? void 0 : _b.startsWith('rgba('));
     switch (item.mimeType) {
         case 'image/jpeg':
         case 'image/png':
         case 'image/jpg':
         case 'image/gif':
-            return isImageRGB ? (_jsx(Card, { hoverable: true, className: "memori-media-item--card memori-media-item--image", cover: _jsxs("picture", { className: "memori-media-item--figure", children: [_jsx("div", { className: "memori-media-item--rgb-item", style: {
-                                backgroundColor: item.url,
-                            } }), item.title && (_jsx("figcaption", { className: "memori-media-item--figure-caption", children: item.title }))] }) })) : (_jsx("a", { className: "memori-media-item--link", href: item.url, onClick: e => {
+            return isImageRGB ? (_jsx(Card, { hoverable: true, className: "memori-media-item--card memori-media-item--image", cover: renderMediaContent(item) })) : (_jsx("a", { className: "memori-media-item--link", href: item.url, onClick: e => {
                     if (isChild) {
                         e.preventDefault();
                     }
@@ -41,15 +79,13 @@ export const RenderMediaItem = ({ isChild = false, item, sessionID, tenantID, pr
                         e.preventDefault();
                         onClick(item.mediumID);
                     }
-                }, target: "_blank", rel: "noopener noreferrer", title: item.title, children: _jsx(Card, { hoverable: true, className: "memori-media-item--card memori-media-item--image", cover: _jsxs("picture", { className: "memori-media-item--figure", children: [!preview && (_jsx("source", { srcSet: [url, item.url, item.content].join(', '), type: item.mimeType })), _jsx("img", { alt: item.title, src: "data:image/png;base64,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" }), item.title && (_jsx("figcaption", { className: "memori-media-item--figure-caption", children: item.title }))] }) }) }));
+                }, target: "_blank", rel: "noopener noreferrer", title: item.title, children: _jsx(Card, { hoverable: true, className: "memori-media-item--card memori-media-item--image", cover: renderMediaContent(item) }) }));
         case 'application/msword':
         case 'application/vnd.openxmlformats-officedocument.wordprocessingml.document':
-            return (_jsx("a", { className: "memori-media-item--link", href: url, target: "_blank", rel: "noopener noreferrer", title: item.title, children: _jsx(Card, { hoverable: true, cover: _jsx(FileWord, { className: "memori-media-item--icon" }), title: item.title }) }));
         case 'application/vnd.ms-excel':
         case 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet':
-            return (_jsx("a", { className: "memori-media-item--link", href: url, target: "_blank", rel: "noopener noreferrer", title: item.title, children: _jsx(Card, { hoverable: true, cover: _jsx(FileExcel, { className: "memori-media-item--icon" }), title: item.title }) }));
         case 'application/pdf':
-            return (_jsx("a", { className: "memori-media-item--link", href: url, target: "_blank", rel: "noopener noreferrer", title: item.title, children: _jsx(Card, { hoverable: true, cover: _jsx(FilePdf, { className: "memori-media-item--icon" }), title: item.title }) }));
+            return (_jsx("a", { className: "memori-media-item--link", href: url, target: "_blank", rel: "noopener noreferrer", title: item.title, children: _jsx(Card, { hoverable: true, cover: renderMediaContent(item), title: item.title }) }));
         case 'video/mp4':
         case 'video/quicktime':
         case 'video/avi':
@@ -62,15 +98,15 @@ export const RenderMediaItem = ({ isChild = false, item, sessionID, tenantID, pr
                         e.preventDefault();
                         onClick(item.mediumID);
                     }
-                }, target: "_blank", rel: "noopener noreferrer", title: item.title, children: _jsx(Card, { hoverable: true, cover: _jsxs("video", { style: { width: '100%', height: '100%' }, controls: true, src: url, title: item.title, children: [item.mimeType === 'video/quicktime' && (_jsx("source", { src: item.url, type: "video/mp4" })), _jsx("source", { src: item.url, type: item.mimeType }), "Your browser does not support this video format.", _jsx("br", {}), _jsx("a", { href: item.url, target: "_blank", rel: "noopener noreferrer", children: "Download the video" })] }), title: item.title }) }));
+                }, target: "_blank", rel: "noopener noreferrer", title: item.title, children: _jsx(Card, { hoverable: true, cover: renderMediaContent(item), title: item.title }) }));
         case 'audio/mpeg3':
         case 'audio/wav':
         case 'audio/mpeg':
-            return (_jsx("a", { className: "memori-media-item--link", href: url, target: "_blank", rel: "noopener noreferrer", title: item.title, children: _jsx(Card, { hoverable: true, cover: _jsx("audio", { style: { width: '100%', height: '100%' }, controls: true, src: url }), title: item.title }) }));
+            return (_jsx("a", { className: "memori-media-item--link", href: url, target: "_blank", rel: "noopener noreferrer", title: item.title, children: _jsx(Card, { hoverable: true, cover: renderMediaContent(item), title: item.title }) }));
         case 'model/gltf-binary':
-            return (_jsx(ModelViewer, { src: url, alt: "", poster: "data:image/png;base64,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" }));
+            return _jsx(Card, { hoverable: true, cover: renderMediaContent(item) });
         default:
-            return (_jsx("a", { className: "memori-media-item--link", href: url, target: "_blank", rel: "noopener noreferrer", title: item.title, children: _jsx(Card, { hoverable: true, cover: _jsx(File, { className: "memori-media-item--icon" }), title: item.title }) }));
+            return (_jsx("a", { className: "memori-media-item--link", href: url, target: "_blank", rel: "noopener noreferrer", title: item.title, children: _jsx(Card, { hoverable: true, cover: renderMediaContent(item), title: item.title }) }));
     }
 };
 const MediaItemWidget = ({ items, sessionID, tenantID, translateTo, baseURL, apiURL, customMediaRenderer, }) => {
@@ -127,11 +163,13 @@ const MediaItemWidget = ({ items, sessionID, tenantID, translateTo, baseURL, api
                             title: item.title,
                             url: item.url,
                             content: item.content,
+                            type: 'document',
                         }, customMediaRenderer: customMediaRenderer }) }, item.url + '&index=' + index))) })), codeSnippets.map(medium => (_jsx(Transition.Child, { as: "div", className: "memori-media-item--snippet", enter: "ease-out duration-500", enterFrom: "opacity-0 translate-y-1", enterTo: "opacity-1 translate-y-0", leave: "ease-in duration-300", leaveFrom: "opacity-1", leaveTo: "opacity-0", children: _jsx(Snippet, { medium: medium }, medium.mediumID) }, medium.mediumID))), cssExecutableCode.map(medium => (_jsx("style", { dangerouslySetInnerHTML: { __html: medium.content || '' } }, medium.mediumID))), (openModalMedium === null || openModalMedium === void 0 ? void 0 : openModalMedium.mediumID) && (_jsx(Modal, { width: "100%", widthMd: "100%", className: "memori-media-item--modal", open: !!openModalMedium, onClose: () => setOpenModalMedium(undefined), footer: null, children: _jsx(RenderMediaItem, { isChild: true, sessionID: sessionID, tenantID: tenantID, baseURL: baseURL, apiURL: apiURL, item: {
                         ...openModalMedium,
                         title: openModalMedium.title,
                         url: openModalMedium.url,
                         content: openModalMedium.content,
+                        type: 'document',
                     }, customMediaRenderer: customMediaRenderer }) }))] }));
 };
 export default memo(MediaItemWidget);