@tomnez/ashbe
v0.0.11ASHBE
Another shitty block editor.
Development
npm i
npm run dev
Visit http://127.0.0.1:5173/
Unit Testing
npm run test
e2e Testing
Run app in test mode first (set to run on port 3000 in test mode), then call cypress:run
to start the actual tests.
npm run cypress:ci:start
npm run cypress:run
Use
npm install @tomnez/ashbe
In your app:
import BlockCore from '@tomnez/ashbe';
import '/node_modules/@tomnez/ashbe/dist/style.css'; // will fix this soon
// Sample data
const blockData = {
blocks: [
{
id: crypto.randomUUID(),
type: 'header',
data: {
text: 'New Note',
},
},
{
id: crypto.randomUUID(),
type: 'paragraph',
data: {
text: 'Paragraph <b>1</b> contents.',
},
},
{
id: crypto.randomUUID(),
type: 'paragraph',
data: {
text: 'Paragraph <code>2 contents</code> ooh code.',
},
},
{
id: crypto.randomUUID(),
type: 'paragraph',
data: {
text: 'Paragraph 3 contents.',
},
},
],
};
const options = {
blockData,
containerSelector: '#editor',
onSave: (/** blockData */) => {
// Save updated blockData
},
};
editor = new BlockCore(options);
editor.init();
// destroy will call `onSave` a final time and remove DOM nodes, listeners, etc:
editor.destroy();