@flozy/editor 3.7.9 → 3.8.0

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.
Files changed (97) hide show
  1. package/dist/Editor/CommonEditor.js +111 -169
  2. package/dist/Editor/Editor.css +12 -1
  3. package/dist/Editor/Elements/AI/AIInput.js +5 -16
  4. package/dist/Editor/Elements/AI/PopoverAIInput.js +17 -31
  5. package/dist/Editor/Elements/AI/Styles.js +1 -2
  6. package/dist/Editor/Elements/Accordion/Accordion.js +7 -74
  7. package/dist/Editor/Elements/Accordion/AccordionBtnPopup.js +2 -3
  8. package/dist/Editor/Elements/Accordion/AccordionSummary.js +74 -7
  9. package/dist/Editor/Elements/AppHeader/AppHeader.js +4 -26
  10. package/dist/Editor/Elements/Button/EditorButton.js +16 -28
  11. package/dist/Editor/Elements/Color Picker/ColorButtons.js +17 -60
  12. package/dist/Editor/Elements/Color Picker/ColorPicker.css +1 -25
  13. package/dist/Editor/Elements/Color Picker/ColorPicker.js +4 -4
  14. package/dist/Editor/Elements/Color Picker/Styles.js +1 -2
  15. package/dist/Editor/Elements/Embed/Image.js +20 -28
  16. package/dist/Editor/Elements/Embed/Video.js +11 -15
  17. package/dist/Editor/Elements/Form/Workflow/UserInputs.js +1 -2
  18. package/dist/Editor/Elements/Grid/Grid.js +0 -2
  19. package/dist/Editor/Elements/Grid/GridItem.js +1 -3
  20. package/dist/Editor/Elements/Link/Link.js +1 -6
  21. package/dist/Editor/Elements/Link/LinkButton.js +2 -4
  22. package/dist/Editor/Elements/Link/LinkPopup.js +3 -11
  23. package/dist/Editor/Elements/Table/Table.js +1 -1
  24. package/dist/Editor/Elements/Table/TableCell.js +1 -1
  25. package/dist/Editor/MiniEditor.js +1 -3
  26. package/dist/Editor/Toolbar/Basic/index.js +2 -4
  27. package/dist/Editor/Toolbar/FormatTools/Dropdown.js +2 -26
  28. package/dist/Editor/Toolbar/FormatTools/MarkButton.js +2 -2
  29. package/dist/Editor/Toolbar/FormatTools/TextSize.js +11 -5
  30. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectFontSize.js +11 -4
  31. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectTypography.js +86 -213
  32. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/index.js +1 -2
  33. package/dist/Editor/Toolbar/PopupTool/PopupToolStyle.js +13 -20
  34. package/dist/Editor/Toolbar/PopupTool/TextFormat.js +7 -52
  35. package/dist/Editor/Toolbar/PopupTool/index.js +5 -6
  36. package/dist/Editor/Toolbar/toolbarGroups.js +6 -48
  37. package/dist/Editor/assets/svg/AIIcons.js +1 -153
  38. package/dist/Editor/common/ColorPickerButton.js +9 -25
  39. package/dist/Editor/common/DnD/DragHandleButton.js +1 -1
  40. package/dist/Editor/common/Icon.js +2 -30
  41. package/dist/Editor/common/LinkSettings/NavComponents.js +2 -5
  42. package/dist/Editor/common/LinkSettings/index.js +1 -2
  43. package/dist/Editor/common/LinkSettings/navOptions.js +2 -7
  44. package/dist/Editor/common/MentionsPopup/Styles.js +2 -5
  45. package/dist/Editor/common/Shorthands/elements.js +0 -54
  46. package/dist/Editor/common/StyleBuilder/accordionTitleBtnStyle.js +7 -7
  47. package/dist/Editor/common/StyleBuilder/accordionTitleStyle.js +16 -16
  48. package/dist/Editor/common/StyleBuilder/buttonStyle.js +2 -4
  49. package/dist/Editor/common/StyleBuilder/fieldTypes/bannerSpacing.js +29 -33
  50. package/dist/Editor/common/StyleBuilder/fieldTypes/borderRadius.js +25 -31
  51. package/dist/Editor/common/StyleBuilder/fieldTypes/buttonLink.js +1 -1
  52. package/dist/Editor/common/StyleBuilder/fieldTypes/color.js +7 -31
  53. package/dist/Editor/common/StyleBuilder/fieldTypes/fontSize.js +4 -13
  54. package/dist/Editor/common/StyleBuilder/fieldTypes/textOptions.js +4 -14
  55. package/dist/Editor/common/StyleBuilder/index.js +1 -1
  56. package/dist/Editor/helper/theme.js +4 -189
  57. package/dist/Editor/hooks/useMouseMove.js +2 -4
  58. package/dist/Editor/plugins/withEmbeds.js +1 -1
  59. package/dist/Editor/plugins/withHTML.js +5 -47
  60. package/dist/Editor/plugins/withLayout.js +10 -15
  61. package/dist/Editor/plugins/withTable.js +2 -2
  62. package/dist/Editor/theme/ThemeList.js +173 -50
  63. package/dist/Editor/utils/SlateUtilityFunctions.js +25 -157
  64. package/dist/Editor/utils/button.js +17 -1
  65. package/dist/Editor/utils/events.js +4 -11
  66. package/dist/Editor/utils/font.js +37 -40
  67. package/dist/Editor/utils/helper.js +13 -73
  68. package/package.json +1 -2
  69. package/dist/Editor/Elements/AI/VoiceToText/AudioWave.js +0 -73
  70. package/dist/Editor/Elements/AI/VoiceToText/index.js +0 -167
  71. package/dist/Editor/Elements/AI/VoiceToText/style.js +0 -40
  72. package/dist/Editor/Elements/Link/LinkPopupStyles.js +0 -28
  73. package/dist/Editor/Toolbar/PopupTool/ThemeTextFormat.js +0 -438
  74. package/dist/Editor/assets/svg/ThemeIcons.js +0 -291
  75. package/dist/Editor/common/CustomColorPicker/index.js +0 -106
  76. package/dist/Editor/common/CustomColorPicker/style.js +0 -53
  77. package/dist/Editor/common/CustomDialog/index.js +0 -94
  78. package/dist/Editor/common/CustomDialog/style.js +0 -67
  79. package/dist/Editor/common/CustomSelect.js +0 -33
  80. package/dist/Editor/common/EditorCmds.js +0 -35
  81. package/dist/Editor/hooks/useEditorTheme.js +0 -139
  82. package/dist/Editor/theme/index.js +0 -144
  83. package/dist/Editor/themeSettings/ActiveTheme.js +0 -72
  84. package/dist/Editor/themeSettings/buttons/index.js +0 -290
  85. package/dist/Editor/themeSettings/buttons/style.js +0 -21
  86. package/dist/Editor/themeSettings/colorTheme/index.js +0 -290
  87. package/dist/Editor/themeSettings/colorTheme/style.js +0 -77
  88. package/dist/Editor/themeSettings/fonts/PreviewElement.js +0 -123
  89. package/dist/Editor/themeSettings/fonts/index.js +0 -213
  90. package/dist/Editor/themeSettings/fonts/style.js +0 -44
  91. package/dist/Editor/themeSettings/icons.js +0 -60
  92. package/dist/Editor/themeSettings/index.js +0 -320
  93. package/dist/Editor/themeSettings/style.js +0 -152
  94. package/dist/Editor/themeSettingsAI/icons.js +0 -96
  95. package/dist/Editor/themeSettingsAI/index.js +0 -356
  96. package/dist/Editor/themeSettingsAI/saveTheme.js +0 -190
  97. package/dist/Editor/themeSettingsAI/style.js +0 -247
@@ -19,7 +19,7 @@ const usePopupStyle = theme => ({
19
19
  backgroundColor: theme?.palette?.editor?.background
20
20
  },
21
21
  "&.textSettings": {
22
- "@media only screen and (max-width: 600px)": {
22
+ '@media only screen and (max-width: 600px)': {
23
23
  margin: "4px !important",
24
24
  marginBottom: "54px !important"
25
25
  }
@@ -78,7 +78,7 @@ const usePopupStyle = theme => ({
78
78
  paddingTop: "4px"
79
79
  },
80
80
  "@media only screen and (max-width: 599px)": {
81
- width: "330px"
81
+ width: '330px'
82
82
  }
83
83
  },
84
84
  "&.templates": {
@@ -89,7 +89,7 @@ const usePopupStyle = theme => ({
89
89
  maxHeight: "fit-content"
90
90
  },
91
91
  "@media only screen and (max-width: 599px)": {
92
- width: "330px"
92
+ width: '330px'
93
93
  }
94
94
  },
95
95
  "& .headerContainer": {},
@@ -144,7 +144,7 @@ const usePopupStyle = theme => ({
144
144
  }
145
145
  },
146
146
  "@media only screen and (max-width: 599px)": {
147
- width: "330px"
147
+ width: '330px'
148
148
  }
149
149
  },
150
150
  textFormatLabel: {
@@ -155,13 +155,13 @@ const usePopupStyle = theme => ({
155
155
  lineHeight: "25px",
156
156
  marginTop: "12px",
157
157
  marginBottom: "8px",
158
- "& .searchContainer": {
158
+ '& .searchContainer': {
159
159
  position: "absolute",
160
160
  right: 0,
161
161
  zIndex: 3
162
162
  },
163
- "& .MuiFormControl-root.MuiTextField-root input": {
164
- padding: "8px 35px 6px 12px"
163
+ '& .MuiFormControl-root.MuiTextField-root input': {
164
+ padding: '8px 35px 6px 12px'
165
165
  }
166
166
  },
167
167
  textFormatField: {
@@ -205,8 +205,7 @@ const usePopupStyle = theme => ({
205
205
  fontSize: "14px",
206
206
  marginBottom: "5px",
207
207
  paddingLeft: "5px",
208
- fontWeight: 500,
209
- color: "#000000"
208
+ fontWeight: 500
210
209
  },
211
210
  templateCard: {
212
211
  borderRadius: "10px",
@@ -328,13 +327,8 @@ const usePopupStyle = theme => ({
328
327
  }
329
328
  },
330
329
  defaultBtn: {
331
- color: "#2563EB !important",
332
- textTransform: "none",
333
- textDecoration: "underline",
334
- "&.Mui-disabled": {
335
- color: "#A0AEC0 !important",
336
- textDecoration: "none"
337
- }
330
+ color: "#0F172A",
331
+ textTransform: "none"
338
332
  },
339
333
  templateCardBtnGrp: {
340
334
  display: "none",
@@ -419,8 +413,7 @@ const usePopupStyle = theme => ({
419
413
  colorPopper: {
420
414
  "& .MuiPaper-root": {
421
415
  backgroundColor: theme?.palette?.editor?.background,
422
- padding: "4px 14px",
423
- "@media only screen and (max-width: 600px)": {
416
+ '@media only screen and (max-width: 600px)': {
424
417
  marginTop: "-40px"
425
418
  }
426
419
  }
@@ -531,9 +524,9 @@ const usePopupStyle = theme => ({
531
524
  },
532
525
  customSelectPopoverWrapper: {
533
526
  "& .MuiPopover-paper": {
534
- maxHeight: "140px",
527
+ maxHeight: '140px',
535
528
  background: theme?.palette?.editor?.background,
536
- "@media only screen and (max-width: 600px)": {
529
+ '@media only screen and (max-width: 600px)': {
537
530
  marginTop: "-40px"
538
531
  }
539
532
  },
@@ -14,9 +14,6 @@ import { getPageSettings, updatePageSettings } from "../../utils/pageSettings";
14
14
  import { AllColors } from "../../Elements/Color Picker/ColorButtons";
15
15
  import { fontFamilyMap } from "../../utils/font";
16
16
  import { getBorderColor } from "../../utils/helper";
17
- import SelectTypography from "./MiniTextFormat/SelectTypography";
18
- import { isTextCustomized, saveToTheme } from "../../helper/theme";
19
- import { useEditorTheme } from "../../hooks/useEditorTheme";
20
17
  import { jsx as _jsx } from "react/jsx-runtime";
21
18
  import { jsxs as _jsxs } from "react/jsx-runtime";
22
19
  const allTools = toolbarGroups.flat();
@@ -37,6 +34,7 @@ const TextFormat = props => {
37
34
  const fontAlign = allTools.filter(f => f.format?.indexOf("align") >= 0);
38
35
  const link = allTools.find(f => f.format?.indexOf("link") >= 0);
39
36
  const lists = allTools.filter(f => f.group?.indexOf("list") >= 0);
37
+ const typo = allTools.filter(f => f.group?.indexOf("typography") >= 0);
40
38
  const {
41
39
  pageProps
42
40
  } = getPageSettings(editor)?.element || {};
@@ -54,11 +52,6 @@ const TextFormat = props => {
54
52
  color: "",
55
53
  bgColor: ""
56
54
  };
57
- const {
58
- theme,
59
- updateTheme
60
- } = useEditorTheme();
61
- const customized = isTextCustomized(editor);
62
55
  const handlePageWidth = width => () => {
63
56
  updatePageSettings(editor, {
64
57
  ...(pageProps || {}),
@@ -108,49 +101,6 @@ const TextFormat = props => {
108
101
  container: true,
109
102
  sx: classes.textFormatWrapper,
110
103
  children: [/*#__PURE__*/_jsxs(Grid, {
111
- item: true,
112
- xs: 12,
113
- children: [/*#__PURE__*/_jsxs(Grid, {
114
- container: true,
115
- justifyContent: "space-between",
116
- alignItems: "center",
117
- children: [/*#__PURE__*/_jsx(Grid, {
118
- item: true,
119
- children: /*#__PURE__*/_jsx(Typography, {
120
- variant: "body1",
121
- color: "primary",
122
- sx: classes.typoLabel,
123
- children: "Theme Style"
124
- })
125
- }), /*#__PURE__*/_jsx(Grid, {
126
- item: true,
127
- children: theme?.id ? /*#__PURE__*/_jsx(Button, {
128
- sx: classes.defaultBtn,
129
- onClick: () => {
130
- const {
131
- field,
132
- theme
133
- } = saveToTheme(editor) || {};
134
- updateTheme(theme, {
135
- action: "ELEMENT_PROPS_CHANGE",
136
- fieldName: field
137
- });
138
- },
139
- disabled: !customized,
140
- children: "Save to theme"
141
- }) : null
142
- })]
143
- }), /*#__PURE__*/_jsx(Grid, {
144
- item: true,
145
- xs: 12,
146
- sx: classes.textFormatField,
147
- children: /*#__PURE__*/_jsx(SelectTypography, {
148
- editor: editor,
149
- classes: classes,
150
- closeMainPopup: () => {}
151
- })
152
- })]
153
- }), /*#__PURE__*/_jsxs(Grid, {
154
104
  item: true,
155
105
  xs: 12,
156
106
  children: [/*#__PURE__*/_jsxs(Grid, {
@@ -369,7 +319,12 @@ const TextFormat = props => {
369
319
  xs: 12,
370
320
  className: "typo-icons",
371
321
  sx: classes.evenSpace,
372
- children: [fontStyle?.map((m, i) => {
322
+ children: [typo?.map((m, i) => {
323
+ return /*#__PURE__*/_jsx(BlockButton, {
324
+ editor: editor,
325
+ ...m
326
+ }, `pptool_mark_${i}_${m.id}`);
327
+ }), fontStyle?.map((m, i) => {
373
328
  return /*#__PURE__*/_jsx(MarkButton, {
374
329
  editor: editor,
375
330
  ...m
@@ -1,7 +1,7 @@
1
1
  import React, { useEffect, useState } from "react";
2
2
  import { Popper, Fade, Paper, ClickAwayListener } from "@mui/material";
3
3
  import { Editor, Range } from "slate";
4
- import { useSlate } from "slate-react";
4
+ import { useSlate, useFocused } from "slate-react";
5
5
  import useDrag from "../../hooks/useDrag";
6
6
  import { TableUtil } from "../../utils/table";
7
7
  import useWindowResize from "../../hooks/useWindowResize";
@@ -23,6 +23,7 @@ const PopupTool = props => {
23
23
  const [anchorEl, setAnchorEl] = useState(null);
24
24
  const [open, setOpen] = useState(false);
25
25
  const editor = useSlate();
26
+ const inFocus = useFocused();
26
27
  const {
27
28
  selection
28
29
  } = editor;
@@ -46,7 +47,7 @@ const PopupTool = props => {
46
47
  }
47
48
  }, [event, anchorEl]);
48
49
  useEffect(() => {
49
- if (!selection || Range.isCollapsed(selection) || Editor.string(editor, selection) === "") {
50
+ if (!selection || !inFocus || Range.isCollapsed(selection) || Editor.string(editor, selection) === "") {
50
51
  setAnchorEl(null);
51
52
  } else {
52
53
  updateAnchorEl();
@@ -91,8 +92,7 @@ const PopupTool = props => {
91
92
  editor: editor,
92
93
  classes: classes,
93
94
  closeMainPopup: handleClose,
94
- customProps: customProps,
95
- theme: theme
95
+ customProps: customProps
96
96
  })
97
97
  }) : /*#__PURE__*/_jsx(Popper, {
98
98
  id: id,
@@ -114,8 +114,7 @@ const PopupTool = props => {
114
114
  editor: editor,
115
115
  classes: classes,
116
116
  closeMainPopup: handleClose,
117
- customProps: customProps,
118
- theme: theme
117
+ customProps: customProps
119
118
  })
120
119
  })
121
120
  })
@@ -28,20 +28,16 @@ export const toolbarGroups = [[{
28
28
  type: "dropdown",
29
29
  options: [{
30
30
  text: "Normal",
31
- value: "normal",
32
- numVal: "400"
31
+ value: "normal"
33
32
  }, {
34
33
  text: "Bold",
35
- value: "bold",
36
- numVal: "700"
34
+ value: "bold"
37
35
  }, {
38
36
  text: "Bolder",
39
- value: "bolder",
40
- numVal: "700"
37
+ value: "bolder"
41
38
  }, {
42
39
  text: "Lighter",
43
- value: "lighter",
44
- numVal: "100"
40
+ value: "lighter"
45
41
  }],
46
42
  icon: FormatBoldIcon,
47
43
  width: "100px"
@@ -50,15 +46,13 @@ export const toolbarGroups = [[{
50
46
  format: "bold",
51
47
  type: "mark",
52
48
  title: "Bold",
53
- basic: true,
54
- themeEnabled: true
49
+ basic: true
55
50
  }, {
56
51
  id: 4,
57
52
  format: "italic",
58
53
  type: "mark",
59
54
  title: "Italic",
60
- basic: true,
61
- themeEnabled: true
55
+ basic: true
62
56
  }, {
63
57
  id: 5,
64
58
  format: "underline",
@@ -107,42 +101,6 @@ export const toolbarGroups = [[{
107
101
  type: "block",
108
102
  title: "H3",
109
103
  group: "typography"
110
- }, {
111
- id: 39,
112
- format: "headingFour",
113
- type: "block",
114
- title: "H4",
115
- group: "typography"
116
- }, {
117
- id: 40,
118
- format: "headingFive",
119
- type: "block",
120
- title: "H5",
121
- group: "typography"
122
- }, {
123
- id: 41,
124
- format: "headingSix",
125
- type: "block",
126
- title: "H6",
127
- group: "typography"
128
- }, {
129
- id: 42,
130
- format: "paragraphOne",
131
- type: "block",
132
- title: "Paragraph 1",
133
- group: "typography"
134
- }, {
135
- id: 43,
136
- format: "paragraphTwo",
137
- type: "block",
138
- title: "Paragraph 2",
139
- group: "typography"
140
- }, {
141
- id: 44,
142
- format: "paragraphThree",
143
- type: "block",
144
- title: "Paragraph 3",
145
- group: "typography"
146
104
  }, {
147
105
  id: 14,
148
106
  format: "doublequote",
@@ -435,156 +435,4 @@ export function DeleteIcon(props) {
435
435
  strokeLinejoin: "round"
436
436
  })]
437
437
  });
438
- }
439
- export const PauseRecordingIcon = () => /*#__PURE__*/_jsxs("svg", {
440
- width: "30",
441
- height: "30",
442
- viewBox: "0 0 30 30",
443
- fill: "none",
444
- xmlns: "http://www.w3.org/2000/svg",
445
- children: [/*#__PURE__*/_jsx("circle", {
446
- cx: "15",
447
- cy: "15",
448
- r: "14.5",
449
- fill: "white",
450
- stroke: "url(#paint0_linear_29403_449555)"
451
- }), /*#__PURE__*/_jsx("path", {
452
- d: "M13.6916 21.125H10.8817C10.5953 21.125 10.3447 20.8744 10.3447 20.5881V9.84943C10.3447 9.54517 10.5953 9.3125 10.8817 9.3125H13.6916C13.932 9.3125 14.2285 9.54517 14.2285 9.84943V20.5881C14.2285 20.8744 13.932 21.125 13.6916 21.125Z",
453
- fill: "url(#paint1_linear_29403_449555)"
454
- }), /*#__PURE__*/_jsx("path", {
455
- d: "M20.1346 21.125H17.3426C17.0383 21.125 16.8057 20.8744 16.8057 20.5881V9.84943C16.8057 9.54517 17.0383 9.3125 17.3426 9.3125H20.1525C20.4568 9.3125 20.6895 9.54517 20.6895 9.84943V20.5881C20.6716 20.8744 20.4389 21.125 20.1346 21.125Z",
456
- fill: "url(#paint2_linear_29403_449555)"
457
- }), /*#__PURE__*/_jsxs("defs", {
458
- children: [/*#__PURE__*/_jsxs("linearGradient", {
459
- id: "paint0_linear_29403_449555",
460
- x1: "15",
461
- y1: "0",
462
- x2: "15",
463
- y2: "30",
464
- gradientUnits: "userSpaceOnUse",
465
- children: [/*#__PURE__*/_jsx("stop", {
466
- stopColor: "#8061FD"
467
- }), /*#__PURE__*/_jsx("stop", {
468
- offset: "1",
469
- stopColor: "#2C64ED"
470
- })]
471
- }), /*#__PURE__*/_jsxs("linearGradient", {
472
- id: "paint1_linear_29403_449555",
473
- x1: "12.2866",
474
- y1: "9.3125",
475
- x2: "12.2866",
476
- y2: "21.125",
477
- gradientUnits: "userSpaceOnUse",
478
- children: [/*#__PURE__*/_jsx("stop", {
479
- stopColor: "#8161FD"
480
- }), /*#__PURE__*/_jsx("stop", {
481
- offset: "1",
482
- stopColor: "#2A64EC"
483
- })]
484
- }), /*#__PURE__*/_jsxs("linearGradient", {
485
- id: "paint2_linear_29403_449555",
486
- x1: "18.7476",
487
- y1: "9.3125",
488
- x2: "18.7476",
489
- y2: "21.125",
490
- gradientUnits: "userSpaceOnUse",
491
- children: [/*#__PURE__*/_jsx("stop", {
492
- stopColor: "#8161FD"
493
- }), /*#__PURE__*/_jsx("stop", {
494
- offset: "1",
495
- stopColor: "#2A64EC"
496
- })]
497
- })]
498
- })]
499
- });
500
- export const CloseGreyCircle = () => /*#__PURE__*/_jsxs("svg", {
501
- width: "30",
502
- height: "30",
503
- viewBox: "0 0 30 30",
504
- fill: "none",
505
- xmlns: "http://www.w3.org/2000/svg",
506
- children: [/*#__PURE__*/_jsx("rect", {
507
- width: "30",
508
- height: "30",
509
- rx: "15",
510
- fill: "#DAE4ED"
511
- }), /*#__PURE__*/_jsx("path", {
512
- d: "M19.1245 10.875L10.8749 19.1246",
513
- stroke: "#2563EB",
514
- strokeWidth: "1.5",
515
- strokeLinecap: "round",
516
- strokeLinejoin: "round"
517
- }), /*#__PURE__*/_jsx("path", {
518
- d: "M10.875 10.875L19.1246 19.1246",
519
- stroke: "#2563EB",
520
- strokeWidth: "1.5",
521
- strokeLinecap: "round",
522
- strokeLinejoin: "round"
523
- })]
524
- });
525
- export const TickBlueCircle = () => /*#__PURE__*/_jsxs("svg", {
526
- width: "30",
527
- height: "30",
528
- viewBox: "0 0 30 30",
529
- fill: "none",
530
- xmlns: "http://www.w3.org/2000/svg",
531
- children: [/*#__PURE__*/_jsx("rect", {
532
- width: "30",
533
- height: "30",
534
- rx: "15",
535
- fill: "url(#paint0_linear_30220_64249)"
536
- }), /*#__PURE__*/_jsx("path", {
537
- d: "M9 15L13.0011 19L21 11",
538
- stroke: "white",
539
- strokeWidth: "1.5",
540
- strokeLinecap: "round",
541
- strokeLinejoin: "round"
542
- }), /*#__PURE__*/_jsx("defs", {
543
- children: /*#__PURE__*/_jsxs("linearGradient", {
544
- id: "paint0_linear_30220_64249",
545
- x1: "15",
546
- y1: "0",
547
- x2: "15",
548
- y2: "30",
549
- gradientUnits: "userSpaceOnUse",
550
- children: [/*#__PURE__*/_jsx("stop", {
551
- stopColor: "#8360FD"
552
- }), /*#__PURE__*/_jsx("stop", {
553
- offset: "1",
554
- stopColor: "#2563EB"
555
- })]
556
- })
557
- })]
558
- });
559
- export const ChatMicIcon = props => /*#__PURE__*/_jsxs("svg", {
560
- width: "26",
561
- height: "26",
562
- viewBox: "0 0 26 26",
563
- fill: "none",
564
- xmlns: "http://www.w3.org/2000/svg",
565
- children: [/*#__PURE__*/_jsx("path", {
566
- d: "M13 19.3194C15.9882 19.3194 18.4166 16.8909 18.4166 13.9028V9.38887C18.4166 6.40067 15.9882 3.9722 13 3.9722C10.0118 3.9722 7.58331 6.40067 7.58331 9.38887V13.9028C7.58331 16.8909 10.0118 19.3194 13 19.3194Z",
567
- stroke: "#94A3B8",
568
- strokeWidth: "1.4",
569
- strokeLinecap: "round",
570
- strokeLinejoin: "round"
571
- }), /*#__PURE__*/_jsx("path", {
572
- d: "M4.875 12.0972V13.9028C4.875 18.3896 8.51319 22.0278 13 22.0278C17.4868 22.0278 21.125 18.3896 21.125 13.9028V12.0972",
573
- stroke: "#94A3B8",
574
- strokeWidth: "1.4",
575
- strokeLinecap: "round",
576
- strokeLinejoin: "round"
577
- }), /*#__PURE__*/_jsx("path", {
578
- d: "M10.3913 8.91914C11.9982 8.33233 13.7496 8.33233 15.3565 8.91914",
579
- stroke: "#94A3B8",
580
- strokeWidth: "1.4",
581
- strokeLinecap: "round",
582
- strokeLinejoin: "round"
583
- }), /*#__PURE__*/_jsx("path", {
584
- d: "M11.2218 11.6295C12.3051 11.3316 13.4516 11.3316 14.535 11.6295",
585
- stroke: "#94A3B8",
586
- strokeWidth: "1.4",
587
- strokeLinecap: "round",
588
- strokeLinejoin: "round"
589
- })]
590
- });
438
+ }
@@ -1,7 +1,7 @@
1
1
  import React, { useState } from "react";
2
2
  import { Grid, Button, Popover } from "@mui/material";
3
+ import ColorPickerTool from "react-gcolor-picker";
3
4
  import { colors } from "../Elements/Color Picker/defaultColors";
4
- import CustomColorPicker from "./CustomColorPicker";
5
5
  import { jsx as _jsx } from "react/jsx-runtime";
6
6
  import { jsxs as _jsxs } from "react/jsx-runtime";
7
7
  import { Fragment as _Fragment } from "react/jsx-runtime";
@@ -9,12 +9,9 @@ const ColorPickerButton = props => {
9
9
  const {
10
10
  value,
11
11
  onSave,
12
+ defaultColors = [],
12
13
  classes = {},
13
- recentColors = [],
14
- children,
15
- handleClose: closeDrawer,
16
- hideThemeColors,
17
- disableEditTheme
14
+ recentColors = []
18
15
  } = props;
19
16
  const [anchorEl, setAnchorEl] = useState(null);
20
17
  const [color, setColor] = useState(value);
@@ -33,13 +30,7 @@ const ColorPickerButton = props => {
33
30
  setColor(color);
34
31
  };
35
32
  return /*#__PURE__*/_jsxs(_Fragment, {
36
- children: [children ? /*#__PURE__*/_jsx("div", {
37
- onClick: handleColorPicker,
38
- style: {
39
- cursor: "pointer"
40
- },
41
- children: children
42
- }) : /*#__PURE__*/_jsx(Button, {
33
+ children: [/*#__PURE__*/_jsx(Button, {
43
34
  style: {
44
35
  background: value,
45
36
  height: "22px",
@@ -69,24 +60,17 @@ const ColorPickerButton = props => {
69
60
  item: true,
70
61
  xs: 12,
71
62
  children: [/*#__PURE__*/_jsx("div", {
72
- children: /*#__PURE__*/_jsx(CustomColorPicker, {
63
+ children: /*#__PURE__*/_jsx(ColorPickerTool, {
73
64
  gradient: true,
74
- color: color,
65
+ value: color,
75
66
  onChange: handleColorChange,
76
- recentColors: recentColors,
77
- closeDrawer: closeDrawer,
78
- hideThemeColors: hideThemeColors,
79
- disableEditTheme: disableEditTheme
67
+ defaultColors: [...recentColors, ...defaultColors] || []
80
68
  })
81
69
  }), /*#__PURE__*/_jsxs("div", {
82
70
  style: {
83
71
  display: "flex",
84
- justifyContent: "flex-end",
85
- padding: "8px",
86
- background: "white",
87
- position: "sticky",
88
- bottom: 0,
89
- boxShadow: "0 -1px 5px rgba(0,0,0,0.1)"
72
+ justifyContent: "end",
73
+ margin: "8px"
90
74
  },
91
75
  children: [/*#__PURE__*/_jsx(Button, {
92
76
  onClick: handleClose,
@@ -7,7 +7,7 @@ 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", "headingOne", "headingTwo", "headingThree", "headingFour", "headingFive", "headingSix", "paragraphOne", "paragraphTwo", "paragraphThree", "grid"];
10
+ const DRAGGABLE_TYPES = ["paragraph", "headingOne", "headingTwo", "headingThree", "grid"];
11
11
  const DragHandleStyle = () => ({
12
12
  dragHandle: {
13
13
  opacity: 0,
@@ -10,20 +10,10 @@ import { IoIosImage } from "react-icons/io";
10
10
  import { GridIcon, AccordionIcon, SignatureIcon, ButtonIcon, Carousal, FormIcon, BoldIcon, FontFamilyIcon, FontSizeIcon, ImageIcon, ItalicIcon, LinkIcon, StrikethroughIcon, TableIcon, UnderLineIcon, VideoIcon, CheckboxIcon, AppHeader, MoreHorizontal, UploadImage, DocsUpload, LeftArrow, RightArrow, CheckListButton, CheckListButtonActive, ExcelIcon, CsvIcon, DividerIcon, CloseIcon, SearchIcon, ExpandIcon, CalendarIconNew, Text, TextAreaIcon, Phone, BriefCase, Bank, CalendarTick, DollarSquare, Checkbox, Description, RadioButtonIcon, CheckedIcon, UncheckedIcon, InfinityIcon, ResetIcon } from "./iconslist";
11
11
  import ArrowRightIcon from "@mui/icons-material/ArrowRight";
12
12
  import ArrowDropDownIcon from "@mui/icons-material/ArrowDropDown";
13
- import EmailRoundedIcon from "@mui/icons-material/EmailRounded";
14
- import InfoOutlinedIcon from "@mui/icons-material/InfoOutlined";
13
+ import EmailRoundedIcon from '@mui/icons-material/EmailRounded';
14
+ import InfoOutlinedIcon from '@mui/icons-material/InfoOutlined';
15
15
  import { jsx as _jsx } from "react/jsx-runtime";
16
16
  import { jsxs as _jsxs } from "react/jsx-runtime";
17
- const HeadingIcon = ({
18
- variant
19
- }) => {
20
- return /*#__PURE__*/_jsx("div", {
21
- style: {
22
- color: "#64748B"
23
- },
24
- children: variant
25
- });
26
- };
27
17
  const iconList = {
28
18
  fontFamily: /*#__PURE__*/_jsx(FontFamilyIcon, {
29
19
  size: 20
@@ -59,24 +49,6 @@ const iconList = {
59
49
  size: 18,
60
50
  fill: "#64748B"
61
51
  }),
62
- headingFour: /*#__PURE__*/_jsx(HeadingIcon, {
63
- variant: "H4"
64
- }),
65
- headingFive: /*#__PURE__*/_jsx(HeadingIcon, {
66
- variant: "H5"
67
- }),
68
- headingSix: /*#__PURE__*/_jsx(HeadingIcon, {
69
- variant: "H6"
70
- }),
71
- paragraphOne: /*#__PURE__*/_jsx(HeadingIcon, {
72
- variant: "P1"
73
- }),
74
- paragraphTwo: /*#__PURE__*/_jsx(HeadingIcon, {
75
- variant: "P2"
76
- }),
77
- paragraphThree: /*#__PURE__*/_jsx(HeadingIcon, {
78
- variant: "P3"
79
- }),
80
52
  blockquote: /*#__PURE__*/_jsx(MdFormatQuote, {
81
53
  size: 20,
82
54
  fill: "#64748B"
@@ -134,13 +134,10 @@ export const SelectPage = props => {
134
134
  });
135
135
  };
136
136
  export const Trigger = props => {
137
- const {
138
- nav
139
- } = props;
140
- return /*#__PURE__*/_jsxs(Typography, {
137
+ return /*#__PURE__*/_jsx(Typography, {
141
138
  variant: "subtitle1",
142
139
  gutterBottom: true,
143
- children: ["Choosing this will trigger the ", nav.type, " step"]
140
+ children: "Choosing this will trigger the next step"
144
141
  });
145
142
  };
146
143
  const scrollToOptions = [{
@@ -18,8 +18,7 @@ const MAP_COMPONENT = {
18
18
  webAddress: TextInput,
19
19
  email: TextInput,
20
20
  phone: TextInput,
21
- nextTrigger: Trigger,
22
- prevTrigger: Trigger,
21
+ actionTrigger: Trigger,
23
22
  scrollTopOrBottom: ScrollTopBottom,
24
23
  page: SelectPage
25
24
  };
@@ -3,13 +3,8 @@ export const getNavOptions = (hideTools = []) => {
3
3
  label: "None",
4
4
  value: ""
5
5
  }, {
6
- label: "Next Trigger",
7
- value: "nextTrigger",
8
- type: "next"
9
- }, {
10
- label: "Previous Trigger",
11
- value: "prevTrigger",
12
- type: "previous"
6
+ label: "Trigger",
7
+ value: "actionTrigger"
13
8
  }, {
14
9
  label: "Web Address",
15
10
  value: "webAddress",
@@ -39,13 +39,10 @@ const usePopupStyles = theme => ({
39
39
  color: theme?.palette?.editor?.textColor
40
40
  },
41
41
  "&.active": {
42
- background: `#2563EB2B`,
43
- "& .MuiTypography-root": {
44
- color: `${theme?.palette?.editor?.activeColor} !important`
45
- }
42
+ background: `${theme?.palette?.containers?.bg3 || "#E9F3FE"}`
46
43
  },
47
44
  "&:hover": {
48
- background: theme?.palette?.action?.hover || `#F4F4F4`
45
+ background: `${theme?.palette?.containers?.bg3 || "#E9F3FE"}`
49
46
  },
50
47
  "&.renderComp": {
51
48
  padding: "0px",