@cairocoder/svelte-typewriter

A rich text editor for Svelte using Typewriter. WIP.

Usage no npm install needed!

<script type="module">
  import cairocoderSvelteTypewriter from 'https://cdn.skypack.dev/@cairocoder/svelte-typewriter';
</script>

README

Svelte Typewriter

A rich text editor for Svelte using Typewriter. WIP.

Installing

npm install --save @cairocoder/svelte-typewriter

import { Editor } from '@cairocoder/svelte-typewriter';

<Editor
toolbar={[
  [ 'heading' ],
  [ 'bold', 'italic', 'link', 'code' ],
  [ 'image' ]
]}
on:text-change={({ detail }) => {
  console.log(detail) // change, contents, oldContents, oldSelection, selection, source
}}
on:text-changing={({ detail }) => {
  console.log(detail) // change, contents, oldContents, oldSelection, selection, source
}}
on:selection-change={({ detail }) => {
  console.log(detail) // selection, oldSelection, source
}}
/>

screenshot

Upcoming

  • Custom Toolbar Button API
  • Tests