@flozy/editor 11.1.0 → 11.1.1

package/dist/Editor/ChatEditor.js

@@ -1,6 +1,6 @@
 import React, { useCallback, useMemo, useRef, useImperativeHandle, forwardRef, useState } from "react";
-import { Editable, Slate, ReactEditor } from "slate-react";
-import { createEditor, Transforms, Editor } from "slate";
+import { Editable, Slate, ReactEditor } from 'slate-react';
+import { createEditor, Transforms, Editor } from 'slate';
 import withCommon from "./hooks/withCommon";
 import { getBlock, getMarked, serializeMentions } from "./utils/chatEditor/SlateUtilityFunctions";
 import MiniTextFormat from "./Toolbar/PopupTool/MiniTextFormat";
@@ -33,15 +33,15 @@ const ChatEditor = /*#__PURE__*/forwardRef((props, ref) => {
     isMobile = false,
     debounceTimeOut = 10,
     isMarkDown = false,
-    markDownContent = "",
+    markDownContent = '',
     translation
   } = props;
   const classes = usePopupStyle(theme);
   const convertedContent = draftToSlate({
     data: content && content?.length > 0 ? content : [{
-      type: "paragraph",
+      type: 'paragraph',
       children: [{
-        text: ""
+        text: ''
       }]
     }]
   });
@@ -257,7 +257,7 @@ const ChatEditor = /*#__PURE__*/forwardRef((props, ref) => {
         editor
       });
     } else if (event.key === "Enter" && !isMobile) {
-      const isEmpty = debouncedValue?.current.length === 1 && debouncedValue?.current[0].type === "paragraph" && debouncedValue?.current[0].children.length === 1 && debouncedValue?.current[0].children[0].text === "";
+      const isEmpty = debouncedValue?.current.length === 1 && debouncedValue?.current[0].type === 'paragraph' && debouncedValue?.current[0].children.length === 1 && debouncedValue?.current[0].children[0].text === '';
       if (isEmpty) {
         event.preventDefault();
         return;

package/dist/Editor/CommonEditor.js

@@ -1,5 +1,5 @@
 /* eslint-disable no-unused-vars */
-import React, { useRef, useCallback, useEffect, useMemo, useState, forwardRef, useImperativeHandle, createContext } from "react";
+import React, { useRef, useCallback, useEffect, useMemo, useState, forwardRef, useImperativeHandle } from "react";
 import PropTypes from "prop-types";
 import { createEditor, Range, Transforms } from "slate";
 import { Slate, Editable, ReactEditor } from "slate-react";
@@ -17,7 +17,7 @@ import { serializeToText } from "./utils/serializeToText";
 import { getPageSettings } from "./utils/pageSettings";
 import { getThumbnailImage, invertColor, pageTextStyle } from "./helper";
 import PopupTool from "./Toolbar/PopupTool";
-import { Box, Typography, useTheme, IconButton } from "@mui/material";
+import { Box, Typography, useTheme } from "@mui/material";
 import Shorthands from "./common/Shorthands";
 import MiniToolbar from "./Toolbar/Mini/MiniToolbar";
 import { EditorProvider } from "./hooks/useMouseMove";
@@ -26,12 +26,9 @@ import editorStyles from "./Styles/EditorStyles";
 import DragAndDrop from "./common/DnD";
 import Section from "./common/Section";
 import decorators from "./utils/Decorators";
-import { getTRBLBreakPoints, getVariableValue, getBreakpointLineSpacing } from "./helper/theme";
+import { getBreakpointLineSpacing, getTRBLBreakPoints } from "./helper/theme";
 import { getInitialValue, handleCopy, handleInsertLastElement, isEverythingSelected, isFreeGrid, isFreeGridFragment, isRestrictedNode, outsideEditorClickLabel } from "./utils/helper";
 import useWindowResize from "./hooks/useWindowResize";
-import { getTheme } from "./theme";
-import ThemeSettings from "./themeSettings";
-import ThemeSettingsAI from "./themeSettingsAI";
 import PopoverAIInput from "./Elements/AI/PopoverAIInput";
 import RnDCopy from "./common/RnD/RnDCopy";
 import SwitchViewport from "./common/RnD/SwitchViewport/SwitchViewport";
@@ -40,11 +37,9 @@ import "./font.css";
 import "./Editor.css";
 import "animate.css";
 import FontLoader from "./common/FontLoader/FontLoader";
-import { ThemeAIIcon, ThemePaintIcon } from "./assets/svg/ThemeIcons";
 import { CustomDialogComponent } from "./common/CustomDialog";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
-export const ThemeContext = /*#__PURE__*/createContext(null);
 const Item = /*#__PURE__*/forwardRef(({
   children,
   ...props
@@ -99,7 +94,6 @@ const CommonEditor = /*#__PURE__*/forwardRef((props, ref) => {
     otherProps,
     isIframe,
     theme,
-    showThemeButtons,
     showViewport = false,
     overrideWrapperStyles = {},
     translation
@@ -133,29 +127,14 @@ const CommonEditor = /*#__PURE__*/forwardRef((props, ref) => {
     fixedWidth = "60%",
     fullWidth = "80%",
     hideTools = [],
-    translationMock,
-    uploadFile,
-    resumeUploadState,
-    uploadTerminator,
-    isUploadInProgress = () => {}
+    translationMock
   } = otherProps || {};
   const translationFn = translation || translationMock || (() => {});
-  const getTitleSaveData = title => {
-    const val = debouncedValue.current;
-    const data = {
-      text: serializeToText(val),
-      title: title
-    };
-    if (customProps.onSaveTitle) {
-      const isTitleChanged = true;
-      customProps.onSaveTitle(JSON.stringify(val), data, isTitleChanged);
-    }
-  };
   const editor = useMemo(() => {
     if (collaborativeEditor) return collaborativeEditor;
     const editor = createEditor();
     editor.needLayout = needLayout;
-    editor.getTitleSaveData = getTitleSaveData;
+    editor.translation = translationFn;
     return withCommon(editor, {
       needLayout
     });
@@ -166,11 +145,10 @@ const CommonEditor = /*#__PURE__*/forwardRef((props, ref) => {
   const {
     bannerSpacing,
     pageBgImage,
-    pageColor = "",
+    pageColor,
     color: pageTextColor,
     pageWidth,
     maxWidth: pageMaxWidth,
-    theme: selectedTheme,
     lineHeight
   } = pageSt?.pageProps || {
     bannerSpacing: {
@@ -182,17 +160,10 @@ const CommonEditor = /*#__PURE__*/forwardRef((props, ref) => {
   };
   const classes = editorStyles({
     padHeight: !fullScreen ? otherProps?.padHeight : 20,
-    placeHolderColor: invertColor(pageColor.startsWith("var") ? getVariableValue(pageColor) : pageColor || "#FFF"),
+    placeHolderColor: invertColor(pageColor || "#FFF"),
     theme,
     overrideWrapperStyles
   });
-  const [openTheme, setOpenTheme] = useState(false);
-  const [openAITheme, setOpenAITheme] = useState(false);
-  const [, setThemeUpdated] = useState(0);
-  const triggerRender = () => {
-    setThemeUpdated(prev => prev + 1); // Incrementing forces a re-render while updating theme
-  };
-
   const isMobile = window.matchMedia("(max-width: 899px)")?.matches || false;
   useEffect(() => {
     setValue(draftToSlate({
@@ -235,6 +206,17 @@ const CommonEditor = /*#__PURE__*/forwardRef((props, ref) => {
       title: serializeToText(title?.children) || "Untitled"
     };
   };
+  const getTitleSaveData = title => {
+    const val = debouncedValue.current;
+    const data = {
+      text: serializeToText(val),
+      title: title
+    };
+    if (customProps.onSaveTitle) {
+      const isTitleChanged = true;
+      customProps.onSaveTitle(JSON.stringify(val), data, isTitleChanged);
+    }
+  };
   const getPreviewImage = async (needBackground = false, options = {}) => {
     ReactEditor.blur(editor);
     const dom = needBackground ? editorWrapper?.current : editorWrapper?.current.getElementsByClassName("innert-editor-textbox")[0];
@@ -334,12 +316,6 @@ const CommonEditor = /*#__PURE__*/forwardRef((props, ref) => {
     redo() {
       editor?.redo();
     },
-    toggleTheme() {
-      setOpenTheme(!openTheme);
-    },
-    toggleAITheme() {
-      setOpenAITheme(!openAITheme);
-    },
     getPageSettings: {
       background: pageBgImage && pageBgImage !== "none" ? `url(${pageBgImage})` : pageColor || ""
     }
@@ -394,11 +370,7 @@ const CommonEditor = /*#__PURE__*/forwardRef((props, ref) => {
     ICON_API: "https://assets.agenciflow.com",
     translation: translationFn,
     getTitleSaveData,
-    customLineHeight: lineH,
-    uploadFile,
-    resumeUploadState,
-    uploadTerminator,
-    isUploadInProgress
+    customLineHeight: lineH
   };
   const renderElement = useCallback(props => {
     return /*#__PURE__*/_jsx(Element, {
@@ -547,7 +519,6 @@ const CommonEditor = /*#__PURE__*/forwardRef((props, ref) => {
     }
     return style;
   }, [pageBgImage, pageColor, pageTextColor]);
-  const themeProps = getTheme(selectedTheme);
 
   // const handleContextMenu = (e) => {
   //   if (!readOnly) {
@@ -581,23 +552,7 @@ const CommonEditor = /*#__PURE__*/forwardRef((props, ref) => {
   return /*#__PURE__*/_jsxs(EditorProvider, {
     theme: theme,
     editor: editor,
-    openTheme: openTheme,
-    setOpenTheme: setOpenTheme,
-    triggerRender: triggerRender,
-    children: [showThemeButtons ? /*#__PURE__*/_jsxs("div", {
-      className: "theme-buttons",
-      children: [/*#__PURE__*/_jsx(IconButton, {
-        onClick: () => setOpenTheme(true),
-        className: "themePaintIcon",
-        children: /*#__PURE__*/_jsx(ThemePaintIcon, {})
-      }), /*#__PURE__*/_jsx(IconButton, {
-        onClick: () => setOpenAITheme(true),
-        style: {
-          marginTop: "4px"
-        },
-        children: /*#__PURE__*/_jsx(ThemeAIIcon, {})
-      })]
-    }) : null, /*#__PURE__*/_jsx(FontLoader, {
+    children: [/*#__PURE__*/_jsx(FontLoader, {
       otherProps: {
         services: otherProps?.services
       },
@@ -607,7 +562,6 @@ const CommonEditor = /*#__PURE__*/forwardRef((props, ref) => {
       ...props,
       fullScreen: fullScreen,
       footer: footer || "",
-      selectedTheme: selectedTheme,
       children: /*#__PURE__*/_jsx(Box, {
         component: "div",
         className: `et-wrpr stimulate-${breakpoint} ${editorClass || ""} ${isIframe ? "iframe-editor" : ""}`,
@@ -635,16 +589,13 @@ const CommonEditor = /*#__PURE__*/forwardRef((props, ref) => {
                 id: "slate-wrapper-scroll-container",
                 ref: editorWrapper,
                 onClick: e => {
-                  if (!isReadOnly) {
-                    handleInsertLastElement(e, editor);
-                  }
+                  handleInsertLastElement(e, editor);
                 },
                 onScroll: handleScroll,
                 style: editorWrapperStyle,
                 children: /*#__PURE__*/_jsxs(Box, {
                   component: "div",
                   className: "max-content",
-                  sx: themeProps?.sxProps || {},
                   "data-info": outsideEditorClickLabel,
                   children: [renderTopBanner(), /*#__PURE__*/_jsx("div", {
                     className: "scroll-area",
@@ -714,18 +665,6 @@ const CommonEditor = /*#__PURE__*/forwardRef((props, ref) => {
                     "data-info": outsideEditorClickLabel,
                     onClick: handleFooterClick,
                     children: footer
-                  }), openTheme ? /*#__PURE__*/_jsx(ThemeSettings, {
-                    open: openTheme,
-                    setOpen: setOpenTheme,
-                    editor: editor,
-                    services: otherProps?.services,
-                    appTheme: theme,
-                    customProps: customProps
-                  }) : null, /*#__PURE__*/_jsx(ThemeSettingsAI, {
-                    openAITheme: openAITheme,
-                    setOpenAITheme: setOpenAITheme,
-                    onSaveTheme: otherProps?.onSaveTheme,
-                    theme: theme
                   })]
                 })
               }), !readOnly ? /*#__PURE__*/_jsx(PopupTool, {

package/dist/Editor/DialogWrapper.js

@@ -2,7 +2,6 @@ import React from "react";
 import { Dialog, DialogTitle, DialogContent, IconButton, Grid } from "@mui/material";
 import CloseIcon from "@mui/icons-material/Close";
 import ViewportStimulator from "./common/RnD/Theme/ViewportStimulator";
-import MainThemeProvider from "./common/RnD/Theme/MainThemeProvider";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 const DialogWrapper = props => {
@@ -10,45 +9,40 @@ const DialogWrapper = props => {
     fullScreen,
     onClose,
     children,
-    classes,
-    selectedTheme
+    classes
   } = props;
-  return fullScreen ? /*#__PURE__*/_jsx(MainThemeProvider, {
-    userSelectedTheme: selectedTheme,
-    children: /*#__PURE__*/_jsxs(Dialog, {
-      className: `dialogComp`,
-      open: fullScreen,
-      fullScreen: fullScreen,
-      onClose: onClose,
+  return fullScreen ? /*#__PURE__*/_jsxs(Dialog, {
+    className: `dialogComp`,
+    open: fullScreen,
+    fullScreen: fullScreen,
+    onClose: onClose,
+    style: {
+      zIndex: 1000
+    },
+    sx: classes.fullScreenWrapper,
+    children: [/*#__PURE__*/_jsx(DialogTitle, {
       style: {
-        zIndex: 1000
+        padding: "6px 8px"
       },
-      sx: classes.fullScreenWrapper,
-      children: [/*#__PURE__*/_jsx(DialogTitle, {
-        style: {
-          padding: "6px 8px"
-        },
+      children: /*#__PURE__*/_jsx(Grid, {
         children: /*#__PURE__*/_jsx(Grid, {
-          children: /*#__PURE__*/_jsx(Grid, {
+          style: {
+            display: "flex",
+            justifyContent: "end"
+          },
+          children: /*#__PURE__*/_jsx(IconButton, {
+            onClick: onClose,
             style: {
-              display: "flex",
-              justifyContent: "end"
+              background: "rgba(255,255,255,0.5)"
             },
-            children: /*#__PURE__*/_jsx(IconButton, {
-              onClick: onClose,
-              style: {
-                background: "rgba(255,255,255,0.5)"
-              },
-              children: /*#__PURE__*/_jsx(CloseIcon, {})
-            })
+            children: /*#__PURE__*/_jsx(CloseIcon, {})
           })
         })
-      }), /*#__PURE__*/_jsx(DialogContent, {
-        children: children
-      })]
-    })
+      })
+    }), /*#__PURE__*/_jsx(DialogContent, {
+      children: children
+    })]
   }) : /*#__PURE__*/_jsx(ViewportStimulator, {
-    selectedTheme: selectedTheme,
     children: children
   });
 };

package/dist/Editor/Editor.css

@@ -1342,16 +1342,16 @@ blockquote {
 
 ::selection {
   color: inherit;
-  /* background: rgba(35, 131, 226, 0.35) !important; */ 
+  background: rgba(35, 131, 226, 0.35) !important;
 }
 
 ::-moz-selection {
-  /* background: rgba(35, 131, 226, 0.35) !important; */
+  background: rgba(35, 131, 226, 0.35) !important;
   color: inherit;
 }
 
 ::-webkit-selection {
-  /* background: rgba(35, 131, 226, 0.35) !important; */
+  background: rgba(35, 131, 226, 0.35) !important;
   color: inherit;
 }
 
@@ -1383,39 +1383,6 @@ code.markcode {
   font-family: 'Source Code Pro' !important;
 }
 
-.theme-buttons {
-  display: flex;
-  justify-content: end;
-  align-items: center;
-  margin: auto;
-  position: absolute;
-  top: 60px;
-  right: 20px;
-  z-index: 1000;
-}
-
-.themePaintIcon:hover .iconBorder {
-  fill: #2563EB;
-}
-
-.themePaintIcon:hover .iconStroke {
-  stroke: #2563EB;
-}
-
 .hyperLink {
   word-break: break-all;
-}
-
-.truncateText {
-  display: inline-block;
-  width: 100%;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-
-@media only screen and (max-width: 600px) {
-  .truncateText {
-    width: 180px;
-  }
-}
+}

package/dist/Editor/Elements/AppHeader/AppHeader.js

@@ -268,7 +268,7 @@ function AppHeader(props) {
               style: {
                 display: "inline-flex",
                 alignItems: "center",
-                color: textColor || "#000000",
+                color: textColor,
                 fontSize: logoFontSize,
                 fontFamily: titleFontFamily,
                 justifyContent: isLogoRight ? "end" : "start"
@@ -323,7 +323,7 @@ function AppHeader(props) {
                     fontFamily: fontFamily,
                     textTransform: "none",
                     fontSize: fontSize || "16px",
-                    color: textColor || "#000",
+                    color: textColor || "#FFF",
                     background: bgColor || "none",
                     border: borderColorHover ? `1px solid transparent` : "none",
                     "& .m-settings": {
@@ -339,7 +339,7 @@ function AppHeader(props) {
                       background: "#FFF"
                     },
                     "&:hover": {
-                      color: textColorHover || textColor || "#000",
+                      color: textColorHover || textColor || "#FFF",
                       background: bgColorHover || bgColor || "none",
                       border: borderColorHover ? `1px solid ${borderColorHover}` : "none",
                       "& .m-settings": {

package/dist/Editor/Elements/Attachments/Attachments.js

@@ -1,141 +1,33 @@
-import React, { useEffect, useRef, useState } from "react";
-import Box from '@mui/material/Box';
-import Card from '@mui/material/Card';
-import CardMedia from '@mui/material/CardMedia';
-import CardContent from '@mui/material/CardContent';
-import Typography from '@mui/material/Typography';
-import CircularProgress from '@mui/material/CircularProgress';
-import IconButton from '@mui/material/IconButton';
+import React from "react";
+import { Box, Card, CardMedia, CardContent, Typography } from "@mui/material";
 import PictureAsPdfIcon from "@mui/icons-material/PictureAsPdf";
 import TextSnippetIcon from "@mui/icons-material/TextSnippet";
-import HighlightOffRoundedIcon from "@mui/icons-material/HighlightOffRounded";
-import { Transforms } from "slate";
-import { ReactEditor, useSlateStatic } from "slate-react";
 import { formatDate } from "../../utils/helper";
 import Icon from "../../common/Icon";
 import { getEmbedURL } from "../../helper";
 import Video from "../Embed/Video";
-import { formatFileSize } from "../../service/fileupload";
-import { useEditorContext } from "../../hooks/useMouseMove";
-import useAttachmentStyle from "./AttachmentStyles";
 import { jsx as _jsx } from "react/jsx-runtime";
-import { Fragment as _Fragment } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 const Attachments = props => {
   const {
     attributes,
     element,
-    children,
-    customProps
+    children
   } = props;
   const {
     url,
     type,
-    date,
-    fileName,
-    isUploading,
-    file,
-    fileSize,
-    uniqueId
+    date
   } = element;
-  const {
-    resumeUploadState,
-    services,
-    uploadFile,
-    uploadTerminator
-  } = customProps || {};
   const {
     isEmbed
   } = getEmbedURL(element, true);
   const getLastName = url?.split("/").pop();
-  const fileName2 = `${decodeURIComponent(getLastName)}`;
-  const editor = useSlateStatic();
-  const {
-    theme
-  } = useEditorContext();
-  const classes = useAttachmentStyle(theme);
-  const path = ReactEditor.findPath(editor, element);
-  const [redirectURL, setRedirectURL] = useState(isUploading ? null : url);
-  const [uploadStatus, setUploadStatus] = useState({
-    isUploading: !!isUploading,
-    uploadPercentage: 0,
-    fileName: fileName || fileName2,
-    fileSize: fileSize
-  });
-  const xhrRef = useRef(null);
-  const cancelUpload = () => {
-    Transforms.removeNodes(editor, {
-      at: path
-    });
-    uploadTerminator(uniqueId, setUploadStatus);
-  };
-  const onSave = url => {
-    setRedirectURL(url);
-    Transforms.setNodes(editor, {
-      url: url,
-      isUploading: false
-    }, {
-      at: path
-    });
-    setUploadStatus({
-      isUploading: false,
-      uploadPercentage: 0,
-      fileName: null,
-      fileSize: null
-    });
-  };
-  const handleFileUpload = async () => {
-    if (!file) return;
-    try {
-      const id = !uniqueId ? crypto?.randomUUID() : uniqueId;
-      const result = await services("uploadFile", file);
-      const uploadUrl = result?.data?.[0];
-      const fileEntry = {
-        file: file,
-        xhrRef,
-        presidnedURL: uploadUrl,
-        status: "uploading"
-      };
-      uploadFile(id, fileEntry, setUploadStatus, onSave, "document");
-      Transforms.setNodes(editor, {
-        uniqueId: id,
-        isUploading: true
-      }, {
-        at: path
-      });
-    } catch (error) {
-      console.error("Upload failed:", error);
-      setUploadStatus(prev => ({
-        ...prev,
-        isUploading: false,
-        uploadPercentage: 0
-      }));
-    }
-  };
-  const noUploadTracks = () => {
-    setUploadStatus({
-      isUploading: false,
-      uploadPercentage: 0,
-      fileName: null,
-      fileSize: null
-    });
-    setRedirectURL(null);
-    Transforms.removeNodes(editor, {
-      at: path
-    });
-  };
-  useEffect(() => {
-    if (uniqueId && isUploading) {
-      resumeUploadState(uniqueId, setUploadStatus, onSave, noUploadTracks, "document");
-    } else if (file && isUploading) {
-      handleFileUpload();
-    }
-  }, []);
+  const fileName = `${decodeURIComponent(getLastName)}`;
   return !isEmbed ? /*#__PURE__*/_jsxs(Box, {
     component: "div",
     className: "attachment-wrpr-ev2",
     ...attributes,
-    sx: classes?.attachmentRoot,
     contentEditable: false,
     style: {
       display: "block"
@@ -149,8 +41,7 @@ const Attachments = props => {
         padding: "8px",
         boxShadow: "none",
         border: "1px solid #eae9e9",
-        backgroundColor: "#F7F7F7",
-        position: "relative"
+        backgroundColor: "#F7F7F7"
       },
       children: [/*#__PURE__*/_jsx(CardMedia, {
         sx: {
@@ -176,7 +67,7 @@ const Attachments = props => {
         })
       }), /*#__PURE__*/_jsxs(CardContent, {
         component: "a",
-        href: redirectURL,
+        href: url,
         target: "_blank",
         style: {
           display: "flex",
@@ -185,8 +76,7 @@ const Attachments = props => {
           padding: "8px",
           textDecoration: "none",
           flexDirection: "column",
-          color: "#0F172A",
-          flexGrow: uploadStatus?.isUploading && 1
+          color: "#0F172A"
         },
         children: [/*#__PURE__*/_jsx(Typography, {
           style: {
@@ -195,48 +85,16 @@ const Attachments = props => {
             fontSize: "14px"
           },
           component: "div",
-          className: "truncateText",
-          children: fileName2 || fileName
-        }), /*#__PURE__*/_jsxs(Typography, {
+          children: fileName
+        }), /*#__PURE__*/_jsx(Typography, {
           style: {
             fontWeight: "normal",
             color: "#64748b",
             fontSize: "11px"
           },
           component: "div",
-          className: "uploadinDetails",
-          children: [uploadStatus?.isUploading && /*#__PURE__*/_jsxs(_Fragment, {
-            children: [/*#__PURE__*/_jsx(Typography, {
-              sx: {
-                fontSize: 12,
-                color: "#64748b"
-              },
-              children: `${formatFileSize(fileSize)}`
-            }), /*#__PURE__*/_jsx(CircularProgress, {
-              variant: "determinate",
-              value: uploadStatus?.uploadPercentage ?? 0,
-              size: 20,
-              thickness: 5
-            }), /*#__PURE__*/_jsx(Typography, {
-              sx: {
-                fontSize: 12,
-                color: "#64748b"
-              },
-              children: `${uploadStatus?.uploadPercentage?.toFixed(0) ?? 0}%`
-            })]
-          }), !uploadStatus?.isUploading && formatDate(date)]
+          children: formatDate(date)
         })]
-      }), uploadStatus?.isUploading && /*#__PURE__*/_jsx(IconButton, {
-        onClick: cancelUpload,
-        sx: {
-          position: "absolute",
-          right: 4,
-          top: 4
-        },
-        "aria-label": "Cancel upload",
-        size: "small",
-        className: "cancelBtn",
-        children: /*#__PURE__*/_jsx(HighlightOffRoundedIcon, {})
       })]
     }), /*#__PURE__*/_jsx("span", {
       contentEditable: false,

package/dist/Editor/Elements/Attachments/AttachmentsButton.js

@@ -4,7 +4,6 @@ import ToolbarIcon from "../../common/ToolbarIcon";
 import Icon from "../../common/Icon";
 import ImageSelector from "../../common/ImageSelector/ImageSelector";
 import { insertAttachments } from "../../utils/attachments";
-import { insertUploadStatusNodeForAttachment } from "../../service/fileupload";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Fragment as _Fragment } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
@@ -22,13 +21,9 @@ const AttachmentsButton = props => {
     SetOpen(true);
   };
   const onSelectImage = url => {
-    if (!url?.isUpload && url?.embedURL) {
-      insertAttachments(editor, {
-        url: url?.embedURL
-      });
-    } else {
-      insertUploadStatusNodeForAttachment(editor, url?.file);
-    }
+    insertAttachments(editor, {
+      url
+    });
     handleClose();
   };
   const handleClose = () => {