@flozy/editor 3.7.9 → 3.8.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (97) hide show
  1. package/dist/Editor/CommonEditor.js +111 -169
  2. package/dist/Editor/Editor.css +12 -1
  3. package/dist/Editor/Elements/AI/AIInput.js +5 -16
  4. package/dist/Editor/Elements/AI/PopoverAIInput.js +17 -31
  5. package/dist/Editor/Elements/AI/Styles.js +1 -2
  6. package/dist/Editor/Elements/Accordion/Accordion.js +7 -74
  7. package/dist/Editor/Elements/Accordion/AccordionBtnPopup.js +2 -3
  8. package/dist/Editor/Elements/Accordion/AccordionSummary.js +74 -7
  9. package/dist/Editor/Elements/AppHeader/AppHeader.js +4 -26
  10. package/dist/Editor/Elements/Button/EditorButton.js +16 -28
  11. package/dist/Editor/Elements/Color Picker/ColorButtons.js +17 -60
  12. package/dist/Editor/Elements/Color Picker/ColorPicker.css +1 -25
  13. package/dist/Editor/Elements/Color Picker/ColorPicker.js +4 -4
  14. package/dist/Editor/Elements/Color Picker/Styles.js +1 -2
  15. package/dist/Editor/Elements/Embed/Image.js +20 -28
  16. package/dist/Editor/Elements/Embed/Video.js +11 -15
  17. package/dist/Editor/Elements/Form/Workflow/UserInputs.js +1 -2
  18. package/dist/Editor/Elements/Grid/Grid.js +0 -2
  19. package/dist/Editor/Elements/Grid/GridItem.js +1 -3
  20. package/dist/Editor/Elements/Link/Link.js +1 -6
  21. package/dist/Editor/Elements/Link/LinkButton.js +2 -4
  22. package/dist/Editor/Elements/Link/LinkPopup.js +3 -11
  23. package/dist/Editor/Elements/Table/Table.js +1 -1
  24. package/dist/Editor/Elements/Table/TableCell.js +1 -1
  25. package/dist/Editor/MiniEditor.js +1 -3
  26. package/dist/Editor/Toolbar/Basic/index.js +2 -4
  27. package/dist/Editor/Toolbar/FormatTools/Dropdown.js +2 -26
  28. package/dist/Editor/Toolbar/FormatTools/MarkButton.js +2 -2
  29. package/dist/Editor/Toolbar/FormatTools/TextSize.js +11 -5
  30. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectFontSize.js +11 -4
  31. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectTypography.js +86 -213
  32. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/index.js +1 -2
  33. package/dist/Editor/Toolbar/PopupTool/PopupToolStyle.js +13 -20
  34. package/dist/Editor/Toolbar/PopupTool/TextFormat.js +7 -52
  35. package/dist/Editor/Toolbar/PopupTool/index.js +5 -6
  36. package/dist/Editor/Toolbar/toolbarGroups.js +6 -48
  37. package/dist/Editor/assets/svg/AIIcons.js +1 -153
  38. package/dist/Editor/common/ColorPickerButton.js +9 -25
  39. package/dist/Editor/common/DnD/DragHandleButton.js +1 -1
  40. package/dist/Editor/common/Icon.js +2 -30
  41. package/dist/Editor/common/LinkSettings/NavComponents.js +2 -5
  42. package/dist/Editor/common/LinkSettings/index.js +1 -2
  43. package/dist/Editor/common/LinkSettings/navOptions.js +2 -7
  44. package/dist/Editor/common/MentionsPopup/Styles.js +2 -5
  45. package/dist/Editor/common/Shorthands/elements.js +0 -54
  46. package/dist/Editor/common/StyleBuilder/accordionTitleBtnStyle.js +7 -7
  47. package/dist/Editor/common/StyleBuilder/accordionTitleStyle.js +16 -16
  48. package/dist/Editor/common/StyleBuilder/buttonStyle.js +2 -4
  49. package/dist/Editor/common/StyleBuilder/fieldTypes/bannerSpacing.js +29 -33
  50. package/dist/Editor/common/StyleBuilder/fieldTypes/borderRadius.js +25 -31
  51. package/dist/Editor/common/StyleBuilder/fieldTypes/buttonLink.js +1 -1
  52. package/dist/Editor/common/StyleBuilder/fieldTypes/color.js +7 -31
  53. package/dist/Editor/common/StyleBuilder/fieldTypes/fontSize.js +4 -13
  54. package/dist/Editor/common/StyleBuilder/fieldTypes/textOptions.js +4 -14
  55. package/dist/Editor/common/StyleBuilder/index.js +1 -1
  56. package/dist/Editor/helper/theme.js +4 -189
  57. package/dist/Editor/hooks/useMouseMove.js +2 -4
  58. package/dist/Editor/plugins/withEmbeds.js +1 -1
  59. package/dist/Editor/plugins/withHTML.js +5 -47
  60. package/dist/Editor/plugins/withLayout.js +10 -15
  61. package/dist/Editor/plugins/withTable.js +2 -2
  62. package/dist/Editor/theme/ThemeList.js +173 -50
  63. package/dist/Editor/utils/SlateUtilityFunctions.js +25 -157
  64. package/dist/Editor/utils/button.js +17 -1
  65. package/dist/Editor/utils/events.js +4 -11
  66. package/dist/Editor/utils/font.js +37 -40
  67. package/dist/Editor/utils/helper.js +13 -73
  68. package/package.json +1 -2
  69. package/dist/Editor/Elements/AI/VoiceToText/AudioWave.js +0 -73
  70. package/dist/Editor/Elements/AI/VoiceToText/index.js +0 -167
  71. package/dist/Editor/Elements/AI/VoiceToText/style.js +0 -40
  72. package/dist/Editor/Elements/Link/LinkPopupStyles.js +0 -28
  73. package/dist/Editor/Toolbar/PopupTool/ThemeTextFormat.js +0 -438
  74. package/dist/Editor/assets/svg/ThemeIcons.js +0 -291
  75. package/dist/Editor/common/CustomColorPicker/index.js +0 -106
  76. package/dist/Editor/common/CustomColorPicker/style.js +0 -53
  77. package/dist/Editor/common/CustomDialog/index.js +0 -94
  78. package/dist/Editor/common/CustomDialog/style.js +0 -67
  79. package/dist/Editor/common/CustomSelect.js +0 -33
  80. package/dist/Editor/common/EditorCmds.js +0 -35
  81. package/dist/Editor/hooks/useEditorTheme.js +0 -139
  82. package/dist/Editor/theme/index.js +0 -144
  83. package/dist/Editor/themeSettings/ActiveTheme.js +0 -72
  84. package/dist/Editor/themeSettings/buttons/index.js +0 -290
  85. package/dist/Editor/themeSettings/buttons/style.js +0 -21
  86. package/dist/Editor/themeSettings/colorTheme/index.js +0 -290
  87. package/dist/Editor/themeSettings/colorTheme/style.js +0 -77
  88. package/dist/Editor/themeSettings/fonts/PreviewElement.js +0 -123
  89. package/dist/Editor/themeSettings/fonts/index.js +0 -213
  90. package/dist/Editor/themeSettings/fonts/style.js +0 -44
  91. package/dist/Editor/themeSettings/icons.js +0 -60
  92. package/dist/Editor/themeSettings/index.js +0 -320
  93. package/dist/Editor/themeSettings/style.js +0 -152
  94. package/dist/Editor/themeSettingsAI/icons.js +0 -96
  95. package/dist/Editor/themeSettingsAI/index.js +0 -356
  96. package/dist/Editor/themeSettingsAI/saveTheme.js +0 -190
  97. package/dist/Editor/themeSettingsAI/style.js +0 -247
@@ -1,5 +1,5 @@
1
1
  /* eslint-disable no-unused-vars */
2
- import React, { useRef, useCallback, useEffect, useMemo, useState, forwardRef, useImperativeHandle, createContext } from "react";
2
+ import React, { useRef, useCallback, useEffect, useMemo, useState, forwardRef, useImperativeHandle } from "react";
3
3
  import { createEditor, Transforms } from "slate";
4
4
  import { Slate, Editable, ReactEditor } from "slate-react";
5
5
  import { useDebounce, useDebouncedCallback } from "use-debounce";
@@ -18,7 +18,7 @@ import { getThumbnailImage, invertColor } from "./helper";
18
18
  import PopupTool from "./Toolbar/PopupTool";
19
19
  import "./font.css";
20
20
  import "./Editor.css";
21
- import { Box, IconButton, Typography } from "@mui/material";
21
+ import { Box, Button, Typography } from "@mui/material";
22
22
  import Shorthands from "./common/Shorthands";
23
23
  import MiniToolbar from "./Toolbar/Mini/MiniToolbar";
24
24
  import { EditorProvider } from "./hooks/useMouseMove";
@@ -28,19 +28,12 @@ import DragAndDrop from "./common/DnD";
28
28
  import Section from "./common/Section";
29
29
  import "animate.css";
30
30
  import decorators from "./utils/Decorators";
31
- import { getTRBLBreakPoints, getVariableValue } from "./helper/theme";
32
- import { handleInsertLastElement, onDeleteKey, outsideEditorClickLabel } from "./utils/helper";
31
+ import { getTRBLBreakPoints } from "./helper/theme";
32
+ import { handleInsertLastElement, outsideEditorClickLabel } from "./utils/helper";
33
33
  import useWindowResize from "./hooks/useWindowResize";
34
- import { getTheme } from "./theme";
35
- import { useTheme } from "@emotion/react";
36
- import ThemeSettings from "./themeSettings";
37
- import ThemeSettingsAI from "./themeSettingsAI";
38
- import { Experimental_CssVarsProvider as CssVarsProvider, experimental_extendTheme as extendTheme } from "@mui/material/styles";
39
34
  import PopoverAIInput from "./Elements/AI/PopoverAIInput";
40
- import { ThemeAIIcon, ThemePaintIcon } from "./assets/svg/ThemeIcons";
41
35
  import { jsx as _jsx } from "react/jsx-runtime";
42
36
  import { jsxs as _jsxs } from "react/jsx-runtime";
43
- export const ThemeContext = /*#__PURE__*/createContext(null);
44
37
  const Item = /*#__PURE__*/forwardRef(({
45
38
  children,
46
39
  ...props
@@ -67,8 +60,7 @@ const Leaf = ({
67
60
  children,
68
61
  leaf
69
62
  }) => {
70
- const theme = useTheme();
71
- children = getMarked(leaf, children, theme);
63
+ children = getMarked(leaf, children);
72
64
  return /*#__PURE__*/_jsx("span", {
73
65
  ...attributes,
74
66
  children: children
@@ -87,8 +79,7 @@ const CommonEditor = /*#__PURE__*/forwardRef((props, ref) => {
87
79
  toolbarOptions,
88
80
  otherProps,
89
81
  isIframe,
90
- theme,
91
- showThemeButtons
82
+ theme
92
83
  } = props;
93
84
  const editorWrapper = useRef();
94
85
  const mentionsRef = useRef();
@@ -132,11 +123,10 @@ const CommonEditor = /*#__PURE__*/forwardRef((props, ref) => {
132
123
  const {
133
124
  bannerSpacing,
134
125
  pageBgImage,
135
- pageColor = "",
126
+ pageColor,
136
127
  color: pageTextColor,
137
128
  pageWidth,
138
- maxWidth: pageMaxWidth,
139
- theme: selectedTheme
129
+ maxWidth: pageMaxWidth
140
130
  } = pageSt?.pageProps || {
141
131
  bannerSpacing: {
142
132
  left: 0,
@@ -147,11 +137,9 @@ const CommonEditor = /*#__PURE__*/forwardRef((props, ref) => {
147
137
  };
148
138
  const classes = editorStyles({
149
139
  padHeight: !fullScreen ? otherProps?.padHeight : 20,
150
- placeHolderColor: invertColor(pageColor.startsWith("var") ? getVariableValue(pageColor) : pageColor || "#FFF"),
140
+ placeHolderColor: invertColor(pageColor || "#FFF"),
151
141
  theme
152
142
  });
153
- const [openTheme, setOpenTheme] = useState(false);
154
- const [openAITheme, setOpenAITheme] = useState(false);
155
143
  useEffect(() => {
156
144
  setValue(draftToSlate({
157
145
  data: content
@@ -251,12 +239,6 @@ const CommonEditor = /*#__PURE__*/forwardRef((props, ref) => {
251
239
  redo() {
252
240
  editor?.redo();
253
241
  },
254
- toggleTheme() {
255
- setOpenTheme(!openTheme);
256
- },
257
- toggleAITheme() {
258
- setOpenAITheme(!openAITheme);
259
- },
260
242
  getPageSettings: {
261
243
  background: pageBgImage && pageBgImage !== "none" ? `url(${pageBgImage})` : pageColor || ""
262
244
  }
@@ -337,8 +319,7 @@ const CommonEditor = /*#__PURE__*/forwardRef((props, ref) => {
337
319
  } else if (isCtrlKey) {
338
320
  commands({
339
321
  event,
340
- editor,
341
- needLayout
322
+ editor
342
323
  });
343
324
  } else if (event.key === "Tab") {
344
325
  event.preventDefault();
@@ -404,152 +385,113 @@ const CommonEditor = /*#__PURE__*/forwardRef((props, ref) => {
404
385
  }
405
386
  return style;
406
387
  }, [pageBgImage, pageColor]);
407
- const themeProps = getTheme(selectedTheme);
408
- return /*#__PURE__*/_jsx(ThemeContext.Provider, {
409
- value: {
410
- openTheme,
411
- setOpenTheme
412
- },
413
- children: /*#__PURE__*/_jsx(CssVarsProvider, {
414
- theme: extendTheme(selectedTheme?.theme?.cssVars || {}),
415
- children: /*#__PURE__*/_jsxs(EditorProvider, {
416
- theme: theme,
417
- editor: editor,
418
- children: [showThemeButtons ? /*#__PURE__*/_jsxs("div", {
419
- style: {
420
- display: "flex",
421
- justifyContent: "end",
422
- alignItems: "center",
423
- gap: "8px",
424
- width: "70vw",
425
- margin: "auto"
426
- },
427
- children: [/*#__PURE__*/_jsx(IconButton, {
428
- onClick: () => setOpenTheme(true),
429
- children: /*#__PURE__*/_jsx(ThemePaintIcon, {})
430
- }), /*#__PURE__*/_jsx(IconButton, {
431
- onClick: () => setOpenAITheme(true),
432
- style: {
433
- marginTop: "4px"
434
- },
435
- children: /*#__PURE__*/_jsx(ThemeAIIcon, {})
436
- })]
437
- }) : null, /*#__PURE__*/_jsx(DialogWrapper, {
438
- classes: classes,
439
- ...props,
440
- fullScreen: fullScreen,
441
- footer: footer || "",
442
- children: /*#__PURE__*/_jsx(Box, {
443
- component: "div",
444
- className: `${editorClass || ""} ${isIframe ? "iframe-editor" : ""}`,
445
- sx: classes.root,
446
- style: {
447
- ...dotBg
448
- },
449
- children: /*#__PURE__*/_jsxs(Slate, {
450
- editor: editor,
451
- initialValue: value,
452
- onChange: handleEditorChange,
453
- children: [/*#__PURE__*/_jsx(DragAndDrop, {
454
- children: /*#__PURE__*/_jsxs(Overlay, {
455
- children: [/*#__PURE__*/_jsx(Box, {
456
- className: `${hasTopBanner() ? "has-topbanner" : ""} ${!pageColor ? "no-color" : ""} ${isScrolling ? "" : "hideScroll"} scrollable-content scrollSmooth`,
457
- sx: classes.slateWrapper,
458
- id: "slate-wrapper-scroll-container"
459
- // style={editorWrapperStyle}
460
- ,
461
- ref: editorWrapper,
462
- onClick: e => {
463
- handleInsertLastElement(e, editor);
464
- },
465
- onScroll: handleScroll,
466
- style: editorWrapperStyle,
388
+ return /*#__PURE__*/_jsx(EditorProvider, {
389
+ theme: theme,
390
+ editor: editor,
391
+ children: /*#__PURE__*/_jsx(DialogWrapper, {
392
+ classes: classes,
393
+ ...props,
394
+ fullScreen: fullScreen,
395
+ footer: footer || "",
396
+ children: /*#__PURE__*/_jsx(Box, {
397
+ component: "div",
398
+ className: `${editorClass || ""} ${isIframe ? "iframe-editor" : ""}`,
399
+ sx: classes.root,
400
+ style: {
401
+ ...dotBg
402
+ },
403
+ children: /*#__PURE__*/_jsxs(Slate, {
404
+ editor: editor,
405
+ initialValue: value,
406
+ onChange: handleEditorChange,
407
+ children: [/*#__PURE__*/_jsx(DragAndDrop, {
408
+ children: /*#__PURE__*/_jsxs(Overlay, {
409
+ children: [/*#__PURE__*/_jsx(Box, {
410
+ className: `${hasTopBanner() ? "has-topbanner" : ""} ${!pageColor ? "no-color" : ""} ${isScrolling ? "" : "hideScroll"} scrollable-content scrollSmooth`,
411
+ sx: classes.slateWrapper,
412
+ id: "slate-wrapper-scroll-container"
413
+ // style={editorWrapperStyle}
414
+ ,
415
+ ref: editorWrapper,
416
+ onClick: e => {
417
+ handleInsertLastElement(e, editor);
418
+ },
419
+ onScroll: handleScroll,
420
+ style: editorWrapperStyle,
421
+ children: /*#__PURE__*/_jsxs(Box, {
422
+ component: "div",
423
+ className: "max-content",
424
+ "data-info": outsideEditorClickLabel,
425
+ children: [renderTopBanner(), /*#__PURE__*/_jsx("div", {
426
+ className: "scroll-area",
427
+ "data-info": outsideEditorClickLabel,
467
428
  children: /*#__PURE__*/_jsxs(Box, {
468
429
  component: "div",
469
- className: "max-content",
470
- sx: themeProps?.sxProps || {},
471
- "data-info": outsideEditorClickLabel,
472
- children: [renderTopBanner(), /*#__PURE__*/_jsx("div", {
473
- className: "scroll-area",
474
- "data-info": outsideEditorClickLabel,
475
- children: /*#__PURE__*/_jsxs(Box, {
476
- component: "div",
477
- className: `editor-wrapper ${pageWidth === "fixed" ? "fixed" : "full"}`,
478
- sx: {
479
- backgroundColor: "transparent",
480
- padding: {
481
- ...getTRBLBreakPoints(bannerSpacing)
482
- },
483
- width: !pageWidth || pageWidth === "fixed" ? fixedWidth : fullWidth,
484
- height: viewport.h ? `${viewport.h}px` : `100%`,
485
- alignSelf: "center",
486
- transformOrigin: "left top",
487
- transition: "all 0.3s",
488
- minHeight: "87%",
489
- maxWidth: pageMaxWidth ? `${parseInt(pageMaxWidth)}px !important` : "auto"
490
- },
491
- "data-info": outsideEditorClickLabel,
492
- children: [/*#__PURE__*/_jsx(Editable, {
493
- className: "innert-editor-textbox",
494
- readOnly: isReadOnly,
495
- renderElement: renderElement,
496
- renderLeaf: renderLeaf,
497
- decorate: decorators,
498
- onKeyDown: onKeyDown
499
- }), !readOnly ? /*#__PURE__*/_jsx(MentionsPopup, {
500
- ref: mentionsRef,
501
- mentions: mentions,
502
- setMentions: setMentions,
503
- editor: editor,
504
- target: target,
505
- index: index,
506
- chars: chars,
507
- type: type,
508
- theme: theme
509
- }) : null]
510
- })
511
- }), !hideMiniToolBar ? /*#__PURE__*/_jsx(MiniToolbar, {
512
- customProps: customProps,
513
- toolbarOptions: toolbarOptions,
514
- theme: theme
515
- }) : null, /*#__PURE__*/_jsx(PopoverAIInput, {
516
- otherProps: otherProps || {}
517
- }), footer && (fullScreen || readOnly) && /*#__PURE__*/_jsx(Typography, {
518
- sx: {
519
- color: "rgb(100, 116, 139)",
520
- fontSize: "13px",
521
- paddingBottom: hideMiniToolBar ? "0px" : "12px",
522
- cursor: "pointer"
430
+ className: `editor-wrapper ${pageWidth === "fixed" ? "fixed" : "full"}`,
431
+ sx: {
432
+ backgroundColor: "transparent",
433
+ padding: {
434
+ ...getTRBLBreakPoints(bannerSpacing)
523
435
  },
524
- align: "center",
525
- "data-info": outsideEditorClickLabel,
526
- onClick: handleFooterClick,
527
- children: footer
528
- }), openTheme ? /*#__PURE__*/_jsx(ThemeSettings, {
529
- open: openTheme,
530
- setOpen: setOpenTheme,
436
+ width: !pageWidth || pageWidth === "fixed" ? fixedWidth : fullWidth,
437
+ height: viewport.h ? `${viewport.h}px` : `100%`,
438
+ alignSelf: "center",
439
+ transformOrigin: "left top",
440
+ transition: "all 0.3s",
441
+ minHeight: "87%",
442
+ maxWidth: pageMaxWidth ? `${parseInt(pageMaxWidth)}px !important` : "auto"
443
+ },
444
+ "data-info": outsideEditorClickLabel,
445
+ children: [/*#__PURE__*/_jsx(Editable, {
446
+ className: "innert-editor-textbox",
447
+ readOnly: isReadOnly,
448
+ renderElement: renderElement,
449
+ renderLeaf: renderLeaf,
450
+ decorate: decorators,
451
+ onKeyDown: onKeyDown
452
+ }), !readOnly ? /*#__PURE__*/_jsx(MentionsPopup, {
453
+ ref: mentionsRef,
454
+ mentions: mentions,
455
+ setMentions: setMentions,
531
456
  editor: editor,
532
- services: otherProps?.services
533
- }) : null, /*#__PURE__*/_jsx(ThemeSettingsAI, {
534
- openAITheme: openAITheme,
535
- setOpenAITheme: setOpenAITheme,
536
- onSaveTheme: otherProps?.onSaveTheme
537
- })]
457
+ target: target,
458
+ index: index,
459
+ chars: chars,
460
+ type: type,
461
+ theme: theme
462
+ }) : null]
538
463
  })
539
- }), !readOnly ? /*#__PURE__*/_jsx(PopupTool, {
540
- onDrawerOpen: onDrawerOpen,
541
- theme: theme,
542
- setIsTextSelected: setIsTextSelected,
543
- customProps: customProps
544
- }) : null]
464
+ }), !hideMiniToolBar ? /*#__PURE__*/_jsx(MiniToolbar, {
465
+ customProps: customProps,
466
+ toolbarOptions: toolbarOptions,
467
+ theme: theme
468
+ }) : null, /*#__PURE__*/_jsx(PopoverAIInput, {
469
+ otherProps: otherProps || {}
470
+ }), footer && (fullScreen || readOnly) && /*#__PURE__*/_jsx(Typography, {
471
+ sx: {
472
+ color: "rgb(100, 116, 139)",
473
+ fontSize: "13px",
474
+ paddingBottom: hideMiniToolBar ? "0px" : "12px",
475
+ cursor: "pointer"
476
+ },
477
+ align: "center",
478
+ "data-info": outsideEditorClickLabel,
479
+ onClick: handleFooterClick,
480
+ children: footer
481
+ })]
545
482
  })
546
- }), htmlAction.showInput && /*#__PURE__*/_jsx(CodeToText, {
547
- ...htmlAction,
548
- handleCodeToText: handleCodeToText
549
- })]
550
- }, id)
551
- })
552
- })]
483
+ }), !readOnly ? /*#__PURE__*/_jsx(PopupTool, {
484
+ onDrawerOpen: onDrawerOpen,
485
+ theme: theme,
486
+ setIsTextSelected: setIsTextSelected,
487
+ customProps: customProps
488
+ }) : null]
489
+ })
490
+ }), htmlAction.showInput && /*#__PURE__*/_jsx(CodeToText, {
491
+ ...htmlAction,
492
+ handleCodeToText: handleCodeToText
493
+ })]
494
+ }, id)
553
495
  })
554
496
  })
555
497
  });
@@ -830,6 +830,17 @@ blockquote {
830
830
  text-align: center;
831
831
  }
832
832
 
833
+ .removeScroll::-webkit-outer-spin-button,
834
+ .removeScroll::-webkit-inner-spin-button {
835
+ -webkit-appearance: none;
836
+ margin: 0;
837
+ }
838
+
839
+ /* For Firefox */
840
+ .removeScroll {
841
+ -moz-appearance: textfield;
842
+ }
843
+
833
844
  .borderInput:focus-visible {
834
845
  outline: none !important;
835
846
  }
@@ -879,7 +890,7 @@ blockquote {
879
890
  }
880
891
 
881
892
  .sliderInput {
882
- width: 66px;
893
+ width: 30px;
883
894
  padding: 2px 10px;
884
895
  margin-left: 18px;
885
896
  box-shadow: 0px 4px 16px 0px #0000000d;
@@ -11,8 +11,6 @@ import CustomSelect from "./CustomSelect";
11
11
  import { editContentOptions, newContentOptions, generatedContentOptions } from "./helper";
12
12
  import useClickOutside from "../../hooks/useClickOutside";
13
13
  import { useEditorContext } from "../../hooks/useMouseMove";
14
- // import { VoiceToText } from "./VoiceToText";
15
- import { ChatMicIcon } from "../../assets/svg/AIIcons";
16
14
  import { jsx as _jsx } from "react/jsx-runtime";
17
15
  import { jsxs as _jsxs } from "react/jsx-runtime";
18
16
  import { Fragment as _Fragment } from "react/jsx-runtime";
@@ -38,13 +36,12 @@ function getProps(openAI, generatedText) {
38
36
  }
39
37
  function AIInput({
40
38
  onSend,
39
+ loading,
41
40
  generatedText,
42
41
  openAI,
43
42
  inputValue,
44
43
  onInputChange,
45
- onClickOutside,
46
- startRecording,
47
- ...rest
44
+ onClickOutside
48
45
  }, ref) {
49
46
  const {
50
47
  theme
@@ -70,7 +67,6 @@ function AIInput({
70
67
  clearTimeout(timeoutId);
71
68
  };
72
69
  }, [openAI]);
73
- const loading = rest?.loading || rest?.isAILoading;
74
70
  const isSendBtnDisabled = !inputValue || loading;
75
71
  const props = getProps(openAI, generatedText) || {};
76
72
  const fromToolBar = openAI === "fromToolBar";
@@ -136,25 +132,18 @@ function AIInput({
136
132
  handleSendBtnClick();
137
133
  }
138
134
  }
139
- }), fromToolBar ? null : /*#__PURE__*/_jsxs(Box, {
135
+ }), fromToolBar ? null : /*#__PURE__*/_jsx(Box, {
140
136
  component: "div",
141
137
  style: classes.sendIconContainer,
142
138
  className: "icons-elements",
143
- children: [/*#__PURE__*/_jsx(IconButton
144
- // sx={
145
- // isSendBtnDisabled ? classes.sendBtnDisabled : classes.sendBtn
146
- // }
147
- , {
148
- onClick: () => startRecording(),
149
- children: /*#__PURE__*/_jsx(ChatMicIcon, {})
150
- }), /*#__PURE__*/_jsx(IconButton, {
139
+ children: /*#__PURE__*/_jsx(IconButton, {
151
140
  sx: isSendBtnDisabled ? classes.sendBtnDisabled : classes.sendBtn,
152
141
  onClick: () => handleSendBtnClick(),
153
142
  children: /*#__PURE__*/_jsx(IoSend, {
154
143
  color: "#fff",
155
144
  size: 14
156
145
  })
157
- })]
146
+ })
158
147
  })]
159
148
  })]
160
149
  }), size.device === "xs" ? null : /*#__PURE__*/_jsx(Box, {
@@ -8,7 +8,6 @@ import { Editor, Node, Path, Transforms } from "slate";
8
8
  import useWindowResize from "../../hooks/useWindowResize";
9
9
  import { MODES } from "./helper";
10
10
  import { getSelectedText } from "../../utils/helper";
11
- import { VoiceToText } from "./VoiceToText";
12
11
  import { jsx as _jsx } from "react/jsx-runtime";
13
12
  import { jsxs as _jsxs } from "react/jsx-runtime";
14
13
  const scrollToAIInput = () => {
@@ -179,11 +178,6 @@ function PopoverAIInput({
179
178
  onClickOutside();
180
179
  return;
181
180
  }
182
- if (type === "speech_to_text") {
183
- Transforms.insertText(editor, option.text);
184
- onClickOutside();
185
- return;
186
- }
187
181
  if (type === "try_again") {
188
182
  // resetting the previous option and try again
189
183
  option = selectedOption;
@@ -194,7 +188,7 @@ function PopoverAIInput({
194
188
  setLoading(true);
195
189
  const payload = {
196
190
  mode: option.mode || 0,
197
- query: option?.inputValue || inputValue
191
+ query: inputValue
198
192
  };
199
193
  if (option.mode === MODES.translate || option.mode === MODES.rephraseTone) {
200
194
  payload.textOptionInput = type;
@@ -273,19 +267,15 @@ function PopoverAIInput({
273
267
  component: "div",
274
268
  sx: classes.mobileAIInputWrapper,
275
269
  ref: targetRef,
276
- children: /*#__PURE__*/_jsx(VoiceToText, {
277
- otherProps: otherProps,
270
+ children: /*#__PURE__*/_jsx(AIInput, {
271
+ loading: loading,
278
272
  onSend: onSend,
279
- children: /*#__PURE__*/_jsx(AIInput, {
280
- loading: loading,
281
- onSend: onSend,
282
- generatedText: generatedText,
283
- anchorEl: anchorEl,
284
- openAI: openAI,
285
- inputValue: inputValue,
286
- onInputChange: onInputChange,
287
- onClickOutside: onClickOutside
288
- })
273
+ generatedText: generatedText,
274
+ anchorEl: anchorEl,
275
+ openAI: openAI,
276
+ inputValue: inputValue,
277
+ onInputChange: onInputChange,
278
+ onClickOutside: onClickOutside
289
279
  })
290
280
  }) : /*#__PURE__*/_jsx(Popper, {
291
281
  open: Boolean(openAI),
@@ -306,19 +296,15 @@ function PopoverAIInput({
306
296
  sx: getSelectedText(editor) ? {
307
297
  marginTop: "6px"
308
298
  } : {},
309
- children: /*#__PURE__*/_jsx(VoiceToText, {
310
- otherProps: otherProps,
299
+ children: /*#__PURE__*/_jsx(AIInput, {
300
+ loading: loading,
311
301
  onSend: onSend,
312
- children: /*#__PURE__*/_jsx(AIInput, {
313
- loading: loading,
314
- onSend: onSend,
315
- generatedText: generatedText,
316
- anchorEl: anchorEl,
317
- openAI: openAI,
318
- inputValue: inputValue,
319
- onInputChange: onInputChange,
320
- onClickOutside: onClickOutside
321
- })
302
+ generatedText: generatedText,
303
+ anchorEl: anchorEl,
304
+ openAI: openAI,
305
+ inputValue: inputValue,
306
+ onInputChange: onInputChange,
307
+ onClickOutside: onClickOutside
322
308
  })
323
309
  })
324
310
  })
@@ -167,8 +167,7 @@ const Styles = theme => ({
167
167
  sendIconContainer: {
168
168
  alignSelf: "flex-end",
169
169
  display: "flex",
170
- alignItems: "center",
171
- gap: "6px"
170
+ alignItems: "center"
172
171
  }
173
172
  });
174
173
  export default Styles;
@@ -9,55 +9,6 @@ import Icon from "../../common/Icon";
9
9
  import { useEditorSelection } from "../../hooks/useMouseMove";
10
10
  import { jsx as _jsx } from "react/jsx-runtime";
11
11
  import { jsxs as _jsxs } from "react/jsx-runtime";
12
- const accordionBtnStyleKeys = {
13
- accordionTextColor: "textColor",
14
- accordionBgColor: "bgColor",
15
- accordionBorderColor: "borderColor"
16
- };
17
- const getAccordionData = updateData => {
18
- const accordionBtnStyle = {}; // accordion btn style will come under type: accordion node
19
- const accordionTitleStyle = {}; // accordion title style will come under type: accordion-summary node
20
-
21
- Object.entries(updateData).forEach(([key, value]) => {
22
- const accordionBtnStyleKey = accordionBtnStyleKeys[key];
23
- if (accordionBtnStyleKey) {
24
- // converting accordion button elementProp keys to node keys e.g: accordionTextColor -> textColor
25
- accordionBtnStyle[accordionBtnStyleKey] = value;
26
- return;
27
- }
28
- accordionTitleStyle[key] = value;
29
- });
30
- return {
31
- accordionBtnStyle,
32
- accordionTitleStyle
33
- };
34
- };
35
- const convertAccordionBtnStyleKeys = (data = {}) => {
36
- const style = {
37
- ...data
38
- };
39
- Object.entries(accordionBtnStyleKeys).forEach(([key, value]) => {
40
- const val = data[value];
41
- if (val) {
42
- // deleting the existing style key in node e.g: textColor
43
- delete style[value];
44
-
45
- // convertint into new key in element props e.g: accordionTextColor
46
- style[key] = val;
47
- }
48
- });
49
- return style;
50
- };
51
- const getElementProps = element => {
52
- const accordionSummary = element.children?.find(c => c.type === "accordion-summary");
53
-
54
- // joining accordion title and button styles
55
- const elementProps = {
56
- ...accordionSummary,
57
- ...convertAccordionBtnStyleKeys(element)
58
- };
59
- return elementProps;
60
- };
61
12
  const Accordion = props => {
62
13
  const {
63
14
  attributes,
@@ -118,34 +69,16 @@ const Accordion = props => {
118
69
  at: path
119
70
  });
120
71
  };
121
- const setNodes = (data, path) => {
122
- Transforms.setNodes(editor, data, {
123
- at: path
124
- });
125
- };
126
72
  const onSave = data => {
127
73
  const updateData = {
128
74
  ...data
129
75
  };
130
- const {
131
- accordionBtnStyle,
132
- accordionTitleStyle
133
- } = getAccordionData(updateData);
134
-
135
- // applying accordion title style
136
- const accordionSummary = data.children?.find(c => c.type === "accordion-summary");
137
- const accordionSummaryPath = ReactEditor.findPath(editor, accordionSummary);
138
- setNodes({
139
- ...accordionTitleStyle,
140
- type: "accordion-summary",
141
- children: accordionSummary.children
142
- }, accordionSummaryPath);
143
-
144
- // applying accordion button style
145
- delete accordionBtnStyle.children;
146
- setNodes({
147
- ...accordionBtnStyle
148
- }, path);
76
+ delete updateData.children;
77
+ Transforms.setNodes(editor, {
78
+ ...updateData
79
+ }, {
80
+ at: path
81
+ });
149
82
  onClose();
150
83
  };
151
84
  const onClose = () => {
@@ -190,7 +123,7 @@ const Accordion = props => {
190
123
  },
191
124
  children: children[1]
192
125
  }), !readOnly && /*#__PURE__*/_jsx(ToolBar, {}), openSetttings ? /*#__PURE__*/_jsx(AccordionBtnPopup, {
193
- element: getElementProps(element),
126
+ element: element,
194
127
  onSave: onSave,
195
128
  onClose: onClose,
196
129
  customProps: customProps