@flozy/editor 10.1.7 → 10.1.8

package/dist/Editor/Elements/List/CheckList.js

@@ -15,7 +15,8 @@ const CheckList = props => {
     isEmpty,
     className,
     style,
-    customProps
+    customProps,
+    selectedLineHeight
   } = props;
   const {
     translation
@@ -27,9 +28,6 @@ const CheckList = props => {
     checked
   } = element;
   const path = ReactEditor.findPath(editor, element);
-  const {
-    customLineHeight
-  } = customProps || {};
   const handleCheck = e => {
     Transforms.setNodes(editor, {
       checked: e.target.checked
@@ -48,7 +46,7 @@ const CheckList = props => {
         justifyContent: "center",
         alignItems: "center",
         ...(style || {}),
-        lineHeight: `${customLineHeight} !important`
+        lineHeight: `${selectedLineHeight}`
       },
       children: [/*#__PURE__*/_jsxs("div", {
         contentEditable: false,

package/dist/Editor/utils/SlateUtilityFunctions.js

@@ -34,7 +34,7 @@ import SimpleText from "../Elements/SimpleText";
 import CheckList from "../Elements/List/CheckList";
 import { getTextColor, isEmptyTextNode } from "../helper";
 import Attachments from "../Elements/Attachments/Attachments";
-import { getBreakPointsValue, textThemeFields, getElementProperty } from "../helper/theme";
+import { getBreakpointLineSpacing, getBreakPointsValue, getDevice, groupByBreakpoint } from "../helper/theme";
 import Variables from "../Elements/Variables/Variable";
 import Divider from "../Elements/Divider/Divider";
 import { getBorderColor, getSlateDom } from "./helper";
@@ -276,6 +276,9 @@ const getThemeMarkedLeaf = (leaf, children) => {
 };
 export const getMarked = (leaf, children, theme) => {
   const className = leaf?.doublequote ? "doublequote" : "";
+  const lineH = leaf?.lineHeight;
+  const breakpoint = getDevice(window.innerWidth);
+  const lineHeight = getBreakpointLineSpacing(lineH, breakpoint);
   if (leaf.highlight) {
     children = /*#__PURE__*/_jsx("span", {
       style: {
@@ -325,7 +328,7 @@ export const getMarked = (leaf, children, theme) => {
     });
   }
   // cover under single span
-  if (leaf.color || leaf.bgColor || leaf.fontSize || leaf.fontFamily || leaf.fontWeight || className) {
+  if (leaf.color || leaf.bgColor || leaf.fontSize || leaf.fontFamily || leaf.fontWeight || lineHeight || className) {
     const family = leaf?.fontFamily;
     const textStyles = getTextColor(leaf?.color);
     const fontSize = {
@@ -338,6 +341,9 @@ export const getMarked = (leaf, children, theme) => {
     });
     const fontSizeWithBreakpoints = wrapThemeBreakpoints(fontSizesImportant, "fontSize", theme);
     children = /*#__PURE__*/_jsx("span", {
+      style: {
+        background: leaf.bgColor
+      },
       children: /*#__PURE__*/_jsx(Box, {
         className: `${className} leaf-item`,
         component: "span",
@@ -395,9 +401,6 @@ export const getBlock = props => {
     children,
     customProps
   } = props;
-  const {
-    customLineHeight
-  } = customProps || {};
   const attributes = props.attributes ?? {};
   const isEmpty = isEmptyTextNode(element);
   const {
@@ -413,6 +416,9 @@ export const getBlock = props => {
     ...element.attr,
     className: `edt-paragraphs content-editable ${isEmpty ? "empty" : ""} theme-element ${paraType}`
   });
+  const breakpoint = getDevice(window.innerWidth);
+  const lineH = element?.children[0]?.lineHeight;
+  const selectedLineHeight = getBreakpointLineSpacing(lineH, breakpoint);
   switch (element.type) {
     case "headingOne":
       return /*#__PURE__*/_jsxs("h1", {
@@ -493,7 +499,7 @@ export const getBlock = props => {
           margin: `${element?.bgColor ? "16px" : "0px"} 0px`,
           width: element?.bgColor ? "calc(100% - 16px)" : "100%",
           borderWidth: element?.color ? "0px 0px 0px 3px" : "0px",
-          lineHeight: `${customLineHeight} !important`
+          lineHeight: `${selectedLineHeight} !important`
         },
         children: children
       });
@@ -548,15 +554,12 @@ export const getBlock = props => {
         placeholder: translation("List"),
         style: {
           color: firstChildren?.color,
-          lineHeight: `${customLineHeight} !important`
+          lineHeight: `${selectedLineHeight}`
         },
         children: children
       });
     case "orderedList":
       return /*#__PURE__*/_jsx("ol", {
-        style: {
-          lineHeight: `${customLineHeight} !important`
-        },
         className: "listItemMargin",
         type: "1",
         ...attributes,
@@ -564,9 +567,6 @@ export const getBlock = props => {
       });
     case "unorderedList":
       return /*#__PURE__*/_jsx("ul", {
-        style: {
-          lineHeight: `${customLineHeight} !important`
-        },
         className: "listItemMargin",
         ...attributes,
         children: children
@@ -574,6 +574,7 @@ export const getBlock = props => {
     case "check-list-item":
       return /*#__PURE__*/_jsx(CheckList, {
         ...props,
+        selectedLineHeight: selectedLineHeight,
         isEmpty: isEmpty
       });
     case "link":

package/package.json

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