@flozy/editor 3.8.7 → 3.8.8

Sign up to get free protection for your applications and to get access to all the features.
Files changed (117) hide show
  1. package/dist/Editor/ChatEditor.js +55 -29
  2. package/dist/Editor/CommonEditor.js +109 -166
  3. package/dist/Editor/Editor.css +12 -8
  4. package/dist/Editor/Elements/AI/AIInput.js +5 -16
  5. package/dist/Editor/Elements/AI/PopoverAIInput.js +17 -31
  6. package/dist/Editor/Elements/AI/Styles.js +1 -2
  7. package/dist/Editor/Elements/Accordion/Accordion.js +1 -1
  8. package/dist/Editor/Elements/Accordion/AccordionSummary.js +20 -6
  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/Emoji/EmojiPicker.js +4 -2
  16. package/dist/Editor/Elements/Form/Form.js +1 -1
  17. package/dist/Editor/Elements/Form/Workflow/FormWorkflow.js +3 -12
  18. package/dist/Editor/Elements/Form/Workflow/UserInputs.js +1 -2
  19. package/dist/Editor/Elements/Grid/Grid.js +3 -27
  20. package/dist/Editor/Elements/Grid/GridItem.js +1 -3
  21. package/dist/Editor/Elements/Link/Link.js +1 -6
  22. package/dist/Editor/Elements/Link/LinkButton.js +2 -4
  23. package/dist/Editor/Elements/Link/LinkPopup.js +3 -10
  24. package/dist/Editor/Elements/PageSettings/PageSettingsButton.js +8 -4
  25. package/dist/Editor/Elements/Signature/SignaturePopup.js +3 -14
  26. package/dist/Editor/Elements/Table/Styles.js +1 -23
  27. package/dist/Editor/Elements/Table/Table.js +1 -2
  28. package/dist/Editor/Elements/Table/TableCell.js +7 -69
  29. package/dist/Editor/Elements/TableContextMenu/TableContextMenu.js +0 -1
  30. package/dist/Editor/MiniEditor.js +1 -3
  31. package/dist/Editor/Toolbar/Basic/index.js +2 -4
  32. package/dist/Editor/Toolbar/FormatTools/Dropdown.js +2 -26
  33. package/dist/Editor/Toolbar/FormatTools/MarkButton.js +2 -2
  34. package/dist/Editor/Toolbar/FormatTools/TextSize.js +18 -29
  35. package/dist/Editor/Toolbar/Mini/MiniToolbar.js +27 -5
  36. package/dist/Editor/Toolbar/Mini/Options/Options.js +0 -10
  37. package/dist/Editor/Toolbar/Mini/Styles.js +0 -7
  38. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectFontSize.js +11 -4
  39. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectTypography.js +86 -213
  40. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/index.js +1 -2
  41. package/dist/Editor/Toolbar/PopupTool/PopupToolStyle.js +13 -20
  42. package/dist/Editor/Toolbar/PopupTool/TextFormat.js +7 -52
  43. package/dist/Editor/Toolbar/PopupTool/index.js +5 -6
  44. package/dist/Editor/Toolbar/toolbarGroups.js +6 -48
  45. package/dist/Editor/assets/svg/AIIcons.js +1 -153
  46. package/dist/Editor/assets/svg/AddTemplateIcon.js +10 -13
  47. package/dist/Editor/assets/svg/TextIcon.js +5 -8
  48. package/dist/Editor/common/ColorPickerButton.js +9 -25
  49. package/dist/Editor/common/DnD/DragHandleButton.js +47 -56
  50. package/dist/Editor/common/Icon.js +3 -43
  51. package/dist/Editor/common/LinkSettings/NavComponents.js +2 -5
  52. package/dist/Editor/common/LinkSettings/index.js +2 -4
  53. package/dist/Editor/common/LinkSettings/navOptions.js +2 -7
  54. package/dist/Editor/common/LinkSettings/style.js +8 -11
  55. package/dist/Editor/common/MentionsPopup/MentionsListCard.js +6 -1
  56. package/dist/Editor/common/Section/index.js +7 -57
  57. package/dist/Editor/common/Section/styles.js +0 -11
  58. package/dist/Editor/common/Shorthands/elements.js +0 -54
  59. package/dist/Editor/common/StyleBuilder/buttonStyle.js +2 -4
  60. package/dist/Editor/common/StyleBuilder/fieldTypes/bannerSpacing.js +29 -33
  61. package/dist/Editor/common/StyleBuilder/fieldTypes/borderRadius.js +25 -31
  62. package/dist/Editor/common/StyleBuilder/fieldTypes/buttonLink.js +1 -1
  63. package/dist/Editor/common/StyleBuilder/fieldTypes/color.js +7 -31
  64. package/dist/Editor/common/StyleBuilder/fieldTypes/fontSize.js +4 -13
  65. package/dist/Editor/common/StyleBuilder/fieldTypes/selectBox.js +14 -3
  66. package/dist/Editor/common/StyleBuilder/fieldTypes/textOptions.js +4 -14
  67. package/dist/Editor/common/StyleBuilder/index.js +1 -1
  68. package/dist/Editor/common/iconslist.js +31 -0
  69. package/dist/Editor/helper/index.js +22 -0
  70. package/dist/Editor/helper/theme.js +4 -189
  71. package/dist/Editor/hooks/useMouseMove.js +1 -4
  72. package/dist/Editor/hooks/useWindowMessage.js +7 -10
  73. package/dist/Editor/plugins/withEmbeds.js +1 -1
  74. package/dist/Editor/plugins/withHTML.js +1 -1
  75. package/dist/Editor/plugins/withTable.js +1 -1
  76. package/dist/Editor/theme/ThemeList.js +173 -50
  77. package/dist/Editor/utils/SlateUtilityFunctions.js +27 -169
  78. package/dist/Editor/utils/button.js +17 -1
  79. package/dist/Editor/utils/draftToSlate.js +1 -1
  80. package/dist/Editor/utils/events.js +2 -54
  81. package/dist/Editor/utils/font.js +37 -40
  82. package/dist/Editor/utils/helper.js +2 -31
  83. package/dist/Editor/utils/table.js +43 -51
  84. package/package.json +2 -3
  85. package/dist/Editor/Elements/AI/VoiceToText/AudioWave.js +0 -73
  86. package/dist/Editor/Elements/AI/VoiceToText/index.js +0 -167
  87. package/dist/Editor/Elements/AI/VoiceToText/style.js +0 -40
  88. package/dist/Editor/Elements/Link/LinkPopupStyles.js +0 -28
  89. package/dist/Editor/Elements/Redo/RedoButton.js +0 -14
  90. package/dist/Editor/Elements/Undo/UndoButton.js +0 -14
  91. package/dist/Editor/Toolbar/PopupTool/ThemeTextFormat.js +0 -438
  92. package/dist/Editor/assets/svg/RedoIcon.js +0 -27
  93. package/dist/Editor/assets/svg/SettingsIcon.js +0 -28
  94. package/dist/Editor/assets/svg/ThemeIcons.js +0 -291
  95. package/dist/Editor/assets/svg/UndoIcon.js +0 -27
  96. package/dist/Editor/common/CustomColorPicker/index.js +0 -106
  97. package/dist/Editor/common/CustomColorPicker/style.js +0 -53
  98. package/dist/Editor/common/CustomDialog/index.js +0 -94
  99. package/dist/Editor/common/CustomDialog/style.js +0 -67
  100. package/dist/Editor/common/CustomSelect.js +0 -33
  101. package/dist/Editor/hooks/useEditorTheme.js +0 -139
  102. package/dist/Editor/theme/index.js +0 -144
  103. package/dist/Editor/themeSettings/ActiveTheme.js +0 -72
  104. package/dist/Editor/themeSettings/buttons/index.js +0 -290
  105. package/dist/Editor/themeSettings/buttons/style.js +0 -21
  106. package/dist/Editor/themeSettings/colorTheme/index.js +0 -290
  107. package/dist/Editor/themeSettings/colorTheme/style.js +0 -77
  108. package/dist/Editor/themeSettings/fonts/PreviewElement.js +0 -123
  109. package/dist/Editor/themeSettings/fonts/index.js +0 -213
  110. package/dist/Editor/themeSettings/fonts/style.js +0 -44
  111. package/dist/Editor/themeSettings/icons.js +0 -60
  112. package/dist/Editor/themeSettings/index.js +0 -320
  113. package/dist/Editor/themeSettings/style.js +0 -152
  114. package/dist/Editor/themeSettingsAI/icons.js +0 -96
  115. package/dist/Editor/themeSettingsAI/index.js +0 -356
  116. package/dist/Editor/themeSettingsAI/saveTheme.js +0 -190
  117. package/dist/Editor/themeSettingsAI/style.js +0 -247
@@ -1,6 +1,6 @@
1
1
  import React, { useCallback, useMemo, useRef, useState, useEffect, useImperativeHandle, forwardRef } from "react";
2
2
  import { Editable, Slate, ReactEditor } from 'slate-react';
3
- import { createEditor, Transforms } from 'slate';
3
+ import { createEditor, Transforms, Editor } from 'slate';
4
4
  import { useDebounce } from "use-debounce";
5
5
  import withCommon from "./hooks/withCommon";
6
6
  import { getBlock, getMarked } from "./utils/chatEditor/SlateUtilityFunctions";
@@ -31,7 +31,12 @@ const ChatEditor = /*#__PURE__*/forwardRef((props, ref) => {
31
31
  } = props;
32
32
  const classes = usePopupStyle(theme);
33
33
  const convertedContent = draftToSlate({
34
- data: content
34
+ data: content && content?.length > 0 ? content : [{
35
+ type: 'paragraph',
36
+ children: [{
37
+ text: ''
38
+ }]
39
+ }]
35
40
  });
36
41
  const [isInteracted, setIsInteracted] = useState(false);
37
42
  const [value, setValue] = useState(convertedContent);
@@ -47,6 +52,7 @@ const ChatEditor = /*#__PURE__*/forwardRef((props, ref) => {
47
52
  useImperativeHandle(ref, () => ({
48
53
  emojiClick: emoji => {
49
54
  if (editor) {
55
+ ReactEditor.focus(editor);
50
56
  insertEmoji(editor, emoji?.native, editor.selection);
51
57
  if (editor.selection) {
52
58
  // const path = editor.selection.anchor.path;
@@ -67,37 +73,57 @@ const ChatEditor = /*#__PURE__*/forwardRef((props, ref) => {
67
73
  ReactEditor.focus(editor);
68
74
  }
69
75
  },
70
- setContent: newContent => {
71
- setIsExternalUpdate(true);
72
- setValue(newContent);
73
- ReactEditor.focus(editor);
76
+ submitChat: () => {
77
+ const {
78
+ value: strVal,
79
+ ...restVal
80
+ } = getOnSaveData(value);
81
+ onsubmit(false, {
82
+ strVal,
83
+ restVal
84
+ });
74
85
  },
75
86
  // Focus enable
76
- // enableFocus: () => {
77
- // if (editor) {
78
- // const position = {
79
- // anchor: { path: [0], offset: 0 },
80
- // focus: { path: [0], offset: 0 },
81
- // };
82
- // Transforms.select(editor, position);
83
- // ReactEditor.focus(editor);
84
- // }
85
- // },
86
-
87
- clearAll: () => {
87
+ enableFocus: () => {
88
+ if (editor) {
89
+ const position = {
90
+ anchor: {
91
+ path: [0],
92
+ offset: 0
93
+ },
94
+ focus: {
95
+ path: [0],
96
+ offset: 0
97
+ }
98
+ };
99
+ Transforms.select(editor, position);
100
+ ReactEditor.focus(editor);
101
+ }
102
+ },
103
+ clearAll: (content = null, clear = true) => {
88
104
  if (!editor) return;
89
- while (editor.children.length > 0) {
90
- Transforms.removeNodes(editor, {
91
- at: [0]
105
+ try {
106
+ if (clear) {
107
+ while (editor.children.length > 0) {
108
+ Transforms.removeNodes(editor, {
109
+ at: [0]
110
+ });
111
+ }
112
+ }
113
+ const newValue = draftToSlate({
114
+ data: content
92
115
  });
116
+ setValue(newValue);
117
+ setTimeout(() => {
118
+ if (editor.children.length === 0) {
119
+ Transforms.insertNodes(editor, newValue);
120
+ }
121
+ Transforms.select(editor, Editor.end(editor, []));
122
+ ReactEditor.focus(editor);
123
+ }, 300);
124
+ } catch {
125
+ console.log("error:");
93
126
  }
94
- Transforms.insertNodes(editor, {
95
- type: 'paragraph',
96
- children: [{
97
- text: ''
98
- }]
99
- });
100
- ReactEditor.focus(editor);
101
127
  }
102
128
  }));
103
129
  useEffect(() => {
@@ -105,7 +131,7 @@ const ChatEditor = /*#__PURE__*/forwardRef((props, ref) => {
105
131
  setValue(draftToSlate({
106
132
  data: content
107
133
  }));
108
- }, [id, content]);
134
+ }, [content]);
109
135
  useEffect(() => {
110
136
  if (JSON.stringify(loadedValue) !== JSON.stringify(deboundedValue) && isInteracted && onSave) {
111
137
  const {
@@ -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";
31
+ import { getTRBLBreakPoints } from "./helper/theme";
32
32
  import { handleInsertLastElement, onDeleteKey, 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
  }
@@ -404,152 +386,113 @@ const CommonEditor = /*#__PURE__*/forwardRef((props, ref) => {
404
386
  }
405
387
  return style;
406
388
  }, [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,
389
+ return /*#__PURE__*/_jsx(EditorProvider, {
390
+ theme: theme,
391
+ editor: editor,
392
+ children: /*#__PURE__*/_jsx(DialogWrapper, {
393
+ classes: classes,
394
+ ...props,
395
+ fullScreen: fullScreen,
396
+ footer: footer || "",
397
+ children: /*#__PURE__*/_jsx(Box, {
398
+ component: "div",
399
+ className: `${editorClass || ""} ${isIframe ? "iframe-editor" : ""}`,
400
+ sx: classes.root,
401
+ style: {
402
+ ...dotBg
403
+ },
404
+ children: /*#__PURE__*/_jsxs(Slate, {
405
+ editor: editor,
406
+ initialValue: value,
407
+ onChange: handleEditorChange,
408
+ children: [/*#__PURE__*/_jsx(DragAndDrop, {
409
+ children: /*#__PURE__*/_jsxs(Overlay, {
410
+ children: [/*#__PURE__*/_jsx(Box, {
411
+ className: `${hasTopBanner() ? "has-topbanner" : ""} ${!pageColor ? "no-color" : ""} ${isScrolling ? "" : "hideScroll"} scrollable-content scrollSmooth`,
412
+ sx: classes.slateWrapper,
413
+ id: "slate-wrapper-scroll-container"
414
+ // style={editorWrapperStyle}
415
+ ,
416
+ ref: editorWrapper,
417
+ onClick: e => {
418
+ handleInsertLastElement(e, editor);
419
+ },
420
+ onScroll: handleScroll,
421
+ style: editorWrapperStyle,
422
+ children: /*#__PURE__*/_jsxs(Box, {
423
+ component: "div",
424
+ className: "max-content",
425
+ "data-info": outsideEditorClickLabel,
426
+ children: [renderTopBanner(), /*#__PURE__*/_jsx("div", {
427
+ className: "scroll-area",
428
+ "data-info": outsideEditorClickLabel,
467
429
  children: /*#__PURE__*/_jsxs(Box, {
468
430
  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"
431
+ className: `editor-wrapper ${pageWidth === "fixed" ? "fixed" : "full"}`,
432
+ sx: {
433
+ backgroundColor: "transparent",
434
+ padding: {
435
+ ...getTRBLBreakPoints(bannerSpacing)
523
436
  },
524
- align: "center",
525
- "data-info": outsideEditorClickLabel,
526
- onClick: handleFooterClick,
527
- children: footer
528
- }), openTheme ? /*#__PURE__*/_jsx(ThemeSettings, {
529
- open: openTheme,
530
- setOpen: setOpenTheme,
437
+ width: !pageWidth || pageWidth === "fixed" ? fixedWidth : fullWidth,
438
+ height: viewport.h ? `${viewport.h}px` : `100%`,
439
+ alignSelf: "center",
440
+ transformOrigin: "left top",
441
+ transition: "all 0.3s",
442
+ minHeight: "87%",
443
+ maxWidth: pageMaxWidth ? `${parseInt(pageMaxWidth)}px !important` : "auto"
444
+ },
445
+ "data-info": outsideEditorClickLabel,
446
+ children: [/*#__PURE__*/_jsx(Editable, {
447
+ className: "innert-editor-textbox",
448
+ readOnly: isReadOnly,
449
+ renderElement: renderElement,
450
+ renderLeaf: renderLeaf,
451
+ decorate: decorators,
452
+ onKeyDown: onKeyDown
453
+ }), !readOnly ? /*#__PURE__*/_jsx(MentionsPopup, {
454
+ ref: mentionsRef,
455
+ mentions: mentions,
456
+ setMentions: setMentions,
531
457
  editor: editor,
532
- services: otherProps?.services
533
- }) : null, /*#__PURE__*/_jsx(ThemeSettingsAI, {
534
- openAITheme: openAITheme,
535
- setOpenAITheme: setOpenAITheme,
536
- onSaveTheme: otherProps?.onSaveTheme
537
- })]
458
+ target: target,
459
+ index: index,
460
+ chars: chars,
461
+ type: type,
462
+ theme: theme
463
+ }) : null]
538
464
  })
539
- }), !readOnly ? /*#__PURE__*/_jsx(PopupTool, {
540
- onDrawerOpen: onDrawerOpen,
541
- theme: theme,
542
- setIsTextSelected: setIsTextSelected,
543
- customProps: customProps
544
- }) : null]
465
+ }), !hideMiniToolBar ? /*#__PURE__*/_jsx(MiniToolbar, {
466
+ customProps: customProps,
467
+ toolbarOptions: toolbarOptions,
468
+ theme: theme
469
+ }) : null, /*#__PURE__*/_jsx(PopoverAIInput, {
470
+ otherProps: otherProps || {}
471
+ }), footer && (fullScreen || readOnly) && /*#__PURE__*/_jsx(Typography, {
472
+ sx: {
473
+ color: "rgb(100, 116, 139)",
474
+ fontSize: "13px",
475
+ paddingBottom: hideMiniToolBar ? "0px" : "12px",
476
+ cursor: "pointer"
477
+ },
478
+ align: "center",
479
+ "data-info": outsideEditorClickLabel,
480
+ onClick: handleFooterClick,
481
+ children: footer
482
+ })]
545
483
  })
546
- }), htmlAction.showInput && /*#__PURE__*/_jsx(CodeToText, {
547
- ...htmlAction,
548
- handleCodeToText: handleCodeToText
549
- })]
550
- }, id)
551
- })
552
- })]
484
+ }), !readOnly ? /*#__PURE__*/_jsx(PopupTool, {
485
+ onDrawerOpen: onDrawerOpen,
486
+ theme: theme,
487
+ setIsTextSelected: setIsTextSelected,
488
+ customProps: customProps
489
+ }) : null]
490
+ })
491
+ }), htmlAction.showInput && /*#__PURE__*/_jsx(CodeToText, {
492
+ ...htmlAction,
493
+ handleCodeToText: handleCodeToText
494
+ })]
495
+ }, id)
553
496
  })
554
497
  })
555
498
  });
@@ -245,13 +245,6 @@ blockquote {
245
245
  width: 17px !important;
246
246
  }
247
247
 
248
- .react-datepicker__input-container input {
249
- height: 40px !important;
250
- border: 1px solid #ccc;
251
- border-radius: 5px;
252
- width: 100%;
253
- }
254
-
255
248
  .close-popupbtn {
256
249
  border-radius: 4px !important;
257
250
  width: 24px;
@@ -837,6 +830,17 @@ blockquote {
837
830
  text-align: center;
838
831
  }
839
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
+
840
844
  .borderInput:focus-visible {
841
845
  outline: none !important;
842
846
  }
@@ -886,7 +890,7 @@ blockquote {
886
890
  }
887
891
 
888
892
  .sliderInput {
889
- width: 66px;
893
+ width: 30px;
890
894
  padding: 2px 10px;
891
895
  margin-left: 18px;
892
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;