@flozy/editor 10.0.6 → 10.0.8

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

@@ -21,6 +21,7 @@ import { FORM_NODE } from "../../utils/form";
 import { DEFAULT_TABLE_NODE } from "../../utils/table";
 import itemOptions from "./Options/sectionItemOptions";
 import { getBreakPointsValue, groupByBreakpoint } from "../../helper/theme";
+import { useDebouncedCallback } from "use-debounce";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 const MAX_DEVICE_WIDTH = {
@@ -75,6 +76,9 @@ const FreeGrid = props => {
   const count = useRef(2);
   const childrenCountRef = useRef(element?.children?.length);
   const [isInteracting, setIsInteracting] = useState(false);
+  const debouncedStopInteraction = useDebouncedCallback(() => {
+    setIsInteracting(false);
+  }, 500);
   const onChange = data => {
     const append = breakpoint === "lg" ? "" : `_${breakpoint}`;
     const updateData = {
@@ -490,7 +494,11 @@ const FreeGrid = props => {
   return /*#__PURE__*/_jsx(FreeGridContext.Provider, {
     value: {
       isInteracting,
-      setIsInteracting
+      handleStart: () => {
+        setIsInteracting(true);
+        debouncedStopInteraction.cancel();
+      },
+      handleStop: debouncedStopInteraction
     },
     children: /*#__PURE__*/_jsx(RnD, {
       id: `freegrid_container_${path.join("|")}_${updated_at}_${breakpoint}`,

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

@@ -61,7 +61,7 @@ const FreeGridItem = props => {
   const onChangeSettings = () => {};
   // const refInput = useRef();
   // const [virtualHeight, setVirtualHeight] = useState(height || 0);
-
+  const xsHidden = element?.children?.some(c => c.xsHidden);
   const onChange = data => {
     let updateData = {
       ...data
@@ -268,7 +268,7 @@ const FreeGridItem = props => {
   }, [element]);
   return /*#__PURE__*/_jsx(RnD, {
     id: `freegrid_item_${path.join("|")}_${updated_at}_${breakpoint}`,
-    className: `freegrid-item path-${path.length} breakpoint-${breakpoint}`,
+    className: `freegrid-item path-${path.length} breakpoint-${breakpoint} ${xsHidden ? "xs-hidden" : ""}`,
     editor: editor,
     path: path,
     actions: itemTypeOptions,

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

@@ -47,9 +47,6 @@ const useFreeGridStyles = ({
         "&.type_text": {
           // minHeight: "fit-content !important",
           // wordBreak: "break-all",
-          "& .placeholder-simple-text": {
-            display: "none"
-          }
         },
         "&.enable-1, &.enable-2": {
           "&.type_text": {
@@ -327,6 +324,12 @@ const useFreeGridStyles = ({
         },
         [theme?.breakpoints?.between("xs", "md")]: {
           marginLeft: `calc((100% - 320px) * 0.5)`
+        },
+        "&.xs-hidden": {
+          display: {
+            xs: "none !important",
+            lg: "inline-block !important"
+          }
         }
       },
       "&.rnd-dragOver": {

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

@@ -45,6 +45,12 @@ const useVirtualElementStyles = () => ({
       },
       "& .embed": {
         minHeight: "300px"
+      },
+      "&.xs-hidden": {
+        display: {
+          xs: "none !important",
+          lg: "inline-block !important"
+        }
       }
     }
   }
@@ -144,6 +150,12 @@ export const useAutoAlignStyles = () => ({
       },
       "& .embed": {
         minHeight: "300px"
+      },
+      "&.xs-hidden": {
+        display: {
+          xs: "none !important",
+          lg: "inline-block !important"
+        }
       }
     },
     "& .appHeaderBox, &.header-box-mobile-virtual-mode": {

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

@@ -125,7 +125,8 @@ const RnD = props => {
   } = useAutoScroll(10, "slate-wrapper-scroll-container");
   const {
     isInteracting,
-    setIsInteracting
+    handleStart,
+    handleStop
   } = useFreeGrid();
   const {
     translation
@@ -323,7 +324,7 @@ const RnD = props => {
   };
   const onDragStart = e => {
     e.preventDefault();
-    setIsInteracting(true);
+    handleStart();
     if (e?.target?.dataset?.path?.split(",").join("|") === sp) {
       const {
         left,
@@ -425,7 +426,7 @@ const RnD = props => {
     e.preventDefault();
     e.stopPropagation();
     stopAutoScroll();
-    setIsInteracting(false);
+    handleStop();
     if (dragging?.isDragging === 2 && dragging?.position?.strXY && dragging?.dragOver) {
       d.x = e.x;
       d.y = e.y;
@@ -468,7 +469,7 @@ const RnD = props => {
   };
   const onResizeStop = (e, direction, ref, d, position) => {
     e.preventDefault();
-    setIsInteracting(false);
+    handleStop();
     let updatedPosition = {};
     if (type !== "parent") {
       // update element position while resizing, (for free grid box and item)
@@ -557,7 +558,7 @@ const RnD = props => {
       return {
         onResizeStart: e => {
           e.preventDefault();
-          setIsInteracting(true);
+          handleStart();
         },
         onDragStart: onDragStart,
         onDrag: onDrag,

package/package.json

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