@flozy/editor 1.0.8 → 1.1.0

package/dist/Editor/Elements/Mentions/Mentions.js

@@ -1,6 +1,6 @@
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 import React from "react";
 import { useSelected, useFocused } from "slate-react";
+import { jsxs as _jsxs } from "react/jsx-runtime";
 const Mentions = ({
   attributes,
   children,
@@ -25,10 +25,12 @@ const Mentions = ({
   if (element.children[0].italic) {
     style.fontStyle = "italic";
   }
-  return /*#__PURE__*/React.createElement("span", _extends({}, attributes, {
+  return /*#__PURE__*/_jsxs("span", {
+    ...attributes,
     contentEditable: false,
     "data-cy": `mention-${element.character.replace(" ", "-")}`,
-    style: style
-  }), "@", element.character, children);
+    style: style,
+    children: ["@", element.character, children]
+  });
 };
 export default Mentions;

package/dist/Editor/Elements/NewLine/NewLineButton.js

@@ -2,6 +2,7 @@ import React from "react";
 import KeyboardReturnIcon from "@mui/icons-material/KeyboardReturn";
 import { Transforms } from "slate";
 import { useSlateStatic } from "slate-react";
+import { jsx as _jsx } from "react/jsx-runtime";
 const NewLineButton = props => {
   const editor = useSlateStatic();
   const onAddNewLine = () => {
@@ -14,9 +15,10 @@ const NewLineButton = props => {
       at: [editor.children.length]
     });
   };
-  return /*#__PURE__*/React.createElement("button", {
+  return /*#__PURE__*/_jsx("button", {
     title: "New Line",
-    onClick: onAddNewLine
-  }, /*#__PURE__*/React.createElement(KeyboardReturnIcon, null));
+    onClick: onAddNewLine,
+    children: /*#__PURE__*/_jsx(KeyboardReturnIcon, {})
+  });
 };
 export default NewLineButton;

package/dist/Editor/Elements/Table/Table.js

@@ -1,15 +1,22 @@
 import React from "react";
+import { jsx as _jsx } from "react/jsx-runtime";
 const Table = ({
   attributes,
   children,
   element
 }) => {
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/_jsx("div", {
     style: {
       minWidth: "100%",
       maxWidth: "100%",
       overflow: "auto"
-    }
-  }, /*#__PURE__*/React.createElement("table", null, /*#__PURE__*/React.createElement("tbody", attributes, children)));
+    },
+    children: /*#__PURE__*/_jsx("table", {
+      children: /*#__PURE__*/_jsx("tbody", {
+        ...attributes,
+        children: children
+      })
+    })
+  });
 };
 export default Table;

package/dist/Editor/Elements/Table/TableSelector.js

@@ -4,6 +4,8 @@ import usePopup from '../../utils/customHooks/usePopup';
 import { Transforms } from 'slate';
 import { TableUtil } from '../../utils/table.js';
 import './TableSelector.css';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
 const TableSelector = ({
   editor
 }) => {
@@ -55,39 +57,45 @@ const TableSelector = ({
     table.insertTable(tableData.row, tableData.column);
     setShowOptions(false);
   };
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/_jsxs("div", {
     ref: tableOptionsRef,
-    className: "popup-wrapper"
-  }, /*#__PURE__*/React.createElement("button", {
-    style: {
-      border: showOptions ? '1px solid lightgray' : 'none'
-    },
-    title: "table",
-    onClick: handleButtonClick
-  }, /*#__PURE__*/React.createElement(Icon, {
-    icon: "table"
-  })), showOptions && /*#__PURE__*/React.createElement("div", {
-    className: "popup"
-  }, /*#__PURE__*/React.createElement("span", {
-    style: {
-      fontSize: '0.85em'
-    }
-  }, /*#__PURE__*/React.createElement("i", null, `Insert a ${tableData.row >= 1 ? `${tableData.row} x ${tableData.column}` : ''} table`)), /*#__PURE__*/React.createElement("div", {
-    className: "table-input"
-  }, tableInput.map((grp, row) => grp.map(({
-    column,
-    bg
-  }, col) => /*#__PURE__*/React.createElement("div", {
-    key: row + col,
-    onClick: () => handleInsert(),
-    onMouseOver: () => setTableData({
-      row: row + 1,
-      column: column + 1
-    }),
-    className: "table-unit",
-    style: {
-      border: `1px solid ${bg}`
-    }
-  }))))));
+    className: "popup-wrapper",
+    children: [/*#__PURE__*/_jsx("button", {
+      style: {
+        border: showOptions ? '1px solid lightgray' : 'none'
+      },
+      title: "table",
+      onClick: handleButtonClick,
+      children: /*#__PURE__*/_jsx(Icon, {
+        icon: "table"
+      })
+    }), showOptions && /*#__PURE__*/_jsxs("div", {
+      className: "popup",
+      children: [/*#__PURE__*/_jsx("span", {
+        style: {
+          fontSize: '0.85em'
+        },
+        children: /*#__PURE__*/_jsx("i", {
+          children: `Insert a ${tableData.row >= 1 ? `${tableData.row} x ${tableData.column}` : ''} table`
+        })
+      }), /*#__PURE__*/_jsx("div", {
+        className: "table-input",
+        children: tableInput.map((grp, row) => grp.map(({
+          column,
+          bg
+        }, col) => /*#__PURE__*/_jsx("div", {
+          onClick: () => handleInsert(),
+          onMouseOver: () => setTableData({
+            row: row + 1,
+            column: column + 1
+          }),
+          className: "table-unit",
+          style: {
+            border: `1px solid ${bg}`
+          }
+        }, row + col)))
+      })]
+    })]
+  });
 };
 export default TableSelector;

package/dist/Editor/Elements/TableContextMenu/TableContextMenu.js

@@ -5,6 +5,8 @@ import "./styles.css";
 import { TableUtil } from "../../utils/table";
 import { Transforms } from "slate";
 import { ReactEditor } from "slate-react";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
 const TableContextMenu = props => {
   const {
     editor
@@ -70,22 +72,25 @@ const TableContextMenu = props => {
     }
     ReactEditor.focus(editor);
   };
-  return showMenu && /*#__PURE__*/React.createElement("div", {
+  return showMenu && /*#__PURE__*/_jsx("div", {
     className: "contextMenu",
     style: {
       top,
       left
-    }
-  }, menu.map(({
-    icon,
-    text,
-    action
-  }, index) => /*#__PURE__*/React.createElement("div", {
-    className: "menuOption",
-    key: index,
-    onClick: () => handleInsert(action)
-  }, /*#__PURE__*/React.createElement(Icon, {
-    icon: icon
-  }), /*#__PURE__*/React.createElement("span", null, text))));
+    },
+    children: menu.map(({
+      icon,
+      text,
+      action
+    }, index) => /*#__PURE__*/_jsxs("div", {
+      className: "menuOption",
+      onClick: () => handleInsert(action),
+      children: [/*#__PURE__*/_jsx(Icon, {
+        icon: icon
+      }), /*#__PURE__*/_jsx("span", {
+        children: text
+      })]
+    }, index))
+  });
 };
 export default TableContextMenu;

package/dist/Editor/RemoteCursorOverlay/Overlay.js

@@ -1,6 +1,7 @@
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 import React, { useRef } from "react";
 import { useRemoteCursorOverlayPositions } from "@slate-yjs/react";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
 function Caret({
   caretPosition,
   data
@@ -13,21 +14,23 @@ function Caret({
     transform: "translateY(-100%)",
     background: data?.color || "#d33d3db5"
   };
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/_jsx("div", {
     style: {
       ...caretStyle,
       position: "absolute",
       width: "0.5px"
-    }
-  }, /*#__PURE__*/React.createElement("div", {
-    style: {
-      position: "absolute",
-      color: "#FFF",
-      whiteSpace: "nowrap",
-      top: 0,
-      ...labelStyle
-    }
-  }, data?.name));
+    },
+    children: /*#__PURE__*/_jsx("div", {
+      style: {
+        position: "absolute",
+        color: "#FFF",
+        whiteSpace: "nowrap",
+        top: 0,
+        ...labelStyle
+      },
+      children: data?.name
+    })
+  });
 }
 function RemoteSelection({
   data,
@@ -40,20 +43,20 @@ function RemoteSelection({
   const selectionStyle = {
     backgroundColor: data.color
   };
-  return /*#__PURE__*/React.createElement(React.Fragment, null, selectionRects.map((position, i) => /*#__PURE__*/React.createElement("div", {
-    style: {
-      ...selectionStyle,
-      ...position,
-      position: "absolute",
-      pointerEvents: "none"
-    }
-    // eslint-disable-next-line react/no-array-index-key
-    ,
-    key: i
-  })), caretPosition && /*#__PURE__*/React.createElement(Caret, {
-    caretPosition: caretPosition,
-    data: data
-  }));
+  return /*#__PURE__*/_jsxs(React.Fragment, {
+    children: [selectionRects.map((position, i) => /*#__PURE__*/_jsx("div", {
+      style: {
+        ...selectionStyle,
+        ...position,
+        position: "absolute",
+        pointerEvents: "none"
+      }
+      // eslint-disable-next-line react/no-array-index-key
+    }, i)), caretPosition && /*#__PURE__*/_jsx(Caret, {
+      caretPosition: caretPosition,
+      data: data
+    })]
+  });
 }
 export function RemoteCursorOverlay({
   className,
@@ -63,13 +66,14 @@ export function RemoteCursorOverlay({
   const [cursors] = useRemoteCursorOverlayPositions({
     containerRef
   });
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/_jsxs("div", {
     className: `${className}`,
     style: {
       position: "relative"
     },
-    ref: containerRef
-  }, children, cursors.map(cursor => /*#__PURE__*/React.createElement(RemoteSelection, _extends({
-    key: cursor.clientId
-  }, cursor))));
+    ref: containerRef,
+    children: [children, cursors.map(cursor => /*#__PURE__*/_jsx(RemoteSelection, {
+      ...cursor
+    }, cursor.clientId))]
+  });
 }

package/dist/Editor/Toolbar/Toolbar.js

@@ -1,4 +1,3 @@
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 import React, { useEffect, useState } from "react";
 import { useSlate } from "slate-react";
 import Button from "../common/Button";
@@ -18,6 +17,8 @@ import CodeToTextButton from "../Elements/CodeToText/CodeToTextButton";
 import HtmlContextMenu from "../Elements/CodeToText/HtmlContextMenu";
 import GridButton from "../Elements/Grid/GridButton";
 import NewLineButton from "../Elements/NewLine/NewLineButton";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
 const Toolbar = props => {
   const {
     handleCodeToText
@@ -40,42 +41,45 @@ const Toolbar = props => {
   const BlockButton = ({
     format
   }) => {
-    return /*#__PURE__*/React.createElement(Button, {
+    return /*#__PURE__*/_jsx(Button, {
       active: isBlockActive(editor, format),
       format: format,
       onMouseDown: e => {
         e.preventDefault();
         toggleBlock(editor, format);
-      }
-    }, /*#__PURE__*/React.createElement(Icon, {
-      icon: format
-    }));
+      },
+      children: /*#__PURE__*/_jsx(Icon, {
+        icon: format
+      })
+    });
   };
   const MarkButton = ({
     format
   }) => {
-    return /*#__PURE__*/React.createElement(Button, {
+    return /*#__PURE__*/_jsx(Button, {
       active: isMarkActive(editor, format),
       format: format,
       onMouseDown: e => {
         e.preventDefault();
         toggleMark(editor, format);
-      }
-    }, /*#__PURE__*/React.createElement(Icon, {
-      icon: format
-    }));
+      },
+      children: /*#__PURE__*/_jsx(Icon, {
+        icon: format
+      })
+    });
   };
   const Dropdown = ({
     format,
     options
   }) => {
-    return /*#__PURE__*/React.createElement("select", {
+    return /*#__PURE__*/_jsx("select", {
       value: activeMark(editor, format),
-      onChange: e => changeMarkData(e, format)
-    }, options.map((item, index) => /*#__PURE__*/React.createElement("option", {
-      key: index,
-      value: item.value
-    }, item.text)));
+      onChange: e => changeMarkData(e, format),
+      children: options.map((item, index) => /*#__PURE__*/_jsx("option", {
+        value: item.value,
+        children: item.text
+      }, index))
+    });
   };
   const changeMarkData = (event, format) => {
     event.preventDefault();
@@ -85,82 +89,74 @@ const Toolbar = props => {
       value
     });
   };
-  return /*#__PURE__*/React.createElement("div", {
-    className: "toolbar"
-  }, toolbarGroups.map((group, index) => /*#__PURE__*/React.createElement("span", {
-    key: index,
-    className: "toolbar-grp"
-  }, group.map((element, gi) => {
-    switch (element.type) {
-      case "block":
-        return /*#__PURE__*/React.createElement(BlockButton, _extends({
-          key: element.id
-        }, element));
-      case "mark":
-        return /*#__PURE__*/React.createElement(MarkButton, _extends({
-          key: element.id
-        }, element));
-      case "dropdown":
-        return /*#__PURE__*/React.createElement(Dropdown, _extends({
-          key: element.id
-        }, element));
-      case "link":
-        return /*#__PURE__*/React.createElement(LinkButton, {
-          key: element.id,
-          active: isBlockActive(editor, "link"),
-          editor: editor
-        });
-      case "embed":
-        return /*#__PURE__*/React.createElement(Embed, {
-          key: element.id,
-          format: element.format,
-          editor: editor
-        });
-      case "color-picker":
-        return /*#__PURE__*/React.createElement(ColorPicker, {
-          key: element.id,
-          activeMark: activeMark,
-          format: element.format,
-          editor: editor
-        });
-      case "table":
-        return /*#__PURE__*/React.createElement(TableSelector, {
-          key: element.id,
-          editor: editor
-        });
-      case "id":
-        return /*#__PURE__*/React.createElement(Id, {
-          key: `gi_id_${gi}`,
-          editor: editor
-        });
-      case "equation":
-        return /*#__PURE__*/React.createElement(EquationButton, {
-          key: `gi_equation_${gi}`,
-          editor: editor
-        });
-      case "codeToText":
-        return /*#__PURE__*/React.createElement(CodeToTextButton, {
-          key: `gi_codeToText_${gi}`,
-          handleButtonClick: handleCodeToText
-        });
-      case "grid":
-        return /*#__PURE__*/React.createElement(GridButton, {
-          key: element.id,
-          editor: editor
-        });
-      case "newLine":
-        return /*#__PURE__*/React.createElement(NewLineButton, {
-          key: element.id,
-          editor: editor
-        });
-      default:
-        return null;
-    }
-  }))), /*#__PURE__*/React.createElement(TableContextMenu, {
-    editor: editor
-  }), /*#__PURE__*/React.createElement(HtmlContextMenu, {
-    editor: editor,
-    handleCodeToText: handleCodeToText
-  }));
+  return /*#__PURE__*/_jsxs("div", {
+    className: "toolbar",
+    children: [toolbarGroups.map((group, index) => /*#__PURE__*/_jsx("span", {
+      className: "toolbar-grp",
+      children: group.map((element, gi) => {
+        switch (element.type) {
+          case "block":
+            return /*#__PURE__*/_jsx(BlockButton, {
+              ...element
+            }, element.id);
+          case "mark":
+            return /*#__PURE__*/_jsx(MarkButton, {
+              ...element
+            }, element.id);
+          case "dropdown":
+            return /*#__PURE__*/_jsx(Dropdown, {
+              ...element
+            }, element.id);
+          case "link":
+            return /*#__PURE__*/_jsx(LinkButton, {
+              active: isBlockActive(editor, "link"),
+              editor: editor
+            }, element.id);
+          case "embed":
+            return /*#__PURE__*/_jsx(Embed, {
+              format: element.format,
+              editor: editor
+            }, element.id);
+          case "color-picker":
+            return /*#__PURE__*/_jsx(ColorPicker, {
+              activeMark: activeMark,
+              format: element.format,
+              editor: editor
+            }, element.id);
+          case "table":
+            return /*#__PURE__*/_jsx(TableSelector, {
+              editor: editor
+            }, element.id);
+          case "id":
+            return /*#__PURE__*/_jsx(Id, {
+              editor: editor
+            }, `gi_id_${gi}`);
+          case "equation":
+            return /*#__PURE__*/_jsx(EquationButton, {
+              editor: editor
+            }, `gi_equation_${gi}`);
+          case "codeToText":
+            return /*#__PURE__*/_jsx(CodeToTextButton, {
+              handleButtonClick: handleCodeToText
+            }, `gi_codeToText_${gi}`);
+          case "grid":
+            return /*#__PURE__*/_jsx(GridButton, {
+              editor: editor
+            }, element.id);
+          case "newLine":
+            return /*#__PURE__*/_jsx(NewLineButton, {
+              editor: editor
+            }, element.id);
+          default:
+            return null;
+        }
+      })
+    }, index)), /*#__PURE__*/_jsx(TableContextMenu, {
+      editor: editor
+    }), /*#__PURE__*/_jsx(HtmlContextMenu, {
+      editor: editor,
+      handleCodeToText: handleCodeToText
+    })]
+  });
 };
 export default Toolbar;

package/dist/Editor/common/Button.js

@@ -1,5 +1,5 @@
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 import React from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
 const Button = props => {
   const {
     children,
@@ -7,15 +7,16 @@ const Button = props => {
     active,
     ...rest
   } = props;
-  return /*#__PURE__*/React.createElement("button", _extends({
+  return /*#__PURE__*/_jsx("button", {
     className: active ? 'btnActive' : '',
-    title: format
-  }, rest, {
+    title: format,
+    ...rest,
     style: {
       width: '30px',
       height: '20px',
       margin: '0 2px'
-    }
-  }), children);
+    },
+    children: children
+  });
 };
 export default Button;