import * as React from "react";
import { RichEditorPosition, RichEditorProps } from "./types";
// import { AlloyEditor } from "alloyeditor";

/**
 * A component for providing rich, wysiwyg text composition. A wrapper of the draft.js library
 */
const RichEditor: React.FC<RichEditorProps> = ({ children }) => {
  // React.useEffect(() => {
  //   AlloyEditor.editable("RichEditor");
  // }, []);

  return (
    <div
      data-testid="Editor-Components-RichEditor"
      id="RichEditor"
      data-placeholder="Click here to enter your content..."
    >
      {children}
    </div>
  );
};

export { RichEditorPosition };
export default RichEditor;