@flozy/editor 4.9.0 → 4.9.1

package/dist/Editor/CommonEditor.js

@@ -579,8 +579,9 @@ const CommonEditor = /*#__PURE__*/forwardRef((props, ref) => {
                 setIsTextSelected: setIsTextSelected,
                 customProps: customProps,
                 editorWrapper: editorWrapper
-              }) : null, !readOnly && showViewport ? /*#__PURE__*/_jsx(SwitchViewport, {
+              }) : null, !readOnly ? /*#__PURE__*/_jsx(SwitchViewport, {
                 breakpoint: breakpoint,
+                show: showViewport,
                 onChange: b => onSwitchBreakpoint(b)
               }) : null]
             })

package/dist/Editor/Elements/Grid/GridItem.js

@@ -315,7 +315,8 @@ const GridItem = props => {
         ...giInProps,
         width: "100%",
         height: "100%",
-        color: textColor || "#000",
+        // dark theme default color effect - FS-6961
+        color: textColor || "inherit",
         "&:hover": {
           borderColor: borderColorHover || borderColor || "transparent"
         }
@@ -328,12 +329,12 @@ const GridItem = props => {
       onClose: onClose,
       onDelete: onDelete,
       customProps: customProps
-    }) : null, /*#__PURE__*/_jsx(Resizer, {
+    }) : null, !readOnly ? /*#__PURE__*/_jsx(Resizer, {
       classes: classes,
       className: resizing ? "resizing" : "",
       onMouseDown: onMouseDown,
       height: "auto"
-    })]
+    }) : null]
   });
 };
 export default GridItem;

package/dist/Editor/Elements/Grid/Styles.js

@@ -38,14 +38,24 @@ const GridStyles = theme => ({
           }
         },
         flex: "1 1 0",
+        height: "100%",
         [theme?.breakpoints?.between("xs", "md")]: {
           flex: "1 1 100%",
+          height: "auto",
           padding: "0px !important",
           minWidth: "100% !important",
           maxWidth: "100% !important",
           "& .col-width-resizer": {
             display: "none !important"
           }
+        },
+        "& .gi-inner-cw": {
+          overflowX: "auto",
+          "& .tableToolBar": {
+            display: "flex",
+            maxWidth: "100%",
+            overflowX: "auto"
+          }
         }
       },
       "& .col-width-resizer": {

package/dist/Editor/Elements/Grid/templates/default_grid.js

@@ -14,10 +14,10 @@ const default_grid = [{
     bgColor: "rgba(255, 255, 255, 0)",
     lockSpacing: true,
     bannerSpacing: {
-      top: "0",
+      top: "8",
       left: "0",
       right: "0",
-      bottom: "0"
+      bottom: "16"
     },
     alignment: {
       horizantal: "center"
@@ -36,10 +36,10 @@ const default_grid = [{
     bgColor: "rgba(255, 255, 255, 0)",
     lockSpacing: true,
     bannerSpacing: {
-      top: "0",
+      top: "8",
       left: "0",
       right: "0",
-      bottom: "0"
+      bottom: "16"
     },
     forceFullWidth: true,
     borderWidth: "0px"

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

@@ -3,19 +3,28 @@ import PersonalVideoIcon from "@mui/icons-material/PersonalVideo";
 import PhoneIphoneIcon from "@mui/icons-material/PhoneIphone";
 import useSwitchViewport from "./styles";
 import { useEffect } from "react";
+import { useEditorContext } from "../../../hooks/useMouseMove";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 const SwitchViewport = props => {
   const {
     breakpoint,
-    onChange
+    onChange,
+    show
   } = props;
   const classes = useSwitchViewport();
+  const {
+    setSelectedElement
+  } = useEditorContext();
   useEffect(() => {
-    console.log(breakpoint);
+    // to reset selection on viewport changes - FS-6589
+    setSelectedElement({});
   }, [breakpoint]);
   return /*#__PURE__*/_jsxs(Box, {
     sx: classes.root,
+    style: {
+      display: show ? "block" : "none"
+    },
     children: [/*#__PURE__*/_jsx(Tooltip, {
       title: "Desktop View",
       children: /*#__PURE__*/_jsx(IconButton, {

package/dist/Editor/utils/gridItem.js

@@ -45,15 +45,19 @@ export const onAddGridItem = ({
   if (insertPath) {
     insertPath[insertPath.length - 1] = element.children.length;
     const lp = ReactEditor.findPath(editor, element);
-    const lastElement = {
-      ...element.children[element.children.length - 1]
-    };
+    // const lastElement = { ...element.children[element.children.length - 1] };
     if (isColumn && children?.length - 1 > 0) {
       updateLastSiblingWidths(editor, [...lp, children.length - 1]);
     }
     Transforms.insertNodes(editor, gridItem({
-      ...(lastElement || {}),
+      // ...(lastElement || {}),
       minWidth: null,
+      bannerSpacing: {
+        top: "8",
+        left: "0",
+        right: "0",
+        bottom: "16"
+      },
       children: [{
         type: "paragraph",
         children: [{

package/package.json

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