@flozy/editor 10.1.2 → 10.1.4

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 (146) hide show
  1. package/dist/Editor/ChatEditor.js +16 -17
  2. package/dist/Editor/CommonEditor.js +15 -115
  3. package/dist/Editor/DialogWrapper.js +25 -31
  4. package/dist/Editor/Editor.css +8 -16
  5. package/dist/Editor/Elements/AI/PopoverAIInput.js +3 -11
  6. package/dist/Editor/Elements/AppHeader/AppHeader.js +3 -3
  7. package/dist/Editor/Elements/Button/EditorButton.js +9 -25
  8. package/dist/Editor/Elements/Color Picker/ColorButtons.js +14 -61
  9. package/dist/Editor/Elements/Color Picker/ColorPicker.css +1 -25
  10. package/dist/Editor/Elements/Color Picker/ColorPicker.js +7 -10
  11. package/dist/Editor/Elements/Color Picker/Styles.js +13 -15
  12. package/dist/Editor/Elements/DataView/Layouts/ColumnView.js +2 -4
  13. package/dist/Editor/Elements/DataView/Layouts/DataTypes/MultiSelectType.js +6 -21
  14. package/dist/Editor/Elements/DataView/Layouts/Options/AddOptions.js +1 -5
  15. package/dist/Editor/Elements/DataView/Layouts/Options/EditOption.js +2 -3
  16. package/dist/Editor/Elements/DataView/Layouts/Options/index.js +0 -11
  17. package/dist/Editor/Elements/DataView/Layouts/ViewData.js +4 -8
  18. package/dist/Editor/Elements/Embed/Image.js +2 -3
  19. package/dist/Editor/Elements/Embed/Video.js +1 -1
  20. package/dist/Editor/Elements/EmbedScript/Code.js +2 -14
  21. package/dist/Editor/Elements/EmbedScript/EmbedScriptPopup.js +28 -57
  22. package/dist/Editor/Elements/Form/Form.js +168 -179
  23. package/dist/Editor/Elements/Form/FormField.js +4 -10
  24. package/dist/Editor/Elements/Form/Workflow/Styles.js +22 -24
  25. package/dist/Editor/Elements/FreeGrid/FreeGrid.js +24 -6
  26. package/dist/Editor/Elements/FreeGrid/FreeGridBox.js +4 -7
  27. package/dist/Editor/Elements/FreeGrid/Options/More.js +8 -8
  28. package/dist/Editor/Elements/FreeGrid/styles.js +7 -67
  29. package/dist/Editor/Elements/Grid/GridItem.js +1 -1
  30. package/dist/Editor/Elements/List/CheckList.js +1 -4
  31. package/dist/Editor/Elements/Search/SearchAttachment.js +9 -40
  32. package/dist/Editor/Elements/Search/SearchButton.js +8 -9
  33. package/dist/Editor/Elements/Search/SearchList.js +7 -9
  34. package/dist/Editor/Elements/SimpleText/index.js +1 -6
  35. package/dist/Editor/Elements/SimpleText/style.js +2 -2
  36. package/dist/Editor/Elements/Table/Table.js +3 -3
  37. package/dist/Editor/Elements/Title/title.js +6 -6
  38. package/dist/Editor/Elements/Variables/VariableButton.js +1 -10
  39. package/dist/Editor/MiniEditor.js +1 -2
  40. package/dist/Editor/Styles/EditorStyles.js +5 -5
  41. package/dist/Editor/Toolbar/FormatTools/Dropdown.js +3 -27
  42. package/dist/Editor/Toolbar/FormatTools/FontFamilyAutocomplete.js +3 -4
  43. package/dist/Editor/Toolbar/FormatTools/MarkButton.js +2 -2
  44. package/dist/Editor/Toolbar/FormatTools/TextSize.js +13 -10
  45. package/dist/Editor/Toolbar/Mini/MiniToolbar.js +1 -2
  46. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/MiniColorPicker.js +2 -4
  47. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectFontSize.js +13 -6
  48. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectTypography.js +42 -167
  49. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/index.js +4 -7
  50. package/dist/Editor/Toolbar/PopupTool/PopperHeader.js +1 -2
  51. package/dist/Editor/Toolbar/PopupTool/PopupToolStyle.js +12 -72
  52. package/dist/Editor/Toolbar/PopupTool/TextFormat.js +27 -100
  53. package/dist/Editor/Toolbar/PopupTool/index.js +1 -1
  54. package/dist/Editor/Toolbar/toolbarGroups.js +6 -48
  55. package/dist/Editor/assets/svg/SettingsIcon.js +0 -1
  56. package/dist/Editor/common/ColorPickerButton.js +17 -39
  57. package/dist/Editor/common/DnD/DragHandleButton.js +1 -1
  58. package/dist/Editor/common/FontLoader/FontLoader.js +0 -3
  59. package/dist/Editor/common/Icon.js +1 -31
  60. package/dist/Editor/common/ImageSelector/Styles.js +9 -3
  61. package/dist/Editor/common/LinkSettings/NavComponents.js +8 -34
  62. package/dist/Editor/common/LinkSettings/index.js +68 -84
  63. package/dist/Editor/common/LinkSettings/style.js +30 -245
  64. package/dist/Editor/common/RnD/ElementOptions/Actions.js +14 -13
  65. package/dist/Editor/common/RnD/ElementOptions/Icons/LinkIcon.js +0 -1
  66. package/dist/Editor/common/RnD/ElementOptions/index.js +2 -2
  67. package/dist/Editor/common/RnD/ElementOptions/styles.js +1 -28
  68. package/dist/Editor/common/RnD/ElementSettings/OtherSettings/Settings.js +5 -6
  69. package/dist/Editor/common/RnD/ElementSettings/Settings/AppHeaderSettings.js +2 -3
  70. package/dist/Editor/common/RnD/ElementSettings/Settings/BoxSettings.js +2 -3
  71. package/dist/Editor/common/RnD/ElementSettings/Settings/ButtonSettings.js +2 -3
  72. package/dist/Editor/common/RnD/ElementSettings/Settings/CodeSettings.js +2 -3
  73. package/dist/Editor/common/RnD/ElementSettings/Settings/FormSettings.js +2 -4
  74. package/dist/Editor/common/RnD/ElementSettings/Settings/ImageSettings.js +2 -3
  75. package/dist/Editor/common/RnD/ElementSettings/Settings/TableSettings.js +2 -3
  76. package/dist/Editor/common/RnD/ElementSettings/Settings/TextSettings.js +1 -3
  77. package/dist/Editor/common/RnD/ElementSettings/Settings/VideoSettings.js +2 -3
  78. package/dist/Editor/common/RnD/ElementSettings/styles.js +12 -147
  79. package/dist/Editor/common/RnD/OptionsPopup/index.js +5 -8
  80. package/dist/Editor/common/RnD/OptionsPopup/style.js +19 -121
  81. package/dist/Editor/common/RnD/SwitchViewport/SwitchViewport.js +5 -8
  82. package/dist/Editor/common/RnD/Theme/ViewportStimulator.js +3 -6
  83. package/dist/Editor/common/RnD/Utils/gridDropItem.js +2 -1
  84. package/dist/Editor/common/RnD/index.js +6 -5
  85. package/dist/Editor/common/Select/index.js +0 -2
  86. package/dist/Editor/common/Shorthands/elements.js +0 -54
  87. package/dist/Editor/common/StyleBuilder/buttonStyle.js +2 -4
  88. package/dist/Editor/common/StyleBuilder/fieldTypes/backgroundImage.js +0 -5
  89. package/dist/Editor/common/StyleBuilder/fieldTypes/bannerSpacing.js +2 -12
  90. package/dist/Editor/common/StyleBuilder/fieldTypes/borderRadius.js +7 -15
  91. package/dist/Editor/common/StyleBuilder/fieldTypes/card.js +8 -16
  92. package/dist/Editor/common/StyleBuilder/fieldTypes/color.js +10 -36
  93. package/dist/Editor/common/StyleBuilder/fieldTypes/fontSize.js +7 -16
  94. package/dist/Editor/common/StyleBuilder/fieldTypes/lineSpacing.js +6 -7
  95. package/dist/Editor/common/StyleBuilder/fieldTypes/menusArray.js +6 -13
  96. package/dist/Editor/common/StyleBuilder/fieldTypes/textOptions.js +7 -15
  97. package/dist/Editor/common/StyleBuilder/pageSettingsStyle.js +7 -5
  98. package/dist/Editor/common/Uploader.js +0 -8
  99. package/dist/Editor/common/iconListV2.js +6 -101
  100. package/dist/Editor/common/iconslist.js +0 -24
  101. package/dist/Editor/commonStyle.js +61 -174
  102. package/dist/Editor/helper/theme.js +2 -203
  103. package/dist/Editor/hooks/useMouseMove.js +5 -8
  104. package/dist/Editor/plugins/withEmbeds.js +1 -1
  105. package/dist/Editor/plugins/withHTML.js +1 -3
  106. package/dist/Editor/plugins/withTable.js +1 -1
  107. package/dist/Editor/theme/ThemeList.js +173 -50
  108. package/dist/Editor/utils/SlateUtilityFunctions.js +43 -166
  109. package/dist/Editor/utils/button.js +17 -1
  110. package/dist/Editor/utils/draftToSlate.js +2 -3
  111. package/dist/Editor/utils/font.js +37 -40
  112. package/dist/Editor/utils/helper.js +19 -90
  113. package/package.json +4 -4
  114. package/dist/Editor/Elements/DataView/Layouts/DataTypes/Components/MultiSelect.js +0 -454
  115. package/dist/Editor/Elements/EmbedScript/styles.js +0 -89
  116. package/dist/Editor/Toolbar/PopupTool/ThemeTextFormat.js +0 -439
  117. package/dist/Editor/assets/svg/BackIcon.js +0 -18
  118. package/dist/Editor/assets/svg/ClearAllRounded.js +0 -31
  119. package/dist/Editor/assets/svg/ResetIconNew.js +0 -23
  120. package/dist/Editor/assets/svg/ThemeIcons.js +0 -293
  121. package/dist/Editor/common/CustomColorPicker/index.js +0 -130
  122. package/dist/Editor/common/CustomColorPicker/style.js +0 -53
  123. package/dist/Editor/common/CustomDialog2/index.js +0 -94
  124. package/dist/Editor/common/CustomDialog2/style.js +0 -67
  125. package/dist/Editor/common/CustomSelect.js +0 -43
  126. package/dist/Editor/common/RnD/Theme/MainThemeProvider.js +0 -17
  127. package/dist/Editor/common/SnackBar/index.js +0 -43
  128. package/dist/Editor/helper/textIndeces.js +0 -58
  129. package/dist/Editor/hooks/useEditorTheme.js +0 -153
  130. package/dist/Editor/hooks/useThemeValues.js +0 -63
  131. package/dist/Editor/theme/index.js +0 -149
  132. package/dist/Editor/themeSettings/ActiveTheme.js +0 -72
  133. package/dist/Editor/themeSettings/buttons/index.js +0 -290
  134. package/dist/Editor/themeSettings/buttons/style.js +0 -23
  135. package/dist/Editor/themeSettings/colorTheme/index.js +0 -309
  136. package/dist/Editor/themeSettings/colorTheme/style.js +0 -81
  137. package/dist/Editor/themeSettings/fonts/PreviewElement.js +0 -121
  138. package/dist/Editor/themeSettings/fonts/index.js +0 -240
  139. package/dist/Editor/themeSettings/fonts/style.js +0 -62
  140. package/dist/Editor/themeSettings/icons.js +0 -60
  141. package/dist/Editor/themeSettings/index.js +0 -361
  142. package/dist/Editor/themeSettings/style.js +0 -292
  143. package/dist/Editor/themeSettingsAI/icons.js +0 -96
  144. package/dist/Editor/themeSettingsAI/index.js +0 -355
  145. package/dist/Editor/themeSettingsAI/saveTheme.js +0 -202
  146. package/dist/Editor/themeSettingsAI/style.js +0 -324
@@ -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 MultiSelectWithPopover from "./Components/MultiSelect";
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,15 +10,13 @@ const MultiSelectType = props => {
10
10
  options,
11
11
  label = "",
12
12
  readOnly,
13
- settings,
14
- translation
13
+ settings
15
14
  } = props;
16
15
  const {
17
16
  wrapColumn
18
17
  } = settings;
19
18
  const {
20
- onChange,
21
- onUpdateProperty
19
+ onChange
22
20
  } = useDataView();
23
21
  const value = Array.isArray(pValue) ? pValue : [];
24
22
  const coloredValues = [...(value || [])]?.map(m => {
@@ -32,28 +30,15 @@ const MultiSelectType = props => {
32
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(MultiSelectWithPopover, {
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
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;
@@ -4,11 +4,7 @@ import { colors } from "../../../Color Picker/defaultColors";
4
4
  import Icon from "../../../../common/Icon";
5
5
  import { jsx as _jsx } from "react/jsx-runtime";
6
6
  import { jsxs as _jsxs } from "react/jsx-runtime";
7
- const EXCLUDED_COLORS = new Set(["#000000", "#0F172A", "#2563EB", "#FFFFFF", "#64748B"]);
8
- const DEFAULT_COLORS = colors?.filter(f => !f?.includes("linear") && !EXCLUDED_COLORS?.has(f));
9
-
10
- // const DEFAULT_COLORS = colors?.filter((f) => !(f.includes("linear") || f === "#000000"));
11
-
7
+ const DEFAULT_COLORS = colors?.filter(f => !(f.includes("linear") || f === "#000000"));
12
8
  const AddOptions = props => {
13
9
  const {
14
10
  edit,
@@ -30,7 +30,6 @@ const EditOption = props => {
30
30
  } = edit;
31
31
  const selectedOption = edit?.options[optionIndex] || {};
32
32
  const pickerStyles = ColorPickerStyles(theme);
33
- const hideBackButton = edit?.hideBackButton || false;
34
33
  useEffect(() => {
35
34
  return () => {
36
35
  // on un-mount update the option change
@@ -105,14 +104,14 @@ const EditOption = props => {
105
104
  children: [/*#__PURE__*/_jsxs(Box, {
106
105
  className: "fe-dv-ap-title",
107
106
  children: [/*#__PURE__*/_jsxs("span", {
108
- children: [!hideBackButton ? /*#__PURE__*/_jsx(IconButton, {
107
+ children: [/*#__PURE__*/_jsx(IconButton, {
109
108
  className: "tv-act-ico",
110
109
  size: "small",
111
110
  onClick: onBack,
112
111
  children: /*#__PURE__*/_jsx(Icon, {
113
112
  icon: 'leftArrow'
114
113
  })
115
- }) : null, translation("Edit Option")]
114
+ }), translation("Edit Option")]
116
115
  }), /*#__PURE__*/_jsx(IconButton, {
117
116
  className: "tv-act-ico bg br1",
118
117
  size: "small",
@@ -29,16 +29,6 @@ const POSITIONS = {
29
29
  vertical: "top",
30
30
  horizontal: "right"
31
31
  }
32
- },
33
- editOptionMulti: {
34
- anchorOrigin: {
35
- vertical: "top",
36
- horizontal: "left"
37
- },
38
- transformOrigin: {
39
- vertical: "top",
40
- horizontal: "left"
41
- }
42
32
  }
43
33
  };
44
34
  const PropertySettings = props => {
@@ -92,7 +82,6 @@ const PropertySettings = props => {
92
82
  translation: translation
93
83
  });
94
84
  case "editOption":
95
- case "editOptionMulti":
96
85
  return /*#__PURE__*/_jsx(EditOption, {
97
86
  classes: classes,
98
87
  onClose: onClose,
@@ -11,8 +11,7 @@ const RenderRow = props => {
11
11
  properties,
12
12
  onSelect,
13
13
  selected,
14
- readOnly,
15
- translation
14
+ readOnly
16
15
  } = props;
17
16
  const showProperties = properties?.filter(f => f.visible);
18
17
  return showProperties?.map((property, i) => {
@@ -23,8 +22,7 @@ const RenderRow = props => {
23
22
  property: property,
24
23
  onSelect: onSelect,
25
24
  selected: selected,
26
- readOnly: readOnly,
27
- translation: translation
25
+ readOnly: readOnly
28
26
  }, `${property.key}_${i}`);
29
27
  });
30
28
  };
@@ -35,8 +33,7 @@ const ViewData = props => {
35
33
  customProps
36
34
  } = props;
37
35
  const {
38
- readOnly,
39
- translation
36
+ readOnly
40
37
  } = customProps || {};
41
38
  const {
42
39
  properties,
@@ -70,8 +67,7 @@ const ViewData = props => {
70
67
  properties: properties,
71
68
  onSelect: onSelect,
72
69
  selected: selectedRows?.includes(row?.id),
73
- readOnly: readOnly,
74
- translation: translation
70
+ readOnly: readOnly
75
71
  }), /*#__PURE__*/_jsx("td", {}), /*#__PURE__*/_jsx("td", {})]
76
72
  }, i);
77
73
  }), /*#__PURE__*/_jsx("tr", {
@@ -4,7 +4,7 @@ import { Node, Transforms, Editor } from "slate";
4
4
  import AspectRatioIcon from "@mui/icons-material/AspectRatio";
5
5
  import useResize from "../../utils/customHooks/useResize";
6
6
  import EmbedPopup from "./EmbedPopup";
7
- import { IconButton, Tooltip, Box, useTheme, useMediaQuery } from "@mui/material";
7
+ import { IconButton, Tooltip, Box, useTheme } from "@mui/material";
8
8
  import { LinkIcon } from "../../common/iconslist";
9
9
  import { useEditorContext } from "../../hooks/useMouseMove";
10
10
  import { getTRBLBreakPoints, getBreakPointsValue, groupByBreakpoint } from "../../helper/theme";
@@ -200,7 +200,6 @@ const Image = props => {
200
200
  theme: appTheme
201
201
  } = useEditorContext();
202
202
  const classes = useCommonStyle(appTheme);
203
- const isMobile = useMediaQuery("(max-width:599px)");
204
203
  const handleImageClick = () => {
205
204
  try {
206
205
  Transforms.select(editor, {
@@ -281,7 +280,7 @@ const Image = props => {
281
280
  sx: {
282
281
  display: {
283
282
  lg: "flex",
284
- xs: xsHidden && isMobile ? "none" : "flex"
283
+ xs: xsHidden ? "none" : "flex"
285
284
  },
286
285
  width: `100%`,
287
286
  maxWidth: "100%",
@@ -89,7 +89,7 @@ const VideoPlaceholder = props => {
89
89
  },
90
90
  children: [/*#__PURE__*/_jsx(Icon, {
91
91
  icon: "video"
92
- }), translation(TYPE_LABELS[type] || "Embed Video or Other")]
92
+ }), TYPE_LABELS[type] || translation("Embed Video or Other")]
93
93
  }) : /*#__PURE__*/_jsxs(Box, {
94
94
  sx: {
95
95
  color: "#64748B !important",
@@ -5,7 +5,6 @@ import { IconButton, Tooltip } from "@mui/material";
5
5
  import { DeleteIcon } from "../../assets/svg/AIIcons";
6
6
  import { ReactEditor, useSlateStatic } from "slate-react";
7
7
  import { Transforms } from "slate";
8
- import { CodeElementIcon } from "../../common/iconListV2";
9
8
 
10
9
  // const sanitize = (input) => {
11
10
  // const doc = new DOMParser().parseFromString(input, "text/html");
@@ -19,7 +18,6 @@ import { CodeElementIcon } from "../../common/iconListV2";
19
18
  // return doc.body.innerHTML;
20
19
  // };
21
20
  import { jsx as _jsx } from "react/jsx-runtime";
22
- import { jsxs as _jsxs } from "react/jsx-runtime";
23
21
  import { createElement as _createElement } from "react";
24
22
  const getCode = (embedData, isEncoded) => {
25
23
  if (isEncoded) {
@@ -63,7 +61,6 @@ const Code = props => {
63
61
  } = customProps;
64
62
  const editor = useSlateStatic();
65
63
  const path = ReactEditor.findPath(editor, element);
66
- const hasCode = embedData && getCode(embedData, isEncoded);
67
64
  const onDelete = () => {
68
65
  Transforms.removeNodes(editor, {
69
66
  at: path
@@ -88,20 +85,11 @@ const Code = props => {
88
85
  }
89
86
  }, [embedData]);
90
87
  return /*#__PURE__*/_createElement("div", {
91
- className: `embed-code has-hover ${hasCode ? "has-code" : ""}`,
88
+ className: "embed-code has-hover",
92
89
  contentEditable: false,
93
90
  ...attributes,
94
91
  key: element?.updatedOn
95
- }, !hasCode && /*#__PURE__*/_jsxs("div", {
96
- className: "empty-code",
97
- children: [/*#__PURE__*/_jsx("span", {
98
- className: "code-icon",
99
- children: /*#__PURE__*/_jsx(CodeElementIcon, {})
100
- }), /*#__PURE__*/_jsx("span", {
101
- className: "code-name",
102
- children: translation("Embed Code")
103
- })]
104
- }), /*#__PURE__*/_jsx("div", {
92
+ }, /*#__PURE__*/_jsx("div", {
105
93
  ref: codeRef
106
94
  }), children, !readOnly && /*#__PURE__*/_jsx(ToolBar, {
107
95
  onDelete: onDelete,
@@ -1,10 +1,7 @@
1
1
  import React, { useEffect, useState } from "react";
2
- import { Box, Button, Dialog, DialogActions, DialogContent, DialogTitle, Divider, IconButton, Tooltip, Typography } from "@mui/material";
2
+ import { Box, Button, Dialog, DialogActions, DialogContent, DialogTitle, Tooltip } from "@mui/material";
3
3
  import { insertEmbedScript, updateEmbedScript } from "../../utils/embedScript";
4
4
  import InfoOutlinedIcon from "@mui/icons-material/InfoOutlined";
5
- import { useEditorContext } from "../../hooks/useMouseMove";
6
- import Styles from "./styles";
7
- import CloseRoundedIcon from "@mui/icons-material/CloseRounded";
8
5
  import { jsx as _jsx } from "react/jsx-runtime";
9
6
  import { jsxs as _jsxs } from "react/jsx-runtime";
10
7
  import { Fragment as _Fragment } from "react/jsx-runtime";
@@ -23,10 +20,6 @@ const EmbedScriptPopup = props => {
23
20
  error: false
24
21
  });
25
22
  const [allowedDomains, setAllowedDomains] = useState([]);
26
- const {
27
- theme
28
- } = useEditorContext();
29
- const classes = Styles(theme);
30
23
  const {
31
24
  loading,
32
25
  error
@@ -76,70 +69,50 @@ const EmbedScriptPopup = props => {
76
69
  }
77
70
  onClose();
78
71
  };
79
- const handleClear = () => {
80
- setCode("");
81
- };
82
72
  return /*#__PURE__*/_jsx(_Fragment, {
83
73
  children: /*#__PURE__*/_jsxs(Dialog, {
84
74
  open: open,
85
75
  fullWidth: true,
86
- sx: classes.root,
87
76
  children: [/*#__PURE__*/_jsx(DialogTitle, {
88
77
  children: /*#__PURE__*/_jsxs(Box, {
89
78
  component: "div",
90
79
  sx: {
91
80
  display: "flex",
92
81
  alignItems: "center",
93
- justifyContent: "space-between",
94
- width: "100%"
82
+ gap: "6px"
95
83
  },
96
- children: [/*#__PURE__*/_jsxs(Box, {
97
- sx: {
98
- display: "flex",
99
- alignItems: "center",
100
- gap: "6px"
101
- },
102
- children: [/*#__PURE__*/_jsx(Typography, {
103
- className: "title",
104
- variant: "h6",
105
- children: translation("Embed Code")
106
- }), allowedDomains?.length ? /*#__PURE__*/_jsx(Tooltip, {
107
- title: /*#__PURE__*/_jsxs(Box, {
108
- sx: {
109
- textTransform: "none"
84
+ children: [translation("Embed Code"), allowedDomains?.length ? /*#__PURE__*/_jsx(Tooltip, {
85
+ title: /*#__PURE__*/_jsxs(Box, {
86
+ sx: {
87
+ textTransform: "none"
88
+ },
89
+ children: [/*#__PURE__*/_jsx("span", {
90
+ style: {
91
+ fontWeight: "bold"
110
92
  },
111
- children: [/*#__PURE__*/_jsx("span", {
112
- style: {
113
- fontWeight: "bold"
114
- },
115
- children: translation("Allowed Domains")
116
- }), /*#__PURE__*/_jsx("br", {}), allowedDomains.join(", ")]
117
- }),
118
- children: /*#__PURE__*/_jsx(InfoOutlinedIcon, {
119
- sx: {
120
- fill: "#94A3B8",
121
- cursor: "pointer",
122
- fontSize: "18px"
123
- }
124
- })
125
- }) : null]
126
- }), /*#__PURE__*/_jsx(IconButton, {
127
- className: "close-popupbtn",
128
- onClick: onClose,
129
- children: /*#__PURE__*/_jsx(CloseRoundedIcon, {})
130
- })]
93
+ children: translation("Allowed Domains")
94
+ }), /*#__PURE__*/_jsx("br", {}), allowedDomains.join(", ")]
95
+ }),
96
+ children: /*#__PURE__*/_jsx(InfoOutlinedIcon, {
97
+ color: "gray",
98
+ fontSize: "14px",
99
+ style: {
100
+ fill: "#94A3B8",
101
+ cursor: "pointer"
102
+ }
103
+ })
104
+ }) : null]
131
105
  })
132
- }), /*#__PURE__*/_jsx(Divider, {
133
- className: "divider"
134
106
  }), /*#__PURE__*/_jsxs(DialogContent, {
135
107
  children: [/*#__PURE__*/_jsx("textarea", {
136
108
  value: code,
137
109
  onChange: handleChange,
138
110
  style: {
139
- minHeight: "260px",
111
+ minHeight: "200px",
140
112
  width: "100%",
141
113
  resize: "none",
142
- padding: "4px"
114
+ padding: "4px",
115
+ boxSizing: "border-box"
143
116
  }
144
117
  }), /*#__PURE__*/_jsx(Box, {
145
118
  component: "div",
@@ -148,14 +121,12 @@ const EmbedScriptPopup = props => {
148
121
  })]
149
122
  }), /*#__PURE__*/_jsxs(DialogActions, {
150
123
  children: [/*#__PURE__*/_jsx(Button, {
151
- onClick: handleClear,
152
- className: "clear-btn",
153
- children: translation("Clear")
154
- }), /*#__PURE__*/_jsx(Button, {
155
124
  onClick: onSubmit,
156
125
  disabled: loading,
157
- className: "save-btn",
158
126
  children: loading ? translation("Validating") : translation("Save")
127
+ }), /*#__PURE__*/_jsx(Button, {
128
+ onClick: onClose,
129
+ children: translation("Cancel")
159
130
  })]
160
131
  })]
161
132
  })