@memori.ai/memori-react 7.25.1 → 7.26.1

package/dist/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/dist/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/dist/components/FilePreview/FilePreview.js

@@ -3,19 +3,72 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
-const Preview_1 = tslib_1.__importDefault(require("../icons/Preview"));
+const Document_1 = require("../icons/Document");
 const Close_1 = tslib_1.__importDefault(require("../icons/Close"));
 const Button_1 = tslib_1.__importDefault(require("../ui/Button"));
 const Modal_1 = tslib_1.__importDefault(require("../ui/Modal"));
+const utils_1 = require("../../helpers/utils");
 const FilePreview = ({ previewFiles, removeFile, allowRemove = true, isMessagePreview = false, }) => {
     const [selectedFile, setSelectedFile] = (0, react_1.useState)(null);
     const [hoveredId, setHoveredId] = (0, react_1.useState)(null);
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [previewFiles.length > 0 && ((0, jsx_runtime_1.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 ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [previewFiles.length > 0 && ((0, jsx_runtime_1.jsx)("div", { className: `memori--preview-container  ${isMessagePreview
                     ? 'memori--message-preview'
-                    : 'memori--absolute-preview'}`, children: (0, jsx_runtime_1.jsx)("div", { className: "memori--preview-list", children: previewFiles.map(file => ((0, jsx_runtime_1.jsxs)("div", { className: "memori--preview-item", onMouseEnter: () => setHoveredId(file.id), onMouseLeave: () => setHoveredId(null), onClick: () => setSelectedFile(file), children: [(0, jsx_runtime_1.jsx)(Preview_1.default, { className: "memori--preview-icon" }), (0, jsx_runtime_1.jsx)("span", { className: "memori--preview-filename", children: file.name }), allowRemove && ((0, jsx_runtime_1.jsx)(Button_1.default, { shape: "rounded", icon: (0, jsx_runtime_1.jsx)(Close_1.default, {}), danger: true, className: `memori--remove-button ${hoveredId === file.id ? 'visible' : ''}`, onClick: e => {
+                    : 'memori--absolute-preview'}`, children: (0, jsx_runtime_1.jsx)("div", { className: "memori--preview-list", children: previewFiles.map((file) => ((0, jsx_runtime_1.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) ? ((0, jsx_runtime_1.jsx)("div", { className: "memori--preview-thumbnail", children: (0, jsx_runtime_1.jsx)("img", { src: file.content, alt: file.name }) })) : ((0, jsx_runtime_1.jsx)(Document_1.DocumentIcon, { className: "memori--preview-icon" })), (0, jsx_runtime_1.jsxs)("div", { className: "memori--preview-file-info", children: [(0, jsx_runtime_1.jsx)("span", { className: "memori--preview-filename", children: file.name }), (0, jsx_runtime_1.jsx)("span", { className: "memori--preview-filetype", children: getFileType(file.name, file.type) })] }), allowRemove && ((0, jsx_runtime_1.jsx)(Button_1.default, { shape: "rounded", icon: (0, jsx_runtime_1.jsx)(Close_1.default, {}), danger: true, className: `memori--remove-button ${hoveredId === file.id ? 'visible' : ''}`, onClick: e => {
                                     e.stopPropagation();
-                                    removeFile(file.id);
-                                } }))] }, file.id))) }) })), (0, jsx_runtime_1.jsx)(Modal_1.default, { 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: (0, jsx_runtime_1.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))) }) })), (0, jsx_runtime_1.jsx)(Modal_1.default, { 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: (0, jsx_runtime_1.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) ? ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)("img", { src: selectedFile.content, alt: selectedFile.name, style: { maxWidth: '100%', maxHeight: '60vh' } }) })) : ((0, utils_1.stripHTML)((selectedFile === null || selectedFile === void 0 ? void 0 : selectedFile.content) || '')) }) })] }));
 };
 exports.default = FilePreview;
 //# sourceMappingURL=FilePreview.js.map

package/dist/components/FilePreview/FilePreview.js.map

@@ -1 +1 @@
-{"version":3,"file":"FilePreview.js","sourceRoot":"","sources":["../../../src/components/FilePreview/FilePreview.tsx"],"names":[],"mappings":";;;;AAAA,iCAAwC;AACxC,uEAA2C;AAC3C,mEAAuC;AACvC,kEAAkC;AAClC,gEAAgC;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,IAAA,gBAAQ,EAGtC,IAAI,CAAC,CAAC;IAChB,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,IAAA,gBAAQ,EAAgB,IAAI,CAAC,CAAC;IAEhE,OAAO,CACL,6DACG,YAAY,CAAC,MAAM,GAAG,CAAC,IAAI,CAC1B,gCACE,SAAS,EAAE,6BACT,gBAAgB;oBACd,CAAC,CAAC,yBAAyB;oBAC3B,CAAC,CAAC,0BACN,EAAE,YAEF,gCAAK,SAAS,EAAC,sBAAsB,YAClC,YAAY,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,CACxB,iCAEE,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,uBAAC,iBAAW,IAAC,SAAS,EAAC,sBAAsB,GAAG,EAChD,iCAAM,SAAS,EAAC,0BAA0B,YAAE,IAAI,CAAC,IAAI,GAAQ,EAE5D,WAAW,IAAI,CACd,uBAAC,gBAAM,IACL,KAAK,EAAC,SAAS,EACf,IAAI,EAAE,uBAAC,eAAS,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,uBAAC,eAAK,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,gCAAK,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,kBAAe,WAAW,CAAC"}
+{"version":3,"file":"FilePreview.js","sourceRoot":"","sources":["../../../src/components/FilePreview/FilePreview.tsx"],"names":[],"mappings":"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"}

package/dist/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/dist/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/dist/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/dist/components/MediaWidget/MediaItemWidget.js

@@ -16,8 +16,10 @@ const FilePdf_1 = tslib_1.__importDefault(require("../icons/FilePdf"));
 const FileExcel_1 = tslib_1.__importDefault(require("../icons/FileExcel"));
 const FileWord_1 = tslib_1.__importDefault(require("../icons/FileWord"));
 const react_2 = require("@headlessui/react");
+const utils_1 = require("../../helpers/utils");
 const RenderMediaItem = ({ isChild = false, item, sessionID, tenantID, preview = false, baseURL, apiURL, onClick, customMediaRenderer, }) => {
     var _a, _b;
+    const [modalOpen, setModalOpen] = (0, react_1.useState)(false);
     const url = (0, media_1.getResourceUrl)({
         resourceURI: item.url,
         sessionID,
@@ -29,15 +31,51 @@ const RenderMediaItem = ({ isChild = false, item, sessionID, tenantID, preview =
     if (customRenderer) {
         return customRenderer;
     }
+    const renderMediaContent = (item) => {
+        switch (item.mimeType) {
+            case 'image/jpeg':
+            case 'image/png':
+            case 'image/jpg':
+            case 'image/gif':
+                return isImageRGB ? ((0, jsx_runtime_1.jsxs)("picture", { className: "memori-media-item--figure", children: [(0, jsx_runtime_1.jsx)("div", { className: "memori-media-item--rgb-item", style: {
+                                backgroundColor: item.url,
+                            } }), item.title && ((0, jsx_runtime_1.jsx)("figcaption", { className: "memori-media-item--figure-caption", children: item.title }))] })) : ((0, jsx_runtime_1.jsxs)("picture", { className: "memori-media-item--figure", children: [!preview && ((0, jsx_runtime_1.jsx)("source", { srcSet: [url, item.url, item.content].join(', '), type: item.mimeType })), (0, jsx_runtime_1.jsx)("img", { alt: item.title, src: "data:image/png;base64,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" }), item.title && ((0, jsx_runtime_1.jsx)("figcaption", { className: "memori-media-item--figure-caption", children: item.title }))] }));
+            case 'application/msword':
+            case 'application/vnd.openxmlformats-officedocument.wordprocessingml.document':
+                return (0, jsx_runtime_1.jsx)(FileWord_1.default, { className: "memori-media-item--icon" });
+            case 'application/vnd.ms-excel':
+            case 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet':
+                return (0, jsx_runtime_1.jsx)(FileExcel_1.default, { className: "memori-media-item--icon" });
+            case 'application/pdf':
+                return (0, jsx_runtime_1.jsx)(FilePdf_1.default, { className: "memori-media-item--icon" });
+            case 'video/mp4':
+            case 'video/quicktime':
+            case 'video/avi':
+            case 'video/mpeg':
+                return ((0, jsx_runtime_1.jsxs)("video", { style: { width: '100%', height: '100%' }, controls: true, src: url, title: item.title, children: [item.mimeType === 'video/quicktime' && ((0, jsx_runtime_1.jsx)("source", { src: item.url, type: "video/mp4" })), (0, jsx_runtime_1.jsx)("source", { src: item.url, type: item.mimeType }), "Your browser does not support this video format.", (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)("a", { href: item.url, target: "_blank", rel: "noopener noreferrer", children: "Download the video" })] }));
+            case 'audio/mpeg3':
+            case 'audio/wav':
+            case 'audio/mpeg':
+                return ((0, jsx_runtime_1.jsx)("audio", { style: { width: '100%', height: '100%' }, controls: true, src: url }));
+            case 'model/gltf-binary':
+                return ((0, jsx_runtime_1.jsx)(ModelViewer_1.default, { src: url, alt: "", poster: "data:image/png;base64,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" }));
+            default:
+                return (0, jsx_runtime_1.jsx)(File_1.default, { className: "memori-media-item--icon" });
+        }
+    };
+    if (!item.url && (item === null || item === void 0 ? void 0 : item.type) === 'document' && item.content) {
+        return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("a", { className: "memori-media-item--link", href: "#", onClick: e => {
+                        e.preventDefault();
+                        setModalOpen(true);
+                    }, title: item.title, children: (0, jsx_runtime_1.jsx)(Card_1.default, { hoverable: true, cover: renderMediaContent(item), title: item.title }) }), (0, jsx_runtime_1.jsx)(Modal_1.default, { open: modalOpen, onClose: () => setModalOpen(false), title: item.title, className: "memori-media-item-preview--modal", children: (0, jsx_runtime_1.jsx)("pre", { children: (0, utils_1.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 ? ((0, jsx_runtime_1.jsx)(Card_1.default, { hoverable: true, className: "memori-media-item--card memori-media-item--image", cover: (0, jsx_runtime_1.jsxs)("picture", { className: "memori-media-item--figure", children: [(0, jsx_runtime_1.jsx)("div", { className: "memori-media-item--rgb-item", style: {
-                                backgroundColor: item.url,
-                            } }), item.title && ((0, jsx_runtime_1.jsx)("figcaption", { className: "memori-media-item--figure-caption", children: item.title }))] }) })) : ((0, jsx_runtime_1.jsx)("a", { className: "memori-media-item--link", href: item.url, onClick: e => {
+            return isImageRGB ? ((0, jsx_runtime_1.jsx)(Card_1.default, { hoverable: true, className: "memori-media-item--card memori-media-item--image", cover: renderMediaContent(item) })) : ((0, jsx_runtime_1.jsx)("a", { className: "memori-media-item--link", href: item.url, onClick: e => {
                     if (isChild) {
                         e.preventDefault();
                     }
@@ -45,15 +83,13 @@ const RenderMediaItem = ({ isChild = false, item, sessionID, tenantID, preview =
                         e.preventDefault();
                         onClick(item.mediumID);
                     }
-                }, target: "_blank", rel: "noopener noreferrer", title: item.title, children: (0, jsx_runtime_1.jsx)(Card_1.default, { hoverable: true, className: "memori-media-item--card memori-media-item--image", cover: (0, jsx_runtime_1.jsxs)("picture", { className: "memori-media-item--figure", children: [!preview && ((0, jsx_runtime_1.jsx)("source", { srcSet: [url, item.url, item.content].join(', '), type: item.mimeType })), (0, jsx_runtime_1.jsx)("img", { alt: item.title, src: "data:image/png;base64,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" }), item.title && ((0, jsx_runtime_1.jsx)("figcaption", { className: "memori-media-item--figure-caption", children: item.title }))] }) }) }));
+                }, target: "_blank", rel: "noopener noreferrer", title: item.title, children: (0, jsx_runtime_1.jsx)(Card_1.default, { 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 ((0, jsx_runtime_1.jsx)("a", { className: "memori-media-item--link", href: url, target: "_blank", rel: "noopener noreferrer", title: item.title, children: (0, jsx_runtime_1.jsx)(Card_1.default, { hoverable: true, cover: (0, jsx_runtime_1.jsx)(FileWord_1.default, { className: "memori-media-item--icon" }), title: item.title }) }));
         case 'application/vnd.ms-excel':
         case 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet':
-            return ((0, jsx_runtime_1.jsx)("a", { className: "memori-media-item--link", href: url, target: "_blank", rel: "noopener noreferrer", title: item.title, children: (0, jsx_runtime_1.jsx)(Card_1.default, { hoverable: true, cover: (0, jsx_runtime_1.jsx)(FileExcel_1.default, { className: "memori-media-item--icon" }), title: item.title }) }));
         case 'application/pdf':
-            return ((0, jsx_runtime_1.jsx)("a", { className: "memori-media-item--link", href: url, target: "_blank", rel: "noopener noreferrer", title: item.title, children: (0, jsx_runtime_1.jsx)(Card_1.default, { hoverable: true, cover: (0, jsx_runtime_1.jsx)(FilePdf_1.default, { className: "memori-media-item--icon" }), title: item.title }) }));
+            return ((0, jsx_runtime_1.jsx)("a", { className: "memori-media-item--link", href: url, target: "_blank", rel: "noopener noreferrer", title: item.title, children: (0, jsx_runtime_1.jsx)(Card_1.default, { hoverable: true, cover: renderMediaContent(item), title: item.title }) }));
         case 'video/mp4':
         case 'video/quicktime':
         case 'video/avi':
@@ -66,15 +102,15 @@ const RenderMediaItem = ({ isChild = false, item, sessionID, tenantID, preview =
                         e.preventDefault();
                         onClick(item.mediumID);
                     }
-                }, target: "_blank", rel: "noopener noreferrer", title: item.title, children: (0, jsx_runtime_1.jsx)(Card_1.default, { hoverable: true, cover: (0, jsx_runtime_1.jsxs)("video", { style: { width: '100%', height: '100%' }, controls: true, src: url, title: item.title, children: [item.mimeType === 'video/quicktime' && ((0, jsx_runtime_1.jsx)("source", { src: item.url, type: "video/mp4" })), (0, jsx_runtime_1.jsx)("source", { src: item.url, type: item.mimeType }), "Your browser does not support this video format.", (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.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: (0, jsx_runtime_1.jsx)(Card_1.default, { hoverable: true, cover: renderMediaContent(item), title: item.title }) }));
         case 'audio/mpeg3':
         case 'audio/wav':
         case 'audio/mpeg':
-            return ((0, jsx_runtime_1.jsx)("a", { className: "memori-media-item--link", href: url, target: "_blank", rel: "noopener noreferrer", title: item.title, children: (0, jsx_runtime_1.jsx)(Card_1.default, { hoverable: true, cover: (0, jsx_runtime_1.jsx)("audio", { style: { width: '100%', height: '100%' }, controls: true, src: url }), title: item.title }) }));
+            return ((0, jsx_runtime_1.jsx)("a", { className: "memori-media-item--link", href: url, target: "_blank", rel: "noopener noreferrer", title: item.title, children: (0, jsx_runtime_1.jsx)(Card_1.default, { hoverable: true, cover: renderMediaContent(item), title: item.title }) }));
         case 'model/gltf-binary':
-            return ((0, jsx_runtime_1.jsx)(ModelViewer_1.default, { src: url, alt: "", poster: "data:image/png;base64,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" }));
+            return (0, jsx_runtime_1.jsx)(Card_1.default, { hoverable: true, cover: renderMediaContent(item) });
         default:
-            return ((0, jsx_runtime_1.jsx)("a", { className: "memori-media-item--link", href: url, target: "_blank", rel: "noopener noreferrer", title: item.title, children: (0, jsx_runtime_1.jsx)(Card_1.default, { hoverable: true, cover: (0, jsx_runtime_1.jsx)(File_1.default, { className: "memori-media-item--icon" }), title: item.title }) }));
+            return ((0, jsx_runtime_1.jsx)("a", { className: "memori-media-item--link", href: url, target: "_blank", rel: "noopener noreferrer", title: item.title, children: (0, jsx_runtime_1.jsx)(Card_1.default, { hoverable: true, cover: renderMediaContent(item), title: item.title }) }));
     }
 };
 exports.RenderMediaItem = RenderMediaItem;
@@ -132,11 +168,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 => ((0, jsx_runtime_1.jsx)(react_2.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: (0, jsx_runtime_1.jsx)(Snippet_1.default, { medium: medium }, medium.mediumID) }, medium.mediumID))), cssExecutableCode.map(medium => ((0, jsx_runtime_1.jsx)("style", { dangerouslySetInnerHTML: { __html: medium.content || '' } }, medium.mediumID))), (openModalMedium === null || openModalMedium === void 0 ? void 0 : openModalMedium.mediumID) && ((0, jsx_runtime_1.jsx)(Modal_1.default, { width: "100%", widthMd: "100%", className: "memori-media-item--modal", open: !!openModalMedium, onClose: () => setOpenModalMedium(undefined), footer: null, children: (0, jsx_runtime_1.jsx)(exports.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 }) }))] }));
 };
 exports.default = (0, react_1.memo)(MediaItemWidget);