@flozy/editor 4.9.4 → 4.9.6

package/dist/Editor/Toolbar/FormatTools/Dropdown.js

@@ -2,6 +2,7 @@ import React from "react";
 import { Select, MenuItem } from "@mui/material";
 import { addMarkData, activeMark } from "../../utils/SlateUtilityFunctions.js";
 import { fontFamilyMap } from "../../utils/font";
+import KeyboardArrowDownRoundedIcon from '@mui/icons-material/KeyboardArrowDownRounded';
 import { jsx as _jsx } from "react/jsx-runtime";
 const Dropdown = ({
   classes,
@@ -29,6 +30,7 @@ const Dropdown = ({
       }
     },
     sx: classes.textFormatSelect,
+    IconComponent: KeyboardArrowDownRoundedIcon,
     children: options.map((item, index) => /*#__PURE__*/_jsx(MenuItem
     // style={{ fontFamily: item.text }}
     , {

package/dist/Editor/Toolbar/FormatTools/FontFamilyAutocomplete.js

@@ -3,6 +3,7 @@ import { Autocomplete, TextField } from "@mui/material";
 import { activeMark, addMarkData } from "../../utils/SlateUtilityFunctions.js";
 import usePopupStyle from "../PopupTool/PopupToolStyle.js";
 import { useEditorContext } from "../../hooks/useMouseMove.js";
+import KeyboardArrowDownRoundedIcon from '@mui/icons-material/KeyboardArrowDownRounded';
 import { jsx as _jsx } from "react/jsx-runtime";
 const FontFamilyAutocomplete = ({
   editor,
@@ -57,6 +58,7 @@ const FontFamilyAutocomplete = ({
         children: option
       });
     },
+    popupIcon: /*#__PURE__*/_jsx(KeyboardArrowDownRoundedIcon, {}),
     renderInput: params => /*#__PURE__*/_jsx(TextField, {
       sx: {
         "& .MuiInputBase-root.MuiOutlinedInput-root": {

package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/index.js

@@ -1,4 +1,4 @@
-import { Button, Fade, Grid, Paper, Popper } from "@mui/material";
+import { Fade, Grid, IconButton, Paper, Popper } from "@mui/material";
 import SelectTypography from "./SelectTypography";
 import SelectList from "./SelectList";
 import { toolbarGroups } from "../../toolbarGroups";
@@ -95,9 +95,9 @@ const MiniTextFormat = props => {
           active: isBlockActive(editor, link.format),
           editor: editor,
           customProps: customProps
-        }, link.id), /*#__PURE__*/_jsx(Button, {
+        }, link.id), /*#__PURE__*/_jsx(IconButton, {
           onClick: e => setAnchorEl(document.getElementById("mini-text-editor-wrapper")),
-          className: "textSettingsIcon",
+          className: `textSettingsIcon ${open ? "btnActive" : ""}`,
           children: /*#__PURE__*/_jsx(TextToolIcon, {})
         }), /*#__PURE__*/_jsx(Popper, {
           id: id,

package/dist/Editor/Toolbar/PopupTool/PopupToolStyle.js

@@ -96,8 +96,29 @@ const usePopupStyle = theme => ({
         width: "100%",
         maxHeight: "fit-content"
       },
+      "& .MuiTab-root": {
+        textTransform: "capitalize",
+        color: "#64748B",
+        borderBottom: `1.5px solid ${theme?.palette?.editor?.deviderBgColor}`
+      },
+      "& .Mui-selected": {
+        color: `${theme?.palette?.editor?.textColor} !important`,
+        fontWeight: "700 !important"
+      },
+      "& .MuiTabs-indicator": {
+        background: "#2563EB"
+      },
+      "& .MuiTabScrollButton-horizontal": {
+        borderBottom: "unset !important"
+      },
       "@media only screen and (max-width: 599px)": {
         width: "330px"
+      },
+      "& .MuiCardContent-root": {
+        color: theme?.palette?.editor?.textColor,
+        fontFamily: "Inter, sans-serif",
+        fontSize: "12px",
+        fontWeight: "500"
       }
     },
     "& .headerContainer": {},
@@ -122,38 +143,70 @@ const usePopupStyle = theme => ({
           fill: theme?.palette?.type === "dark" ? "none" : ""
         }
       },
+      "& .signatureElementIcon": {
+        "& path": {
+          fill: `${theme?.palette?.editor?.closeButtonSvgStroke}`
+        }
+      },
+      "& .commonSvgStyle": {
+        "& path": {
+          stroke: `${theme?.palette?.editor?.closeButtonSvgStroke}`
+        }
+      },
+      "& .commonSvgStyle2": {
+        "& path": {
+          stroke: `${theme?.palette?.editor?.closeButtonSvgStroke}`
+        }
+      },
+      "& .colorBoxElementIcon": {
+        "& path": {
+          stroke: `${theme?.palette?.editor?.closeButtonSvgStroke}`,
+          fill: "none"
+        }
+      },
+      "& .gridElementIcon": {
+        "& path": {
+          stroke: `${theme?.palette?.editor?.closeButtonSvgStroke}`,
+          fill: `${theme?.palette?.editor?.closeButtonSvgStroke}`
+        }
+      },
+      "& .newLineElementIcon": {
+        "& path": {
+          fill: `${theme?.palette?.editor?.closeButtonSvgStroke}`
+        }
+      },
       "&:hover": {
         backgroundColor: `${theme?.palette?.editor?.menuOptionSelectedOption} !important`,
         "& .signatureElementIcon": {
           "& path": {
-            fill: `${theme?.palette?.editor?.menuOptionTextColor} !important`
+            fill: `${theme?.palette?.editor?.menuOptionTextColor}`
           }
         },
         "& .commonSvgStyle": {
           "& path": {
-            stroke: `${theme?.palette?.editor?.menuOptionTextColor} !important`
+            stroke: `${theme?.palette?.editor?.menuOptionTextColor}`
           }
         },
         "& .commonSvgStyle2": {
           "& path": {
-            stroke: `${theme?.palette?.editor?.menuOptionTextColor} !important`
+            stroke: `${theme?.palette?.editor?.menuOptionTextColor}`
           }
         },
         "& .colorBoxElementIcon": {
           "& path": {
-            stroke: `${theme?.palette?.editor?.menuOptionTextColor} !important`,
+            stroke: `${theme?.palette?.editor?.menuOptionTextColor}`,
             fill: "none"
           }
         },
         "& .gridElementIcon": {
           "& path": {
-            stroke: `${theme?.palette?.editor?.menuOptionTextColor} !important`,
-            fill: `${theme?.palette?.editor?.menuOptionTextColor} !important`
+            stroke: `${theme?.palette?.editor?.menuOptionTextColor}`,
+            fill: `${theme?.palette?.editor?.menuOptionTextColor}`
           }
         },
         "& .newLineElementIcon": {
           "& path": {
-            fill: `${theme?.palette?.editor?.menuOptionTextColor} !important`
+            fill: `${theme?.palette?.editor?.menuOptionTextColor}`
           }
         }
       },
@@ -194,6 +247,11 @@ const usePopupStyle = theme => ({
     },
     "@media only screen and (max-width: 599px)": {
       width: "330px"
+    },
+    "& .textFormatMUIIcon": {
+      "& svg": {
+        color: theme?.palette?.editor?.closeButtonSvgStroke
+      }
     }
   },
   textFormatLabel: {
@@ -244,58 +302,64 @@ const usePopupStyle = theme => ({
   textAlignButtons: {
     "& .justifyIcon": {
       "& path": {
-        fill: `${theme?.palette?.editor?.svgTextAlignStrokeColor} !important`,
-        stroke: `${theme?.palette?.editor?.svgTextAlignStrokeColor} !important`
+        fill: `${theme?.palette?.editor?.svgTextAlignStrokeColor}`,
+        stroke: `${theme?.palette?.editor?.svgTextAlignStrokeColor}`
       }
     },
     "& .textAlignIconSameStyles": {
       "& path": {
-        fill: `${theme?.palette?.editor?.svgTextAlignStrokeColor} !important`
+        fill: `${theme?.palette?.editor?.svgTextAlignStrokeColor}`
       }
     },
     "& .orderedListIcon": {
       "& path": {
-        stroke: `${theme?.palette?.editor?.svgTextAlignStrokeColor} !important`
+        stroke: `${theme?.palette?.editor?.svgTextAlignStrokeColor}`
       },
       "& text": {
-        fill: `${theme?.palette?.editor?.svgTextAlignStrokeColor} !important`
+        fill: `${theme?.palette?.editor?.svgTextAlignStrokeColor}`
       }
     },
     "& .bulletedListTextIcon": {
       "& path": {
-        fill: `${theme?.palette?.editor?.svgTextAlignStrokeColor} !important`,
-        stroke: `${theme?.palette?.editor?.svgTextAlignStrokeColor} !important`
+        fill: `${theme?.palette?.editor?.svgTextAlignStrokeColor}`,
+        stroke: `${theme?.palette?.editor?.svgTextAlignStrokeColor}`
       },
       "& circle": {
-        fill: `${theme?.palette?.editor?.svgTextAlignStrokeColor} !important`
+        fill: `${theme?.palette?.editor?.svgTextAlignStrokeColor}`
       }
     },
     "& .checkedListTextIcon": {
       "& path": {
-        stroke: `${theme?.palette?.editor?.svgTextAlignStrokeColor} !important`
+        stroke: `${theme?.palette?.editor?.svgTextAlignStrokeColor}`
       }
     },
     "& .accordianListTextIcon": {
       // stroke: `${theme?.palette?.editor?.svgTextAlignStrokeColor} !important`,
       "& svg": {
-        fill: `${theme?.palette?.editor?.svgTextAlignStrokeColor} !important`,
-        stroke: `${theme?.palette?.editor?.svgTextAlignStrokeColor} !important`
+        fill: `${theme?.palette?.editor?.svgTextAlignStrokeColor}`,
+        stroke: `${theme?.palette?.editor?.svgTextAlignStrokeColor}`
       },
       "& path": {
-        fill: `${theme?.palette?.editor?.svgTextAlignStrokeColor} !important`,
-        stroke: `${theme?.palette?.editor?.svgTextAlignStrokeColor} !important`
+        fill: `${theme?.palette?.editor?.svgTextAlignStrokeColor}`,
+        stroke: `${theme?.palette?.editor?.svgTextAlignStrokeColor}`
       }
     }
   },
   autoCompleteaFontFamily: {
     "& .MuiOutlinedInput-root": {
       borderRadius: "8px",
-      backgroundColor: `${theme?.palette?.editor?.inputFieldBgColor} !important`,
+      backgroundColor: `${theme?.palette?.editor?.inputFieldBgColor}`,
       fontSize: "14px",
-      height: "36px"
+      height: "36px",
+      paddingLeft: "15px !important"
     },
     "& .MuiOutlinedInput-notchedOutline": {
       border: `1px solid ${theme?.palette?.editor?.inputFieldBorder} !important`
+    },
+    '& .MuiInputBase-root': {
+      '& input': {
+        border: "none !important"
+      }
     }
   },
   textFormatSelect: {
@@ -465,7 +529,8 @@ const usePopupStyle = theme => ({
     },
     "& .colorPicker": {
       background: theme?.palette?.editor?.inputFieldBgColor,
-      borderRadius: "0px 7px 7px 0px"
+      borderRadius: "0px 7px 7px 0px",
+      padding: "0px"
     },
     "& .vl": {
       background: theme?.palette?.editor?.borderColor,
@@ -506,7 +571,8 @@ const usePopupStyle = theme => ({
     },
     "& .colorPicker": {
       background: theme?.palette?.editor?.inputFieldBgColor,
-      borderRadius: "0px 7px 7px 0px"
+      borderRadius: "0px 7px 7px 0px",
+      padding: "0px"
     },
     "& .vl": {
       background: theme?.palette?.editor?.borderColor,
@@ -691,8 +757,11 @@ const usePopupStyle = theme => ({
       }
     },
     "& .default-color-panel": {
+      gridTemplateColumns: "repeat(auto-fill, 24px)",
       "& .default-color-panel_item": {
-        borderRadius: "50%"
+        borderRadius: "50%",
+        width: "16px",
+        height: "16px"
       }
     }
   },
@@ -813,17 +882,18 @@ const usePopupStyle = theme => ({
     "& .MuiPopover-paper": {
       maxHeight: "140px",
       // minWidth: "130px",
-      border: "1px solid #E4E8EB",
-      background: `${theme?.palette?.editor?.background} !important`,
+      // border: "1px solid #E4E8EB",
+      background: `${theme?.palette?.editor?.textWeightPopUpBackground} !important`,
       overflowY: "scroll",
-      padding: "6px 12px 6px 0px",
+      padding: "3px 12px 8px 2px",
+      borderRadius: "8px",
       "@media only screen and (max-width: 600px)": {
         marginTop: "-40px"
       }
     },
     "& .customSelectOptionLabel": {
       color: theme?.palette?.editor?.textColor || "black",
-      margin: "0px 6px 0px 6px",
+      margin: "6px 6px 0px 6px",
       width: "100%",
       justifyContent: "start",
       paddingRight: "20px",
@@ -836,8 +906,40 @@ const usePopupStyle = theme => ({
         background: `${theme?.palette?.action?.selected} !important`
       },
       "&.selected": {
-        color: `#2563EB !important`,
-        background: `#E9F3FE !important`
+        color: `${theme?.palette?.editor?.menuOptionTextColor} !important`,
+        background: `${theme?.palette?.editor?.menuOptionSelectedOption} !important`,
+        "& .orderedListIcon": {
+          "& path": {
+            stroke: `${theme?.palette?.editor?.menuOptionsSelectedTextColor}`
+          },
+          "& text": {
+            fill: `${theme?.palette?.editor?.menuOptionsSelectedTextColor}`
+          }
+        },
+        "& .bulletedListTextIcon": {
+          "& path": {
+            fill: `${theme?.palette?.editor?.menuOptionsSelectedTextColor}`,
+            stroke: `${theme?.palette?.editor?.menuOptionsSelectedTextColor}`
+          },
+          "& circle": {
+            fill: `${theme?.palette?.editor?.menuOptionsSelectedTextColor}`
+          }
+        },
+        "& .checkedListTextIcon": {
+          "& path": {
+            stroke: `${theme?.palette?.editor?.menuOptionsSelectedTextColor}`
+          }
+        },
+        "& .accordianIconSvgTextFormat": {
+          "& path": {
+            stroke: `${theme?.palette?.editor?.menuOptionsSelectedTextColor} !important`
+          }
+        },
+        "& .textAlignIconSameStyles": {
+          "& path": {
+            fill: `${theme?.palette?.editor?.menuOptionsSelectedTextColor}`
+          }
+        }
       }
     },
     "& .menuOptions": {

package/dist/Editor/Toolbar/PopupTool/TextFormat.js

@@ -125,6 +125,7 @@ const TextFormat = props => {
         item: true,
         xs: 12,
         sx: classes.textFormatField,
+        className: "textFormatMUIIcon",
         children: /*#__PURE__*/_jsx(FontFamilyAutocomplete, {
           classes: classes,
           ...fontFamilies,
@@ -147,6 +148,7 @@ const TextFormat = props => {
           item: true,
           xs: 12,
           sx: classes.textFormatField3,
+          className: "textFormatMUIIcon",
           children: /*#__PURE__*/_jsx(Dropdown, {
             classes: classes,
             ...fontWeight,

package/dist/Editor/common/ColorPickerButton.js

@@ -43,9 +43,10 @@ const ColorPickerButton = props => {
         background: value,
         height: "22px",
         minWidth: "22px",
-        borderRadius: "26px",
-        border: "2px solid #E7E7E7"
+        borderRadius: "26px"
+        // border: "2px solid #E7E7E7",
       },
+
       onClick: handleColorPicker
     }), /*#__PURE__*/_jsx(Popover, {
       open: open,

package/dist/Editor/common/MentionsPopup/Styles.js

@@ -123,13 +123,7 @@ const usePopupStyles = theme => ({
               "& path": {
                 stroke: `${theme?.palette?.editor?.menuOptionsSelectedTextColor} !important`
               }
-            },
-            "& .commonSvgStyle2": {
-              background: "red !important"
             }
-          },
-          "& .renderComp": {
-            backgroundColor: "red !important"
           }
         },
         "&:hover": {
@@ -162,7 +156,7 @@ const usePopupStyles = theme => ({
     marginBottom: "10px",
     fontSize: "14px",
     fontWeight: "bold",
-    borderBottom: "1px solid #DCE4EC"
+    borderBottom: `1px solid ${theme?.palette?.editor?.deviderBgColor}`
   },
   listItem: {
     cursor: "pointer",

package/dist/Editor/common/RnD/ElementSettings/Settings/FormSettings.js

@@ -62,6 +62,7 @@ const FormSettings = props => {
       MuiAccordion: {
         styleOverrides: {
           root: {
+            background: theme?.palette?.editor?.miniToolBarBackground,
             "& .MuiAccordionSummary-root": {
               flexDirection: "row-reverse",
               "& .MuiSvgIcon-root": {

package/dist/Editor/common/RnD/index.js

@@ -14,7 +14,7 @@ import BoundaryLine from "./GuideLines/BoundaryLine";
 import ContextMenu from "./ContextMenu";
 import VirtualElement from "./VirtualElement";
 import { ItemTypes } from "./ElementSettings/settingsConstants";
-import { focusSelection, clearSelection } from "../../helper";
+import { clearSelection } from "../../helper";
 import { selectText } from "../../utils/helper";
 import { removeSign } from "./ElementSettings/OtherSettings";
 import useDragging from "../../hooks/useDragging";

package/dist/Editor/common/StyleBuilder/fieldTypes/backgroundImage.js

@@ -72,6 +72,11 @@ const BackgroundImage = props => {
             children: "REMOVE"
           }) : /*#__PURE__*/_jsx(Grid, {
             className: "uploadImageText",
+            sx: {
+              padding: 0,
+              background: `${theme?.palette?.editor?.inputFieldBgColor}`,
+              border: `1px solid ${theme?.palette?.editor?.inputFieldBorder}`
+            },
             children: /*#__PURE__*/_jsxs(Button, {
               component: "label",
               variant: "text",

package/dist/Editor/common/StyleBuilder/fieldTypes/card.js

@@ -1,6 +1,7 @@
 import { Box, Card, Checkbox, FormControlLabel, Grid, Tooltip, Typography } from "@mui/material";
 import React from "react";
 import Icon from "../../Icon";
+import { useEditorContext } from "../../../hooks/useMouseMove";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Fragment as _Fragment } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
@@ -15,7 +16,10 @@ const RenderCard = ({
   return /*#__PURE__*/_jsx(Card, {
     sx: {
       position: 'relative',
-      padding: "10px"
+      padding: "10px",
+      '& .MuiCheckbox-root svg': {
+        fill: 'unset !important'
+      }
     },
     children: /*#__PURE__*/_jsx(FormControlLabel, {
       control: /*#__PURE__*/_jsx(Checkbox, {
@@ -81,6 +85,9 @@ const CardsMapping = props => {
     selectedCard,
     infoIcon
   } = data;
+  const {
+    theme
+  } = useEditorContext();
   const activeCard = value === selectedCard;
   const handleChange = e => {
     if (selectedCard === data?.value) {
@@ -99,7 +106,8 @@ const CardsMapping = props => {
     sx: {
       marginBottom: "12px",
       "& .MuiPaper-root": {
-        border: activeCard ? "1px solid #2563EB" : "1px solid #C8D8FA",
+        background: theme?.palette?.editor?.miniToolBarBackground,
+        border: activeCard ? "1px solid #2563EB" : `1px solid ${theme?.palette?.editor?.inputFieldBorder}`,
         borderRadius: "8px",
         boxShadow: activeCard ? "0px 4px 16px 0px #2563EB40" : "unset"
       }

package/dist/Editor/common/Uploader.js

@@ -4,6 +4,7 @@ import { convertBase64 } from "../utils/helper";
 import { uploadFile } from "../service/fileupload";
 import Icon from "./Icon";
 import UploadStyles from "../common/ImageSelector/UploadStyles";
+import { useEditorContext } from "../hooks/useMouseMove";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Fragment as _Fragment } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
@@ -18,6 +19,9 @@ const Uploader = props => {
   const [base64, setBase64] = useState(value?.url);
   const [fileName, setFileName] = useState("");
   const [uploading, setUploading] = useState(false);
+  const {
+    theme
+  } = useEditorContext();
   const handleChange = async e => {
     const uFile = e.target.files[0];
     const strImage = await convertBase64(uFile);
@@ -98,6 +102,10 @@ const Uploader = props => {
         className: "uploadImageSection",
         children: base64 ? renderThumb() : /*#__PURE__*/_jsx(Grid, {
           className: "uploadImageText",
+          sx: {
+            background: `${theme?.palette?.editor?.inputFieldBgColor}`,
+            border: `1px solid ${theme?.palette?.editor?.inputFieldBorder}`
+          },
           children: /*#__PURE__*/_jsxs(Button, {
             component: "label",
             variant: "text",

package/dist/Editor/common/iconListV2.js

@@ -628,6 +628,7 @@ export const BoldTextFormatIcon = props => /*#__PURE__*/_jsx("svg", {
   viewBox: "0 0 12 16",
   fill: "none",
   xmlns: "http://www.w3.org/2000/svg",
+  className: "fill-path",
   children: /*#__PURE__*/_jsx("path", {
     d: "M0.598011 15.3564V0.81099H5.92472C6.95691 0.81099 7.81155 0.981445 8.48864 1.32235C9.16572 1.65853 9.67235 2.11544 10.0085 2.69309C10.3447 3.26601 10.5128 3.91232 10.5128 4.63201C10.5128 5.23807 10.4015 5.74944 10.179 6.1661C9.95644 6.57804 9.65814 6.90948 9.28409 7.16042C8.91477 7.40663 8.50758 7.58656 8.0625 7.7002V7.84224C8.54545 7.86591 9.01657 8.02216 9.47585 8.31099C9.93987 8.59508 10.3234 8.99991 10.6264 9.52548C10.9295 10.051 11.081 10.6903 11.081 11.4431C11.081 12.1865 10.9058 12.8541 10.5554 13.4459C10.2098 14.0331 9.67472 14.4994 8.95028 14.8451C8.22585 15.186 7.30019 15.3564 6.1733 15.3564H0.598011ZM2.79261 13.4743H5.96023C7.01136 13.4743 7.7642 13.2707 8.21875 12.8635C8.6733 12.4564 8.90057 11.9474 8.90057 11.3366C8.90057 10.8773 8.78456 10.4559 8.55256 10.0724C8.32055 9.68883 7.98911 9.38343 7.55824 9.15616C7.1321 8.92889 6.62547 8.81525 6.03835 8.81525H2.79261V13.4743ZM2.79261 7.1036H5.73295C6.22538 7.1036 6.66809 7.00891 7.06108 6.81951C7.45881 6.63012 7.77367 6.36497 8.00568 6.02406C8.24242 5.67841 8.3608 5.27122 8.3608 4.80247C8.3608 4.20114 8.15009 3.69688 7.72869 3.28968C7.30729 2.88249 6.66099 2.67889 5.78977 2.67889H2.79261V7.1036Z",
     fill: "#64748B"
@@ -1200,6 +1201,7 @@ export function DragIcon() {
     viewBox: "0 0 10 6",
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg",
+    className: "dragIcon",
     children: [/*#__PURE__*/_jsx("ellipse", {
       cx: "1.49462",
       cy: "4.42384",

package/dist/Editor/common/iconslist.js

@@ -135,6 +135,7 @@ export const StrikethroughIcon = props => /*#__PURE__*/_jsx("svg", {
   height: "15",
   viewBox: "0 0 15 15",
   fill: "none",
+  className: "fill-path",
   children: /*#__PURE__*/_jsx("path", {
     className: "strokeFillPath",
     d: "M2.7607 11.125C2.7607 13.0718 4.33885 14.65 6.28568 14.65H8.21432C10.1611 14.65 11.7393 13.0718 11.7393 11.125V10.6429C11.7393 9.78254 11.4309 8.99403 10.9189 8.38214H13.5179C13.867 8.38214 14.15 8.0991 14.15 7.75C14.15 7.4009 13.867 7.11786 13.5179 7.11786H8.21597H8.21435H6.28579C5.03727 7.11786 4.02509 6.10568 4.02509 4.85714V4.375C4.02509 3.12647 5.03727 2.11429 6.28579 2.11429H8.21435C9.46288 2.11429 10.4751 3.12647 10.4751 4.375V4.84874C10.4751 5.19784 10.7581 5.48088 11.1072 5.48088C11.4563 5.48088 11.7393 5.19784 11.7393 4.84874V4.375C11.7393 2.42817 10.1612 0.85 8.21435 0.85H6.28579C4.33897 0.85 2.76081 2.42817 2.76081 4.375V4.85714C2.76081 5.71746 3.06916 6.50597 3.58108 7.11786H0.982141C0.633044 7.11786 0.35 7.4009 0.35 7.75C0.35 8.0991 0.633044 8.38214 0.982141 8.38214H8.21424L8.21556 8.38214C8.21559 8.38214 8.21562 8.38214 8.21564 8.38214C9.46353 8.38289 10.4749 9.39474 10.4749 10.6429V11.125C10.4749 12.3735 9.46276 13.3857 8.21424 13.3857H6.28568C5.03715 13.3857 4.02498 12.3735 4.02498 11.125V10.6429C4.02498 10.2938 3.74193 10.0107 3.39284 10.0107C3.04374 10.0107 2.7607 10.2938 2.7607 10.6429V11.125Z",

package/dist/Editor/commonStyle.js

@@ -134,8 +134,7 @@ const useCommonStyle = theme => ({
           }
         },
         "& .active ": {
-          border: `1px solid #2563EB !important`,
-          background: `${theme?.palette?.editor?.signaturePopUpTabButtonSelectedBg} !important`
+          border: `1px solid #2563EB !important`
         }
       },
       "& .MuiTab-root": {
@@ -181,6 +180,11 @@ const useCommonStyle = theme => ({
           border: `1px solid ${theme?.palette?.editor?.closeButtonBorder} !important`
         }
       }
+    },
+    "& .disabledSaveBtn": {
+      background: "#2563EB33 !important",
+      color: theme?.palette?.type === "dark" && "#FFFFFF33 !important",
+      border: "1px solid #2563EB33 !important"
     }
   },
   popupTitle2: {

package/dist/Editor/helper/deserialize/index.js

@@ -76,13 +76,11 @@ const ELEMENT_TAGS = {
   }),
   TABLE: (el, children = []) => {
     try {
-      const tableBody = (children || [])?.find(f => f?.type === "table-body");
-      const bodyChild = tableBody?.children || [];
-      const firstRowChildren = tableBody[0]?.children || [];
+      const bodyChild = children || [];
+      const firstRowChildren = bodyChild[0]?.children || [];
       return {
         type: "table",
-        overwriteChild: bodyChild,
-        // we are not having table-body in our json format, just we are wrapping table-row's inside the table
+        children: bodyChild,
         rows: bodyChild?.length,
         columns: firstRowChildren?.length
       };
@@ -90,12 +88,8 @@ const ELEMENT_TAGS = {
       console.log(err);
     }
   },
-  THEAD: () => ({
-    type: "table-head"
-  }),
-  TBODY: () => ({
-    type: "table-body"
-  }),
+  // THEAD: () => ({ type: "table-head" }),
+  // TBODY: () => ({ type: "table-body" }),
   TH: handleTableCell,
   TR: () => ({
     type: "table-row"