@flozy/editor 10.4.0 → 10.4.2

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 (190) hide show
  1. package/dist/Editor/ChatEditor.js +17 -16
  2. package/dist/Editor/CommonEditor.js +134 -18
  3. package/dist/Editor/DialogWrapper.js +31 -25
  4. package/dist/Editor/Editor.css +46 -8
  5. package/dist/Editor/Elements/AI/PopoverAIInput.js +11 -3
  6. package/dist/Editor/Elements/Accordion/Accordion.js +46 -9
  7. package/dist/Editor/Elements/Accordion/AccordionSummary.js +1 -23
  8. package/dist/Editor/Elements/AppHeader/AppHeader.js +10 -5
  9. package/dist/Editor/Elements/Button/EditorButton.js +27 -9
  10. package/dist/Editor/Elements/Carousel/CarouselItem.js +2 -1
  11. package/dist/Editor/Elements/Color Picker/ColorButtons.js +61 -14
  12. package/dist/Editor/Elements/Color Picker/ColorPicker.css +25 -1
  13. package/dist/Editor/Elements/Color Picker/ColorPicker.js +10 -7
  14. package/dist/Editor/Elements/Color Picker/Styles.js +15 -13
  15. package/dist/Editor/Elements/DataView/Layouts/ColumnView.js +4 -2
  16. package/dist/Editor/Elements/DataView/Layouts/DataTypes/Components/MultiSelect.js +454 -0
  17. package/dist/Editor/Elements/DataView/Layouts/DataTypes/MultiSelectType.js +23 -8
  18. package/dist/Editor/Elements/DataView/Layouts/Options/AddOptions.js +5 -2
  19. package/dist/Editor/Elements/DataView/Layouts/Options/EditOption.js +3 -2
  20. package/dist/Editor/Elements/DataView/Layouts/Options/index.js +11 -0
  21. package/dist/Editor/Elements/DataView/Layouts/ViewData.js +8 -4
  22. package/dist/Editor/Elements/Embed/Image.js +3 -2
  23. package/dist/Editor/Elements/Embed/Video.js +1 -1
  24. package/dist/Editor/Elements/EmbedScript/Code.js +14 -2
  25. package/dist/Editor/Elements/EmbedScript/EmbedScriptPopup.js +57 -28
  26. package/dist/Editor/Elements/EmbedScript/styles.js +89 -0
  27. package/dist/Editor/Elements/Form/Form.js +184 -171
  28. package/dist/Editor/Elements/Form/FormElements/FormText.js +23 -6
  29. package/dist/Editor/Elements/Form/FormElements/FormTextArea.js +2 -2
  30. package/dist/Editor/Elements/Form/FormField.js +13 -6
  31. package/dist/Editor/Elements/Form/Workflow/Styles.js +24 -22
  32. package/dist/Editor/Elements/FreeGrid/FreeGrid.js +40 -32
  33. package/dist/Editor/Elements/FreeGrid/FreeGridBox.js +7 -4
  34. package/dist/Editor/Elements/FreeGrid/FreeGridItem.js +1 -0
  35. package/dist/Editor/Elements/FreeGrid/Options/More.js +8 -8
  36. package/dist/Editor/Elements/FreeGrid/helper.js +115 -0
  37. package/dist/Editor/Elements/FreeGrid/styles.js +75 -7
  38. package/dist/Editor/Elements/Grid/Grid.js +14 -2
  39. package/dist/Editor/Elements/Grid/GridItem.js +1 -1
  40. package/dist/Editor/Elements/List/CheckList.js +3 -2
  41. package/dist/Editor/Elements/Search/SearchAttachment.js +40 -9
  42. package/dist/Editor/Elements/Search/SearchButton.js +9 -8
  43. package/dist/Editor/Elements/Search/SearchList.js +9 -7
  44. package/dist/Editor/Elements/Signature/Signature.css +2 -1
  45. package/dist/Editor/Elements/Signature/SignatureOptions/DrawSignature.js +18 -5
  46. package/dist/Editor/Elements/Signature/SignatureOptions/UploadSignature.js +16 -3
  47. package/dist/Editor/Elements/SimpleText/index.js +6 -1
  48. package/dist/Editor/Elements/SimpleText/style.js +2 -2
  49. package/dist/Editor/Elements/Table/DragButton.js +0 -1
  50. package/dist/Editor/Elements/Table/Draggable.js +6 -2
  51. package/dist/Editor/Elements/Table/Styles.js +7 -0
  52. package/dist/Editor/Elements/Table/Table.js +3 -3
  53. package/dist/Editor/Elements/Table/TableCell.js +31 -8
  54. package/dist/Editor/Elements/Title/title.js +6 -6
  55. package/dist/Editor/Elements/Variables/VariableButton.js +10 -1
  56. package/dist/Editor/MiniEditor.js +2 -1
  57. package/dist/Editor/Styles/EditorStyles.js +5 -5
  58. package/dist/Editor/Toolbar/FormatTools/Dropdown.js +27 -3
  59. package/dist/Editor/Toolbar/FormatTools/FontFamilyAutocomplete.js +4 -3
  60. package/dist/Editor/Toolbar/FormatTools/MarkButton.js +2 -2
  61. package/dist/Editor/Toolbar/FormatTools/TextSize.js +10 -13
  62. package/dist/Editor/Toolbar/Mini/MiniToolbar.js +2 -1
  63. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/MiniColorPicker.js +4 -2
  64. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectFontSize.js +6 -13
  65. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectTypography.js +167 -42
  66. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/index.js +7 -4
  67. package/dist/Editor/Toolbar/PopupTool/PopperHeader.js +2 -1
  68. package/dist/Editor/Toolbar/PopupTool/PopupToolStyle.js +72 -12
  69. package/dist/Editor/Toolbar/PopupTool/TextFormat.js +100 -27
  70. package/dist/Editor/Toolbar/PopupTool/ThemeTextFormat.js +439 -0
  71. package/dist/Editor/Toolbar/PopupTool/index.js +1 -1
  72. package/dist/Editor/Toolbar/toolbarGroups.js +48 -6
  73. package/dist/Editor/assets/svg/BackIcon.js +18 -0
  74. package/dist/Editor/assets/svg/ClearAllRounded.js +31 -0
  75. package/dist/Editor/assets/svg/ResetIconNew.js +23 -0
  76. package/dist/Editor/assets/svg/SettingsIcon.js +1 -0
  77. package/dist/Editor/assets/svg/ThemeIcons.js +293 -0
  78. package/dist/Editor/common/Checkbox/index.js +46 -0
  79. package/dist/Editor/common/Checkbox/styles.js +45 -0
  80. package/dist/Editor/common/ColorPickerButton.js +41 -16
  81. package/dist/Editor/common/CustomColorPicker/index.js +130 -0
  82. package/dist/Editor/common/CustomColorPicker/style.js +53 -0
  83. package/dist/Editor/common/CustomDialog2/index.js +94 -0
  84. package/dist/Editor/common/CustomDialog2/style.js +67 -0
  85. package/dist/Editor/common/CustomSelect.js +43 -0
  86. package/dist/Editor/common/DnD/DragHandleButton.js +1 -1
  87. package/dist/Editor/common/FontLoader/FontLoader.js +3 -0
  88. package/dist/Editor/common/Icon.js +31 -1
  89. package/dist/Editor/common/ImageSelector/ImageSelector.js +2 -2
  90. package/dist/Editor/common/ImageSelector/Styles.js +3 -9
  91. package/dist/Editor/common/LinkSettings/NavComponents.js +61 -56
  92. package/dist/Editor/common/LinkSettings/index.js +82 -81
  93. package/dist/Editor/common/LinkSettings/navOptions.js +2 -2
  94. package/dist/Editor/common/LinkSettings/style.js +209 -74
  95. package/dist/Editor/common/MentionsPopup/index.js +4 -1
  96. package/dist/Editor/common/RadioGroup/index.js +48 -0
  97. package/dist/Editor/common/RadioGroup/styles.js +29 -0
  98. package/dist/Editor/common/RnD/ElementOptions/Actions.js +13 -15
  99. package/dist/Editor/common/RnD/ElementOptions/Icons/LinkIcon.js +1 -0
  100. package/dist/Editor/common/RnD/ElementOptions/index.js +2 -2
  101. package/dist/Editor/common/RnD/ElementOptions/styles.js +28 -1
  102. package/dist/Editor/common/RnD/ElementSettings/OtherSettings/Settings.js +6 -5
  103. package/dist/Editor/common/RnD/ElementSettings/OtherSettings/Signature.js +4 -3
  104. package/dist/Editor/common/RnD/ElementSettings/Settings/AppHeaderSettings.js +3 -2
  105. package/dist/Editor/common/RnD/ElementSettings/Settings/BoxSettings.js +3 -2
  106. package/dist/Editor/common/RnD/ElementSettings/Settings/ButtonSettings.js +3 -2
  107. package/dist/Editor/common/RnD/ElementSettings/Settings/CodeSettings.js +3 -2
  108. package/dist/Editor/common/RnD/ElementSettings/Settings/FormSettings.js +4 -2
  109. package/dist/Editor/common/RnD/ElementSettings/Settings/ImageSettings.js +3 -2
  110. package/dist/Editor/common/RnD/ElementSettings/Settings/TableSettings.js +3 -2
  111. package/dist/Editor/common/RnD/ElementSettings/Settings/TextSettings.js +3 -1
  112. package/dist/Editor/common/RnD/ElementSettings/Settings/VideoSettings.js +3 -2
  113. package/dist/Editor/common/RnD/ElementSettings/styles.js +146 -12
  114. package/dist/Editor/common/RnD/OptionsPopup/index.js +8 -5
  115. package/dist/Editor/common/RnD/OptionsPopup/style.js +120 -19
  116. package/dist/Editor/common/RnD/SwitchViewport/SwitchViewport.js +8 -5
  117. package/dist/Editor/common/RnD/Theme/MainThemeProvider.js +17 -0
  118. package/dist/Editor/common/RnD/Theme/ViewportStimulator.js +6 -3
  119. package/dist/Editor/common/RnD/Utils/gridDropItem.js +28 -19
  120. package/dist/Editor/common/RnD/Utils/index.js +3 -1
  121. package/dist/Editor/common/RnD/VirtualElement/VirtualTextElement.js +42 -58
  122. package/dist/Editor/common/RnD/VirtualElement/helper.js +323 -132
  123. package/dist/Editor/common/RnD/VirtualElement/styles.js +16 -0
  124. package/dist/Editor/common/RnD/index.js +68 -39
  125. package/dist/Editor/common/Select/index.js +44 -5
  126. package/dist/Editor/common/Select/styles.js +30 -2
  127. package/dist/Editor/common/Shorthands/elements.js +65 -11
  128. package/dist/Editor/common/SnackBar/index.js +43 -0
  129. package/dist/Editor/common/StyleBuilder/accordionTitleBtnStyle.js +2 -2
  130. package/dist/Editor/common/StyleBuilder/accordionTitleStyle.js +12 -9
  131. package/dist/Editor/common/StyleBuilder/buttonStyle.js +4 -2
  132. package/dist/Editor/common/StyleBuilder/embedVideoStyle.js +4 -0
  133. package/dist/Editor/common/StyleBuilder/fieldTypes/backgroundImage.js +5 -0
  134. package/dist/Editor/common/StyleBuilder/fieldTypes/bannerSpacing.js +12 -2
  135. package/dist/Editor/common/StyleBuilder/fieldTypes/borderRadius.js +15 -7
  136. package/dist/Editor/common/StyleBuilder/fieldTypes/card.js +16 -8
  137. package/dist/Editor/common/StyleBuilder/fieldTypes/color.js +36 -10
  138. package/dist/Editor/common/StyleBuilder/fieldTypes/embedUpload.js +115 -0
  139. package/dist/Editor/common/StyleBuilder/fieldTypes/fontSize.js +16 -7
  140. package/dist/Editor/common/StyleBuilder/fieldTypes/index.js +3 -1
  141. package/dist/Editor/common/StyleBuilder/fieldTypes/lineSpacing.js +7 -6
  142. package/dist/Editor/common/StyleBuilder/fieldTypes/menusArray.js +13 -6
  143. package/dist/Editor/common/StyleBuilder/fieldTypes/textOptions.js +15 -7
  144. package/dist/Editor/common/StyleBuilder/pageSettingsStyle.js +5 -7
  145. package/dist/Editor/common/SwipeableDrawer/style.js +14 -12
  146. package/dist/Editor/common/Uploader.js +16 -0
  147. package/dist/Editor/common/iconListV2.js +177 -6
  148. package/dist/Editor/common/iconslist.js +24 -0
  149. package/dist/Editor/commonStyle.js +186 -62
  150. package/dist/Editor/helper/index.js +5 -1
  151. package/dist/Editor/helper/textIndeces.js +58 -0
  152. package/dist/Editor/helper/theme.js +203 -2
  153. package/dist/Editor/hooks/useEditorTheme.js +153 -0
  154. package/dist/Editor/hooks/useMouseMove.js +8 -5
  155. package/dist/Editor/hooks/useTable.js +5 -4
  156. package/dist/Editor/hooks/useThemeValues.js +63 -0
  157. package/dist/Editor/plugins/withEmbeds.js +1 -1
  158. package/dist/Editor/plugins/withHTML.js +3 -1
  159. package/dist/Editor/plugins/withTable.js +1 -1
  160. package/dist/Editor/theme/ThemeList.js +50 -173
  161. package/dist/Editor/theme/index.js +149 -0
  162. package/dist/Editor/themeSettings/ActiveTheme.js +82 -0
  163. package/dist/Editor/themeSettings/buttons/index.js +300 -0
  164. package/dist/Editor/themeSettings/buttons/style.js +23 -0
  165. package/dist/Editor/themeSettings/colorTheme/index.js +310 -0
  166. package/dist/Editor/themeSettings/colorTheme/style.js +81 -0
  167. package/dist/Editor/themeSettings/fonts/PreviewElement.js +121 -0
  168. package/dist/Editor/themeSettings/fonts/index.js +240 -0
  169. package/dist/Editor/themeSettings/fonts/style.js +62 -0
  170. package/dist/Editor/themeSettings/icons.js +60 -0
  171. package/dist/Editor/themeSettings/index.js +380 -0
  172. package/dist/Editor/themeSettings/style.js +299 -0
  173. package/dist/Editor/themeSettingsAI/icons.js +96 -0
  174. package/dist/Editor/themeSettingsAI/index.js +355 -0
  175. package/dist/Editor/themeSettingsAI/saveTheme.js +202 -0
  176. package/dist/Editor/themeSettingsAI/style.js +332 -0
  177. package/dist/Editor/utils/SlateUtilityFunctions.js +172 -46
  178. package/dist/Editor/utils/accordion.js +14 -4
  179. package/dist/Editor/utils/button.js +1 -17
  180. package/dist/Editor/utils/customHooks/useTableResize.js +49 -9
  181. package/dist/Editor/utils/draftToSlate.js +3 -2
  182. package/dist/Editor/utils/events.js +50 -6
  183. package/dist/Editor/utils/font.js +40 -37
  184. package/dist/Editor/utils/form.js +4 -4
  185. package/dist/Editor/utils/formfield.js +9 -2
  186. package/dist/Editor/utils/helper.js +210 -26
  187. package/dist/Editor/utils/insertAppHeader.js +1 -1
  188. package/dist/Editor/utils/signature.js +2 -9
  189. package/dist/Editor/utils/updateFormName.js +22 -0
  190. package/package.json +4 -4
@@ -1,6 +1,7 @@
1
1
  const useFreeGridStyles = ({
2
2
  theme,
3
- MAX_DEVICE_WIDTH
3
+ MAX_DEVICE_WIDTH,
4
+ appTheme
4
5
  }) => ({
5
6
  root: {
6
7
  "&.freegrid-container": {
@@ -47,6 +48,9 @@ const useFreeGridStyles = ({
47
48
  "&.type_text": {
48
49
  // minHeight: "fit-content !important",
49
50
  // wordBreak: "break-all",
51
+ "& .placeholder-simple-text": {
52
+ display: "none"
53
+ }
50
54
  },
51
55
  "&.enable-1, &.enable-2": {
52
56
  "&.type_text": {
@@ -243,6 +247,9 @@ const useFreeGridStyles = ({
243
247
  },
244
248
  "& > .simple-text": {
245
249
  display: "none"
250
+ },
251
+ "& > .edt-paragraphs": {
252
+ display: "none"
246
253
  }
247
254
  },
248
255
  "& .fgi_type_form": {
@@ -313,9 +320,50 @@ const useFreeGridStyles = ({
313
320
  backgroundColor: "#FFF",
314
321
  overflow: "hidden"
315
322
  },
323
+ "& .fgi_type_embedScript:not(:has(.has-code))": {
324
+ background: appTheme?.palette?.editor?.sectionSettingIconHover,
325
+ color: appTheme?.palette?.editor?.textColor,
326
+ fontSize: "14px",
327
+ borderRadius: "12px",
328
+ display: "flex",
329
+ flexDirection: "column",
330
+ justifyContent: "center",
331
+ alignItems: "center",
332
+ height: "100%",
333
+ textAlign: "center",
334
+ "& svg": {
335
+ width: "20px",
336
+ height: "20px",
337
+ "& path": {
338
+ stroke: appTheme?.palette?.editor?.closeButtonSvgStroke
339
+ }
340
+ },
341
+ "& .code-icon": {
342
+ display: "flex",
343
+ marginRight: "5px"
344
+ },
345
+ "& .empty-code": {
346
+ display: "flex"
347
+ },
348
+ "& .code-name": {
349
+ display: "flex",
350
+ alignItems: "anchor-center"
351
+ }
352
+ },
316
353
  "& .fgi_type_text": {
317
354
  "& .edt-headings": {
318
355
  margin: "0px"
356
+ },
357
+ "& .edt-paragraphs": {
358
+ margin: "0px"
359
+ }
360
+ },
361
+ "& .fgi_type_table": {
362
+ "& .edt-headings": {
363
+ margin: "0px"
364
+ },
365
+ "& .edt-paragraphs": {
366
+ margin: "0px"
319
367
  }
320
368
  },
321
369
  /** element toolbar hide */
@@ -356,21 +404,41 @@ const useFreeGridStyles = ({
356
404
  sectionPopper: {
357
405
  zIndex: 1200,
358
406
  width: "40px",
359
- left: "-58px !important",
407
+ left: "-63px !important",
360
408
  borderRadius: "8px",
409
+ marginRight: "5px !important",
361
410
  "& .papper-root": {
362
411
  fontFamily: "sans-serif",
363
412
  boxShadow: "-4px -3px 12px 4px rgba(0, 0, 0, 0.12)",
364
- background: "#FFF",
413
+ background: `${appTheme?.palette?.editor?.miniToolBarBackground} !important`,
414
+ border: `1px solid ${appTheme?.palette?.editor?.miniToolBarBorder}`,
415
+ borderRadius: "10px",
365
416
  "& .MuiIconButton-root": {
366
- padding: "10px",
417
+ padding: "9px",
367
418
  color: "#000",
368
- background: "#FFF",
419
+ background: `${appTheme?.palette?.editor?.miniToolBarBackground} !important`,
369
420
  "& svg": {
370
421
  width: "20px",
371
- height: "20px"
422
+ height: "20px",
423
+ color: appTheme?.palette?.editor?.closeButtonSvgStroke
424
+ },
425
+ "& .settingsIcon": {
426
+ "& path": {
427
+ stroke: appTheme?.palette?.editor?.closeButtonSvgStroke
428
+ }
372
429
  },
373
- "&.active,&:hover ": {}
430
+ "&.active": {
431
+ "& svg": {
432
+ width: "20px",
433
+ height: "20px",
434
+ color: "#2563EB"
435
+ },
436
+ "& .settingsIcon": {
437
+ "& path": {
438
+ stroke: "#2563EB"
439
+ }
440
+ }
441
+ }
374
442
  }
375
443
  }
376
444
  },
@@ -1,6 +1,6 @@
1
1
  /* eslint-disable no-unused-vars */
2
2
  import React, { useState } from "react";
3
- import { Transforms, Path, Node } from "slate";
3
+ import { Transforms, Path, Node, Editor, Element } from "slate";
4
4
  import { useSlateStatic, ReactEditor } from "slate-react";
5
5
  import { IconButton, Tooltip, Grid as GridContainer, useTheme } from "@mui/material";
6
6
  import ArrowUpwardIcon from "@mui/icons-material/ArrowUpward";
@@ -206,7 +206,19 @@ const Grid = props => {
206
206
  };
207
207
  const onAddSection = () => () => {
208
208
  try {
209
- const duplicateGrid = JSON.parse(JSON.stringify(element));
209
+ let duplicateGrid = JSON.parse(JSON.stringify(element));
210
+ const carousel = Editor.above(editor, {
211
+ at: path,
212
+ match: n => !Editor.isEditor(n) && Element.isElement(n) && n.type === "carousel-item"
213
+ });
214
+ if (carousel) {
215
+ const [carouselNode, carouselItemPath] = carousel || [];
216
+ const duplicatecCarousel = JSON.parse(JSON.stringify(carouselNode));
217
+ Transforms.insertNodes(editor, duplicatecCarousel, {
218
+ at: Path.next(carouselItemPath)
219
+ });
220
+ return;
221
+ }
210
222
  insertGrid(editor, duplicateGrid, [path[0] + 1, 0]);
211
223
  } catch (err) {
212
224
  console.log(err);
@@ -292,7 +292,7 @@ const GridItem = props => {
292
292
  ...getBRProps,
293
293
  display: "flex",
294
294
  flexDirection: flexDirection || "column",
295
- background: bgColor || "transparent",
295
+ background: bgColor,
296
296
  borderColor: getBorderColor(),
297
297
  borderWidth: borderWidth || "1px",
298
298
  borderStyle: borderStyle || "solid",
@@ -15,7 +15,8 @@ const CheckList = props => {
15
15
  isEmpty,
16
16
  className,
17
17
  style,
18
- customProps
18
+ customProps,
19
+ selectedLineHeight
19
20
  } = props;
20
21
  const {
21
22
  translation
@@ -45,7 +46,7 @@ const CheckList = props => {
45
46
  justifyContent: "center",
46
47
  alignItems: "center",
47
48
  ...(style || {}),
48
- lineHeight: 1.43
49
+ lineHeight: `${selectedLineHeight}`
49
50
  },
50
51
  children: [/*#__PURE__*/_jsxs("div", {
51
52
  contentEditable: false,
@@ -1,5 +1,10 @@
1
- import React from "react";
2
- import { Box, Card, CardMedia, CardContent, Typography } from "@mui/material";
1
+ import React, { useEffect, useState } from "react";
2
+ import Box from "@mui/material/Box";
3
+ import Card from "@mui/material/Card";
4
+ import CardMedia from "@mui/material/CardMedia";
5
+ import CardContent from "@mui/material/CardContent";
6
+ import Typography from "@mui/material/Typography";
7
+ import Skeleton from "@mui/material/Skeleton";
3
8
  import Icon from "../../common/Icon";
4
9
  import { useEditorContext } from "../../hooks/useMouseMove";
5
10
  import { jsx as _jsx } from "react/jsx-runtime";
@@ -15,13 +20,26 @@ const SearchAttachment = props => {
15
20
  metadata
16
21
  } = customProps;
17
22
  const {
18
- title,
19
- type
23
+ type,
24
+ id
20
25
  } = element;
21
26
  const {
22
27
  theme
23
28
  } = useEditorContext();
29
+ const [title, setTitle] = useState("");
30
+ const [showSkeleton, setShowSkeleton] = useState(false);
24
31
  const label = Boolean(title?.trim()) ? title : 'Untitled';
32
+ useEffect(() => {
33
+ const fetchTitle = async id => {
34
+ setShowSkeleton(true);
35
+ const title = await customProps?.services('getDocTitle', id);
36
+ setTitle(title?.data);
37
+ setShowSkeleton(false);
38
+ };
39
+ if (id) {
40
+ fetchTitle(id);
41
+ }
42
+ }, []);
25
43
  const handleClick = () => {
26
44
  if (metadata && metadata?.actionHandler) {
27
45
  metadata?.actionHandler(type, element);
@@ -38,15 +56,15 @@ const SearchAttachment = props => {
38
56
  children: /*#__PURE__*/_jsxs(Card, {
39
57
  sx: {
40
58
  display: "flex",
41
- justifyContent: "flex-start",
42
- alignItems: "flex-end",
59
+ justifyContent: showSkeleton ? "center" : "flex-start",
60
+ alignItems: showSkeleton ? "center" : "flex-end",
43
61
  width: "fit-content",
44
62
  maxWidth: '250px',
45
63
  padding: "0px 10px",
46
64
  boxShadow: "none",
47
65
  border: `1px solid ${theme?.palette?.primary?.slashBrainBorder} !important`,
48
66
  borderRadius: "7px !important",
49
- background: `${theme?.palette?.containers?.slashBrainCardBg} !important`,
67
+ background: showSkeleton ? `${theme?.palette?.editor?.menuOptionHoverBackground} !important` : `${theme?.palette?.containers?.slashBrainCardBg} !important`,
50
68
  cursor: 'pointer',
51
69
  margin: '4px 0px',
52
70
  lineHeight: 1.43,
@@ -76,7 +94,12 @@ const SearchAttachment = props => {
76
94
  width: "unset !important"
77
95
  }
78
96
  },
79
- children: /*#__PURE__*/_jsx(Icon, {
97
+ children: showSkeleton ? /*#__PURE__*/_jsx(Skeleton, {
98
+ variant: "circular",
99
+ width: 14,
100
+ height: 14,
101
+ animation: "wave"
102
+ }) : /*#__PURE__*/_jsx(Icon, {
80
103
  icon: "docsIcon"
81
104
  })
82
105
  }), /*#__PURE__*/_jsx(CardContent, {
@@ -94,7 +117,15 @@ const SearchAttachment = props => {
94
117
  width: "unset !important"
95
118
  }
96
119
  },
97
- children: /*#__PURE__*/_jsxs(Typography, {
120
+ children: showSkeleton ? /*#__PURE__*/_jsx(Skeleton, {
121
+ variant: "text",
122
+ width: 140,
123
+ height: 20,
124
+ animation: "wave",
125
+ sx: {
126
+ borderRadius: "4px"
127
+ }
128
+ }) : /*#__PURE__*/_jsxs(Typography, {
98
129
  sx: {
99
130
  fontWeight: "500",
100
131
  background: theme?.palette?.text?.slashBrainText,
@@ -30,6 +30,7 @@ const SearchButton = /*#__PURE__*/forwardRef((props, ref) => {
30
30
  const [skip, setSkip] = useState(0);
31
31
  const [search, setSearch] = useState("");
32
32
  const [isLoading, setIsLoading] = useState(false);
33
+ const [total, setTotal] = useState(0);
33
34
  const [debouncedSearch] = useDebounce(search, 300);
34
35
  const limit = 20;
35
36
  const observer = useRef();
@@ -63,24 +64,24 @@ const SearchButton = /*#__PURE__*/forwardRef((props, ref) => {
63
64
  }
64
65
  };
65
66
  useEffect(() => {
66
- getDocs({
67
- debouncedSearch,
68
- skip,
69
- limit,
70
- current_doc_id: currentId
71
- });
67
+ getDocs();
72
68
  }, [skip, debouncedSearch]);
73
69
  const getDocs = async () => {
70
+ if (isLoading) return;
71
+ if (total > 0 && mapData?.length >= total) return;
74
72
  setIsLoading(true);
75
73
  try {
76
74
  if (otherProps?.services) {
77
75
  const result = await otherProps?.services("getDocs", {
78
76
  skip,
79
77
  limit,
80
- search,
78
+ search: debouncedSearch,
81
79
  current_doc_id: currentId
82
80
  });
83
- setMapData(prev => skip === 0 ? result.data : [...prev, ...result.data]);
81
+ const docs = result?.data?.docs || [];
82
+ const totalCount = result?.data?.total || 0;
83
+ setMapData(prev => skip === 0 ? docs : [...prev, ...docs]);
84
+ setTotal(totalCount);
84
85
  }
85
86
  } catch (error) {
86
87
  console.error("Error fetching documents:", error);
@@ -259,7 +259,7 @@ const SearchAndDocList = ({
259
259
  xs: 12,
260
260
  children: /*#__PURE__*/_jsx(Typography, {
261
261
  sx: {
262
- display: mapData?.length === 0 ? 'flex' : 'none',
262
+ display: mapData?.length === 0 && !isLoading ? 'flex' : 'none',
263
263
  alignItems: "center",
264
264
  justifyContent: "center",
265
265
  color: theme?.palette?.text?.secondary,
@@ -269,15 +269,17 @@ const SearchAndDocList = ({
269
269
  },
270
270
  children: "No docs"
271
271
  })
272
- }), isLoading && /*#__PURE__*/_jsx(Grid, {
272
+ }), /*#__PURE__*/_jsx(Grid, {
273
273
  item: true,
274
+ xs: 12,
274
275
  sx: {
275
- display: "flex",
276
+ display: isLoading ? 'flex' : 'none',
277
+ alignItems: "center",
276
278
  justifyContent: "center",
277
- alignItems: 'center',
278
- minHeight: '400px',
279
- padding: '0px 16px 8px',
280
- position: 'absolute'
279
+ color: theme?.palette?.text?.secondary,
280
+ fontSize: '12px',
281
+ padding: '20px',
282
+ fontWeight: 700
281
283
  },
282
284
  children: /*#__PURE__*/_jsx(CircularProgress, {})
283
285
  })]
@@ -46,11 +46,12 @@
46
46
 
47
47
  .upload-input-wrapper {
48
48
  width: 100%;
49
+ height: 100%;
49
50
  position: relative;
50
51
  }
51
52
  .upload-input-wrapper input {
52
53
  width: 100%;
53
- height: 100px;
54
+ height: 100%;
54
55
  opacity: 0;
55
56
  z-index: 1;
56
57
  position: relative;
@@ -1,6 +1,7 @@
1
1
  import React, { useRef, useState } from "react";
2
2
  import SignatureCanvas from "react-signature-canvas";
3
- import { Grid, useMediaQuery } from "@mui/material";
3
+ import { Grid, IconButton, useMediaQuery } from "@mui/material";
4
+ import { ResetIcon } from "../../../common/iconListV2";
4
5
  import { jsx as _jsx } from "react/jsx-runtime";
5
6
  import { jsxs as _jsxs } from "react/jsx-runtime";
6
7
  const DrawSignature = props => {
@@ -24,6 +25,13 @@ const DrawSignature = props => {
24
25
  signature: result?.imageURL || strImage
25
26
  });
26
27
  };
28
+ const onClear = () => {
29
+ canvasRef.clear();
30
+ setUploading(false);
31
+ onDataChange({
32
+ signature: ""
33
+ });
34
+ };
27
35
  const isMobile = useMediaQuery("(max-width:599px)");
28
36
  const signatureCanvasStyle = isMobile ? {
29
37
  width: "260px",
@@ -31,14 +39,15 @@ const DrawSignature = props => {
31
39
  } : {};
32
40
  return /*#__PURE__*/_jsxs(Grid, {
33
41
  container: true,
34
- children: [uploading ? "Uploading..." : "", /*#__PURE__*/_jsx(Grid, {
42
+ children: [uploading ? "Uploading..." : "", /*#__PURE__*/_jsxs(Grid, {
35
43
  item: true,
36
44
  xs: 12,
37
45
  style: {
38
46
  width: "100%",
39
- height: "209px"
47
+ height: "209px",
48
+ position: "relative"
40
49
  },
41
- children: /*#__PURE__*/_jsx(SignatureCanvas, {
50
+ children: [/*#__PURE__*/_jsx(SignatureCanvas, {
42
51
  canvasProps: {
43
52
  className: "signature-canvas",
44
53
  ...signatureCanvasStyle
@@ -47,7 +56,11 @@ const DrawSignature = props => {
47
56
  ref: ref => canvasRef = ref,
48
57
  maxWidth: brush.size || 2,
49
58
  penColor: brush?.color || "#000"
50
- })
59
+ }), /*#__PURE__*/_jsx(IconButton, {
60
+ className: "clear-canvas",
61
+ onClick: onClear,
62
+ children: /*#__PURE__*/_jsx(ResetIcon, {})
63
+ })]
51
64
  })]
52
65
  });
53
66
  };
@@ -30,15 +30,28 @@ const UploadSignature = props => {
30
30
  signature: result?.imageURL || strImage
31
31
  });
32
32
  };
33
+ const onRemove = () => {
34
+ setBase64(null);
35
+ setUploading(false);
36
+ onUploadDone({
37
+ signature: ""
38
+ });
39
+ };
33
40
  return /*#__PURE__*/_jsxs("div", {
34
41
  className: "signature-tab2",
35
- children: [uploading ? "Uploading..." : "", base64 ? /*#__PURE__*/_jsx("div", {
42
+ children: [uploading ? "Uploading..." : "", base64 ? /*#__PURE__*/_jsxs("div", {
36
43
  className: "upload-sign-img-wrapper",
37
- children: /*#__PURE__*/_jsx("img", {
44
+ children: [/*#__PURE__*/_jsx("img", {
38
45
  className: "upload-sign-img",
39
46
  src: base64,
40
47
  alt: "Signature"
41
- })
48
+ }), /*#__PURE__*/_jsx(Typography, {
49
+ variant: "body2",
50
+ gutterBottom: true,
51
+ className: "remove-sign-img-btn",
52
+ onClick: onRemove,
53
+ children: "Remove"
54
+ })]
42
55
  }) : /*#__PURE__*/_jsxs("div", {
43
56
  className: "upload-input-wrapper",
44
57
  children: [/*#__PURE__*/_jsx("input", {
@@ -5,6 +5,7 @@ import { Box } from "@mui/material";
5
5
  import { isTextSelected } from "../../utils/helper";
6
6
  import { useEditorContext } from "../../hooks/useMouseMove";
7
7
  import SimpleTextStyle from "./style";
8
+ import { getBreakpointLineSpacing, getDevice } from "../../helper/theme";
8
9
  import { jsx as _jsx } from "react/jsx-runtime";
9
10
  import { Fragment as _Fragment } from "react/jsx-runtime";
10
11
  import { jsxs as _jsxs } from "react/jsx-runtime";
@@ -29,8 +30,12 @@ const SimpleText = props => {
29
30
  } = customProps;
30
31
  // const { element: pageSt } = getPageSettings(editor) || {};
31
32
  // const { pageColor } = pageSt?.pageProps || {};
33
+ const breakpoint = getDevice(window.innerWidth);
34
+ const lineH = element?.children[0]?.lineHeight;
35
+ const lineHeight = getBreakpointLineSpacing(lineH, breakpoint);
32
36
  const classes = SimpleTextStyle({
33
- pageColor: "#FFFFFF"
37
+ pageColor: "#FFFFFF",
38
+ lineHeight
34
39
  });
35
40
  const selected = useSelected();
36
41
  const path = ReactEditor.findPath(editor, element);
@@ -35,8 +35,8 @@ const SimpleTextStyle = ({
35
35
  height: "24px",
36
36
  overflow: "hidden",
37
37
  fontSize: "14px",
38
- display: 'inline-flex',
39
- alignItems: 'center',
38
+ display: "inline-flex",
39
+ alignItems: "center",
40
40
  "& .bg-pad-sl": {
41
41
  padding: "2px 4px 2px 4px",
42
42
  background: "transparent",
@@ -44,7 +44,6 @@ function DragButton({
44
44
  const dragProps = {
45
45
  ...dndProps,
46
46
  id: dndProps?.id + dragType,
47
- disabled: isMobile,
48
47
  data: {
49
48
  ...dndProps.data,
50
49
  dragType
@@ -13,9 +13,13 @@ function Draggable(props) {
13
13
  } = props?.data || {};
14
14
  const style = transform ? {
15
15
  transform: dragType === "row" ? `translate3d(0, ${transform.y}px, 0)` : `translate3d(${transform.x}px, 0, 0)`
16
- } : undefined;
16
+ } : {};
17
17
  return /*#__PURE__*/_jsx(Box, {
18
- style: style,
18
+ style: {
19
+ ...style,
20
+ touchAction: "none" // Disables scrolling while dragging. Necessary for proper mobile drag functionality.
21
+ },
22
+
19
23
  ref: setNodeRef,
20
24
  ...listeners,
21
25
  ...attributes,
@@ -86,6 +86,13 @@ const TableStyles = theme => {
86
86
  background: "#2563EB"
87
87
  }
88
88
  },
89
+ mobileCellResizer: {
90
+ position: "absolute",
91
+ right: "-10px",
92
+ top: "-10px",
93
+ zIndex: 4000,
94
+ padding: "2px"
95
+ },
89
96
  mobileToolDrawer: {
90
97
  "& .customSelectContainer": {
91
98
  border: "none !important",
@@ -307,7 +307,7 @@ const Table = props => {
307
307
  onScroll: handleScroll,
308
308
  onMouseOver: onMouseOver,
309
309
  onMouseLeave: onMouseLeave,
310
- className: !hideTools.includes("add_column") ? "custom-scroll" : '',
310
+ className: "custom-scroll",
311
311
  children: [/*#__PURE__*/_jsx(TableComp, {
312
312
  className: readOnly ? "readOnly" : "",
313
313
  sx: {
@@ -345,8 +345,8 @@ const Table = props => {
345
345
  handleAction: handleAction,
346
346
  exandTools: exandTools,
347
347
  openSetttings: openSetttings,
348
- translation: translation,
349
- hideTools: hideTools
348
+ hideTools: hideTools,
349
+ translation: translation
350
350
  }), /*#__PURE__*/_jsx(MoreTableSettings, {
351
351
  exandTools: exandTools,
352
352
  handleAction: handleAction,
@@ -1,6 +1,6 @@
1
1
  import React, { useState, useEffect, useMemo } from "react";
2
- import { Editor, Path, Transforms } from "slate";
3
- import { Box } from "@mui/material";
2
+ import { Editor, Path, Range, Transforms } from "slate";
3
+ import { Box, IconButton } from "@mui/material";
4
4
  import { useSlateStatic, ReactEditor } from "slate-react";
5
5
  import useTableResize from "../../utils/customHooks/useTableResize";
6
6
  import { TableUtil } from "../../utils/table";
@@ -12,6 +12,7 @@ import TablePopup from "./TablePopup";
12
12
  import { Droppable } from "./Droppable";
13
13
  import { useDndContext } from "@dnd-kit/core";
14
14
  import { getNodeWithType } from "../../utils/helper";
15
+ import { ResizeIcon } from "../../common/iconListV2";
15
16
  import { isEmptyTextNode } from "../../helper";
16
17
  import SimpleText from "../SimpleText";
17
18
  import { jsx as _jsx } from "react/jsx-runtime";
@@ -41,16 +42,32 @@ const Resizer = ({
41
42
  onMouseDown,
42
43
  height
43
44
  }) => {
45
+ const eventProps = {
46
+ onPointerDown: onMouseDown
47
+ };
44
48
  return /*#__PURE__*/_jsx(_Fragment, {
45
49
  children: /*#__PURE__*/_jsx(Box, {
46
50
  component: "div",
47
51
  className: "cell-resizer",
48
52
  contentEditable: false,
49
- onPointerDown: onMouseDown,
50
53
  sx: classes.cellResizer,
51
54
  style: {
52
55
  height: `${height}px`
53
- }
56
+ },
57
+ ...eventProps
58
+ })
59
+ });
60
+ };
61
+ const MobileResizer = ({
62
+ classes,
63
+ onMouseDown
64
+ }) => {
65
+ return /*#__PURE__*/_jsx(_Fragment, {
66
+ children: /*#__PURE__*/_jsx(IconButton, {
67
+ contentEditable: false,
68
+ sx: classes.mobileCellResizer,
69
+ onTouchStart: onMouseDown,
70
+ children: /*#__PURE__*/_jsx(ResizeIcon, {})
54
71
  })
55
72
  });
56
73
  };
@@ -115,7 +132,8 @@ const TableCell = props => {
115
132
  size: element?.size,
116
133
  minMaxProps: {
117
134
  minWidth: 30
118
- }
135
+ },
136
+ isMobile
119
137
  });
120
138
  const [tableSize, setTableSize] = useState({});
121
139
  const [openSettings, setOpenSettings] = useState(false);
@@ -132,8 +150,12 @@ const TableCell = props => {
132
150
  const isFirstRow = row === 0;
133
151
  const isFirstColumn = column === 0;
134
152
  const [hoverRow, hoverCol] = hoverPath ? hoverPath.slice(-2) : [];
135
- const showColDrag = isFirstRow && hoverCol === column && !resizing && !readOnly && !hideTools.includes("drag");
136
- const showRowDrag = isFirstColumn && hoverRow === row && !resizing && !readOnly && !hideTools.includes("drag");
153
+ const {
154
+ selection
155
+ } = editor;
156
+ const isHavingSelection = selection && !Range.isCollapsed(selection);
157
+ const showColDrag = isFirstRow && hoverCol === column && !resizing && !readOnly && !hideTools.includes("drag") && !isHavingSelection;
158
+ const showRowDrag = isFirstColumn && hoverRow === row && !resizing && !readOnly && !hideTools.includes("drag") && !isHavingSelection;
137
159
  const [parentProps] = tableNode || [{}];
138
160
  const [rowProps] = rowNode || [{}];
139
161
  const tableDOM = table.getDOMNode(path, true);
@@ -420,6 +442,7 @@ const TableCell = props => {
420
442
  resetSelection
421
443
  };
422
444
  const showRowDragBtn = (showRowDrag || isRowDragging) && containerEle?.scrollLeft <= 0;
445
+ const TableResizer = isMobile && hoverCol === column ? MobileResizer : Resizer;
423
446
  return /*#__PURE__*/_jsxs(_Fragment, {
424
447
  children: [/*#__PURE__*/_jsxs("td", {
425
448
  ...element.attr,
@@ -454,7 +477,7 @@ const TableCell = props => {
454
477
  padding: "8px"
455
478
  },
456
479
  children: children
457
- }), isHeader && !readOnly && tableSize?.height && !showTool ? /*#__PURE__*/_jsx(Resizer, {
480
+ }), isHeader && !readOnly && tableSize?.height && !showTool ? /*#__PURE__*/_jsx(TableResizer, {
458
481
  classes: classes,
459
482
  onMouseDown: onMouseDown,
460
483
  height: tableDOM?.getBoundingClientRect()?.height
@@ -4,6 +4,12 @@ import { useSlate } from "slate-react";
4
4
  import { getNodeText } from "../../utils/helper";
5
5
  import { jsx as _jsx } from "react/jsx-runtime";
6
6
  import { jsxs as _jsxs } from "react/jsx-runtime";
7
+ const isEmptyTextNode = node => {
8
+ if (Text.isText(node)) {
9
+ return !node.text.trim();
10
+ }
11
+ return false;
12
+ };
7
13
  const Title = props => {
8
14
  const {
9
15
  attributes,
@@ -50,10 +56,4 @@ const useDetectExitFromTitle = (titleNode, onSaveTitle) => {
50
56
  }
51
57
  }, [editor.selection]);
52
58
  return null;
53
- };
54
- const isEmptyTextNode = node => {
55
- if (Text.isText(node)) {
56
- return !node.text.trim();
57
- }
58
- return false;
59
59
  };