@flozy/editor 10.1.7 → 10.1.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -15,7 +15,8 @@ const CheckList = props => {
15
15
  isEmpty,
16
16
  className,
17
17
  style,
18
- customProps
18
+ customProps,
19
+ selectedLineHeight
19
20
  } = props;
20
21
  const {
21
22
  translation
@@ -27,9 +28,6 @@ const CheckList = props => {
27
28
  checked
28
29
  } = element;
29
30
  const path = ReactEditor.findPath(editor, element);
30
- const {
31
- customLineHeight
32
- } = customProps || {};
33
31
  const handleCheck = e => {
34
32
  Transforms.setNodes(editor, {
35
33
  checked: e.target.checked
@@ -48,7 +46,7 @@ const CheckList = props => {
48
46
  justifyContent: "center",
49
47
  alignItems: "center",
50
48
  ...(style || {}),
51
- lineHeight: `${customLineHeight} !important`
49
+ lineHeight: `${selectedLineHeight}`
52
50
  },
53
51
  children: [/*#__PURE__*/_jsxs("div", {
54
52
  contentEditable: false,
@@ -34,7 +34,7 @@ import SimpleText from "../Elements/SimpleText";
34
34
  import CheckList from "../Elements/List/CheckList";
35
35
  import { getTextColor, isEmptyTextNode } from "../helper";
36
36
  import Attachments from "../Elements/Attachments/Attachments";
37
- import { getBreakPointsValue, textThemeFields, getElementProperty } from "../helper/theme";
37
+ import { getBreakpointLineSpacing, getBreakPointsValue, getDevice, getElementProperty, textThemeFields } from "../helper/theme";
38
38
  import Variables from "../Elements/Variables/Variable";
39
39
  import Divider from "../Elements/Divider/Divider";
40
40
  import { getBorderColor, getSlateDom } from "./helper";
@@ -276,6 +276,9 @@ const getThemeMarkedLeaf = (leaf, children) => {
276
276
  };
277
277
  export const getMarked = (leaf, children, theme) => {
278
278
  const className = leaf?.doublequote ? "doublequote" : "";
279
+ const lineH = leaf?.lineHeight;
280
+ const breakpoint = getDevice(window.innerWidth);
281
+ const lineHeight = getBreakpointLineSpacing(lineH, breakpoint);
279
282
  if (leaf.highlight) {
280
283
  children = /*#__PURE__*/_jsx("span", {
281
284
  style: {
@@ -325,7 +328,7 @@ export const getMarked = (leaf, children, theme) => {
325
328
  });
326
329
  }
327
330
  // cover under single span
328
- if (leaf.color || leaf.bgColor || leaf.fontSize || leaf.fontFamily || leaf.fontWeight || className) {
331
+ if (leaf.color || leaf.bgColor || leaf.fontSize || leaf.fontFamily || leaf.fontWeight || lineHeight || className) {
329
332
  const family = leaf?.fontFamily;
330
333
  const textStyles = getTextColor(leaf?.color);
331
334
  const fontSize = {
@@ -338,6 +341,9 @@ export const getMarked = (leaf, children, theme) => {
338
341
  });
339
342
  const fontSizeWithBreakpoints = wrapThemeBreakpoints(fontSizesImportant, "fontSize", theme);
340
343
  children = /*#__PURE__*/_jsx("span", {
344
+ style: {
345
+ background: leaf.bgColor
346
+ },
341
347
  children: /*#__PURE__*/_jsx(Box, {
342
348
  className: `${className} leaf-item`,
343
349
  component: "span",
@@ -395,9 +401,6 @@ export const getBlock = props => {
395
401
  children,
396
402
  customProps
397
403
  } = props;
398
- const {
399
- customLineHeight
400
- } = customProps || {};
401
404
  const attributes = props.attributes ?? {};
402
405
  const isEmpty = isEmptyTextNode(element);
403
406
  const {
@@ -413,6 +416,9 @@ export const getBlock = props => {
413
416
  ...element.attr,
414
417
  className: `edt-paragraphs content-editable ${isEmpty ? "empty" : ""} theme-element ${paraType}`
415
418
  });
419
+ const breakpoint = getDevice(window.innerWidth);
420
+ const lineH = element?.children[0]?.lineHeight;
421
+ const selectedLineHeight = getBreakpointLineSpacing(lineH, breakpoint);
416
422
  switch (element.type) {
417
423
  case "headingOne":
418
424
  return /*#__PURE__*/_jsxs("h1", {
@@ -493,7 +499,7 @@ export const getBlock = props => {
493
499
  margin: `${element?.bgColor ? "16px" : "0px"} 0px`,
494
500
  width: element?.bgColor ? "calc(100% - 16px)" : "100%",
495
501
  borderWidth: element?.color ? "0px 0px 0px 3px" : "0px",
496
- lineHeight: `${customLineHeight} !important`
502
+ lineHeight: `${selectedLineHeight} !important`
497
503
  },
498
504
  children: children
499
505
  });
@@ -548,15 +554,12 @@ export const getBlock = props => {
548
554
  placeholder: translation("List"),
549
555
  style: {
550
556
  color: firstChildren?.color,
551
- lineHeight: `${customLineHeight} !important`
557
+ lineHeight: `${selectedLineHeight}`
552
558
  },
553
559
  children: children
554
560
  });
555
561
  case "orderedList":
556
562
  return /*#__PURE__*/_jsx("ol", {
557
- style: {
558
- lineHeight: `${customLineHeight} !important`
559
- },
560
563
  className: "listItemMargin",
561
564
  type: "1",
562
565
  ...attributes,
@@ -564,9 +567,6 @@ export const getBlock = props => {
564
567
  });
565
568
  case "unorderedList":
566
569
  return /*#__PURE__*/_jsx("ul", {
567
- style: {
568
- lineHeight: `${customLineHeight} !important`
569
- },
570
570
  className: "listItemMargin",
571
571
  ...attributes,
572
572
  children: children
@@ -574,6 +574,7 @@ export const getBlock = props => {
574
574
  case "check-list-item":
575
575
  return /*#__PURE__*/_jsx(CheckList, {
576
576
  ...props,
577
+ selectedLineHeight: selectedLineHeight,
577
578
  isEmpty: isEmpty
578
579
  });
579
580
  case "link":
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@flozy/editor",
3
- "version": "10.1.7",
3
+ "version": "10.1.9",
4
4
  "description": "An Editor for flozy app brain",
5
5
  "files": [
6
6
  "dist"