Push latest docs

docs/assets/api_@schlechtenburg_core.md.4063a713.lean.js

@@ -0,0 +1 @@
+import{_ as e,c as o,o as l,a as r}from"./app.d1307649.js";const g='{"title":"@schlechtenburg/core","description":"","frontmatter":{},"headers":[{"level":2,"title":"SbMode","slug":"sbmode"},{"level":2,"title":"IBlockData<T>","slug":"iblockdata-t"},{"level":2,"title":"IBlockDefinition<T>","slug":"iblockdefinition-t"},{"level":2,"title":"IBlockLibrary","slug":"iblocklibrary"},{"level":2,"title":"IBlockProps<T>","slug":"iblockprops-t"},{"level":2,"title":"ISbMainProps","slug":"isbmainprops"},{"level":2,"title":"ITreeNode","slug":"itreenode"},{"level":2,"title":"OnActivateNextCb","slug":"onactivatenextcb"},{"level":2,"title":"OnActivatePreviousCb","slug":"onactivatepreviouscb"},{"level":2,"title":"OnAppendBlockCb","slug":"onappendblockcb"},{"level":2,"title":"OnPrependBlockCb","slug":"onprependblockcb"},{"level":2,"title":"OnRemoveSelfCb","slug":"onremoveselfcb"},{"level":2,"title":"OnUpdateBlockCb","slug":"onupdateblockcb"},{"level":2,"title":"OnUpdateSelfCb<T>","slug":"onupdateselfcb-t"},{"level":2,"title":"SbBlock","slug":"sbblock"},{"level":3,"title":"Props","slug":"props"},{"level":2,"title":"SbBlockOrdering","slug":"sbblockordering"},{"level":3,"title":"Props","slug":"props-1"},{"level":2,"title":"SbBlockPicker","slug":"sbblockpicker"},{"level":3,"title":"Props","slug":"props-2"},{"level":2,"title":"SbBlockPlaceholder","slug":"sbblockplaceholder"},{"level":3,"title":"Props","slug":"props-3"},{"level":2,"title":"SbButton","slug":"sbbutton"},{"level":3,"title":"Props","slug":"props-4"},{"level":2,"title":"SbMain","slug":"sbmain"},{"level":2,"title":"SbSelect","slug":"sbselect"},{"level":3,"title":"Props","slug":"props-5"},{"level":2,"title":"SbToolbar","slug":"sbtoolbar"},{"level":3,"title":"Props","slug":"props-6"},{"level":2,"title":"SymActiveBlock","slug":"symactiveblock"},{"level":2,"title":"SymBlockDimensions","slug":"symblockdimensions"},{"level":2,"title":"SymBlockLibrary","slug":"symblocklibrary"},{"level":2,"title":"SymEditorDimensions","slug":"symeditordimensions"},{"level":2,"title":"SymMode","slug":"symmode"},{"level":2,"title":"blockProps","slug":"blockprops"},{"level":2,"title":"model","slug":"model"},{"level":2,"title":"generateBlockId","slug":"generateblockid"},{"level":2,"title":"useActivation","slug":"useactivation"},{"level":2,"title":"useBlockSizing","slug":"useblocksizing"},{"level":2,"title":"useDynamicBlocks","slug":"usedynamicblocks"},{"level":2,"title":"useResizeObserver","slug":"useresizeobserver"}],"relativePath":"api/@schlechtenburg/core.md"}',a={},i=r("",121),t=[i];function n(d,s,c,h,p,u){return l(),o("div",null,t)}var k=e(a,[["render",n]]);export{g as __pageData,k as default};

docs/assets/api_@schlechtenburg_heading.md.ed89ddd1.js

@@ -0,0 +1 @@
+import{_ as e,c as a,o as t,a as d}from"./app.d1307649.js";const f='{"title":"@schlechtenburg/heading","description":"","frontmatter":{},"headers":[{"level":2,"title":"IHeadingData","slug":"iheadingdata"},{"level":2,"title":"default","slug":"default"},{"level":2,"title":"name","slug":"name"},{"level":2,"title":"getDefaultData","slug":"getdefaultdata"}],"relativePath":"api/@schlechtenburg/heading.md"}',l={},n=d('<h1 id="schlechtenburg-heading" tabindex="-1">@schlechtenburg/heading <a class="header-anchor" href="#schlechtenburg-heading" aria-hidden="true">#</a></h1><h2 id="iheadingdata" tabindex="-1">IHeadingData <a class="header-anchor" href="#iheadingdata" aria-hidden="true">#</a></h2><ul><li><p><strong>Type</strong> <code>Interface</code></p></li><li><p><strong>Members</strong></p><ul><li><strong>align</strong>: <code>string</code></li><li><strong>level</strong>: <code>number</code></li><li><strong>value</strong>: <code>string</code></li></ul></li></ul><h2 id="default" tabindex="-1">default <a class="header-anchor" href="#default" aria-hidden="true">#</a></h2><ul><li><strong>Type</strong> <code>Property</code></li></ul><h2 id="name" tabindex="-1">name <a class="header-anchor" href="#name" aria-hidden="true">#</a></h2><ul><li><strong>Type</strong> <code>Variable</code></li></ul><h2 id="getdefaultdata" tabindex="-1">getDefaultData <a class="header-anchor" href="#getdefaultdata" aria-hidden="true">#</a></h2><ul><li><strong>Type</strong> <code>Function</code></li></ul>',9),r=[n];function i(o,s,c,h,g,u){return t(),a("div",null,r)}var p=e(l,[["render",i]]);export{f as __pageData,p as default};

docs/assets/api_@schlechtenburg_heading.md.ed89ddd1.lean.js

@@ -0,0 +1 @@
+import{_ as e,c as a,o as t,a as d}from"./app.d1307649.js";const f='{"title":"@schlechtenburg/heading","description":"","frontmatter":{},"headers":[{"level":2,"title":"IHeadingData","slug":"iheadingdata"},{"level":2,"title":"default","slug":"default"},{"level":2,"title":"name","slug":"name"},{"level":2,"title":"getDefaultData","slug":"getdefaultdata"}],"relativePath":"api/@schlechtenburg/heading.md"}',l={},n=d("",9),r=[n];function i(o,s,c,h,g,u){return t(),a("div",null,r)}var p=e(l,[["render",i]]);export{f as __pageData,p as default};

docs/assets/api_@schlechtenburg_image.md.8d0d9fd9.js

@@ -0,0 +1 @@
+import{_ as e,c as a,o as t,a as r}from"./app.d1307649.js";const f='{"title":"@schlechtenburg/image","description":"","frontmatter":{},"headers":[{"level":2,"title":"IImageData","slug":"iimagedata"},{"level":2,"title":"default","slug":"default"},{"level":2,"title":"name","slug":"name"},{"level":2,"title":"getDefaultData","slug":"getdefaultdata"}],"relativePath":"api/@schlechtenburg/image.md"}',l={},i=r('<h1 id="schlechtenburg-image" tabindex="-1">@schlechtenburg/image <a class="header-anchor" href="#schlechtenburg-image" aria-hidden="true">#</a></h1><h2 id="iimagedata" tabindex="-1">IImageData <a class="header-anchor" href="#iimagedata" aria-hidden="true">#</a></h2><ul><li><p><strong>Type</strong> <code>Interface</code></p></li><li><p><strong>Members</strong></p><ul><li><strong>alt</strong>: <code>string</code></li><li><strong>description</strong>: <code>IBlockData</code></li><li><strong>src</strong>: <code>string</code></li></ul></li></ul><h2 id="default" tabindex="-1">default <a class="header-anchor" href="#default" aria-hidden="true">#</a></h2><ul><li><strong>Type</strong> <code>Property</code></li></ul><h2 id="name" tabindex="-1">name <a class="header-anchor" href="#name" aria-hidden="true">#</a></h2><ul><li><strong>Type</strong> <code>Variable</code></li></ul><h2 id="getdefaultdata" tabindex="-1">getDefaultData <a class="header-anchor" href="#getdefaultdata" aria-hidden="true">#</a></h2><ul><li><strong>Type</strong> <code>Function</code></li></ul>',9),d=[i];function n(o,s,c,h,g,u){return t(),a("div",null,d)}var m=e(l,[["render",n]]);export{f as __pageData,m as default};

docs/assets/api_@schlechtenburg_image.md.8d0d9fd9.lean.js

@@ -0,0 +1 @@
+import{_ as e,c as a,o as t,a as r}from"./app.d1307649.js";const f='{"title":"@schlechtenburg/image","description":"","frontmatter":{},"headers":[{"level":2,"title":"IImageData","slug":"iimagedata"},{"level":2,"title":"default","slug":"default"},{"level":2,"title":"name","slug":"name"},{"level":2,"title":"getDefaultData","slug":"getdefaultdata"}],"relativePath":"api/@schlechtenburg/image.md"}',l={},i=r("",9),d=[i];function n(o,s,c,h,g,u){return t(),a("div",null,d)}var m=e(l,[["render",n]]);export{f as __pageData,m as default};

docs/assets/api_@schlechtenburg_layout.md.1da56817.js

@@ -0,0 +1 @@
+import{_ as e,c as a,o as t,a as l}from"./app.d1307649.js";const f='{"title":"@schlechtenburg/layout","description":"","frontmatter":{},"headers":[{"level":2,"title":"ILayoutData","slug":"ilayoutdata"},{"level":2,"title":"default","slug":"default"},{"level":2,"title":"name","slug":"name"},{"level":2,"title":"getDefaultData","slug":"getdefaultdata"}],"relativePath":"api/@schlechtenburg/layout.md"}',r={},o=l('<h1 id="schlechtenburg-layout" tabindex="-1">@schlechtenburg/layout <a class="header-anchor" href="#schlechtenburg-layout" aria-hidden="true">#</a></h1><h2 id="ilayoutdata" tabindex="-1">ILayoutData <a class="header-anchor" href="#ilayoutdata" aria-hidden="true">#</a></h2><ul><li><p><strong>Type</strong> <code>Interface</code></p></li><li><p><strong>Members</strong></p><ul><li><strong>children</strong>: <code>undefined</code></li><li><strong>orientation</strong>: <code>string</code></li></ul></li></ul><h2 id="default" tabindex="-1">default <a class="header-anchor" href="#default" aria-hidden="true">#</a></h2><ul><li><strong>Type</strong> <code>Property</code></li></ul><h2 id="name" tabindex="-1">name <a class="header-anchor" href="#name" aria-hidden="true">#</a></h2><ul><li><strong>Type</strong> <code>Variable</code></li></ul><h2 id="getdefaultdata" tabindex="-1">getDefaultData <a class="header-anchor" href="#getdefaultdata" aria-hidden="true">#</a></h2><ul><li><strong>Type</strong> <code>Function</code></li></ul>',9),d=[o];function n(i,s,c,u,h,g){return t(),a("div",null,d)}var p=e(r,[["render",n]]);export{f as __pageData,p as default};

docs/assets/api_@schlechtenburg_layout.md.1da56817.lean.js

@@ -0,0 +1 @@
+import{_ as e,c as a,o as t,a as l}from"./app.d1307649.js";const f='{"title":"@schlechtenburg/layout","description":"","frontmatter":{},"headers":[{"level":2,"title":"ILayoutData","slug":"ilayoutdata"},{"level":2,"title":"default","slug":"default"},{"level":2,"title":"name","slug":"name"},{"level":2,"title":"getDefaultData","slug":"getdefaultdata"}],"relativePath":"api/@schlechtenburg/layout.md"}',r={},o=l("",9),d=[o];function n(i,s,c,u,h,g){return t(),a("div",null,d)}var p=e(r,[["render",n]]);export{f as __pageData,p as default};

docs/assets/api_@schlechtenburg_paragraph.md.8709c1d7.js

@@ -0,0 +1 @@
+import{_ as a,c as e,o as t,a as r}from"./app.d1307649.js";const _='{"title":"@schlechtenburg/paragraph","description":"","frontmatter":{},"headers":[{"level":2,"title":"IParagraphData","slug":"iparagraphdata"},{"level":2,"title":"default","slug":"default"},{"level":2,"title":"name","slug":"name"},{"level":2,"title":"getDefaultData","slug":"getdefaultdata"}],"relativePath":"api/@schlechtenburg/paragraph.md"}',l={},d=r('<h1 id="schlechtenburg-paragraph" tabindex="-1">@schlechtenburg/paragraph <a class="header-anchor" href="#schlechtenburg-paragraph" aria-hidden="true">#</a></h1><h2 id="iparagraphdata" tabindex="-1">IParagraphData <a class="header-anchor" href="#iparagraphdata" aria-hidden="true">#</a></h2><ul><li><p><strong>Type</strong> <code>Interface</code></p></li><li><p><strong>Members</strong></p><ul><li><strong>align</strong>: <code>string</code></li><li><strong>value</strong>: <code>string</code></li></ul></li></ul><h2 id="default" tabindex="-1">default <a class="header-anchor" href="#default" aria-hidden="true">#</a></h2><ul><li><strong>Type</strong> <code>Property</code></li></ul><h2 id="name" tabindex="-1">name <a class="header-anchor" href="#name" aria-hidden="true">#</a></h2><ul><li><strong>Type</strong> <code>Variable</code></li></ul><h2 id="getdefaultdata" tabindex="-1">getDefaultData <a class="header-anchor" href="#getdefaultdata" aria-hidden="true">#</a></h2><ul><li><strong>Type</strong> <code>Function</code></li></ul>',9),n=[d];function i(h,s,o,c,g,u){return t(),e("div",null,n)}var f=a(l,[["render",i]]);export{_ as __pageData,f as default};

docs/assets/api_@schlechtenburg_paragraph.md.8709c1d7.lean.js

@@ -0,0 +1 @@
+import{_ as a,c as e,o as t,a as r}from"./app.d1307649.js";const _='{"title":"@schlechtenburg/paragraph","description":"","frontmatter":{},"headers":[{"level":2,"title":"IParagraphData","slug":"iparagraphdata"},{"level":2,"title":"default","slug":"default"},{"level":2,"title":"name","slug":"name"},{"level":2,"title":"getDefaultData","slug":"getdefaultdata"}],"relativePath":"api/@schlechtenburg/paragraph.md"}',l={},d=r("",9),n=[d];function i(h,s,o,c,g,u){return t(),e("div",null,n)}var f=a(l,[["render",i]]);export{_ as __pageData,f as default};

docs/assets/api_@schlechtenburg_standalone.md.230a9366.js

@@ -0,0 +1 @@
+import{_ as a,c as n,o as s,b as e,d as t}from"./app.d1307649.js";const m='{"title":"@schlechtenburg/standalone","description":"","frontmatter":{},"headers":[{"level":2,"title":"startSchlechtenburg","slug":"startschlechtenburg"}],"relativePath":"api/@schlechtenburg/standalone.md"}',c={},r=e("h1",{id:"schlechtenburg-standalone",tabindex:"-1"},[t("@schlechtenburg/standalone "),e("a",{class:"header-anchor",href:"#schlechtenburg-standalone","aria-hidden":"true"},"#")],-1),l=e("h2",{id:"startschlechtenburg",tabindex:"-1"},[t("startSchlechtenburg "),e("a",{class:"header-anchor",href:"#startschlechtenburg","aria-hidden":"true"},"#")],-1),h=e("ul",null,[e("li",null,[e("strong",null,"Type"),t(),e("code",null,"Function")])],-1),o=[r,l,h];function d(i,u,_,b,g,p){return s(),n("div",null,o)}var x=a(c,[["render",d]]);export{m as __pageData,x as default};

docs/assets/api_@schlechtenburg_standalone.md.230a9366.lean.js

@@ -0,0 +1 @@
+import{_ as a,c as n,o as s,b as e,d as t}from"./app.d1307649.js";const m='{"title":"@schlechtenburg/standalone","description":"","frontmatter":{},"headers":[{"level":2,"title":"startSchlechtenburg","slug":"startschlechtenburg"}],"relativePath":"api/@schlechtenburg/standalone.md"}',c={},r=e("h1",{id:"schlechtenburg-standalone",tabindex:"-1"},[t("@schlechtenburg/standalone "),e("a",{class:"header-anchor",href:"#schlechtenburg-standalone","aria-hidden":"true"},"#")],-1),l=e("h2",{id:"startschlechtenburg",tabindex:"-1"},[t("startSchlechtenburg "),e("a",{class:"header-anchor",href:"#startschlechtenburg","aria-hidden":"true"},"#")],-1),h=e("ul",null,[e("li",null,[e("strong",null,"Type"),t(),e("code",null,"Function")])],-1),o=[r,l,h];function d(i,u,_,b,g,p){return s(),n("div",null,o)}var x=a(c,[["render",d]]);export{m as __pageData,x as default};

docs/assets/chunks/edit.834ae1b2.js

@@ -0,0 +1 @@
+var b=Object.defineProperty,S=Object.defineProperties;var p=Object.getOwnPropertyDescriptors;var d=Object.getOwnPropertySymbols;var I=Object.prototype.hasOwnProperty,U=Object.prototype.propertyIsEnumerable;var o=(a,t,e)=>t in a?b(a,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):a[t]=e,r=(a,t)=>{for(var e in t||(t={}))I.call(t,e)&&o(a,e,t[e]);if(d)for(var e of d(t))U.call(t,e)&&o(a,e,t[e]);return a},u=(a,t)=>S(a,p(t));import{m as k,r as w,h as y,i as f,j as D}from"./ExampleEditor.08243b7c.js";import"./style.b4010a054.js";import{e as h,l as C,r as F,w as x,f as n,d as m,F as B}from"../app.d1307649.js";var T=h({name:"sb-image-edit",model:k,props:{onUpdate:{type:null,default:()=>{}},data:{type:null,default:w}},setup(a){const t=C({src:a.data.src,alt:a.data.alt,description:a.data.description}),e=F(null);x(()=>a.data,()=>{t.src=a.data.src,t.alt=a.data.alt,t.description=a.data.description});const i=()=>{e.value&&e.value.click()},g=()=>{if(e.value&&e.value.files&&e.value.files.length){const l=new FileReader;l.addEventListener("load",()=>{var c;const s=(c=l==null?void 0:l.result)==null?void 0:c.toString();if(!s)throw new Error("Couldn't load image src");a.onUpdate({src:s,alt:a.data.alt,description:a.data.description})}),l.readAsDataURL(e.value.files[0])}},v=l=>{a.onUpdate(u(r({},a.data),{description:l}))};return()=>n("figure",{class:"sb-image"},[n(y,null,{default:()=>[t.src?n(f,{onClick:i},{default:()=>[m("Select Image")]}):null,n("input",{type:"file",ref:e,style:"display: none;",onInput:g},null)]}),t.src?n(B,null,[n("img",{src:t.src,alt:t.alt,class:"sb-image__content"},null),n(D,{block:t.description,onUpdate:l=>v(l)},null)]):n(f,{onClick:i},{default:()=>[m("Select Image")]})])}});export{T as default};

docs/assets/chunks/edit.a47862d5.js

@@ -0,0 +1 @@
+import{m as x,q as g,u as N,h as S,o as B,p as T}from"./ExampleEditor.08243b7c.js";import"./style.b4010a053.js";import{e as D,l as I,r as K,h as U,w as p,j as M,f as l,d as s}from"../app.d1307649.js";var q=D({name:"sb-paragraph-edit",model:x,props:{blockId:{type:String,required:!0},data:{type:null,default:g},onUpdate:{type:null,default:()=>{}},onAppendBlock:{type:null,default:()=>{}},onRemoveSelf:{type:null,default:()=>{}},onActivateNext:{type:null,default:()=>{}},onActivatePrevious:{type:null,default:()=>{}}},setup(a){const e=I({value:a.data.value,align:a.data.align,focused:!1}),t=K(null),{isActive:c,activate:d}=N(a.blockId),i=()=>{t.value&&c.value&&t.value.focus()};U(()=>{i(),t.value&&(t.value.innerHTML=e.value)}),p(c,i),p(()=>a.data,()=>{e.value=a.data.value,e.align=a.data.align,t.value&&(t.value.innerHTML=e.value)});const h=n=>{e.value=n.target.innerHTML},y=M(()=>({"sb-paragraph":!0,"sb-paragraph_focused":e.focused,[`sb-paragraph_align-${e.align}`]:!0})),m=n=>{a.onUpdate({value:e.value,align:n.target.value})},b=()=>{e.focused=!0,d()},A=()=>{e.focused=!1,a.onUpdate({value:e.value,align:e.align})},k=n=>{if(n.key==="Enter"&&!n.shiftKey){const o=T();a.onAppendBlock({id:o,name:"sb-paragraph",data:g()}),d(o),n.preventDefault()}},w=n=>{var v;n.key==="Backspace"&&e.value===""&&a.onRemoveSelf();const o=window.getSelection(),u=o==null?void 0:o.focusNode,r=Array.from(((v=t==null?void 0:t.value)==null?void 0:v.childNodes)||[]),f=u?r.indexOf(u):-1;if(u===t.value||f===0||f===r.length-1)switch(n.key){case"ArrowDown":a.onActivateNext();break;case"ArrowUp":a.onActivatePrevious();break}};return()=>l("div",{class:y.value},[l(S,null,{default:()=>[l(B,{value:e.align,onChange:m},{default:()=>[l("option",null,[s("left")]),l("option",null,[s("center")]),l("option",null,[s("right")])]})]}),l("p",{class:"sb-paragraph__input",ref:t,contenteditable:!0,onInput:h,onFocus:b,onBlur:A,onKeydown:k,onKeyup:w},null)])}});export{q as default};

docs/assets/chunks/edit.ebdd490e.js

@@ -0,0 +1 @@
+var I=Object.defineProperty,T=Object.defineProperties;var U=Object.getOwnPropertyDescriptors;var p=Object.getOwnPropertySymbols;var K=Object.prototype.hasOwnProperty,_=Object.prototype.propertyIsEnumerable;var y=(a,e,t)=>e in a?I(a,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):a[e]=t,d=(a,e)=>{for(var t in e||(e={}))K.call(e,t)&&y(a,t,e[t]);if(p)for(var t of p(e))_.call(e,t)&&y(a,t,e[t]);return a},s=(a,e)=>T(a,U(e));import{m as L,n as M,u as C,h as H,o as b,p as q,q as F}from"./ExampleEditor.08243b7c.js";import"./style.b4010a052.js";import{e as P,l as R,r as V,h as j,w as m,j as O,f as l,d as o}from"../app.d1307649.js";var Q=P({name:"sb-heading-edit",model:L,props:{blockId:{type:String,required:!0},data:{type:null,default:M},onUpdate:{type:null,default:()=>{}},onAppendBlock:{type:null,default:()=>{}},onRemoveSelf:{type:null,default:()=>{}},onActivateNext:{type:null,default:()=>{}},onActivatePrevious:{type:null,default:()=>{}}},setup(a){const e=R({value:a.data.value,align:a.data.align,level:a.data.level,focused:!1}),t=V(null),{isActive:c,activate:v}=C(a.blockId),f=()=>{t.value&&c.value&&t.value.focus()};j(()=>{f(),t.value&&(t.value.innerHTML=e.value)}),m(c,f),m(()=>a.data,()=>{e.value=a.data.value,e.align=a.data.align,e.level=a.data.level,t.value&&(t.value.innerHTML=e.value)});const A=n=>{e.value=n.target.innerHTML},k=O(()=>({"sb-heading":!0,"sb-heading_focused":e.focused,[`sb-heading_align-${e.align}`]:!0,[`sb-heading_${e.level}`]:!0})),w=n=>{a.onUpdate(s(d({},e),{level:parseInt(n.target.value,10)}))},x=n=>{a.onUpdate(s(d({},e),{align:n.target.value}))},D=()=>{e.focused=!0,v()},N=()=>{e.focused=!1,a.onUpdate({value:e.value,align:e.align,level:e.level})},S=n=>{if(n.key==="Enter"&&!n.shiftKey){const u=q();a.onAppendBlock({id:u,name:"sb-paragraph",data:F()}),v(u),n.preventDefault()}},B=n=>{var h;n.key==="Backspace"&&e.value===""&&a.onRemoveSelf();const u=window.getSelection(),i=u==null?void 0:u.focusNode,r=Array.from(((h=t==null?void 0:t.value)==null?void 0:h.childNodes)||[]),g=i?r.indexOf(i):-1;if(i===t.value||g===0||g===r.length-1)switch(n.key){case"ArrowDown":a.onActivateNext();break;case"ArrowUp":a.onActivatePrevious();break}};return()=>l("div",{class:k.value},[l(H,null,{default:()=>[l(b,{value:e.level,onChange:w},{default:()=>[l("option",{value:1},[o("h1")]),l("option",{value:2},[o("h2")]),l("option",{value:3},[o("h3")]),l("option",{value:4},[o("h4")]),l("option",{value:5},[o("h5")]),l("option",{value:6},[o("h6")])]}),l(b,{value:e.align,onChange:x},{default:()=>[l("option",null,[o("left")]),l("option",null,[o("center")]),l("option",null,[o("right")])]})]}),l("p",{class:"sb-heading__input",ref:t,contenteditable:!0,onInput:A,onFocus:D,onBlur:N,onKeydown:S,onKeyup:B},null)])}});export{Q as default};

docs/assets/chunks/edit.f8d11498.js

@@ -0,0 +1 @@
+var U=Object.defineProperty;var h=Object.getOwnPropertySymbols;var g=Object.prototype.hasOwnProperty,p=Object.prototype.propertyIsEnumerable;var u=(a,l,e)=>l in a?U(a,l,{enumerable:!0,configurable:!0,writable:!0,value:e}):a[l]=e,r=(a,l)=>{for(var e in l||(l={}))g.call(l,e)&&u(a,e,l[e]);if(h)for(var e of h(l))p.call(l,e)&&u(a,e,l[e]);return a};import{m as w,g as y,u as S,h as A,i as M,j as F,k as P,l as C}from"./ExampleEditor.08243b7c.js";import"./style.b4010a05.js";import{e as D,l as I,w as O,j,f as o,F as N,q as R}from"../app.d1307649.js";var _=D({name:"sb-layout-edit",model:w,props:{onUpdate:{type:null,default:()=>{}},data:{type:null,default:y}},setup(a){const{activate:l}=S(),e=I({orientation:a.data.orientation,children:[...a.data.children]});O(()=>a.data,()=>{e.orientation=a.data.orientation,e.children=[...a.data.children]});const m=j(()=>({"sb-layout":!0,[`sb-layout_${e.orientation}`]:!0})),v=()=>{a.onUpdate({orientation:e.orientation==="vertical"?"horizontal":"vertical"})},f=(t,n)=>{const c=e.children.indexOf(t);c!==-1&&a.onUpdate({children:[...e.children.slice(0,c),r(r({},t),n),...e.children.slice(c+1)]})},k=t=>{e.children=[...e.children,t],a.onUpdate({children:[...e.children]}),l(t.id)},i=(t,n)=>{e.children=[...e.children.slice(0,t+1),n,...e.children.slice(t+1)],a.onUpdate({children:[...e.children]}),l(n.id)},d=t=>{e.children=[...e.children.slice(0,t),...e.children.slice(t+1)],a.onUpdate({children:[...e.children]});const n=Math.max(t-1,0);l(e.children[n].id)},s=t=>{const n=Math.max(Math.min(e.children.length-1,t),0);l(e.children[n].id)},B=t=>{if(t===0)return;const n=e.children[t],c=e.children[t-1];e.children=[...e.children.slice(0,t-1),n,c,...e.children.slice(t+1)],a.onUpdate({children:[...e.children]})},b=t=>{if(t===e.children.length-1)return;const n=e.children[t],c=e.children[t+1];e.children=[...e.children.slice(0,t),c,n,...e.children.slice(t+2)],a.onUpdate({children:[...e.children]})};return()=>o("div",{class:m.value},[o(A,null,{default:()=>[o(M,{type:"button",onClick:v},{default:()=>[e.orientation]})]}),o(N,null,[...e.children.map((t,n)=>o(F,R({key:t.id},{"data-order":n,block:t,onUpdate:c=>f(t,c),onRemoveSelf:()=>d(n),onPrependBlock:c=>i(n-1,c),onAppendBlock:c=>i(n,c),onActivatePrevious:()=>s(n-1),onActivateNext:()=>s(n+1)}),{"context-toolbar":()=>o(P,{onMoveBackward:()=>B(n),onMoveForward:()=>b(n),onRemove:()=>d(n),orientation:e.orientation},null)}))]),o(C,{onInsertBlock:k},null)])}});export{_ as default};

docs/assets/chunks/view.0dc125f4.js

@@ -0,0 +1 @@
+var i=Object.defineProperty,p=Object.defineProperties;var d=Object.getOwnPropertyDescriptors;var a=Object.getOwnPropertySymbols;var r=Object.prototype.hasOwnProperty,m=Object.prototype.propertyIsEnumerable;var o=(t,e,n)=>e in t?i(t,e,{enumerable:!0,configurable:!0,writable:!0,value:n}):t[e]=n,s=(t,e)=>{for(var n in e||(e={}))r.call(e,n)&&o(t,n,e[n]);if(a)for(var n of a(e))m.call(e,n)&&o(t,n,e[n]);return t},l=(t,e)=>p(t,d(e));import{m as c,s as u}from"./ExampleEditor.08243b7c.js";import{e as f,f as v,d as b}from"../app.d1307649.js";var F=f({name:"sb-missing-block",model:c,props:l(s({},u),{name:String,data:{type:null,default:null},eventUpdate:{type:Function,default:()=>{}},eventAppendBlock:{type:Function,default:()=>{}},eventRemoveBlock:{type:Function,default:()=>{}}}),setup(t){return()=>v("div",{class:"sb-missing-block"},[b("Missing block: "),t.name])}});export{F as default};

docs/assets/chunks/view.28a7114a.js

@@ -0,0 +1 @@
+import{m as t,n as s}from"./ExampleEditor.08243b7c.js";import"./style.b4010a052.js";import{e as d,j as l,z as n}from"../app.d1307649.js";var m=d({name:"sb-heading-display",model:t,props:{data:{type:Object,default:s}},setup(a){const e=l(()=>({"sb-heading":!0,[`sb-heading_align-${a.data.align}`]:!0,[`sb-heading_${a.data.level}`]:!0}));return()=>n(`h${a.data.level}`,{class:e.value,innerHTML:a.data.value})}});export{m as default};

docs/assets/chunks/view.403d8802.js

@@ -0,0 +1 @@
+import{m as t,r as l,j as s}from"./ExampleEditor.08243b7c.js";import"./style.b4010a054.js";import{e as r,f as e}from"../app.d1307649.js";var d=r({name:"sb-image-display",model:t,props:{data:{type:null,default:l}},setup(a){return()=>e("figure",{class:"sb-image"},[e("img",{class:"sb-image__content",src:a.data.src,alt:a.data.alt},null),e(s,{block:a.data.description},null)])}});export{d as default};

docs/assets/chunks/view.52355471.js

@@ -0,0 +1 @@
+import{m as s,g as l,j as r}from"./ExampleEditor.08243b7c.js";import"./style.b4010a05.js";import{e as u,j as d,f as t}from"../app.d1307649.js";var p=u({name:"sb-layout-display",model:s,props:{data:{type:null,default:l}},setup(a){const o=d(()=>({"sb-layout":!0,[`sb-layout_${a.data.orientation}`]:!0}));return()=>t("div",{class:o.value},[...a.data.children.map(e=>t(r,{key:e.id,block:e},null))])}});export{p as default};

docs/assets/chunks/view.5d50156a.js

@@ -0,0 +1 @@
+import{m as t,q as r}from"./ExampleEditor.08243b7c.js";import"./style.b4010a053.js";import{e as s,j as p,f as l,q as o}from"../app.d1307649.js";var d=s({name:"sb-paragraph-display",model:t,props:{data:{type:Object,default:r}},setup(a){const e=p(()=>({"sb-paragraph":!0,[`sb-paragraph_align-${a.data.align}`]:!0}));return()=>l("p",o({class:e.value},{innerHTML:a.data.value}),null)}});export{d as default};

docs/assets/guide_examples.md.f568382d.js

@@ -0,0 +1 @@
+var _=Object.defineProperty;var u=Object.getOwnPropertySymbols;var f=Object.prototype.hasOwnProperty,S=Object.prototype.propertyIsEnumerable;var p=(a,e,t)=>e in a?_(a,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):a[e]=t,l=(a,e)=>{for(var t in e||(e={}))f.call(e,t)&&p(a,t,e[t]);if(u)for(var t of u(e))S.call(e,t)&&p(a,t,e[t]);return a};import{S as d,a as x,b as k,c as y,d as E,e as B,f as w,E as M}from"./chunks/ExampleEditor.08243b7c.js";import{r as h,e as b,f as r,d as s,g as V,h as A,c as W,u as m,b as n,o as j}from"./app.d1307649.js";function C(){const a=h(null),e=h(d.View);return{SchlechtenburgWrapper:b({name:"SchlechtenburgWrapper",props:{availableBlocks:{type:Array,default:()=>[]},block:{type:Object,required:!0},onUpdate:{type:null,default:()=>{}},mode:{type:String,validator(o){return Object.values(d).includes(o)},default:d.Edit}},setup(o){return a.value=l({},o.block),e.value=o.mode,a.value?()=>r(x,{block:a.value,availableBlocks:o.availableBlocks,mode:e.value,onUpdate:c=>{a.value=l({},c)}},null):()=>r("div",{class:"sb-message sb-message_error"},[s("An Error occurred")])}}),getBlock(){return a.value},setBlock(o){a.value=l({},o)},getMode(){return e.value},setMode(o){e.value=o}}}const N=async(a,e)=>{const{SchlechtenburgWrapper:t,getBlock:o,setBlock:c,getMode:v,setMode:g}=C(),i=V(t,l({},e));return i.mount(a),{app:i,getBlock:o,setBlock:c,getMode:v,setMode:g}};var O=b({name:"ExampleStandaloneEditor",setup(){const a=w;return A(async()=>{await N("#example-editor",{block:a,mode:d.Edit,availableBlocks:[k,y,E,B],onUpdate:e=>{console.log("got update",e)}})}),()=>r("div",{id:"example-editor"},null)}});const U=n("h1",{id:"examples",tabindex:"-1"},[s("Examples "),n("a",{class:"header-anchor",href:"#examples","aria-hidden":"true"},"#")],-1),D=n("h2",{id:"as-a-view-component",tabindex:"-1"},[s("As a View Component "),n("a",{class:"header-anchor",href:"#as-a-view-component","aria-hidden":"true"},"#")],-1),P=n("p",null,"This documentation website already uses Vue under the hood, so Schlechtenburg can just imported as any other component:",-1),T=n("h2",{id:"standalone",tabindex:"-1"},[s("Standalone "),n("a",{class:"header-anchor",href:"#standalone","aria-hidden":"true"},"#")],-1),q=n("p",null,[n("code",null,"@schlechtenburg/standalone"),s(" gives you a wrapped version of the editor in case you don't have Vue already installed in your application")],-1),F='{"title":"Examples","description":"","frontmatter":{},"headers":[{"level":2,"title":"As a View Component","slug":"as-a-view-component"},{"level":2,"title":"Standalone","slug":"standalone"}],"relativePath":"guide/examples.md"}',H={},G=Object.assign(H,{setup(a){return(e,t)=>(j(),W("div",null,[U,D,P,r(m(M)),T,q,r(m(O))]))}});export{F as __pageData,G as default};

docs/assets/guide_examples.md.f568382d.lean.js

@@ -0,0 +1 @@
+var _=Object.defineProperty;var u=Object.getOwnPropertySymbols;var f=Object.prototype.hasOwnProperty,S=Object.prototype.propertyIsEnumerable;var p=(a,e,t)=>e in a?_(a,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):a[e]=t,l=(a,e)=>{for(var t in e||(e={}))f.call(e,t)&&p(a,t,e[t]);if(u)for(var t of u(e))S.call(e,t)&&p(a,t,e[t]);return a};import{S as d,a as x,b as k,c as y,d as E,e as B,f as w,E as M}from"./chunks/ExampleEditor.08243b7c.js";import{r as h,e as b,f as r,d as s,g as V,h as A,c as W,u as m,b as n,o as j}from"./app.d1307649.js";function C(){const a=h(null),e=h(d.View);return{SchlechtenburgWrapper:b({name:"SchlechtenburgWrapper",props:{availableBlocks:{type:Array,default:()=>[]},block:{type:Object,required:!0},onUpdate:{type:null,default:()=>{}},mode:{type:String,validator(o){return Object.values(d).includes(o)},default:d.Edit}},setup(o){return a.value=l({},o.block),e.value=o.mode,a.value?()=>r(x,{block:a.value,availableBlocks:o.availableBlocks,mode:e.value,onUpdate:c=>{a.value=l({},c)}},null):()=>r("div",{class:"sb-message sb-message_error"},[s("An Error occurred")])}}),getBlock(){return a.value},setBlock(o){a.value=l({},o)},getMode(){return e.value},setMode(o){e.value=o}}}const N=async(a,e)=>{const{SchlechtenburgWrapper:t,getBlock:o,setBlock:c,getMode:v,setMode:g}=C(),i=V(t,l({},e));return i.mount(a),{app:i,getBlock:o,setBlock:c,getMode:v,setMode:g}};var O=b({name:"ExampleStandaloneEditor",setup(){const a=w;return A(async()=>{await N("#example-editor",{block:a,mode:d.Edit,availableBlocks:[k,y,E,B],onUpdate:e=>{console.log("got update",e)}})}),()=>r("div",{id:"example-editor"},null)}});const U=n("h1",{id:"examples",tabindex:"-1"},[s("Examples "),n("a",{class:"header-anchor",href:"#examples","aria-hidden":"true"},"#")],-1),D=n("h2",{id:"as-a-view-component",tabindex:"-1"},[s("As a View Component "),n("a",{class:"header-anchor",href:"#as-a-view-component","aria-hidden":"true"},"#")],-1),P=n("p",null,"This documentation website already uses Vue under the hood, so Schlechtenburg can just imported as any other component:",-1),T=n("h2",{id:"standalone",tabindex:"-1"},[s("Standalone "),n("a",{class:"header-anchor",href:"#standalone","aria-hidden":"true"},"#")],-1),q=n("p",null,[n("code",null,"@schlechtenburg/standalone"),s(" gives you a wrapped version of the editor in case you don't have Vue already installed in your application")],-1),F='{"title":"Examples","description":"","frontmatter":{},"headers":[{"level":2,"title":"As a View Component","slug":"as-a-view-component"},{"level":2,"title":"Standalone","slug":"standalone"}],"relativePath":"guide/examples.md"}',H={},G=Object.assign(H,{setup(a){return(e,t)=>(j(),W("div",null,[U,D,P,r(m(M)),T,q,r(m(O))]))}});export{F as __pageData,G as default};

docs/assets/guide_installation.md.491f5af1.js

@@ -0,0 +1,77 @@
+import{_ as n,c as a,o as s,a as t}from"./app.d1307649.js";const g=`{"title":"Installation","description":"","frontmatter":{},"headers":[{"level":2,"title":"You're not yet using Vue","slug":"you-re-not-yet-using-vue"},{"level":3,"title":"Install npm packages","slug":"install-npm-packages"},{"level":3,"title":"Initializing the editor","slug":"initializing-the-editor"},{"level":2,"title":"You're already using Vue","slug":"you-re-already-using-vue"},{"level":3,"title":"Install npm packages","slug":"install-npm-packages-1"},{"level":3,"title":"Using the editor component","slug":"using-the-editor-component"}],"relativePath":"guide/installation.md"}`,e={},o=t(`<h1 id="installation" tabindex="-1">Installation <a class="header-anchor" href="#installation" aria-hidden="true">#</a></h1><p>Schlechtenburg is very modular; consisting of one core package and multiple blocks. All packages are versioned together, meaning that v2.0.3 of one package is guaranteed to work with v2.0.3 of another schlechtenburg package.</p><p>Schlechtenburg is basically one Vue component, so if you&#39;re already using Vue you can import and use it directly. Otherwise, there&#39;s the standalone version that comes prepackaged with Vue.</p><h2 id="you-re-not-yet-using-vue" tabindex="-1">You&#39;re not yet using Vue <a class="header-anchor" href="#you-re-not-yet-using-vue" aria-hidden="true">#</a></h2><h3 id="install-npm-packages" tabindex="-1">Install npm packages <a class="header-anchor" href="#install-npm-packages" aria-hidden="true">#</a></h3><p>Install the standalone editor and any blocks you want to use:</p><div class="language-ts"><pre><code>npm i <span class="token operator">--</span>save <span class="token decorator"><span class="token at operator">@</span><span class="token function">schlechtenburg</span></span><span class="token operator">/</span>standalone \\
+  <span class="token decorator"><span class="token at operator">@</span><span class="token function">schlechtenburg</span></span><span class="token operator">/</span>layout \\
+  <span class="token decorator"><span class="token at operator">@</span><span class="token function">schlechtenburg</span></span><span class="token operator">/</span>heading \\
+  <span class="token decorator"><span class="token at operator">@</span><span class="token function">schlechtenburg</span></span><span class="token operator">/</span>paragraph
+</code></pre></div><h3 id="initializing-the-editor" tabindex="-1">Initializing the editor <a class="header-anchor" href="#initializing-the-editor" aria-hidden="true">#</a></h3><div class="language-ts"><pre><code><span class="token comment">// Import the initialization function</span>
+<span class="token keyword">import</span> <span class="token punctuation">{</span> startSchlechtenburg <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;@schlechtenburg/standalone&#39;</span><span class="token punctuation">;</span>
+<span class="token keyword">import</span> <span class="token punctuation">{</span> SbMode <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;@schlechtenburg/core&#39;</span><span class="token punctuation">;</span>
+
+<span class="token comment">// The following are some Schlechtenburg blocks that</span>
+<span class="token comment">// will be available when editing or viewing</span>
+<span class="token keyword">import</span> <span class="token punctuation">{</span>
+  SbLayout<span class="token punctuation">,</span>
+  getDefaultData <span class="token keyword">as</span> getEmptyLayoutBlock<span class="token punctuation">,</span>
+<span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;@schlechtenburg/layout&#39;</span><span class="token punctuation">;</span>
+<span class="token keyword">import</span> <span class="token punctuation">{</span> SbHeading <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;@schlechtenburg/heading&#39;</span><span class="token punctuation">;</span>
+<span class="token keyword">import</span> <span class="token punctuation">{</span> SbParagraph <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;@schlechtenburg/paragraph&#39;</span><span class="token punctuation">;</span>
+<span class="token keyword">import</span> <span class="token punctuation">{</span> SbImage <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;@schlechtenburg/image&#39;</span><span class="token punctuation">;</span>
+
+<span class="token comment">// This will be our input state</span>
+<span class="token keyword">const</span> emptyLayout <span class="token operator">=</span> <span class="token function">getEmptyLayoutBlock</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+
+<span class="token comment">// This call initializes the Schlechtenburg editor and viewer.</span>
+<span class="token function">useSchlechtenburg</span><span class="token punctuation">(</span>
+  <span class="token comment">// Selector of the element the editor should bind to.</span>
+  <span class="token comment">// Can also the an \`HTMLElement\` reference.</span>
+  <span class="token string">&#39;#editor&#39;</span><span class="token punctuation">,</span> 
+  <span class="token punctuation">{</span>
+    <span class="token comment">// The input block data</span>
+    block<span class="token operator">:</span> emptyLayout<span class="token punctuation">,</span>
+
+    <span class="token comment">// Whether Schlechtenburg is in what-you-see (editing)</span>
+    <span class="token comment">// or in what-you-get (viewing)</span>
+    mode<span class="token operator">:</span> SbMode<span class="token punctuation">.</span>Edit<span class="token punctuation">,</span>
+
+    <span class="token comment">// The list of available blocks in this editor instance</span>
+    availableBlocks<span class="token operator">:</span> <span class="token punctuation">[</span>
+      SbLayout<span class="token punctuation">,</span>
+      SbHeading<span class="token punctuation">,</span>
+      SbParagraph<span class="token punctuation">,</span>
+      SbImage<span class="token punctuation">,</span>
+    <span class="token punctuation">]</span><span class="token punctuation">,</span>
+
+    <span class="token comment">// This callback will be alled any time the block data gets updated</span>
+    <span class="token function-variable function">onUpdate</span><span class="token operator">:</span> <span class="token punctuation">(</span>blockData<span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token punctuation">{</span>
+      <span class="token builtin">console</span><span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span><span class="token string">&#39;Got new block data&#39;</span><span class="token punctuation">,</span> blockData<span class="token punctuation">)</span><span class="token punctuation">;</span>
+
+    <span class="token punctuation">}</span>
+  <span class="token punctuation">}</span><span class="token punctuation">,</span> <span class="token comment">// </span>
+<span class="token punctuation">)</span>
+
+</code></pre></div><p><strong>Note:</strong> You need to provide both a root node</p><h2 id="you-re-already-using-vue" tabindex="-1">You&#39;re already using Vue <a class="header-anchor" href="#you-re-already-using-vue" aria-hidden="true">#</a></h2><h3 id="install-npm-packages-1" tabindex="-1">Install npm packages <a class="header-anchor" href="#install-npm-packages-1" aria-hidden="true">#</a></h3><p>Install the editor core and any blocks you want to use:</p><div class="language-"><pre><code>npm i --save @schlechtenburg/core \\
+  @schlechtenburg/layout \\
+  @schlechtenburg/heading \\
+  @schlechtenburg/paragraph
+</code></pre></div><h3 id="using-the-editor-component" tabindex="-1">Using the editor component <a class="header-anchor" href="#using-the-editor-component" aria-hidden="true">#</a></h3><p>The following example uses TSX, but <code>SbMain</code> is just a Vue component here and can be imported and used just like any other vue component.</p><p>You need to provide a root</p><div class="language-tsx"><pre><code><span class="token comment">// This is the main Schlechtenburg component</span>
+<span class="token keyword">import</span> <span class="token punctuation">{</span> SbMain <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;@schlechtenburg/core&#39;</span><span class="token punctuation">;</span>
+
+<span class="token comment">// The following are some Schlechtenburg blocks that will be available when editing or viewing</span>
+<span class="token keyword">import</span> <span class="token punctuation">{</span> SbLayout <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;@schlechtenburg/layout&#39;</span><span class="token punctuation">;</span>
+<span class="token keyword">import</span> <span class="token punctuation">{</span> SbHeading <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;@schlechtenburg/heading&#39;</span><span class="token punctuation">;</span>
+<span class="token keyword">import</span> <span class="token punctuation">{</span> SbParagraph <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;@schlechtenburg/paragraph&#39;</span><span class="token punctuation">;</span>
+<span class="token keyword">import</span> <span class="token punctuation">{</span> SbImage <span class="token punctuation">}</span> <span class="token keyword">from</span> <span class="token string">&#39;@schlechtenburg/image&#39;</span><span class="token punctuation">;</span>
+
+<span class="token comment">// In your component</span>
+<span class="token function">setup</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
+  <span class="token comment">// ..</span>
+
+  <span class="token keyword">return</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=&gt;</span> <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span><span class="token class-name">SbMain</span></span>
+    <span class="token attr-name">availableBlocks</span><span class="token script language-javascript"><span class="token script-punctuation punctuation">=</span><span class="token punctuation">{</span><span class="token punctuation">[</span>
+      SbLayout<span class="token punctuation">,</span>
+      SbHeading<span class="token punctuation">,</span>
+      SbParagraph<span class="token punctuation">,</span>
+      SbImage<span class="token punctuation">,</span>
+    <span class="token punctuation">]</span><span class="token punctuation">}</span></span>
+  <span class="token punctuation">/&gt;</span></span><span class="token punctuation">;</span>
+<span class="token punctuation">}</span>
+</code></pre></div>`,18),p=[o];function c(l,i,u,r,k,h){return s(),a("div",null,p)}var m=n(e,[["render",c]]);export{g as __pageData,m as default};

docs/assets/guide_installation.md.491f5af1.lean.js

@@ -0,0 +1 @@
+import{_ as n,c as a,o as s,a as t}from"./app.d1307649.js";const g=`{"title":"Installation","description":"","frontmatter":{},"headers":[{"level":2,"title":"You're not yet using Vue","slug":"you-re-not-yet-using-vue"},{"level":3,"title":"Install npm packages","slug":"install-npm-packages"},{"level":3,"title":"Initializing the editor","slug":"initializing-the-editor"},{"level":2,"title":"You're already using Vue","slug":"you-re-already-using-vue"},{"level":3,"title":"Install npm packages","slug":"install-npm-packages-1"},{"level":3,"title":"Using the editor component","slug":"using-the-editor-component"}],"relativePath":"guide/installation.md"}`,e={},o=t("",18),p=[o];function c(l,i,u,r,k,h){return s(),a("div",null,p)}var m=n(e,[["render",c]]);export{g as __pageData,m as default};

docs/assets/guide_why.md.1cac0594.js

@@ -0,0 +1,9 @@
+import{_ as e,c as t,o as a,a as i}from"./app.d1307649.js";const p='{"title":"Why Schlechtenburg?","description":"","frontmatter":{},"headers":[{"level":2,"title":"Block based","slug":"block-based"},{"level":2,"title":"Design system with standardized components","slug":"design-system-with-standardized-components"},{"level":2,"title":"Accessible","slug":"accessible"},{"level":2,"title":"JSON only","slug":"json-only"},{"level":2,"title":"So why not Gutenberg?","slug":"so-why-not-gutenberg"}],"relativePath":"guide/why.md"}',n={},o=i(`<h1 id="why-schlechtenburg" tabindex="-1">Why Schlechtenburg? <a class="header-anchor" href="#why-schlechtenburg" aria-hidden="true">#</a></h1><p>Installing a WYSIWYG editor in your application or on your website is often the easy part. The hard part comes afterwards: extending and customizing the editor to fit your specific needs. There are currently a couple of very good editors, but after reading this text I think you&#39;ll agree there&#39;s still room for improvement. We&#39;ll be looking at the following alternative WYSIWYG editors:</p><ul><li><a href="https://quilljs.com/" target="_blank" rel="noopener noreferrer">Quill</a></li><li><a href="https://ckeditor.com/ckeditor-5/" target="_blank" rel="noopener noreferrer">CKEditor</a></li><li><a href="https://wordpress.org/gutenberg/" target="_blank" rel="noopener noreferrer">Gutenberg</a></li></ul><h2 id="block-based" tabindex="-1">Block based <a class="header-anchor" href="#block-based" aria-hidden="true">#</a></h2><p>Though all three are meant for text editing, Quill and CKEditor are a bit more explicit about this in their architecture:</p><ul><li>They input and output a string</li><li>They have one global toolbar</li></ul><p>Gutenberg is a bit more involved, literally using building &quot;blocks&quot; to create it&#39;s editor. Instead of seeing the content as a long string it takes a more component-esque approach. For example, the following things are all their own blocks in the gutenberg editor, which a specific react component that handles the editing mode, and one that handles the display mode.</p><ul><li>Paragraph</li><li>Heading</li><li>List</li><li>Image</li><li>Column-based layout</li><li>External media embeds like YouTube videos</li></ul><p>When editing, you are editing, adding or removing one specific block at a time. Blocks can contain other blocks in a tree structure, and they all have their own (but uniform) editing UI.</p><p>Schlechtenburg takes a block based approach, just like its namesake Gutenberg. This has a couple of advantages:</p><ul><li>You can take strong control over the final rendered HTML of a block that you create</li><li>Blocks are easily published as reusable JS modules</li><li>You very rarely need blocks inside text, but the reverse has abundant usecases</li><li>The mental model is closer to how actual HTML works</li><li>Very complex pages can be handled by the editor</li><li>If you know React or Vue, you understand a lot about how to write blocks for the editor</li></ul><h2 id="design-system-with-standardized-components" tabindex="-1">Design system with standardized components <a class="header-anchor" href="#design-system-with-standardized-components" aria-hidden="true">#</a></h2><p>Making sure the final rendered data looks correct is always easier than making sure the editing experience is great. Schlechtenburg aims to offer a vast library of reusable components, patterns, variables, and rules for the editing UI. We call this <strong>SBUI</strong>. Complex blocks require complex editing forms and UIs so most of the work goes into creating this UI. A good Design System should help ease the pain.</p><h2 id="accessible" tabindex="-1">Accessible <a class="header-anchor" href="#accessible" aria-hidden="true">#</a></h2><p>Toolbars and editing elements are in the correct tab order, <strong>SBUI</strong> elements are all fully accessible.</p><h2 id="json-only" tabindex="-1">JSON only <a class="header-anchor" href="#json-only" aria-hidden="true">#</a></h2><p>Input and Output is one standardized, typed, JSON-stringifyable object. For example, a paragraph looks like this:</p><div class="language-"><pre><code>{
+  id: &#39;1590592116800&#39;,
+  name: &#39;sb-paragraph&#39;,
+  data: {
+    value: &#39;This is the second paragraph&lt;br&gt;&#39;,
+    align: &#39;left&#39;
+  }
+},
+</code></pre></div><p>The main advantage here is that it enables you to write your own tooling around the format, since you don&#39;t have to deal with HTML or the DOM directly. This also enables really easy subtree rendering, by just taking that subtree of the JSON and feeding it to a Schlechtenburg instance. if instead of rendering a full page you&#39;d only want to render the images, you could find all of the <code>sb-image</code> nodes in the tree and rendering them all inside an <code>sb-layout</code> block.</p><h2 id="so-why-not-gutenberg" tabindex="-1">So why not Gutenberg? <a class="header-anchor" href="#so-why-not-gutenberg" aria-hidden="true">#</a></h2><p>Gutenberg is tied heavily into the Wordpress ecosystem, making its inclusion in other sites harder than necessary.</p>`,21),r=[o];function s(l,d,h,c,u,g){return a(),t("div",null,r)}var m=e(n,[["render",s]]);export{p as __pageData,m as default};

docs/assets/guide_why.md.1cac0594.lean.js

@@ -0,0 +1 @@
+import{_ as e,c as t,o as a,a as i}from"./app.d1307649.js";const p='{"title":"Why Schlechtenburg?","description":"","frontmatter":{},"headers":[{"level":2,"title":"Block based","slug":"block-based"},{"level":2,"title":"Design system with standardized components","slug":"design-system-with-standardized-components"},{"level":2,"title":"Accessible","slug":"accessible"},{"level":2,"title":"JSON only","slug":"json-only"},{"level":2,"title":"So why not Gutenberg?","slug":"so-why-not-gutenberg"}],"relativePath":"guide/why.md"}',n={},o=i("",21),r=[o];function s(l,d,h,c,u,g){return a(),t("div",null,r)}var m=e(n,[["render",s]]);export{p as __pageData,m as default};

docs/assets/index.md.3edeae7e.js

@@ -0,0 +1 @@
+import{c as a,b as e,u as t,y as o,f as s,d as r,o as i}from"./app.d1307649.js";import{E as n}from"./chunks/ExampleEditor.08243b7c.js";const c=e("h1",{id:"yet-another-wysiwyg-editor",tabindex:"-1"},[r("Yet another WYSIWYG editor "),e("a",{class:"header-anchor",href:"#yet-another-wysiwyg-editor","aria-hidden":"true"},"#")],-1),d=e("p",null,"Schlechtenburg is an experimental WYSIWYG editor framework made with Vue 3 and TypeScript. It takes cues from both Wordpress' Gutenberg editor and CKEditor, though it tries to become a best of both worlds; a very lightweight, easily extensible core, written with modern components and the accompanying state management.",-1),h=e("p",null,"It inputs and outputs a tree of JSON-serializable data.",-1),l=e("p",null,"This is still in the Proof-of-concept phase.",-1),_={class:"cta-row"},u=["href"],p=["href"],f=["href"],x='{"title":"Yet another WYSIWYG editor","description":"","frontmatter":{},"headers":[],"relativePath":"index.md"}',m={},W=Object.assign(m,{setup(b){return(g,w)=>(i(),a("div",null,[c,d,h,l,e("div",_,[e("a",{href:t(o)("/guide/why"),class:"button button_cta"},"Why Schlechtenburg?",8,u),e("a",{href:t(o)("guide/introduction"),class:"button"},"Get Started",8,p),e("a",{href:t(o)("api"),class:"button"},"See the API docs",8,f)]),s(t(n))]))}});export{x as __pageData,W as default};

docs/assets/index.md.3edeae7e.lean.js

@@ -0,0 +1 @@
+import{c as a,b as e,u as t,y as o,f as s,d as r,o as i}from"./app.d1307649.js";import{E as n}from"./chunks/ExampleEditor.08243b7c.js";const c=e("h1",{id:"yet-another-wysiwyg-editor",tabindex:"-1"},[r("Yet another WYSIWYG editor "),e("a",{class:"header-anchor",href:"#yet-another-wysiwyg-editor","aria-hidden":"true"},"#")],-1),d=e("p",null,"Schlechtenburg is an experimental WYSIWYG editor framework made with Vue 3 and TypeScript. It takes cues from both Wordpress' Gutenberg editor and CKEditor, though it tries to become a best of both worlds; a very lightweight, easily extensible core, written with modern components and the accompanying state management.",-1),h=e("p",null,"It inputs and outputs a tree of JSON-serializable data.",-1),l=e("p",null,"This is still in the Proof-of-concept phase.",-1),_={class:"cta-row"},u=["href"],p=["href"],f=["href"],x='{"title":"Yet another WYSIWYG editor","description":"","frontmatter":{},"headers":[],"relativePath":"index.md"}',m={},W=Object.assign(m,{setup(b){return(g,w)=>(i(),a("div",null,[c,d,h,l,e("div",_,[e("a",{href:t(o)("/guide/why"),class:"button button_cta"},"Why Schlechtenburg?",8,u),e("a",{href:t(o)("guide/introduction"),class:"button"},"Get Started",8,p),e("a",{href:t(o)("api"),class:"button"},"See the API docs",8,f)]),s(t(n))]))}});export{x as __pageData,W as default};

docs/hashmap.json

@@ -1 +1 @@
-{"guide_installation.md":"3b18651b","guide_introduction.md":"18452135","guide_why.md":"372a6093","index.md":"f2252493"}
+{"api_@schlechtenburg_core.md":"4063a713","api_@schlechtenburg_heading.md":"ed89ddd1","api_@schlechtenburg_image.md":"8d0d9fd9","api_@schlechtenburg_layout.md":"1da56817","api_@schlechtenburg_paragraph.md":"8709c1d7","api_@schlechtenburg_standalone.md":"230a9366","guide_examples.md":"f568382d","guide_installation.md":"491f5af1","guide_why.md":"1cac0594","index.md":"3edeae7e"}