we-editool v0.3.0

About we-editool

light-weight : The package is very light, about 24KB in compression.

tagless : Users don't need to know the tags.

simple : You can use 1 component for edit text.

Getting Started

Installation

Use the package manager npm to install we-editool.

npm install we-editool

yarn add we-editool

Usage

when use WeEditor

import React from 'react';
import { WeEditor, WeEditorRef } from 'we-editor';

function ReactComponent() {
  const editorRef = useRef<WeEditorRef>(null);

  const getHTML = () => editorRef.current?.getHTML();
  const getMarkdown = () => editorRef.current?.getMarkdown();

  return <WeEditor ref={editorRef} />;
}

use your custom editor

import React from 'react';
import { WeToolbar, htmlToMarkdown, WE_EDITOR_ID } from 'we-editor';

function CustomEditor() {
  const editorRef = useRef<HTMLDivElement>(null);

  const getHTML = () => editorRef.current?.innerHTML;
  const getMarkdown = () => htmlToMarkdown(editorRef.current?.innerHTML);

  return (
    <>
      <div contentEditable ref={editorRef} id={WE_EDITOR_ID} className="editor" />
      <WeToolbar editorRef={editorRef} />
    </>
  );
}

API

WeEditor

WeEditorProps

WeEditorRef

WeToolbar

WeToolbarProps

Contributing

Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated.

If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement". Don't forget to give the project a star! Thanks again!

1. Fork the Project
2. Create your Feature Branch (git checkout -b feature/AmazingFeature)
3. Commit your Changes (git commit -m 'Add some AmazingFeature')
4. Push to the Branch (git push origin feature/AmazingFeature)
5. Open a Pull Request to develop branch

License

Distributed under the MIT License. See LICENSE for more information.

Contact

JaeJun Jo - @jtree03 - wowns0903@gmail.com

Project Link: https://github.com/wecode-bootcamp/we-editool