@bloklabs/vue 1.12.0 → 1.13.0

package/dist/index.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});let e=require("vue"),t=require("@bloklabs/core"),n=require("@bloklabs/core/adapters");var r=new WeakMap;function i(e,t){r.set(e,t)}function a(e){return r.get(e)}function o(e){r.delete(e)}var s=new WeakMap;function c(e,t){s.set(e,t)}function l(e){return s.get(e)}function u(e){s.delete(e)}function d(e){"@babel/helpers - typeof";return d=typeof Symbol==`function`&&typeof Symbol.iterator==`symbol`?function(e){return typeof e}:function(e){return e&&typeof Symbol==`function`&&e.constructor===Symbol&&e!==Symbol.prototype?`symbol`:typeof e},d(e)}function f(e,t){if(d(e)!=`object`||!e)return e;var n=e[Symbol.toPrimitive];if(n!==void 0){var r=n.call(e,t||`default`);if(d(r)!=`object`)return r;throw TypeError(`@@toPrimitive must return a primitive value.`)}return(t===`string`?String:Number)(e)}function p(e){var t=f(e,`string`);return d(t)==`symbol`?t:t+``}function m(e,t,n){return(t=p(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function h(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),n.push.apply(n,r)}return n}function g(e){for(var t=1;t<arguments.length;t++){var n=arguments[t]==null?{}:arguments[t];t%2?h(Object(n),!0).forEach(function(t){m(e,t,n[t])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):h(Object(n)).forEach(function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))})}return e}var _=Symbol(`BLOK_DEFAULT_CONFIG`);function v(t){(0,e.provide)(_,t)}function y(){return(0,e.inject)(_,{})}function b(e,t){if(Object.keys(e).length===0)return t;let n=g({},e);for(let e of Object.keys(t)){let r=t[e];r!==void 0&&(n[e]=r)}return(e.tools!==void 0||t.tools!==void 0)&&(n.tools=g(g({},e.tools),t.tools)),n}var x=`__blokPortalRegistry`,S=()=>{let t=(0,e.reactive)(new Map);return{entries:t,register(n,r){t.set(n,(0,e.markRaw)(r))},unregister(e,n){var r;n!==void 0&&((r=t.get(e))==null?void 0:r.hostEl)!==n||t.delete(e)},setProps(e,n){let r=t.get(e);r!==void 0&&Object.assign(r.props,n)}}},C=new WeakMap;function w(e,t){C.set(e,t)}function T(e){return C.get(e)}function E(e){C.delete(e)}var D=e=>({onChange:e.onChange!==void 0,onSave:e.onSave!==void 0,onEnter:e.onEnter!==void 0,onSubmit:e.onSubmit!==void 0,onBeforeRender:e.onBeforeRender!==void 0,onAfterRender:e.onAfterRender!==void 0}),O=(e,t)=>{if(typeof e!=`object`||!e)return e;let n={};for(let[i,a]of Object.entries(e)){var r;let e=typeof a==`function`?a:a==null?void 0:a.class;if(!(typeof e==`function`&&e.__isBlokVueBlock===!0)){n[i]=a;continue}let o=typeof a==`function`?{class:a}:g({},a);o.config=g(g({},(r=o.config)==null?{}:r),{},{[x]:t}),n[i]=o}return n};function k(r,a){let s=(0,e.shallowRef)(null),l=(0,e.inject)(_,{}),d=()=>b(l,(0,e.toValue)(r)),f={current:null,holder:null,lastRenderedData:d().data,seededEditor:null,renderChain:Promise.resolve(),appliedHandlerPresence:{onChange:!1,onSave:!1,onEnter:!1,onSubmit:!1,onBeforeRender:!1,onAfterRender:!1}},p={onChange:(...e)=>{var t,n;(t=(n=d()).onChange)==null||t.call(n,...e)},onSave:(...e)=>{var t,n;f.lastRenderedData=e[0],(t=(n=d()).onSave)==null||t.call(n,...e)},onEnter:(...e)=>{var t,n;return(t=(n=d()).onEnter)==null?void 0:t.call(n,...e)},onSubmit:(...e)=>{var t,n;(t=(n=d()).onSubmit)==null||t.call(n,...e)},onBeforeRender:(...e)=>{var t,n,r;return(t=(n=(r=d()).onBeforeRender)==null?void 0:n.call(r,...e))==null?e[0]:t},onAfterRender:(...e)=>{var t,n;(t=(n=d()).onAfterRender)==null||t.call(n,...e)}},m=()=>{let t=g({},b((0,e.toRaw)(l),(0,e.toRaw)((0,e.toValue)(r))));return delete t.holder,t.data!==void 0&&(t.data=(0,e.toRaw)(t.data)),t},h=()=>{if(f.current!==null){u(f.current),E(f.current),o(f.current);try{f.current.destroy()}catch(e){}}f.current=null,f.holder=null,s.value=null},v=()=>{let e=document.createElement(`div`);f.holder=e;let n=m(),r=S();n.tools!==void 0&&(n.tools=O(n.tools,r));let a=D(d());n.onChange=a.onChange?p.onChange:void 0,n.onSave=a.onSave?p.onSave:void 0,n.onEnter=a.onEnter?p.onEnter:void 0,n.onSubmit=a.onSubmit?p.onSubmit:void 0,n.onBeforeRender=a.onBeforeRender?p.onBeforeRender:void 0,n.onAfterRender=a.onAfterRender?p.onAfterRender:void 0,f.appliedHandlerPresence=a;let o=new t.Blok(g(g({},n),{},{holder:e}));f.current=o,c(o,e),w(o,r),i(o,{markRendered:e=>{f.lastRenderedData=e}}),o.isReady.then(()=>{f.current===o&&(s.value=o)}).catch(()=>{f.current===o&&h()})};(0,e.watch)([s,()=>(0,n.normalizeReadOnlyConfig)(d().readOnly).enabled,()=>(0,n.normalizeReadOnlyConfig)(d().readOnly).hideControls,()=>typeof d().readOnly==`object`],([e,t,n,r])=>{e&&(r?e.readOnly.set(t,{hideControls:n}):e.readOnly.set(t))},{immediate:!0}),(0,e.watch)([s,()=>d().hideToolbar],([e,t])=>{e&&e.toolbar.setHidden(!!t)},{immediate:!0}),(0,e.watch)([s,()=>d().toolbarPosition],([e,t])=>{e&&t!==void 0&&e.toolbar.setPosition(t)},{immediate:!0}),(0,e.watch)([s,()=>d().theme],([e,t])=>{e&&t!==void 0&&e.theme.set(t)},{immediate:!0}),(0,e.watch)([s,()=>d().width],([e,t])=>{e&&t!==void 0&&e.width.set(t)},{immediate:!0}),(0,e.watch)([s,()=>d().placeholder],([e,t])=>{e&&t!==void 0&&e.placeholder.set(t)},{immediate:!0});let y={value:void 0};(0,e.watch)([s,()=>{var e;return(e=d().style)==null?void 0:e.tokens}],([e,t])=>{!e||t===void 0||(0,n.deepEqual)(t,y.value)||(y.value=g({},t),e.tokens.set(t))},{immediate:!0,deep:!0});let x={value:d().i18n};(0,e.watch)([s,()=>d().i18n],([e,t])=>{if(!e||t===void 0||(0,n.deepEqual)(t,x.value))return;x.value=g({},t);let{locale:r,messages:i,direction:a}=t;e.i18n.update(g(g(g({},r===void 0?{}:{locale:r}),i===void 0?{}:{messages:i}),a===void 0?{}:{direction:a}))},{immediate:!0,deep:!0});let C={editor:null,value:void 0};return(0,e.watch)([s,()=>d().inlineToolbar],([e,t])=>{if(!e||t===void 0||C.editor===e&&(0,n.deepEqual)(t,C.value))return;let r=Array.isArray(t)?[...t]:t;C.editor=e,C.value=r,e.tools.setInlineToolbar(r)},{immediate:!0,deep:!0}),(0,e.watch)([s,()=>d().autofocus],([e,t])=>{e&&t&&e.focus()},{immediate:!0}),(0,e.watch)([s,()=>JSON.stringify(D(d()))],([e])=>{if(!e)return;let t=D(d()),n=f.appliedHandlerPresence,r={},i={value:!1},a=(e,r)=>{t[e]!==n[e]&&(n[e]=t[e],i.value=!0,r(t[e]?p[e]:void 0))};a(`onChange`,e=>{r.onChange=e}),a(`onSave`,e=>{r.onSave=e}),a(`onEnter`,e=>{r.onEnter=e}),a(`onSubmit`,e=>{r.onSubmit=e}),a(`onBeforeRender`,e=>{r.onBeforeRender=e}),a(`onAfterRender`,e=>{r.onAfterRender=e}),i.value&&e.handlers.set(r)},{immediate:!0}),(0,e.watch)([s,()=>d().data],([t,r])=>{if(!t||r===void 0)return;if(f.seededEditor!==t){f.seededEditor=t,f.lastRenderedData=r;return}let i=f.lastRenderedData;i!==void 0&&(0,n.equalsOutputData)(r,i)||(f.lastRenderedData=r,f.renderChain=f.renderChain.catch(()=>void 0).then(()=>t.render((0,n.toRenderableData)((0,e.toRaw)(r)))))},{immediate:!0}),a!==void 0&&(0,e.watch)(()=>(0,e.toValue)(a),()=>{h(),v()}),(0,e.onMounted)(v),(0,e.onBeforeUnmount)(h),s}var A=`block changed`;function j(t,r={}){let i=(0,e.shallowRef)(0),a=()=>{let n=(0,e.toValue)(t);return n===null?null:(0,e.toRaw)(n)},o=()=>{i.value},s=(0,e.shallowRef)(n.EMPTY_API),c={editor:null,handler:null},l=()=>{c.editor!==null&&c.handler!==null&&c.editor.off(A,c.handler),c.editor=null,c.handler=null};return(0,e.watch)(()=>a(),t=>{if(l(),i.value+=1,t===null){s.value=n.EMPTY_API;return}let a=a=>{var o;let s=(o=(0,e.toValue)(r.within))==null?null:o;s!==null&&!(0,n.changeTouchesSubtree)(t,a,s)||(i.value+=1)};t.on(A,a),c.editor=t,c.handler=a,s.value=(0,n.createBlocksApiForEditor)(t,o)},{immediate:!0}),(0,e.onScopeDispose)(l),{getById:e=>s.value.getById(e),getChildren:e=>s.value.getChildren(e),insert:e=>s.value.insert(e),insertMany:e=>s.value.insertMany(e),insertTree:e=>s.value.insertTree(e),insertMarkdown:(e,t)=>s.value.insertMarkdown(e,t),exportMarkdown:()=>s.value.exportMarkdown(),move:(e,t)=>s.value.move(e,t),nest:(e,t)=>s.value.nest(e,t),unnest:e=>s.value.unnest(e),remove:e=>s.value.remove(e),update:(e,t,n)=>s.value.update(e,t,n),convert:(e,t,n,r)=>s.value.convert(e,t,n,r),transact:e=>s.value.transact(e),transactWithoutCapture:e=>s.value.transactWithoutCapture(e),getBlocksCount:()=>s.value.getBlocksCount(),getCurrentBlockIndex:()=>s.value.getCurrentBlockIndex(),getBlockByIndex:e=>s.value.getBlockByIndex(e),getBlockByElement:e=>s.value.getBlockByElement(e),getBlockData:e=>s.value.getBlockData(e),getBlockIndex:e=>s.value.getBlockIndex(e),composeBlockData:e=>s.value.composeBlockData(e),renderFromHTML:e=>s.value.renderFromHTML(e),insertOutputData:(e,t)=>s.value.insertOutputData(e,t),splitBlock:(e,t,n,r,i)=>s.value.splitBlock(e,t,n,r,i),insertInsideParent:(e,t,n)=>s.value.insertInsideParent(e,t,n),render:e=>s.value.render(e),clear:()=>s.value.clear(),isSyncingFromYjs:()=>s.value.isSyncingFromYjs()}}function M(n={}){let{within:r,settleOn:i}=n,a=(0,e.shallowRef)(!1),o=()=>{var n;let o=r===void 0||(n=(0,e.toValue)(r))==null?null:n;a.value=r!==void 0&&o===null?!1:t.Blok.readyState({within:o,settleOn:i}).ready};return(0,e.onScopeDispose)(t.Blok.subscribeReady(o)),(0,e.onMounted)(o),a}var N=(0,e.defineComponent)({name:`BlockErrorBoundary`,setup(t,{slots:n}){return(0,e.onErrorCaptured)(()=>!1),()=>{var e;return(e=n.default)==null?void 0:e.call(n)}}}),P=(0,e.defineComponent)({name:`BlockPortalHost`,props:{registry:{type:Object,required:!0}},setup(t){return()=>(0,e.h)(e.Fragment,Array.from(t.registry.entries.entries()).map(([t,n])=>(0,e.h)(e.Teleport,{key:t,to:n.hostEl},[(0,e.h)(N,null,{default:()=>(0,e.h)(n.component,n.props)})])))}}),F=Symbol(`BLOK_EDITOR_INSTANCE`),I=(0,e.shallowRef)(null);function L(){return(0,e.inject)(F,I)}var R=(0,e.defineComponent)({name:`BlokContent`,props:{editor:{type:Object,default:null}},setup(t){let n=(0,e.ref)(null);(0,e.provide)(F,(0,e.computed)(()=>t.editor===null?null:(0,e.toRaw)(t.editor)));let r=t=>{if(n.value===null||t===null)return;let r=l((0,e.toRaw)(t));r!==void 0&&n.value.appendChild(r)},i=t=>{var n;t!==null&&((n=l((0,e.toRaw)(t)))==null||n.remove())};return(0,e.onMounted)(()=>{r(t.editor)}),(0,e.watch)(()=>t.editor,(e,t)=>{i(t==null?null:t),r(e)}),(0,e.onBeforeUnmount)(()=>{i(t.editor)}),()=>{let r=t.editor,i=r===null?void 0:T((0,e.toRaw)(r));return(0,e.h)(`div`,{ref:n},i===void 0?[]:[(0,e.h)(P,{registry:i})])}}}),z=`autofocus.defaultBlock.dataModel.placeholder.sanitizer.hideToolbar.toolbarPosition.maxHistoryLength.historyDebounceTime.newGroupDelay.globalUndoRedo.tools.data.minHeight.logLevel.readOnly.i18n.link.linkPaste.inlineToolbar.tunes.style.theme.scrollToBlock.user.resolveUser.notifierPosition.notifier.width.onBeforeRender.onBeforePaste.onEnter.onSubmit.onError.migrations.uploader.captureClicksBelowEditor`.split(`.`),B=(0,e.defineComponent)({name:`BlokEditor`,inheritAttrs:!1,props:{autofocus:{type:Boolean,default:void 0},defaultBlock:{type:String,default:void 0},dataModel:{type:String,default:void 0},placeholder:{type:[String,Boolean],default:void 0},sanitizer:{type:Object,default:void 0},hideToolbar:{type:Boolean,default:void 0},toolbarPosition:{type:String,default:void 0},maxHistoryLength:{type:Number,default:void 0},historyDebounceTime:{type:Number,default:void 0},newGroupDelay:{type:Number,default:void 0},globalUndoRedo:{type:Boolean,default:void 0},tools:{type:Object,default:void 0},data:{type:Object,default:void 0},minHeight:{type:Number,default:void 0},logLevel:{type:String,default:void 0},readOnly:{type:[Boolean,Object],default:void 0},i18n:{type:Object,default:void 0},link:{type:Object,default:void 0},linkPaste:{type:Object,default:void 0},inlineToolbar:{type:[Array,Boolean],default:void 0},tunes:{type:Array,default:void 0},style:{type:Object,default:void 0},theme:{type:String,default:void 0},scrollToBlock:{type:Object,default:void 0},user:{type:Object,default:void 0},resolveUser:{type:Function,default:void 0},notifierPosition:{type:String,default:void 0},notifier:{type:Function,default:void 0},width:{type:String,default:void 0},onBeforeRender:{type:Function,default:void 0},onBeforePaste:{type:Function,default:void 0},onEnter:{type:Function,default:void 0},onSubmit:{type:Function,default:void 0},onError:{type:Function,default:void 0},migrations:{type:Object,default:void 0},uploader:{type:Object,default:void 0},captureClicksBelowEditor:{type:Boolean,default:void 0},recreateKey:{type:null}},emits:{ready:e=>!0,change:e=>!0,save:e=>!0,"update:data":e=>!0,"after-render":e=>!0,"theme-change":e=>!0,"blocks-rendered":e=>!0,"block-rendered":e=>!0},setup(t,{emit:n,expose:r,attrs:i}){let o=(0,e.getCurrentInstance)(),s=()=>{let e=o==null?void 0:o.vnode.props;return e==null?``:Object.keys(e).filter(e=>e.startsWith(`on`)).sort().join(`|`)},c=(0,e.ref)(s());(0,e.onUpdated)(()=>{c.value=s()});let l=e=>c.value.split(`|`).includes(e),u=()=>{let e={};for(let n of z){let r=t[n];r!==void 0&&(e[n]=r)}return l(`onChange`)&&(e.onChange=(e,t)=>{n(`change`,{api:e,event:t})}),(l(`onSave`)||l(`onUpdate:data`))&&(e.onSave=e=>{n(`update:data`,e),n(`save`,e)}),l(`onAfterRender`)&&(e.onAfterRender=e=>{n(`after-render`,e)}),l(`onThemeChange`)&&(e.onThemeChange=e=>{n(`theme-change`,e)}),e},d=k(()=>u(),()=>t.recreateKey);(0,e.watch)([d,c],([e],t,r)=>{if(e===null)return;let i=[];if(l(`onBlocksRendered`)){let t=e=>n(`blocks-rendered`,e);e.on(`blocks:rendered`,t),i.push([`blocks:rendered`,t])}if(l(`onBlockRendered`)){let t=e=>n(`block-rendered`,e);e.on(`block:rendered`,t),i.push([`block:rendered`,t])}r(()=>{for(let[t,n]of i)e.off(t,n)})});let f={last:null};return(0,e.watch)(d,e=>{e!==null&&e!==f.last&&(f.last=e,n(`ready`,e))}),r({instance:(0,e.computed)(()=>d.value),save:()=>{var e;return(e=d.value)==null?void 0:e.save()},focus:e=>{var t;(t=d.value)==null||t.focus(e)},render:e=>{let t=d.value;if(t!==null)return t.render(e).then(()=>{var n;(n=a(t))==null||n.markRendered(e)})}}),()=>(0,e.h)(R,g({editor:d.value},i))}}),V=[`toolbox`,`isReadOnlySupported`,`__isBlokVueBlock`],H=new Set([void 0,`user`,`api`,`convert`]),U=(e,t,r)=>{var i;e==null||(i=e.events)==null||i.emit(n.BlockChildrenMounted,{blockId:t,childIds:r.map(e=>e.id)})};function W(t){var r,i;let a=()=>(0,e.defineComponent)({name:`VueBlock(${t.type})`,props:{ctx:{type:Object,required:!0},notifyMounted:{type:Function,default:void 0}},setup(n){return(0,e.onMounted)(()=>{var e;return(e=n.notifyMounted)==null?void 0:e.call(n)}),t.setup(n.ctx)}}),o=(r=class{static get toolbox(){return t.toolbox}static get isReadOnlySupported(){return!0}constructor(r){var i,o,s;this.wrappedComponent=a(),this.mountSignalled=!1,this.hostEl=null,this.pendingDispatch=!1,this.anchorEl=null,this.toolbarAnchorRef=e=>{let t=e===null||e instanceof Element?e:e.$el;this.anchorEl=t instanceof HTMLElement?t:null},this.notifyMounted=()=>{var e;if(this.mountSignalled)return;this.mountSignalled=!0;let n={origin:this.origin,api:this.api};if((e=t.onMounted)==null||e.call(t,this.blockApi,n),H.has(this.origin)){var r;(r=t.onCreated)==null||r.call(t,this.blockApi,n)}},this.commit=e=>{let r=(0,n.fillDefaults)(t.propSchema,g(g({},this.mirror),e));(0,n.deepEqual)(r,this.mirror)||(this.mirror=r,this.lastRendered=r,this.dataRef.value=r,this.flushDispatch())},this.blockApi=r.block;let c=(i=r.config)==null?{}:i;this.registry=c[x],this.api=r.api;let l=r.api;this.pointerDrag=()=>{var e;return(l==null||(e=l.blocks)==null?void 0:e.isPointerDragActive)===!0},this.mirror=(0,n.fillDefaults)(t.propSchema,(0,e.toRaw)((o=r.data)==null?{}:o)),this.lastRendered=this.mirror,this.dataRef=(0,e.shallowRef)(this.mirror),this.readOnlyRef=(0,e.shallowRef)(r.readOnly),this.origin=(s=r.origin)==null?`api`:s;let u=this.blockApi,d=this.api;this.childrenComponent=(0,e.defineComponent)({name:`VueBlockChildren(${t.type})`,props:{childAttributes:{type:Function,default:void 0},childContentAttributes:{type:Function,default:void 0}},setup(t){let r=(0,e.ref)(null),i=(0,n.createChildDecorationLedger)(),a=()=>{if(r.value===null)return;let e=u.getChildren();(0,n.mountChildBlocks)(r.value,e),(0,n.applyChildDecoration)(i,e,{childAttributes:t.childAttributes,childContentAttributes:t.childContentAttributes}),U(d,u.id,e)};return(0,e.onMounted)(a),(0,e.onUpdated)(a),()=>(0,e.h)(`div`,{ref:r,[n.DATA_ATTR.nestedBlocks]:``})}})}render(){var e;let t=document.createElement(`div`);t.setAttribute(`data-blok-mutation-free`,`true`),this.hostEl=t;let n={data:this.dataRef,commit:this.commit,block:this.blockApi,api:this.api,readOnly:this.readOnlyRef,BlockChildren:this.childrenComponent,toolbarAnchorRef:this.toolbarAnchorRef};return(e=this.registry)==null||e.register(this.blockApi.id,{hostEl:t,component:this.wrappedComponent,props:{ctx:n,notifyMounted:this.notifyMounted}}),t}rendered(){var e;(e=t.onRendered)==null||e.call(t,this.blockApi)}save(){return this.mirror}async setData(r){var i=this;let a=(0,n.fillDefaults)(t.propSchema,(0,e.toRaw)(r==null?{}:r));return(0,n.deepEqual)(a,i.lastRendered)?!0:(i.mirror=a,i.lastRendered=a,i.dataRef.value=a,await(0,e.nextTick)(),!0)}setReadOnly(e){this.readOnlyRef.value=e}getToolbarAnchorElement(){var e;let n=this.anchorEl;if(n!==null&&n.isConnected)return n;let r=this.hostEl;if(!(r===null||t.getToolbarAnchorElement===void 0))return(e=t.getToolbarAnchorElement(r,this.blockApi))==null?void 0:e}moved(){var e;(e=t.onMoved)==null||e.call(t,this.blockApi)}removed(){var e,n,r;(e=this.registry)==null||e.unregister(this.blockApi.id,(n=this.hostEl)==null?void 0:n),(r=t.onRemoved)==null||r.call(t,this.blockApi)}destroy(){var e,t;(e=this.registry)==null||e.unregister(this.blockApi.id,(t=this.hostEl)==null?void 0:t)}flushDispatch(){if(!this.pointerDrag()){this.pendingDispatch=!1,this.blockApi.dispatchChange();return}if(this.pendingDispatch)return;this.pendingDispatch=!0;let e=()=>{if(this.pointerDrag()){requestAnimationFrame(e);return}this.pendingDispatch=!1,this.blockApi.dispatchChange()};requestAnimationFrame(e)}},r.__isBlokVueBlock=!0,r);for(let[e,n]of Object.entries((i=t.statics)==null?{}:i))V.includes(e)||Object.defineProperty(o,e,{value:n,writable:!0,enumerable:!0,configurable:!0});return o}exports.BLOK_DEFAULT_CONFIG=_,exports.BLOK_EDITOR_INSTANCE=F,exports.BlokContent=R,exports.BlokEditor=B,exports.createVueBlock=W,exports.provideBlok=v,exports.useBlocks=j,exports.useBlok=k,exports.useBlokDefaults=y,exports.useBlokInstance=L,exports.useBlokReady=M;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});let e=require("vue"),t=require("@bloklabs/core"),n=require("@bloklabs/core/adapters");var r=new WeakMap;function i(e,t){r.set(e,t)}function a(e){return r.get(e)}function o(e){r.delete(e)}var s=new WeakMap;function c(e,t){s.set(e,t)}function l(e){return s.get(e)}function u(e){s.delete(e)}function d(e){"@babel/helpers - typeof";return d=typeof Symbol==`function`&&typeof Symbol.iterator==`symbol`?function(e){return typeof e}:function(e){return e&&typeof Symbol==`function`&&e.constructor===Symbol&&e!==Symbol.prototype?`symbol`:typeof e},d(e)}function f(e,t){if(d(e)!=`object`||!e)return e;var n=e[Symbol.toPrimitive];if(n!==void 0){var r=n.call(e,t||`default`);if(d(r)!=`object`)return r;throw TypeError(`@@toPrimitive must return a primitive value.`)}return(t===`string`?String:Number)(e)}function p(e){var t=f(e,`string`);return d(t)==`symbol`?t:t+``}function m(e,t,n){return(t=p(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function h(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),n.push.apply(n,r)}return n}function g(e){for(var t=1;t<arguments.length;t++){var n=arguments[t]==null?{}:arguments[t];t%2?h(Object(n),!0).forEach(function(t){m(e,t,n[t])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):h(Object(n)).forEach(function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))})}return e}var _=Symbol(`BLOK_DEFAULT_CONFIG`);function v(t){(0,e.provide)(_,t)}function y(){return(0,e.inject)(_,{})}function b(e,t){if(Object.keys(e).length===0)return t;let n=g({},e);for(let e of Object.keys(t)){let r=t[e];r!==void 0&&(n[e]=r)}return(e.tools!==void 0||t.tools!==void 0)&&(n.tools=g(g({},e.tools),t.tools)),n}var x=`__blokPortalRegistry`,S=()=>{let t=(0,e.reactive)(new Map);return{entries:t,register(n,r){t.set(n,(0,e.markRaw)(r))},unregister(e,n){var r;(n===void 0||((r=t.get(e))==null?void 0:r.hostEl)===n)&&t.delete(e)},setProps(e,n){let r=t.get(e);r!==void 0&&Object.assign(r.props,n)}}},C=new WeakMap;function w(e,t){C.set(e,t)}function T(e){return C.get(e)}function E(e){C.delete(e)}var D=e=>({onChange:e.onChange!==void 0,onSave:e.onSave!==void 0,onEnter:e.onEnter!==void 0,onSubmit:e.onSubmit!==void 0,onBeforeRender:e.onBeforeRender!==void 0,onAfterRender:e.onAfterRender!==void 0}),O=e=>`[Blok] \`data\` is ignored while collaboration is on: the document lives on the sync service and is shared with everyone editing it, so replacing it from this editor would overwrite their work. To replace the whole document, call POST /sync/${e==null?`{doc}`:e}/reset on your server — it reloads the document from your own document endpoint and every open editor picks it up. To change part of it, use the blocks API (insert/update/delete).`,k=(e,t)=>{if(typeof e!=`object`||!e)return e;let n={};for(let[i,a]of Object.entries(e)){var r;let e=typeof a==`function`?a:a==null?void 0:a.class;if(typeof e!=`function`||e.__isBlokVueBlock!==!0){n[i]=a;continue}let o=typeof a==`function`?{class:a}:g({},a);o.config=g(g({},(r=o.config)==null?{}:r),{},{[x]:t}),n[i]=o}return n};function A(r,a){let s=(0,e.shallowRef)(null),l=(0,e.inject)(_,{}),d=()=>b(l,(0,e.toValue)(r)),f={current:null,holder:null,lastRenderedData:d().data,seededEditor:null,renderChain:Promise.resolve(),collaborationWarned:!1,constructedCollaboration:void 0,appliedHandlerPresence:{onChange:!1,onSave:!1,onEnter:!1,onSubmit:!1,onBeforeRender:!1,onAfterRender:!1}},p={onChange:(...e)=>{var t,n;(t=(n=d()).onChange)==null||t.call(n,...e)},onSave:(...e)=>{var t,n;f.lastRenderedData=e[0],(t=(n=d()).onSave)==null||t.call(n,...e)},onEnter:(...e)=>{var t,n;return(t=(n=d()).onEnter)==null?void 0:t.call(n,...e)},onSubmit:(...e)=>{var t,n;(t=(n=d()).onSubmit)==null||t.call(n,...e)},onBeforeRender:(...e)=>{var t,n,r;return(t=(n=(r=d()).onBeforeRender)==null?void 0:n.call(r,...e))==null?e[0]:t},onAfterRender:(...e)=>{var t,n;(t=(n=d()).onAfterRender)==null||t.call(n,...e)}},m=()=>{let t=g({},b((0,e.toRaw)(l),(0,e.toRaw)((0,e.toValue)(r))));return delete t.holder,t.data!==void 0&&(t.data=(0,e.toRaw)(t.data)),t},h=()=>{if(f.current!==null){u(f.current),E(f.current),o(f.current);try{f.current.destroy()}catch(e){}}f.current=null,f.holder=null,s.value=null},v=()=>{let e=document.createElement(`div`);f.holder=e;let n=m(),r=S();n.tools!==void 0&&(n.tools=k(n.tools,r));let a=D(d());n.onChange=a.onChange?p.onChange:void 0,n.onSave=a.onSave?p.onSave:void 0,n.onEnter=a.onEnter?p.onEnter:void 0,n.onSubmit=a.onSubmit?p.onSubmit:void 0,n.onBeforeRender=a.onBeforeRender?p.onBeforeRender:void 0,n.onAfterRender=a.onAfterRender?p.onAfterRender:void 0,f.appliedHandlerPresence=a;let o=new t.Blok(g(g({},n),{},{holder:e}));f.current=o,f.constructedCollaboration=n.collaboration,c(o,e),w(o,r),i(o,{markRendered:e=>{f.lastRenderedData=e}}),o.isReady.then(()=>{f.current===o&&(s.value=o)}).catch(()=>{f.current===o&&h()})};(0,e.watch)([s,()=>(0,n.normalizeReadOnlyConfig)(d().readOnly).enabled,()=>(0,n.normalizeReadOnlyConfig)(d().readOnly).hideControls,()=>typeof d().readOnly==`object`],([e,t,n,r])=>{e&&(r?e.readOnly.set(t,{hideControls:n}):e.readOnly.set(t))},{immediate:!0}),(0,e.watch)([s,()=>d().hideToolbar],([e,t])=>{e&&e.toolbar.setHidden(!!t)},{immediate:!0}),(0,e.watch)([s,()=>d().toolbarPosition],([e,t])=>{e&&t!==void 0&&e.toolbar.setPosition(t)},{immediate:!0}),(0,e.watch)([s,()=>d().theme],([e,t])=>{e&&t!==void 0&&e.theme.set(t)},{immediate:!0}),(0,e.watch)([s,()=>d().width],([e,t])=>{e&&t!==void 0&&e.width.set(t)},{immediate:!0}),(0,e.watch)([s,()=>d().placeholder],([e,t])=>{e&&t!==void 0&&e.placeholder.set(t)},{immediate:!0});let y={value:void 0};(0,e.watch)([s,()=>{var e;return(e=d().style)==null?void 0:e.tokens}],([e,t])=>{!e||t===void 0||(0,n.deepEqual)(t,y.value)||(y.value=g({},t),e.tokens.set(t))},{immediate:!0,deep:!0});let x={value:d().i18n};(0,e.watch)([s,()=>d().i18n],([e,t])=>{if(!e||t===void 0||(0,n.deepEqual)(t,x.value))return;x.value=g({},t);let{locale:r,messages:i,direction:a}=t;e.i18n.update(g(g(g({},r===void 0?{}:{locale:r}),i===void 0?{}:{messages:i}),a===void 0?{}:{direction:a}))},{immediate:!0,deep:!0});let C={editor:null,value:void 0};return(0,e.watch)([s,()=>d().inlineToolbar],([e,t])=>{if(!e||t===void 0||C.editor===e&&(0,n.deepEqual)(t,C.value))return;let r=Array.isArray(t)?[...t]:t;C.editor=e,C.value=r,e.tools.setInlineToolbar(r)},{immediate:!0,deep:!0}),(0,e.watch)([s,()=>d().autofocus],([e,t])=>{e&&t&&e.focus()},{immediate:!0}),(0,e.watch)([s,()=>JSON.stringify(D(d()))],([e])=>{if(!e)return;let t=D(d()),n=f.appliedHandlerPresence,r={},i={value:!1},a=(e,r)=>{t[e]!==n[e]&&(n[e]=t[e],i.value=!0,r(t[e]?p[e]:void 0))};a(`onChange`,e=>{r.onChange=e}),a(`onSave`,e=>{r.onSave=e}),a(`onEnter`,e=>{r.onEnter=e}),a(`onSubmit`,e=>{r.onSubmit=e}),a(`onBeforeRender`,e=>{r.onBeforeRender=e}),a(`onAfterRender`,e=>{r.onAfterRender=e}),i.value&&e.handlers.set(r)},{immediate:!0}),(0,e.watch)([s,()=>d().data],([t,r])=>{if(!t||r===void 0)return;if(f.seededEditor!==t){f.seededEditor=t,f.lastRenderedData=r;return}let i=f.lastRenderedData;if(i!==void 0&&(0,n.equalsOutputData)(r,i))return;let a=f.constructedCollaboration;if(a!==void 0){f.collaborationWarned||(f.collaborationWarned=!0,console.warn(O(a.doc)));return}f.lastRenderedData=r,f.renderChain=f.renderChain.catch(()=>void 0).then(()=>t.render((0,n.toRenderableData)((0,e.toRaw)(r))))},{immediate:!0}),a!==void 0&&(0,e.watch)(()=>(0,e.toValue)(a),()=>{h(),v()}),(0,e.onMounted)(v),(0,e.onBeforeUnmount)(h),s}var j=`block changed`;function M(t,r={}){let i=(0,e.shallowRef)(0),a=()=>{let n=(0,e.toValue)(t);return n===null?null:(0,e.toRaw)(n)},o=()=>{i.value},s=(0,e.shallowRef)(n.EMPTY_API),c={editor:null,handler:null},l=()=>{c.editor!==null&&c.handler!==null&&c.editor.off(j,c.handler),c.editor=null,c.handler=null};return(0,e.watch)(()=>a(),t=>{if(l(),i.value+=1,t===null){s.value=n.EMPTY_API;return}let a=a=>{var o;let s=(o=(0,e.toValue)(r.within))==null?null:o;s!==null&&!(0,n.changeTouchesSubtree)(t,a,s)||(i.value+=1)};t.on(j,a),c.editor=t,c.handler=a,s.value=(0,n.createBlocksApiForEditor)(t,o)},{immediate:!0}),(0,e.onScopeDispose)(l),{getById:e=>s.value.getById(e),getChildren:e=>s.value.getChildren(e),insert:e=>s.value.insert(e),insertMany:e=>s.value.insertMany(e),insertTree:e=>s.value.insertTree(e),insertMarkdown:(e,t)=>s.value.insertMarkdown(e,t),exportMarkdown:()=>s.value.exportMarkdown(),move:(e,t)=>s.value.move(e,t),nest:(e,t)=>s.value.nest(e,t),unnest:e=>s.value.unnest(e),remove:e=>s.value.remove(e),update:(e,t,n)=>s.value.update(e,t,n),convert:(e,t,n,r)=>s.value.convert(e,t,n,r),transact:e=>s.value.transact(e),transactWithoutCapture:e=>s.value.transactWithoutCapture(e),getBlocksCount:()=>s.value.getBlocksCount(),getCurrentBlockIndex:()=>s.value.getCurrentBlockIndex(),getBlockByIndex:e=>s.value.getBlockByIndex(e),getBlockByElement:e=>s.value.getBlockByElement(e),getBlockData:e=>s.value.getBlockData(e),getBlockIndex:e=>s.value.getBlockIndex(e),composeBlockData:e=>s.value.composeBlockData(e),renderFromHTML:e=>s.value.renderFromHTML(e),insertOutputData:(e,t)=>s.value.insertOutputData(e,t),splitBlock:(e,t,n,r,i)=>s.value.splitBlock(e,t,n,r,i),insertInsideParent:(e,t,n)=>s.value.insertInsideParent(e,t,n),render:e=>s.value.render(e),clear:()=>s.value.clear(),isSyncingFromYjs:()=>s.value.isSyncingFromYjs()}}function N(n={}){let{within:r,settleOn:i}=n,a=(0,e.shallowRef)(!1),o=()=>{var n;let o=r===void 0||(n=(0,e.toValue)(r))==null?null:n;a.value=r!==void 0&&o===null?!1:t.Blok.readyState({within:o,settleOn:i}).ready};return(0,e.onScopeDispose)(t.Blok.subscribeReady(o)),(0,e.onMounted)(o),a}var P=(0,e.defineComponent)({name:`BlockErrorBoundary`,setup(t,{slots:n}){return(0,e.onErrorCaptured)(()=>!1),()=>{var e;return(e=n.default)==null?void 0:e.call(n)}}}),F=(0,e.defineComponent)({name:`BlockPortalHost`,props:{registry:{type:Object,required:!0}},setup(t){return()=>(0,e.h)(e.Fragment,Array.from(t.registry.entries.entries()).map(([t,n])=>(0,e.h)(e.Teleport,{key:t,to:n.hostEl},[(0,e.h)(P,null,{default:()=>(0,e.h)(n.component,n.props)})])))}}),I=Symbol(`BLOK_EDITOR_INSTANCE`),L=(0,e.shallowRef)(null);function R(){return(0,e.inject)(I,L)}var z=(0,e.defineComponent)({name:`BlokContent`,props:{editor:{type:Object,default:null}},setup(t){let n=(0,e.ref)(null);(0,e.provide)(I,(0,e.computed)(()=>t.editor===null?null:(0,e.toRaw)(t.editor)));let r=t=>{if(n.value===null||t===null)return;let r=l((0,e.toRaw)(t));r!==void 0&&n.value.appendChild(r)},i=t=>{var n;t!==null&&((n=l((0,e.toRaw)(t)))==null||n.remove())};return(0,e.onMounted)(()=>{r(t.editor)}),(0,e.watch)(()=>t.editor,(e,t)=>{i(t==null?null:t),r(e)}),(0,e.onBeforeUnmount)(()=>{i(t.editor)}),()=>{let r=t.editor,i=r===null?void 0:T((0,e.toRaw)(r));return(0,e.h)(`div`,{ref:n},i===void 0?[]:[(0,e.h)(F,{registry:i})])}}}),B=`autofocus.defaultBlock.dataModel.placeholder.sanitizer.hideToolbar.toolbarPosition.maxHistoryLength.historyDebounceTime.newGroupDelay.globalUndoRedo.tools.data.minHeight.logLevel.readOnly.i18n.link.linkPaste.inlineToolbar.tunes.style.theme.scrollToBlock.user.resolveUser.notifierPosition.notifier.width.onBeforeRender.onBeforePaste.onEnter.onSubmit.onError.migrations.uploader.server.ticket.persistence.collaboration.captureClicksBelowEditor`.split(`.`),V=(0,e.defineComponent)({name:`BlokEditor`,inheritAttrs:!1,props:{autofocus:{type:Boolean,default:void 0},defaultBlock:{type:String,default:void 0},dataModel:{type:String,default:void 0},placeholder:{type:[String,Boolean],default:void 0},sanitizer:{type:Object,default:void 0},hideToolbar:{type:Boolean,default:void 0},toolbarPosition:{type:String,default:void 0},maxHistoryLength:{type:Number,default:void 0},historyDebounceTime:{type:Number,default:void 0},newGroupDelay:{type:Number,default:void 0},globalUndoRedo:{type:Boolean,default:void 0},tools:{type:Object,default:void 0},data:{type:Object,default:void 0},minHeight:{type:Number,default:void 0},logLevel:{type:String,default:void 0},readOnly:{type:[Boolean,Object],default:void 0},i18n:{type:Object,default:void 0},link:{type:Object,default:void 0},linkPaste:{type:Object,default:void 0},inlineToolbar:{type:[Array,Boolean],default:void 0},tunes:{type:Array,default:void 0},style:{type:Object,default:void 0},theme:{type:String,default:void 0},scrollToBlock:{type:Object,default:void 0},user:{type:Object,default:void 0},resolveUser:{type:Function,default:void 0},notifierPosition:{type:String,default:void 0},notifier:{type:Function,default:void 0},width:{type:String,default:void 0},onBeforeRender:{type:Function,default:void 0},onBeforePaste:{type:Function,default:void 0},onEnter:{type:Function,default:void 0},onSubmit:{type:Function,default:void 0},onError:{type:Function,default:void 0},migrations:{type:Object,default:void 0},uploader:{type:Object,default:void 0},server:{type:String,default:void 0},ticket:{type:String,default:void 0},persistence:{type:Object,default:void 0},collaboration:{type:Object,default:void 0},captureClicksBelowEditor:{type:Boolean,default:void 0},recreateKey:{type:null}},emits:{ready:e=>!0,change:e=>!0,save:e=>!0,"update:data":e=>!0,"after-render":e=>!0,"theme-change":e=>!0,"blocks-rendered":e=>!0,"block-rendered":e=>!0},setup(t,{emit:n,expose:r,attrs:i}){let o=(0,e.getCurrentInstance)(),s=()=>{let e=o==null?void 0:o.vnode.props;return e==null?``:Object.keys(e).filter(e=>e.startsWith(`on`)).sort().join(`|`)},c=(0,e.ref)(s());(0,e.onUpdated)(()=>{c.value=s()});let l=e=>c.value.split(`|`).includes(e),u=()=>{let e={};for(let n of B){let r=t[n];r!==void 0&&(e[n]=r)}return l(`onChange`)&&(e.onChange=(e,t)=>{n(`change`,{api:e,event:t})}),(l(`onSave`)||l(`onUpdate:data`))&&(e.onSave=e=>{n(`update:data`,e),n(`save`,e)}),l(`onAfterRender`)&&(e.onAfterRender=e=>{n(`after-render`,e)}),l(`onThemeChange`)&&(e.onThemeChange=e=>{n(`theme-change`,e)}),e},d=A(()=>u(),()=>t.recreateKey);(0,e.watch)([d,c],([e],t,r)=>{if(e===null)return;let i=[];if(l(`onBlocksRendered`)){let t=e=>n(`blocks-rendered`,e);e.on(`blocks:rendered`,t),i.push([`blocks:rendered`,t])}if(l(`onBlockRendered`)){let t=e=>n(`block-rendered`,e);e.on(`block:rendered`,t),i.push([`block:rendered`,t])}r(()=>{for(let[t,n]of i)e.off(t,n)})});let f={last:null};return(0,e.watch)(d,e=>{e!==null&&e!==f.last&&(f.last=e,n(`ready`,e))}),r({instance:(0,e.computed)(()=>d.value),save:()=>{var e;return(e=d.value)==null?void 0:e.save()},focus:e=>{var t;(t=d.value)==null||t.focus(e)},render:e=>{let t=d.value;if(t!==null)return t.render(e).then(()=>{var n;(n=a(t))==null||n.markRendered(e)})}}),()=>(0,e.h)(z,g({editor:d.value},i))}}),H=[`toolbox`,`isReadOnlySupported`,`__isBlokVueBlock`],U=new Set([void 0,`user`,`api`,`convert`]),W=(e,t,r)=>{var i;e==null||(i=e.events)==null||i.emit(n.BlockChildrenMounted,{blockId:t,childIds:r.map(e=>e.id)})};function G(t){var r,i;let a=()=>(0,e.defineComponent)({name:`VueBlock(${t.type})`,props:{ctx:{type:Object,required:!0},notifyMounted:{type:Function,default:void 0}},setup(n){return(0,e.onMounted)(()=>{var e;return(e=n.notifyMounted)==null?void 0:e.call(n)}),t.setup(n.ctx)}}),o=(r=class{static get toolbox(){return t.toolbox}static get isReadOnlySupported(){return!0}constructor(r){var i,o,s;this.wrappedComponent=a(),this.mountSignalled=!1,this.hostEl=null,this.pendingDispatch=!1,this.anchorEl=null,this.toolbarAnchorRef=e=>{let t=e===null||e instanceof Element?e:e.$el;this.anchorEl=t instanceof HTMLElement?t:null},this.notifyMounted=()=>{var e;if(this.mountSignalled)return;this.mountSignalled=!0;let n={origin:this.origin,api:this.api};if((e=t.onMounted)==null||e.call(t,this.blockApi,n),U.has(this.origin)){var r;(r=t.onCreated)==null||r.call(t,this.blockApi,n)}},this.commit=e=>{let r=(0,n.fillDefaults)(t.propSchema,g(g({},this.mirror),e));(0,n.deepEqual)(r,this.mirror)||(this.mirror=r,this.lastRendered=r,this.dataRef.value=r,this.flushDispatch())},this.blockApi=r.block;let c=(i=r.config)==null?{}:i;this.registry=c[x],this.api=r.api;let l=r.api;this.pointerDrag=()=>{var e;return(l==null||(e=l.blocks)==null?void 0:e.isPointerDragActive)===!0},this.mirror=(0,n.fillDefaults)(t.propSchema,(0,e.toRaw)((o=r.data)==null?{}:o)),this.lastRendered=this.mirror,this.dataRef=(0,e.shallowRef)(this.mirror),this.readOnlyRef=(0,e.shallowRef)(r.readOnly),this.origin=(s=r.origin)==null?`api`:s;let u=this.blockApi,d=this.api;this.childrenComponent=(0,e.defineComponent)({name:`VueBlockChildren(${t.type})`,props:{childAttributes:{type:Function,default:void 0},childContentAttributes:{type:Function,default:void 0}},setup(t){let r=(0,e.ref)(null),i=(0,n.createChildDecorationLedger)(),a=()=>{if(r.value===null)return;let e=u.getChildren();(0,n.mountChildBlocks)(r.value,e),(0,n.applyChildDecoration)(i,e,{childAttributes:t.childAttributes,childContentAttributes:t.childContentAttributes}),W(d,u.id,e)};return(0,e.onMounted)(a),(0,e.onUpdated)(a),()=>(0,e.h)(`div`,{ref:r,[n.DATA_ATTR.nestedBlocks]:``})}})}render(){var e;let t=document.createElement(`div`);t.setAttribute(`data-blok-mutation-free`,`true`),this.hostEl=t;let n={data:this.dataRef,commit:this.commit,block:this.blockApi,api:this.api,readOnly:this.readOnlyRef,BlockChildren:this.childrenComponent,toolbarAnchorRef:this.toolbarAnchorRef};return(e=this.registry)==null||e.register(this.blockApi.id,{hostEl:t,component:this.wrappedComponent,props:{ctx:n,notifyMounted:this.notifyMounted}}),t}rendered(){var e;(e=t.onRendered)==null||e.call(t,this.blockApi)}save(){return this.mirror}async setData(r){var i=this;let a=(0,n.fillDefaults)(t.propSchema,(0,e.toRaw)(r==null?{}:r));return(0,n.deepEqual)(a,i.lastRendered)?!0:(i.mirror=a,i.lastRendered=a,i.dataRef.value=a,await(0,e.nextTick)(),!0)}setReadOnly(e){this.readOnlyRef.value=e}getToolbarAnchorElement(){var e;let n=this.anchorEl;if(n!==null&&n.isConnected)return n;let r=this.hostEl;if(r!==null&&t.getToolbarAnchorElement!==void 0)return(e=t.getToolbarAnchorElement(r,this.blockApi))==null?void 0:e}moved(){var e;(e=t.onMoved)==null||e.call(t,this.blockApi)}removed(){var e,n,r;(e=this.registry)==null||e.unregister(this.blockApi.id,(n=this.hostEl)==null?void 0:n),(r=t.onRemoved)==null||r.call(t,this.blockApi)}destroy(){var e,t;(e=this.registry)==null||e.unregister(this.blockApi.id,(t=this.hostEl)==null?void 0:t)}flushDispatch(){if(!this.pointerDrag()){this.pendingDispatch=!1,this.blockApi.dispatchChange();return}if(this.pendingDispatch)return;this.pendingDispatch=!0;let e=()=>{if(this.pointerDrag()){requestAnimationFrame(e);return}this.pendingDispatch=!1,this.blockApi.dispatchChange()};requestAnimationFrame(e)}},r.__isBlokVueBlock=!0,r);for(let[e,n]of Object.entries((i=t.statics)==null?{}:i))H.includes(e)||Object.defineProperty(o,e,{value:n,writable:!0,enumerable:!0,configurable:!0});return o}exports.BLOK_DEFAULT_CONFIG=_,exports.BLOK_EDITOR_INSTANCE=I,exports.BlokContent=z,exports.BlokEditor=V,exports.createVueBlock=G,exports.provideBlok=v,exports.useBlocks=M,exports.useBlok=A,exports.useBlokDefaults=y,exports.useBlokInstance=R,exports.useBlokReady=N;

package/dist/index.mjs

@@ -1,16 +1,16 @@
 import { Fragment as e, Teleport as t, computed as n, defineComponent as r, getCurrentInstance as i, h as a, inject as o, markRaw as s, nextTick as c, onBeforeUnmount as l, onErrorCaptured as u, onMounted as d, onScopeDispose as f, onUpdated as p, provide as m, reactive as h, ref as g, shallowRef as _, toRaw as v, toValue as y, watch as b } from "vue";
 import { Blok as x } from "@bloklabs/core";
-import { BlockChildrenMounted as ee, DATA_ATTR as te, EMPTY_API as S, applyChildDecoration as C, changeTouchesSubtree as w, createBlocksApiForEditor as T, createChildDecorationLedger as E, deepEqual as D, equalsOutputData as ne, fillDefaults as O, mountChildBlocks as re, normalizeReadOnlyConfig as k, toRenderableData as ie } from "@bloklabs/core/adapters";
+import { BlockChildrenMounted as S, DATA_ATTR as C, EMPTY_API as w, applyChildDecoration as T, changeTouchesSubtree as ee, createBlocksApiForEditor as te, createChildDecorationLedger as ne, deepEqual as E, equalsOutputData as D, fillDefaults as O, mountChildBlocks as k, normalizeReadOnlyConfig as A, toRenderableData as j } from "@bloklabs/core/adapters";
 //#region src/content-baseline-map.ts
-var A = /* @__PURE__ */ new WeakMap();
-function ae(e, t) {
-	A.set(e, t);
+var M = /* @__PURE__ */ new WeakMap();
+function re(e, t) {
+	M.set(e, t);
 }
-function j(e) {
-	return A.get(e);
+function ie(e) {
+	return M.get(e);
 }
-function M(e) {
-	A.delete(e);
+function ae(e) {
+	M.delete(e);
 }
 //#endregion
 //#region src/holder-map.ts
@@ -25,7 +25,7 @@ function se(e) {
 	N.delete(e);
 }
 //#endregion
-//#region \0@oxc-project+runtime@0.139.0/helpers/esm/typeof.js
+//#region \0@oxc-project+runtime@0.147.0/helpers/esm/typeof.js
 function F(e) {
 	"@babel/helpers - typeof";
 	return F = typeof Symbol == "function" && typeof Symbol.iterator == "symbol" ? function(e) {
@@ -35,7 +35,7 @@ function F(e) {
 	}, F(e);
 }
 //#endregion
-//#region \0@oxc-project+runtime@0.139.0/helpers/esm/toPrimitive.js
+//#region \0@oxc-project+runtime@0.147.0/helpers/esm/toPrimitive.js
 function I(e, t) {
 	if (F(e) != "object" || !e) return e;
 	var n = e[Symbol.toPrimitive];
@@ -47,13 +47,13 @@ function I(e, t) {
 	return (t === "string" ? String : Number)(e);
 }
 //#endregion
-//#region \0@oxc-project+runtime@0.139.0/helpers/esm/toPropertyKey.js
+//#region \0@oxc-project+runtime@0.147.0/helpers/esm/toPropertyKey.js
 function L(e) {
 	var t = I(e, "string");
 	return F(t) == "symbol" ? t : t + "";
 }
 //#endregion
-//#region \0@oxc-project+runtime@0.139.0/helpers/esm/defineProperty.js
+//#region \0@oxc-project+runtime@0.147.0/helpers/esm/defineProperty.js
 function R(e, t, n) {
 	return (t = L(t)) in e ? Object.defineProperty(e, t, {
 		value: n,
@@ -63,7 +63,7 @@ function R(e, t, n) {
 	}) : e[t] = n, e;
 }
 //#endregion
-//#region \0@oxc-project+runtime@0.139.0/helpers/esm/objectSpread2.js
+//#region \0@oxc-project+runtime@0.147.0/helpers/esm/objectSpread2.js
 function z(e, t) {
 	var n = Object.keys(e);
 	if (Object.getOwnPropertySymbols) {
@@ -114,7 +114,7 @@ var G = "__blokPortalRegistry", K = () => {
 		},
 		unregister(t, n) {
 			var r;
-			n !== void 0 && ((r = e.get(t)) == null ? void 0 : r.hostEl) !== n || e.delete(t);
+			(n === void 0 || ((r = e.get(t)) == null ? void 0 : r.hostEl) === n) && e.delete(t);
 		},
 		setProps(t, n) {
 			let r = e.get(t);
@@ -125,28 +125,28 @@ var G = "__blokPortalRegistry", K = () => {
 function ce(e, t) {
 	q.set(e, t);
 }
-function J(e) {
+function le(e) {
 	return q.get(e);
 }
-function le(e) {
+function ue(e) {
 	q.delete(e);
 }
 //#endregion
 //#region src/useBlok.ts
-var Y = (e) => ({
+var J = (e) => ({
 	onChange: e.onChange !== void 0,
 	onSave: e.onSave !== void 0,
 	onEnter: e.onEnter !== void 0,
 	onSubmit: e.onSubmit !== void 0,
 	onBeforeRender: e.onBeforeRender !== void 0,
 	onAfterRender: e.onAfterRender !== void 0
-}), ue = (e, t) => {
+}), de = (e) => `[Blok] \`data\` is ignored while collaboration is on: the document lives on the sync service and is shared with everyone editing it, so replacing it from this editor would overwrite their work. To replace the whole document, call POST /sync/${e == null ? "{doc}" : e}/reset on your server — it reloads the document from your own document endpoint and every open editor picks it up. To change part of it, use the blocks API (insert/update/delete).`, fe = (e, t) => {
 	if (typeof e != "object" || !e) return e;
 	let n = {};
 	for (let [i, a] of Object.entries(e)) {
 		var r;
 		let e = typeof a == "function" ? a : a == null ? void 0 : a.class;
-		if (!(typeof e == "function" && e.__isBlokVueBlock === !0)) {
+		if (typeof e != "function" || e.__isBlokVueBlock !== !0) {
 			n[i] = a;
 			continue;
 		}
@@ -155,13 +155,15 @@ var Y = (e) => ({
 	}
 	return n;
 };
-function X(e, t) {
+function Y(e, t) {
 	let n = _(null), r = o(V, {}), i = () => W(r, y(e)), a = {
 		current: null,
 		holder: null,
 		lastRenderedData: i().data,
 		seededEditor: null,
 		renderChain: Promise.resolve(),
+		collaborationWarned: !1,
+		constructedCollaboration: void 0,
 		appliedHandlerPresence: {
 			onChange: !1,
 			onSave: !1,
@@ -200,7 +202,7 @@ function X(e, t) {
 		return delete t.holder, t.data !== void 0 && (t.data = v(t.data)), t;
 	}, u = () => {
 		if (a.current !== null) {
-			se(a.current), le(a.current), M(a.current);
+			se(a.current), ue(a.current), ae(a.current);
 			try {
 				a.current.destroy();
 			} catch (e) {}
@@ -210,11 +212,11 @@ function X(e, t) {
 		let e = document.createElement("div");
 		a.holder = e;
 		let t = c(), r = K();
-		t.tools !== void 0 && (t.tools = ue(t.tools, r));
-		let o = Y(i());
+		t.tools !== void 0 && (t.tools = fe(t.tools, r));
+		let o = J(i());
 		t.onChange = o.onChange ? s.onChange : void 0, t.onSave = o.onSave ? s.onSave : void 0, t.onEnter = o.onEnter ? s.onEnter : void 0, t.onSubmit = o.onSubmit ? s.onSubmit : void 0, t.onBeforeRender = o.onBeforeRender ? s.onBeforeRender : void 0, t.onAfterRender = o.onAfterRender ? s.onAfterRender : void 0, a.appliedHandlerPresence = o;
 		let l = new x(B(B({}, t), {}, { holder: e }));
-		a.current = l, oe(l, e), ce(l, r), ae(l, { markRendered: (e) => {
+		a.current = l, a.constructedCollaboration = t.collaboration, oe(l, e), ce(l, r), re(l, { markRendered: (e) => {
 			a.lastRenderedData = e;
 		} }), l.isReady.then(() => {
 			a.current === l && (n.value = l);
@@ -224,8 +226,8 @@ function X(e, t) {
 	};
 	b([
 		n,
-		() => k(i().readOnly).enabled,
-		() => k(i().readOnly).hideControls,
+		() => A(i().readOnly).enabled,
+		() => A(i().readOnly).hideControls,
 		() => typeof i().readOnly == "object"
 	], ([e, t, n, r]) => {
 		e && (r ? e.readOnly.set(t, { hideControls: n }) : e.readOnly.set(t));
@@ -245,14 +247,14 @@ function X(e, t) {
 		var e;
 		return (e = i().style) == null ? void 0 : e.tokens;
 	}], ([e, t]) => {
-		!e || t === void 0 || D(t, p.value) || (p.value = B({}, t), e.tokens.set(t));
+		!e || t === void 0 || E(t, p.value) || (p.value = B({}, t), e.tokens.set(t));
 	}, {
 		immediate: !0,
 		deep: !0
 	});
 	let m = { value: i().i18n };
 	b([n, () => i().i18n], ([e, t]) => {
-		if (!e || t === void 0 || D(t, m.value)) return;
+		if (!e || t === void 0 || E(t, m.value)) return;
 		m.value = B({}, t);
 		let { locale: n, messages: r, direction: i } = t;
 		e.i18n.update(B(B(B({}, n === void 0 ? {} : { locale: n }), r === void 0 ? {} : { messages: r }), i === void 0 ? {} : { direction: i }));
@@ -265,7 +267,7 @@ function X(e, t) {
 		value: void 0
 	};
 	return b([n, () => i().inlineToolbar], ([e, t]) => {
-		if (!e || t === void 0 || h.editor === e && D(t, h.value)) return;
+		if (!e || t === void 0 || h.editor === e && E(t, h.value)) return;
 		let n = Array.isArray(t) ? [...t] : t;
 		h.editor = e, h.value = n, e.tools.setInlineToolbar(n);
 	}, {
@@ -273,9 +275,9 @@ function X(e, t) {
 		deep: !0
 	}), b([n, () => i().autofocus], ([e, t]) => {
 		e && t && e.focus();
-	}, { immediate: !0 }), b([n, () => JSON.stringify(Y(i()))], ([e]) => {
+	}, { immediate: !0 }), b([n, () => JSON.stringify(J(i()))], ([e]) => {
 		if (!e) return;
-		let t = Y(i()), n = a.appliedHandlerPresence, r = {}, o = { value: !1 }, c = (e, r) => {
+		let t = J(i()), n = a.appliedHandlerPresence, r = {}, o = { value: !1 }, c = (e, r) => {
 			t[e] !== n[e] && (n[e] = t[e], o.value = !0, r(t[e] ? s[e] : void 0));
 		};
 		c("onChange", (e) => {
@@ -298,37 +300,43 @@ function X(e, t) {
 			return;
 		}
 		let n = a.lastRenderedData;
-		n !== void 0 && ne(t, n) || (a.lastRenderedData = t, a.renderChain = a.renderChain.catch(() => void 0).then(() => e.render(ie(v(t)))));
+		if (n !== void 0 && D(t, n)) return;
+		let r = a.constructedCollaboration;
+		if (r !== void 0) {
+			a.collaborationWarned || (a.collaborationWarned = !0, console.warn(de(r.doc)));
+			return;
+		}
+		a.lastRenderedData = t, a.renderChain = a.renderChain.catch(() => void 0).then(() => e.render(j(v(t))));
 	}, { immediate: !0 }), t !== void 0 && b(() => y(t), () => {
 		u(), f();
 	}), d(f), l(u), n;
 }
 //#endregion
 //#region src/useBlocks.ts
-var Z = "block changed";
-function de(e, t = {}) {
+var X = "block changed";
+function pe(e, t = {}) {
 	let n = _(0), r = () => {
 		let t = y(e);
 		return t === null ? null : v(t);
 	}, i = () => {
 		n.value;
-	}, a = _(S), o = {
+	}, a = _(w), o = {
 		editor: null,
 		handler: null
 	}, s = () => {
-		o.editor !== null && o.handler !== null && o.editor.off(Z, o.handler), o.editor = null, o.handler = null;
+		o.editor !== null && o.handler !== null && o.editor.off(X, o.handler), o.editor = null, o.handler = null;
 	};
 	return b(() => r(), (e) => {
 		if (s(), n.value += 1, e === null) {
-			a.value = S;
+			a.value = w;
 			return;
 		}
 		let r = (r) => {
 			var i;
 			let a = (i = y(t.within)) == null ? null : i;
-			a !== null && !w(e, r, a) || (n.value += 1);
+			a !== null && !ee(e, r, a) || (n.value += 1);
 		};
-		e.on(Z, r), o.editor = e, o.handler = r, a.value = T(e, i);
+		e.on(X, r), o.editor = e, o.handler = r, a.value = te(e, i);
 	}, { immediate: !0 }), f(s), {
 		getById: (e) => a.value.getById(e),
 		getChildren: (e) => a.value.getChildren(e),
@@ -363,7 +371,7 @@ function de(e, t = {}) {
 }
 //#endregion
 //#region src/useBlokReady.ts
-function fe(e = {}) {
+function me(e = {}) {
 	let { within: t, settleOn: n } = e, r = _(!1), i = () => {
 		var e;
 		let i = t === void 0 || (e = y(t)) == null ? null : e;
@@ -376,7 +384,7 @@ function fe(e = {}) {
 }
 //#endregion
 //#region src/BlockPortalHost.ts
-var pe = r({
+var he = r({
 	name: "BlockErrorBoundary",
 	setup(e, { slots: t }) {
 		return u(() => !1), () => {
@@ -384,7 +392,7 @@ var pe = r({
 			return (e = t.default) == null ? void 0 : e.call(t);
 		};
 	}
-}), me = r({
+}), ge = r({
 	name: "BlockPortalHost",
 	props: { registry: {
 		type: Object,
@@ -394,11 +402,11 @@ var pe = r({
 		return () => a(e, Array.from(n.registry.entries.entries()).map(([e, n]) => a(t, {
 			key: e,
 			to: n.hostEl
-		}, [a(pe, null, { default: () => a(n.component, n.props) })])));
+		}, [a(he, null, { default: () => a(n.component, n.props) })])));
 	}
-}), Q = Symbol("BLOK_EDITOR_INSTANCE"), he = _(null);
-function ge() {
-	return o(Q, he);
+}), Z = Symbol("BLOK_EDITOR_INSTANCE"), _e = _(null);
+function Q() {
+	return o(Z, _e);
 }
 //#endregion
 //#region src/BlokContent.ts
@@ -410,7 +418,7 @@ var $ = r({
 	} },
 	setup(e) {
 		let t = g(null);
-		m(Q, n(() => e.editor === null ? null : v(e.editor)));
+		m(Z, n(() => e.editor === null ? null : v(e.editor)));
 		let r = (e) => {
 			if (t.value === null || e === null) return;
 			let n = P(v(e));
@@ -426,11 +434,11 @@ var $ = r({
 		}), l(() => {
 			i(e.editor);
 		}), () => {
-			let n = e.editor, r = n === null ? void 0 : J(v(n));
-			return a("div", { ref: t }, r === void 0 ? [] : [a(me, { registry: r })]);
+			let n = e.editor, r = n === null ? void 0 : le(v(n));
+			return a("div", { ref: t }, r === void 0 ? [] : [a(ge, { registry: r })]);
 		};
 	}
-}), _e = /* @__PURE__ */ "autofocus.defaultBlock.dataModel.placeholder.sanitizer.hideToolbar.toolbarPosition.maxHistoryLength.historyDebounceTime.newGroupDelay.globalUndoRedo.tools.data.minHeight.logLevel.readOnly.i18n.link.linkPaste.inlineToolbar.tunes.style.theme.scrollToBlock.user.resolveUser.notifierPosition.notifier.width.onBeforeRender.onBeforePaste.onEnter.onSubmit.onError.migrations.uploader.captureClicksBelowEditor".split("."), ve = r({
+}), ve = /* @__PURE__ */ "autofocus.defaultBlock.dataModel.placeholder.sanitizer.hideToolbar.toolbarPosition.maxHistoryLength.historyDebounceTime.newGroupDelay.globalUndoRedo.tools.data.minHeight.logLevel.readOnly.i18n.link.linkPaste.inlineToolbar.tunes.style.theme.scrollToBlock.user.resolveUser.notifierPosition.notifier.width.onBeforeRender.onBeforePaste.onEnter.onSubmit.onError.migrations.uploader.server.ticket.persistence.collaboration.captureClicksBelowEditor".split("."), ye = r({
 	name: "BlokEditor",
 	inheritAttrs: !1,
 	props: {
@@ -578,6 +586,22 @@ var $ = r({
 			type: Object,
 			default: void 0
 		},
+		server: {
+			type: String,
+			default: void 0
+		},
+		ticket: {
+			type: String,
+			default: void 0
+		},
+		persistence: {
+			type: Object,
+			default: void 0
+		},
+		collaboration: {
+			type: Object,
+			default: void 0
+		},
 		captureClicksBelowEditor: {
 			type: Boolean,
 			default: void 0
@@ -604,7 +628,7 @@ var $ = r({
 		});
 		let u = (e) => l.value.split("|").includes(e), d = () => {
 			let n = {};
-			for (let t of _e) {
+			for (let t of ve) {
 				let r = e[t];
 				r !== void 0 && (n[t] = r);
 			}
@@ -620,7 +644,7 @@ var $ = r({
 			}), u("onThemeChange") && (n.onThemeChange = (e) => {
 				t("theme-change", e);
 			}), n;
-		}, f = X(() => d(), () => e.recreateKey);
+		}, f = Y(() => d(), () => e.recreateKey);
 		b([f, l], ([e], n, r) => {
 			if (e === null) return;
 			let i = [];
@@ -653,28 +677,28 @@ var $ = r({
 				let t = f.value;
 				if (t !== null) return t.render(e).then(() => {
 					var n;
-					(n = j(t)) == null || n.markRendered(e);
+					(n = ie(t)) == null || n.markRendered(e);
 				});
 			}
 		}), () => a($, B({ editor: f.value }, o));
 	}
-}), ye = [
+}), be = [
 	"toolbox",
 	"isReadOnlySupported",
 	"__isBlokVueBlock"
-], be = /* @__PURE__ */ new Set([
+], xe = /* @__PURE__ */ new Set([
 	void 0,
 	"user",
 	"api",
 	"convert"
-]), xe = (e, t, n) => {
+]), Se = (e, t, n) => {
 	var r;
-	e == null || (r = e.events) == null || r.emit(ee, {
+	e == null || (r = e.events) == null || r.emit(S, {
 		blockId: t,
 		childIds: n.map((e) => e.id)
 	});
 };
-function Se(e) {
+function Ce(e) {
 	var t, n;
 	let i = () => r({
 		name: `VueBlock(${e.type})`,
@@ -714,13 +738,13 @@ function Se(e) {
 					origin: this.origin,
 					api: this.api
 				};
-				if ((t = e.onMounted) == null || t.call(e, this.blockApi, n), be.has(this.origin)) {
+				if ((t = e.onMounted) == null || t.call(e, this.blockApi, n), xe.has(this.origin)) {
 					var r;
 					(r = e.onCreated) == null || r.call(e, this.blockApi, n);
 				}
 			}, this.commit = (t) => {
 				let n = O(e.propSchema, B(B({}, this.mirror), t));
-				D(n, this.mirror) || (this.mirror = n, this.lastRendered = n, this.dataRef.value = n, this.flushDispatch());
+				E(n, this.mirror) || (this.mirror = n, this.lastRendered = n, this.dataRef.value = n, this.flushDispatch());
 			}, this.blockApi = t.block;
 			let c = (n = t.config) == null ? {} : n;
 			this.registry = c[G], this.api = t.api;
@@ -743,17 +767,17 @@ function Se(e) {
 					}
 				},
 				setup(e) {
-					let t = g(null), n = E(), r = () => {
+					let t = g(null), n = ne(), r = () => {
 						if (t.value === null) return;
 						let r = u.getChildren();
-						re(t.value, r), C(n, r, {
+						k(t.value, r), T(n, r, {
 							childAttributes: e.childAttributes,
 							childContentAttributes: e.childContentAttributes
-						}), xe(f, u.id, r);
+						}), Se(f, u.id, r);
 					};
 					return d(r), p(r), () => a("div", {
 						ref: t,
-						[te.nestedBlocks]: ""
+						[C.nestedBlocks]: ""
 					});
 				}
 			});
@@ -790,7 +814,7 @@ function Se(e) {
 		async setData(t) {
 			var n = this;
 			let r = O(e.propSchema, v(t == null ? {} : t));
-			return D(r, n.lastRendered) ? !0 : (n.mirror = r, n.lastRendered = r, n.dataRef.value = r, await c(), !0);
+			return E(r, n.lastRendered) ? !0 : (n.mirror = r, n.lastRendered = r, n.dataRef.value = r, await c(), !0);
 		}
 		setReadOnly(e) {
 			this.readOnlyRef.value = e;
@@ -800,7 +824,7 @@ function Se(e) {
 			let n = this.anchorEl;
 			if (n !== null && n.isConnected) return n;
 			let r = this.hostEl;
-			if (!(r === null || e.getToolbarAnchorElement === void 0)) return (t = e.getToolbarAnchorElement(r, this.blockApi)) == null ? void 0 : t;
+			if (r !== null && e.getToolbarAnchorElement !== void 0) return (t = e.getToolbarAnchorElement(r, this.blockApi)) == null ? void 0 : t;
 		}
 		moved() {
 			var t;
@@ -831,7 +855,7 @@ function Se(e) {
 			requestAnimationFrame(e);
 		}
 	}, t.__isBlokVueBlock = !0, t);
-	for (let [t, r] of Object.entries((n = e.statics) == null ? {} : n)) ye.includes(t) || Object.defineProperty(o, t, {
+	for (let [t, r] of Object.entries((n = e.statics) == null ? {} : n)) be.includes(t) || Object.defineProperty(o, t, {
 		value: r,
 		writable: !0,
 		enumerable: !0,
@@ -840,4 +864,4 @@ function Se(e) {
 	return o;
 }
 //#endregion
-export { V as BLOK_DEFAULT_CONFIG, Q as BLOK_EDITOR_INSTANCE, $ as BlokContent, ve as BlokEditor, Se as createVueBlock, H as provideBlok, de as useBlocks, X as useBlok, U as useBlokDefaults, ge as useBlokInstance, fe as useBlokReady };
+export { V as BLOK_DEFAULT_CONFIG, Z as BLOK_EDITOR_INSTANCE, $ as BlokContent, ye as BlokEditor, Ce as createVueBlock, H as provideBlok, pe as useBlocks, Y as useBlok, U as useBlokDefaults, Q as useBlokInstance, me as useBlokReady };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bloklabs/vue",
-  "version": "1.12.0",
+  "version": "1.13.0",
   "description": "Vue block editor — official Vue 3 bindings for Blok, the headless Notion-like rich text editor. Composables and components that render blocks and save to JSON.",
   "license": "Apache-2.0",
   "author": "JackUait",
@@ -54,7 +54,7 @@
     "build": "yarn run -T vite build --mode production"
   },
   "peerDependencies": {
-    "@bloklabs/core": "^1.12.0",
+    "@bloklabs/core": "^1.13.0",
     "vue": "^3.5.0"
   }
 }

package/src/BlokEditor.ts

@@ -77,6 +77,14 @@ export const BlokEditor = defineComponent({
     migrations: { type: Object as PropType<BlokConfig['migrations']>, default: undefined },
     /** Editor-level uploader, routed by asset kind (images, video, audio, files). */
     uploader: { type: Object as PropType<BlokConfig['uploader']>, default: undefined },
+    /** Base URL of a service speaking Blok's upload and unfurl contracts. */
+    server: { type: String as PropType<BlokConfig['server']>, default: undefined },
+    /** Endpoint in your app that mints a short-lived access pass for the current user. */
+    ticket: { type: String as PropType<BlokConfig['ticket']>, default: undefined },
+    /** Load on mount and save on change, against your own endpoint. */
+    persistence: { type: Object as PropType<BlokConfig['persistence']>, default: undefined },
+    /** Real-time multiplayer against the server's sync service. Mutually exclusive with persistence. */
+    collaboration: { type: Object as PropType<BlokConfig['collaboration']>, default: undefined },
     /** Opt-in: clicks on the host page below the editor append a block. */
     captureClicksBelowEditor: { type: Boolean as PropType<boolean | undefined>, default: undefined },
     /** Changing this prop's identity destroys and recreates the editor. */

package/src/config-keys.ts

@@ -50,6 +50,10 @@ export const BLOK_EDITOR_CONFIG_KEYS = [
   'onError',
   'migrations',
   'uploader',
+  'server',
+  'ticket',
+  'persistence',
+  'collaboration',
   'captureClicksBelowEditor',
 ] as const satisfies readonly (keyof UseBlokConfig)[];
 

package/src/useBlok.ts

@@ -43,6 +43,19 @@ const readHandlerPresence = (config: UseBlokConfig): HandlerPresence => ({
   onAfterRender: config.onAfterRender !== undefined,
 });
 
+/**
+ * Warning text for a controlled `data` change the adapter refuses to render
+ * under collaboration. Kept verbatim in all three adapters (they share no code).
+ * @param doc - the collaboration document id, for the reset endpoint in the text
+ * @returns the message to warn with, once per adapter instance
+ */
+const collaborationDataIgnoredMessage = (doc?: string): string =>
+  '[Blok] `data` is ignored while collaboration is on: the document lives on the sync service ' +
+  'and is shared with everyone editing it, so replacing it from this editor would overwrite their work. ' +
+  `To replace the whole document, call POST /sync/${doc ?? '{doc}'}/reset on your server — ` +
+  'it reloads the document from your own document endpoint and every open editor picks it up. ' +
+  'To change part of it, use the blocks API (insert/update/delete).';
+
 /**
  * Inject the editor's portal registry into every `createVueBlock` tool's config
  * (vanilla tools are left untouched), returning a NEW tools object so the
@@ -126,6 +139,14 @@ export function useBlok(
     lastRenderedData: OutputData | LooseOutputData | null | undefined;
     seededEditor: Blok | null;
     renderChain: Promise<void>;
+    collaborationWarned: boolean;
+    // The `collaboration` the live editor was CONSTRUCTED with. The key is
+    // mount-fixed, so dropping it from the config (`collaboration: on ? {...} :
+    // undefined`) cannot turn a live session into a single-player editor —
+    // reading the current config instead would let that change fall through
+    // into render(), which refuses under collaboration and rejects with
+    // nothing surfaced anywhere.
+    constructedCollaboration: UseBlokConfig['collaboration'];
     appliedHandlerPresence: HandlerPresence;
   } = {
     current: null,
@@ -133,6 +154,8 @@ export function useBlok(
     lastRenderedData: mergedConfig().data,
     seededEditor: null,
     renderChain: Promise.resolve(),
+    collaborationWarned: false,
+    constructedCollaboration: undefined,
     appliedHandlerPresence: {
       onChange: false,
       onSave: false,
@@ -246,6 +269,7 @@ export function useBlok(
     const blok = new BlokRuntime({ ...snapshot, holder });
 
     state.current = blok;
+    state.constructedCollaboration = snapshot.collaboration as UseBlokConfig['collaboration'];
     setHolder(blok, holder);
     setRegistry(blok, registry);
     // The out-of-band content channel: `<BlokEditor>`'s exposed `render()`
@@ -531,6 +555,24 @@ export function useBlok(
         return;
       }
 
+      // Under collaboration the document belongs to the sync service, and
+      // render() refuses a wholesale replace — so don't attempt one. The prop's
+      // premise ("this value IS the document") does not hold here. Decided
+      // against the MOUNTED config, never the current one: `collaboration` is
+      // mount-fixed, so a host that drops the key is still driving a
+      // collaboration session and deserves the warning rather than a silently
+      // rejected render.
+      const collaboration = state.constructedCollaboration;
+
+      if (collaboration !== undefined) {
+        if (!state.collaborationWarned) {
+          state.collaborationWarned = true;
+          console.warn(collaborationDataIgnoredMessage(collaboration.doc));
+        }
+
+        return;
+      }
+
       state.lastRenderedData = data;
       // `data` may be null (a controlled "clear to empty"); render() throws on
       // null, so normalize null → { blocks: [] } at the boundary. toRaw(null)