teem-editor 0.2.0 → 1.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +28 -8
- package/dist/teem-editor.cjs +95 -1
- package/dist/teem-editor.cjs.map +1 -1
- package/dist/teem-editor.css +1 -1
- package/dist/teem-editor.js +24621 -1298
- package/dist/teem-editor.js.map +1 -1
- package/package.json +8 -2
package/README.md
CHANGED
|
@@ -14,26 +14,29 @@
|
|
|
14
14
|
|
|
15
15
|
## Features
|
|
16
16
|
|
|
17
|
-
- Headings (`h1`–`h6`), paragraphs, and preformatted text
|
|
17
|
+
- Headings (`h1`–`h6`), paragraphs, blockquote, and preformatted text
|
|
18
18
|
- Bullet and numbered lists
|
|
19
19
|
- Bold, italic, strikethrough
|
|
20
|
-
-
|
|
21
|
-
- Left / center / right alignment
|
|
20
|
+
- Left / center / right alignment (text and images)
|
|
22
21
|
- Indent / outdent (without accidental blockquotes)
|
|
23
|
-
- Link
|
|
22
|
+
- Link insert with hover popover to edit or remove
|
|
23
|
+
- Image insert (secure upload or URL), resize, alt-text editing, and alignment
|
|
24
24
|
- Horizontal rule
|
|
25
|
-
- Text color and
|
|
25
|
+
- Text color, highlight, and custom color picker
|
|
26
26
|
- Undo / redo
|
|
27
|
-
-
|
|
27
|
+
- **HTML source mode** — CodeMirror editor with syntax highlighting
|
|
28
|
+
- **Markdown import** — paste Markdown and convert to sanitized HTML
|
|
29
|
+
- **Fullscreen** editing (press `Esc` to exit)
|
|
30
|
+
- Toolbar **RTL / LTR** toggles for inline text direction
|
|
28
31
|
- i18n UI: `en` (default), `fa`, `ar`
|
|
29
32
|
|
|
30
33
|
## Install
|
|
31
34
|
|
|
32
35
|
```bash
|
|
33
|
-
npm install teem-editor
|
|
36
|
+
npm install teem-editor
|
|
34
37
|
```
|
|
35
38
|
|
|
36
|
-
`react` and `react-dom` must already be in your project.
|
|
39
|
+
`react` and `react-dom` must already be in your project. DOMPurify, CodeMirror, and Marked are bundled as dependencies — no extra install step.
|
|
37
40
|
|
|
38
41
|
Optional font for Persian/Arabic UI: [Vazirmatn](https://fonts.google.com/specimen/Vazirmatn)
|
|
39
42
|
|
|
@@ -77,6 +80,14 @@ export default function MyPage() {
|
|
|
77
80
|
|
|
78
81
|
`dir` defaults to `ltr` for English and `rtl` for `fa` / `ar`. Override anytime with the `dir` prop.
|
|
79
82
|
|
|
83
|
+
### HTML source & Markdown
|
|
84
|
+
|
|
85
|
+
Use the toolbar to switch between visual editing and raw HTML, or paste Markdown and insert converted HTML:
|
|
86
|
+
|
|
87
|
+
- **Edit HTML** — toggle source mode (CodeMirror with HTML highlighting). Changes are sanitized on save.
|
|
88
|
+
- **Markdown** — open the dialog, paste Markdown (GFM), click **Convert & insert**.
|
|
89
|
+
- **Fullscreen** — expand the editor; press `Esc` to exit.
|
|
90
|
+
|
|
80
91
|
## Next.js (App Router)
|
|
81
92
|
|
|
82
93
|
Client Component:
|
|
@@ -161,6 +172,7 @@ ref.current.focus();
|
|
|
161
172
|
ref.current.getHTML();
|
|
162
173
|
ref.current.setHTML('<p>Hello</p>');
|
|
163
174
|
ref.current.clear();
|
|
175
|
+
ref.current.getEditorElement(); // contenteditable root (visual mode)
|
|
164
176
|
```
|
|
165
177
|
|
|
166
178
|
## Helpers
|
|
@@ -170,7 +182,15 @@ import {
|
|
|
170
182
|
sanitizeHtml,
|
|
171
183
|
validateImageFile,
|
|
172
184
|
processImageUpload,
|
|
185
|
+
uploadDefaults,
|
|
186
|
+
createHistory,
|
|
173
187
|
getMessages,
|
|
188
|
+
getDefaultDir,
|
|
189
|
+
resolveLanguage,
|
|
190
|
+
getBlockOptions,
|
|
191
|
+
locales,
|
|
192
|
+
isSafeHref,
|
|
193
|
+
isSafeImageSrc,
|
|
174
194
|
} from 'teem-editor';
|
|
175
195
|
```
|
|
176
196
|
|