pocket-editor
TypeScript icon, indicating that this package has built-in type declarations

2.3.0 • Public • Published

Github - Npm - Example


This is yet another wysiwyg editor, it focuses mainly on two things:

  • Very fast load time
  • Reliable markdown output

Install

npm install pocket-editor

What you can do

interface Options {
  text?: string
  id?: string
  defer?: true | number 
}

class PocketEditor {
  constructor(selector: string, options?: Options)
  get value(): string
  set value(string): void
  oninput: ((content: string) => void) => void
}

How to use

<body>
    <div id="wrapper"></div>
</body>
import PocketEditor from "pocket-editor"
import "pocket-editor/style.css"

const editor = new PocketEditor("#wrapper")

editor.value = "## Hello world !!"

editor.oninput((content) => {
    console.log(content)
})

Keybindings

Keybind Action
Ctrl + Shift + 1 To big heading
Ctrl + Shift + 2 To medium heading
Ctrl + Shift + 3 To small heading
Ctrl + Shift + 4 To bullet list
Ctrl + Shift + 5 To todo list
Ctrl + Shift + 6 To normal line

Ctrl is Cmd key on MacOS

Developement

# Install pnpm to use these scripts
npm i -g pnpm

# First install all
pnpm i -r

pnpm dev
pnpm preview
pnpm build

Dependencies (0)

    Dev Dependencies (2)

    Package Sidebar

    Install

    npm i pocket-editor

    Weekly Downloads

    13

    Version

    2.3.0

    License

    MIT

    Unpacked Size

    45.9 kB

    Total Files

    19

    Last publish

    Collaborators

    • victr