Skip to content

Commit ad6e93f

Browse files
Jtree03Jtree03
committed
Doc: README, LICENSE, CHANGELOG
1 parent 4c557ff commit ad6e93f

File tree

8 files changed

+499
-232
lines changed

8 files changed

+499
-232
lines changed

‎CHANGELOG.md

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
## 0.3.0 (June 17, 2022)
2+
3+
- Initial public release

‎LICENSE

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
MIT License
2+
3+
Copyright (c) 2022 Gracefulrain
4+
5+
Permission is hereby granted, free of charge, to any person obtaining a copy
6+
of this software and associated documentation files (the "Software"), to deal
7+
in the Software without restriction, including without limitation the rights
8+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9+
copies of the Software, and to permit persons to whom the Software is
10+
furnished to do so, subject to the following conditions:
11+
12+
The above copyright notice and this permission notice shall be included in all
13+
copies or substantial portions of the Software.
14+
15+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21+
SOFTWARE.

‎README.md

Lines changed: 210 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,210 @@
1+
<div id="top"></div>
2+
3+
<!-- PROJECT SHIELDS -->
4+
5+
[![Contributors][contributors-shield]][contributors-url]
6+
[![Forks][forks-shield]][forks-url]
7+
[![Stargazers][stars-shield]][stars-url]
8+
[![Issues][issues-shield]][issues-url]
9+
[![MIT License][license-shield]][license-url]
10+
11+
<br />
12+
13+
<!-- PROJECT LOGO -->
14+
15+
<div align="center">
16+
<a href="https://github.com/wecode-bootcamp/we-editool">
17+
<img width="240" alt="Logo" src="https://user-images.githubusercontent.com/20152376/174044054-a0818405-4498-429e-a2bf-0c4edced080b.png">
18+
</a>
19+
20+
<h1 align="center">we-editool</h3>
21+
22+
<p align="center">
23+
light-weight, tagless and simple text edit tool!
24+
<br />
25+
<a href="https://github.com/wecode-bootcamp/we-editool#about-we-editool"><strong>Explore the docs »</strong></a>
26+
<br />
27+
<br />
28+
<a href="https://github.com/wecode-bootcamp/we-editool/issues">Report Bug</a>
29+
·
30+
<a href="https://github.com/wecode-bootcamp/we-editool/issues">Request Feature</a>
31+
</p>
32+
</div>
33+
34+
<!-- TABLE OF CONTENTS -->
35+
36+
<details>
37+
<summary>Table of Contents</summary>
38+
<ol>
39+
<li>
40+
<a href="#about-we-editool">About we-editool</a>
41+
</li>
42+
<li>
43+
<a href="#getting-started">Getting Started</a>
44+
<ul>
45+
<li><a href="#installation">Installation</a></li>
46+
</ul>
47+
</li>
48+
<li><a href="#usage">Usage</a></li>
49+
<li><a href="#api">API</a></li>
50+
<li><a href="#contributing">Contributing</a></li>
51+
<li><a href="#license">License</a></li>
52+
<li><a href="#contact">Contact</a></li>
53+
<li><a href="#acknowledgments">Acknowledgments</a></li>
54+
</ol>
55+
</details>
56+
57+
<!-- ABOUT THE PROJECT -->
58+
59+
## About we-editool
60+
61+
![typing](https://user-images.githubusercontent.com/20152376/174046345-15243970-0b0a-4cc9-a351-23ba4cdb0a97.gif)
62+
63+
**light-weight** : The package is very light, about 24KB in compression.
64+
65+
**tagless** : Users don't need to know the tags.
66+
67+
**simple** : You can use 1 component for edit text.
68+
69+
<p align="right">(<a href="#top">back to top</a>)</p>
70+
71+
<!-- GETTING STARTED -->
72+
73+
## Getting Started
74+
75+
### Installation
76+
77+
Use the package manager [npm](https://npmjs.com/package/we-editool) to install we-editool.
78+
79+
```sh
80+
npm install we-editool
81+
```
82+
83+
```sh
84+
yarn add we-editool
85+
```
86+
87+
<p align="right">(<a href="#top">back to top</a>)</p>
88+
89+
<!-- USAGE EXAMPLES -->
90+
91+
## Usage
92+
93+
### when use WeEditor
94+
95+
```typescript
96+
import React from 'react';
97+
import { WeEditor, WeEditorRef } from 'we-editor';
98+
99+
function ReactComponent() {
100+
const editorRef = useRef<WeEditorRef>(null);
101+
102+
const getHTML = () => editorRef.current?.getHTML();
103+
const getMarkdown = () => editorRef.current?.getMarkdown();
104+
105+
return <WeEditor ref={editorRef} />;
106+
}
107+
```
108+
109+
### use your custom editor
110+
111+
```typescript
112+
import React from 'react';
113+
import { WeToolbar, htmlToMarkdown, WE_EDITOR_ID } from 'we-editor';
114+
115+
function CustomEditor() {
116+
const editorRef = useRef<HTMLDivElement>(null);
117+
118+
const getHTML = () => editorRef.current?.innerHTML;
119+
const getMarkdown = () => htmlToMarkdown(editorRef.current?.innerHTML);
120+
121+
return (
122+
<>
123+
<div contentEditable ref={editorRef} id={WE_EDITOR_ID} className="editor" />
124+
<WeToolbar editorRef={editorRef} />
125+
</>
126+
);
127+
}
128+
```
129+
130+
<p align="right">(<a href="#top">back to top</a>)</p>
131+
132+
<!-- API -->
133+
134+
## API
135+
136+
### WeEditor
137+
138+
#### WeEditorProps
139+
140+
| name | description | type | default |
141+
| --------------- | ----------------------------- | ------- | ------- |
142+
| initialHTML | initiate with html string | string? | x |
143+
| initialMarkdown | initiate with markdown string | string? | x |
144+
145+
#### WeEditorRef
146+
147+
| name | description | input | output |
148+
| ----------- | ------------------- | -------- | ------ |
149+
| getHTML | get html string | no input | string |
150+
| getMarkdown | get markdown string | no input | string |
151+
152+
### WeToolbar
153+
154+
#### WeToolbarProps
155+
156+
| name | description | type | default |
157+
| --------- | ----------------------- | ------------------------------- | ------- |
158+
| editorRef | editor reference object | React.RefObject<HTMLDivElement> | x |
159+
160+
<p align="right">(<a href="#top">back to top</a>)</p>
161+
162+
<!-- CONTRIBUTING -->
163+
164+
## Contributing
165+
166+
Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are **greatly appreciated**.
167+
168+
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".
169+
Don't forget to give the project a star! Thanks again!
170+
171+
1. Fork the Project
172+
2. Create your Feature Branch (`git checkout -b feature/AmazingFeature`)
173+
3. Commit your Changes (`git commit -m 'Add some AmazingFeature'`)
174+
4. Push to the Branch (`git push origin feature/AmazingFeature`)
175+
5. Open a Pull Request
176+
177+
<p align="right">(<a href="#top">back to top</a>)</p>
178+
179+
<!-- LICENSE -->
180+
181+
## License
182+
183+
Distributed under the MIT License. See [`LICENSE`][license-url] for more information.
184+
185+
<p align="right">(<a href="#top">back to top</a>)</p>
186+
187+
<!-- CONTACT -->
188+
189+
## Contact
190+
191+
JaeJun Jo - [@jtree03](https://twitter.com/jtree03) - [wowns0903@gmail.com](mailto:wowns0903@gmail.com)
192+
193+
Project Link: [https://github.com/wecode-bootcamp/we-editool](https://github.com/wecode-bootcamp/we-editool)
194+
195+
<p align="right">(<a href="#top">back to top</a>)</p>
196+
197+
<!-- https://www.markdownguide.org/basic-syntax/#reference-style-links -->
198+
199+
<!-- MARKDOWN LINKS -->
200+
201+
[contributors-shield]: https://img.shields.io/github/contributors/wecode-bootcamp/we-editool.svg?style=for-the-badge
202+
[contributors-url]: https://github.com/wecode-bootcamp/we-editool/graphs/contributors
203+
[forks-shield]: https://img.shields.io/github/forks/wecode-bootcamp/we-editool.svg?style=for-the-badge
204+
[forks-url]: https://github.com/wecode-bootcamp/we-editool/network/members
205+
[stars-shield]: https://img.shields.io/github/stars/wecode-bootcamp/we-editool.svg?style=for-the-badge
206+
[stars-url]: https://github.com/wecode-bootcamp/we-editool/stargazers
207+
[issues-shield]: https://img.shields.io/github/issues/wecode-bootcamp/we-editool.svg?style=for-the-badge
208+
[issues-url]: https://github.com/wecode-bootcamp/we-editool/issues
209+
[license-shield]: https://img.shields.io/github/license/wecode-bootcamp/we-editool.svg?style=for-the-badge
210+
[license-url]: https://github.com/wecode-bootcamp/we-editool/blob/main/LICENSE

0 commit comments

Comments
 (0)