@flozy/editor 3.9.1 → 3.9.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 (127) hide show
  1. package/dist/Editor/ChatEditor.js +45 -55
  2. package/dist/Editor/CommonEditor.js +111 -180
  3. package/dist/Editor/Editor.css +0 -7
  4. package/dist/Editor/Elements/AI/AIInput.js +18 -17
  5. package/dist/Editor/Elements/AI/CustomSelect.js +12 -19
  6. package/dist/Editor/Elements/AI/PopoverAIInput.js +28 -23
  7. package/dist/Editor/Elements/AI/Styles.js +1 -2
  8. package/dist/Editor/Elements/Accordion/Accordion.js +7 -74
  9. package/dist/Editor/Elements/Accordion/AccordionBtnPopup.js +2 -3
  10. package/dist/Editor/Elements/Accordion/AccordionSummary.js +60 -4
  11. package/dist/Editor/Elements/AppHeader/AppHeader.js +4 -26
  12. package/dist/Editor/Elements/Button/EditorButton.js +16 -28
  13. package/dist/Editor/Elements/Color Picker/ColorButtons.js +17 -60
  14. package/dist/Editor/Elements/Color Picker/ColorPicker.css +1 -25
  15. package/dist/Editor/Elements/Color Picker/ColorPicker.js +4 -4
  16. package/dist/Editor/Elements/Color Picker/Styles.js +1 -2
  17. package/dist/Editor/Elements/Embed/Image.js +19 -27
  18. package/dist/Editor/Elements/Embed/Video.js +10 -14
  19. package/dist/Editor/Elements/Emoji/EmojiPicker.js +2 -4
  20. package/dist/Editor/Elements/Form/Form.js +1 -1
  21. package/dist/Editor/Elements/Form/Workflow/FormWorkflow.js +3 -12
  22. package/dist/Editor/Elements/Form/Workflow/UserInputs.js +1 -2
  23. package/dist/Editor/Elements/Grid/Grid.js +3 -27
  24. package/dist/Editor/Elements/Grid/GridItem.js +1 -3
  25. package/dist/Editor/Elements/Link/Link.js +1 -6
  26. package/dist/Editor/Elements/Link/LinkButton.js +2 -4
  27. package/dist/Editor/Elements/Link/LinkPopup.js +3 -10
  28. package/dist/Editor/Elements/PageSettings/PageSettingsButton.js +4 -8
  29. package/dist/Editor/Elements/Signature/SignaturePopup.js +3 -14
  30. package/dist/Editor/Elements/Table/Styles.js +1 -23
  31. package/dist/Editor/Elements/Table/Table.js +2 -3
  32. package/dist/Editor/Elements/Table/TableCell.js +8 -70
  33. package/dist/Editor/Elements/TableContextMenu/TableContextMenu.js +0 -1
  34. package/dist/Editor/MiniEditor.js +1 -3
  35. package/dist/Editor/Styles/EditorStyles.js +1 -1
  36. package/dist/Editor/Toolbar/Basic/index.js +2 -4
  37. package/dist/Editor/Toolbar/FormatTools/Dropdown.js +2 -26
  38. package/dist/Editor/Toolbar/FormatTools/MarkButton.js +2 -2
  39. package/dist/Editor/Toolbar/FormatTools/TextSize.js +18 -29
  40. package/dist/Editor/Toolbar/Mini/MiniToolbar.js +3 -29
  41. package/dist/Editor/Toolbar/Mini/Options/Options.js +0 -10
  42. package/dist/Editor/Toolbar/Mini/Styles.js +0 -7
  43. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectFontSize.js +11 -4
  44. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectTypography.js +86 -213
  45. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/index.js +1 -2
  46. package/dist/Editor/Toolbar/PopupTool/PopupToolStyle.js +16 -22
  47. package/dist/Editor/Toolbar/PopupTool/TextFormat.js +7 -52
  48. package/dist/Editor/Toolbar/PopupTool/index.js +17 -7
  49. package/dist/Editor/Toolbar/toolbarGroups.js +6 -48
  50. package/dist/Editor/assets/svg/AIIcons.js +1 -153
  51. package/dist/Editor/assets/svg/AddTemplateIcon.js +10 -13
  52. package/dist/Editor/assets/svg/TextIcon.js +5 -8
  53. package/dist/Editor/common/ColorPickerButton.js +9 -25
  54. package/dist/Editor/common/DnD/DragHandleButton.js +47 -56
  55. package/dist/Editor/common/Icon.js +3 -43
  56. package/dist/Editor/common/LinkSettings/NavComponents.js +2 -5
  57. package/dist/Editor/common/LinkSettings/index.js +2 -4
  58. package/dist/Editor/common/LinkSettings/navOptions.js +2 -7
  59. package/dist/Editor/common/LinkSettings/style.js +8 -11
  60. package/dist/Editor/common/MentionsPopup/MentionsListCard.js +1 -6
  61. package/dist/Editor/common/MentionsPopup/Styles.js +2 -5
  62. package/dist/Editor/common/Section/index.js +7 -57
  63. package/dist/Editor/common/Section/styles.js +0 -11
  64. package/dist/Editor/common/Shorthands/elements.js +0 -54
  65. package/dist/Editor/common/StyleBuilder/accordionTitleBtnStyle.js +7 -7
  66. package/dist/Editor/common/StyleBuilder/accordionTitleStyle.js +16 -16
  67. package/dist/Editor/common/StyleBuilder/buttonStyle.js +2 -4
  68. package/dist/Editor/common/StyleBuilder/fieldTypes/bannerSpacing.js +3 -13
  69. package/dist/Editor/common/StyleBuilder/fieldTypes/borderRadius.js +7 -15
  70. package/dist/Editor/common/StyleBuilder/fieldTypes/buttonLink.js +1 -1
  71. package/dist/Editor/common/StyleBuilder/fieldTypes/color.js +7 -31
  72. package/dist/Editor/common/StyleBuilder/fieldTypes/fontSize.js +4 -13
  73. package/dist/Editor/common/StyleBuilder/fieldTypes/selectBox.js +3 -14
  74. package/dist/Editor/common/StyleBuilder/fieldTypes/textOptions.js +4 -14
  75. package/dist/Editor/common/StyleBuilder/index.js +1 -1
  76. package/dist/Editor/common/iconslist.js +31 -0
  77. package/dist/Editor/helper/deserialize/index.js +9 -14
  78. package/dist/Editor/helper/theme.js +4 -190
  79. package/dist/Editor/hooks/useMouseMove.js +2 -4
  80. package/dist/Editor/hooks/useWindowMessage.js +7 -10
  81. package/dist/Editor/plugins/withEmbeds.js +1 -1
  82. package/dist/Editor/plugins/withHTML.js +5 -47
  83. package/dist/Editor/plugins/withLayout.js +10 -15
  84. package/dist/Editor/plugins/withTable.js +2 -2
  85. package/dist/Editor/theme/ThemeList.js +173 -50
  86. package/dist/Editor/utils/SlateUtilityFunctions.js +25 -161
  87. package/dist/Editor/utils/button.js +17 -1
  88. package/dist/Editor/utils/draftToSlate.js +1 -1
  89. package/dist/Editor/utils/events.js +6 -65
  90. package/dist/Editor/utils/font.js +37 -40
  91. package/dist/Editor/utils/helper.js +14 -74
  92. package/dist/Editor/utils/table.js +43 -51
  93. package/package.json +3 -4
  94. package/dist/Editor/Elements/AI/VoiceToText/AudioWave.js +0 -73
  95. package/dist/Editor/Elements/AI/VoiceToText/index.js +0 -177
  96. package/dist/Editor/Elements/AI/VoiceToText/style.js +0 -40
  97. package/dist/Editor/Elements/Link/LinkPopupStyles.js +0 -28
  98. package/dist/Editor/Elements/Redo/RedoButton.js +0 -14
  99. package/dist/Editor/Elements/Undo/UndoButton.js +0 -14
  100. package/dist/Editor/Toolbar/PopupTool/ThemeTextFormat.js +0 -438
  101. package/dist/Editor/assets/svg/RedoIcon.js +0 -27
  102. package/dist/Editor/assets/svg/SettingsIcon.js +0 -28
  103. package/dist/Editor/assets/svg/ThemeIcons.js +0 -291
  104. package/dist/Editor/assets/svg/UndoIcon.js +0 -27
  105. package/dist/Editor/common/CustomColorPicker/index.js +0 -106
  106. package/dist/Editor/common/CustomColorPicker/style.js +0 -53
  107. package/dist/Editor/common/CustomDialog/index.js +0 -94
  108. package/dist/Editor/common/CustomDialog/style.js +0 -67
  109. package/dist/Editor/common/CustomSelect.js +0 -33
  110. package/dist/Editor/common/EditorCmds.js +0 -35
  111. package/dist/Editor/hooks/useEditorTheme.js +0 -139
  112. package/dist/Editor/theme/index.js +0 -144
  113. package/dist/Editor/themeSettings/ActiveTheme.js +0 -72
  114. package/dist/Editor/themeSettings/buttons/index.js +0 -290
  115. package/dist/Editor/themeSettings/buttons/style.js +0 -21
  116. package/dist/Editor/themeSettings/colorTheme/index.js +0 -290
  117. package/dist/Editor/themeSettings/colorTheme/style.js +0 -77
  118. package/dist/Editor/themeSettings/fonts/PreviewElement.js +0 -123
  119. package/dist/Editor/themeSettings/fonts/index.js +0 -213
  120. package/dist/Editor/themeSettings/fonts/style.js +0 -44
  121. package/dist/Editor/themeSettings/icons.js +0 -60
  122. package/dist/Editor/themeSettings/index.js +0 -320
  123. package/dist/Editor/themeSettings/style.js +0 -152
  124. package/dist/Editor/themeSettingsAI/icons.js +0 -96
  125. package/dist/Editor/themeSettingsAI/index.js +0 -356
  126. package/dist/Editor/themeSettingsAI/saveTheme.js +0 -190
  127. package/dist/Editor/themeSettingsAI/style.js +0 -247
@@ -7,43 +7,43 @@ export const sizeMap = {
7
7
  export const fontFamilyMap = {
8
8
  PoppinsRegular: "PoppinsRegular",
9
9
  PoppinsBold: "PoppinsBold",
10
- sans: 'Helvetica, Arial, "sans serif"',
11
- serif: 'Georgia, "Times New Roaman", serif',
12
- monospace: 'Monaco, "Courier New", monospace',
13
- roboto: "Roboto, sans-serif",
14
- qwitcher: '"Qwitcher Grypen", cursive',
15
- garamond: '"EB Garamond", serif',
16
- anton: "Anton, sans-serif",
17
- dmserif: '"DM Serif Text", serif',
18
- inter: "Inter, sans-serif",
19
- libre: '"Libre Baskerville", serif',
20
- montserrat: "Montserrat, sans-serif",
21
- opensans: '"Open Sans", sans-serif',
22
- publicsans: '"Public Sans", sans-serif',
23
- raleway: "Raleway, sans-serif",
24
- spacemono: '"Space Mono", sans-serif',
25
- bulgarian: '"Bulgarian Garamond", monospace',
26
- impact: "Impact, serif",
27
- redacted: '"Redacted Script", cursive',
28
- greatVibes: '"Great Vibes", cursive',
29
- zeyada: "Zeyada, cursive",
30
- allura: "Allura, cursive",
31
- pinyon: '"Pinyon Script", cursive',
32
- muellerhoff: '"Herr Von Muellerhoff", cursive',
33
- dawning: '"Dawning of a New Day", cursive',
10
+ sans: "Helvetica,Arial, sans serif",
11
+ serif: "Georgia, Times New Roaman,serif",
12
+ monospace: "Monaco, Courier New,monospace",
13
+ roboto: "'Roboto', sans-serif",
14
+ qwitcher: "'Qwitcher Grypen', cursive",
15
+ garamond: "'EB Garamond', serif",
16
+ anton: "'Anton', sans-serif",
17
+ dmserif: "'DM Serif Text', serif",
18
+ inter: "'Inter', sans-serif",
19
+ libre: "'Libre Baskerville', serif",
20
+ montserrat: "'Montserrat', sans-serif",
21
+ opensans: "'Open Sans', sans-serif",
22
+ publicsans: "'Public Sans', sans-serif",
23
+ raleway: "'Raleway', sans-serif",
24
+ spacemono: "'Space Mono', sans-serif",
25
+ bulgarian: "'Bulgarian Garamond', monospace",
26
+ impact: "'Impact', serif",
27
+ redacted: "'Redacted Script', cursive",
28
+ greatVibes: "'Great Vibes', cursive",
29
+ zeyada: "'Zeyada', cursive",
30
+ allura: "'Allura', cursive",
31
+ pinyon: "'Pinyon Script', cursive",
32
+ muellerhoff: "'Herr Von Muellerhoff', cursive",
33
+ dawning: "'Dawning of a New Day', cursive",
34
34
  // New Font Added for Type Signature
35
- comingsoon: '"Coming Soon", cursive',
36
- dancingScript: '"Dancing Script", cursive',
37
- engagement: "Engagement, cursive",
38
- gaegu: "Gaegu, cursive",
39
- ingridDarling: '"Ingrid Darling", cursive',
40
- kitaOne: "Times",
41
- laBelleAurore: '"La Belle Aurore", cursive',
42
- lobster: "Lobster, cursive",
43
- meaCulpa: '"Mea Culpa", cursive',
44
- meddon: "Meddon, cursive",
45
- merriWeather: "Merriweather, serif",
46
- theGirlNextDoor: '"The Girl Next Door", cursive'
35
+ comingsoon: "'Coming Soon', cursive",
36
+ dancingScript: "'Dancing Script', cursive",
37
+ engagement: "'Engagement', cursive",
38
+ gaegu: "'Gaegu', cursive",
39
+ ingridDarling: "'Ingrid Darling', cursive",
40
+ kitaOne: "'Kite One', sans - serif",
41
+ laBelleAurore: "'La Belle Aurore', cursive",
42
+ lobster: "'Lobster', cursive",
43
+ meaCulpa: "'Mea Culpa', cursive",
44
+ meddon: "'Meddon', cursive",
45
+ merriWeather: "'Merriweather', serif",
46
+ theGirlNextDoor: "'The Girl Next Door', cursive"
47
47
  };
48
48
  export const fontOptions = Object.keys(fontFamilyMap).map(m => {
49
49
  return {
@@ -62,8 +62,5 @@ export const signedTextFonts = Object.keys(fontFamilyMap).slice(-12).map(m => {
62
62
  export const headingMap = {
63
63
  "headingOne": "32px",
64
64
  "headingTwo": "24px",
65
- "headingThree": "19px",
66
- "headingFour": "16px",
67
- "headingFive": "13px",
68
- "headingSix": "11px"
65
+ "headingThree": "19px"
69
66
  };
@@ -146,7 +146,7 @@ export const handleInsertLastElement = (event, editor) => {
146
146
  }
147
147
  };
148
148
  export const isListItem = editor => {
149
- const format = ["list-item", "check-list-item", "accordion-summary", "headingOne", "headingTwo", "headingThree"];
149
+ const format = ["list-item", "check-list-item", "accordion-summary"];
150
150
  const [node] = Editor.nodes(editor, {
151
151
  match: n => !Editor.isEditor(n) && Element.isElement(n) && format.indexOf(n.type) > -1
152
152
  });
@@ -216,17 +216,6 @@ const getScrollElement = () => {
216
216
  const scrollFrom = isSlateWrapperScroll ? slateWrapper : window;
217
217
  return scrollFrom;
218
218
  };
219
- const handleLinkBtnClick = (e, props) => {
220
- if (e) {
221
- e.preventDefault();
222
- e.stopPropagation();
223
- }
224
- if (props.target) {
225
- window.open(props.href);
226
- } else {
227
- window.location.href = props.href;
228
- }
229
- };
230
219
  export const handleLinkType = (url, linkType, readOnly, openInNewTab, onClick = () => {}) => {
231
220
  const props = {};
232
221
  if (!readOnly) {
@@ -246,8 +235,7 @@ export const handleLinkType = (url, linkType, readOnly, openInNewTab, onClick =
246
235
  props.target = "_blank";
247
236
  }
248
237
  break;
249
- case "nextTrigger":
250
- case "prevTrigger":
238
+ case "actionTrigger":
251
239
  if (!readOnly) {
252
240
  props.component = "button";
253
241
  props.onClick = () => {};
@@ -318,22 +306,23 @@ export const handleLinkType = (url, linkType, readOnly, openInNewTab, onClick =
318
306
 
319
307
  // for iphone fix
320
308
  if (props.component === "a" && props.href) {
321
- const isMobile = getDevice(window.innerWidth) === "xs";
322
- if (isMobile) {
309
+ if (getDevice(window.innerWidth) === "xs") {
323
310
  props.component = "button"; // iphone is opening two tabs, on open in new tab because of a tag.
324
311
  }
325
312
 
326
- let touchEndClicked = false;
327
313
  props.onTouchEnd = e => {
328
- touchEndClicked = true;
329
- handleLinkBtnClick(e, props);
330
- };
331
- props.onClick = e => {
332
- // This condition is used for mobile preview in the page editor.
333
- // 'touchEnd' will not work in the mobile page preview.
334
- if (!touchEndClicked && isMobile) {
335
- handleLinkBtnClick(e, props);
314
+ if (e) {
315
+ // onTouchEnd will get triggered on web, only for image element, for that case event is getting undefined.
316
+ e.preventDefault();
317
+ e.stopPropagation();
318
+ }
319
+ if (props.target) {
320
+ window.open(props.href);
321
+ } else {
322
+ window.location.href = props.href;
336
323
  }
324
+ };
325
+ props.onClick = () => {
337
326
  return false;
338
327
  };
339
328
  }
@@ -378,53 +367,4 @@ export const decodeString = str => {
378
367
  } catch (err) {
379
368
  console.log(err);
380
369
  }
381
- };
382
- export const getContrastColor = color => {
383
- let r, g, b;
384
-
385
- // Check if the color is in hex format
386
- if (color.startsWith("#")) {
387
- r = parseInt(color.substring(1, 3), 16);
388
- g = parseInt(color.substring(3, 5), 16);
389
- b = parseInt(color.substring(5, 7), 16);
390
- }
391
- // Check if the color is in RGB/RGBA format
392
- else if (color.startsWith("rgb")) {
393
- const rgbValues = color.replace(/^rgba?\(|\s+|\)$/g, "") // Remove the rgb/rgba and spaces
394
- .split(","); // Split the values into an array
395
-
396
- r = parseInt(rgbValues[0]);
397
- g = parseInt(rgbValues[1]);
398
- b = parseInt(rgbValues[2]);
399
- } else {
400
- // If the format is not recognized, default to black text
401
- return "#000000";
402
- }
403
-
404
- // Calculate relative luminance
405
- const luminance = (0.299 * r + 0.587 * g + 0.114 * b) / 255;
406
-
407
- // Return black for light colors, white for dark colors
408
- return luminance > 0.5 ? "#000000" : "#FFFFFF";
409
- };
410
- export const onDeleteKey = (event, {
411
- editor
412
- }) => {
413
- try {
414
- const {
415
- selection
416
- } = editor;
417
- if (selection) {
418
- // If text is selected, delete the selection
419
- Transforms.delete(editor);
420
- } else {
421
- // If no text is selected, handle deleting the next character/element
422
- Transforms.delete(editor, {
423
- unit: "character",
424
- reverse: false
425
- });
426
- }
427
- } catch (err) {
428
- console.log(err);
429
- }
430
370
  };
@@ -95,32 +95,28 @@ export class TableUtil {
95
95
  }
96
96
  };
97
97
  deleteRow = () => {
98
- try {
99
- const {
100
- selection
101
- } = this.editor;
102
- if (!!selection && Range.isCollapsed(selection)) {
103
- const [tableNode] = Editor.nodes(this.editor, {
104
- match: n => !Editor.isEditor(n) && Element.isElement(n) && n.type === "table-row"
98
+ const {
99
+ selection
100
+ } = this.editor;
101
+ if (!!selection && Range.isCollapsed(selection)) {
102
+ const [tableNode] = Editor.nodes(this.editor, {
103
+ match: n => !Editor.isEditor(n) && Element.isElement(n) && n.type === "table-row"
104
+ });
105
+ if (tableNode) {
106
+ const [[table, tablePath]] = Editor.nodes(this.editor, {
107
+ match: n => !Editor.isEditor(n) && Element.isElement(n) && n.type === "table"
108
+ });
109
+ const [, currentRow] = tableNode;
110
+ const path = currentRow;
111
+ Transforms.removeNodes(this.editor, {
112
+ at: path
113
+ });
114
+ Transforms.setNodes(this.editor, {
115
+ rows: table.rows - 1
116
+ }, {
117
+ at: tablePath
105
118
  });
106
- if (tableNode) {
107
- const [[table, tablePath]] = Editor.nodes(this.editor, {
108
- match: n => !Editor.isEditor(n) && Element.isElement(n) && n.type === "table"
109
- });
110
- const [, currentRow] = tableNode;
111
- const path = currentRow;
112
- Transforms.removeNodes(this.editor, {
113
- at: path
114
- });
115
- Transforms.setNodes(this.editor, {
116
- rows: table.rows - 1
117
- }, {
118
- at: tablePath
119
- });
120
- }
121
119
  }
122
- } catch (error) {
123
- console.log("Error", error);
124
120
  }
125
121
  };
126
122
  insertColumn = action => {
@@ -155,38 +151,34 @@ export class TableUtil {
155
151
  }
156
152
  };
157
153
  deleteColumn = () => {
158
- try {
159
- const {
160
- selection
161
- } = this.editor;
162
- if (!!selection && Range.isCollapsed(selection)) {
163
- const [tableNode] = Editor.nodes(this.editor, {
164
- match: n => !Editor.isEditor(n) && Element.isElement(n) && n.type === "table-cell"
154
+ const {
155
+ selection
156
+ } = this.editor;
157
+ if (!!selection && Range.isCollapsed(selection)) {
158
+ const [tableNode] = Editor.nodes(this.editor, {
159
+ match: n => !Editor.isEditor(n) && Element.isElement(n) && n.type === "table-cell"
160
+ });
161
+ if (tableNode) {
162
+ const [[table, tablePath]] = Editor.nodes(this.editor, {
163
+ match: n => !Editor.isEditor(n) && Element.isElement(n) && n.type === "table"
165
164
  });
166
- if (tableNode) {
167
- const [[table, tablePath]] = Editor.nodes(this.editor, {
168
- match: n => !Editor.isEditor(n) && Element.isElement(n) && n.type === "table"
169
- });
170
- const [, currentCell] = tableNode;
171
- const startPath = currentCell;
165
+ const [, currentCell] = tableNode;
166
+ const startPath = currentCell;
172
167
 
173
- // The last two indices of the path represents the row and column. We need to add one cell to each row starting from the first row
174
- startPath[startPath.length - 2] = 0;
175
- for (let row = 0; row < table.rows; row++) {
176
- Transforms.removeNodes(this.editor, {
177
- at: startPath
178
- });
179
- startPath[startPath.length - 2]++;
180
- }
181
- Transforms.setNodes(this.editor, {
182
- columns: table.columns - 1
183
- }, {
184
- at: tablePath
168
+ // The last two indices of the path represents the row and column. We need to add one cell to each row starting from the first row
169
+ startPath[startPath.length - 2] = 0;
170
+ for (let row = 0; row < table.rows; row++) {
171
+ Transforms.removeNodes(this.editor, {
172
+ at: startPath
185
173
  });
174
+ startPath[startPath.length - 2]++;
186
175
  }
176
+ Transforms.setNodes(this.editor, {
177
+ columns: table.columns - 1
178
+ }, {
179
+ at: tablePath
180
+ });
187
181
  }
188
- } catch (error) {
189
- console.log("Error ", error);
190
182
  }
191
183
  };
192
184
  updateTableStyle = (styleProps, paths) => {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@flozy/editor",
3
- "version": "3.9.1",
3
+ "version": "3.9.4",
4
4
  "description": "An Editor for flozy app brain",
5
5
  "files": [
6
6
  "dist"
@@ -46,7 +46,6 @@
46
46
  "slate-react": "^0.98.3",
47
47
  "styled-components": "^5.3.11",
48
48
  "use-debounce": "^10.0.0",
49
- "wavesurfer.js": "^7.8.6",
50
49
  "web-vitals": "^2.1.4",
51
50
  "y-websocket": "^1.5.0",
52
51
  "yjs": "^13.6.8"
@@ -62,10 +61,10 @@
62
61
  "build": "NODE_OPTIONS='--max_old_space_size=4096' craco build",
63
62
  "test": "craco test --passWithNoTests",
64
63
  "eject": "react-scripts eject",
65
- "storybook": "storybook dev -p 6006",
64
+ "storybook": "NODE_OPTIONS='--max_old_space_size=4096' storybook dev -p 6006",
66
65
  "build-storybook": "NODE_OPTIONS='--max_old_space_size=4096' storybook build",
67
66
  "publish:npm": "rm -rf dist && mkdir dist && babel src/components -d dist --copy-files",
68
- "publish:local": "rm -rf /Users/agenciflow08/Documents/flozyapp/client/node_modules/@flozy/editor/dist && babel src/components -d /Users/agenciflow08/Documents/flozyapp/client/node_modules/@flozy/editor/dist --copy-files"
67
+ "publish:local": "rm -rf /Users/agenciflow08/Documents/flozy/client/node_modules/@flozy/editor/dist && babel src/components -d /Users/agenciflow08/Documents/flozy/client/node_modules/@flozy/editor/dist --copy-files"
69
68
  },
70
69
  "eslintConfig": {
71
70
  "extends": [
@@ -1,73 +0,0 @@
1
- import { Box } from "@mui/material";
2
- import { useEffect, useRef, useState } from "react";
3
- import WaveSurfer from "wavesurfer.js";
4
- import { jsx as _jsx } from "react/jsx-runtime";
5
- const SoundWave = props => {
6
- const {
7
- audioChunks = null
8
- } = props; // Initialize to null if not provided
9
- const waveContent = useRef(null);
10
- const wavesurfer = useRef(null);
11
- const [playOnce, setPlayOnce] = useState(false);
12
- useEffect(() => {
13
- if (waveContent.current) {
14
- if (wavesurfer.current) {
15
- wavesurfer.current.destroy();
16
- }
17
- wavesurfer.current = WaveSurfer.create({
18
- container: waveContent.current,
19
- waveColor: "#2563EB",
20
- progressColor: "#2563EB",
21
- cursorWidth: 0,
22
- // Disable the cursor
23
- barWidth: 2,
24
- barGap: 1,
25
- barRadius: 2,
26
- scrollParent: false,
27
- // Prevent scrolling
28
- height: waveContent.current.clientHeight // Set height to fit container
29
- });
30
-
31
- // Fit the waveform to the container width
32
- const resize = () => {
33
- if (wavesurfer.current) {
34
- const containerWidth = waveContent.current.clientWidth;
35
- const duration = wavesurfer.current.getDuration();
36
- if (duration > 0) {
37
- const newZoom = containerWidth / duration;
38
- wavesurfer.current.zoom(newZoom);
39
- }
40
- }
41
- };
42
- window.addEventListener("resize", resize);
43
- resize();
44
- return () => {
45
- window.removeEventListener("resize", resize);
46
- };
47
- }
48
- }, []);
49
- useEffect(() => {
50
- if (wavesurfer.current && audioChunks) {
51
- const audioBlob = new Blob(audioChunks, {
52
- type: "audio/webm"
53
- });
54
- const recordedUrl = URL.createObjectURL(audioBlob);
55
- wavesurfer.current.load(recordedUrl).then().catch(e => console.error("Error loading audio: ", e));
56
- if (!playOnce) {
57
- setPlayOnce(true);
58
- }
59
- } else if (wavesurfer.current && !audioChunks) {
60
- // Clear the waveform when audioChunks is null
61
- wavesurfer.current.empty();
62
- }
63
- }, [audioChunks, playOnce]);
64
- return /*#__PURE__*/_jsx(Box, {
65
- ref: waveContent,
66
- style: {
67
- width: "100%",
68
- height: "100%",
69
- overflow: "hidden"
70
- }
71
- });
72
- };
73
- export const AudioWave = SoundWave;
@@ -1,177 +0,0 @@
1
- import { useState, useEffect, useRef, cloneElement } from "react";
2
- import PropTypes from "prop-types";
3
- import STTStyles from "./style";
4
- import { Grid, IconButton, Box } from "@mui/material";
5
- import { AudioWave } from "./AudioWave";
6
- import { CloseGreyCircle, PauseRecordingIcon, TickBlueCircle } from "../../../assets/svg/AIIcons";
7
- import { MODES } from "../helper";
8
- import { jsx as _jsx } from "react/jsx-runtime";
9
- import { jsxs as _jsxs } from "react/jsx-runtime";
10
- function STT(props) {
11
- const {
12
- children,
13
- otherProps,
14
- onSend
15
- } = props;
16
- const {
17
- services
18
- } = otherProps;
19
- const classes = STTStyles();
20
- const [isRecording, setIsRecording] = useState(false);
21
- const [mediaRecorder, setMediaRecorder] = useState(null);
22
- const [audioChunks, setAudioChunks] = useState([]);
23
- const [chunkIndex, setChunkIndex] = useState(0);
24
- const audioChunksRef = useRef([]);
25
- const [transcription, setTranscription] = useState("");
26
- const [showPause, setShowPause] = useState(true);
27
- const [isAILoading, setAILoading] = useState(false);
28
- const setChunk = event => {
29
- if (event.data.size > 0) {
30
- setAudioChunks(prev => {
31
- const updatedChunks = [...prev, event.data];
32
- audioChunksRef.current = updatedChunks; // Update ref manually
33
- return updatedChunks;
34
- });
35
- }
36
- };
37
- const sendChunck = async (isLast = false) => {
38
- if (audioChunksRef.current.length > 0) {
39
- const audioBlob = new Blob(audioChunksRef.current, {
40
- type: "audio/webm"
41
- });
42
- const formData = new FormData();
43
- formData.append("audio", audioBlob, `audio_chunk_${chunkIndex}.wav`);
44
- formData.append("chunkIndex", chunkIndex); // Send chunk index to the backend
45
- if (isLast) {
46
- formData.append("isLastChunk", true); // Send chunk index to the backend
47
- } else {
48
- formData.append("isLastChunk", false);
49
- setChunkIndex(prevIndex => prevIndex + 1);
50
- }
51
- const result = await services("speechToText", {
52
- formData
53
- });
54
- setTranscription(result?.data);
55
- await sendChunck();
56
- }
57
- };
58
- const handleStopRecording = () => {
59
- sendChunck(true);
60
- setAudioChunks([]);
61
- };
62
- const startRecording = async () => {
63
- setTranscription("");
64
- const stream = await navigator.mediaDevices.getUserMedia({
65
- audio: true
66
- });
67
- const recorder = new MediaRecorder(stream);
68
- setMediaRecorder(recorder);
69
- recorder.ondataavailable = setChunk;
70
- recorder.onstop = handleStopRecording;
71
- recorder.start(100);
72
- setIsRecording(true);
73
- setTimeout(() => {
74
- sendChunck();
75
- }, 2000);
76
- };
77
- const stopRecording = () => {
78
- if (mediaRecorder) {
79
- mediaRecorder.stop();
80
-
81
- // Stop all tracks to release the microphone
82
- if (mediaRecorder.stream) {
83
- mediaRecorder.stream.getTracks().forEach(track => track.stop());
84
- }
85
- setChunkIndex(0);
86
- setShowPause(false);
87
- }
88
- };
89
- const sendToInfiniti = async () => {
90
- setAILoading(true);
91
- setIsRecording(false);
92
- const result = await services("infinityAI", {
93
- mode: MODES.default,
94
- query: transcription
95
- });
96
- const text = result?.data || "";
97
- onSend("speech_to_text", {
98
- text
99
- });
100
- stopRecording();
101
- setAILoading(false);
102
- };
103
- const closeRecording = () => {
104
- setAudioChunks([]);
105
- stopRecording();
106
- setIsRecording(false);
107
- setShowPause(true);
108
- setTranscription("");
109
- };
110
- useEffect(() => {
111
- audioChunksRef.current = audioChunks;
112
- }, [audioChunks]);
113
- const transcriptionText = transcription && transcription.replace(/\s+/g, "")?.length; // Remove all whitespace characters like \n \t
114
-
115
- return /*#__PURE__*/_jsx(Grid, {
116
- xs: 12,
117
- children: /*#__PURE__*/_jsx(Grid, {
118
- className: classes.SttContainer,
119
- children: !isRecording ? /*#__PURE__*/_jsx(Grid, {
120
- xs: 12,
121
- children: /*#__PURE__*/cloneElement(children, {
122
- startRecording,
123
- isAILoading
124
- })
125
- }) : /*#__PURE__*/_jsxs(Grid, {
126
- xs: 12,
127
- sx: classes.AudioVizualizerContainer,
128
- children: [transcriptionText ? /*#__PURE__*/_jsx(Grid, {
129
- xs: 12,
130
- sx: classes.TranscriptionContainer,
131
- children: /*#__PURE__*/_jsx("pre", {
132
- style: {
133
- whiteSpace: "pre-wrap",
134
- wordWrap: "break-word",
135
- fontFamily: "inherit",
136
- margin: 0
137
- },
138
- children: transcription
139
- })
140
- }) : null, /*#__PURE__*/_jsxs(Grid, {
141
- xs: 12,
142
- sx: classes.AudioVizualizerContent,
143
- children: [/*#__PURE__*/_jsx(Box, {
144
- children: /*#__PURE__*/_jsx(IconButton, {
145
- onClick: closeRecording,
146
- children: /*#__PURE__*/_jsx(CloseGreyCircle, {})
147
- })
148
- }), /*#__PURE__*/_jsx(Box, {
149
- sx: classes.AudioVisualiser,
150
- children: /*#__PURE__*/_jsx(AudioWave, {
151
- audioChunks: audioChunks
152
- })
153
- }), /*#__PURE__*/_jsx(Box, {
154
- children: showPause ? /*#__PURE__*/_jsx(IconButton, {
155
- onClick: stopRecording,
156
- children: /*#__PURE__*/_jsx(PauseRecordingIcon, {})
157
- }) : /*#__PURE__*/_jsx(IconButton, {
158
- onClick: sendToInfiniti,
159
- disabled: !transcriptionText,
160
- style: !transcriptionText ? {
161
- opacity: 0.5
162
- } : {},
163
- children: /*#__PURE__*/_jsx(TickBlueCircle, {})
164
- })
165
- })]
166
- })]
167
- })
168
- })
169
- });
170
- }
171
- STT.defaultProps = {
172
- classes: {}
173
- };
174
- STT.propTypes = {
175
- classes: PropTypes.object
176
- };
177
- export const VoiceToText = STT;
@@ -1,40 +0,0 @@
1
- const styles = () => ({
2
- SttContainer: {
3
- display: "flex",
4
- width: "100%",
5
- padding: "12px",
6
- zIndex: 1
7
- },
8
- STTInput: {
9
- width: "100%",
10
- borderRadius: "8px",
11
- "&& .MuiOutlinedInput-root .MuiOutlinedInput-notchedOutline": {
12
- borderColor: "#2563EB"
13
- },
14
- "&& .MuiOutlinedInput-root": {
15
- background: "rgba(252, 250, 255, 1)"
16
- }
17
- },
18
- AudioVizualizerContainer: {
19
- width: "100%",
20
- display: "flex",
21
- background: "rgba(252, 250, 255, 1)",
22
- borderRadius: "8px",
23
- border: "1px solid #2563EB",
24
- alignItems: "center",
25
- flexWrap: "wrap"
26
- },
27
- AudioVizualizerContent: {
28
- display: "flex",
29
- height: "50px",
30
- width: "100%"
31
- },
32
- AudioVisualiser: {
33
- flexGrow: "1",
34
- height: "100%"
35
- },
36
- TranscriptionContainer: {
37
- padding: "12px"
38
- }
39
- });
40
- export default styles;
@@ -1,28 +0,0 @@
1
- const LinkPopupStyles = themeType => ({
2
- addLinkField: {
3
- "& .MuiOutlinedInput-input": {
4
- fontSize: "12px",
5
- fontWeight: 500,
6
- color: themeType === "dark" ? "#FFFFFF !important" : "#000000 !important"
7
- },
8
- "& .MuiFormHelperText-root": {
9
- color: themeType === "dark" ? "#FFFFFF !important" : "#000000 !important"
10
- },
11
- "& .MuiOutlinedInput-root": {
12
- boxShadow: "0px 4px 10px rgba(0, 0, 0, 0.16)",
13
- color: themeType === "dark" ? "#FFFFFF !important" : "#000000 !important",
14
- borderRadius: "7px",
15
- "& fieldset": {
16
- borderColor: "#D8DDE1"
17
- },
18
- "&:hover fieldset": {
19
- borderColor: "#64748B"
20
- },
21
- "&.Mui-focused fieldset": {
22
- borderColor: "#2563EB"
23
- },
24
- "& .MuiFormLabel-root": {}
25
- }
26
- }
27
- });
28
- export default LinkPopupStyles;