@flozy/editor 3.8.7 → 3.8.8

Sign up to get free protection for your applications and to get access to all the features.
Files changed (117) hide show
  1. package/dist/Editor/ChatEditor.js +55 -29
  2. package/dist/Editor/CommonEditor.js +109 -166
  3. package/dist/Editor/Editor.css +12 -8
  4. package/dist/Editor/Elements/AI/AIInput.js +5 -16
  5. package/dist/Editor/Elements/AI/PopoverAIInput.js +17 -31
  6. package/dist/Editor/Elements/AI/Styles.js +1 -2
  7. package/dist/Editor/Elements/Accordion/Accordion.js +1 -1
  8. package/dist/Editor/Elements/Accordion/AccordionSummary.js +20 -6
  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/Emoji/EmojiPicker.js +4 -2
  16. package/dist/Editor/Elements/Form/Form.js +1 -1
  17. package/dist/Editor/Elements/Form/Workflow/FormWorkflow.js +3 -12
  18. package/dist/Editor/Elements/Form/Workflow/UserInputs.js +1 -2
  19. package/dist/Editor/Elements/Grid/Grid.js +3 -27
  20. package/dist/Editor/Elements/Grid/GridItem.js +1 -3
  21. package/dist/Editor/Elements/Link/Link.js +1 -6
  22. package/dist/Editor/Elements/Link/LinkButton.js +2 -4
  23. package/dist/Editor/Elements/Link/LinkPopup.js +3 -10
  24. package/dist/Editor/Elements/PageSettings/PageSettingsButton.js +8 -4
  25. package/dist/Editor/Elements/Signature/SignaturePopup.js +3 -14
  26. package/dist/Editor/Elements/Table/Styles.js +1 -23
  27. package/dist/Editor/Elements/Table/Table.js +1 -2
  28. package/dist/Editor/Elements/Table/TableCell.js +7 -69
  29. package/dist/Editor/Elements/TableContextMenu/TableContextMenu.js +0 -1
  30. package/dist/Editor/MiniEditor.js +1 -3
  31. package/dist/Editor/Toolbar/Basic/index.js +2 -4
  32. package/dist/Editor/Toolbar/FormatTools/Dropdown.js +2 -26
  33. package/dist/Editor/Toolbar/FormatTools/MarkButton.js +2 -2
  34. package/dist/Editor/Toolbar/FormatTools/TextSize.js +18 -29
  35. package/dist/Editor/Toolbar/Mini/MiniToolbar.js +27 -5
  36. package/dist/Editor/Toolbar/Mini/Options/Options.js +0 -10
  37. package/dist/Editor/Toolbar/Mini/Styles.js +0 -7
  38. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectFontSize.js +11 -4
  39. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectTypography.js +86 -213
  40. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/index.js +1 -2
  41. package/dist/Editor/Toolbar/PopupTool/PopupToolStyle.js +13 -20
  42. package/dist/Editor/Toolbar/PopupTool/TextFormat.js +7 -52
  43. package/dist/Editor/Toolbar/PopupTool/index.js +5 -6
  44. package/dist/Editor/Toolbar/toolbarGroups.js +6 -48
  45. package/dist/Editor/assets/svg/AIIcons.js +1 -153
  46. package/dist/Editor/assets/svg/AddTemplateIcon.js +10 -13
  47. package/dist/Editor/assets/svg/TextIcon.js +5 -8
  48. package/dist/Editor/common/ColorPickerButton.js +9 -25
  49. package/dist/Editor/common/DnD/DragHandleButton.js +47 -56
  50. package/dist/Editor/common/Icon.js +3 -43
  51. package/dist/Editor/common/LinkSettings/NavComponents.js +2 -5
  52. package/dist/Editor/common/LinkSettings/index.js +2 -4
  53. package/dist/Editor/common/LinkSettings/navOptions.js +2 -7
  54. package/dist/Editor/common/LinkSettings/style.js +8 -11
  55. package/dist/Editor/common/MentionsPopup/MentionsListCard.js +6 -1
  56. package/dist/Editor/common/Section/index.js +7 -57
  57. package/dist/Editor/common/Section/styles.js +0 -11
  58. package/dist/Editor/common/Shorthands/elements.js +0 -54
  59. package/dist/Editor/common/StyleBuilder/buttonStyle.js +2 -4
  60. package/dist/Editor/common/StyleBuilder/fieldTypes/bannerSpacing.js +29 -33
  61. package/dist/Editor/common/StyleBuilder/fieldTypes/borderRadius.js +25 -31
  62. package/dist/Editor/common/StyleBuilder/fieldTypes/buttonLink.js +1 -1
  63. package/dist/Editor/common/StyleBuilder/fieldTypes/color.js +7 -31
  64. package/dist/Editor/common/StyleBuilder/fieldTypes/fontSize.js +4 -13
  65. package/dist/Editor/common/StyleBuilder/fieldTypes/selectBox.js +14 -3
  66. package/dist/Editor/common/StyleBuilder/fieldTypes/textOptions.js +4 -14
  67. package/dist/Editor/common/StyleBuilder/index.js +1 -1
  68. package/dist/Editor/common/iconslist.js +31 -0
  69. package/dist/Editor/helper/index.js +22 -0
  70. package/dist/Editor/helper/theme.js +4 -189
  71. package/dist/Editor/hooks/useMouseMove.js +1 -4
  72. package/dist/Editor/hooks/useWindowMessage.js +7 -10
  73. package/dist/Editor/plugins/withEmbeds.js +1 -1
  74. package/dist/Editor/plugins/withHTML.js +1 -1
  75. package/dist/Editor/plugins/withTable.js +1 -1
  76. package/dist/Editor/theme/ThemeList.js +173 -50
  77. package/dist/Editor/utils/SlateUtilityFunctions.js +27 -169
  78. package/dist/Editor/utils/button.js +17 -1
  79. package/dist/Editor/utils/draftToSlate.js +1 -1
  80. package/dist/Editor/utils/events.js +2 -54
  81. package/dist/Editor/utils/font.js +37 -40
  82. package/dist/Editor/utils/helper.js +2 -31
  83. package/dist/Editor/utils/table.js +43 -51
  84. package/package.json +2 -3
  85. package/dist/Editor/Elements/AI/VoiceToText/AudioWave.js +0 -73
  86. package/dist/Editor/Elements/AI/VoiceToText/index.js +0 -167
  87. package/dist/Editor/Elements/AI/VoiceToText/style.js +0 -40
  88. package/dist/Editor/Elements/Link/LinkPopupStyles.js +0 -28
  89. package/dist/Editor/Elements/Redo/RedoButton.js +0 -14
  90. package/dist/Editor/Elements/Undo/UndoButton.js +0 -14
  91. package/dist/Editor/Toolbar/PopupTool/ThemeTextFormat.js +0 -438
  92. package/dist/Editor/assets/svg/RedoIcon.js +0 -27
  93. package/dist/Editor/assets/svg/SettingsIcon.js +0 -28
  94. package/dist/Editor/assets/svg/ThemeIcons.js +0 -291
  95. package/dist/Editor/assets/svg/UndoIcon.js +0 -27
  96. package/dist/Editor/common/CustomColorPicker/index.js +0 -106
  97. package/dist/Editor/common/CustomColorPicker/style.js +0 -53
  98. package/dist/Editor/common/CustomDialog/index.js +0 -94
  99. package/dist/Editor/common/CustomDialog/style.js +0 -67
  100. package/dist/Editor/common/CustomSelect.js +0 -33
  101. package/dist/Editor/hooks/useEditorTheme.js +0 -139
  102. package/dist/Editor/theme/index.js +0 -144
  103. package/dist/Editor/themeSettings/ActiveTheme.js +0 -72
  104. package/dist/Editor/themeSettings/buttons/index.js +0 -290
  105. package/dist/Editor/themeSettings/buttons/style.js +0 -21
  106. package/dist/Editor/themeSettings/colorTheme/index.js +0 -290
  107. package/dist/Editor/themeSettings/colorTheme/style.js +0 -77
  108. package/dist/Editor/themeSettings/fonts/PreviewElement.js +0 -123
  109. package/dist/Editor/themeSettings/fonts/index.js +0 -213
  110. package/dist/Editor/themeSettings/fonts/style.js +0 -44
  111. package/dist/Editor/themeSettings/icons.js +0 -60
  112. package/dist/Editor/themeSettings/index.js +0 -320
  113. package/dist/Editor/themeSettings/style.js +0 -152
  114. package/dist/Editor/themeSettingsAI/icons.js +0 -96
  115. package/dist/Editor/themeSettingsAI/index.js +0 -356
  116. package/dist/Editor/themeSettingsAI/saveTheme.js +0 -190
  117. package/dist/Editor/themeSettingsAI/style.js +0 -247
@@ -1,17 +1,15 @@
1
- import React, { useRef, useState } from "react";
1
+ import React, { useState } from "react";
2
2
  import { Transforms } from "slate";
3
3
  import { ReactEditor, useSlateStatic } from "slate-react";
4
- import { Box, IconButton, Popper, Tooltip } from "@mui/material";
4
+ import { Box, IconButton, Tooltip } from "@mui/material";
5
5
  import TuneIcon from "@mui/icons-material/Tune";
6
6
  import SectionPopup from "../../Elements/Grid/SectionPopup";
7
7
  import { getBreakPointsValue, getTRBLBreakPoints } from "../../helper/theme";
8
8
  import DragHandle from "../DnD/DragHandleButton";
9
9
  import { useEditorSelection } from "../../hooks/useMouseMove";
10
10
  import SectionStyle from "./styles";
11
- import useWindowResize from "../../hooks/useWindowResize";
12
11
  import { jsx as _jsx } from "react/jsx-runtime";
13
12
  import { jsxs as _jsxs } from "react/jsx-runtime";
14
- import { Fragment as _Fragment } from "react/jsx-runtime";
15
13
  const list_types = ["orderedList", "unorderedList"];
16
14
  const Section = props => {
17
15
  const classes = SectionStyle();
@@ -40,33 +38,14 @@ const Section = props => {
40
38
  flexDirection
41
39
  } = sectionAlignment || {};
42
40
  const path = ReactEditor.findPath(editor, element);
43
- const anchorEl = useRef(null);
44
- const popperEl = useRef(null);
45
- const [size] = useWindowResize();
46
- const isSectionFullWidth = sectionGridSize && sectionGridSize[size?.device] >= 12;
47
- const [isHovering, setIsHovering] = useState(false);
48
- const onMouseEnter = () => {
49
- setIsHovering(true);
50
- };
51
- const onMouseLeave = () => {
52
- setIsHovering(false);
53
- };
54
41
  const onSettings = () => {
55
42
  setOpenSettings(true);
56
43
  };
57
- const Toolbar = ({
58
- fromPopper
59
- }) => {
44
+ const Toolbar = () => {
60
45
  return !readOnly && !showTool ? /*#__PURE__*/_jsx(Box, {
61
46
  component: "div",
62
47
  className: `element-toolbar no-border-button hr section-tw sectionIcon`,
63
- style: fromPopper ? {
64
- position: "unset",
65
- marginLeft: "28px",
66
- paddingTop: "4px",
67
- marginRight: "10px",
68
- height: "100%"
69
- } : {
48
+ style: {
70
49
  left: "-28px",
71
50
  top: "3px"
72
51
  },
@@ -120,8 +99,6 @@ const Section = props => {
120
99
  alignItems: horizantal,
121
100
  justifyContent: vertical
122
101
  },
123
- onMouseEnter: onMouseEnter,
124
- onMouseLeave: onMouseLeave,
125
102
  children: [/*#__PURE__*/_jsxs(Box, {
126
103
  className: "ed-section-inner",
127
104
  sx: {
@@ -130,36 +107,9 @@ const Section = props => {
130
107
  ...getBreakPointsValue(sectionGridSize || 8, null, "overrideGridSize", true)
131
108
  }
132
109
  },
133
- ref: anchorEl,
134
- children: [isHovering && isSectionFullWidth ? /*#__PURE__*/_jsx(Popper, {
135
- open: isHovering && isSectionFullWidth,
136
- anchorEl: anchorEl?.current,
137
- placement: "top-start",
138
- sx: {
139
- zIndex: 9999
140
- },
141
- disablePortal: true,
142
- ref: popperEl,
143
- className: "sectionPopper",
144
- children: /*#__PURE__*/_jsxs(Box, {
145
- sx: {
146
- bgcolor: "background.paper",
147
- background: "#F6F6F6",
148
- height: "30px",
149
- position: "relative"
150
- },
151
- children: [!readOnly && !showTool ? /*#__PURE__*/_jsx(DragHandle, {
152
- ...props,
153
- fromPopper: true
154
- }) : null, /*#__PURE__*/_jsx(Toolbar, {
155
- fromPopper: true
156
- })]
157
- })
158
- }) : /*#__PURE__*/_jsxs(_Fragment, {
159
- children: [!readOnly && !showTool ? /*#__PURE__*/_jsx(DragHandle, {
160
- ...props
161
- }) : null, /*#__PURE__*/_jsx(Toolbar, {})]
162
- }), children]
110
+ children: [!readOnly && !showTool ? /*#__PURE__*/_jsx(DragHandle, {
111
+ ...props
112
+ }) : null, children, /*#__PURE__*/_jsx(Toolbar, {})]
163
113
  }), openSetttings ? /*#__PURE__*/_jsx(SectionPopup, {
164
114
  element: {
165
115
  ...element,
@@ -6,9 +6,6 @@ const SectionStyle = () => ({
6
6
  },
7
7
  "& .sectionIcon": {
8
8
  opacity: 1
9
- },
10
- "& .sectionPopper": {
11
- opacity: 1
12
9
  }
13
10
  },
14
11
  "& .element-toolbar": {
@@ -16,14 +13,6 @@ const SectionStyle = () => ({
16
13
  display: "block"
17
14
  }
18
15
  },
19
- "& .sectionPopper": {
20
- "&:hover": {
21
- opacity: 1
22
- }
23
- },
24
- "& .sectionPopper": {
25
- opacity: 0
26
- },
27
16
  "& .sectionIcon": {
28
17
  opacity: 0,
29
18
  padding: "0px",
@@ -40,60 +40,6 @@ const ELEMENTS_LIST = [{
40
40
  icon: "headingThree"
41
41
  }),
42
42
  onInsert: editor => toggleBlock(editor, "headingThree", false)
43
- }, {
44
- name: "Heading 4",
45
- desc: "",
46
- group: "Text",
47
- type: "headingFour",
48
- icon: /*#__PURE__*/_jsx(Icon, {
49
- icon: "headingFour"
50
- }),
51
- onInsert: editor => toggleBlock(editor, "headingFour", false)
52
- }, {
53
- name: "Heading 5",
54
- desc: "",
55
- group: "Text",
56
- type: "headingFive",
57
- icon: /*#__PURE__*/_jsx(Icon, {
58
- icon: "headingFive"
59
- }),
60
- onInsert: editor => toggleBlock(editor, "headingFive", false)
61
- }, {
62
- name: "Heading 6",
63
- desc: "",
64
- group: "Text",
65
- type: "headingSix",
66
- icon: /*#__PURE__*/_jsx(Icon, {
67
- icon: "headingSix"
68
- }),
69
- onInsert: editor => toggleBlock(editor, "headingSix", false)
70
- }, {
71
- name: "Paragraph 1",
72
- desc: "",
73
- group: "Text",
74
- type: "paragraphOne",
75
- icon: /*#__PURE__*/_jsx(Icon, {
76
- icon: "paragraphOne"
77
- }),
78
- onInsert: editor => toggleBlock(editor, "paragraphOne", false)
79
- }, {
80
- name: "Paragraph 2",
81
- desc: "",
82
- group: "Text",
83
- type: "paragraphTwo",
84
- icon: /*#__PURE__*/_jsx(Icon, {
85
- icon: "paragraphTwo"
86
- }),
87
- onInsert: editor => toggleBlock(editor, "paragraphTwo", false)
88
- }, {
89
- name: "Paragraph 3",
90
- desc: "",
91
- group: "Text",
92
- type: "paragraphThree",
93
- icon: /*#__PURE__*/_jsx(Icon, {
94
- icon: "paragraphThree"
95
- }),
96
- onInsert: editor => toggleBlock(editor, "paragraphThree", false)
97
43
  }, {
98
44
  name: "Quote",
99
45
  desc: "",
@@ -20,8 +20,7 @@ const buttonStyle = [{
20
20
  },
21
21
  children: option.text
22
22
  });
23
- },
24
- themeEnabled: true
23
+ }
25
24
  }, {
26
25
  label: "Font Size",
27
26
  key: "textSize",
@@ -45,8 +44,7 @@ const buttonStyle = [{
45
44
  }, {
46
45
  label: "Button Color",
47
46
  key: "bgColor",
48
- type: "color",
49
- themeEnabled: true
47
+ type: "color"
50
48
  }, {
51
49
  label: "Border Color",
52
50
  key: "borderColor",
@@ -1,14 +1,14 @@
1
1
  import React from "react";
2
2
  import { Checkbox, FormControlLabel, Grid, Slider, Typography, Box } from "@mui/material";
3
3
  import { squreStyle } from "./radiusStyle";
4
- import { getBreakPointsValue } from "../../../helper/theme";
4
+ import { getBreakPointsValue, getCustomizationValue } from "../../../helper/theme";
5
5
  import useWindowResize from "../../../hooks/useWindowResize";
6
- import { useEditorTheme } from "../../../hooks/useEditorTheme";
7
6
  import { jsx as _jsx } from "react/jsx-runtime";
8
7
  import { jsxs as _jsxs } from "react/jsx-runtime";
9
8
  const BANNER_SPACING_KEYS = ["top", "left", "right", "bottom"];
10
9
  const BannerSpacing = props => {
11
10
  const {
11
+ value: val,
12
12
  data,
13
13
  onChange,
14
14
  elementProps,
@@ -18,21 +18,11 @@ const BannerSpacing = props => {
18
18
  key
19
19
  } = data;
20
20
  const lockKeyVal = `lock${key}`;
21
- const [size] = useWindowResize();
22
- const {
23
- selectedTheme
24
- } = useEditorTheme();
25
- const {
26
- bannerSpacing,
27
- lockbannerSpacing
28
- } = selectedTheme?.elementProps?.button || {};
29
- const isUserValue = Object.keys(props?.value || {})?.length;
30
- const isUserLockedSpacing = typeof elementProps[lockKeyVal] === "boolean";
31
- const val = isUserValue ? props?.value : bannerSpacing;
32
- let lockSpacing = isUserLockedSpacing ? elementProps[lockKeyVal] : lockbannerSpacing;
21
+ let lockSpacing = elementProps[lockKeyVal];
33
22
  if (lockSpacing === undefined) {
34
23
  lockSpacing = true;
35
24
  }
25
+ const [size] = useWindowResize();
36
26
  const value = getBreakPointsValue(val, size?.device);
37
27
  const handleChange = e => {
38
28
  let changeAll = {};
@@ -88,10 +78,12 @@ const BannerSpacing = props => {
88
78
  component: "input",
89
79
  sx: classes.sapcingInput,
90
80
  name: "top",
91
- value: !lockSpacing ? "" : value?.top || 0,
92
- className: "sliderInput",
81
+ value: !lockSpacing ? "" : getCustomizationValue(value?.top),
82
+ className: "sliderInput removeScroll",
93
83
  disabled: !lockSpacing,
94
- onChange: handleChange
84
+ onChange: handleChange,
85
+ type: "number",
86
+ placeholder: "0"
95
87
  })]
96
88
  }), /*#__PURE__*/_jsx(FormControlLabel, {
97
89
  className: "ccheckbox-primary",
@@ -133,50 +125,54 @@ const BannerSpacing = props => {
133
125
  children: [/*#__PURE__*/_jsx("div", {
134
126
  className: "bannerSpaceBoxTop",
135
127
  children: /*#__PURE__*/_jsx("input", {
136
- type: "text",
128
+ type: "number",
137
129
  name: "top",
138
- value: value?.top,
139
- className: "borderInput",
130
+ value: getCustomizationValue(value?.top),
131
+ className: "borderInput removeScroll",
140
132
  style: {
141
133
  ...squreStyle.topRight
142
134
  },
143
- onChange: handleChange
135
+ onChange: handleChange,
136
+ placeholder: "0"
144
137
  })
145
138
  }), /*#__PURE__*/_jsx("div", {
146
139
  className: "bannerSpaceBoxRight",
147
140
  children: /*#__PURE__*/_jsx("input", {
148
- type: "text",
141
+ type: "number",
149
142
  name: "right",
150
- value: value?.right,
151
- className: "borderInput",
143
+ value: getCustomizationValue(value?.right),
144
+ className: "borderInput removeScroll",
152
145
  style: {
153
146
  ...squreStyle.bottomLeft
154
147
  },
155
- onChange: handleChange
148
+ onChange: handleChange,
149
+ placeholder: "0"
156
150
  })
157
151
  }), /*#__PURE__*/_jsx("div", {
158
152
  className: "bannerSpaceBoxBottom",
159
153
  children: /*#__PURE__*/_jsx("input", {
160
- type: "text",
154
+ type: "number",
161
155
  name: "bottom",
162
- value: value?.bottom,
163
- className: "borderInput",
156
+ value: getCustomizationValue(value?.bottom),
157
+ className: "borderInput removeScroll",
164
158
  style: {
165
159
  ...squreStyle.bottomRight
166
160
  },
167
- onChange: handleChange
161
+ onChange: handleChange,
162
+ placeholder: "0"
168
163
  })
169
164
  }), /*#__PURE__*/_jsx("div", {
170
165
  className: "bannerSpaceBoxLeft",
171
166
  children: /*#__PURE__*/_jsx("input", {
172
- type: "text",
167
+ type: "number",
173
168
  name: "left",
174
- className: "borderInput",
175
- value: value?.left,
169
+ className: "borderInput removeScroll",
170
+ value: getCustomizationValue(value?.left),
176
171
  style: {
177
172
  ...squreStyle.topLeft
178
173
  },
179
- onChange: handleChange
174
+ onChange: handleChange,
175
+ placeholder: "0"
180
176
  })
181
177
  })]
182
178
  })
@@ -2,36 +2,28 @@ import React from "react";
2
2
  import { Grid, Typography, Slider, FormControlLabel, Checkbox, Box } from "@mui/material";
3
3
  import { radiusStyle } from "./radiusStyle";
4
4
  import useWindowResize from "../../../hooks/useWindowResize";
5
- import { getBreakPointsValue } from "../../../helper/theme";
6
- import { useEditorTheme } from "../../../hooks/useEditorTheme";
5
+ import { getBreakPointsValue, getCustomizationValue } from "../../../helper/theme";
7
6
  import { jsx as _jsx } from "react/jsx-runtime";
8
7
  import { jsxs as _jsxs } from "react/jsx-runtime";
9
8
  const BORDER_RADIUS_KEYS = ["topLeft", "topRight", "bottomLeft", "bottomRight"];
10
9
  const BorderRadius = props => {
11
10
  const {
11
+ value: val,
12
12
  data,
13
13
  onChange,
14
14
  elementProps,
15
15
  classes
16
16
  } = props;
17
+ let {
18
+ lockRadius
19
+ } = elementProps;
20
+ if (lockRadius === undefined) {
21
+ lockRadius = true;
22
+ }
17
23
  const {
18
24
  key
19
25
  } = data;
20
26
  const [size] = useWindowResize();
21
- const {
22
- selectedTheme
23
- } = useEditorTheme();
24
- const {
25
- borderRadius,
26
- lockRadius: themeLockRadius
27
- } = selectedTheme?.elementProps?.button || {};
28
- const isUserValue = Object.keys(props?.value || {})?.length;
29
- const isUserLockedRadius = typeof elementProps?.lockRadius === "boolean";
30
- const val = isUserValue ? props?.value : borderRadius;
31
- let lockRadius = isUserLockedRadius ? elementProps?.lockRadius : themeLockRadius;
32
- if (lockRadius === undefined) {
33
- lockRadius = true;
34
- }
35
27
  const value = getBreakPointsValue(val, size?.device);
36
28
  const handleChange = e => {
37
29
  let changeAll = {};
@@ -88,11 +80,13 @@ const BorderRadius = props => {
88
80
  }), /*#__PURE__*/_jsx(Box, {
89
81
  sx: classes.sapcingInput,
90
82
  component: "input",
91
- value: !lockRadius ? "" : value?.topLeft || 0,
92
- className: "sliderInput",
83
+ value: !lockRadius ? "" : getCustomizationValue(value?.topLeft),
84
+ className: "sliderInput removeScroll",
93
85
  name: "topLeft",
94
86
  disabled: !lockRadius,
95
- onChange: handleChange
87
+ onChange: handleChange,
88
+ type: "number",
89
+ placeholder: "0"
96
90
  })]
97
91
  }), /*#__PURE__*/_jsx(FormControlLabel, {
98
92
  className: "ccheckbox-primary",
@@ -133,10 +127,10 @@ const BorderRadius = props => {
133
127
  borderRadius: `${value?.topLeft}px ${value?.topRight}px ${value?.bottomLeft}px ${value?.bottomRight}px`
134
128
  },
135
129
  children: [/*#__PURE__*/_jsx("input", {
136
- type: "text",
130
+ type: "number",
137
131
  name: "topLeft",
138
- value: value?.topLeft,
139
- className: "borderInput",
132
+ value: getCustomizationValue(value?.topLeft),
133
+ className: "borderInput removeScroll",
140
134
  placeholder: "0",
141
135
  style: {
142
136
  ...radiusStyle.topLeft,
@@ -144,10 +138,10 @@ const BorderRadius = props => {
144
138
  },
145
139
  onChange: handleChange
146
140
  }), /*#__PURE__*/_jsx("input", {
147
- type: "text",
141
+ type: "number",
148
142
  name: "topRight",
149
- value: value?.topRight,
150
- className: "borderInput",
143
+ value: getCustomizationValue(value?.topRight),
144
+ className: "borderInput removeScroll",
151
145
  placeholder: "0",
152
146
  style: {
153
147
  ...radiusStyle.topRight,
@@ -156,10 +150,10 @@ const BorderRadius = props => {
156
150
  },
157
151
  onChange: handleChange
158
152
  }), /*#__PURE__*/_jsx("input", {
159
- type: "text",
153
+ type: "number",
160
154
  name: "bottomLeft",
161
- value: value?.bottomLeft,
162
- className: "borderInput",
155
+ value: getCustomizationValue(value?.bottomLeft),
156
+ className: "borderInput removeScroll",
163
157
  placeholder: "0",
164
158
  style: {
165
159
  ...radiusStyle.bottomLeft,
@@ -168,10 +162,10 @@ const BorderRadius = props => {
168
162
  },
169
163
  onChange: handleChange
170
164
  }), /*#__PURE__*/_jsx("input", {
171
- type: "text",
165
+ type: "number",
172
166
  name: "bottomRight",
173
- value: value?.bottomRight,
174
- className: "borderInput",
167
+ value: getCustomizationValue(value?.bottomRight),
168
+ className: "borderInput removeScroll",
175
169
  placeholder: "0",
176
170
  style: {
177
171
  ...radiusStyle.bottomRight,
@@ -59,7 +59,7 @@ const ButtonLink = props => {
59
59
  value: elementProps?.url
60
60
  })
61
61
  });
62
- } else if (value?.linkType === "prevTrigger" || value?.linkType === "nextTrigger") {
62
+ } else if (value?.linkType === "actionTrigger") {
63
63
  return null;
64
64
  }
65
65
  };
@@ -1,44 +1,22 @@
1
- import React, { useEffect, useMemo, useState } from "react";
1
+ import React, { useEffect, useState } from "react";
2
2
  import { Grid, TextField, InputAdornment, Typography } from "@mui/material";
3
3
  import ColorPickerButton from "../../ColorPickerButton";
4
- import { useSlateStatic } from "slate-react";
5
- import { getElementStyle, getVariableValue } from "../../../helper/theme";
6
4
  import { jsx as _jsx } from "react/jsx-runtime";
7
5
  import { jsxs as _jsxs } from "react/jsx-runtime";
8
- const MAP_STYLE_PROPS = {
9
- bgColor: "background-color",
10
- textColor: "color"
11
- };
12
6
  const Color = props => {
13
7
  const {
14
- value: val,
8
+ value,
15
9
  data,
16
10
  onChange,
17
- classes,
18
- elementProps,
19
- handleClose,
20
- customProps
11
+ classes
21
12
  } = props;
22
13
  const {
23
14
  key,
24
15
  label
25
16
  } = data;
26
17
  const [recentColors, setRecentColors] = useState({});
27
- const editor = useSlateStatic();
28
- const {
29
- value,
30
- inputValue
31
- } = useMemo(() => {
32
- const isVariable = val && val.startsWith("var");
33
- const value = isVariable ? val : getElementStyle(editor, elementProps, MAP_STYLE_PROPS[key]);
34
- const inputValue = isVariable ? getVariableValue(val) : getElementStyle(editor, elementProps, MAP_STYLE_PROPS[key]);
35
- return {
36
- value: value || val,
37
- inputValue: inputValue || val
38
- };
39
- }, [editor, val]);
40
18
  useEffect(() => {
41
- const storedColors = JSON.parse(localStorage.getItem("recentColors"));
19
+ const storedColors = JSON.parse(localStorage.getItem('recentColors'));
42
20
  if (storedColors) {
43
21
  setRecentColors(storedColors);
44
22
  }
@@ -61,7 +39,7 @@ const Color = props => {
61
39
  [key]: updatedColors
62
40
  };
63
41
  setRecentColors(updatedColors);
64
- localStorage.setItem("recentColors", JSON.stringify(updatedColors));
42
+ localStorage.setItem('recentColors', JSON.stringify(updatedColors));
65
43
  };
66
44
  return /*#__PURE__*/_jsxs(Grid, {
67
45
  item: true,
@@ -78,7 +56,7 @@ const Color = props => {
78
56
  children: label
79
57
  }), /*#__PURE__*/_jsx(TextField, {
80
58
  fullWidth: true,
81
- value: inputValue,
59
+ value: value,
82
60
  placeholder: `${label} color code`,
83
61
  InputLabelProps: {
84
62
  shrink: true
@@ -90,9 +68,7 @@ const Color = props => {
90
68
  classes: classes,
91
69
  value: value,
92
70
  onSave: onSave,
93
- recentColors: recentColors[key],
94
- handleClose: handleClose,
95
- disableEditTheme: customProps?.disableEditTheme
71
+ recentColors: recentColors[key]
96
72
  })
97
73
  })
98
74
  }
@@ -1,26 +1,19 @@
1
- import React, { useMemo } from "react";
1
+ import React from "react";
2
2
  import { TextField, IconButton, Grid, Typography } from "@mui/material";
3
3
  import { sizeMap } from "../../../utils/font.js";
4
4
  import { TextMinusIcon, TextPlusIcon } from "../../../common/iconslist.js";
5
- import { getElementStyle } from "../../../helper/theme.js";
6
- import { useSlateStatic } from "slate-react";
7
5
  import { jsx as _jsx } from "react/jsx-runtime";
8
6
  import { jsxs as _jsxs } from "react/jsx-runtime";
9
7
  const FontSize = props => {
10
8
  const {
11
- value: val,
9
+ value,
12
10
  data,
13
- onChange,
14
- elementProps
11
+ onChange
15
12
  } = props;
16
13
  const {
17
14
  key,
18
15
  width
19
16
  } = data;
20
- const editor = useSlateStatic();
21
- const value = useMemo(() => {
22
- return getElementStyle(editor, elementProps, "font-size") || val;
23
- }, [editor, val]);
24
17
  const handleChange = e => {
25
18
  let inc = parseInt(e.target.value) || 16;
26
19
  inc = inc > 200 ? 200 : inc;
@@ -31,9 +24,7 @@ const FontSize = props => {
31
24
  const getSizeVal = () => {
32
25
  try {
33
26
  const size = `${value}`?.indexOf("px") >= 0 ? value : sizeMap[value] || value;
34
- const defaultSize = 16;
35
- const val = parseInt(size || defaultSize);
36
- return isNaN(val) ? defaultSize : val;
27
+ return parseInt(size || 16);
37
28
  } catch (err) {
38
29
  return "";
39
30
  }
@@ -1,4 +1,4 @@
1
- import React from "react";
1
+ import React, { useEffect, useState, useRef } from "react";
2
2
  import { Grid, Checkbox, FormControlLabel, FormHelperText } from "@mui/material";
3
3
  import { jsx as _jsx } from "react/jsx-runtime";
4
4
  import { jsxs as _jsxs } from "react/jsx-runtime";
@@ -6,12 +6,23 @@ const SelectBox = props => {
6
6
  const {
7
7
  value,
8
8
  data,
9
- onChange
9
+ onChange,
10
+ elementProps
10
11
  } = props;
11
12
  const {
12
13
  key,
13
14
  placeholder
14
15
  } = data;
16
+ const [checkedValue, setCheckedValue] = useState(false);
17
+ const isFirstRender = useRef(true);
18
+ useEffect(() => {
19
+ if (isFirstRender.current && elementProps.element === "email" && value === undefined) {
20
+ setCheckedValue(true);
21
+ isFirstRender.current = false;
22
+ } else {
23
+ setCheckedValue(value);
24
+ }
25
+ }, [elementProps.element, value]);
15
26
  const handleChange = e => {
16
27
  onChange({
17
28
  [key]: e.target.checked
@@ -26,7 +37,7 @@ const SelectBox = props => {
26
37
  children: [/*#__PURE__*/_jsx(FormControlLabel, {
27
38
  control: /*#__PURE__*/_jsx(Checkbox, {
28
39
  value: value,
29
- checked: value,
40
+ checked: checkedValue,
30
41
  onChange: handleChange
31
42
  }),
32
43
  label: placeholder
@@ -1,8 +1,7 @@
1
- import React, { useMemo } from "react";
1
+ import React from "react";
2
2
  import { FormControl, Grid, ListItemIcon, ListSubheader, MenuItem, Select, Typography } from "@mui/material";
3
- import { getBreakPointsValue, getElementStyle } from "../../../helper/theme";
3
+ import { getBreakPointsValue } from "../../../helper/theme";
4
4
  import useWindowResize from "../../../hooks/useWindowResize";
5
- import { useSlateStatic } from "slate-react";
6
5
  import { jsx as _jsx } from "react/jsx-runtime";
7
6
  import { jsxs as _jsxs } from "react/jsx-runtime";
8
7
  import { Fragment as _Fragment } from "react/jsx-runtime";
@@ -23,19 +22,10 @@ const TextOptions = props => {
23
22
  isBreakpoint,
24
23
  options,
25
24
  renderOption,
26
- width,
27
- themeEnabled
25
+ width
28
26
  } = data;
29
27
  const [size] = useWindowResize();
30
- const editor = useSlateStatic();
31
- const value = useMemo(() => {
32
- const userValue = isBreakpoint ? getBreakPointsValue(val, size?.device) : val;
33
- if (themeEnabled) {
34
- // editor takes a little amount of time to update the new style in element, in that case userValue will be returned
35
- return getElementStyle(editor, elementProps, key) || userValue;
36
- }
37
- return userValue;
38
- }, [editor, isBreakpoint, val, size?.device]);
28
+ const value = isBreakpoint ? getBreakPointsValue(val, size?.device) : val;
39
29
  const metaDataMappingOptions = metaMappings?.boards || [];
40
30
  const updatedOption = elementProps?.metadatamapping ? [...options, ...metaDataMappingOptions] : options;
41
31
  const handleChange = (e, d) => {
@@ -87,7 +87,7 @@ const StyleBuilder = props => {
87
87
  ...data,
88
88
  field_type: data?.element
89
89
  });
90
- if (data?.hasOwnProperty("name")) {
90
+ if (data?.hasOwnProperty('name')) {
91
91
  setElementProps({
92
92
  ...elementProps,
93
93
  ...data,