@flozy/editor 1.7.7 → 1.7.9

Sign up to get free protection for your applications and to get access to all the features.
Files changed (43) hide show
  1. package/dist/Editor/CommonEditor.js +1 -2
  2. package/dist/Editor/Editor.css +3 -2
  3. package/dist/Editor/Elements/Accordion/AccordionDetails.js +1 -2
  4. package/dist/Editor/Elements/Attachments/Attachments.js +95 -0
  5. package/dist/Editor/Elements/Attachments/AttachmentsButton.js +46 -0
  6. package/dist/Editor/Elements/Button/EditorButton.js +11 -12
  7. package/dist/Editor/Elements/Carousel/Carousel.js +3 -3
  8. package/dist/Editor/Elements/Carousel/CarouselItem.js +54 -3
  9. package/dist/Editor/Elements/Embed/Image.js +1 -1
  10. package/dist/Editor/Elements/Grid/templates/carousel_item.js +60 -0
  11. package/dist/Editor/Elements/Link/Link.js +6 -4
  12. package/dist/Editor/Elements/List/CheckListButton.js +2 -2
  13. package/dist/Editor/Elements/SimpleText.js +1 -1
  14. package/dist/Editor/Elements/Table/TableCell.js +4 -2
  15. package/dist/Editor/Styles/EditorStyles.js +16 -2
  16. package/dist/Editor/Toolbar/Mini/MiniToolbar.js +0 -3
  17. package/dist/Editor/Toolbar/PopupTool/PopupToolStyle.js +1 -1
  18. package/dist/Editor/Toolbar/Toolbar.js +7 -0
  19. package/dist/Editor/Toolbar/toolbarGroups.js +5 -0
  20. package/dist/Editor/common/ColorPickerButton.js +7 -5
  21. package/dist/Editor/common/DnD/DragHandle.js +10 -5
  22. package/dist/Editor/common/DnD/index.js +2 -2
  23. package/dist/Editor/common/Icon.js +3 -2
  24. package/dist/Editor/common/ImageSelector/ImageSelector.js +12 -4
  25. package/dist/Editor/common/ImageSelector/Options/Upload.js +4 -2
  26. package/dist/Editor/common/MentionsPopup/Styles.js +1 -1
  27. package/dist/Editor/common/MentionsPopup/index.js +1 -0
  28. package/dist/Editor/common/Section/index.js +10 -5
  29. package/dist/Editor/common/Shorthands/elements.js +2 -2
  30. package/dist/Editor/common/StyleBuilder/buttonStyle.js +1 -9
  31. package/dist/Editor/common/StyleBuilder/fieldTypes/textAlign.js +3 -2
  32. package/dist/Editor/common/StyleBuilder/index.js +3 -0
  33. package/dist/Editor/common/Uploader.js +48 -10
  34. package/dist/Editor/common/iconslist.js +10 -10
  35. package/dist/Editor/service/fileupload.js +0 -1
  36. package/dist/Editor/utils/SlateUtilityFunctions.js +24 -7
  37. package/dist/Editor/utils/attachments.js +35 -0
  38. package/dist/Editor/utils/button.js +2 -0
  39. package/dist/Editor/utils/carouselItem.js +2 -4
  40. package/dist/Editor/utils/events.js +1 -1
  41. package/dist/Editor/utils/helper.js +11 -0
  42. package/dist/Editor/utils/table.js +27 -8
  43. package/package.json +1 -1
@@ -25,10 +25,10 @@ import { EditorProvider } from "./hooks/useMouseMove";
25
25
  import TopBanner from "./Elements/TopBanner/TopBanner";
26
26
  import editorStyles from "./Styles/EditorStyles";
27
27
  import DragAndDrop from "./common/DnD";
28
+ import DragHandle from "./common/DnD/DragHandle";
28
29
  import Section from "./common/Section";
29
30
  import "animate.css";
30
31
  import decorators from "./utils/Decorators";
31
- import useFormat from "./utils/customHooks/useFormat";
32
32
  import useElement from "./utils/customHooks/useElement";
33
33
  import { jsx as _jsx } from "react/jsx-runtime";
34
34
  import { jsxs as _jsxs } from "react/jsx-runtime";
@@ -128,7 +128,6 @@ const CommonEditor = /*#__PURE__*/forwardRef((props, ref) => {
128
128
  placeHolderColor: invertColor(pageColor || "#FFF")
129
129
  });
130
130
  const isListItem = useElement(editor, ["list-item", "check-list-item", "accordion-summary"]);
131
- console.log(editor.selection);
132
131
  useEffect(() => {
133
132
  setValue(draftToSlate({
134
133
  data: content
@@ -32,11 +32,11 @@ blockquote {
32
32
  .editor-wrapper table,
33
33
  .editor-wrapperth,
34
34
  .editor-wrapper td {
35
- border: 1px solid black;
35
+ border: 1px solid transparent;
36
36
  }
37
37
 
38
38
  .editor-wrapper table {
39
- border-collapse: collapse;
39
+ border-collapse: separate;
40
40
  }
41
41
 
42
42
  .editor-wrapper .editor-wrapperbutton {
@@ -397,6 +397,7 @@ blockquote {
397
397
 
398
398
  .empty-carousel-wrapper .carousel-item-inner {
399
399
  width: 100%;
400
+ position: relative;
400
401
  }
401
402
 
402
403
  .editor-chip-text {
@@ -9,8 +9,7 @@ const AccordionDetails = props => {
9
9
  className: `accordion-details-container`,
10
10
  ...attributes,
11
11
  style: {
12
- height: "auto",
13
- overflow: "hidden"
12
+ height: "auto"
14
13
  },
15
14
  children: children
16
15
  });
@@ -0,0 +1,95 @@
1
+ import React from "react";
2
+ import { Box, Card, CardMedia, CardContent, Typography } from "@mui/material";
3
+ import PictureAsPdfIcon from "@mui/icons-material/PictureAsPdf";
4
+ import TextSnippetIcon from "@mui/icons-material/TextSnippet";
5
+ import { formatDate } from "../../utils/helper";
6
+ import { jsx as _jsx } from "react/jsx-runtime";
7
+ import { jsxs as _jsxs } from "react/jsx-runtime";
8
+ const Attachments = props => {
9
+ const {
10
+ attributes,
11
+ element,
12
+ children
13
+ } = props;
14
+ const {
15
+ url,
16
+ type,
17
+ date
18
+ } = element;
19
+ const getLastName = url?.split("/").pop();
20
+ const fileName = `${getLastName}`;
21
+ return /*#__PURE__*/_jsxs(Box, {
22
+ component: "div",
23
+ className: "attachment-wrpr-ev2",
24
+ ...attributes,
25
+ contentEditable: false,
26
+ style: {
27
+ display: "inline-flex"
28
+ },
29
+ children: [/*#__PURE__*/_jsxs(Card, {
30
+ style: {
31
+ display: "flex",
32
+ justifyContent: "center",
33
+ alignItems: "center",
34
+ width: "100%",
35
+ padding: "8px",
36
+ boxShadow: "none",
37
+ border: "1px solid #eae9e9",
38
+ backgroundColor: "#F7F7F7"
39
+ },
40
+ children: [/*#__PURE__*/_jsx(CardMedia, {
41
+ sx: {
42
+ "& svg": {
43
+ width: 32,
44
+ height: 32,
45
+ "&.pdf-i": {
46
+ fill: "#e5252a"
47
+ },
48
+ "&.doc-i": {
49
+ fill: "#0263d1"
50
+ }
51
+ }
52
+ },
53
+ children: type === "pdf" ? /*#__PURE__*/_jsx(PictureAsPdfIcon, {
54
+ className: "pdf-i"
55
+ }) : /*#__PURE__*/_jsx(TextSnippetIcon, {
56
+ className: "doc-i"
57
+ })
58
+ }), /*#__PURE__*/_jsxs(CardContent, {
59
+ component: "a",
60
+ href: url,
61
+ target: "_blank",
62
+ style: {
63
+ display: "flex",
64
+ justifyContent: "center",
65
+ alignItems: "start",
66
+ padding: "8px",
67
+ textDecoration: "none",
68
+ flexDirection: "column",
69
+ color: "#0F172A"
70
+ },
71
+ children: [/*#__PURE__*/_jsx(Typography, {
72
+ style: {
73
+ fontWeight: "bold",
74
+ color: "#0F172A",
75
+ fontSize: "14px"
76
+ },
77
+ component: "div",
78
+ children: fileName
79
+ }), /*#__PURE__*/_jsx(Typography, {
80
+ style: {
81
+ fontWeight: "normal",
82
+ color: "#64748b",
83
+ fontSize: "11px"
84
+ },
85
+ component: "div",
86
+ children: formatDate(date)
87
+ })]
88
+ })]
89
+ }), /*#__PURE__*/_jsx("span", {
90
+ contentEditable: false,
91
+ children: children
92
+ })]
93
+ });
94
+ };
95
+ export default Attachments;
@@ -0,0 +1,46 @@
1
+ import React, { useState } from "react";
2
+ import { useSlateStatic } from "slate-react";
3
+ import ToolbarIcon from "../../common/ToolbarIcon";
4
+ import Icon from "../../common/Icon";
5
+ import ImageSelector from "../../common/ImageSelector/ImageSelector";
6
+ import { insertAttachments } from "../../utils/attachments";
7
+ import { jsx as _jsx } from "react/jsx-runtime";
8
+ import { Fragment as _Fragment } from "react/jsx-runtime";
9
+ import { jsxs as _jsxs } from "react/jsx-runtime";
10
+ const AttachmentsButton = props => {
11
+ const editor = useSlateStatic();
12
+ const {
13
+ customProps,
14
+ icoBtnType
15
+ } = props;
16
+ const [open, SetOpen] = useState(false);
17
+ const handleClick = () => {
18
+ SetOpen(true);
19
+ };
20
+ const onSelectImage = url => {
21
+ insertAttachments(editor, {
22
+ url
23
+ });
24
+ handleClose();
25
+ };
26
+ const handleClose = () => {
27
+ SetOpen(false);
28
+ };
29
+ return /*#__PURE__*/_jsxs(_Fragment, {
30
+ children: [/*#__PURE__*/_jsx(ToolbarIcon, {
31
+ title: "Doc Upload",
32
+ onClick: handleClick,
33
+ icon: /*#__PURE__*/_jsx(Icon, {
34
+ icon: "docsUpload"
35
+ }),
36
+ icoBtnType: icoBtnType
37
+ }), /*#__PURE__*/_jsx(ImageSelector, {
38
+ open: open,
39
+ onClose: handleClose,
40
+ customProps: customProps,
41
+ onSelectImage: onSelectImage,
42
+ title: "Document"
43
+ })]
44
+ });
45
+ };
46
+ export default AttachmentsButton;
@@ -114,20 +114,20 @@ const EditorButton = props => {
114
114
  onClick: onMenuClick("edit"),
115
115
  children: /*#__PURE__*/_jsx(SettingsIcon, {})
116
116
  })
117
- }), /*#__PURE__*/_jsxs(Tooltip, {
117
+ }), /*#__PURE__*/_jsx(Tooltip, {
118
118
  title: "Open Link",
119
119
  arrow: true,
120
- children: [/*#__PURE__*/_jsx(IconButton, {
120
+ children: /*#__PURE__*/_jsx(IconButton, {
121
121
  onClick: onMenuClick("open"),
122
122
  children: /*#__PURE__*/_jsx(OpenInNewIcon, {})
123
- }), /*#__PURE__*/_jsx(Tooltip, {
124
- title: "Delete",
125
- arrow: true,
126
- children: /*#__PURE__*/_jsx(IconButton, {
127
- onClick: onMenuClick("delete"),
128
- children: /*#__PURE__*/_jsx(DeleteIcon, {})
129
- })
130
- })]
123
+ })
124
+ }), /*#__PURE__*/_jsx(Tooltip, {
125
+ title: "Delete",
126
+ arrow: true,
127
+ children: /*#__PURE__*/_jsx(IconButton, {
128
+ onClick: onMenuClick("delete"),
129
+ children: /*#__PURE__*/_jsx(DeleteIcon, {})
130
+ })
131
131
  })]
132
132
  }) : null;
133
133
  };
@@ -150,15 +150,14 @@ const EditorButton = props => {
150
150
  className: "editor-btn-wrapper",
151
151
  ...attributes,
152
152
  style: {
153
- display: "inline",
154
153
  textAlign: textAlign || "left"
155
154
  },
155
+ contentEditable: false,
156
156
  children: [/*#__PURE__*/_jsx("div", {
157
157
  className: "editor-btn-wrapper-inner",
158
158
  style: {
159
159
  display: "inline"
160
160
  },
161
- contentEditable: false,
162
161
  children: /*#__PURE__*/_jsxs(Box, {
163
162
  component: "button",
164
163
  sx: {
@@ -113,8 +113,7 @@ const Carousel = props => {
113
113
  className: "sliderBg",
114
114
  style: {
115
115
  backgroundColor: "transparent",
116
- position: "relative",
117
- minHeight: "300px"
116
+ position: "relative"
118
117
  },
119
118
  contentEditable: edit,
120
119
  onMouseOver: onMouseOver,
@@ -130,11 +129,12 @@ const Carousel = props => {
130
129
  ...settings,
131
130
  children: children.map((m, i) => {
132
131
  return /*#__PURE__*/_jsx("div", {
132
+ className: "item-sc",
133
133
  children: m
134
134
  }, i);
135
135
  })
136
136
  })
137
- }, `slider_${children.length}`), !readOnly && /*#__PURE__*/_jsx(ToolBar, {})]
137
+ }, `slider_${children.length}_${new Date().getTime()}`), !readOnly && /*#__PURE__*/_jsx(ToolBar, {})]
138
138
  });
139
139
  };
140
140
  export default Carousel;
@@ -1,16 +1,67 @@
1
1
  import React from "react";
2
+ import { Node, Transforms } from "slate";
3
+ import { useSlateStatic, ReactEditor } from "slate-react";
4
+ import { Tooltip, IconButton } from "@mui/material";
5
+ import DeleteIcon from "@mui/icons-material/Delete";
2
6
  import { jsx as _jsx } from "react/jsx-runtime";
7
+ import { jsxs as _jsxs } from "react/jsx-runtime";
3
8
  const CarouselItem = props => {
4
9
  const {
10
+ element,
5
11
  attributes,
6
- children
12
+ children,
13
+ customProps
7
14
  } = props;
15
+ const {
16
+ readOnly
17
+ } = customProps;
18
+ const editor = useSlateStatic();
19
+ const onMenuClick = val => () => {
20
+ switch (val) {
21
+ case "delete":
22
+ const path = ReactEditor.findPath(editor, element);
23
+ const parentSlide = Node.get(editor, [path[0]]);
24
+ const canDelete = parentSlide?.children?.length > 1;
25
+ if (canDelete) {
26
+ Transforms.removeNodes(editor, {
27
+ at: [...path]
28
+ });
29
+ }
30
+ return;
31
+ default:
32
+ return;
33
+ }
34
+ };
35
+ const Toolbar = () => {
36
+ return !readOnly ? /*#__PURE__*/_jsx("div", {
37
+ className: "element-toolbar hr",
38
+ style: {
39
+ top: "0px",
40
+ right: "28px"
41
+ },
42
+ contentEditable: false,
43
+ children: /*#__PURE__*/_jsx(Tooltip, {
44
+ title: "Delete Slide",
45
+ arrow: true,
46
+ children: /*#__PURE__*/_jsx(IconButton, {
47
+ onClick: onMenuClick("delete"),
48
+ children: /*#__PURE__*/_jsx(DeleteIcon, {})
49
+ })
50
+ })
51
+ }) : null;
52
+ };
8
53
  return /*#__PURE__*/_jsx("div", {
9
54
  ...attributes,
10
55
  className: "carousel-item",
11
- children: /*#__PURE__*/_jsx("div", {
56
+ children: /*#__PURE__*/_jsxs("div", {
12
57
  className: "carousel-item-inner",
13
- children: children
58
+ style: {
59
+ minHeight: "50px",
60
+ display: "flex",
61
+ justifyContent: "center",
62
+ alignItems: "center"
63
+ },
64
+ children: [children, /*#__PURE__*/_jsx(Toolbar, {})]
14
65
  })
15
66
  });
16
67
  };
@@ -123,7 +123,7 @@ const Image = ({
123
123
  onClick: onSettings,
124
124
  contentEditable: false,
125
125
  children: [/*#__PURE__*/_jsx(Icon, {
126
- icon: "video"
126
+ icon: "image"
127
127
  }), "Add Image"]
128
128
  }) : /*#__PURE__*/_jsx("img", {
129
129
  style: {
@@ -0,0 +1,60 @@
1
+ const carousel_item = itemNo => ({
2
+ type: "paragraph",
3
+ children: [{
4
+ type: "grid",
5
+ grid: "container",
6
+ children: [{
7
+ type: "grid-item",
8
+ grid: 12,
9
+ children: [{
10
+ type: "alignLeft",
11
+ children: [{
12
+ type: "paragraph",
13
+ children: [{
14
+ text: `Slide ${itemNo}`,
15
+ fontSize: "huge",
16
+ fontFamily: "PoppinsBold"
17
+ }]
18
+ }, {
19
+ type: "paragraph",
20
+ children: [{
21
+ fontSize: "16px",
22
+ fontFamily: "PoppinsRegular",
23
+ text: ""
24
+ }]
25
+ }, {
26
+ type: "paragraph",
27
+ children: [{
28
+ fontSize: "16px",
29
+ fontFamily: "PoppinsRegular",
30
+ text: "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book."
31
+ }]
32
+ }]
33
+ }],
34
+ bgColor: "rgba(185, 179, 179, 0)",
35
+ lockSpacing: true,
36
+ bannerSpacing: {
37
+ top: 16,
38
+ left: 16,
39
+ right: 16,
40
+ bottom: 16,
41
+ undefined: 16
42
+ },
43
+ alignment: {
44
+ horizantal: "center"
45
+ }
46
+ }],
47
+ alignment: {
48
+ flexDirection: "row"
49
+ },
50
+ lockSpacing: true,
51
+ bannerSpacing: {
52
+ top: "16",
53
+ left: "16",
54
+ right: "16",
55
+ bottom: "16"
56
+ },
57
+ bgColor: "rgb(102, 102, 102)"
58
+ }]
59
+ });
60
+ export default carousel_item;
@@ -8,6 +8,7 @@ import LinkOffIcon from "@mui/icons-material/LinkOff";
8
8
  import { removeLink } from "../../utils/link";
9
9
  import LinkPopup from "./LinkPopup";
10
10
  import "./styles.css";
11
+ import { absoluteLink } from "../../utils/helper";
11
12
  import { jsx as _jsx } from "react/jsx-runtime";
12
13
  import { jsxs as _jsxs } from "react/jsx-runtime";
13
14
  const Link = ({
@@ -25,6 +26,7 @@ const Link = ({
25
26
  showInNewTab: true
26
27
  });
27
28
  const path = ReactEditor.findPath(editor, element);
29
+ const absLink = absoluteLink(element.href);
28
30
  const updateLink = () => {
29
31
  Transforms.setNodes(editor, {
30
32
  href: linkData?.url,
@@ -43,7 +45,7 @@ const Link = ({
43
45
  setLinkData({
44
46
  name: Node.string(element),
45
47
  url: element?.href || "",
46
- showInNewTab: true
48
+ showInNewTab: element?.showInNewTab
47
49
  });
48
50
  setShowInput(true);
49
51
  };
@@ -71,8 +73,8 @@ const Link = ({
71
73
  children: [/*#__PURE__*/_jsx(Tooltip, {
72
74
  title: "Open",
73
75
  children: /*#__PURE__*/_jsx(IconButton, {
74
- href: element.href,
75
- target: element.target,
76
+ href: absLink,
77
+ target: "_blank",
76
78
  children: /*#__PURE__*/_jsx(OpenInNewIcon, {})
77
79
  })
78
80
  }), /*#__PURE__*/_jsx(Tooltip, {
@@ -93,7 +95,7 @@ const Link = ({
93
95
  return /*#__PURE__*/_jsxs("div", {
94
96
  className: "link",
95
97
  children: [/*#__PURE__*/_jsx("a", {
96
- href: element.href,
98
+ href: absLink,
97
99
  ...attributes,
98
100
  ...element.attr,
99
101
  target: element.target,
@@ -15,9 +15,9 @@ const CheckListButton = props => {
15
15
  children: /*#__PURE__*/_jsx(ToolbarIcon, {
16
16
  title: "Check List",
17
17
  icon: /*#__PURE__*/_jsx(Icon, {
18
- icon: "checkList"
18
+ icon: "check-list-item"
19
19
  }),
20
- onClick: handleClick("checkList")
20
+ onClick: handleClick("check-list-item")
21
21
  })
22
22
  });
23
23
  };
@@ -18,7 +18,7 @@ const SimpleTextStyle = ({
18
18
  zIndex: -1,
19
19
  left: "0px",
20
20
  paddingLeft: "4px",
21
- top: 0,
21
+ top: "-1px",
22
22
  bottom: 0,
23
23
  margin: "auto",
24
24
  pointerEvents: "none",
@@ -40,7 +40,8 @@ const TableCell = props => {
40
40
  const {
41
41
  bgColor,
42
42
  borderColor,
43
- entireBgColor
43
+ entireBgColor,
44
+ entireBorderColor
44
45
  } = element;
45
46
  const [parentDOM, setParentDOM] = useState(null);
46
47
  const editor = useSlateStatic();
@@ -107,7 +108,8 @@ const TableCell = props => {
107
108
  const sizeProps = isHeader ? {
108
109
  width: size?.width || tableSize?.cellWidth
109
110
  } : {};
110
- const cellBorderColor = borderColor || rowProps?.borderColor || parentProps?.borderColor;
111
+ const cellBorderColor = borderColor || rowProps?.borderColor || parentProps?.borderColor || entireBorderColor;
112
+ console.log(borderColor, entireBorderColor);
111
113
  return /*#__PURE__*/_jsxs("td", {
112
114
  ...element.attr,
113
115
  ...attributes,
@@ -99,7 +99,7 @@ const editorStyles = ({
99
99
  width: "fit-content"
100
100
  }
101
101
  },
102
- "&:before": {
102
+ "&.hselect:before": {
103
103
  display: "block"
104
104
  }
105
105
  },
@@ -116,7 +116,8 @@ const editorStyles = ({
116
116
  height: "calc(100% - 2px)",
117
117
  left: 0,
118
118
  top: 0,
119
- border: "1px solid #2563eb",
119
+ border: "1px solid transparent",
120
+ background: "rgba(0,0,0,0.05)",
120
121
  pointerEvents: "none",
121
122
  display: "none"
122
123
  }
@@ -153,6 +154,19 @@ const editorStyles = ({
153
154
  height: "20px"
154
155
  }
155
156
  }
157
+ },
158
+ "& .tools-drawer": {
159
+ zIndex: 1300
160
+ },
161
+ "& .section-tw": {
162
+ "& button": {
163
+ padding: "2px",
164
+ borderRadius: "0px",
165
+ "& svg": {
166
+ width: "16px",
167
+ height: "16px"
168
+ }
169
+ }
156
170
  }
157
171
  }
158
172
  });
@@ -75,9 +75,6 @@ const MiniToolbar = props => {
75
75
  sx: popupStyles.popupWrapper,
76
76
  className: `tools-drawer ${fullScreen ? "fullscreen" : ""}`,
77
77
  fullScreen: fullScreen,
78
- style: {
79
- zIndex: 1002
80
- },
81
78
  children: PopupComponent ? /*#__PURE__*/_jsxs(Paper, {
82
79
  className: "papper-wrpr",
83
80
  style: {
@@ -1,7 +1,7 @@
1
1
  const usePopupStyle = () => ({
2
2
  popupWrapper: {
3
3
  boxShadow: "0px 4px 10px 0px rgba(0, 0, 0, 0.16)",
4
- zIndex: 1002,
4
+ zIndex: 1300,
5
5
  marginBottom: "12px !important",
6
6
  border: "1px solid #E0E0E0",
7
7
  borderRadius: "10px",
@@ -27,6 +27,7 @@ import InlineIconButton from "../Elements/InlineIcon/InlineIconButton";
27
27
  import EmojiButton from "../Elements/Emoji/EmojiButton.js";
28
28
  import "./styles.css";
29
29
  import TopBannerButton from "../Elements/TopBanner/TopBannerButton.js";
30
+ import AttachmentsButton from "../Elements/Attachments/AttachmentsButton";
30
31
  import { jsx as _jsx } from "react/jsx-runtime";
31
32
  import { jsxs as _jsxs } from "react/jsx-runtime";
32
33
  export const RenderToolbarIcon = props => {
@@ -193,6 +194,12 @@ export const RenderToolbarIcon = props => {
193
194
  customProps: customProps,
194
195
  icoBtnType: icoBtnType
195
196
  }, element.id);
197
+ case "docsUpload":
198
+ return /*#__PURE__*/_jsx(AttachmentsButton, {
199
+ editor: editor,
200
+ customProps: customProps,
201
+ icoBtnType: icoBtnType
202
+ }, element.id);
196
203
  default:
197
204
  return null;
198
205
  }
@@ -152,6 +152,11 @@ export const toolbarGroups = [[{
152
152
  format: "video",
153
153
  type: "embed",
154
154
  group: "elements"
155
+ }, {
156
+ id: 46,
157
+ format: "docsUpload",
158
+ type: "docsUpload",
159
+ group: "elements"
155
160
  }, {
156
161
  id: 44,
157
162
  lbT: "embed",
@@ -47,7 +47,7 @@ const ColorPickerButton = props => {
47
47
  onClose: handleClose,
48
48
  sx: {
49
49
  "& .MuiPaper-root": {
50
- overflow: "hidden"
50
+ overflow: "auto"
51
51
  }
52
52
  },
53
53
  children: /*#__PURE__*/_jsx(Grid, {
@@ -56,10 +56,12 @@ const ColorPickerButton = props => {
56
56
  children: /*#__PURE__*/_jsxs(Grid, {
57
57
  item: true,
58
58
  xs: 12,
59
- children: [/*#__PURE__*/_jsx(ColorPickerTool, {
60
- gradient: true,
61
- value: color,
62
- onChange: setColor
59
+ children: [/*#__PURE__*/_jsx("div", {
60
+ children: /*#__PURE__*/_jsx(ColorPickerTool, {
61
+ gradient: true,
62
+ value: color,
63
+ onChange: setColor
64
+ })
63
65
  }), /*#__PURE__*/_jsxs("div", {
64
66
  style: {
65
67
  display: "flex",
@@ -7,11 +7,10 @@ import { useEditorContext } from "../../hooks/useMouseMove";
7
7
  import { Transforms } from "slate";
8
8
  import { jsx as _jsx } from "react/jsx-runtime";
9
9
  import { jsxs as _jsxs } from "react/jsx-runtime";
10
- const DRAGGABLE_TYPES = ["paragraph"];
10
+ const DRAGGABLE_TYPES = ["paragraph", "headingOne"];
11
11
  const DragHandleStyle = () => ({
12
12
  root: {
13
13
  position: "relative",
14
- paddingLeft: "20px",
15
14
  "&:hover": {
16
15
  "& > .dh-para:first-child": {
17
16
  opacity: 1
@@ -73,9 +72,15 @@ const DragHandle = props => {
73
72
  } = element;
74
73
  useEffect(() => {
75
74
  if (moved) {
76
- Transforms.removeNodes(editor, {
77
- at: path
78
- });
75
+ const upPath = ReactEditor.findPath(editor, element);
76
+ try {
77
+ alert(upPath);
78
+ Transforms.removeNodes(editor, {
79
+ at: upPath
80
+ });
81
+ } catch (err) {
82
+ console.log(err, upPath);
83
+ }
79
84
  }
80
85
  }, [moved]);
81
86
  const handleOnDrag = isDragging => {
@@ -21,8 +21,8 @@ const DragAndDrop = ({
21
21
  active,
22
22
  over
23
23
  } = e;
24
- const fromPath = active.id.split("_")[1].split("|");
25
- const toPath = over.id.split("_")[1].split("|");
24
+ const fromPath = active.id.split("_")[1].split("|").map(m => parseInt(m));
25
+ const toPath = over.id.split("_")[1].split("|").map(m => parseInt(m));
26
26
  const toCloneNode = JSON.stringify(Node.get(editor, fromPath));
27
27
  // set moved node delete
28
28
  Transforms.setNodes(editor, {
@@ -7,7 +7,7 @@ import { AiFillEdit, AiOutlineInsertRowBelow, AiOutlineInsertRowRight, AiOutline
7
7
  import { SiLatex } from "react-icons/si";
8
8
  import { RiDeleteColumn, RiDeleteRow } from "react-icons/ri";
9
9
  import { IoIosImage, IoMdArrowDroprightCircle, IoMdArrowDropdownCircle } from "react-icons/io";
10
- import { GridIcon, AccordionIcon, SignatureIcon, ButtonIcon, Carousal, FormIcon, BoldIcon, FontFamilyIcon, FontSizeIcon, ImageIcon, ItalicIcon, LinkIcon, StrikethroughIcon, TableIcon, UnderLineIcon, VideoIcon, CheckboxIcon, AppHeader, MoreHorizontal, UploadImage } from "./iconslist";
10
+ import { GridIcon, AccordionIcon, SignatureIcon, ButtonIcon, Carousal, FormIcon, BoldIcon, FontFamilyIcon, FontSizeIcon, ImageIcon, ItalicIcon, LinkIcon, StrikethroughIcon, TableIcon, UnderLineIcon, VideoIcon, CheckboxIcon, AppHeader, MoreHorizontal, UploadImage, DocsUpload } from "./iconslist";
11
11
  import { jsx as _jsx } from "react/jsx-runtime";
12
12
  import { jsxs as _jsxs } from "react/jsx-runtime";
13
13
  const iconList = {
@@ -182,7 +182,8 @@ const iconList = {
182
182
  size: 20
183
183
  }),
184
184
  appHeader: /*#__PURE__*/_jsx(AppHeader, {}),
185
- moreHorizantal: /*#__PURE__*/_jsx(MoreHorizontal, {})
185
+ moreHorizantal: /*#__PURE__*/_jsx(MoreHorizontal, {}),
186
+ docsUpload: /*#__PURE__*/_jsx(DocsUpload, {})
186
187
  };
187
188
  const Icon = props => {
188
189
  const {
@@ -13,6 +13,12 @@ const IMAGE_SLECTOR_OPTIONS = {
13
13
  choose: ChooseAssets,
14
14
  addLink: AddLink
15
15
  };
16
+ const TAB_SHOW = {
17
+ Image: ["upload", "choose", "addLink"],
18
+ Video: ["addLink"],
19
+ Embed: ["addLink"],
20
+ Document: ["addLink", "upload"]
21
+ };
16
22
  const ImageSelector = props => {
17
23
  const classes = ImageSelectorStyles();
18
24
  const {
@@ -25,6 +31,7 @@ const ImageSelector = props => {
25
31
  const [tabValue, setTabValue] = useState(title === "Image" ? "choose" : "addLink");
26
32
  const [image, setImage] = useState(value || "");
27
33
  const handleTabChange = (e, newValue) => {
34
+ setImage("");
28
35
  setTabValue(newValue);
29
36
  };
30
37
  const onUploaded = url => {
@@ -60,7 +67,7 @@ const ImageSelector = props => {
60
67
  orientation: "vertical",
61
68
  value: tabValue,
62
69
  children: [/*#__PURE__*/_jsx(Tab, {
63
- className: `${isActive("upload")} ${title !== "Image" ? "hidden" : ""}`,
70
+ className: `${isActive("upload")} ${TAB_SHOW[title].indexOf("upload") === -1 ? "hidden" : ""}`,
64
71
  sx: classes.tab,
65
72
  icon: /*#__PURE__*/_jsx(Icon, {
66
73
  icon: "fileUpload"
@@ -69,7 +76,7 @@ const ImageSelector = props => {
69
76
  value: "upload",
70
77
  label: "Upload Media"
71
78
  }), /*#__PURE__*/_jsx(Tab, {
72
- className: `${isActive("choose")} ${title !== "Image" ? "hidden" : ""}`,
79
+ className: `${isActive("choose")} ${TAB_SHOW[title].indexOf("choose") === -1 ? "hidden" : ""}`,
73
80
  sx: classes.tab,
74
81
  icon: /*#__PURE__*/_jsx(Icon, {
75
82
  icon: "media"
@@ -78,7 +85,7 @@ const ImageSelector = props => {
78
85
  value: "choose",
79
86
  label: "Choose Media"
80
87
  }), /*#__PURE__*/_jsx(Tab, {
81
- className: `${isActive("addLink")}`,
88
+ className: `${isActive("addLink")} ${TAB_SHOW[title].indexOf("addLink") === -1 ? "hidden" : ""}`,
82
89
  sx: classes.tab,
83
90
  icon: /*#__PURE__*/_jsx(Icon, {
84
91
  icon: "link"
@@ -109,8 +116,9 @@ const ImageSelector = props => {
109
116
  sx: classes.closeBtn,
110
117
  children: "Cancel"
111
118
  }), /*#__PURE__*/_jsx(Button, {
119
+ disabled: !image,
112
120
  onClick: onSave,
113
- className: "primaryBtn",
121
+ className: `primaryBtn ${!image ? "disabled" : ""}`,
114
122
  sx: classes.saveBtn,
115
123
  children: "Save"
116
124
  })]
@@ -8,7 +8,8 @@ const Upload = props => {
8
8
  value,
9
9
  onUploaded,
10
10
  customProps,
11
- disableUpload = false
11
+ disableUpload = false,
12
+ title
12
13
  } = props;
13
14
  const onDone = img => {
14
15
  onUploaded(img);
@@ -28,7 +29,8 @@ const Upload = props => {
28
29
  },
29
30
  customProps: customProps,
30
31
  onUploaded: onDone,
31
- disableUpload: disableUpload
32
+ disableUpload: disableUpload,
33
+ title: title
32
34
  })
33
35
  });
34
36
  };
@@ -1,7 +1,7 @@
1
1
  const usePopupStyles = () => ({
2
2
  root: {
3
3
  position: "absolute",
4
- zIndex: 1000,
4
+ zIndex: 1300,
5
5
  background: "white",
6
6
  borderRadius: "10px",
7
7
  padding: "0px",
@@ -119,6 +119,7 @@ const MentionsPopup = /*#__PURE__*/forwardRef((props, ref) => {
119
119
  disablePortal: false,
120
120
  sx: classes.root,
121
121
  placement: "bottom-start",
122
+ className: "cmd-wrapper",
122
123
  children: /*#__PURE__*/_jsx(Paper, {
123
124
  sx: classes.papper,
124
125
  children: chars.map(renderList)
@@ -47,8 +47,13 @@ const Section = props => {
47
47
  setOpenSettings(true);
48
48
  };
49
49
  const Toolbar = () => {
50
- return !readOnly ? /*#__PURE__*/_jsx("div", {
51
- className: "element-toolbar ss hr",
50
+ return !readOnly ? /*#__PURE__*/_jsx(Box, {
51
+ component: "div",
52
+ className: "element-toolbar ss hr section-tw",
53
+ style: {
54
+ left: "20px",
55
+ top: "0px"
56
+ },
52
57
  children: /*#__PURE__*/_jsx(Tooltip, {
53
58
  title: "Section Settings",
54
59
  children: /*#__PURE__*/_jsx(IconButton, {
@@ -83,15 +88,15 @@ const Section = props => {
83
88
  } : {};
84
89
  return path.length === 1 ? /*#__PURE__*/_jsxs(Box, {
85
90
  component: "section",
86
- className: "ed-section-wrapper",
91
+ className: `ed-section-wrapper ${readOnly ? "" : "hselect"}`,
87
92
  style: {
88
93
  position: "relative",
89
94
  background: sectionBgColor,
90
95
  ...sectionBgImage,
91
96
  paddingLeft: `${ssleft}px`,
92
97
  paddingRight: `${ssright}px`,
93
- paddingTop: `${sstop}px`,
94
- paddingBottom: `${ssbottom}px`,
98
+ paddingTop: `${sstop || 2}px`,
99
+ paddingBottom: `${ssbottom || 2}px`,
95
100
  borderRadius: `${ssTopLeft}px ${ssTopRight}px ${ssBottomLeft}px ${ssBottomRight}px`,
96
101
  flexDirection: flexDirection || "column",
97
102
  alignItems: horizantal,
@@ -75,7 +75,7 @@ const ELEMENTS_LIST = [{
75
75
  desc: "",
76
76
  group: "List",
77
77
  icon: /*#__PURE__*/_jsx(Icon, {
78
- icon: "checkList"
78
+ icon: "check-list-item"
79
79
  }),
80
80
  onInsert: editor => toggleBlock(editor, "check-list-item", false)
81
81
  }, {
@@ -101,7 +101,7 @@ const ELEMENTS_LIST = [{
101
101
  icon: /*#__PURE__*/_jsx(Icon, {
102
102
  icon: "embed"
103
103
  }),
104
- onInsert: editor => insertDefaultEmbed(editor, "video", "https://calendly.com/agenciflow/1-1-agency-scale-clone?hide_event_type_details=1&month=2024-03")
104
+ onInsert: editor => insertDefaultEmbed(editor, "video", "")
105
105
  }, {
106
106
  name: "Emoji",
107
107
  group: "Elements",
@@ -28,7 +28,7 @@ const buttonStyle = [{
28
28
  width: 5,
29
29
  placeholder: "16px or 1em"
30
30
  }, {
31
- label: "Text Align",
31
+ label: "Alignment",
32
32
  key: "textAlign",
33
33
  type: "textAlign",
34
34
  placeholder: "16px or 1em"
@@ -58,14 +58,6 @@ const buttonStyle = [{
58
58
  key: "buttonLink",
59
59
  type: "buttonLink"
60
60
  }]
61
- }, {
62
- tab: "Position",
63
- value: "position",
64
- fields: [{
65
- label: "Alignment",
66
- key: "alignment",
67
- type: "alignment"
68
- }]
69
61
  }, {
70
62
  tab: "Banner Spacing",
71
63
  value: "bannerSpacing",
@@ -10,7 +10,8 @@ const TextAlign = props => {
10
10
  onChange
11
11
  } = props;
12
12
  const {
13
- key
13
+ key,
14
+ label
14
15
  } = data;
15
16
  const handleChange = e => {
16
17
  onChange({
@@ -30,7 +31,7 @@ const TextAlign = props => {
30
31
  fontWeight: 500,
31
32
  fontSize: "14px"
32
33
  },
33
- children: "Text Alignment"
34
+ children: label || "Text Alignment"
34
35
  })
35
36
  }), /*#__PURE__*/_jsxs(RadioGroup, {
36
37
  row: true,
@@ -83,6 +83,9 @@ const StyleBuilder = props => {
83
83
  className: ` dialogComp tools-drawer`,
84
84
  anchor: "right",
85
85
  onClose: onClose,
86
+ style: {
87
+ zIndex: "1300"
88
+ },
86
89
  children: /*#__PURE__*/_jsxs(Grid, {
87
90
  item: true,
88
91
  xs: 12,
@@ -1,24 +1,28 @@
1
1
  import React, { useState } from "react";
2
- import { Grid, Button } from "@mui/material";
2
+ import { Grid, Button, Typography } from "@mui/material";
3
3
  import { convertBase64 } from "../utils/helper";
4
4
  import { uploadFile } from "../service/fileupload";
5
5
  import Icon from "./Icon";
6
6
  import UploadStyles from "../common/ImageSelector/UploadStyles";
7
7
  import { jsx as _jsx } from "react/jsx-runtime";
8
+ import { Fragment as _Fragment } from "react/jsx-runtime";
8
9
  import { jsxs as _jsxs } from "react/jsx-runtime";
9
10
  const Uploader = props => {
10
11
  const {
11
12
  value,
12
13
  onUploaded,
13
- customProps
14
+ customProps,
15
+ title
14
16
  } = props;
15
17
  const classes = UploadStyles();
16
18
  const [base64, setBase64] = useState(value?.url);
19
+ const [fileName, setFileName] = useState("");
17
20
  const [uploading, setUploading] = useState(false);
18
21
  const handleChange = async e => {
19
22
  const uFile = e.target.files[0];
20
23
  const strImage = await convertBase64(uFile);
21
24
  setBase64(strImage);
25
+ setFileName(uFile?.name);
22
26
  doUpload(strImage, e.target.files[0]);
23
27
  };
24
28
  const doUpload = async (strImage, file) => {
@@ -38,6 +42,44 @@ const Uploader = props => {
38
42
  setBase64(null);
39
43
  onUploaded("none");
40
44
  };
45
+ const getBackground = () => {
46
+ switch (title) {
47
+ case "Document":
48
+ return {
49
+ backgroundImage: `url()`
50
+ };
51
+ default:
52
+ return {
53
+ backgroundImage: base64 ? `url(${base64})` : "none"
54
+ };
55
+ }
56
+ };
57
+ const renderThumb = () => {
58
+ switch (title) {
59
+ case "Document":
60
+ return /*#__PURE__*/_jsxs(_Fragment, {
61
+ children: [/*#__PURE__*/_jsx(Typography, {
62
+ style: {
63
+ padding: "8px",
64
+ fontSize: "12px",
65
+ color: "#2563eb",
66
+ textAlign: "center"
67
+ },
68
+ children: fileName
69
+ }), /*#__PURE__*/_jsx(Grid, {
70
+ className: "removeImageText",
71
+ onClick: onRemoveBG,
72
+ children: "REMOVE"
73
+ })]
74
+ });
75
+ default:
76
+ return /*#__PURE__*/_jsx(Grid, {
77
+ className: "removeImageText",
78
+ onClick: onRemoveBG,
79
+ children: "REMOVE"
80
+ });
81
+ }
82
+ };
41
83
  return /*#__PURE__*/_jsxs(Grid, {
42
84
  container: true,
43
85
  sx: classes.uploadContainer,
@@ -50,16 +92,12 @@ const Uploader = props => {
50
92
  xs: 12,
51
93
  className: "btn--wrpr",
52
94
  style: {
53
- backgroundImage: base64 ? `url(${base64})` : "none"
95
+ ...getBackground()
54
96
  },
55
97
  sx: classes.uploadField,
56
98
  children: !uploading ? /*#__PURE__*/_jsx(Grid, {
57
99
  className: "uploadImageSection",
58
- children: base64 ? /*#__PURE__*/_jsx(Grid, {
59
- className: "removeImageText",
60
- onClick: onRemoveBG,
61
- children: "REMOVE"
62
- }) : /*#__PURE__*/_jsx(Grid, {
100
+ children: base64 ? renderThumb() : /*#__PURE__*/_jsx(Grid, {
63
101
  className: "uploadImageText",
64
102
  children: /*#__PURE__*/_jsxs(Button, {
65
103
  component: "label",
@@ -77,11 +115,11 @@ const Uploader = props => {
77
115
  onChange: handleChange
78
116
  }), /*#__PURE__*/_jsx(Icon, {
79
117
  icon: "fileUpload"
80
- }), /*#__PURE__*/_jsx("span", {
118
+ }), /*#__PURE__*/_jsxs("span", {
81
119
  style: {
82
120
  paddingLeft: "8px"
83
121
  },
84
- children: "upload your image"
122
+ children: ["upload ", title || "image"]
85
123
  })]
86
124
  })
87
125
  })
@@ -765,32 +765,32 @@ export const DocsUpload = props => /*#__PURE__*/_jsxs("svg", {
765
765
  fill: "none",
766
766
  children: [/*#__PURE__*/_jsx("path", {
767
767
  d: "M6.14453 0.855469V3.14118C6.14453 3.29274 6.20474 3.43808 6.3119 3.54524C6.41906 3.65241 6.56441 3.71261 6.71596 3.71261H9.00167",
768
- stroke: "#828282",
769
- strokeWidth: "0.7",
768
+ stroke: "#64748B",
769
+ strokeWidth: "1",
770
770
  strokeLinecap: "round",
771
771
  strokeLinejoin: "round"
772
772
  }), /*#__PURE__*/_jsx("path", {
773
773
  d: "M7.85714 11.1412H2.14286C1.83975 11.1412 1.54906 11.0208 1.33474 10.8064C1.12041 10.5921 1 10.3014 1 9.99833V1.99833C1 1.69522 1.12041 1.40453 1.33474 1.1902C1.54906 0.975877 1.83975 0.855469 2.14286 0.855469H6.14286L9 3.71261V9.99833C9 10.3014 8.87959 10.5921 8.66527 10.8064C8.45094 11.0208 8.16025 11.1412 7.85714 11.1412Z",
774
- stroke: "#828282",
775
- strokeWidth: "0.7",
774
+ stroke: "#64748B",
775
+ strokeWidth: "1",
776
776
  strokeLinecap: "round",
777
777
  strokeLinejoin: "round"
778
778
  }), /*#__PURE__*/_jsx("path", {
779
779
  d: "M3.28516 4.28516H3.85658",
780
- stroke: "#828282",
781
- strokeWidth: "0.7",
780
+ stroke: "#64748B",
781
+ strokeWidth: "1",
782
782
  strokeLinecap: "round",
783
783
  strokeLinejoin: "round"
784
784
  }), /*#__PURE__*/_jsx("path", {
785
785
  d: "M3.28516 6.57031H6.71373",
786
- stroke: "#828282",
787
- strokeWidth: "0.7",
786
+ stroke: "#64748B",
787
+ strokeWidth: "1",
788
788
  strokeLinecap: "round",
789
789
  strokeLinejoin: "round"
790
790
  }), /*#__PURE__*/_jsx("path", {
791
791
  d: "M3.28516 8.85547H6.71373",
792
- stroke: "#828282",
793
- strokeWidth: "0.7",
792
+ stroke: "#64748B",
793
+ strokeWidth: "1",
794
794
  strokeLinecap: "round",
795
795
  strokeLinejoin: "round"
796
796
  })]
@@ -3,7 +3,6 @@ export const uploadFile = async (formData, props) => {
3
3
  const response = await fetch(`${props.API_HOST}/general/notes/file_upload`, {
4
4
  method: "POST",
5
5
  headers: {
6
- // "Content-Type": "application/json",
7
6
  Authorization: `Bearer ${props.token}`
8
7
  },
9
8
  body: formData
@@ -33,6 +33,7 @@ import EmbedLink from "../Elements/Embed/link";
33
33
  import SimpleText from "../Elements/SimpleText";
34
34
  import CheckList from "../Elements/List/CheckList";
35
35
  import { isEmptyTextNode } from "../helper";
36
+ import Attachments from "../Elements/Attachments/Attachments";
36
37
  import { jsx as _jsx } from "react/jsx-runtime";
37
38
  const alignment = ["alignLeft", "alignRight", "alignCenter"];
38
39
  const list_types = ["orderedList", "unorderedList"];
@@ -287,7 +288,8 @@ export const getBlock = props => {
287
288
  background: element?.bgColor || "none",
288
289
  padding: `${element?.bgColor ? "16px" : "0px"} 8px`,
289
290
  borderRadius: `${element?.color ? "0px" : "12px"} 12px 12px ${element?.color ? "0px" : "12px"}`,
290
- margin: `${element?.bgColor ? "16px" : "0px"} 0px`
291
+ margin: `${element?.bgColor ? "16px" : "0px"} 0px`,
292
+ width: element?.bgColor ? "calc(100% - 16px)" : "100%"
291
293
  },
292
294
  children: children
293
295
  });
@@ -319,7 +321,8 @@ export const getBlock = props => {
319
321
  display: "flex",
320
322
  alignItems: "flex-end",
321
323
  listStylePosition: "inside",
322
- flexDirection: "column"
324
+ flexDirection: "column",
325
+ textAlign: "right"
323
326
  },
324
327
  ...attributes,
325
328
  ...element.attr,
@@ -470,6 +473,11 @@ export const getBlock = props => {
470
473
  return /*#__PURE__*/_jsx(EmbedLink, {
471
474
  ...props
472
475
  });
476
+ case "docs":
477
+ case "pdf":
478
+ return /*#__PURE__*/_jsx(Attachments, {
479
+ ...props
480
+ });
473
481
  default:
474
482
  return /*#__PURE__*/_jsx(SimpleText, {
475
483
  ...props,
@@ -478,10 +486,19 @@ export const getBlock = props => {
478
486
  }
479
487
  };
480
488
  export const getQueryStrings = urlString => {
481
- const newUrl = new URL(urlString);
482
- var youCode = newUrl.searchParams.get("v");
483
- if (!youCode) {
484
- youCode = newUrl.pathname.replace("/", "");
489
+ try {
490
+ if (urlString && urlString?.indexOf("/embed") === -1) {
491
+ const newUrl = new URL(urlString);
492
+ var youCode = newUrl.searchParams.get("v");
493
+ if (!youCode) {
494
+ youCode = newUrl.pathname.replace("/", "");
495
+ }
496
+ return `https://www.youtube.com/embed/${youCode}`;
497
+ } else {
498
+ return urlString;
499
+ }
500
+ } catch (err) {
501
+ console.log(err);
502
+ return urlString;
485
503
  }
486
- return `https://www.youtube.com/embed/${youCode}`;
487
504
  };
@@ -0,0 +1,35 @@
1
+ import { Transforms } from "slate";
2
+ import insertNewLine from "./insertNewLine";
3
+ const createAttachmentsNode = ({
4
+ type,
5
+ url
6
+ }) => {
7
+ return {
8
+ type: type || "docs",
9
+ url,
10
+ date: new Date().getTime(),
11
+ width: "100%",
12
+ height: "300px",
13
+ children: [{
14
+ text: ""
15
+ }]
16
+ };
17
+ };
18
+ export const insertAttachments = (editor, data) => {
19
+ try {
20
+ const {
21
+ url
22
+ } = data;
23
+ if (url) {
24
+ const attachmentsNode = createAttachmentsNode({
25
+ ...data,
26
+ type: url?.split(".").pop() === "pdf" ? "pdf" : "docs"
27
+ });
28
+ console.log(attachmentsNode);
29
+ Transforms.insertNodes(editor, [attachmentsNode]);
30
+ insertNewLine(editor);
31
+ }
32
+ } catch (err) {
33
+ console.log(err);
34
+ }
35
+ };
@@ -1,4 +1,5 @@
1
1
  import { Transforms } from "slate";
2
+ import insertNewLine from "./insertNewLine";
2
3
  export const insertButton = editor => {
3
4
  const button = {
4
5
  type: "button",
@@ -26,4 +27,5 @@ export const insertButton = editor => {
26
27
  };
27
28
  Transforms.insertNodes(editor, button);
28
29
  Transforms.move(editor);
30
+ insertNewLine(editor);
29
31
  };
@@ -1,13 +1,11 @@
1
1
  import { Transforms } from "slate";
2
+ import carousel_item from "../Elements/Grid/templates/carousel_item";
2
3
  export const carouselItem = (itemNo = "") => {
3
4
  return {
4
5
  type: "carousel-item",
5
6
  image: null,
6
7
  children: [{
7
- type: "paragraph",
8
- children: [{
9
- text: `Slide ${itemNo}`
10
- }]
8
+ ...carousel_item(itemNo)
11
9
  }]
12
10
  };
13
11
  };
@@ -110,7 +110,7 @@ export const escapeEvent = props => {
110
110
  const {
111
111
  editor
112
112
  } = props;
113
- const list_types = ["orderedList", "unorderedList", "checkList"];
113
+ const list_types = ["orderedList", "unorderedList", "check-list-item"];
114
114
  const parentPath = Path.ancestors(editor.selection.anchor.path);
115
115
  const parentNodes = parentPath.filter(m => m.length).map(m => Node.get(editor, m));
116
116
  if (parentNodes.length === 2 && parentNodes[1]?.type === "list-item") {
@@ -41,4 +41,15 @@ export const gradientBorder = color => {
41
41
  borderColor: color || "transparent"
42
42
  };
43
43
  }
44
+ };
45
+ export const absoluteLink = url => {
46
+ try {
47
+ if (url?.indexOf("://") === -1) {
48
+ return `//${url}`;
49
+ }
50
+ return url;
51
+ } catch (err) {
52
+ console.log(err);
53
+ return url;
54
+ }
44
55
  };
@@ -219,17 +219,36 @@ export class TableUtil {
219
219
  });
220
220
 
221
221
  // cell bg entire
222
- if (cellProps?.entireBgColor) {
222
+ if (cellProps?.entireBgColor || tableProps?.borderColor) {
223
223
  const {
224
- rows
224
+ rows,
225
+ columns
225
226
  } = tableProps;
226
227
  for (let r = 0; r < rows; r++) {
227
- Transforms.setNodes(this.editor, {
228
- ...cellProps,
229
- entireBgColor: cellProps?.entireBgColor
230
- }, {
231
- at: [currentCellPath[0], r, currentCellPath[2]]
232
- });
228
+ for (let c = 0; c < columns; c++) {
229
+ Transforms.setNodes(this.editor, {
230
+ entireBgColor: cellProps?.entireBgColor
231
+ }, {
232
+ at: [currentCellPath[0], r, currentCellPath[2]]
233
+ });
234
+ }
235
+ }
236
+ }
237
+
238
+ // cell border all
239
+ if (tableProps?.borderColor) {
240
+ const {
241
+ rows,
242
+ columns
243
+ } = tableProps;
244
+ for (let r = 0; r < rows; r++) {
245
+ for (let c = 0; c < columns; c++) {
246
+ Transforms.setNodes(this.editor, {
247
+ entireBorderColor: tableProps?.borderColor
248
+ }, {
249
+ at: [currentCellPath[0], r, c]
250
+ });
251
+ }
233
252
  }
234
253
  }
235
254
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@flozy/editor",
3
- "version": "1.7.7",
3
+ "version": "1.7.9",
4
4
  "description": "An Editor for flozy app brain",
5
5
  "files": [
6
6
  "dist"