@flozy/editor 3.8.7 → 3.8.8

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 (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;