@flozy/editor 10.4.9 → 10.5.1

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 (192) hide show
  1. package/dist/Editor/ChatEditor.js +16 -17
  2. package/dist/Editor/CommonEditor.js +18 -134
  3. package/dist/Editor/DialogWrapper.js +25 -31
  4. package/dist/Editor/Editor.css +8 -46
  5. package/dist/Editor/Elements/AI/PopoverAIInput.js +3 -11
  6. package/dist/Editor/Elements/Accordion/Accordion.js +9 -46
  7. package/dist/Editor/Elements/Accordion/AccordionSummary.js +23 -1
  8. package/dist/Editor/Elements/AppHeader/AppHeader.js +5 -10
  9. package/dist/Editor/Elements/Button/EditorButton.js +10 -26
  10. package/dist/Editor/Elements/Carousel/CarouselItem.js +1 -2
  11. package/dist/Editor/Elements/Color Picker/ColorButtons.js +14 -61
  12. package/dist/Editor/Elements/Color Picker/ColorPicker.css +1 -25
  13. package/dist/Editor/Elements/Color Picker/ColorPicker.js +7 -10
  14. package/dist/Editor/Elements/Color Picker/Styles.js +13 -15
  15. package/dist/Editor/Elements/DataView/Layouts/ColumnView.js +2 -4
  16. package/dist/Editor/Elements/DataView/Layouts/DataTypes/MultiSelectType.js +11 -26
  17. package/dist/Editor/Elements/DataView/Layouts/DataTypes/SelectType.js +9 -28
  18. package/dist/Editor/Elements/DataView/Layouts/Options/AddOptions.js +6 -17
  19. package/dist/Editor/Elements/DataView/Layouts/Options/EditOption.js +16 -43
  20. package/dist/Editor/Elements/DataView/Layouts/Options/index.js +0 -11
  21. package/dist/Editor/Elements/DataView/Layouts/ViewData.js +4 -8
  22. package/dist/Editor/Elements/Embed/Image.js +2 -3
  23. package/dist/Editor/Elements/Embed/Video.js +1 -1
  24. package/dist/Editor/Elements/EmbedScript/Code.js +2 -14
  25. package/dist/Editor/Elements/EmbedScript/EmbedScriptPopup.js +28 -57
  26. package/dist/Editor/Elements/Form/Form.js +171 -184
  27. package/dist/Editor/Elements/Form/FormElements/FormText.js +6 -23
  28. package/dist/Editor/Elements/Form/FormElements/FormTextArea.js +2 -2
  29. package/dist/Editor/Elements/Form/FormField.js +6 -13
  30. package/dist/Editor/Elements/Form/Workflow/Styles.js +22 -24
  31. package/dist/Editor/Elements/FreeGrid/FreeGrid.js +35 -41
  32. package/dist/Editor/Elements/FreeGrid/FreeGridBox.js +4 -7
  33. package/dist/Editor/Elements/FreeGrid/FreeGridItem.js +0 -1
  34. package/dist/Editor/Elements/FreeGrid/Options/More.js +8 -8
  35. package/dist/Editor/Elements/FreeGrid/styles.js +7 -75
  36. package/dist/Editor/Elements/Grid/Grid.js +2 -14
  37. package/dist/Editor/Elements/Grid/GridItem.js +1 -1
  38. package/dist/Editor/Elements/List/CheckList.js +2 -3
  39. package/dist/Editor/Elements/Search/SearchAttachment.js +9 -40
  40. package/dist/Editor/Elements/Search/SearchButton.js +8 -9
  41. package/dist/Editor/Elements/Search/SearchList.js +7 -9
  42. package/dist/Editor/Elements/Signature/Signature.css +1 -2
  43. package/dist/Editor/Elements/Signature/SignatureOptions/DrawSignature.js +5 -18
  44. package/dist/Editor/Elements/Signature/SignatureOptions/UploadSignature.js +3 -16
  45. package/dist/Editor/Elements/SimpleText/index.js +1 -6
  46. package/dist/Editor/Elements/SimpleText/style.js +2 -2
  47. package/dist/Editor/Elements/Table/AddRowCol.js +2 -8
  48. package/dist/Editor/Elements/Table/DragButton.js +1 -0
  49. package/dist/Editor/Elements/Table/Draggable.js +2 -6
  50. package/dist/Editor/Elements/Table/Styles.js +0 -7
  51. package/dist/Editor/Elements/Table/Table.js +3 -3
  52. package/dist/Editor/Elements/Table/TableCell.js +8 -31
  53. package/dist/Editor/Elements/Title/title.js +6 -6
  54. package/dist/Editor/Elements/Variables/VariableButton.js +1 -10
  55. package/dist/Editor/MiniEditor.js +1 -2
  56. package/dist/Editor/Styles/EditorStyles.js +5 -5
  57. package/dist/Editor/Toolbar/FormatTools/Dropdown.js +3 -27
  58. package/dist/Editor/Toolbar/FormatTools/FontFamilyAutocomplete.js +3 -4
  59. package/dist/Editor/Toolbar/FormatTools/MarkButton.js +2 -2
  60. package/dist/Editor/Toolbar/FormatTools/TextSize.js +13 -10
  61. package/dist/Editor/Toolbar/Mini/MiniToolbar.js +1 -2
  62. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/MiniColorPicker.js +2 -4
  63. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectFontSize.js +13 -6
  64. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectTypography.js +42 -167
  65. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/index.js +4 -7
  66. package/dist/Editor/Toolbar/PopupTool/PopperHeader.js +1 -2
  67. package/dist/Editor/Toolbar/PopupTool/PopupToolStyle.js +12 -72
  68. package/dist/Editor/Toolbar/PopupTool/TextFormat.js +27 -100
  69. package/dist/Editor/Toolbar/PopupTool/index.js +1 -1
  70. package/dist/Editor/Toolbar/toolbarGroups.js +6 -48
  71. package/dist/Editor/assets/svg/SettingsIcon.js +0 -1
  72. package/dist/Editor/common/ColorPickerButton.js +16 -41
  73. package/dist/Editor/common/DnD/DragHandleButton.js +1 -1
  74. package/dist/Editor/common/FontLoader/FontLoader.js +0 -3
  75. package/dist/Editor/common/Icon.js +1 -31
  76. package/dist/Editor/common/ImageSelector/ImageSelector.js +2 -2
  77. package/dist/Editor/common/ImageSelector/Styles.js +9 -3
  78. package/dist/Editor/common/LinkSettings/NavComponents.js +55 -61
  79. package/dist/Editor/common/LinkSettings/index.js +80 -82
  80. package/dist/Editor/common/LinkSettings/navOptions.js +2 -2
  81. package/dist/Editor/common/LinkSettings/style.js +74 -209
  82. package/dist/Editor/common/MentionsPopup/index.js +1 -4
  83. package/dist/Editor/common/RnD/ElementOptions/Actions.js +15 -13
  84. package/dist/Editor/common/RnD/ElementOptions/Icons/LinkIcon.js +0 -1
  85. package/dist/Editor/common/RnD/ElementOptions/index.js +2 -2
  86. package/dist/Editor/common/RnD/ElementOptions/styles.js +1 -28
  87. package/dist/Editor/common/RnD/ElementSettings/OtherSettings/Settings.js +5 -6
  88. package/dist/Editor/common/RnD/ElementSettings/OtherSettings/Signature.js +3 -4
  89. package/dist/Editor/common/RnD/ElementSettings/Settings/AppHeaderSettings.js +2 -3
  90. package/dist/Editor/common/RnD/ElementSettings/Settings/BoxSettings.js +2 -3
  91. package/dist/Editor/common/RnD/ElementSettings/Settings/ButtonSettings.js +2 -3
  92. package/dist/Editor/common/RnD/ElementSettings/Settings/CodeSettings.js +2 -3
  93. package/dist/Editor/common/RnD/ElementSettings/Settings/FormSettings.js +2 -4
  94. package/dist/Editor/common/RnD/ElementSettings/Settings/ImageSettings.js +2 -3
  95. package/dist/Editor/common/RnD/ElementSettings/Settings/TableSettings.js +2 -3
  96. package/dist/Editor/common/RnD/ElementSettings/Settings/TextSettings.js +1 -3
  97. package/dist/Editor/common/RnD/ElementSettings/Settings/VideoSettings.js +2 -3
  98. package/dist/Editor/common/RnD/ElementSettings/styles.js +12 -146
  99. package/dist/Editor/common/RnD/OptionsPopup/index.js +5 -8
  100. package/dist/Editor/common/RnD/OptionsPopup/style.js +19 -120
  101. package/dist/Editor/common/RnD/SwitchViewport/SwitchViewport.js +5 -8
  102. package/dist/Editor/common/RnD/Theme/ViewportStimulator.js +3 -6
  103. package/dist/Editor/common/RnD/Utils/gridDropItem.js +19 -28
  104. package/dist/Editor/common/RnD/Utils/index.js +1 -3
  105. package/dist/Editor/common/RnD/VirtualElement/VirtualTextElement.js +58 -42
  106. package/dist/Editor/common/RnD/VirtualElement/helper.js +132 -323
  107. package/dist/Editor/common/RnD/VirtualElement/styles.js +0 -16
  108. package/dist/Editor/common/RnD/index.js +38 -67
  109. package/dist/Editor/common/Select/index.js +5 -44
  110. package/dist/Editor/common/Select/styles.js +2 -30
  111. package/dist/Editor/common/Shorthands/elements.js +11 -65
  112. package/dist/Editor/common/StyleBuilder/accordionTitleBtnStyle.js +2 -2
  113. package/dist/Editor/common/StyleBuilder/accordionTitleStyle.js +9 -12
  114. package/dist/Editor/common/StyleBuilder/buttonStyle.js +2 -4
  115. package/dist/Editor/common/StyleBuilder/embedVideoStyle.js +0 -4
  116. package/dist/Editor/common/StyleBuilder/fieldTypes/backgroundImage.js +0 -5
  117. package/dist/Editor/common/StyleBuilder/fieldTypes/bannerSpacing.js +2 -12
  118. package/dist/Editor/common/StyleBuilder/fieldTypes/borderRadius.js +7 -15
  119. package/dist/Editor/common/StyleBuilder/fieldTypes/card.js +8 -16
  120. package/dist/Editor/common/StyleBuilder/fieldTypes/color.js +10 -36
  121. package/dist/Editor/common/StyleBuilder/fieldTypes/fontSize.js +7 -16
  122. package/dist/Editor/common/StyleBuilder/fieldTypes/index.js +1 -3
  123. package/dist/Editor/common/StyleBuilder/fieldTypes/lineSpacing.js +6 -7
  124. package/dist/Editor/common/StyleBuilder/fieldTypes/menusArray.js +6 -13
  125. package/dist/Editor/common/StyleBuilder/fieldTypes/textOptions.js +7 -15
  126. package/dist/Editor/common/StyleBuilder/pageSettingsStyle.js +7 -5
  127. package/dist/Editor/common/SwipeableDrawer/style.js +12 -14
  128. package/dist/Editor/common/Uploader.js +0 -16
  129. package/dist/Editor/common/iconListV2.js +6 -177
  130. package/dist/Editor/common/iconslist.js +0 -24
  131. package/dist/Editor/commonStyle.js +62 -186
  132. package/dist/Editor/helper/index.js +1 -5
  133. package/dist/Editor/helper/theme.js +2 -203
  134. package/dist/Editor/hooks/useMouseMove.js +5 -8
  135. package/dist/Editor/hooks/useTable.js +4 -5
  136. package/dist/Editor/plugins/withEmbeds.js +1 -1
  137. package/dist/Editor/plugins/withHTML.js +1 -3
  138. package/dist/Editor/plugins/withTable.js +1 -1
  139. package/dist/Editor/theme/ThemeList.js +173 -50
  140. package/dist/Editor/utils/SlateUtilityFunctions.js +46 -172
  141. package/dist/Editor/utils/accordion.js +4 -14
  142. package/dist/Editor/utils/button.js +17 -1
  143. package/dist/Editor/utils/customHooks/useTableResize.js +9 -49
  144. package/dist/Editor/utils/draftToSlate.js +2 -3
  145. package/dist/Editor/utils/events.js +6 -50
  146. package/dist/Editor/utils/font.js +37 -40
  147. package/dist/Editor/utils/form.js +4 -4
  148. package/dist/Editor/utils/formfield.js +2 -9
  149. package/dist/Editor/utils/helper.js +26 -215
  150. package/dist/Editor/utils/insertAppHeader.js +1 -1
  151. package/dist/Editor/utils/signature.js +9 -2
  152. package/package.json +4 -4
  153. package/dist/Editor/Elements/DataView/Layouts/DataTypes/Components/SelectV1.js +0 -510
  154. package/dist/Editor/Elements/EmbedScript/styles.js +0 -89
  155. package/dist/Editor/Elements/FreeGrid/helper.js +0 -115
  156. package/dist/Editor/Toolbar/PopupTool/ThemeTextFormat.js +0 -439
  157. package/dist/Editor/assets/svg/BackIcon.js +0 -18
  158. package/dist/Editor/assets/svg/ClearAllRounded.js +0 -31
  159. package/dist/Editor/assets/svg/ResetIconNew.js +0 -23
  160. package/dist/Editor/assets/svg/ThemeIcons.js +0 -293
  161. package/dist/Editor/common/Checkbox/index.js +0 -46
  162. package/dist/Editor/common/Checkbox/styles.js +0 -45
  163. package/dist/Editor/common/CustomColorPicker/index.js +0 -130
  164. package/dist/Editor/common/CustomColorPicker/style.js +0 -53
  165. package/dist/Editor/common/CustomDialog2/index.js +0 -94
  166. package/dist/Editor/common/CustomDialog2/style.js +0 -67
  167. package/dist/Editor/common/CustomSelect.js +0 -43
  168. package/dist/Editor/common/RadioGroup/index.js +0 -48
  169. package/dist/Editor/common/RadioGroup/styles.js +0 -29
  170. package/dist/Editor/common/RnD/Theme/MainThemeProvider.js +0 -17
  171. package/dist/Editor/common/SnackBar/index.js +0 -43
  172. package/dist/Editor/common/StyleBuilder/fieldTypes/embedUpload.js +0 -115
  173. package/dist/Editor/helper/textIndeces.js +0 -58
  174. package/dist/Editor/hooks/useEditorTheme.js +0 -153
  175. package/dist/Editor/hooks/useThemeValues.js +0 -63
  176. package/dist/Editor/theme/index.js +0 -149
  177. package/dist/Editor/themeSettings/ActiveTheme.js +0 -82
  178. package/dist/Editor/themeSettings/buttons/index.js +0 -300
  179. package/dist/Editor/themeSettings/buttons/style.js +0 -23
  180. package/dist/Editor/themeSettings/colorTheme/index.js +0 -310
  181. package/dist/Editor/themeSettings/colorTheme/style.js +0 -81
  182. package/dist/Editor/themeSettings/fonts/PreviewElement.js +0 -121
  183. package/dist/Editor/themeSettings/fonts/index.js +0 -240
  184. package/dist/Editor/themeSettings/fonts/style.js +0 -62
  185. package/dist/Editor/themeSettings/icons.js +0 -60
  186. package/dist/Editor/themeSettings/index.js +0 -380
  187. package/dist/Editor/themeSettings/style.js +0 -299
  188. package/dist/Editor/themeSettingsAI/icons.js +0 -96
  189. package/dist/Editor/themeSettingsAI/index.js +0 -355
  190. package/dist/Editor/themeSettingsAI/saveTheme.js +0 -202
  191. package/dist/Editor/themeSettingsAI/style.js +0 -332
  192. package/dist/Editor/utils/updateFormName.js +0 -22
@@ -1,5 +1,5 @@
1
- import React, { useEffect, useState } from "react";
2
- import { Editor, Range, Transforms } from "slate";
1
+ import React, { useState } from "react";
2
+ import { Transforms } from "slate";
3
3
  import { useSelected, useSlateStatic, ReactEditor } from "slate-react";
4
4
  import AccordionBtnPopup from "./AccordionBtnPopup";
5
5
  import { IconButton, Tooltip, Box } from "@mui/material";
@@ -8,8 +8,6 @@ import { GridSettingsIcon } from "../../common/iconslist";
8
8
  import Icon from "../../common/Icon";
9
9
  import { useEditorContext, useEditorSelection } from "../../hooks/useMouseMove";
10
10
  import useCommonStyle from "../../commonStyle";
11
- import { getBorderColor, getTextColor } from "../../helper";
12
- import { getBreakPointsValue, getTRBLBreakPoints } from "../../helper/theme";
13
11
  import { jsx as _jsx } from "react/jsx-runtime";
14
12
  import { jsxs as _jsxs } from "react/jsx-runtime";
15
13
  const accordionBtnStyleKeys = {
@@ -80,34 +78,12 @@ const Accordion = props => {
80
78
  const path = ReactEditor.findPath(editor, element);
81
79
  const {
82
80
  textColor,
83
- bgColor,
84
- borderColor
81
+ bgColor
85
82
  } = element;
86
- const accordionSummary = element?.children?.find(c => c.type === "accordion-summary");
87
- const {
88
- textColor: childTextColor,
89
- borderRadius,
90
- bannerSpacing
91
- } = accordionSummary || {};
92
- const borderStyle = getBorderColor(borderColor);
93
83
  const {
94
84
  theme
95
85
  } = useEditorContext();
96
86
  const classes = useCommonStyle(theme);
97
- useEffect(() => {
98
- if (!editor.selection || !children[1]) return;
99
- try {
100
- const accordionDetailsElement = element.children?.[1];
101
- const detailsPath = ReactEditor.findPath(editor, accordionDetailsElement);
102
- const detailsRange = Editor.range(editor, detailsPath);
103
- const isInside = Range.intersection(detailsRange, editor.selection);
104
- if (isInside && !toggle) {
105
- setToggle(true);
106
- }
107
- } catch (e) {
108
- console.error(e);
109
- }
110
- }, [editor.selection, children]);
111
87
  const onToggle = () => {
112
88
  setToggle(!toggle);
113
89
  };
@@ -183,29 +159,17 @@ const Accordion = props => {
183
159
  const onClose = () => {
184
160
  setOpenSettings(false);
185
161
  };
186
- const textStyles = getTextColor(childTextColor);
187
- const borderRadiusStyles = {
188
- ...getBreakPointsValue(borderRadius || {}, null, "overrideBorderRadius", true)
189
- };
190
- const padding = getTRBLBreakPoints(bannerSpacing);
191
- return /*#__PURE__*/_jsxs(Box, {
162
+ return /*#__PURE__*/_jsxs("div", {
192
163
  className: `accordion-container`,
193
164
  ...attributes,
194
165
  style: {
195
166
  position: "relative"
196
167
  },
197
- component: "div",
198
- sx: {
199
- background: bgColor,
200
- ...borderStyle,
201
- borderRadius: borderRadiusStyles,
202
- padding,
203
- '& span[data-slate-string="true"]': textStyles
204
- },
205
168
  children: [/*#__PURE__*/_jsxs("div", {
206
- className: "accordion-title"
207
- // style={{ background: bgColor, ...borderStyle }}
208
- ,
169
+ className: "accordion-title",
170
+ style: {
171
+ background: bgColor
172
+ },
209
173
  onClick: onToggle,
210
174
  children: [/*#__PURE__*/_jsx(Box, {
211
175
  role: "button",
@@ -227,8 +191,7 @@ const Accordion = props => {
227
191
  icon: "accordionArrowDown"
228
192
  })
229
193
  }), children[0]]
230
- }), /*#__PURE__*/_jsx(Box, {
231
- component: "div",
194
+ }), /*#__PURE__*/_jsx("div", {
232
195
  className: "accordion-content",
233
196
  style: {
234
197
  display: toggle ? "block" : "none"
@@ -1,5 +1,7 @@
1
1
  import React from "react";
2
+ import { getBorderColor, getTextColor } from "../../helper";
2
3
  import { Box } from "@mui/material";
4
+ import { getBreakPointsValue, getTRBLBreakPoints } from "../../helper/theme";
3
5
  import { jsx as _jsx } from "react/jsx-runtime";
4
6
  const AccordionSummary = props => {
5
7
  const {
@@ -7,12 +9,32 @@ const AccordionSummary = props => {
7
9
  children,
8
10
  element
9
11
  } = props;
12
+ const {
13
+ textColor,
14
+ bgColor,
15
+ borderColor,
16
+ borderRadius,
17
+ bannerSpacing
18
+ } = element;
19
+ const textStyles = getTextColor(textColor);
20
+ const borderStyle = getBorderColor(borderColor);
10
21
  return /*#__PURE__*/_jsx(Box, {
11
22
  className: `accordion-summary-container`,
12
23
  ...attributes,
13
24
  style: {
14
25
  width: "100%",
15
- position: "relative"
26
+ position: "relative",
27
+ background: bgColor,
28
+ ...borderStyle
29
+ },
30
+ sx: {
31
+ borderRadius: {
32
+ ...getBreakPointsValue(borderRadius || {}, null, "overrideBorderRadius", true)
33
+ },
34
+ padding: {
35
+ ...getTRBLBreakPoints(bannerSpacing)
36
+ },
37
+ '& span[data-slate-string="true"]': textStyles
16
38
  },
17
39
  component: "div",
18
40
  children: children
@@ -18,7 +18,7 @@ import Typography from "@mui/material/Typography";
18
18
  import Button from "@mui/material/Button";
19
19
  import AppHeaderPopup from "./AppHeaderPopup";
20
20
  import { getTRBLBreakPoints, groupByBreakpoint } from "../../helper/theme";
21
- import { handleLinkType, isHavingColor } from "../../utils/helper";
21
+ import { handleLinkType } from "../../utils/helper";
22
22
  import { jsx as _jsx } from "react/jsx-runtime";
23
23
  import { jsxs as _jsxs } from "react/jsx-runtime";
24
24
  import { createElement as _createElement } from "react";
@@ -45,8 +45,6 @@ function AppHeader(props) {
45
45
  bgColorHover,
46
46
  textColor,
47
47
  textColorHover,
48
- borderColor,
49
- borderColorHover,
50
48
  menuStyle,
51
49
  bannerSpacing,
52
50
  fontSize,
@@ -151,7 +149,7 @@ function AppHeader(props) {
151
149
  }) : appTitle
152
150
  }), /*#__PURE__*/_jsx(Divider, {}), /*#__PURE__*/_jsx(List, {
153
151
  children: menus.map((item, i) => {
154
- const buttonProps = handleLinkType(item.url, item.linkType, true, item.target === "_blank", () => {}, !readOnly, true);
152
+ const buttonProps = handleLinkType(item.url, item.linkType, true, item.target === "_blank");
155
153
  const onButtonClick = e => {
156
154
  closeDrawer();
157
155
  setTimeout(() => {
@@ -227,7 +225,6 @@ function AppHeader(props) {
227
225
  sx: {
228
226
  ...elevateStyle,
229
227
  background: bgColor,
230
- border: isHavingColor(borderColor) ? `1px solid ${borderColor}` : "none",
231
228
  boxShadow: "none",
232
229
  ...appbarSp,
233
230
  zIndex: 999
@@ -268,7 +265,7 @@ function AppHeader(props) {
268
265
  style: {
269
266
  display: "inline-flex",
270
267
  alignItems: "center",
271
- color: textColor || "#000000",
268
+ color: textColor,
272
269
  fontSize: logoFontSize,
273
270
  fontFamily: titleFontFamily,
274
271
  justifyContent: isLogoRight ? "end" : "start"
@@ -323,9 +320,8 @@ function AppHeader(props) {
323
320
  fontFamily: fontFamily,
324
321
  textTransform: "none",
325
322
  fontSize: fontSize || "16px",
326
- color: textColor || "#000",
323
+ color: textColor || "#FFF",
327
324
  background: bgColor || "none",
328
- border: borderColorHover ? `1px solid transparent` : "none",
329
325
  "& .m-settings": {
330
326
  display: "none",
331
327
  position: "absolute",
@@ -339,9 +335,8 @@ function AppHeader(props) {
339
335
  background: "#FFF"
340
336
  },
341
337
  "&:hover": {
342
- color: textColorHover || textColor || "#000",
338
+ color: textColorHover || textColor || "#FFF",
343
339
  background: bgColorHover || bgColor || "none",
344
- border: borderColorHover ? `1px solid ${borderColorHover}` : "none",
345
340
  "& .m-settings": {
346
341
  display: "block"
347
342
  }
@@ -9,8 +9,6 @@ import { WorkflowIcon } from "../../common/iconslist";
9
9
  import { getTRBLBreakPoints, getBreakPointsValue, groupByBreakpoint } from "../../helper/theme";
10
10
  import { handleLinkType, windowVar } from "../../utils/helper";
11
11
  import LinkSettings from "../../common/LinkSettings";
12
- import { useEditorTheme } from "../../hooks/useEditorTheme";
13
- import { getTheme } from "../../theme";
14
12
  import Icon from "../../common/Icon";
15
13
  import { useEditorContext } from "../../hooks/useMouseMove";
16
14
  import useCommonStyle from "../../commonStyle";
@@ -42,12 +40,6 @@ const EditorButton = props => {
42
40
  const [openMoreOptions, setOpenMoreOptions] = useState(false);
43
41
  const [, setIconLoaded] = useState(false);
44
42
  const classes = useCommonStyle(appTheme);
45
- const {
46
- theme: selectedTheme
47
- } = useEditorTheme();
48
- const {
49
- buttonTheme
50
- } = getTheme(selectedTheme);
51
43
  const {
52
44
  label,
53
45
  bgColor,
@@ -62,7 +54,7 @@ const EditorButton = props => {
62
54
  textColorHover,
63
55
  bgColorHover,
64
56
  borderColorHover,
65
- // buttonIcon,
57
+ buttonIcon,
66
58
  iconPosition = "start",
67
59
  borderStyle,
68
60
  borderWidth,
@@ -83,7 +75,6 @@ const EditorButton = props => {
83
75
  };
84
76
  const isTrigger = linkType === "nextTrigger" || linkType === "prevTrigger";
85
77
  const refURl = isTrigger ? buttonLink?.url : url;
86
- const buttonIcon = element?.buttonIcon || buttonTheme?.buttonIcon;
87
78
  const BtnIcon = buttonIcon ? buttonIcon : null;
88
79
  windowVar.lastButtonProps = element;
89
80
  const handleTrigger = async () => {
@@ -106,7 +97,7 @@ const EditorButton = props => {
106
97
  };
107
98
  const buttonProps = handleLinkType(refURl, linkType, true,
108
99
  // button functionalities have to work on both edit mode and normal mode
109
- openInNewTab, handleTrigger, metadata, !readOnly);
100
+ openInNewTab, handleTrigger, metadata);
110
101
  const onMenuClick = val => () => {
111
102
  switch (val) {
112
103
  case "edit":
@@ -174,7 +165,6 @@ const EditorButton = props => {
174
165
  display: "inline-flex",
175
166
  color: "rgba(0, 0, 0, 0.54)",
176
167
  marginBottom: "0px !important",
177
- ...classes.buttonMoreOption,
178
168
  ...classes.buttonMoreOption3
179
169
  },
180
170
  ...btnProps,
@@ -275,14 +265,19 @@ const EditorButton = props => {
275
265
  display: "inline-block"
276
266
  },
277
267
  children: [/*#__PURE__*/_jsxs(Box, {
278
- className: `btn textAlign-${tAlign} button theme-element`,
279
268
  ref: buttonRef,
269
+ className: `btn textAlign-${tAlign}`,
280
270
  sx: {
281
271
  textDecoration: "none",
272
+ background: bgColor || "rgb(30, 75, 122)",
282
273
  borderBlockStyle: "solid",
283
- borderWidth: borderWidth !== undefined ? borderWidth : borderColor || borderColorHover ? "1px" : "0px",
274
+ borderColor: borderColor || "transparent",
275
+ borderWidth: borderWidth !== undefined ? borderWidth : borderColor ? "1px" : "0px",
284
276
  ...btnSp,
285
277
  borderStyle: borderStyle || "solid",
278
+ color: `${textColor || "#FFFFFF"}`,
279
+ fontSize: textSize || "inherit",
280
+ fontFamily: fontFamily || "PoppinsRegular",
286
281
  display: "inline-flex",
287
282
  alignItems: "center",
288
283
  position: "relative",
@@ -293,21 +288,10 @@ const EditorButton = props => {
293
288
  "&:hover": {
294
289
  color: `${textColorHover || textColor || "#FFFFFF"}`,
295
290
  background: bgColorHover || bgColor || "rgb(30, 75, 122)",
296
- borderColor: borderColorHover || borderColor || "",
291
+ borderColor: borderColorHover || borderColor || "transparent",
297
292
  "& .element-toolbar": {
298
293
  display: "flex"
299
294
  }
300
- },
301
- color: textColor ? `${textColor} !important` : "#FFFFFF",
302
- fontSize: textSize ? `${textSize}px !important` : "inherit",
303
- fontFamily: fontFamily ? `${fontFamily} !important` : "PoppinsRegular",
304
- background: `${bgColor} !important`,
305
- borderColor: `${borderColor} !important`,
306
- borderRadius: {
307
- ...getBreakPointsValue(borderRadius || buttonTheme?.borderRadius || {}, null, "overrideBorderRadius", true)
308
- },
309
- padding: {
310
- ...getTRBLBreakPoints(bannerSpacing || buttonTheme?.bannerSpacing || {})
311
295
  }
312
296
  },
313
297
  ...buttonProps,
@@ -38,8 +38,7 @@ const CarouselItem = props => {
38
38
  className: "element-toolbar hr",
39
39
  style: {
40
40
  top: "0px",
41
- left: "0px",
42
- width: "fit-content"
41
+ left: "0px"
43
42
  },
44
43
  contentEditable: false,
45
44
  children: /*#__PURE__*/_jsx(Tooltip, {
@@ -1,15 +1,11 @@
1
1
  import React, { useState } from "react";
2
- import { Box, IconButton, Popover, Typography, useTheme } from "@mui/material";
2
+ import { Box, IconButton, Popover } from "@mui/material";
3
3
  import KeyboardArrowDownRoundedIcon from "@mui/icons-material/KeyboardArrowDownRounded";
4
4
  import Button from "../../common/Button";
5
5
  import { colors } from "./defaultColors";
6
6
  import ColorPicker from "./colorPicker.svg";
7
- import { useSlateStatic } from "slate-react";
8
- import { Transforms } from "slate";
9
- import { useEditorContext } from "../../hooks/useMouseMove";
10
7
  import { jsx as _jsx } from "react/jsx-runtime";
11
8
  import { jsxs as _jsxs } from "react/jsx-runtime";
12
- import { Fragment as _Fragment } from "react/jsx-runtime";
13
9
  let c = [];
14
10
  const ColorChunks = (recentColors = []) => [...recentColors, ...colors].reduce((a, b, i) => {
15
11
  if (i % 7 === 0) {
@@ -36,8 +32,8 @@ const SingleColorButton = ({
36
32
  width: "100%",
37
33
  display: "flex",
38
34
  alignItems: "center",
39
- padding: padding || "8px 0px"
40
- // justifyContent: "center",
35
+ padding: padding || "8px 0px",
36
+ justifyContent: "center"
41
37
  },
42
38
  children: [crs.map(m => /*#__PURE__*/_jsx(Button, {
43
39
  onClick: handleSelect(m),
@@ -114,18 +110,12 @@ const ColorButtons = props => {
114
110
  openColorTool,
115
111
  onClose,
116
112
  onColorPickerClick,
117
- disableEditTheme,
118
113
  defaultColors = []
119
114
  } = props;
120
115
  const [row1, ...restRows] = ColorChunks([]);
121
116
  const [anchorEl, setAnchorEl] = useState(null);
122
117
  const open = Boolean(anchorEl);
123
118
  const firstRow = defaultColors?.length ? defaultColors : row1;
124
- const theme = useTheme();
125
- const editor = useSlateStatic();
126
- const {
127
- setOpenTheme
128
- } = useEditorContext();
129
119
  const handleMore = e => {
130
120
  setAnchorEl(e.currentTarget);
131
121
  };
@@ -138,7 +128,6 @@ const ColorButtons = props => {
138
128
  const handleSelect = color => () => {
139
129
  onSelect(color);
140
130
  };
141
- const colorVars = theme?.vars?.colors || {};
142
131
  return /*#__PURE__*/_jsxs(Box, {
143
132
  component: "span",
144
133
  sx: classes.colorButtons,
@@ -155,7 +144,7 @@ const ColorButtons = props => {
155
144
  activeColor: activeColor
156
145
  }, `si_btn_row1_${m}_${i}`);
157
146
  })
158
- }), /*#__PURE__*/_jsx(Popover, {
147
+ }), /*#__PURE__*/_jsxs(Popover, {
159
148
  open: open || openColorTool,
160
149
  anchorEl: anchorEl || openColorTool,
161
150
  onClose: handleClose,
@@ -169,40 +158,9 @@ const ColorButtons = props => {
169
158
  },
170
159
  sx: classes.colorPopper,
171
160
  className: "colorPopper",
172
- children: /*#__PURE__*/_jsxs(Box, {
161
+ children: [/*#__PURE__*/_jsx(Box, {
173
162
  sx: classes.colorButtonsInner,
174
- children: [Object.values(colorVars)?.length ? /*#__PURE__*/_jsxs(_Fragment, {
175
- children: [/*#__PURE__*/_jsxs(Box, {
176
- component: "div",
177
- className: "singleColorTitleWrapper",
178
- children: [/*#__PURE__*/_jsx(Typography, {
179
- variant: "subtitle2",
180
- children: "Theme colours"
181
- }), disableEditTheme ? null : /*#__PURE__*/_jsx("div", {
182
- className: "editBtn",
183
- onClick: () => {
184
- Transforms.deselect(editor, {
185
- at: editor.selection
186
- });
187
- handleClose();
188
- setOpenTheme("editThemeColor");
189
- },
190
- children: "Edit"
191
- })]
192
- }), /*#__PURE__*/_jsx(SingleColorButton, {
193
- crs: Object.values(colorVars),
194
- handleSelect: handleSelect,
195
- classes: classes,
196
- activeColor: activeColor
197
- })]
198
- }) : null, /*#__PURE__*/_jsx(Box, {
199
- component: "div",
200
- className: "singleColorTitleWrapper",
201
- children: /*#__PURE__*/_jsx(Typography, {
202
- variant: "subtitle2",
203
- children: "Custom colour"
204
- })
205
- }), restRows.map((m, i) => {
163
+ children: restRows.map((m, i) => {
206
164
  return /*#__PURE__*/_jsx(SingleColorButton, {
207
165
  id: `p2_${id}`,
208
166
  crs: m,
@@ -211,19 +169,14 @@ const ColorButtons = props => {
211
169
  classes: classes,
212
170
  activeColor: activeColor
213
171
  }, `si_btn_${m}_${i}`);
214
- }), forMiniTool ? /*#__PURE__*/_jsx(IconButton, {
215
- onClick: onColorPickerClick,
216
- style: {
217
- alignSelf: "start",
218
- margin: "6px",
219
- padding: "0px"
220
- },
221
- children: /*#__PURE__*/_jsx("img", {
222
- src: ColorPicker,
223
- alt: "color wheel"
224
- })
225
- }) : null]
226
- })
172
+ })
173
+ }), forMiniTool ? /*#__PURE__*/_jsx(IconButton, {
174
+ onClick: onColorPickerClick,
175
+ children: /*#__PURE__*/_jsx("img", {
176
+ src: ColorPicker,
177
+ alt: "color wheel"
178
+ })
179
+ }) : null]
227
180
  })]
228
181
  });
229
182
  };
@@ -60,28 +60,4 @@
60
60
  padding: 0 15px !important;
61
61
  width: 60px !important;
62
62
  flex-shrink: 0;
63
- }
64
-
65
-
66
- .singleColorTitleWrapper {
67
- display: flex;
68
- justify-content: space-between;
69
- align-items: center;
70
- padding: 10px;
71
- width: 100%;
72
- border-bottom: 1px solid #DCE4EC;
73
- }
74
-
75
- .singleColorTitleWrapper .MuiTypography-root {
76
- font-weight: 600;
77
- }
78
-
79
- .singleColorTitleWrapper .editBtn {
80
- text-transform: none;
81
- color: #2563EB;
82
- text-decoration: underline;
83
- padding: 0px;
84
- min-width: unset;
85
- cursor: pointer;
86
- font-size: 14px;
87
- }
63
+ }
@@ -1,14 +1,13 @@
1
1
  import React, { useState } from "react";
2
2
  import { ReactEditor } from "slate-react";
3
- import { IconButton, Tooltip, Box, Popover, useTheme } from "@mui/material";
3
+ import ColorPickerTool from "react-gcolor-picker";
4
+ import { IconButton, Tooltip, Box, Popover } from "@mui/material";
4
5
  import { addMarkData, activeMark } from "../../utils/SlateUtilityFunctions";
5
6
  import ColorButtons from "./ColorButtons";
6
7
  import ColorPickerStyles from "./Styles";
7
8
  import colorWheel from "./colorWheel.png";
8
9
  import "./ColorPicker.css";
9
10
  import { useEditorContext } from "../../hooks/useMouseMove";
10
- import CustomColorPicker from "../../common/CustomColorPicker";
11
- import { getSelectedElementColor } from "../../utils/helper";
12
11
  import { jsx as _jsx } from "react/jsx-runtime";
13
12
  import { Fragment as _Fragment } from "react/jsx-runtime";
14
13
  import { jsxs as _jsxs } from "react/jsx-runtime";
@@ -26,8 +25,7 @@ const ColorPicker = props => {
26
25
  classes,
27
26
  forMiniTool,
28
27
  openColorTool,
29
- closeColorTool,
30
- type
28
+ closeColorTool
31
29
  } = props;
32
30
  const {
33
31
  theme
@@ -36,7 +34,6 @@ const ColorPicker = props => {
36
34
  const [anchorEl, setAnchorEl] = useState(null);
37
35
  const open = Boolean(anchorEl);
38
36
  const pickerStyles = ColorPickerStyles(theme);
39
- const muiTheme = useTheme();
40
37
  const onOpen = e => {
41
38
  e.preventDefault();
42
39
  setAnchorEl(e.currentTarget);
@@ -61,7 +58,7 @@ const ColorPicker = props => {
61
58
  setAnchorEl(null);
62
59
  setSelection(null);
63
60
  };
64
- const activeColor = type === "textColor" ? getSelectedElementColor(editor, format, muiTheme) : activeMark(editor, format) || DEFAULT_COLOR[format];
61
+ const activeColor = activeMark(editor, format) || DEFAULT_COLOR[format];
65
62
  return /*#__PURE__*/_jsxs(_Fragment, {
66
63
  children: [forMiniTool ? null : /*#__PURE__*/_jsx(Tooltip, {
67
64
  title: title,
@@ -99,10 +96,10 @@ const ColorPicker = props => {
99
96
  horizontal: "top"
100
97
  },
101
98
  sx: classes.colorPickerPopup,
102
- children: /*#__PURE__*/_jsx(CustomColorPicker, {
99
+ children: /*#__PURE__*/_jsx(ColorPickerTool, {
103
100
  gradient: true,
104
- onChange: handleFormSubmit,
105
- color: activeColor
101
+ value: activeColor,
102
+ onChange: handleFormSubmit
106
103
  })
107
104
  })]
108
105
  });
@@ -20,26 +20,24 @@ const ColorPickerStyles = theme => ({
20
20
  background: `${theme?.palette?.editor?.miniToolBarBackground}`,
21
21
  border: `1px solid ${theme?.palette?.editor?.miniToolBarBorder} !important`,
22
22
  borderRadius: "7px !important",
23
- padding: "0px 10px",
24
- "@media only screen and (max-width: 600px)": {
23
+ padding: "0px 5px",
24
+ '@media only screen and (max-width: 600px)': {
25
25
  marginTop: "-40px"
26
26
  }
27
27
  }
28
28
  },
29
29
  colorButtonSingle: {
30
- border: "1.5px solid #DCE4EC !important",
31
30
  "&.active": {
32
- // "&:before": {
33
- // content: '" "',
34
- // position: "absolute",
35
- // top: "-4px",
36
- // left: "-4px",
37
- // width: "calc(100% + 8px)",
38
- // height: "calc(100% + 8px)",
39
- // border: "2px solid #2563EB",
40
- // borderRadius: "50%",
41
- // },
42
- outline: "2px solid #2563EB"
31
+ "&:before": {
32
+ content: '" "',
33
+ position: "absolute",
34
+ top: "-4px",
35
+ left: "-4px",
36
+ width: "calc(100% + 8px)",
37
+ height: "calc(100% + 8px)",
38
+ border: "2px solid #2563EB",
39
+ borderRadius: "50%"
40
+ }
43
41
  }
44
42
  },
45
43
  colorButtonsInner: {
@@ -61,7 +59,7 @@ const ColorPickerStyles = theme => ({
61
59
  width: "24px",
62
60
  height: "24px",
63
61
  margin: "0px 4px",
64
- border: "1.5px solid #DCE4EC"
62
+ border: "unset"
65
63
  }
66
64
  },
67
65
  colorPickerIcon: {
@@ -14,8 +14,7 @@ const ColumnView = props => {
14
14
  property,
15
15
  onSelect,
16
16
  selected,
17
- readOnly,
18
- translation
17
+ readOnly
19
18
  } = props;
20
19
  const {
21
20
  type
@@ -61,8 +60,7 @@ const ColumnView = props => {
61
60
  readOnly: readOnly,
62
61
  settings: {
63
62
  wrapColumn: property?.wrapColumn
64
- },
65
- translation: translation
63
+ }
66
64
  }), needAnchor && !readOnly ? /*#__PURE__*/_jsx(Popper, {
67
65
  sx: classes.root,
68
66
  open: open,
@@ -1,6 +1,6 @@
1
1
  import React from "react";
2
2
  import { useDataView } from "../../Providers/DataViewProvider";
3
- import SelectV1 from "./Components/SelectV1";
3
+ import Select from "./Components/Select";
4
4
  import { jsx as _jsx } from "react/jsx-runtime";
5
5
  const MultiSelectType = props => {
6
6
  const {
@@ -10,50 +10,35 @@ const MultiSelectType = props => {
10
10
  options,
11
11
  label = "",
12
12
  readOnly,
13
- settings,
14
- translation
13
+ settings
15
14
  } = props;
16
- const {
17
- onChange,
18
- onUpdateProperty
19
- } = useDataView();
20
15
  const {
21
16
  wrapColumn
22
17
  } = settings;
18
+ const {
19
+ onChange
20
+ } = useDataView();
23
21
  const value = Array.isArray(pValue) ? pValue : [];
24
22
  const coloredValues = [...(value || [])]?.map(m => {
25
23
  return {
26
24
  ...m,
27
- color: (options || []).find(f => f?.value === m?.value || f?.id === m?.id)?.color || "#FFF"
25
+ color: options?.find(f => f.value === m.value)?.color || "#FFF"
28
26
  };
29
27
  });
30
28
  const handleChange = data => {
31
29
  onChange(rowIndex, {
32
- [property]: data?.filter(f => f?.id)
30
+ [property]: data?.filter(f => f?.value)
33
31
  });
34
32
  };
35
- const handleUpdate = data => {
36
- const updateData = {
37
- label: "Multi Select",
38
- visible: true,
39
- key: property,
40
- type: "multi-select",
41
- options: data
42
- };
43
- onUpdateProperty(updateData);
44
- };
45
- return /*#__PURE__*/_jsx(SelectV1, {
33
+ return /*#__PURE__*/_jsx(Select, {
34
+ className: `wrap-${wrapColumn}`,
46
35
  value: coloredValues,
47
36
  onChange: handleChange,
48
- onUpdate: handleUpdate,
49
37
  options: options,
50
- selectMultiple: true,
38
+ multiple: true,
51
39
  limitTags: 2,
52
40
  placeholder: label,
53
- disabled: readOnly,
54
- property: property,
55
- wrapColumn: wrapColumn,
56
- translation: translation
41
+ disabled: readOnly
57
42
  });
58
43
  };
59
44
  export default MultiSelectType;