open-text-editor-latest 1.0.2 → 1.0.6
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/LICENSE +21 -0
- package/docs/PUBLISH.md +31 -31
- package/docs/USAGE.md +81 -81
- package/docs/editor/developer.md +37 -37
- package/package.json +1 -1
- package/src/editor/OpenTextEditor.jsx +1020 -1020
- package/src/editor/README.md +15 -15
- package/src/editor/index.jsx +3 -3
- package/src/editor/plugins/formatting.js +10 -10
- package/src/editor/plugins/history.js +9 -9
- package/src/editor/plugins/image.js +9 -9
- package/src/editor/plugins/index.js +25 -25
- package/src/editor/plugins/table.js +9 -9
- package/src/editor/styles/editor.css +8 -8
package/LICENSE
ADDED
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2026 Danesh Naik
|
|
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.
|
package/docs/PUBLISH.md
CHANGED
|
@@ -1,31 +1,31 @@
|
|
|
1
|
-
# Publishing to npm
|
|
2
|
-
|
|
3
|
-
Steps to publish a new version of `open-text-editor-latest`:
|
|
4
|
-
|
|
5
|
-
1. Update `version` in `package.json` (follow semver).
|
|
6
|
-
2. Commit your changes and push to your git repository.
|
|
7
|
-
3. Ensure you are logged in to npm: `npm login`.
|
|
8
|
-
4. Build the library (the `prepare` step is run automatically by `npm publish`, but you can run it manually to verify):
|
|
9
|
-
|
|
10
|
-
```bash
|
|
11
|
-
npm run build:lib
|
|
12
|
-
```
|
|
13
|
-
|
|
14
|
-
5. Publish to npm (public package):
|
|
15
|
-
|
|
16
|
-
```bash
|
|
17
|
-
npm publish --access public
|
|
18
|
-
```
|
|
19
|
-
|
|
20
|
-
Notes
|
|
21
|
-
- The library build externalizes `react` and `react-dom`; they are declared as peer dependencies. Consumers must install React separately.
|
|
22
|
-
- To test a local tarball before publishing, run:
|
|
23
|
-
|
|
24
|
-
```bash
|
|
25
|
-
npm pack
|
|
26
|
-
# then install the produced tarball in another project (replace <version>):
|
|
27
|
-
npm install ./open-text-editor-latest-<version>.tgz
|
|
28
|
-
```
|
|
29
|
-
|
|
30
|
-
- If you encounter npm tag/version errors (for example when attempting to publish a lower version than already published), either bump the package version in `package.json` or publish with an explicit tag: `npm publish --tag next --access public`.
|
|
31
|
-
|
|
1
|
+
# Publishing to npm
|
|
2
|
+
|
|
3
|
+
Steps to publish a new version of `open-text-editor-latest`:
|
|
4
|
+
|
|
5
|
+
1. Update `version` in `package.json` (follow semver).
|
|
6
|
+
2. Commit your changes and push to your git repository.
|
|
7
|
+
3. Ensure you are logged in to npm: `npm login`.
|
|
8
|
+
4. Build the library (the `prepare` step is run automatically by `npm publish`, but you can run it manually to verify):
|
|
9
|
+
|
|
10
|
+
```bash
|
|
11
|
+
npm run build:lib
|
|
12
|
+
```
|
|
13
|
+
|
|
14
|
+
5. Publish to npm (public package):
|
|
15
|
+
|
|
16
|
+
```bash
|
|
17
|
+
npm publish --access public
|
|
18
|
+
```
|
|
19
|
+
|
|
20
|
+
Notes
|
|
21
|
+
- The library build externalizes `react` and `react-dom`; they are declared as peer dependencies. Consumers must install React separately.
|
|
22
|
+
- To test a local tarball before publishing, run:
|
|
23
|
+
|
|
24
|
+
```bash
|
|
25
|
+
npm pack
|
|
26
|
+
# then install the produced tarball in another project (replace <version>):
|
|
27
|
+
npm install ./open-text-editor-latest-<version>.tgz
|
|
28
|
+
```
|
|
29
|
+
|
|
30
|
+
- If you encounter npm tag/version errors (for example when attempting to publish a lower version than already published), either bump the package version in `package.json` or publish with an explicit tag: `npm publish --tag next --access public`.
|
|
31
|
+
|
package/docs/USAGE.md
CHANGED
|
@@ -1,81 +1,81 @@
|
|
|
1
|
-
Open Text Editor — Usage
|
|
2
|
-
|
|
3
|
-
Install
|
|
4
|
-
|
|
5
|
-
```bash
|
|
6
|
-
npm install open-text-editor-latest
|
|
7
|
-
```
|
|
8
|
-
|
|
9
|
-
Basic usage
|
|
10
|
-
|
|
11
|
-
```jsx
|
|
12
|
-
import React, { useRef } from 'react'
|
|
13
|
-
import OpenTextEditor from 'open-text-editor-latest'
|
|
14
|
-
|
|
15
|
-
export default function App(){
|
|
16
|
-
const ref = useRef(null)
|
|
17
|
-
|
|
18
|
-
return (
|
|
19
|
-
<div style={{padding:20}}>
|
|
20
|
-
<OpenTextEditor
|
|
21
|
-
ref={ref}
|
|
22
|
-
initialValue={`<p>Hello</p>`}
|
|
23
|
-
onChange={(html) => console.log('changed', html)}
|
|
24
|
-
/>
|
|
25
|
-
</div>
|
|
26
|
-
)
|
|
27
|
-
}
|
|
28
|
-
```
|
|
29
|
-
|
|
30
|
-
Props
|
|
31
|
-
- `initialValue` (string): optional initial HTML content
|
|
32
|
-
- `onChange` (html: string) => void: optional change handler
|
|
33
|
-
- `className` (string): optional additional class names applied to the editor container
|
|
34
|
-
|
|
35
|
-
Peer dependencies
|
|
36
|
-
|
|
37
|
-
This package expects React as a peer dependency (supported ranges: `^18 || ^19`). Install them if your project doesn't already include React:
|
|
38
|
-
|
|
39
|
-
```bash
|
|
40
|
-
npm install react@^18 react-dom@^18
|
|
41
|
-
# or for React 19 consumers:
|
|
42
|
-
npm install react@^19 react-dom@^19
|
|
43
|
-
```
|
|
44
|
-
|
|
45
|
-
Imperative API (via `ref`)
|
|
46
|
-
|
|
47
|
-
When mounted with a `ref`, the editor exposes a small imperative API:
|
|
48
|
-
|
|
49
|
-
- `focus()` — focus the editor
|
|
50
|
-
- `getHtml()` — return current editor HTML
|
|
51
|
-
- `setHtml(html)` — replace editor content
|
|
52
|
-
- `insertHtml(html)` — insert HTML at the current selection
|
|
53
|
-
- `execCommand(command, value)` — run low-level `document.execCommand`
|
|
54
|
-
- `insertTable(rows, cols)` — insert a table programmatically
|
|
55
|
-
- `tableAction(action)` — run table actions when a table cell is active
|
|
56
|
-
|
|
57
|
-
Plugins
|
|
58
|
-
|
|
59
|
-
Built-in plugin placeholders live in the source at `src/editor/plugins`. See [docs/editor/developer.md](editor/developer.md) for the plugin contract and examples.
|
|
60
|
-
|
|
61
|
-
Building from source
|
|
62
|
-
|
|
63
|
-
```bash
|
|
64
|
-
git clone https://github.com/danu20002/open-text-editor.git
|
|
65
|
-
cd open-text-editor
|
|
66
|
-
npm install
|
|
67
|
-
npm run build:lib
|
|
68
|
-
```
|
|
69
|
-
|
|
70
|
-
Local test
|
|
71
|
-
|
|
72
|
-
```bash
|
|
73
|
-
npm pack
|
|
74
|
-
# install the generated tarball (replace <version> with the package version):
|
|
75
|
-
npm install ./open-text-editor-latest-<version>.tgz
|
|
76
|
-
```
|
|
77
|
-
|
|
78
|
-
Publishing
|
|
79
|
-
|
|
80
|
-
See [docs/PUBLISH.md](PUBLISH.md) for publish steps and notes about peer dependencies.
|
|
81
|
-
|
|
1
|
+
Open Text Editor — Usage
|
|
2
|
+
|
|
3
|
+
Install
|
|
4
|
+
|
|
5
|
+
```bash
|
|
6
|
+
npm install open-text-editor-latest
|
|
7
|
+
```
|
|
8
|
+
|
|
9
|
+
Basic usage
|
|
10
|
+
|
|
11
|
+
```jsx
|
|
12
|
+
import React, { useRef } from 'react'
|
|
13
|
+
import OpenTextEditor from 'open-text-editor-latest'
|
|
14
|
+
|
|
15
|
+
export default function App(){
|
|
16
|
+
const ref = useRef(null)
|
|
17
|
+
|
|
18
|
+
return (
|
|
19
|
+
<div style={{padding:20}}>
|
|
20
|
+
<OpenTextEditor
|
|
21
|
+
ref={ref}
|
|
22
|
+
initialValue={`<p>Hello</p>`}
|
|
23
|
+
onChange={(html) => console.log('changed', html)}
|
|
24
|
+
/>
|
|
25
|
+
</div>
|
|
26
|
+
)
|
|
27
|
+
}
|
|
28
|
+
```
|
|
29
|
+
|
|
30
|
+
Props
|
|
31
|
+
- `initialValue` (string): optional initial HTML content
|
|
32
|
+
- `onChange` (html: string) => void: optional change handler
|
|
33
|
+
- `className` (string): optional additional class names applied to the editor container
|
|
34
|
+
|
|
35
|
+
Peer dependencies
|
|
36
|
+
|
|
37
|
+
This package expects React as a peer dependency (supported ranges: `^18 || ^19`). Install them if your project doesn't already include React:
|
|
38
|
+
|
|
39
|
+
```bash
|
|
40
|
+
npm install react@^18 react-dom@^18
|
|
41
|
+
# or for React 19 consumers:
|
|
42
|
+
npm install react@^19 react-dom@^19
|
|
43
|
+
```
|
|
44
|
+
|
|
45
|
+
Imperative API (via `ref`)
|
|
46
|
+
|
|
47
|
+
When mounted with a `ref`, the editor exposes a small imperative API:
|
|
48
|
+
|
|
49
|
+
- `focus()` — focus the editor
|
|
50
|
+
- `getHtml()` — return current editor HTML
|
|
51
|
+
- `setHtml(html)` — replace editor content
|
|
52
|
+
- `insertHtml(html)` — insert HTML at the current selection
|
|
53
|
+
- `execCommand(command, value)` — run low-level `document.execCommand`
|
|
54
|
+
- `insertTable(rows, cols)` — insert a table programmatically
|
|
55
|
+
- `tableAction(action)` — run table actions when a table cell is active
|
|
56
|
+
|
|
57
|
+
Plugins
|
|
58
|
+
|
|
59
|
+
Built-in plugin placeholders live in the source at `src/editor/plugins`. See [docs/editor/developer.md](editor/developer.md) for the plugin contract and examples.
|
|
60
|
+
|
|
61
|
+
Building from source
|
|
62
|
+
|
|
63
|
+
```bash
|
|
64
|
+
git clone https://github.com/danu20002/open-text-editor.git
|
|
65
|
+
cd open-text-editor
|
|
66
|
+
npm install
|
|
67
|
+
npm run build:lib
|
|
68
|
+
```
|
|
69
|
+
|
|
70
|
+
Local test
|
|
71
|
+
|
|
72
|
+
```bash
|
|
73
|
+
npm pack
|
|
74
|
+
# install the generated tarball (replace <version> with the package version):
|
|
75
|
+
npm install ./open-text-editor-latest-<version>.tgz
|
|
76
|
+
```
|
|
77
|
+
|
|
78
|
+
Publishing
|
|
79
|
+
|
|
80
|
+
See [docs/PUBLISH.md](PUBLISH.md) for publish steps and notes about peer dependencies.
|
|
81
|
+
|
package/docs/editor/developer.md
CHANGED
|
@@ -1,37 +1,37 @@
|
|
|
1
|
-
**Developer Guide — Plugins & Extensibility**
|
|
2
|
-
|
|
3
|
-
This document explains the intended plugin contract and where built-in plugin placeholders live in the source tree.
|
|
4
|
-
|
|
5
|
-
Plugin contract
|
|
6
|
-
- A plugin should export a default function that accepts an `editorApi` object and returns an object with:
|
|
7
|
-
- `name` — plugin id string
|
|
8
|
-
- `install()` — called when the plugin is enabled; register commands, toolbar buttons, or event listeners here
|
|
9
|
-
|
|
10
|
-
Example plugin skeleton
|
|
11
|
-
```js
|
|
12
|
-
export default function myPlugin(editorApi) {
|
|
13
|
-
return {
|
|
14
|
-
name: 'my-plugin',
|
|
15
|
-
install() {
|
|
16
|
-
// Example: add a simple command that inserts a timestamp
|
|
17
|
-
const insertTimestamp = () => editorApi.insertHtml(`<time>${new Date().toISOString()}</time>`)
|
|
18
|
-
// Optionally expose commands or UI wiring via editorApi
|
|
19
|
-
editorApi.registerCommand && editorApi.registerCommand('insert-timestamp', insertTimestamp)
|
|
20
|
-
}
|
|
21
|
-
}
|
|
22
|
-
}
|
|
23
|
-
```
|
|
24
|
-
|
|
25
|
-
Built-in plugins
|
|
26
|
-
- Built-in plugin placeholders are in the source at `src/editor/plugins/` (part of this repo). Consumers installing the package get the compiled library; to inspect or extend built-ins, open the repository and edit or copy the plugin files from that folder.
|
|
27
|
-
|
|
28
|
-
Registering plugins (current status)
|
|
29
|
-
- This release provides plugin scaffolding in source. Runtime plugin registration APIs (for consumer-supplied plugins) are planned; for now you can compose plugins in your app by importing their code or by modifying the source plugin folder when building from source.
|
|
30
|
-
|
|
31
|
-
Best practices
|
|
32
|
-
- Keep plugins small and focused.
|
|
33
|
-
- Prefer declarative UI for toolbar buttons (icon, tooltip, command).
|
|
34
|
-
- Clean up event listeners and DOM mutations during uninstall.
|
|
35
|
-
|
|
36
|
-
If you want, I can implement a runtime `editorApi.registerPlugin()` and `editorApi.addToolbarButton()` API in `src/editor/OpentextEditor.jsx` so consumers can register plugins dynamically. Say the word and I will wire it up and add examples.
|
|
37
|
-
|
|
1
|
+
**Developer Guide — Plugins & Extensibility**
|
|
2
|
+
|
|
3
|
+
This document explains the intended plugin contract and where built-in plugin placeholders live in the source tree.
|
|
4
|
+
|
|
5
|
+
Plugin contract
|
|
6
|
+
- A plugin should export a default function that accepts an `editorApi` object and returns an object with:
|
|
7
|
+
- `name` — plugin id string
|
|
8
|
+
- `install()` — called when the plugin is enabled; register commands, toolbar buttons, or event listeners here
|
|
9
|
+
|
|
10
|
+
Example plugin skeleton
|
|
11
|
+
```js
|
|
12
|
+
export default function myPlugin(editorApi) {
|
|
13
|
+
return {
|
|
14
|
+
name: 'my-plugin',
|
|
15
|
+
install() {
|
|
16
|
+
// Example: add a simple command that inserts a timestamp
|
|
17
|
+
const insertTimestamp = () => editorApi.insertHtml(`<time>${new Date().toISOString()}</time>`)
|
|
18
|
+
// Optionally expose commands or UI wiring via editorApi
|
|
19
|
+
editorApi.registerCommand && editorApi.registerCommand('insert-timestamp', insertTimestamp)
|
|
20
|
+
}
|
|
21
|
+
}
|
|
22
|
+
}
|
|
23
|
+
```
|
|
24
|
+
|
|
25
|
+
Built-in plugins
|
|
26
|
+
- Built-in plugin placeholders are in the source at `src/editor/plugins/` (part of this repo). Consumers installing the package get the compiled library; to inspect or extend built-ins, open the repository and edit or copy the plugin files from that folder.
|
|
27
|
+
|
|
28
|
+
Registering plugins (current status)
|
|
29
|
+
- This release provides plugin scaffolding in source. Runtime plugin registration APIs (for consumer-supplied plugins) are planned; for now you can compose plugins in your app by importing their code or by modifying the source plugin folder when building from source.
|
|
30
|
+
|
|
31
|
+
Best practices
|
|
32
|
+
- Keep plugins small and focused.
|
|
33
|
+
- Prefer declarative UI for toolbar buttons (icon, tooltip, command).
|
|
34
|
+
- Clean up event listeners and DOM mutations during uninstall.
|
|
35
|
+
|
|
36
|
+
If you want, I can implement a runtime `editorApi.registerPlugin()` and `editorApi.addToolbarButton()` API in `src/editor/OpentextEditor.jsx` so consumers can register plugins dynamically. Say the word and I will wire it up and add examples.
|
|
37
|
+
|