@flozy/editor 1.9.4 → 1.9.6

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

@@ -2,8 +2,8 @@ import React, { useEffect, useState } from "react";
 import { DialogTitle, DialogContent, DialogActions, Button, Grid, IconButton, Typography, Drawer } from "@mui/material";
 import FieldMap from "./fieldTypes";
 import CloseIcon from "@mui/icons-material/Close";
-import commonStyle from "../../commonStyle";
-import { styled } from "@mui/material/styles";
+import useCommonStyle from "../../commonStyle";
+import { useEditorContext } from "../../hooks/useMouseMove";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 const StyleContent = props => {
@@ -18,6 +18,10 @@ const StyleContent = props => {
   const {
     hideTools
   } = customProps || {};
+  const {
+    theme
+  } = useEditorContext();
+  const classes = useCommonStyle(theme);
   const tabContent = renderTabs.find(f => f.value === value);
   const {
     fields
@@ -37,7 +41,8 @@ const StyleContent = props => {
         onChange: onChange,
         elementProps: element,
         customProps: customProps,
-        handleClose: handleClose
+        handleClose: handleClose,
+        classes: classes
       }, `ei_stt_tab_${value}_${m.key}_${i}`) : null;
     })
   }, value);
@@ -52,6 +57,10 @@ const StyleBuilder = props => {
     onDelete,
     customProps
   } = props;
+  const {
+    theme
+  } = useEditorContext();
+  const classes = useCommonStyle(theme);
   const [elementProps, setElementProps] = useState(element);
   const [tab] = useState(renderTabs[0]?.value);
   const tabVal = renderTabs?.find(f => f.value === tab);
@@ -90,6 +99,7 @@ const StyleBuilder = props => {
     style: {
       zIndex: "1300"
     },
+    sx: classes.sideBarDrawer,
     children: /*#__PURE__*/_jsxs(Grid, {
       item: true,
       xs: 12,
@@ -159,4 +169,4 @@ const StyleBuilder = props => {
 };
 
 // export default StyleBuilder;
-export default styled(StyleBuilder)(commonStyle);
+export default StyleBuilder;

package/dist/Editor/common/iconslist.js

@@ -1183,7 +1183,6 @@ export const TextPlusIcon = props => /*#__PURE__*/_jsx("svg", {
   fill: "none",
   children: /*#__PURE__*/_jsx("path", {
     d: "M1.08203 3.43359L3.51526 1.00036L5.94849 3.43359",
-    stroke: "#64748B",
     strokeLinecap: "round"
   })
 });
@@ -1195,7 +1194,6 @@ export const TextMinusIcon = props => /*#__PURE__*/_jsx("svg", {
   fill: "none",
   children: /*#__PURE__*/_jsx("path", {
     d: "M1 0.805664L3.43323 3.2389L5.86646 0.805664",
-    stroke: "#64748B",
     strokeLinecap: "round"
   })
 });

package/dist/Editor/commonStyle.js

@@ -1,11 +1,55 @@
-const commonStyle = theme => ({
-  "&.dialogComp": {
+const useCommonStyle = theme => ({
+  sideBarDrawer: {
+    "& .MuiPaper-root": {
+      backgroundColor: theme?.palette?.editor?.background
+    },
+    "& .MuiTypography-root": {
+      color: theme?.palette?.editor?.textColor
+    },
+    "& .MuiInputBase-input": {
+      color: theme?.palette?.editor?.textColor
+    },
+    "& .MuiCheckbox-root": {
+      color: theme?.palette?.editor?.textColor
+    },
+    "& .MuiOutlinedInput-notchedOutline": {
+      border: `1px solid ${theme?.palette?.editor?.borderColor}`
+    },
     "& .close-popupbtn": {
-      //   background: theme.palette.containers.bg7,
+      color: theme?.palette?.editor?.textColor
     }
   },
-  ".close-popupbtn": {
-    // background: theme.palette.containers.bg7,
+  sapcingInput: {
+    backgroundColor: theme?.palette?.editor?.background,
+    color: theme?.palette?.editor?.textColor
+  },
+  colorPickerPopup: {
+    "& .MuiPaper-root": {
+      overflow: "auto",
+      backgroundColor: theme?.palette?.editor?.background
+    },
+    "& .popup_tabs": {
+      backgroundColor: theme?.palette?.editor?.background
+    },
+    "& .popup_tabs-header": {
+      backgroundColor: theme?.palette?.editor?.background,
+      "& .popup_tabs-header-label-active": {
+        color: theme?.palette?.editor?.activeColor,
+        backgroundColor: theme?.palette?.editor?.background
+      }
+    },
+    "& .colorpicker": {
+      backgroundColor: theme?.palette?.editor?.background
+    },
+    "& .color-picker-panel": {
+      backgroundColor: theme?.palette?.editor?.background
+    },
+    "& .input_rgba": {
+      "& input": {
+        backgroundColor: theme?.palette?.editor?.background,
+        color: theme?.palette?.editor?.textColor
+      }
+    }
   }
 });
-export default commonStyle;
+export default useCommonStyle;

package/dist/Editor/helper/index.js

@@ -62,17 +62,39 @@ function padZero(str, len) {
   var zeros = new Array(len).join("0");
   return (zeros + str).slice(-len);
 }
-export function getEmbedURL(element) {
+export function getEmbedURL(element, needType = false) {
   let refUrl = element.href ? element.href : element.url;
   refUrl = refUrl ? refUrl.includes("http") ? refUrl : `//${refUrl}` : "Link";
   let embedUrl = refUrl;
-  if (embedUrl.includes("youtube")) embedUrl = getQueryStrings(embedUrl);
-  if (embedUrl.includes("youtu.be")) embedUrl = getQueryStrings(embedUrl);
-  if (embedUrl.includes("loom")) embedUrl = embedUrl.replace(/\/share\//, "/embed/");
-  if (embedUrl.includes("vimeo")) embedUrl = embedUrl.replace(/\/vimeo.com\//, "/player.vimeo.com/video/");
-  if (embedUrl.includes("dailymotion") && embedUrl.includes("video")) embedUrl = embedUrl.replace(/www.dailymotion.com\//, "www.dailymotion.com/embed/");
-  if (embedUrl.includes("dai.ly")) embedUrl = embedUrl.replace(/dai.ly\//, "www.dailymotion.com/embed/video/");
-  return embedUrl;
+  let isEmbed = false;
+  if (embedUrl.includes("youtube")) {
+    isEmbed = true;
+    embedUrl = getQueryStrings(embedUrl);
+  }
+  if (embedUrl.includes("youtu.be")) {
+    isEmbed = true;
+    embedUrl = getQueryStrings(embedUrl);
+  }
+  if (embedUrl.includes("loom")) {
+    isEmbed = true;
+    embedUrl = embedUrl.replace(/\/share\//, "/embed/");
+  }
+  if (embedUrl.includes("vimeo")) {
+    isEmbed = true;
+    embedUrl = embedUrl.replace(/\/vimeo.com\//, "/player.vimeo.com/video/");
+  }
+  if (embedUrl.includes("dailymotion") && embedUrl.includes("video")) {
+    isEmbed = true;
+    embedUrl = embedUrl.replace(/www.dailymotion.com\//, "www.dailymotion.com/embed/");
+  }
+  if (embedUrl.includes("dai.ly")) {
+    isEmbed = true;
+    embedUrl = embedUrl.replace(/dai.ly\//, "www.dailymotion.com/embed/video/");
+  }
+  return needType ? {
+    embedUrl,
+    isEmbed
+  } : embedUrl;
 }
 export const isEmptyTextNode = element => {
   try {

package/dist/Editor/hooks/useMouseMove.js

@@ -2,6 +2,7 @@ import { useEffect, useState, createContext, useContext, useMemo } from "react";
 import { jsx as _jsx } from "react/jsx-runtime";
 const EditorContext = /*#__PURE__*/createContext();
 export const EditorProvider = ({
+  theme,
   children
 }) => {
   const [event] = useMouseMove();
@@ -27,7 +28,8 @@ export const EditorProvider = ({
     value: {
       ...(value || {}),
       onDrop: onDrop,
-      drop
+      drop,
+      theme: theme
     },
     children: children
   });

package/dist/Editor/utils/draftToSlate.js

@@ -75,7 +75,9 @@ const splitInlineStyleRanges = (text, inlineStyleRanges, data) => {
     }, []);
     return splits;
   } else {
-    return [text];
+    return [{
+      text
+    }];
   }
 };
 export const draftToSlate = props => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@flozy/editor",
-  "version": "1.9.4",
+  "version": "1.9.6",
   "description": "An Editor for flozy app brain",
   "files": [
     "dist"