@flozy/editor 9.8.0 → 9.8.1

package/dist/Editor/Elements/FreeGrid/FreeGridItem.js

@@ -1,4 +1,4 @@
-import React, { useState } from "react";
+import React, { useMemo, useState } from "react";
 import { Transforms, Node, Path } from "slate";
 import { useSlateStatic } from "slate-react";
 import { ReactEditor } from "slate-react";
@@ -250,6 +250,22 @@ const FreeGridItem = props => {
     }
   };
   const itemTypeOptions = (itemOptions[childType] || itemOptions?.default).filter(f => (hideTools || []).indexOf(f) === -1);
+  const variableStyle = useMemo(() => {
+    const {
+      width,
+      height
+    } = element || {};
+    let widthVar = width_xs;
+    let heightVar = height_xs;
+    if (element?.childType === "image") {
+      widthVar = width_xs || width;
+      heightVar = height_xs || height;
+    }
+    return {
+      "--width_xs": widthVar ? `${widthVar}px` : "auto",
+      "--height_xs": heightVar ? `${heightVar}px` : "auto"
+    };
+  }, [element]);
   return /*#__PURE__*/_jsx(RnD, {
     id: `freegrid_item_${path.join("|")}_${updated_at}_${breakpoint}`,
     className: `freegrid-item path-${path.length} breakpoint-${breakpoint}`,
@@ -270,9 +286,8 @@ const FreeGridItem = props => {
       "--width": `${width}px`,
       "--height": `${height}px`,
       "--zIndex": 100 + arrangeIndex,
-      "--height_xs": height_xs ? `${height_xs}px` : "auto",
-      "--width_xs": width_xs ? `${width_xs}px` : "auto",
-      "--marginTop_xs": marginTop_xs ? `${marginTop_xs}px` : "0px"
+      "--marginTop_xs": marginTop_xs ? `${marginTop_xs}px` : "0px",
+      ...variableStyle
       // "--gridArea_xs": gridArea_xs ? gridArea_xs : "unset",
     },
 

package/dist/Editor/common/RnD/VirtualElement/helper.js

@@ -345,6 +345,12 @@ export const sortElements = (items, container) => {
       return aRow - bRow; // Sort by start row first
     }
 
+    // Compare marginTopXs
+    const aMarginTop = parseFloat(a.dataset.marginTopXs) || 0;
+    const bMarginTop = parseFloat(b.dataset.marginTopXs) || 0;
+    if (aMarginTop !== bMarginTop) {
+      return aMarginTop - bMarginTop;
+    }
     const aLeft = parseFloat(a.dataset.leftXs) || 0;
     const bLeft = parseFloat(b.dataset.leftXs) || 0;
     return aLeft - bLeft;

package/dist/Editor/common/RnD/VirtualElement/styles.js

@@ -30,6 +30,10 @@ const useVirtualElementStyles = () => ({
       "&.type_text": {
         height: "auto !important"
       },
+      "&.type_image": {
+        width: "calc(--width_xs) !important",
+        height: "var(--height_xs) !important"
+      },
       // "&.type_box": {
       //   // display: "grid !important",
       //   // gridTemplateRows: "repeat(auto-fill, 50px) !important",

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

@@ -19,7 +19,7 @@ import { removeSign } from "./ElementSettings/OtherSettings";
 import useDragging from "../../hooks/useDragging";
 import { dragOverOn } from "../../helper/RnD/focusNode";
 import { focusSelection, clearSelection, clearSelectionOnly } from "../../helper";
-import { reRenderChildNodes } from "./Utils/gridDropItem";
+// import { reRenderChildNodes } from "./Utils/gridDropItem";
 import VirtualTextElement from "./VirtualElement/VirtualTextElement";
 import useAutoScroll from "../../hooks/useAutoScroll";
 import ForceAutoAlignment from "./VirtualElement/ForceAutoAlignment";
@@ -485,12 +485,17 @@ const RnD = props => {
       ...updatedSize
     });
     handleResizeEvent("stop");
-    const parentPath = getParentSectionPath({
-      ref
-    }, ".freegrid-container-parent");
-    const formatParentPath = parentPath?.split("|")?.map(m => parseInt(m));
-    reRenderChildNodes(editor, formatParentPath);
+
+    // const parentPath = getParentSectionPath(
+    //   { ref },
+    //   ".freegrid-container-parent"
+    // );
+
+    // const formatParentPath = parentPath?.split("|")?.map((m) => parseInt(m));
+
+    // reRenderChildNodes(editor, formatParentPath);
   };
+
   const onCloseSettings = () => {
     setSelectedElement({
       ...selectedElementProps,

package/package.json

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