@flozy/editor 1.5.8 → 1.6.0

package/dist/Editor/Editor.css

@@ -1,19 +1,25 @@
 .editor-t-wrapper {
   font-family: "PoppinsRegular", "Helvetica", "Arial", sans-serif;
+  position: relative;
 }
+
 .editor-t-wrapper strong,
 .editor-t-wrapper strong * {
   font-family: "PoppinsBold", "Helvetica", "Arial", sans-serif;
 }
+
 .ml-1 {
   margin-left: 10px;
 }
+
 .dflex {
   display: flex;
 }
+
 .alignCenter {
   align-items: center;
 }
+
 blockquote {
   border-left: 2px solid #ddd;
   margin-left: 0;
@@ -28,19 +34,21 @@ blockquote {
 .editor-wrapper td {
   border: 1px solid black;
 }
+
 .editor-wrapper table {
   border-collapse: collapse;
 }
+
 .editor-wrapper .editor-wrapperbutton {
   background-color: white;
   border: none;
 }
+
 .editor-wrapper .btnActive {
   opacity: 1;
 }
 
 .editor-wrapper {
-
   background: #ffffff;
   min-height: 400px;
   height: fit-content;
@@ -52,14 +60,17 @@ blockquote {
 .editor-wrapper table {
   /* width:100%; */
 }
+
 .editor-wrapper td {
   height: 50px;
   padding: 0 5px;
 }
+
 .popup-wrapper1 {
   display: inline;
   position: relative;
 }
+
 .af-popup {
   position: fixed;
   left: 0;
@@ -75,16 +86,20 @@ blockquote {
   z-index: 999;
   width: 300px;
 }
+
 .editor-wrapper button {
   cursor: pointer;
 }
+
 .editor-wrapper code {
   font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New",
     monospace;
 }
+
 .editor-wrapper html {
   scroll-behavior: smooth;
 }
+
 .editor-wrapper *:focus-visible {
   outline: none;
 }
@@ -111,10 +126,14 @@ blockquote {
 
 .grid-container-toolbar {
   right: -40px;
+  top: 0;
+  bottom: 0;
+  margin: auto;
+  height: fit-content;
 }
 
 .grid-item-toolbar {
-  left: -40px;
+  left: 0px;
 }
 
 .element-toolbar {
@@ -132,9 +151,9 @@ blockquote {
 .grid-item-toolbar button,
 .element-toolbar button {
   border-radius: 10px;
-border: 1px solid rgba(37, 99, 235, 0.32);
-background: #FFF;
-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.16);
+  border: 1px solid rgba(37, 99, 235, 0.32);
+  background: #fff;
+  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.16);
 
   /* background-color: #2684ff; */
   /* color: #FFFFFF; */
@@ -144,10 +163,11 @@ box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.16);
   height: 36px;
   padding: 6px;
 }
+
 .grid-container-toolbar button:hover,
 .grid-item-toolbar button:hover,
 .element-toolbar button:hover {
-  background-color: #FFFFFF;
+  background-color: #ffffff;
   color: #2684ff;
   border: 1px solid #2684ff;
 }
@@ -213,13 +233,14 @@ box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.16);
   display: flex;
   justify-content: space-around;
 }
+
 .signature-btn-grps svg {
   height: 17px !important;
   width: 17px !important;
 }
 
 .close-popupbtn {
-  background-color: #F8FAFC !important;
+  background-color: #f8fafc !important;
   border-radius: 4px !important;
   width: 24px;
   height: 24px;
@@ -249,9 +270,11 @@ box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.16);
   position: relative;
   display: flex;
 }
+
 .signature-signed-span {
   position: relative;
 }
+
 .signature-signed-wrapper .signed-btn-del {
   position: absolute;
   right: -20px;
@@ -259,6 +282,7 @@ box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.16);
   opacity: 1;
   z-index: 1;
 }
+
 .signed-btn {
   text-align: center;
   opacity: 1;
@@ -278,9 +302,11 @@ box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.16);
   color: #0f172a;
   box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.08);
 }
+
 .typesignature-fontfamily .MuiButtonBase-root.active {
   border: 1px solid #0052cc;
 }
+
 .typesignature-input-wrapper .MuiInputAdornment-root .MuiButtonBase-root {
   background-color: #e9ebf8 !important;
   border-radius: 4px !important;
@@ -288,6 +314,7 @@ box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.16);
   height: 24px;
   padding: 2px;
 }
+
 .typesignature-input-wrapper .MuiInputAdornment-root svg {
   width: 100%;
   height: 100%;
@@ -304,6 +331,7 @@ box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.16);
   display: flex !important;
   align-items: center;
 }
+
 .react-datepicker__input-container input {
   height: 27px;
   border: 1px solid #ccc;
@@ -313,9 +341,11 @@ box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.16);
 
 .brushcolorpic {
 }
+
 .sizeIcons .MuiButtonBase-root {
   opacity: 1;
 }
+
 .sizeIcons .MuiButtonBase-root.active .MuiSvgIcon-root {
   fill: #0052cc;
 }
@@ -362,12 +392,14 @@ box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.16);
   flex-direction: column;
   overflow-x: auto;
 }
+
 .empty-carousel-wrapper > div {
   display: flex;
   flex-direction: column;
   flex-shrink: 0;
   border: 1px solid #000;
 }
+
 .empty-carousel-wrapper .carousel-item-inner {
   width: 100%;
 }
@@ -392,6 +424,7 @@ box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.16);
   border: 1px solid #2563eb !important;
   width: auto !important;
 }
+
 .MuiButton-root.secondaryBtn {
   background: #ffffff;
   border: 1px solid #2563eb !important;
@@ -404,6 +437,7 @@ box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.16);
   color: #2563eb;
   width: auto !important;
 }
+
 .deleteBtn {
   background: #ffffff;
   border: 1px solid #d32f2f !important;
@@ -416,48 +450,61 @@ box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.16);
   color: #d32f2f;
   width: auto !important;
 }
+
 @media (max-width: 480px) {
   body {
     padding: 0px !important;
   }
+
   .app-logo {
     justify-content: end;
   }
+
   .editor-t-wrapper {
     padding: 0px 0px !important;
   }
+
   .toolbar {
     display: flex;
     flex-wrap: nowrap;
     overflow-x: scroll;
   }
+
   .toolbar-grp1,
   .toolbar-grp1 > div {
     display: flex;
   }
+
   .grid-container > div {
     flex-direction: column !important;
   }
+
   .grid-item {
     width: 100% !important;
   }
+
   .grid-item > div {
     text-align: center;
   }
+
   .page-builder .editor-wrapper {
     max-width: 100% !important;
     margin-top: 0px !important;
     padding: 0px !important;
   }
+
   .embed {
     justify-content: center;
   }
+
   .embed img {
     object-fit: contain;
   }
+
   form .form-field {
     width: 100% !important;
   }
+
   .form-btn-wrpr {
     justify-content: center !important;
   }
@@ -481,6 +528,7 @@ box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.16);
 .editorTabs .MuiTabScrollButton-horizontal.Mui-disabled {
   display: none;
 }
+
 .editorTabs .MuiTabs-scroller {
   border-bottom: 1px solid #8080801c;
 }
@@ -513,23 +561,88 @@ box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.16);
   bottom: 2px;
   right: 2px;
 }
+
 .visible-on-hover {
   display: none !important;
 }
+
 .has-hover:hover .visible-on-hover {
   display: flex !important;
 }
 
 .page-builder .editor-wrapper {
   max-width: 80%;
-  margin-top: 24px;
+  margin-top: 100px;
+}
+
+.top-left-editor-wrapper,
+.top-right-editor-wrapper {
+  margin-top: 100px;
+}
+
+.left-top-editor-wrapper,
+.left-bottom-editor-wrapper {
+  margin-top: 1%;
+  margin-left: 85px;
+  max-width: calc(100% - 85px) !important;
+}
+
+.right-top-editor-wrapper,
+.right-bottom-editor-wrapper {
+  margin-top: 1%;
+  margin-right: 85px;
+  max-width: calc(100% - 85px) !important;
+}
+
+.bottom-left-editor-wrapper,
+.bottom-right-editor-wrapper {
+  margin-top: 1%;
+}
+
+.editor-wrapper-toolbar-closed .left-top-toolbar-wrapper,
+.editor-wrapper-toolbar-closed .left-bottom-toolbar-wrapper {
+  left: 2%;
+  height: 100%;
+  width: fit-content;
+  transition: all 0.5s;
+}
+
+.editor-wrapper-toolbar-closed .right-top-toolbar-wrapper,
+.editor-wrapper-toolbar-closed .right-bottom-toolbar-wrapper {
+  right: 2% !important;
+  height: 100%;
+  width: 50px;
+  transition: all 0.5s;
+}
+
+.editor-wrapper-toolbar-closed .top-left-editor-wrapper-toolbar-closed,
+.editor-wrapper-toolbar-closed .top-right-editor-wrapper-toolbar-closed {
+  margin-top: 1% !important;
+  transition: all 0.5s;
+}
+
+.editor-wrapper-toolbar-closed .right-bottom-editor-wrapper-toolbar-closed,
+.editor-wrapper-toolbar-closed .right-top-editor-wrapper-toolbar-closed {
+  margin-top: 10px !important;
+  max-width: calc(100% - 0px) !important;
+  margin-right: 3%;
+  transition: all 0.5s;
+  width: 100%;
+}
+
+.editor-wrapper-toolbar-closed .left-bottom-editor-wrapper-toolbar-closed,
+.editor-wrapper-toolbar-closed .left-top-editor-wrapper-toolbar-closed {
+  margin-top: 10px !important;
+  max-width: calc(100% - 120px);
+  margin-left: 2%;
+  transition: all 0.5s;
 }
 
 .element-root .element-selector {
   position: absolute;
   width: calc(100%);
   height: calc(100%);
-  border: 2px solid #2563EB;
+  border: 2px solid #2563eb;
   display: none;
   pointer-events: none;
   top: 0px;
@@ -541,29 +654,61 @@ box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.16);
   position: absolute;
   width: 10px;
   height: 10px;
-  border: 2px solid #2563EB;
-  background-color: #2563EB;
+  border: 2px solid #2563eb;
+  background-color: #2563eb;
 }
 
 .element-selector-dots.tl {
   left: -5px;
   top: -5px;
-  border: 2px solid #2563EB;
+  border: 2px solid #2563eb;
 }
+
 .element-selector-dots.tr {
   right: -5px;
   top: -5px;
-  border: 2px solid #2563EB;
+  border: 2px solid #2563eb;
 }
+
 .element-selector-dots.bl {
   left: -5px;
   bottom: -5px;
-  border: 2px solid #2563EB;
+  border: 2px solid #2563eb;
 }
+
 .element-selector-dots.br {
   right: -5px;
   bottom: -5px;
-  border: 2px solid #2563EB;
+  border: 2px solid #2563eb;
+}
+
+.element-selector-ctrl.tc {
+  position: absolute;
+  right: 0;
+  left: 0;
+  top: -15px;
+  margin: auto;
+  width: 24px;
+  height: 24px;
+}
+
+.element-selector-ctrl.bc {
+  position: absolute;
+  right: 0;
+  left: 0;
+  bottom: -15px;
+  margin: auto;
+  width: 24px;
+  height: 24px;
+}
+
+.element-selector-ctrl button,
+.element-selector-ctrl button:hover {
+  width: 24px;
+  height: 24px;
+  border: 1px solid rgba(37, 99, 235, 0.32);
+  background: #fff;
+  z-index: 100;
 }
 
 .element-selector.selected {
@@ -589,6 +734,7 @@ box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.16);
 .drag-overlay .element-selector {
   display: none;
 }
+
 .drop-overlay {
   position: absolute;
   pointer-events: none;
@@ -597,9 +743,11 @@ box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.16);
   background-color: transparent;
   transition: all 1s;
 }
+
 .dragging.drop-overlay {
   pointer-events: auto;
 }
+
 .drop-overlay.active {
   position: relative;
   background-color: #2684ff;
@@ -610,7 +758,7 @@ box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.16);
 }
 
 .optionePopupHeader {
-  border-bottom: 1px solid #DCE4EC;
+  border-bottom: 1px solid #dce4ec;
 }
 
 .dialogComp .MuiInputBase-input {
@@ -619,43 +767,51 @@ box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.16);
   font-size: 12px;
   font-weight: 500;
 }
-.dialogComp  .MuiOutlinedInput-notchedOutline {
-  border: 1px solid #ECECEC;
+
+.dialogComp .MuiOutlinedInput-notchedOutline {
+  border: 1px solid #ececec;
 }
+
 .iconRadioButton .MuiRadio-root {
   visibility: hidden;
   width: 0px;
   padding: 6px;
 }
+
 .iconRadioButton .MuiTypography-root {
   width: 32px;
   height: 32px;
   display: flex;
   align-items: center;
-  justify-content: center
+  justify-content: center;
 }
 
 .iconRadioButton .MuiFormControlLabel-root.active .fillPath {
   fill: #2684ff;
 }
+
 .iconRadioButton .MuiFormControlLabel-root.active .fillStroke {
   stroke: #2684ff;
 }
+
 .iconRadioButton .Mui-checked ~ .MuiTypography-root .fillStroke {
   stroke: #2684ff;
 }
+
 .selctedBtnIcon {
-  border: 1px solid #ECECEC;
+  border: 1px solid #ececec;
   border-radius: 4px;
   height: 35px;
   width: 35px;
   display: flex;
   align-items: center;
-  justify-content: center
+  justify-content: center;
 }
+
 .borderInput {
   text-align: center;
 }
+
 .borderInput:focus-visible {
   outline: none !important;
 }
@@ -666,16 +822,20 @@ box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.16);
   left: 50%;
   top: 50%;
 }
-.uploadImageSection  .removeImageText {
+
+.uploadImageSection .removeImageText {
   visibility: hidden;
   opacity: 0;
   transition: all 0.5s;
 }
-.uploadImageSection:hover  .removeImageText {
+
+.uploadImageSection:hover .removeImageText {
   visibility: visible;
   opacity: 1;
 }
-.uploadImageText, .removeImageText {
+
+.uploadImageText,
+.removeImageText {
   border: 2px dashed #fff;
   border-radius: 8px;
   color: #fff;
@@ -699,6 +859,7 @@ box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.16);
   width: 12px;
   height: 12px;
 }
+
 .textFontArrows .MuiIconButton-root {
   padding: 2px;
 }
@@ -707,3 +868,12 @@ box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.16);
   color: #000000;
   font-weight: bold !important;
 }
+
+.img_upload_btn_list .btn--wrpr {
+  background-color: transparent !important;
+}
+
+/** to avoid line space **/
+.page-settings {
+  height: 0px;
+}

package/dist/Editor/Elements/Accordion/Accordion.js

@@ -3,7 +3,6 @@ import { Transforms } from "slate";
 import { useSelected, useSlateStatic, ReactEditor } from "slate-react";
 import KeyboardArrowRightIcon from "@mui/icons-material/KeyboardArrowRight";
 import KeyboardArrowDownIcon from "@mui/icons-material/KeyboardArrowDown";
-import SettingsIcon from "@mui/icons-material/Settings";
 import AccordionBtnPopup from "./AccordionBtnPopup";
 import { IconButton, Tooltip } from "@mui/material";
 import DeleteIcon from "@mui/icons-material/Delete";

package/dist/Editor/Elements/Accordion/AccordionSummary.js

@@ -3,7 +3,6 @@ import { Transforms } from "slate";
 import { useSelected, useSlateStatic, ReactEditor } from "slate-react";
 import AccordionTitlePopup from "./AccordionTitlePopup";
 import { IconButton, Tooltip } from "@mui/material";
-import SettingsIcon from "@mui/icons-material/Settings";
 import { GridSettingsIcon } from "../../common/iconslist";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";