@flozy/editor 5.9.2 → 5.9.3

package/dist/Editor/helper/index.js

@@ -337,14 +337,14 @@ export const isCarouselSelected = editor => {
       return false;
     }
     const [nodeEntry] = Editor.nodes(editor, {
-      match: n => !Editor.isEditor(n) && Element.isElement(n) && n.type === 'carousel'
+      match: n => !Editor.isEditor(n) && Element.isElement(n) && n.type === "carousel"
     });
     if (!nodeEntry) {
       return false;
     }
     const [node] = nodeEntry;
     const carouselDom = ReactEditor.toDOMNode(editor, node);
-    const isEdit = carouselDom.classList.contains('carousel_slider_edit');
+    const isEdit = carouselDom.classList.contains("carousel_slider_edit");
     return !isEdit;
   } catch (err) {
     console.log(err);

package/dist/Editor/helper/theme.js

@@ -161,4 +161,27 @@ export const groupByBreakpoint = (styleProps, theme) => {
     }
   };
 };
-export const getCustomizationValue = value => isNaN(parseInt(value)) ? null : parseInt(value);
+export const getCustomizationValue = value => isNaN(parseInt(value)) ? null : parseInt(value);
+export const getBreakpointLineSpacing = (value, breakpoint) => {
+  try {
+    const values = getBreakPointsValue(value, breakpoint);
+    const cssVal = BREAKPOINTS_DEVICES.reduce((a, b) => {
+      if (values[b] || values["lg"]) {
+        const value = values[b] || values["lg"];
+        return {
+          ...a,
+          [b]: value
+        };
+      } else {
+        return a;
+      }
+    }, {});
+    if (breakpoint) {
+      return value[breakpoint] || value["lg"] || value;
+    } else {
+      return cssVal["lg"];
+    }
+  } catch (err) {
+    // console.log(err);
+  }
+};

package/dist/Editor/hooks/useMouseMove.js

@@ -35,6 +35,7 @@ export const EditorProvider = ({
     path: null
   });
   const [fontFamilies, setFontFamilies] = useState({});
+  const [activeBreakPoint, setActiveBreakPoint] = useState("");
   useEffect(() => {
     window.updateSelectedItem = d => {
       setSelectedElement(d);
@@ -97,8 +98,10 @@ export const EditorProvider = ({
     setOpenAI,
     updateDragging,
     fontFamilies,
-    setFontFamilies
-  }), [path, editor?.selection, selectedPath, selectedElement, contextMenu, openAI, popupType, drop]);
+    setFontFamilies,
+    activeBreakPoint,
+    setActiveBreakPoint
+  }), [path, editor?.selection, selectedPath, selectedElement, contextMenu, openAI, popupType, drop, activeBreakPoint]);
   return /*#__PURE__*/_jsx(EditorContext.Provider, {
     value: otherValues,
     children: children

package/dist/Editor/plugins/withLayout.js

@@ -39,7 +39,7 @@ const withLayout = editor => {
           const title = {
             type: "title",
             children: [{
-              text: "Untitled"
+              text: ""
             }]
           };
           Transforms.insertNodes(editor, title, {

package/dist/Editor/utils/SlateUtilityFunctions.js

@@ -173,10 +173,9 @@ export const getMarked = (leaf, children, theme) => {
   if (leaf.highlight) {
     children = /*#__PURE__*/_jsx("span", {
       style: {
-        color: "inherit"
+        color: "inherit",
+        background: "var(--slate-highlight-bg)"
       },
-      className: "slate-highlight" // while opening AI, we will use this element to highlight the selection. (PopoverAIInput.js)
-      ,
       children: children
     });
   }
@@ -338,7 +337,8 @@ export const getBlock = props => {
           borderRadius: `${element?.color ? "0px" : "12px"} 12px 12px ${element?.color ? "0px" : "12px"}`,
           margin: `${element?.bgColor ? "16px" : "0px"} 0px`,
           width: element?.bgColor ? "calc(100% - 16px)" : "100%",
-          borderWidth: element?.color ? "0px 0px 0px 3px" : "0px"
+          borderWidth: element?.color ? "0px 0px 0px 3px" : "0px",
+          lineHeight: 1.43
         },
         children: children
       });
@@ -398,6 +398,9 @@ export const getBlock = props => {
       });
     case "orderedList":
       return /*#__PURE__*/_jsx("ol", {
+        style: {
+          lineHeight: 1.43
+        },
         className: "listItemMargin",
         type: "1",
         ...attributes,
@@ -405,6 +408,9 @@ export const getBlock = props => {
       });
     case "unorderedList":
       return /*#__PURE__*/_jsx("ul", {
+        style: {
+          lineHeight: 1.43
+        },
         className: "listItemMargin",
         ...attributes,
         children: children

package/dist/Editor/utils/button.js

@@ -20,10 +20,10 @@ export const insertButton = editor => {
       bottomRight: 30
     },
     bannerSpacing: {
-      left: 16,
-      top: 8,
-      right: 16,
-      bottom: 8
+      left: 24,
+      top: 10,
+      right: 24,
+      bottom: 10
     },
     ...(windowVar.lastButtonProps || {})
   };

package/dist/Editor/utils/customHooks/useTableResize.js

@@ -43,7 +43,8 @@ const useTableResize = ({
       minWidth
     } = minMaxProps || {};
     setSize(currentSize => {
-      const calcWidth = currentSize?.width + e.movementX;
+      const width = currentSize?.width || parentDOM?.clientWidth;
+      const calcWidth = width + e.movementX;
       return {
         width: minWidth && calcWidth < minWidth ? minWidth : calcWidth,
         height: currentSize.height + e.movementY,

package/dist/Editor/utils/draftToSlate.js

@@ -82,7 +82,8 @@ const splitInlineStyleRanges = (text, inlineStyleRanges, data) => {
 };
 export const draftToSlate = props => {
   const {
-    data
+    data,
+    needLayout
   } = props;
   if (data?.blocks && data?.blocks?.length > 0) {
     const converted = data?.blocks?.reduce((a, b) => {
@@ -104,7 +105,7 @@ export const draftToSlate = props => {
     return data;
   } else {
     return [{
-      type: "paragraph",
+      type: needLayout ? "title" : "paragraph",
       children: [{
         text: ""
       }]

package/dist/Editor/utils/helper.js

@@ -625,6 +625,10 @@ export const isRestrictedNode = (event, editor) => {
     return isNodeRestricted;
   }
 };
+export function capitalizeFirstLetter(str) {
+  if (!str) return str;
+  return str.charAt(0).toUpperCase() + str.slice(1);
+}
 export const insertLineBreakAtEndOfPath = (editor, path) => {
   try {
     const [node, nodePath] = Editor.node(editor, path); // Get the node at the specified path
@@ -643,6 +647,13 @@ export const insertLineBreakAtEndOfPath = (editor, path) => {
     console.log(err);
   }
 };
+export function isHavingSelection(editor) {
+  try {
+    return editor?.selection && !Range.isCollapsed(editor.selection);
+  } catch (err) {
+    console.log(err);
+  }
+}
 const omitNodes = ["site-settings", "page-settings"];
 export function getInitialValue(value = [], readOnly) {
   if (readOnly === "readonly" && value?.length) {
@@ -673,20 +684,17 @@ export function getInitialValue(value = [], readOnly) {
   }
   return value;
 }
-export function capitalizeFirstLetter(str) {
-  if (!str) return str;
-  return str.charAt(0).toUpperCase() + str.slice(1);
-}
-export function isHavingSelection(editor) {
-  try {
-    return editor?.selection && !Range.isCollapsed(editor.selection);
-  } catch (err) {
-    console.log(err);
-  }
-}
 export function getSelectedCls(defaultCls = "", selected, selectedClsName = "selected") {
   return `${defaultCls} ${selected ? selectedClsName : ""}`;
 }
+export function handleNegativeInteger(val) {
+  return val < 0 ? 0 : val;
+}
+export const containsSurrogatePair = text => {
+  // Match surrogate pairs (high and low surrogate)
+  const surrogatePairRegex = /[\uD800-\uDBFF][\uDC00-\uDFFF]/;
+  return surrogatePairRegex.test(text);
+};
 export const getNodeWithType = (editor, nodeType = "", otherOptions) => {
   try {
     const options = {
@@ -700,11 +708,6 @@ export const getNodeWithType = (editor, nodeType = "", otherOptions) => {
     return [];
   }
 };
-export const containsSurrogatePair = text => {
-  // Match surrogate pairs (high and low surrogate)
-  const surrogatePairRegex = /[\uD800-\uDBFF][\uDC00-\uDFFF]/;
-  return surrogatePairRegex.test(text);
-};
 export const getSlateDom = (editor, range) => {
   try {
     const slateDom = ReactEditor.toDOMRange(editor, range);
@@ -713,6 +716,44 @@ export const getSlateDom = (editor, range) => {
     console.log(err);
   }
 };
-export function handleNegativeInteger(val) {
-  return val < 0 ? 0 : val;
-}
+
+// The inputs inside the dynamic table lose focus after calling `setNodes` on the first `onChange` event.
+// To replicate this issue, insert some paragraph nodes above the dynamic table, then type something in the title.
+// After typing the first word, the input loses focus.
+export const focusDynamicTableInput = e => {
+  setTimeout(() => {
+    const input = document.getElementById(e.target.id);
+    if (input) {
+      // Check if the input is not already focused
+      if (document.activeElement !== input) {
+        const length = input.value.length;
+        // Focus on the input
+        input.focus();
+
+        // number input not supports selection
+        if (e.target.type !== "number") {
+          // Set the cursor to the end
+          input.setSelectionRange(length, length);
+        }
+      }
+    }
+  }, 0);
+};
+export const clearWindowSelection = () => {
+  const selection = window.getSelection();
+  if (selection) {
+    selection.removeAllRanges(); // Clears the selection
+  }
+};
+
+export const viewSlateSelection = () => {
+  // if ai is opened, remove the window selection class and open then slate selection, To resolve: focussing on the ai input removes window selection automatically
+  clearWindowSelection();
+  const selectionBg = "rgba(35, 131, 226, 0.35)";
+  const root = document.documentElement;
+  root.style.setProperty("--slate-highlight-bg", selectionBg);
+};
+export const hideSlateSelection = () => {
+  const root = document.documentElement;
+  root.style.setProperty("--slate-highlight-bg", "none");
+};

package/dist/Editor/utils/pageSettings.js

@@ -9,7 +9,13 @@ export const findPageSettings = editor => {
       path: null,
       element: {
         pageProps: {
-          pageWidth: "fixed"
+          pageWidth: "fixed",
+          "lineHeight": {
+            "xs": 1.43,
+            "sm": 1.43,
+            "md": 1.43,
+            "lg": 1.43
+          }
         }
       }
     };
@@ -34,7 +40,13 @@ export const getPageSettings = editor => {
         path: null,
         element: {
           pageProps: {
-            pageWidth: "fixed"
+            pageWidth: "fixed",
+            "lineHeight": {
+              "xs": 1.43,
+              "sm": 1.43,
+              "md": 1.43,
+              "lg": 1.43
+            }
           }
         }
       };

package/dist/Editor/utils/table.js

@@ -753,4 +753,25 @@ export const clearCellText = (editor, currentCellPath) => {
   } catch (err) {
     console.log(err);
   }
+};
+export const getTableColumns = element => {
+  const {
+    columns,
+    children
+  } = element || {};
+  if (columns) {
+    return columns;
+  }
+  const firstRow = children?.length ? children[0] : {};
+  return firstRow?.children?.length || 0;
+};
+export const getTableRows = element => {
+  const {
+    rows,
+    children
+  } = element || {};
+  if (rows) {
+    return rows;
+  }
+  return children?.length || 0;
 };

package/package.json

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