@flozy/editor 10.1.3 → 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 (150) 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 -181
  23. package/dist/Editor/Elements/Form/FormElements/FormText.js +6 -23
  24. package/dist/Editor/Elements/Form/FormElements/FormTextArea.js +2 -3
  25. package/dist/Editor/Elements/Form/FormField.js +6 -13
  26. package/dist/Editor/Elements/Form/Workflow/Styles.js +22 -24
  27. package/dist/Editor/Elements/FreeGrid/FreeGrid.js +24 -6
  28. package/dist/Editor/Elements/FreeGrid/FreeGridBox.js +4 -7
  29. package/dist/Editor/Elements/FreeGrid/Options/More.js +8 -8
  30. package/dist/Editor/Elements/FreeGrid/styles.js +7 -67
  31. package/dist/Editor/Elements/Grid/GridItem.js +1 -1
  32. package/dist/Editor/Elements/List/CheckList.js +1 -4
  33. package/dist/Editor/Elements/Search/SearchAttachment.js +9 -40
  34. package/dist/Editor/Elements/Search/SearchButton.js +8 -9
  35. package/dist/Editor/Elements/Search/SearchList.js +7 -9
  36. package/dist/Editor/Elements/SimpleText/index.js +1 -6
  37. package/dist/Editor/Elements/SimpleText/style.js +2 -2
  38. package/dist/Editor/Elements/Table/Table.js +3 -3
  39. package/dist/Editor/Elements/Title/title.js +6 -6
  40. package/dist/Editor/Elements/Variables/VariableButton.js +1 -10
  41. package/dist/Editor/MiniEditor.js +1 -2
  42. package/dist/Editor/Styles/EditorStyles.js +5 -5
  43. package/dist/Editor/Toolbar/FormatTools/Dropdown.js +3 -27
  44. package/dist/Editor/Toolbar/FormatTools/FontFamilyAutocomplete.js +3 -4
  45. package/dist/Editor/Toolbar/FormatTools/MarkButton.js +2 -2
  46. package/dist/Editor/Toolbar/FormatTools/TextSize.js +13 -10
  47. package/dist/Editor/Toolbar/Mini/MiniToolbar.js +1 -2
  48. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/MiniColorPicker.js +2 -4
  49. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectFontSize.js +13 -6
  50. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectTypography.js +42 -167
  51. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/index.js +4 -7
  52. package/dist/Editor/Toolbar/PopupTool/PopperHeader.js +1 -2
  53. package/dist/Editor/Toolbar/PopupTool/PopupToolStyle.js +12 -72
  54. package/dist/Editor/Toolbar/PopupTool/TextFormat.js +27 -100
  55. package/dist/Editor/Toolbar/PopupTool/index.js +1 -1
  56. package/dist/Editor/Toolbar/toolbarGroups.js +6 -48
  57. package/dist/Editor/assets/svg/SettingsIcon.js +0 -1
  58. package/dist/Editor/common/ColorPickerButton.js +17 -39
  59. package/dist/Editor/common/DnD/DragHandleButton.js +1 -1
  60. package/dist/Editor/common/FontLoader/FontLoader.js +0 -3
  61. package/dist/Editor/common/Icon.js +1 -31
  62. package/dist/Editor/common/ImageSelector/Styles.js +9 -3
  63. package/dist/Editor/common/LinkSettings/NavComponents.js +8 -34
  64. package/dist/Editor/common/LinkSettings/index.js +68 -84
  65. package/dist/Editor/common/LinkSettings/style.js +30 -245
  66. package/dist/Editor/common/RnD/ElementOptions/Actions.js +14 -13
  67. package/dist/Editor/common/RnD/ElementOptions/Icons/LinkIcon.js +0 -1
  68. package/dist/Editor/common/RnD/ElementOptions/index.js +2 -2
  69. package/dist/Editor/common/RnD/ElementOptions/styles.js +1 -28
  70. package/dist/Editor/common/RnD/ElementSettings/OtherSettings/Settings.js +5 -6
  71. package/dist/Editor/common/RnD/ElementSettings/Settings/AppHeaderSettings.js +2 -3
  72. package/dist/Editor/common/RnD/ElementSettings/Settings/BoxSettings.js +2 -3
  73. package/dist/Editor/common/RnD/ElementSettings/Settings/ButtonSettings.js +2 -3
  74. package/dist/Editor/common/RnD/ElementSettings/Settings/CodeSettings.js +2 -3
  75. package/dist/Editor/common/RnD/ElementSettings/Settings/FormSettings.js +2 -4
  76. package/dist/Editor/common/RnD/ElementSettings/Settings/ImageSettings.js +2 -3
  77. package/dist/Editor/common/RnD/ElementSettings/Settings/TableSettings.js +2 -3
  78. package/dist/Editor/common/RnD/ElementSettings/Settings/TextSettings.js +1 -3
  79. package/dist/Editor/common/RnD/ElementSettings/Settings/VideoSettings.js +2 -3
  80. package/dist/Editor/common/RnD/ElementSettings/styles.js +12 -147
  81. package/dist/Editor/common/RnD/OptionsPopup/index.js +5 -8
  82. package/dist/Editor/common/RnD/OptionsPopup/style.js +19 -121
  83. package/dist/Editor/common/RnD/SwitchViewport/SwitchViewport.js +5 -8
  84. package/dist/Editor/common/RnD/Theme/ViewportStimulator.js +3 -6
  85. package/dist/Editor/common/RnD/Utils/gridDropItem.js +2 -1
  86. package/dist/Editor/common/RnD/index.js +6 -5
  87. package/dist/Editor/common/Select/index.js +0 -2
  88. package/dist/Editor/common/Shorthands/elements.js +0 -54
  89. package/dist/Editor/common/StyleBuilder/buttonStyle.js +2 -4
  90. package/dist/Editor/common/StyleBuilder/fieldTypes/backgroundImage.js +0 -5
  91. package/dist/Editor/common/StyleBuilder/fieldTypes/bannerSpacing.js +2 -12
  92. package/dist/Editor/common/StyleBuilder/fieldTypes/borderRadius.js +7 -15
  93. package/dist/Editor/common/StyleBuilder/fieldTypes/card.js +8 -16
  94. package/dist/Editor/common/StyleBuilder/fieldTypes/color.js +10 -36
  95. package/dist/Editor/common/StyleBuilder/fieldTypes/fontSize.js +7 -16
  96. package/dist/Editor/common/StyleBuilder/fieldTypes/lineSpacing.js +6 -7
  97. package/dist/Editor/common/StyleBuilder/fieldTypes/menusArray.js +6 -13
  98. package/dist/Editor/common/StyleBuilder/fieldTypes/textOptions.js +7 -15
  99. package/dist/Editor/common/StyleBuilder/pageSettingsStyle.js +7 -5
  100. package/dist/Editor/common/Uploader.js +0 -8
  101. package/dist/Editor/common/iconListV2.js +6 -101
  102. package/dist/Editor/common/iconslist.js +0 -24
  103. package/dist/Editor/commonStyle.js +61 -165
  104. package/dist/Editor/helper/theme.js +2 -203
  105. package/dist/Editor/hooks/useMouseMove.js +5 -8
  106. package/dist/Editor/plugins/withEmbeds.js +1 -1
  107. package/dist/Editor/plugins/withHTML.js +1 -3
  108. package/dist/Editor/plugins/withTable.js +1 -1
  109. package/dist/Editor/theme/ThemeList.js +173 -50
  110. package/dist/Editor/utils/SlateUtilityFunctions.js +43 -166
  111. package/dist/Editor/utils/button.js +17 -1
  112. package/dist/Editor/utils/draftToSlate.js +2 -3
  113. package/dist/Editor/utils/font.js +37 -40
  114. package/dist/Editor/utils/form.js +4 -4
  115. package/dist/Editor/utils/formfield.js +2 -8
  116. package/dist/Editor/utils/helper.js +19 -90
  117. package/package.json +4 -4
  118. package/dist/Editor/Elements/DataView/Layouts/DataTypes/Components/MultiSelect.js +0 -454
  119. package/dist/Editor/Elements/EmbedScript/styles.js +0 -89
  120. package/dist/Editor/Toolbar/PopupTool/ThemeTextFormat.js +0 -439
  121. package/dist/Editor/assets/svg/BackIcon.js +0 -18
  122. package/dist/Editor/assets/svg/ClearAllRounded.js +0 -31
  123. package/dist/Editor/assets/svg/ResetIconNew.js +0 -23
  124. package/dist/Editor/assets/svg/ThemeIcons.js +0 -293
  125. package/dist/Editor/common/CustomColorPicker/index.js +0 -130
  126. package/dist/Editor/common/CustomColorPicker/style.js +0 -53
  127. package/dist/Editor/common/CustomDialog2/index.js +0 -94
  128. package/dist/Editor/common/CustomDialog2/style.js +0 -67
  129. package/dist/Editor/common/CustomSelect.js +0 -43
  130. package/dist/Editor/common/RnD/Theme/MainThemeProvider.js +0 -17
  131. package/dist/Editor/common/SnackBar/index.js +0 -43
  132. package/dist/Editor/helper/textIndeces.js +0 -58
  133. package/dist/Editor/hooks/useEditorTheme.js +0 -153
  134. package/dist/Editor/hooks/useThemeValues.js +0 -63
  135. package/dist/Editor/theme/index.js +0 -149
  136. package/dist/Editor/themeSettings/ActiveTheme.js +0 -72
  137. package/dist/Editor/themeSettings/buttons/index.js +0 -290
  138. package/dist/Editor/themeSettings/buttons/style.js +0 -23
  139. package/dist/Editor/themeSettings/colorTheme/index.js +0 -309
  140. package/dist/Editor/themeSettings/colorTheme/style.js +0 -81
  141. package/dist/Editor/themeSettings/fonts/PreviewElement.js +0 -121
  142. package/dist/Editor/themeSettings/fonts/index.js +0 -240
  143. package/dist/Editor/themeSettings/fonts/style.js +0 -62
  144. package/dist/Editor/themeSettings/icons.js +0 -60
  145. package/dist/Editor/themeSettings/index.js +0 -361
  146. package/dist/Editor/themeSettings/style.js +0 -292
  147. package/dist/Editor/themeSettingsAI/icons.js +0 -96
  148. package/dist/Editor/themeSettingsAI/index.js +0 -355
  149. package/dist/Editor/themeSettingsAI/saveTheme.js +0 -202
  150. package/dist/Editor/themeSettingsAI/style.js +0 -324
@@ -15,9 +15,6 @@ import Workflow from "./Workflow";
15
15
  import { getTRBLBreakPoints, getBreakPointsValue, groupByBreakpoint } from "../../helper/theme";
16
16
  import { validation } from "./FormElements/validations";
17
17
  import Icon from "../../common/Icon";
18
- import useCommonStyle from "../../commonStyle";
19
- import { useEditorContext } from "../../hooks/useMouseMove";
20
- import { UploadIconCloud } from "../../common/iconListV2";
21
18
  import { jsx as _jsx } from "react/jsx-runtime";
22
19
  import { jsxs as _jsxs } from "react/jsx-runtime";
23
20
  const Form = props => {
@@ -79,10 +76,6 @@ const Form = props => {
79
76
  const [formHeight, setFormHeight] = useState();
80
77
  const [formWidth, setFormWidth] = useState();
81
78
  const path = ReactEditor.findPath(editor, element);
82
- const {
83
- theme: appTheme
84
- } = useEditorContext();
85
- const classes = useCommonStyle(appTheme);
86
79
  useEffect(() => {
87
80
  setFormHeight(formEle?.current?.clientHeight);
88
81
  setFormWidth(formEle?.current?.clientWidth);
@@ -388,194 +381,188 @@ const Form = props => {
388
381
  }
389
382
  }, theme)
390
383
  };
391
- return /*#__PURE__*/_jsx(Grid, {
392
- sx: classes?.formStyles,
393
- children: /*#__PURE__*/_jsxs("div", {
394
- ...attributes,
395
- className: "form-wrapper element-root",
396
- style: {
397
- border: !readOnly ? "none" : "none",
398
- padding: "10px",
399
- width: "100%"
384
+ return /*#__PURE__*/_jsxs("div", {
385
+ ...attributes,
386
+ className: "form-wrapper element-root",
387
+ style: {
388
+ border: !readOnly ? "none" : "none",
389
+ padding: "10px",
390
+ width: "100%"
391
+ },
392
+ onMouseOver: onMouseOver,
393
+ onMouseLeave: onMouseLeave,
394
+ children: [/*#__PURE__*/_jsxs(Box, {
395
+ component: "form",
396
+ id: `${formName}`,
397
+ onSubmit: handleSubmit,
398
+ sx: {
399
+ color: textColor || "#FFF",
400
+ borderColor: borderColor || "transparent",
401
+ borderWidth: borderWidth || "1px",
402
+ display: submittedSuccessfully ? "none" : "block",
403
+ borderStyle: borderStyle || "solid",
404
+ background: bgColor || "transparent",
405
+ position: "relative",
406
+ lineHeight: 1.43,
407
+ ...formSX
400
408
  },
401
- onMouseOver: onMouseOver,
402
- onMouseLeave: onMouseLeave,
403
- children: [/*#__PURE__*/_jsxs(Box, {
404
- component: "form",
405
- id: `${formName}`,
406
- onSubmit: handleSubmit,
407
- sx: {
408
- color: textColor || "#FFF",
409
- borderColor: borderColor || "transparent",
410
- borderWidth: borderWidth || "1px",
411
- display: submittedSuccessfully ? "none" : "block",
412
- borderStyle: borderStyle || "solid",
413
- background: bgColor || "transparent",
414
- position: "relative",
415
- lineHeight: 1.43,
416
- ...formSX
417
- },
418
- ref: formEle,
419
- children: [/*#__PURE__*/_jsx(Grid, {
420
- className: "form-grid",
421
- item: true,
422
- xs: 12,
423
- children: /*#__PURE__*/_jsxs(Grid, {
424
- container: true,
425
- spacing: 2,
426
- sx: {
427
- justifyContent: alignment?.horizantal || "start"
409
+ ref: formEle,
410
+ children: [/*#__PURE__*/_jsx(Grid, {
411
+ className: "form-grid",
412
+ item: true,
413
+ xs: 12,
414
+ children: /*#__PURE__*/_jsxs(Grid, {
415
+ container: true,
416
+ spacing: 2,
417
+ sx: {
418
+ justifyContent: alignment?.horizantal || "start"
419
+ },
420
+ children: [/*#__PURE__*/_jsx("legend", {
421
+ style: {
422
+ fontSize: `${textSize}px` || "inherit",
423
+ fontFamily: fontFamily || "PoppinsRegular",
424
+ textAlign: textAlign || "left",
425
+ width: "100%"
428
426
  },
429
- children: [/*#__PURE__*/_jsx("legend", {
430
- style: {
431
- fontSize: `${textSize}px` || "inherit",
432
- fontFamily: fontFamily || "PoppinsRegular",
433
- textAlign: textAlign || "left",
434
- width: "100%"
435
- },
436
- children: formTitle
437
- }), children, /*#__PURE__*/_jsx(Grid, {
438
- item: true,
439
- ...buttonProps?.grid,
440
- className: "form-btn-wrpr",
441
- contentEditable: false,
442
- style: {
443
- display: "flex",
444
- justifyContent: btnAlign?.horizantal || "start",
445
- alignItems: btnAlign?.vertical || "start"
427
+ children: formTitle
428
+ }), children, /*#__PURE__*/_jsx(Grid, {
429
+ item: true,
430
+ ...buttonProps?.grid,
431
+ className: "form-btn-wrpr",
432
+ contentEditable: false,
433
+ style: {
434
+ display: "flex",
435
+ justifyContent: btnAlign?.horizantal || "start",
436
+ alignItems: btnAlign?.vertical || "start"
437
+ },
438
+ children: /*#__PURE__*/_jsx(Box, {
439
+ component: "button",
440
+ onClick: onSubmitClick,
441
+ disabled: loading,
442
+ sx: {
443
+ background: buttonProps?.bgColor || "rgb(30, 75, 122)",
444
+ borderWidth: "1px",
445
+ borderBlockStyle: "solid",
446
+ ...btnBorderStyle,
447
+ ...buttonSX,
448
+ color: `${buttonProps?.textColor || "#FFFFFF"}`,
449
+ fontSize: buttonProps?.textSize || "inherit",
450
+ height: "fit-content",
451
+ fontFamily: buttonProps?.fontFamily || "PoppinsRegular",
452
+ width: buttonProps?.fullWidth ? "100%" : "auto"
446
453
  },
447
- children: /*#__PURE__*/_jsx(Box, {
448
- component: "button",
449
- onClick: onSubmitClick,
450
- disabled: loading,
451
- sx: {
452
- background: buttonProps?.bgColor || "#2563EB",
453
- borderWidth: "1px",
454
- borderBlockStyle: "solid",
455
- borderRadius: `${buttonProps?.borderRadius || "8px"}`,
456
- ...btnBorderStyle,
457
- ...buttonSX,
458
- color: `${buttonProps?.textColor || "#FFFFFF"}`,
459
- fontSize: buttonProps?.textSize || "inherit",
460
- height: "fit-content",
461
- fontFamily: buttonProps?.fontFamily || "Inter, sans-serif",
462
- width: buttonProps?.fullWidth ? "100%" : "auto",
463
- borderColor: `${buttonProps?.borderColor || "transparent"}`
464
- },
465
- children: buttonProps?.label || "Submit"
466
- })
467
- })]
468
- })
469
- }), !readOnly && showOptions && /*#__PURE__*/_jsx(FormToolbar, {}), loading && /*#__PURE__*/_jsx("div", {
454
+ children: buttonProps?.label || "Submit"
455
+ })
456
+ })]
457
+ })
458
+ }), !readOnly && showOptions && /*#__PURE__*/_jsx(FormToolbar, {}), loading && /*#__PURE__*/_jsx("div", {
459
+ style: {
460
+ position: "absolute",
461
+ top: 0,
462
+ left: 0,
463
+ width: "100%",
464
+ height: "100%",
465
+ background: "rgba(255,255,255,0.5)"
466
+ },
467
+ children: /*#__PURE__*/_jsx(CircularProgress, {
470
468
  style: {
471
469
  position: "absolute",
472
- top: 0,
473
470
  left: 0,
474
- width: "100%",
475
- height: "100%",
476
- background: "rgba(255,255,255,0.5)"
477
- },
478
- children: /*#__PURE__*/_jsx(CircularProgress, {
479
- style: {
480
- position: "absolute",
481
- left: 0,
482
- right: 0,
483
- top: 0,
484
- bottom: 0,
485
- margin: "auto"
486
- }
487
- })
488
- })]
489
- }), /*#__PURE__*/_jsx(Grid, {
490
- item: true,
491
- sx: {
492
- display: submittedSuccessfully ? "flex" : "none"
493
- },
494
- contentEditable: false,
471
+ right: 0,
472
+ top: 0,
473
+ bottom: 0,
474
+ margin: "auto"
475
+ }
476
+ })
477
+ })]
478
+ }), /*#__PURE__*/_jsx(Grid, {
479
+ item: true,
480
+ sx: {
481
+ display: submittedSuccessfully ? "flex" : "none"
482
+ },
483
+ contentEditable: false,
484
+ children: /*#__PURE__*/_jsx(Grid, {
485
+ container: true,
486
+ alignItems: "center",
487
+ justifyContent: "center",
488
+ spacing: 2,
495
489
  children: /*#__PURE__*/_jsx(Grid, {
496
- container: true,
497
- alignItems: "center",
498
- justifyContent: "center",
499
- spacing: 2,
500
- children: /*#__PURE__*/_jsx(Grid, {
501
- item: true,
502
- children: /*#__PURE__*/_jsxs(Typography, {
503
- sx: {
504
- color: textColor || "#A2A9B4",
505
- borderColor: borderColor || "transparent",
506
- borderWidth: borderWidth || "1px",
507
- borderStyle: borderStyle || "solid",
508
- background: bgColor || "transparent",
509
- minHeight: `${formHeight}px`,
510
- minWidth: `${formWidth}px`,
511
- display: "flex",
512
- alignItems: "center",
513
- justifyContent: "center",
514
- textAlign: "center",
515
- position: "relative",
516
- ...formTypoSX
490
+ item: true,
491
+ children: /*#__PURE__*/_jsxs(Typography, {
492
+ sx: {
493
+ color: textColor || "#A2A9B4",
494
+ borderColor: borderColor || "transparent",
495
+ borderWidth: borderWidth || "1px",
496
+ borderStyle: borderStyle || "solid",
497
+ background: bgColor || "transparent",
498
+ minHeight: `${formHeight}px`,
499
+ minWidth: `${formWidth}px`,
500
+ display: "flex",
501
+ alignItems: "center",
502
+ justifyContent: "center",
503
+ textAlign: "center",
504
+ position: "relative",
505
+ ...formTypoSX
506
+ },
507
+ children: ["Form Submitted Successfully...!", /*#__PURE__*/_jsx("span", {
508
+ style: {
509
+ paddingLeft: "10px"
517
510
  },
518
- children: ["Form Submitted Successfully...!", /*#__PURE__*/_jsx("span", {
519
- style: {
520
- paddingLeft: "10px"
521
- },
522
- children: /*#__PURE__*/_jsx(IconButton, {
523
- onClick: handleCloseMessage,
524
- children: /*#__PURE__*/_jsx(Icon, {
525
- icon: "closeIcon"
526
- })
511
+ children: /*#__PURE__*/_jsx(IconButton, {
512
+ onClick: handleCloseMessage,
513
+ children: /*#__PURE__*/_jsx(Icon, {
514
+ icon: "closeIcon"
527
515
  })
528
- })]
529
- })
516
+ })
517
+ })]
530
518
  })
531
519
  })
532
- }), openSetttings ? /*#__PURE__*/_jsx(FormPopup, {
533
- element: element,
534
- onSave: onSave,
535
- onClose: onClose,
536
- customProps: customProps,
537
- translation: translation
538
- }) : null, /*#__PURE__*/_jsx(Workflow, {
539
- openWorkflow: openWorkflow,
540
- element: element,
541
- closeWorkflow: closeWorkflow,
542
- onSave: onSave,
543
- customProps: customProps
544
- }), !readOnly && !isIframe ? /*#__PURE__*/_jsxs(Menu, {
545
- className: "editor-btn-options",
546
- open: anchorEl !== null,
547
- anchorEl: anchorEl,
548
- onClose: handleClose,
549
- contentEditable: false,
550
- sx: classes?.formMenuStyle,
551
- children: [/*#__PURE__*/_jsx(MenuItem, {
552
- onClick: onMenuClick("edit"),
553
- children: /*#__PURE__*/_jsx(Tooltip, {
554
- title: translation("Button Settings"),
555
- arrow: true,
556
- children: /*#__PURE__*/_jsx(IconButton, {
557
- children: /*#__PURE__*/_jsx(GridSettingsIcon, {})
558
- })
520
+ })
521
+ }), openSetttings ? /*#__PURE__*/_jsx(FormPopup, {
522
+ element: element,
523
+ onSave: onSave,
524
+ onClose: onClose,
525
+ customProps: customProps,
526
+ translation: translation
527
+ }) : null, /*#__PURE__*/_jsx(Workflow, {
528
+ openWorkflow: openWorkflow,
529
+ element: element,
530
+ closeWorkflow: closeWorkflow,
531
+ onSave: onSave,
532
+ customProps: customProps
533
+ }), !readOnly && !isIframe ? /*#__PURE__*/_jsxs(Menu, {
534
+ className: "editor-btn-options",
535
+ open: anchorEl !== null,
536
+ anchorEl: anchorEl,
537
+ onClose: handleClose,
538
+ contentEditable: false,
539
+ children: [/*#__PURE__*/_jsx(MenuItem, {
540
+ onClick: onMenuClick("edit"),
541
+ children: /*#__PURE__*/_jsx(Tooltip, {
542
+ title: translation("Button Settings"),
543
+ arrow: true,
544
+ children: /*#__PURE__*/_jsx(IconButton, {
545
+ children: /*#__PURE__*/_jsx(GridSettingsIcon, {})
559
546
  })
560
- }), /*#__PURE__*/_jsx(MenuItem, {
561
- onClick: onMenuClick("test"),
562
- children: /*#__PURE__*/_jsx(Tooltip, {
563
- title: translation("Test Submit"),
564
- arrow: true,
565
- children: /*#__PURE__*/_jsx(IconButton, {
566
- children: /*#__PURE__*/_jsx(UploadIconCloud, {})
567
- })
547
+ })
548
+ }), /*#__PURE__*/_jsx(MenuItem, {
549
+ onClick: onMenuClick("test"),
550
+ children: /*#__PURE__*/_jsx(Tooltip, {
551
+ title: translation("Test Submit"),
552
+ arrow: true,
553
+ children: /*#__PURE__*/_jsx(IconButton, {
554
+ children: /*#__PURE__*/_jsx(BackupIcon, {})
568
555
  })
569
- })]
570
- }) : null, editButton && /*#__PURE__*/_jsx(ButtonPopup, {
571
- element: buttonProps || {},
572
- onSave: onSaveButtonSettings,
573
- onClose: onCloseButtonSettings,
574
- customProps: customProps,
575
- style: formButtonStyle,
576
- styleName: "formButtonStyle"
556
+ })
577
557
  })]
578
- })
558
+ }) : null, editButton && /*#__PURE__*/_jsx(ButtonPopup, {
559
+ element: buttonProps || {},
560
+ onSave: onSaveButtonSettings,
561
+ onClose: onCloseButtonSettings,
562
+ customProps: customProps,
563
+ style: formButtonStyle,
564
+ styleName: "formButtonStyle"
565
+ })]
579
566
  });
580
567
  };
581
568
  export default Form;
@@ -1,7 +1,6 @@
1
1
  import React from "react";
2
2
  import { Box } from "@mui/material";
3
- import { getTRBLBreakPoints, getBreakPointsValue, groupByBreakpoint } from "../../../helper/theme";
4
- import { useTheme } from "@emotion/react";
3
+ import { getTRBLBreakPoints, getBreakPointsValue } from "../../../helper/theme";
5
4
  import { jsx as _jsx } from "react/jsx-runtime";
6
5
  const FormText = props => {
7
6
  const {
@@ -20,26 +19,11 @@ const FormText = props => {
20
19
  textSize,
21
20
  fontFamily,
22
21
  fontWeight,
23
- marginSpacing,
24
22
  ...rest
25
23
  } = fieldProps;
26
24
  const onChange = e => {
27
25
  e.preventDefault();
28
26
  };
29
- const theme = useTheme();
30
- const buttonSX = {
31
- ...groupByBreakpoint({
32
- borderRadius: {
33
- ...getBreakPointsValue(borderRadius || {}, null, "overrideBorderRadius", true)
34
- },
35
- padding: {
36
- ...getTRBLBreakPoints(bannerSpacing)
37
- },
38
- margin: {
39
- ...getTRBLBreakPoints(marginSpacing)
40
- }
41
- }, theme)
42
- };
43
27
  return /*#__PURE__*/_jsx("div", {
44
28
  style: {
45
29
  width: "100%",
@@ -56,17 +40,16 @@ const FormText = props => {
56
40
  padding: {
57
41
  ...getTRBLBreakPoints(bannerSpacing)
58
42
  },
59
- height: height && `${height} !important`,
60
- borderColor: borderColor && `${borderColor} !important`,
43
+ height: height || "auto",
44
+ borderColor: borderColor || "transparent",
61
45
  borderWidth: borderWidth || "1px",
62
46
  borderRadius: {
63
47
  ...getBreakPointsValue(borderRadius || {}, null, "overrideBorderRadius", true)
64
48
  },
65
- ...buttonSX,
66
49
  borderStyle: borderStyle || "solid",
67
- color: textColor && `${textColor} !important`,
68
- background: bgColor && `${bgColor} !important`,
69
- fontSize: textSize && `${textSize} !important`,
50
+ color: textColor || "#000",
51
+ background: bgColor || "transparent",
52
+ fontSize: textSize || "inherit",
70
53
  fontFamily: fontFamily || "PoppinsRegular",
71
54
  fontWeight: `${fontWeight} !important` || "400 !important"
72
55
  }
@@ -35,13 +35,12 @@ const FormTextArea = props => {
35
35
  onChange: onChange,
36
36
  sx: {
37
37
  width: "100%",
38
- borderWidth: "1px",
39
- borderBlockStyle: "solid",
38
+ border: `1px solid ${borderColor || "#FFF"}`,
40
39
  padding: {
41
40
  ...getTRBLBreakPoints(bannerSpacing)
42
41
  },
43
42
  height: height || "150px",
44
- borderColor: borderColor && `${borderColor} !important`,
43
+ borderColor: `${borderColor || "transparent"} !important`,
45
44
  borderWidth: borderWidth || "1px",
46
45
  borderRadius: {
47
46
  ...getBreakPointsValue(borderRadius || {}, null, "overrideBorderRadius", true)
@@ -1,15 +1,12 @@
1
1
  import React, { useState } from "react";
2
- import { Transforms } from "slate";
2
+ import { Transforms, Node } from "slate";
3
3
  import { useSlateStatic, ReactEditor } from "slate-react";
4
4
  import { IconButton, Tooltip, Grid, useTheme } from "@mui/material";
5
+ import DeleteIcon from "@mui/icons-material/Delete";
6
+ import SettingsIcon from "@mui/icons-material/Settings";
5
7
  import FormElements from "./FormElements";
6
8
  import FieldPopup from "./FieldPopup";
7
9
  import { getBreakPointsValue, groupByBreakpoint } from "../../helper/theme";
8
- import { DeleteIcon } from "../../assets/svg/AIIcons";
9
- import { SettingsIcon } from "../../assets/svg/TableIcons";
10
- import { useEditorContext } from "../../hooks/useMouseMove";
11
- import useCommonStyle from "../../commonStyle";
12
- import { getNode } from "../../utils/helper";
13
10
  import { jsx as _jsx } from "react/jsx-runtime";
14
11
  import { jsxs as _jsxs } from "react/jsx-runtime";
15
12
  const FormField = props => {
@@ -36,15 +33,11 @@ const FormField = props => {
36
33
  const formPath = path.slice(0, path.length - 1);
37
34
  const {
38
35
  metadatamapping
39
- } = getNode(editor, formPath) || {};
36
+ } = Node?.get(editor, formPath) || {};
40
37
  const updatedElement = {
41
38
  ...element,
42
39
  metadatamapping
43
40
  };
44
- const {
45
- theme: appTheme
46
- } = useEditorContext();
47
- const classes = useCommonStyle(appTheme);
48
41
  const [openSetttings, setOpenSettings] = useState(false);
49
42
  const onSettings = () => {
50
43
  setOpenSettings(true);
@@ -84,6 +77,7 @@ const FormField = props => {
84
77
  top: "24px",
85
78
  bottom: 0,
86
79
  margin: "auto",
80
+ height: "42px",
87
81
  zIndex: 101
88
82
  },
89
83
  children: [/*#__PURE__*/_jsx(Tooltip, {
@@ -116,8 +110,7 @@ const FormField = props => {
116
110
  className: "form-field",
117
111
  sx: {
118
112
  position: "relative",
119
- ...fieldSX,
120
- ...classes?.fieldBtnSettings
113
+ ...fieldSX
121
114
  },
122
115
  children: [!readOnly && /*#__PURE__*/_jsx(FieldToolbar, {}), /*#__PURE__*/_jsx(FormElement, {
123
116
  fieldProps: elementProps
@@ -9,20 +9,20 @@ const FormStyles = theme => ({
9
9
  color: "#94A3B8"
10
10
  },
11
11
  bodyTextArea: {
12
- "& .mini-editor-cls": {
13
- padding: "12px",
14
- "&:focus-visible": {
15
- outline: "none",
16
- border: "none"
12
+ '& .mini-editor-cls': {
13
+ padding: '12px',
14
+ '&:focus-visible': {
15
+ outline: 'none',
16
+ border: 'none'
17
17
  }
18
18
  },
19
19
  "& .editorWorkflow": {
20
- minHeight: "130px",
21
- padding: "12px",
20
+ minHeight: '130px',
21
+ padding: '12px',
22
22
  paddingBottom: 0,
23
- "&:focus-visible": {
24
- outline: "none",
25
- border: "none"
23
+ '&:focus-visible': {
24
+ outline: 'none',
25
+ border: 'none'
26
26
  }
27
27
  }
28
28
  },
@@ -105,7 +105,7 @@ const FormStyles = theme => ({
105
105
  padding: "4px 22px",
106
106
  textTransform: "none",
107
107
  border: "1px solid #D8DDE1",
108
- minWidth: "126px",
108
+ minWidth: '126px',
109
109
  "& svg": {
110
110
  "& path": {
111
111
  stroke: "#64748B"
@@ -169,19 +169,17 @@ const FormStyles = theme => ({
169
169
  }
170
170
  },
171
171
  colorButtonSingle: {
172
- border: "1.5px solid #DCE4EC !important",
173
172
  "&.active": {
174
- // "&:before": {
175
- // content: '" "',
176
- // position: "absolute",
177
- // top: "-5px",
178
- // left: "-5px",
179
- // width: "calc(100% + 4px)",
180
- // height: "calc(100% + 4px)",
181
- // border: "3px solid blue",
182
- // borderRadius: "50%",
183
- // },
184
- outline: "2px solid #2563EB"
173
+ "&:before": {
174
+ content: '" "',
175
+ position: "absolute",
176
+ top: "-5px",
177
+ left: "-5px",
178
+ width: "calc(100% + 4px)",
179
+ height: "calc(100% + 4px)",
180
+ border: "3px solid blue",
181
+ borderRadius: "50%"
182
+ }
185
183
  }
186
184
  },
187
185
  colorButtonsInner: {
@@ -251,7 +249,7 @@ const FormStyles = theme => ({
251
249
  }
252
250
  },
253
251
  root: {
254
- padding: "10px"
252
+ padding: '10px'
255
253
  }
256
254
  });
257
255
  export default FormStyles;
@@ -21,6 +21,7 @@ import { FORM_NODE } from "../../utils/form";
21
21
  import { DEFAULT_TABLE_NODE } from "../../utils/table";
22
22
  import itemOptions from "./Options/sectionItemOptions";
23
23
  import { getBreakPointsValue, groupByBreakpoint } from "../../helper/theme";
24
+ import { useDebouncedCallback } from "use-debounce";
24
25
  import { jsx as _jsx } from "react/jsx-runtime";
25
26
  import { jsxs as _jsxs } from "react/jsx-runtime";
26
27
  const MAX_DEVICE_WIDTH = {
@@ -34,15 +35,11 @@ export const useFreeGrid = () => {
34
35
  return useContext(FreeGridContext);
35
36
  };
36
37
  const FreeGrid = props => {
37
- const {
38
- theme: appTheme
39
- } = useEditorContext();
40
38
  const theme = useTheme();
41
39
  const breakpoint = useBreakpoints(theme);
42
40
  const classes = useFreeGridStyles({
43
41
  theme,
44
- MAX_DEVICE_WIDTH: MAX_DEVICE_WIDTH[breakpoint],
45
- appTheme
42
+ MAX_DEVICE_WIDTH: MAX_DEVICE_WIDTH[breakpoint]
46
43
  });
47
44
  const editor = useSlateStatic();
48
45
  const {
@@ -79,6 +76,9 @@ const FreeGrid = props => {
79
76
  const count = useRef(2);
80
77
  const childrenCountRef = useRef(element?.children?.length);
81
78
  const [isInteracting, setIsInteracting] = useState(false);
79
+ const debouncedStopInteraction = useDebouncedCallback(() => {
80
+ setIsInteracting(false);
81
+ }, 500);
82
82
  const onChange = data => {
83
83
  const append = breakpoint === "lg" ? "" : `_${breakpoint}`;
84
84
  const updateData = {
@@ -210,6 +210,20 @@ const FreeGrid = props => {
210
210
  linkType: "webAddress"
211
211
  },
212
212
  iconPosition: "start",
213
+ bgColor: "#2563EB",
214
+ textColor: "#FFF",
215
+ borderRadius: {
216
+ topLeft: 30,
217
+ topRight: 30,
218
+ bottomLeft: 30,
219
+ bottomRight: 30
220
+ },
221
+ bannerSpacing: {
222
+ left: 12,
223
+ top: 12,
224
+ right: 12,
225
+ bottom: 12
226
+ },
213
227
  textAlign: "center",
214
228
  label: "Get Started"
215
229
  }],
@@ -480,7 +494,11 @@ const FreeGrid = props => {
480
494
  return /*#__PURE__*/_jsx(FreeGridContext.Provider, {
481
495
  value: {
482
496
  isInteracting,
483
- setIsInteracting
497
+ handleStart: () => {
498
+ setIsInteracting(true);
499
+ debouncedStopInteraction.cancel();
500
+ },
501
+ handleStop: debouncedStopInteraction
484
502
  },
485
503
  children: /*#__PURE__*/_jsx(RnD, {
486
504
  id: `freegrid_container_${path.join("|")}_${updated_at}_${breakpoint}`,