@flozy/editor 7.0.6 → 7.0.7
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.
- package/dist/Editor/CommonEditor.js +19 -19
- package/dist/Editor/Editor.css +3 -4
- package/dist/Editor/Elements/AI/PopoverAIInput.js +12 -2
- package/dist/Editor/Elements/Button/EditorButton.js +0 -1
- package/dist/Editor/Elements/DataView/DataView.js +3 -4
- package/dist/Editor/Elements/DataView/Layouts/DataTypes/NumberType.js +1 -5
- package/dist/Editor/Elements/DataView/Layouts/DataTypes/TextType.js +1 -5
- package/dist/Editor/Elements/DataView/Layouts/FilterView.js +19 -23
- package/dist/Editor/Elements/Form/Form.js +0 -1
- package/dist/Editor/Elements/FreeGrid/styles.js +0 -1
- package/dist/Editor/Elements/List/CheckList.js +1 -2
- package/dist/Editor/Elements/Search/SearchAttachment.js +0 -1
- package/dist/Editor/Elements/Search/SearchList.js +1 -8
- package/dist/Editor/Elements/SimpleText/index.js +7 -19
- package/dist/Editor/Elements/SimpleText/style.js +1 -5
- package/dist/Editor/Elements/Table/Table.js +15 -15
- package/dist/Editor/Elements/Table/TableCell.js +9 -14
- package/dist/Editor/MiniEditor.js +2 -4
- package/dist/Editor/Styles/EditorStyles.js +287 -291
- package/dist/Editor/Toolbar/PopupTool/AddTemplates.js +28 -37
- package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectAlignment.js +1 -3
- package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectFontSize.js +1 -1
- package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectList.js +1 -3
- package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectTypography.js +8 -3
- package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/index.js +3 -9
- package/dist/Editor/Toolbar/PopupTool/TemplateCard.js +1 -1
- package/dist/Editor/Toolbar/PopupTool/TextFormat.js +0 -45
- package/dist/Editor/Toolbar/PopupTool/index.js +32 -57
- package/dist/Editor/common/FontLoader/FontList.js +11 -11
- package/dist/Editor/common/FontLoader/FontLoader.js +75 -45
- package/dist/Editor/common/ImageSelector/Options/Upload.js +1 -1
- package/dist/Editor/common/ImageSelector/UploadStyles.js +1 -2
- package/dist/Editor/common/MentionsPopup/index.js +1 -0
- package/dist/Editor/common/RnD/ElementSettings/styles.js +0 -1
- package/dist/Editor/common/RnD/SwitchViewport/SwitchViewport.js +0 -6
- package/dist/Editor/common/Section/index.js +60 -89
- package/dist/Editor/common/StyleBuilder/fieldTypes/index.js +1 -3
- package/dist/Editor/common/StyleBuilder/pageSettingsStyle.js +0 -4
- package/dist/Editor/commonStyle.js +0 -5
- package/dist/Editor/helper/deserialize/index.js +1 -1
- package/dist/Editor/helper/theme.js +1 -24
- package/dist/Editor/hooks/useDrag.js +17 -11
- package/dist/Editor/hooks/useEditorScroll.js +1 -2
- package/dist/Editor/hooks/useMouseMove.js +4 -6
- package/dist/Editor/plugins/withHTML.js +1 -7
- package/dist/Editor/utils/SlateUtilityFunctions.js +12 -23
- package/dist/Editor/utils/customHooks/useTableResize.js +1 -2
- package/dist/Editor/utils/helper.js +0 -41
- package/dist/Editor/utils/pageSettings.js +2 -14
- package/dist/Editor/utils/table.js +0 -21
- package/package.json +3 -3
- package/dist/Editor/common/StyleBuilder/fieldTypes/lineSpacing.js +0 -79
- package/dist/Editor/helper/ensureWrappedVariables.js +0 -28
@@ -1,4 +1,4 @@
|
|
1
|
-
import { Editor, Transforms, Element as SlateElement
|
1
|
+
import { Editor, Transforms, Element as SlateElement } from "slate";
|
2
2
|
import { Box } from "@mui/material";
|
3
3
|
import { sizeMap } from "./font";
|
4
4
|
import Link from "../Elements/Link/Link";
|
@@ -38,7 +38,7 @@ import { getBreakPointsValue, groupByBreakpoint } from "../helper/theme";
|
|
38
38
|
import Variables from "../Elements/Variables/Variable";
|
39
39
|
import insertNewLine from "./insertNewLine";
|
40
40
|
import Divider from "../Elements/Divider/Divider";
|
41
|
-
import { getBorderColor
|
41
|
+
import { getBorderColor } from "./helper";
|
42
42
|
import Code from "../Elements/EmbedScript/Code";
|
43
43
|
import FreeGrid from "../Elements/FreeGrid/FreeGrid";
|
44
44
|
import FreeGridItem from "../Elements/FreeGrid/FreeGridItem";
|
@@ -161,17 +161,7 @@ export const activeMark = (editor, format) => {
|
|
161
161
|
};
|
162
162
|
try {
|
163
163
|
const marks = Editor.marks(editor);
|
164
|
-
|
165
|
-
const {
|
166
|
-
selection
|
167
|
-
} = editor || {};
|
168
|
-
if (format === "fontSize" && selection && !Range.isCollapsed(selection)) {
|
169
|
-
const slateDom = getSlateDom(editor, editor?.selection);
|
170
|
-
if (slateDom) {
|
171
|
-
const parentElement = slateDom.commonAncestorContainer.parentElement;
|
172
|
-
defaultValue = window.getComputedStyle(parentElement).fontSize;
|
173
|
-
}
|
174
|
-
}
|
164
|
+
const defaultValue = defaultMarkData[format];
|
175
165
|
return marks?.[format] ?? defaultValue;
|
176
166
|
} catch (err) {
|
177
167
|
console.log(err);
|
@@ -183,9 +173,10 @@ export const getMarked = (leaf, children, theme) => {
|
|
183
173
|
if (leaf.highlight) {
|
184
174
|
children = /*#__PURE__*/_jsx("span", {
|
185
175
|
style: {
|
186
|
-
color: "inherit"
|
187
|
-
background: "var(--slate-highlight-bg)"
|
176
|
+
color: "inherit"
|
188
177
|
},
|
178
|
+
className: "slate-highlight" // while opening AI, we will use this element to highlight the selection. (PopoverAIInput.js)
|
179
|
+
,
|
189
180
|
children: children
|
190
181
|
});
|
191
182
|
}
|
@@ -347,8 +338,7 @@ export const getBlock = props => {
|
|
347
338
|
borderRadius: `${element?.color ? "0px" : "12px"} 12px 12px ${element?.color ? "0px" : "12px"}`,
|
348
339
|
margin: `${element?.bgColor ? "16px" : "0px"} 0px`,
|
349
340
|
width: element?.bgColor ? "calc(100% - 16px)" : "100%",
|
350
|
-
borderWidth: element?.color ? "0px 0px 0px 3px" : "0px"
|
351
|
-
lineHeight: 1.43
|
341
|
+
borderWidth: element?.color ? "0px 0px 0px 3px" : "0px"
|
352
342
|
},
|
353
343
|
children: children
|
354
344
|
});
|
@@ -408,9 +398,6 @@ export const getBlock = props => {
|
|
408
398
|
});
|
409
399
|
case "orderedList":
|
410
400
|
return /*#__PURE__*/_jsx("ol", {
|
411
|
-
style: {
|
412
|
-
lineHeight: 1.43
|
413
|
-
},
|
414
401
|
className: "listItemMargin",
|
415
402
|
type: "1",
|
416
403
|
...attributes,
|
@@ -418,9 +405,6 @@ export const getBlock = props => {
|
|
418
405
|
});
|
419
406
|
case "unorderedList":
|
420
407
|
return /*#__PURE__*/_jsx("ul", {
|
421
|
-
style: {
|
422
|
-
lineHeight: 1.43
|
423
|
-
},
|
424
408
|
className: "listItemMargin",
|
425
409
|
...attributes,
|
426
410
|
children: children
|
@@ -630,6 +614,11 @@ export const getBlock = props => {
|
|
630
614
|
children: children
|
631
615
|
});
|
632
616
|
default:
|
617
|
+
// return (
|
618
|
+
// <span {...attributes} {...element.attr}>
|
619
|
+
// {children}
|
620
|
+
// </span>
|
621
|
+
// );
|
633
622
|
return /*#__PURE__*/_jsx(SimpleText, {
|
634
623
|
...props,
|
635
624
|
isEmpty: isEmpty
|
@@ -43,8 +43,7 @@ const useTableResize = ({
|
|
43
43
|
minWidth
|
44
44
|
} = minMaxProps || {};
|
45
45
|
setSize(currentSize => {
|
46
|
-
const
|
47
|
-
const calcWidth = width + e.movementX;
|
46
|
+
const calcWidth = currentSize?.width + e.movementX;
|
48
47
|
return {
|
49
48
|
width: minWidth && calcWidth < minWidth ? minWidth : calcWidth,
|
50
49
|
height: currentSize.height + e.movementY,
|
@@ -713,47 +713,6 @@ export const getSlateDom = (editor, range) => {
|
|
713
713
|
console.log(err);
|
714
714
|
}
|
715
715
|
};
|
716
|
-
|
717
|
-
// The inputs inside the dynamic table lose focus after calling `setNodes` on the first `onChange` event.
|
718
|
-
// To replicate this issue, insert some paragraph nodes above the dynamic table, then type something in the title.
|
719
|
-
// After typing the first word, the input loses focus.
|
720
|
-
export const focusDynamicTableInput = e => {
|
721
|
-
setTimeout(() => {
|
722
|
-
const input = document.getElementById(e.target.id);
|
723
|
-
if (input) {
|
724
|
-
// Check if the input is not already focused
|
725
|
-
if (document.activeElement !== input) {
|
726
|
-
const length = input.value.length;
|
727
|
-
// Focus on the input
|
728
|
-
input.focus();
|
729
|
-
|
730
|
-
// number input not supports selection
|
731
|
-
if (e.target.type !== "number") {
|
732
|
-
// Set the cursor to the end
|
733
|
-
input.setSelectionRange(length, length);
|
734
|
-
}
|
735
|
-
}
|
736
|
-
}
|
737
|
-
}, 0);
|
738
|
-
};
|
739
|
-
export const clearWindowSelection = () => {
|
740
|
-
const selection = window.getSelection();
|
741
|
-
if (selection) {
|
742
|
-
selection.removeAllRanges(); // Clears the selection
|
743
|
-
}
|
744
|
-
};
|
745
|
-
|
746
|
-
export const viewSlateSelection = () => {
|
747
|
-
// if ai is opened, remove the window selection class and open then slate selection, To resolve: focussing on the ai input removes window selection automatically
|
748
|
-
clearWindowSelection();
|
749
|
-
const selectionBg = "rgba(35, 131, 226, 0.35)";
|
750
|
-
const root = document.documentElement;
|
751
|
-
root.style.setProperty("--slate-highlight-bg", selectionBg);
|
752
|
-
};
|
753
|
-
export const hideSlateSelection = () => {
|
754
|
-
const root = document.documentElement;
|
755
|
-
root.style.setProperty("--slate-highlight-bg", "none");
|
756
|
-
};
|
757
716
|
export function handleNegativeInteger(val) {
|
758
717
|
return val < 0 ? 0 : val;
|
759
718
|
}
|
@@ -9,13 +9,7 @@ export const findPageSettings = editor => {
|
|
9
9
|
path: null,
|
10
10
|
element: {
|
11
11
|
pageProps: {
|
12
|
-
pageWidth: "fixed"
|
13
|
-
"lineHeight": {
|
14
|
-
"xs": 1.43,
|
15
|
-
"sm": 1.43,
|
16
|
-
"md": 1.43,
|
17
|
-
"lg": 1.43
|
18
|
-
}
|
12
|
+
pageWidth: "fixed"
|
19
13
|
}
|
20
14
|
}
|
21
15
|
};
|
@@ -40,13 +34,7 @@ export const getPageSettings = editor => {
|
|
40
34
|
path: null,
|
41
35
|
element: {
|
42
36
|
pageProps: {
|
43
|
-
pageWidth: "fixed"
|
44
|
-
"lineHeight": {
|
45
|
-
"xs": 1.43,
|
46
|
-
"sm": 1.43,
|
47
|
-
"md": 1.43,
|
48
|
-
"lg": 1.43
|
49
|
-
}
|
37
|
+
pageWidth: "fixed"
|
50
38
|
}
|
51
39
|
}
|
52
40
|
};
|
@@ -753,25 +753,4 @@ export const clearCellText = (editor, currentCellPath) => {
|
|
753
753
|
} catch (err) {
|
754
754
|
console.log(err);
|
755
755
|
}
|
756
|
-
};
|
757
|
-
export const getTableColumns = element => {
|
758
|
-
const {
|
759
|
-
columns,
|
760
|
-
children
|
761
|
-
} = element || {};
|
762
|
-
if (columns) {
|
763
|
-
return columns;
|
764
|
-
}
|
765
|
-
const firstRow = children?.length ? children[0] : {};
|
766
|
-
return firstRow?.children?.length || 0;
|
767
|
-
};
|
768
|
-
export const getTableRows = element => {
|
769
|
-
const {
|
770
|
-
rows,
|
771
|
-
children
|
772
|
-
} = element || {};
|
773
|
-
if (rows) {
|
774
|
-
return rows;
|
775
|
-
}
|
776
|
-
return children?.length || 0;
|
777
756
|
};
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@flozy/editor",
|
3
|
-
"version": "7.0.
|
3
|
+
"version": "7.0.7",
|
4
4
|
"description": "An Editor for flozy app brain",
|
5
5
|
"files": [
|
6
6
|
"dist"
|
@@ -61,7 +61,7 @@
|
|
61
61
|
"scripts": {
|
62
62
|
"prepare": "husky install .husky",
|
63
63
|
"analyze": "source-map-explorer build/static/js/*.js",
|
64
|
-
"lint": "./node_modules/.
|
64
|
+
"lint": "./node_modules/.bin/eslint --ignore-path .gitignore .",
|
65
65
|
"start": "craco start",
|
66
66
|
"build": "NODE_OPTIONS='--max_old_space_size=4096' craco build",
|
67
67
|
"test": "craco test --passWithNoTests",
|
@@ -69,7 +69,7 @@
|
|
69
69
|
"storybook": "storybook dev -p 6006",
|
70
70
|
"build-storybook": "NODE_OPTIONS='--max_old_space_size=4096' storybook build",
|
71
71
|
"publish:npm": "rm -rf dist && mkdir dist && babel src/components -d dist --copy-files",
|
72
|
-
"publish:local": "rm -rf /Users/
|
72
|
+
"publish:local": "rm -rf /Users/agmac03/flozy/client/node_modules/@flozy/editor/dist && babel src/components -d /Users/agmac03/flozy/client/node_modules/@flozy/editor/dist --copy-files"
|
73
73
|
},
|
74
74
|
"eslintConfig": {
|
75
75
|
"extends": [
|
@@ -1,79 +0,0 @@
|
|
1
|
-
import React, { useState } from "react";
|
2
|
-
import { Grid, Slider, Typography, Box } from "@mui/material";
|
3
|
-
import { getBreakPointsValue } from "../../../helper/theme";
|
4
|
-
import useWindowResize from "../../../hooks/useWindowResize";
|
5
|
-
import { useEditorContext } from "../../../hooks/useMouseMove";
|
6
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
7
|
-
import { jsxs as _jsxs } from "react/jsx-runtime";
|
8
|
-
const LineSpacing = props => {
|
9
|
-
const {
|
10
|
-
value: val,
|
11
|
-
data,
|
12
|
-
onChange
|
13
|
-
} = props;
|
14
|
-
const {
|
15
|
-
theme
|
16
|
-
} = useEditorContext();
|
17
|
-
const {
|
18
|
-
key
|
19
|
-
} = data;
|
20
|
-
const [size] = useWindowResize();
|
21
|
-
const pro_value = getBreakPointsValue(val, size?.device);
|
22
|
-
const [value, setValue] = useState(pro_value);
|
23
|
-
let breakpointValue = getBreakPointsValue(val, null);
|
24
|
-
breakpointValue = typeof breakpointValue['lg'] === 'object' ? breakpointValue['lg'] : breakpointValue;
|
25
|
-
useState(() => {
|
26
|
-
setValue(pro_value);
|
27
|
-
}, [pro_value]);
|
28
|
-
const handleChange = e => {
|
29
|
-
onChange({
|
30
|
-
[key]: {
|
31
|
-
...breakpointValue,
|
32
|
-
[size?.device]: e.target.value
|
33
|
-
}
|
34
|
-
});
|
35
|
-
};
|
36
|
-
return /*#__PURE__*/_jsxs(Grid, {
|
37
|
-
item: true,
|
38
|
-
xs: 12,
|
39
|
-
children: [/*#__PURE__*/_jsx(Typography, {
|
40
|
-
variant: "body1",
|
41
|
-
color: "primary",
|
42
|
-
style: {
|
43
|
-
fontSize: "14px",
|
44
|
-
fontWeight: 500
|
45
|
-
},
|
46
|
-
children: data?.label
|
47
|
-
}), /*#__PURE__*/_jsxs(Grid, {
|
48
|
-
container: true,
|
49
|
-
wrap: "nowrap",
|
50
|
-
className: "sld-wrpr",
|
51
|
-
children: [/*#__PURE__*/_jsx(Slider, {
|
52
|
-
className: "spacingSlider",
|
53
|
-
defaultValue: value || 1.43,
|
54
|
-
"aria-label": "Default",
|
55
|
-
valueLabelDisplay: "auto",
|
56
|
-
min: 0.5,
|
57
|
-
max: 3.0,
|
58
|
-
step: 0.1,
|
59
|
-
name: "lineHeight",
|
60
|
-
onChange: handleChange
|
61
|
-
}), /*#__PURE__*/_jsx(Box, {
|
62
|
-
component: "input",
|
63
|
-
sx: {
|
64
|
-
background: theme?.palette?.editor?.background,
|
65
|
-
color: theme?.palette?.editor?.textColor
|
66
|
-
},
|
67
|
-
name: "lineHeight",
|
68
|
-
value: pro_value,
|
69
|
-
className: "sliderInput",
|
70
|
-
onChange: handleChange,
|
71
|
-
type: "number",
|
72
|
-
placeholder: "0",
|
73
|
-
disabled: true,
|
74
|
-
defaultValue: pro_value || 1.43
|
75
|
-
})]
|
76
|
-
})]
|
77
|
-
});
|
78
|
-
};
|
79
|
-
export default LineSpacing;
|
@@ -1,28 +0,0 @@
|
|
1
|
-
export const ensureWrappedVariables = content => {
|
2
|
-
return content.map(node => {
|
3
|
-
if (node.children) {
|
4
|
-
return {
|
5
|
-
...node,
|
6
|
-
children: node.children.reduce((result, child, index, arr) => {
|
7
|
-
if (child.type === "variables") {
|
8
|
-
if (index === 0 || !arr[index - 1].text || arr[index - 1].text.trim() === "") {
|
9
|
-
result.push({
|
10
|
-
text: ""
|
11
|
-
});
|
12
|
-
}
|
13
|
-
result.push(child);
|
14
|
-
if (index === arr.length - 1 || !arr[index + 1]?.text || arr[index + 1]?.text.trim() === "") {
|
15
|
-
result.push({
|
16
|
-
text: ""
|
17
|
-
});
|
18
|
-
}
|
19
|
-
} else {
|
20
|
-
result.push(child);
|
21
|
-
}
|
22
|
-
return result;
|
23
|
-
}, [])
|
24
|
-
};
|
25
|
-
}
|
26
|
-
return node;
|
27
|
-
});
|
28
|
-
};
|