@flozy/editor 3.5.1 → 3.5.3

Sign up to get free protection for your applications and to get access to all the features.
package/README.md CHANGED
@@ -1,4 +1,4 @@
1
- # editor
1
+ # editorr
2
2
  A brain document editor
3
3
 
4
4
  # Node version
@@ -574,6 +574,16 @@ blockquote {
574
574
  margin: auto;
575
575
  }
576
576
 
577
+ .embed-code .element-toolbar {
578
+ left: 0;
579
+ right: 0;
580
+ bottom: 0;
581
+ top: 0;
582
+ width: fit-content;
583
+ height: fit-content;
584
+ margin: auto;
585
+ }
586
+
577
587
  .resize-br {
578
588
  position: absolute !important;
579
589
  bottom: 2px;
@@ -18,6 +18,11 @@
18
18
  right: 2px;
19
19
  }
20
20
 
21
+ .embed-code {
22
+ position: relative;
23
+ margin: 0px;
24
+ }
25
+
21
26
  .image-text-wrapper {
22
27
  padding: 0px;
23
28
  margin: 0px;
@@ -1,6 +1,10 @@
1
1
  import React, { useEffect, useRef } from "react";
2
2
  import sanitizeHtml from "sanitize-html";
3
3
  import { allowedDomains, decodeString } from "../../utils/helper";
4
+ import { IconButton, Tooltip } from "@mui/material";
5
+ import { DeleteIcon } from "../../assets/svg/AIIcons";
6
+ import { ReactEditor, useSlateStatic } from "slate-react";
7
+ import { Transforms } from "slate";
4
8
 
5
9
  // const sanitize = (input) => {
6
10
  // const doc = new DOMParser().parseFromString(input, "text/html");
@@ -21,18 +25,45 @@ const getCode = (embedData, isEncoded) => {
21
25
  }
22
26
  return embedData;
23
27
  };
28
+ const ToolBar = ({
29
+ onDelete
30
+ }) => {
31
+ return /*#__PURE__*/_jsx("div", {
32
+ className: "element-toolbar visible-on-hover",
33
+ contentEditable: false,
34
+ children: /*#__PURE__*/_jsx(Tooltip, {
35
+ title: "Delete",
36
+ arrow: true,
37
+ children: /*#__PURE__*/_jsx(IconButton, {
38
+ onClick: onDelete,
39
+ children: /*#__PURE__*/_jsx(DeleteIcon, {})
40
+ })
41
+ })
42
+ });
43
+ };
24
44
  const Code = props => {
25
45
  const codeRef = useRef();
26
46
  const {
27
47
  element,
28
48
  attributes,
29
- children
49
+ children,
50
+ customProps
30
51
  } = props;
31
52
  const {
32
53
  embedData,
33
54
  isEncoded,
34
55
  isSanitized
35
56
  } = element;
57
+ const {
58
+ readOnly
59
+ } = customProps;
60
+ const editor = useSlateStatic();
61
+ const path = ReactEditor.findPath(editor, element);
62
+ const onDelete = () => {
63
+ Transforms.removeNodes(editor, {
64
+ at: path
65
+ });
66
+ };
36
67
  useEffect(() => {
37
68
  if (codeRef?.current) {
38
69
  const code = getCode(embedData, isEncoded);
@@ -50,12 +81,14 @@ const Code = props => {
50
81
  }
51
82
  }, []);
52
83
  return /*#__PURE__*/_jsxs("div", {
84
+ className: "embed-code has-hover",
53
85
  contentEditable: false,
54
- className: `embed-code`,
55
86
  ...attributes,
56
87
  children: [/*#__PURE__*/_jsx("div", {
57
88
  ref: codeRef
58
- }), children]
89
+ }), children, !readOnly && /*#__PURE__*/_jsx(ToolBar, {
90
+ onDelete: onDelete
91
+ })]
59
92
  });
60
93
  };
61
94
  export default Code;
@@ -1,7 +1,7 @@
1
- import React, { useState, useRef } from "react";
1
+ import React, { useState, useRef, useEffect } from "react";
2
2
  import { Transforms } from "slate";
3
3
  import { useSlateStatic, ReactEditor } from "slate-react";
4
- import { IconButton, Tooltip, Grid, Menu, MenuItem, CircularProgress, Box } from "@mui/material";
4
+ import { IconButton, Tooltip, Grid, Menu, MenuItem, CircularProgress, Box, Typography } from "@mui/material";
5
5
  import DeleteIcon from "@mui/icons-material/Delete";
6
6
  import BackupIcon from "@mui/icons-material/Backup";
7
7
  import { GridSettingsIcon, GridAddSectionIcon, WorkflowIcon } from "../../common/iconslist";
@@ -60,7 +60,12 @@ const Form = props => {
60
60
  const [anchorEl, setAnchorEl] = useState(null);
61
61
  const [loading, setLoading] = useState(false);
62
62
  const [showOptions, setShowOptions] = useState(false);
63
+ const [submittedSuccessfully, setSubmittedSuccessfully] = useState(false);
64
+ const [formHeight, setFormHeight] = useState();
63
65
  const path = ReactEditor.findPath(editor, element);
66
+ useEffect(() => {
67
+ setFormHeight(formEle?.current?.clientHeight);
68
+ }, []);
64
69
  const btnBorderStyle = buttonProps?.borderColor?.indexOf("linear") >= 0 ? {
65
70
  borderImageSource: buttonProps?.borderColor,
66
71
  borderImageSlice: 1
@@ -158,8 +163,10 @@ const Form = props => {
158
163
  alert(isValidForm[0]);
159
164
  } else {
160
165
  const formRes = await formSubmit(params, customProps);
161
- if (formRes) {
166
+ if (formRes?.hasOwnProperty('form_id')) {
162
167
  onFormSubmit(formRes);
168
+ setSubmittedSuccessfully(true);
169
+ setAnchorEl(null);
163
170
  }
164
171
  }
165
172
  setLoading(false);
@@ -306,7 +313,7 @@ const Form = props => {
306
313
  },
307
314
  onMouseOver: onMouseOver,
308
315
  onMouseLeave: onMouseLeave,
309
- children: [/*#__PURE__*/_jsxs(Box, {
316
+ children: [!submittedSuccessfully ? /*#__PURE__*/_jsxs(Box, {
310
317
  component: "form",
311
318
  id: `${formName}`,
312
319
  onSubmit: handleSubmit,
@@ -401,6 +408,27 @@ const Form = props => {
401
408
  }
402
409
  })
403
410
  })]
411
+ }) : /*#__PURE__*/_jsx(Typography, {
412
+ sx: {
413
+ color: textColor || "#A2A9B4",
414
+ borderColor: borderColor || "transparent",
415
+ borderWidth: borderWidth || "1px",
416
+ borderRadius: {
417
+ ...getBreakPointsValue(borderRadius || {}, null, "overrideBorderRadius", true)
418
+ },
419
+ borderStyle: borderStyle || "solid",
420
+ background: bgColor || "transparent",
421
+ padding: {
422
+ ...getTRBLBreakPoints(bannerSpacing)
423
+ },
424
+ minHeight: `${formHeight}px`,
425
+ display: 'flex',
426
+ alignItems: "center",
427
+ justifyContent: "center",
428
+ textAlign: "center",
429
+ position: 'relative'
430
+ },
431
+ children: "Form Submitted Successfully...!"
404
432
  }), openSetttings ? /*#__PURE__*/_jsx(FormPopup, {
405
433
  element: element,
406
434
  onSave: onSave,
@@ -15,7 +15,7 @@ const SimpleTextStyle = ({
15
15
  bottom: 0,
16
16
  margin: "auto",
17
17
  pointerEvents: "none",
18
- height: "18px",
18
+ height: "24px",
19
19
  overflow: "hidden",
20
20
  fontSize: "14px",
21
21
  "& .bg-pad-sl": {
@@ -129,31 +129,32 @@ const formStyle = [{
129
129
  key: "backgroundImage",
130
130
  type: "backgroundImage"
131
131
  }]
132
- }, {
133
- tab: "Add to Boards",
134
- value: "metadatamapping",
135
- fields: [{
136
- label: "Add response to contacts board",
137
- key: "metadatamapping",
138
- type: "metadatamapping",
139
- compType: "card",
140
- content: "By default, form responses are added as separate cards on the default contact board.",
141
- value: "mappingToContactBoard",
142
- infoIcon: /*#__PURE__*/_jsx(Icon, {
143
- icon: "info"
144
- })
145
- }, {
146
- label: "Create a separate board",
147
- key: "metadatamapping",
148
- type: "metadatamapping",
149
- compType: "card",
150
- content: "By default, form responses are added as separate cards on a new board (Contact Us).",
151
- value: "mappingToSeparateBoard",
152
- infoIcon: /*#__PURE__*/_jsx(Icon, {
153
- icon: "info"
154
- })
155
- }]
156
- }, {
132
+ },
133
+ // {
134
+ // tab: "Add to Boards",
135
+ // value: "metadatamapping",
136
+ // fields: [
137
+ // {
138
+ // label: "Add response to contacts board",
139
+ // key: "metadatamapping",
140
+ // type: "metadatamapping",
141
+ // compType: "card",
142
+ // content: "By default, form responses are added as separate cards on the default contact board.",
143
+ // value: "mappingToContactBoard",
144
+ // infoIcon: <Icon icon="info" />
145
+ // },
146
+ // {
147
+ // label: "Create a separate board",
148
+ // key: "metadatamapping",
149
+ // type: "metadatamapping",
150
+ // compType: "card",
151
+ // content: "By default, form responses are added as separate cards on a new board (Contact Us).",
152
+ // value: "mappingToSeparateBoard",
153
+ // infoIcon: <Icon icon="info" />
154
+ // },
155
+ // ],
156
+ // },
157
+ {
157
158
  tab: "Save As Template",
158
159
  value: "saveAsTemplate",
159
160
  needActions: false,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@flozy/editor",
3
- "version": "3.5.1",
3
+ "version": "3.5.3",
4
4
  "description": "An Editor for flozy app brain",
5
5
  "files": [
6
6
  "dist"