https://github.com/echosoar/small-editor
Extremely lightweight text editor, less than 2 KB.
https://github.com/echosoar/small-editor
autosave editor text-editor
Last synced: 16 days ago
JSON representation
Extremely lightweight text editor, less than 2 KB.
- Host: GitHub
- URL: https://github.com/echosoar/small-editor
- Owner: echosoar
- Created: 2024-10-26T09:12:20.000Z (6 months ago)
- Default Branch: main
- Last Pushed: 2025-04-06T12:20:20.000Z (17 days ago)
- Last Synced: 2025-04-06T13:27:32.529Z (17 days ago)
- Topics: autosave, editor, text-editor
- Language: TypeScript
- Homepage: https://codesandbox.io/p/sandbox/small-editor-demo-q3kfw2
- Size: 14.6 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
small-editor
Extremely lightweight text editor
## Feature
* Extremely lightweight, less than [2 KB](https://bundlephobia.com/package/small-editor).
* Press `Tab` to insert 4(or more) spaces.
* Press `Shift + Tab` to remove 4 spaces.
* Press `Enter` to add a new line while keeping the cursor aligned in the same column.
* Press `Enter` to add same Markdown prefix to the new line( e.g., `*`, `1.`, `>`, `+`, `-`, `- [ ]`, `- [x]` ).
* Typing a left character like `(`, `[`, `{`, `"` will automatically insert the matching right character `)`, `]`, `}`, `"` respectively.
* Autosave functionality.
* Press "=" to automatically calculate the result of the preceding mathematical formula.
## Usage
1. Install the package
```shell
npm install small-editor --save
```
2. Import the package
```typescript
import { Editor } from 'small-editor';
```
3. Create an instance of the editor
```typescript
const editor = new Editor({
container: document.getElementById('editorContainerDiv'),
history: 'Hello, World!',
/*
history: [
{ time: 17000000000, text: 'Hello World V2' },
{ time: 16000000000, text: 'Hello World V1' },
],
*/
onAutoSave: (newHistoryList) => {
console.log(newHistoryList);
}
});
```
4. Get the value of the editor
```typescript
const textValue = editor.getValue();
```
## License
MIT