@flozy/editor 1.5.9 → 1.6.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (50) hide show
  1. package/dist/Editor/CommonEditor.js +89 -15
  2. package/dist/Editor/Editor.css +194 -24
  3. package/dist/Editor/Elements/Accordion/Accordion.js +0 -1
  4. package/dist/Editor/Elements/Accordion/AccordionSummary.js +0 -1
  5. package/dist/Editor/Elements/AppHeader/AppHeader.js +134 -131
  6. package/dist/Editor/Elements/AppHeader/AppHeaderPopup.js +4 -2
  7. package/dist/Editor/Elements/Button/EditorButton.js +4 -4
  8. package/dist/Editor/Elements/Color Picker/ColorPicker.js +29 -58
  9. package/dist/Editor/Elements/Embed/Embed.js +17 -15
  10. package/dist/Editor/Elements/Embed/Image.js +11 -2
  11. package/dist/Editor/Elements/Embed/Video.js +10 -2
  12. package/dist/Editor/Elements/Form/Form.js +0 -1
  13. package/dist/Editor/Elements/Form/FormElements/FormText.js +3 -2
  14. package/dist/Editor/Elements/Form/FormElements/FormTextArea.js +3 -2
  15. package/dist/Editor/Elements/Grid/Grid.js +128 -43
  16. package/dist/Editor/Elements/Grid/GridItem.js +2 -2
  17. package/dist/Editor/Elements/InlineIcon/InlineIcon.js +0 -1
  18. package/dist/Editor/Elements/PageSettings/PageSettings.js +4 -2
  19. package/dist/Editor/Elements/PageSettings/PageSettingsButton.js +0 -2
  20. package/dist/Editor/Elements/PageSettings/PageSettingsPopup.js +1 -1
  21. package/dist/Editor/Toolbar/FormatTools/Autocomplete.js +0 -2
  22. package/dist/Editor/Toolbar/FormatTools/FontFamilyDropdown.js +63 -0
  23. package/dist/Editor/Toolbar/FormatTools/FontSize.js +112 -0
  24. package/dist/Editor/Toolbar/FormatTools/index.js +3 -1
  25. package/dist/Editor/Toolbar/PopupTool/TextFormat.js +3 -3
  26. package/dist/Editor/Toolbar/PopupTool/index.js +25 -49
  27. package/dist/Editor/Toolbar/Toolbar.js +21 -5
  28. package/dist/Editor/Toolbar/styles.css +135 -17
  29. package/dist/Editor/Toolbar/toolbarGroups.js +21 -10
  30. package/dist/Editor/common/Icon.js +7 -1
  31. package/dist/Editor/common/ImageList.js +69 -0
  32. package/dist/Editor/common/ImageUploader.js +83 -0
  33. package/dist/Editor/common/StyleBuilder/appHeaderStyle.js +5 -5
  34. package/dist/Editor/common/StyleBuilder/buttonStyle.js +1 -1
  35. package/dist/Editor/common/StyleBuilder/embedImageStyle.js +15 -2
  36. package/dist/Editor/common/StyleBuilder/embedVideoStyle.js +8 -0
  37. package/dist/Editor/common/StyleBuilder/fieldTypes/alignment.js +2 -3
  38. package/dist/Editor/common/StyleBuilder/fieldTypes/backgroundImage.js +41 -1
  39. package/dist/Editor/common/StyleBuilder/fieldTypes/fontSize.js +95 -0
  40. package/dist/Editor/common/StyleBuilder/fieldTypes/icons.js +14 -2
  41. package/dist/Editor/common/StyleBuilder/fieldTypes/index.js +3 -1
  42. package/dist/Editor/common/StyleBuilder/fieldTypes/menusArray.js +0 -1
  43. package/dist/Editor/common/StyleBuilder/fieldTypes/textOptions.js +3 -2
  44. package/dist/Editor/common/Uploader.js +25 -54
  45. package/dist/Editor/helper/index.js +0 -1
  46. package/dist/Editor/hooks/useDrag.js +2 -2
  47. package/dist/Editor/utils/SlateUtilityFunctions.js +1 -0
  48. package/dist/Editor/utils/button.js +2 -1
  49. package/dist/Editor/utils/embed.js +6 -3
  50. package/package.json +3 -2
@@ -12,7 +12,8 @@ const FormTextArea = props => {
12
12
  borderWidth,
13
13
  borderColor,
14
14
  textColor,
15
- bgColor
15
+ bgColor,
16
+ ...rest
16
17
  } = fieldProps;
17
18
  const {
18
19
  left,
@@ -36,7 +37,7 @@ const FormTextArea = props => {
36
37
  },
37
38
  contentEditable: false,
38
39
  children: /*#__PURE__*/_jsx("textarea", {
39
- ...fieldProps,
40
+ ...rest,
40
41
  onChange: onChange,
41
42
  style: {
42
43
  width: "100%",
@@ -1,15 +1,19 @@
1
+ /* eslint-disable no-unused-vars */
1
2
  import React, { useState, useEffect } from "react";
2
3
  import { Transforms, Path, Node } from "slate";
3
4
  import { useSelected, useSlateStatic, ReactEditor } from "slate-react";
4
5
  import { gridItem } from "../../utils/gridItem";
5
6
  import GridPopup from "./GridPopup";
6
7
  import { IconButton, Tooltip } from "@mui/material";
7
- // import CompressIcon from "@mui/icons-material/Compress";
8
8
  import { insertGrid } from "../../utils/grid";
9
- import useDragAndDrop from "../../common/useDragAndDrop";
9
+ // import useDragAndDrop from "../../common/useDragAndDrop";
10
10
  import useResize from "../../utils/customHooks/useResize";
11
11
  import { GridAddGridIcon, GridAddSectionIcon, GridSettingsIcon } from "../../common/iconslist";
12
+ import ArrowUpwardIcon from "@mui/icons-material/ArrowUpward";
13
+ import ArrowDownwardIcon from "@mui/icons-material/ArrowDownward";
14
+ import KeyboardReturnIcon from "@mui/icons-material/KeyboardReturn";
12
15
  import { jsx as _jsx } from "react/jsx-runtime";
16
+ import { Fragment as _Fragment } from "react/jsx-runtime";
13
17
  import { jsxs as _jsxs } from "react/jsx-runtime";
14
18
  const Grid = props => {
15
19
  const {
@@ -29,7 +33,7 @@ const Grid = props => {
29
33
  bgColor,
30
34
  alignment,
31
35
  backgroundImage,
32
- size: elSize,
36
+ // size: elSize,
33
37
  fgColor,
34
38
  borderWidth,
35
39
  borderColor,
@@ -53,17 +57,14 @@ const Grid = props => {
53
57
  bottomLeft,
54
58
  bottomRight
55
59
  } = borderRadius || {};
56
- const {
57
- height: elHeight
58
- } = elSize || {};
60
+ // const { height: elHeight } = elSize || {};
59
61
  const editor = useSlateStatic();
60
62
  const selected = useSelected();
61
63
  // const [selected, setSelected] = useState(false);
62
64
  const path = ReactEditor.findPath(editor, element);
63
65
  const [parentDOM, setParentDOM] = useState(null);
64
-
65
66
  // resize
66
- const [size, onMouseDown, resizing, onLoad] = useResize({
67
+ const [size,, resizing, onLoad] = useResize({
67
68
  parentDOM,
68
69
  size: element?.size,
69
70
  isGrid: true
@@ -154,49 +155,115 @@ const Grid = props => {
154
155
  console.log(err);
155
156
  }
156
157
  };
157
- const onDrop = dropElement => {
158
+ const onMoveSection = direction => e => {
158
159
  try {
159
- Transforms.insertNodes(editor, JSON.parse(dropElement), {
160
- at: path,
161
- select: true
162
- });
160
+ e.preventDefault();
161
+ e.stopPropagation();
162
+ if (direction) {
163
+ let moveTo = direction === "up" ? path[0] - 1 : path[0] + 1;
164
+ if (moveTo < 0) {
165
+ moveTo = 0;
166
+ } else if (moveTo > editor.children.length - 1) {
167
+ moveTo = editor.children.length - 1;
168
+ }
169
+ Transforms.moveNodes(editor, {
170
+ at: [path[0]],
171
+ to: [moveTo]
172
+ });
173
+ }
163
174
  } catch (err) {
164
175
  console.log(err);
165
176
  }
166
177
  };
167
- const onDragEnd = () => {
178
+ const onNewLine = direction => () => {
168
179
  try {
169
- const currentDelpath = ReactEditor.findPath(editor, element);
170
- if (currentDelpath) {
171
- Transforms.removeNodes(editor, {
172
- at: currentDelpath
180
+ if (direction) {
181
+ let moveTo = direction === "up" ? path[0] - 1 : path[0] + 1;
182
+ let lastLine = false;
183
+ if (moveTo < 0) {
184
+ moveTo = 0;
185
+ } else if (moveTo > editor.children.length - 1) {
186
+ moveTo = editor.children.length;
187
+ lastLine = true;
188
+ }
189
+ Transforms.insertNodes(editor, {
190
+ type: "paragraph",
191
+ children: [{
192
+ text: ""
193
+ }]
194
+ }, {
195
+ at: [moveTo]
173
196
  });
197
+ if (lastLine) {
198
+ Transforms.move(editor, {
199
+ at: [moveTo]
200
+ });
201
+ }
174
202
  }
175
203
  } catch (err) {
176
204
  console.log(err);
177
205
  }
178
206
  };
179
- const grid_drag_id = `grid_drag_${path.join("_")}`;
180
- const [dndElements, isDragging, isActiveDrag] = useDragAndDrop({
181
- editor,
182
- id: grid_drag_id,
183
- selected,
184
- path,
185
- element,
186
- onDragEnd,
187
- onDrop
188
- });
189
207
 
190
- // const onMouseOver = (e) => {
191
- // e.stopPropagation();
192
- // setSelected(true);
208
+ // const onDrop = (dropElement) => {
209
+ // try {
210
+ // Transforms.insertNodes(editor, JSON.parse(dropElement), {
211
+ // at: path,
212
+ // select: true,
213
+ // });
214
+ // } catch (err) {
215
+ // console.log(err);
216
+ // }
193
217
  // };
194
218
 
195
- // const onMouseLeave = (e) => {
196
- // e.stopPropagation();
197
- // setSelected(false);
219
+ // const onDragEnd = () => {
220
+ // try {
221
+ // const currentDelpath = ReactEditor.findPath(editor, element);
222
+ // if (currentDelpath) {
223
+ // Transforms.removeNodes(editor, { at: currentDelpath });
224
+ // }
225
+ // } catch (err) {
226
+ // console.log(err);
227
+ // }
198
228
  // };
199
229
 
230
+ // const grid_drag_id = `grid_drag_${path.join("_")}`;
231
+
232
+ // const [dndElements, isDragging, isActiveDrag] = useDragAndDrop({
233
+ // editor,
234
+ // id: grid_drag_id,
235
+ // selected,
236
+ // path,
237
+ // element,
238
+ // onDragEnd,
239
+ // onDrop,
240
+ // });
241
+
242
+ const NewLineButtons = () => {
243
+ return !readOnly && selected && path.length === 2 ? /*#__PURE__*/_jsxs(_Fragment, {
244
+ children: [/*#__PURE__*/_jsx("div", {
245
+ className: "element-selector-ctrl tc",
246
+ children: /*#__PURE__*/_jsx(Tooltip, {
247
+ title: "Add Space above",
248
+ arrow: true,
249
+ children: /*#__PURE__*/_jsx(IconButton, {
250
+ onClick: onNewLine("up"),
251
+ children: /*#__PURE__*/_jsx(KeyboardReturnIcon, {})
252
+ })
253
+ })
254
+ }), /*#__PURE__*/_jsx("div", {
255
+ className: "element-selector-ctrl bc",
256
+ children: /*#__PURE__*/_jsx(Tooltip, {
257
+ title: "Add Space below",
258
+ arrow: true,
259
+ children: /*#__PURE__*/_jsx(IconButton, {
260
+ onClick: onNewLine("down"),
261
+ children: /*#__PURE__*/_jsx(KeyboardReturnIcon, {})
262
+ })
263
+ })
264
+ })]
265
+ }) : null;
266
+ };
200
267
  const GridToolBar = () => {
201
268
  return selected ? /*#__PURE__*/_jsxs("div", {
202
269
  className: "grid-container-toolbar",
@@ -222,7 +289,23 @@ const Grid = props => {
222
289
  onClick: onAddSection(null, true),
223
290
  children: /*#__PURE__*/_jsx(GridAddSectionIcon, {})
224
291
  })
225
- })]
292
+ }), path.length === 2 ? /*#__PURE__*/_jsxs(_Fragment, {
293
+ children: [/*#__PURE__*/_jsx(Tooltip, {
294
+ title: "Move Up",
295
+ arrow: true,
296
+ children: /*#__PURE__*/_jsx(IconButton, {
297
+ onClick: onMoveSection("up"),
298
+ children: /*#__PURE__*/_jsx(ArrowUpwardIcon, {})
299
+ })
300
+ }), /*#__PURE__*/_jsx(Tooltip, {
301
+ title: "Move Down",
302
+ arrow: true,
303
+ children: /*#__PURE__*/_jsx(IconButton, {
304
+ onClick: onMoveSection("down"),
305
+ children: /*#__PURE__*/_jsx(ArrowDownwardIcon, {})
306
+ })
307
+ })]
308
+ }) : null]
226
309
  }) : null;
227
310
  };
228
311
  const sectionId = id ? {
@@ -232,7 +315,7 @@ const Grid = props => {
232
315
  backgroundImage: `url(${backgroundImage})`
233
316
  } : {};
234
317
  return /*#__PURE__*/_jsxs("div", {
235
- className: `grid-container ${grid} has-hover element-root ${isDragging ? "dragging" : ""} ${isActiveDrag ? "active_drag" : ""}`,
318
+ className: `grid-container ${grid} has-hover element-root`,
236
319
  ...attributes,
237
320
  ...sectionId,
238
321
  style: {
@@ -243,10 +326,7 @@ const Grid = props => {
243
326
  borderWidth: borderWidth || "1px",
244
327
  borderRadius: `${topLeft}px ${topRight}px ${bottomLeft}px ${bottomRight}px`,
245
328
  borderStyle: borderStyle || "solid"
246
- }
247
- // onMouseOver={onMouseOver}
248
- // onMouseLeave={onMouseLeave}
249
- ,
329
+ },
250
330
  children: [fgColor && /*#__PURE__*/_jsx("div", {
251
331
  style: {
252
332
  position: "absolute",
@@ -290,11 +370,16 @@ const Grid = props => {
290
370
  alignItems: vertical || "start",
291
371
  justifyContent: horizantal || "start",
292
372
  flexDirection: flexDirection || "row",
293
- width: "100%",
294
- height: resizing ? `${size?.height}px` : elHeight ? `${elHeight}px` : "fit-content"
373
+ width: "100%"
374
+ // height cause overlap issues TBD
375
+ // height: resizing
376
+ // ? `${size?.height}px`
377
+ // : elHeight
378
+ // ? `${elHeight}px`
379
+ // : "fit-content",
295
380
  },
296
381
  children: children
297
- })]
382
+ }), /*#__PURE__*/_jsx(NewLineButtons, {})]
298
383
  });
299
384
  };
300
385
  export default Grid;
@@ -1,6 +1,7 @@
1
+ /* eslint-disable no-unused-vars */
1
2
  import React, { useState } from "react";
2
3
  import { Transforms } from "slate";
3
- import { useSelected, useSlateStatic, ReactEditor } from "slate-react";
4
+ import { useSlateStatic, ReactEditor } from "slate-react";
4
5
  import GridItemPopup from "./GridItemPopup";
5
6
  import { IconButton, Tooltip, Box } from "@mui/material";
6
7
  import { GridSettingsIcon } from "../../common/iconslist";
@@ -79,7 +80,6 @@ const GridItem = props => {
79
80
  const updateData = {
80
81
  ...data
81
82
  };
82
- console.log(updateData);
83
83
  delete updateData.children;
84
84
  Transforms.setNodes(editor, {
85
85
  ...updateData
@@ -29,7 +29,6 @@ const InlineIcon = props => {
29
29
  bottomRight
30
30
  } = borderRadius || {};
31
31
  const BtnIcon = fIcons["Check"];
32
- console.log(icon);
33
32
  return /*#__PURE__*/_jsxs("button", {
34
33
  ...attributes,
35
34
  className: "editor-icon-text",
@@ -2,12 +2,14 @@ import React from "react";
2
2
  import { jsx as _jsx } from "react/jsx-runtime";
3
3
  const PageSettings = props => {
4
4
  const {
5
- attributes
5
+ attributes,
6
+ children
6
7
  } = props;
7
8
  return /*#__PURE__*/_jsx("div", {
8
9
  ...attributes,
9
10
  className: "page-settings",
10
- contentEditable: false
11
+ contentEditable: false,
12
+ children: children
11
13
  });
12
14
  };
13
15
  export default PageSettings;
@@ -54,7 +54,6 @@ const PageSettingsButton = props => {
54
54
  ...data
55
55
  };
56
56
  delete updateData.children;
57
- console.log(openSetttings);
58
57
  if (openSetttings?.path) {
59
58
  Transforms.setNodes(editor, {
60
59
  pageProps: {
@@ -64,7 +63,6 @@ const PageSettingsButton = props => {
64
63
  at: openSetttings?.path
65
64
  });
66
65
  } else {
67
- console.log(editor.children.length);
68
66
  Transforms.insertNodes(editor, [{
69
67
  type: "page-settings",
70
68
  pageProps: {
@@ -10,7 +10,7 @@ const PageSettingsPopup = props => {
10
10
  customProps
11
11
  } = props;
12
12
  return /*#__PURE__*/_jsx(StyleBuilder, {
13
- title: "Grid",
13
+ title: "Page Settings",
14
14
  type: "pageSettingsStyle",
15
15
  element: element,
16
16
  onSave: onSave,
@@ -8,10 +8,8 @@ const Autocomplete = ({
8
8
  options
9
9
  }) => {
10
10
  const value = activeMark(editor, format);
11
- console.log(options);
12
11
  const changeMarkData = (event, format) => {
13
12
  event.preventDefault();
14
- console.log(event.target.value, format);
15
13
  // const value = event.target.value;
16
14
  // addMarkData(editor, { format, value });
17
15
  };
@@ -0,0 +1,63 @@
1
+ import React from "react";
2
+ import { MenuItem, Tooltip, IconButton, Menu } from "@mui/material";
3
+ import { addMarkData } from "../../utils/SlateUtilityFunctions.js";
4
+ import { fontFamilyMap } from "../../utils/font";
5
+ import Icon from "../../common/Icon";
6
+ import { jsx as _jsx } from "react/jsx-runtime";
7
+ import { jsxs as _jsxs } from "react/jsx-runtime";
8
+ const FontFamilyDropdown = ({
9
+ editor,
10
+ format,
11
+ options
12
+ }) => {
13
+ const [anchorEl, setAnchorEl] = React.useState(null);
14
+ const open = Boolean(anchorEl);
15
+ const handleClick = event => {
16
+ setAnchorEl(event.currentTarget);
17
+ };
18
+ const handleClose = () => {
19
+ setAnchorEl(null);
20
+ };
21
+ return /*#__PURE__*/_jsxs(Tooltip, {
22
+ title: format,
23
+ arrow: true,
24
+ style: {
25
+ textTransform: 'capitalize'
26
+ },
27
+ children: [/*#__PURE__*/_jsx(IconButton, {
28
+ "aria-label": "more",
29
+ id: "long-button",
30
+ "aria-controls": open ? 'long-menu' : undefined,
31
+ "aria-expanded": open ? 'true' : undefined,
32
+ "aria-haspopup": "true",
33
+ onClick: handleClick,
34
+ children: /*#__PURE__*/_jsx(Icon, {
35
+ icon: format
36
+ })
37
+ }), /*#__PURE__*/_jsx(Menu, {
38
+ id: "long-menu",
39
+ MenuListProps: {
40
+ 'aria-labelledby': 'long-button'
41
+ },
42
+ anchorEl: anchorEl,
43
+ open: open,
44
+ onClose: handleClose,
45
+ children: options.map((item, index) => /*#__PURE__*/_jsx(MenuItem, {
46
+ value: item.value,
47
+ style: {
48
+ fontFamily: fontFamilyMap[item.value],
49
+ fontSize: 15
50
+ },
51
+ onClick: () => {
52
+ addMarkData(editor, {
53
+ format,
54
+ value: item.value
55
+ });
56
+ handleClose();
57
+ },
58
+ children: item.text
59
+ }, index))
60
+ })]
61
+ });
62
+ };
63
+ export default FontFamilyDropdown;
@@ -0,0 +1,112 @@
1
+ import React, { useEffect, useRef, useState } from 'react';
2
+ import Button from '../../common/Button';
3
+ import Icon from '../../common/Icon';
4
+ import { activeMark, addMarkData, isBlockActive } from '../../utils/SlateUtilityFunctions';
5
+ import usePopup from '../../utils/customHooks/usePopup';
6
+ import { sizeMap } from '../../utils/font';
7
+ import { jsx as _jsx } from "react/jsx-runtime";
8
+ import { jsxs as _jsxs } from "react/jsx-runtime";
9
+ const FontSize = ({
10
+ editor,
11
+ format
12
+ }) => {
13
+ const urlInputRef = useRef();
14
+ let activeValue = activeMark(editor, format);
15
+ const [active, setActive] = useState(false);
16
+ const [fontSize, setFontSize] = useState(16);
17
+ const [showInput, setShowInput] = usePopup(urlInputRef);
18
+ useEffect(() => {
19
+ setFontSize(activeValue === 'normal' ? 16 : getSizeVal(activeValue));
20
+ }, [activeValue]);
21
+ const getSizeVal = value => {
22
+ try {
23
+ const size = `${value}`?.indexOf("px") >= 0 ? value : sizeMap[value] || value;
24
+ return parseInt(size);
25
+ } catch (err) {
26
+ return "";
27
+ }
28
+ };
29
+ const handleButtonClick = e => {
30
+ e.preventDefault();
31
+ if (!active) {
32
+ let activeValue = activeMark(editor, format);
33
+ let defaultValue = activeValue ? sizeMap[activeValue] ? getSizeVal(sizeMap[activeValue]) : +activeValue : 16;
34
+ setFontSize(defaultValue);
35
+ } else {
36
+ setFontSize(16);
37
+ }
38
+ setShowInput(prev => !prev);
39
+ setActive(!active);
40
+ };
41
+ const onInputChange = e => {
42
+ if (e.target.value) {
43
+ setFontSize(e.target.value);
44
+ addMarkData(editor, {
45
+ format,
46
+ value: e.target.value
47
+ });
48
+ }
49
+ };
50
+ const changeWithButton = value => {
51
+ setFontSize(value);
52
+ addMarkData(editor, {
53
+ format,
54
+ value: value
55
+ });
56
+ };
57
+ return /*#__PURE__*/_jsxs("div", {
58
+ ref: urlInputRef,
59
+ className: "popup-wrapper",
60
+ children: [/*#__PURE__*/_jsx(Button, {
61
+ className: `${isBlockActive(editor, format) && "btnActive"}`,
62
+ active: isBlockActive(editor, format),
63
+ style: {
64
+ border: showInput ? '1px solid lightgray' : '',
65
+ borderBottom: 'none'
66
+ },
67
+ format: format,
68
+ onClick: handleButtonClick,
69
+ children: /*#__PURE__*/_jsx(Icon, {
70
+ className: "fontsize",
71
+ icon: format
72
+ })
73
+ }), showInput && /*#__PURE__*/_jsxs("div", {
74
+ className: "fontSizeWrapper popup imagePopup",
75
+ style: {
76
+ display: 'flex',
77
+ justifyContent: 'center',
78
+ maxWidth: '120px'
79
+ },
80
+ children: [/*#__PURE__*/_jsx("span", {
81
+ className: "controls",
82
+ onClick: () => {
83
+ if (activeValue && activeValue > 1) {
84
+ changeWithButton(+fontSize - 1);
85
+ }
86
+ },
87
+ children: "-"
88
+ }), /*#__PURE__*/_jsx("input", {
89
+ value: fontSize,
90
+ type: "text",
91
+ style: {
92
+ border: 'unset',
93
+ outline: 'unset',
94
+ marginBottom: 'unset',
95
+ maxWidth: '36px',
96
+ overflow: 'hidden'
97
+ },
98
+ onChange: onInputChange,
99
+ disabled: !activeValue && activeValue !== 0
100
+ }), /*#__PURE__*/_jsx("span", {
101
+ className: "controls",
102
+ onClick: () => {
103
+ if (activeValue || activeValue === 0) {
104
+ changeWithButton(+fontSize + 1);
105
+ }
106
+ },
107
+ children: "+"
108
+ })]
109
+ })]
110
+ });
111
+ };
112
+ export default FontSize;
@@ -4,4 +4,6 @@ import MarkButton from "./MarkButton";
4
4
  import Autocomplete from "./Autocomplete";
5
5
  import Text from "./Text";
6
6
  import TextSize from "./TextSize";
7
- export { BlockButton, Dropdown, MarkButton, Autocomplete, Text, TextSize };
7
+ import FontFamilyDropdown from "./FontFamilyDropdown";
8
+ import FontSize from './FontSize';
9
+ export { BlockButton, Dropdown, MarkButton, Autocomplete, Text, TextSize, FontFamilyDropdown, FontSize };
@@ -1,7 +1,7 @@
1
1
  import React from "react";
2
2
  import { Grid, Typography } from "@mui/material";
3
- import toolbarGroups from "../toolbarGroups";
4
3
  import { Dropdown, MarkButton, TextSize, BlockButton } from "../FormatTools";
4
+ import { toolbarGroups } from "../toolbarGroups";
5
5
  import ColorPicker from "../../Elements/Color Picker/ColorPicker";
6
6
  import { activeMark } from "../../utils/SlateUtilityFunctions";
7
7
  import { jsx as _jsx } from "react/jsx-runtime";
@@ -133,7 +133,7 @@ const TextFormat = props => {
133
133
  editor: editor,
134
134
  showHex: true,
135
135
  rounded: true
136
- })
136
+ }, "11_cc")
137
137
  })]
138
138
  }), /*#__PURE__*/_jsxs(Grid, {
139
139
  item: true,
@@ -158,7 +158,7 @@ const TextFormat = props => {
158
158
  editor: editor,
159
159
  showHex: true,
160
160
  rounded: true
161
- })
161
+ }, "12_cc")
162
162
  })]
163
163
  })]
164
164
  });