@bloklabs/vue 1.4.1 → 1.4.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.cjs CHANGED
@@ -1 +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)}function s(e){"@babel/helpers - typeof";return s=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},s(e)}function c(e,t){if(s(e)!=`object`||!e)return e;var n=e[Symbol.toPrimitive];if(n!==void 0){var r=n.call(e,t||`default`);if(s(r)!=`object`)return r;throw TypeError(`@@toPrimitive must return a primitive value.`)}return(t===`string`?String:Number)(e)}function l(e){var t=c(e,`string`);return s(t)==`symbol`?t:t+``}function u(e,t,n){return(t=l(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function d(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 f(e){for(var t=1;t<arguments.length;t++){var n=arguments[t]==null?{}:arguments[t];t%2?d(Object(n),!0).forEach(function(t){u(e,t,n[t])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):d(Object(n)).forEach(function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))})}return e}var p=Symbol(`BLOK_DEFAULT_CONFIG`);function m(t){(0,e.provide)(p,t)}function h(){return(0,e.inject)(p,{})}function g(e,t){if(Object.keys(e).length===0)return t;let n=f({},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=f(f({},e.tools),t.tools)),n}var _=`__blokPortalRegistry`,v=()=>{let t=(0,e.reactive)(new Map);return{entries:t,register(n,r){t.set(n,(0,e.markRaw)(r))},unregister(e){t.delete(e)},setProps(e,n){let r=t.get(e);r!==void 0&&Object.assign(r.props,n)}}},y=new WeakMap;function b(e,t){y.set(e,t)}function x(e){return y.get(e)}function S(e){y.delete(e)}var C=(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}:f({},a);o.config=f(f({},(r=o.config)==null?{}:r),{},{[_]:t}),n[i]=o}return n};function w(r,a){let s=(0,e.shallowRef)(null),c=(0,e.inject)(p,{}),l=()=>g(c,(0,e.toValue)(r)),u={current:null,holder:null,lastRenderedData:l().data,seededEditor:null,renderChain:Promise.resolve()},d=()=>{let t=f({},g((0,e.toRaw)(c),(0,e.toRaw)((0,e.toValue)(r))));return delete t.holder,t.data!==void 0&&(t.data=(0,e.toRaw)(t.data)),t},m=()=>{if(u.current!==null){o(u.current),S(u.current);try{u.current.destroy()}catch(e){}}u.current=null,u.holder=null,s.value=null},h=()=>{let e=document.createElement(`div`);u.holder=e;let n=d(),r=v();n.tools!==void 0&&(n.tools=C(n.tools,r)),typeof n.onSave==`function`&&(n.onSave=(...e)=>{var t,n;u.lastRenderedData=e[0],(t=(n=l()).onSave)==null||t.call(n,...e)});let a=new t.Blok(f(f({},n),{},{holder:e}));u.current=a,i(a,e),b(a,r),a.isReady.then(()=>{u.current===a&&(s.value=a)}).catch(()=>{u.current===a&&m()})};(0,e.watch)([s,()=>(0,n.normalizeReadOnlyConfig)(l().readOnly).enabled,()=>(0,n.normalizeReadOnlyConfig)(l().readOnly).hideControls,()=>typeof l().readOnly==`object`],([e,t,n,r])=>{e&&(r?e.readOnly.set(t,{hideControls:n}):e.readOnly.set(t))},{immediate:!0}),(0,e.watch)([s,()=>l().hideToolbar],([e,t])=>{e&&e.toolbar.setHidden(!!t)},{immediate:!0}),(0,e.watch)([s,()=>l().theme],([e,t])=>{e&&t!==void 0&&e.theme.set(t)},{immediate:!0}),(0,e.watch)([s,()=>l().width],([e,t])=>{e&&t!==void 0&&e.width.set(t)},{immediate:!0}),(0,e.watch)([s,()=>l().placeholder],([e,t])=>{e&&t!==void 0&&e.placeholder.set(t)},{immediate:!0});let _={value:void 0};(0,e.watch)([s,()=>{var e;return(e=l().style)==null?void 0:e.tokens}],([e,t])=>{!e||t===void 0||(0,n.deepEqual)(t,_.value)||(_.value=f({},t),e.tokens.set(t))},{immediate:!0,deep:!0});let y={value:l().i18n};(0,e.watch)([s,()=>l().i18n],([e,t])=>{if(!e||t===void 0||(0,n.deepEqual)(t,y.value))return;y.value=f({},t);let{locale:r,messages:i,direction:a}=t;e.i18n.update(f(f(f({},r===void 0?{}:{locale:r}),i===void 0?{}:{messages:i}),a===void 0?{}:{direction:a}))},{immediate:!0,deep:!0});let x={editor:null,value:void 0};return(0,e.watch)([s,()=>l().inlineToolbar],([e,t])=>{if(!e||t===void 0||x.editor===e&&(0,n.deepEqual)(t,x.value))return;let r=Array.isArray(t)?[...t]:t;x.editor=e,x.value=r,e.tools.setInlineToolbar(r)},{immediate:!0,deep:!0}),(0,e.watch)([s,()=>l().autofocus],([e,t])=>{e&&t&&e.focus()},{immediate:!0}),(0,e.watch)([s,()=>l().data],([t,r])=>{if(!(!t||r===void 0)){if(u.seededEditor!==t){u.seededEditor=t,u.lastRenderedData=r;return}(0,n.deepEqual)(r,u.lastRenderedData)||(u.lastRenderedData=r,u.renderChain=u.renderChain.catch(()=>void 0).then(()=>t.render((0,e.toRaw)(r))))}},{immediate:!0}),a!==void 0&&(0,e.watch)(()=>(0,e.toValue)(a),()=>{m(),h()}),(0,e.onMounted)(h),(0,e.onBeforeUnmount)(m),s}var T=`block changed`;function E(t){let r=(0,e.shallowRef)(0),i=()=>{let n=(0,e.toValue)(t);return n===null?null:(0,e.toRaw)(n)},a=()=>{r.value},o=(0,e.shallowRef)(n.EMPTY_API),s={editor:null,handler:null},c=()=>{s.editor!==null&&s.handler!==null&&s.editor.off(T,s.handler),s.editor=null,s.handler=null};return(0,e.watch)(()=>i(),e=>{if(c(),r.value+=1,e===null){o.value=n.EMPTY_API;return}let t=()=>{r.value+=1};e.on(T,t),s.editor=e,s.handler=t,o.value=(0,n.createBlocksApiForEditor)(e,a)},{immediate:!0}),(0,e.onScopeDispose)(c),{getById:e=>o.value.getById(e),getChildren:e=>o.value.getChildren(e),insert:e=>o.value.insert(e),insertMany:e=>o.value.insertMany(e),insertTree:e=>o.value.insertTree(e),insertMarkdown:(e,t)=>o.value.insertMarkdown(e,t),exportMarkdown:()=>o.value.exportMarkdown(),move:(e,t)=>o.value.move(e,t),nest:(e,t)=>o.value.nest(e,t),unnest:e=>o.value.unnest(e),remove:e=>o.value.remove(e),update:(e,t,n)=>o.value.update(e,t,n),convert:(e,t,n,r)=>o.value.convert(e,t,n,r),transact:e=>o.value.transact(e),transactWithoutCapture:e=>o.value.transactWithoutCapture(e),getBlocksCount:()=>o.value.getBlocksCount(),getCurrentBlockIndex:()=>o.value.getCurrentBlockIndex(),getBlockByIndex:e=>o.value.getBlockByIndex(e),getBlockByElement:e=>o.value.getBlockByElement(e),getBlockData:e=>o.value.getBlockData(e),getBlockIndex:e=>o.value.getBlockIndex(e),composeBlockData:e=>o.value.composeBlockData(e),renderFromHTML:e=>o.value.renderFromHTML(e),insertOutputData:(e,t)=>o.value.insertOutputData(e,t),splitBlock:(e,t,n,r,i)=>o.value.splitBlock(e,t,n,r,i),insertInsideParent:(e,t,n)=>o.value.insertInsideParent(e,t,n),render:e=>o.value.render(e),clear:()=>o.value.clear(),isSyncingFromYjs:()=>o.value.isSyncingFromYjs()}}function D(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 O=(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)}}}),k=(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)(O,null,{default:()=>(0,e.h)(n.component,n.props)})])))}}),A=(0,e.defineComponent)({name:`BlokContent`,props:{editor:{type:Object,default:null}},setup(t){let n=(0,e.ref)(null),r=t=>{if(n.value===null||t===null)return;let r=a((0,e.toRaw)(t));r!==void 0&&n.value.appendChild(r)},i=t=>{var n;t!==null&&((n=a((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:x((0,e.toRaw)(r));return(0,e.h)(`div`,{ref:n},i===void 0?[]:[(0,e.h)(k,{registry:i})])}}}),j=`autofocus.defaultBlock.dataModel.placeholder.sanitizer.hideToolbar.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.onError`.split(`.`),M=(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},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},onError:{type:Function,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 a=(0,e.getCurrentInstance)(),o=e=>{let t=a==null?void 0:a.vnode.props;return t!=null&&e in t},s=()=>{let e={};for(let n of j){let r=t[n];r!==void 0&&(e[n]=r)}return o(`onChange`)&&(e.onChange=(e,t)=>{n(`change`,{api:e,event:t})}),(o(`onSave`)||o(`onUpdate:data`))&&(e.onSave=e=>{n(`update:data`,e),n(`save`,e)}),o(`onAfterRender`)&&(e.onAfterRender=e=>{n(`after-render`,e)}),o(`onThemeChange`)&&(e.onThemeChange=e=>{n(`theme-change`,e)}),e},c=w(()=>s(),()=>t.recreateKey);(0,e.watch)(c,(e,t,r)=>{if(e===null)return;let i=[];if(o(`onBlocksRendered`)){let t=e=>n(`blocks-rendered`,e);e.on(`blocks:rendered`,t),i.push([`blocks:rendered`,t])}if(o(`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 l={last:null};return(0,e.watch)(c,e=>{e!==null&&e!==l.last&&(l.last=e,n(`ready`,e))}),r({instance:(0,e.computed)(()=>c.value),save:()=>{var e;return(e=c.value)==null?void 0:e.save()},focus:e=>{var t;(t=c.value)==null||t.focus(e)},render:e=>{var t;return(t=c.value)==null?void 0:t.render(e)}}),()=>(0,e.h)(A,f({editor:c.value},i))}});function N(t){var r;let i=(0,e.defineComponent)({name:`VueBlock(${t.type})`,props:{ctx:{type:Object,required:!0}},setup(e){return t.setup(e.ctx)}});return r=class{static get toolbox(){return t.toolbox}static get isReadOnlySupported(){return!0}constructor(r){var i,a;this.hostEl=null,this.pendingDispatch=!1,this.commit=e=>{let r=(0,n.fillDefaults)(t.propSchema,f(f({},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 o=(i=r.config)==null?{}:i;this.registry=o[_];let s=r.api;this.pointerDrag=()=>{var e;return(s==null||(e=s.blocks)==null?void 0:e.isPointerDragActive)===!0},this.mirror=(0,n.fillDefaults)(t.propSchema,(0,e.toRaw)((a=r.data)==null?{}:a)),this.lastRendered=this.mirror,this.dataRef=(0,e.shallowRef)(this.mirror),this.readOnlyRef=(0,e.shallowRef)(r.readOnly);let c=this.blockApi;this.childrenComponent=(0,e.defineComponent)({name:`VueBlockChildren(${t.type})`,setup(){let t=(0,e.ref)(null),r=()=>{t.value!==null&&(0,n.mountChildBlocks)(t.value,c.getChildren())};return(0,e.onMounted)(r),(0,e.onUpdated)(r),()=>(0,e.h)(`div`,{ref:t,[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,readOnly:this.readOnlyRef,BlockChildren:this.childrenComponent};return(e=this.registry)==null||e.register(this.blockApi.id,{hostEl:t,component:i,props:{ctx:n}}),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}moved(){var e;(e=t.onMoved)==null||e.call(t,this.blockApi)}removed(){var e,n;(e=this.registry)==null||e.unregister(this.blockApi.id),(n=t.onRemoved)==null||n.call(t,this.blockApi)}destroy(){var e;(e=this.registry)==null||e.unregister(this.blockApi.id)}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}exports.BLOK_DEFAULT_CONFIG=p,exports.BlokContent=A,exports.BlokEditor=M,exports.createVueBlock=N,exports.provideBlok=m,exports.useBlocks=E,exports.useBlok=w,exports.useBlokDefaults=h,exports.useBlokReady=D;
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)}function s(e){"@babel/helpers - typeof";return s=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},s(e)}function c(e,t){if(s(e)!=`object`||!e)return e;var n=e[Symbol.toPrimitive];if(n!==void 0){var r=n.call(e,t||`default`);if(s(r)!=`object`)return r;throw TypeError(`@@toPrimitive must return a primitive value.`)}return(t===`string`?String:Number)(e)}function l(e){var t=c(e,`string`);return s(t)==`symbol`?t:t+``}function u(e,t,n){return(t=l(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function d(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 f(e){for(var t=1;t<arguments.length;t++){var n=arguments[t]==null?{}:arguments[t];t%2?d(Object(n),!0).forEach(function(t){u(e,t,n[t])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):d(Object(n)).forEach(function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))})}return e}var p=Symbol(`BLOK_DEFAULT_CONFIG`);function m(t){(0,e.provide)(p,t)}function h(){return(0,e.inject)(p,{})}function g(e,t){if(Object.keys(e).length===0)return t;let n=f({},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=f(f({},e.tools),t.tools)),n}var _=`__blokPortalRegistry`,v=()=>{let t=(0,e.reactive)(new Map);return{entries:t,register(n,r){t.set(n,(0,e.markRaw)(r))},unregister(e){t.delete(e)},setProps(e,n){let r=t.get(e);r!==void 0&&Object.assign(r.props,n)}}},y=new WeakMap;function b(e,t){y.set(e,t)}function x(e){return y.get(e)}function S(e){y.delete(e)}var C=(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}:f({},a);o.config=f(f({},(r=o.config)==null?{}:r),{},{[_]:t}),n[i]=o}return n};function w(r,a){let s=(0,e.shallowRef)(null),c=(0,e.inject)(p,{}),l=()=>g(c,(0,e.toValue)(r)),u={current:null,holder:null,lastRenderedData:l().data,seededEditor:null,renderChain:Promise.resolve()},d=()=>{let t=f({},g((0,e.toRaw)(c),(0,e.toRaw)((0,e.toValue)(r))));return delete t.holder,t.data!==void 0&&(t.data=(0,e.toRaw)(t.data)),t},m=()=>{if(u.current!==null){o(u.current),S(u.current);try{u.current.destroy()}catch(e){}}u.current=null,u.holder=null,s.value=null},h=()=>{let e=document.createElement(`div`);u.holder=e;let n=d(),r=v();n.tools!==void 0&&(n.tools=C(n.tools,r)),typeof n.onSave==`function`&&(n.onSave=(...e)=>{var t,n;u.lastRenderedData=e[0],(t=(n=l()).onSave)==null||t.call(n,...e)});let a=new t.Blok(f(f({},n),{},{holder:e}));u.current=a,i(a,e),b(a,r),a.isReady.then(()=>{u.current===a&&(s.value=a)}).catch(()=>{u.current===a&&m()})};(0,e.watch)([s,()=>(0,n.normalizeReadOnlyConfig)(l().readOnly).enabled,()=>(0,n.normalizeReadOnlyConfig)(l().readOnly).hideControls,()=>typeof l().readOnly==`object`],([e,t,n,r])=>{e&&(r?e.readOnly.set(t,{hideControls:n}):e.readOnly.set(t))},{immediate:!0}),(0,e.watch)([s,()=>l().hideToolbar],([e,t])=>{e&&e.toolbar.setHidden(!!t)},{immediate:!0}),(0,e.watch)([s,()=>l().theme],([e,t])=>{e&&t!==void 0&&e.theme.set(t)},{immediate:!0}),(0,e.watch)([s,()=>l().width],([e,t])=>{e&&t!==void 0&&e.width.set(t)},{immediate:!0}),(0,e.watch)([s,()=>l().placeholder],([e,t])=>{e&&t!==void 0&&e.placeholder.set(t)},{immediate:!0});let _={value:void 0};(0,e.watch)([s,()=>{var e;return(e=l().style)==null?void 0:e.tokens}],([e,t])=>{!e||t===void 0||(0,n.deepEqual)(t,_.value)||(_.value=f({},t),e.tokens.set(t))},{immediate:!0,deep:!0});let y={value:l().i18n};(0,e.watch)([s,()=>l().i18n],([e,t])=>{if(!e||t===void 0||(0,n.deepEqual)(t,y.value))return;y.value=f({},t);let{locale:r,messages:i,direction:a}=t;e.i18n.update(f(f(f({},r===void 0?{}:{locale:r}),i===void 0?{}:{messages:i}),a===void 0?{}:{direction:a}))},{immediate:!0,deep:!0});let x={editor:null,value:void 0};return(0,e.watch)([s,()=>l().inlineToolbar],([e,t])=>{if(!e||t===void 0||x.editor===e&&(0,n.deepEqual)(t,x.value))return;let r=Array.isArray(t)?[...t]:t;x.editor=e,x.value=r,e.tools.setInlineToolbar(r)},{immediate:!0,deep:!0}),(0,e.watch)([s,()=>l().autofocus],([e,t])=>{e&&t&&e.focus()},{immediate:!0}),(0,e.watch)([s,()=>l().data],([t,r])=>{if(!(!t||r===void 0)){if(u.seededEditor!==t){u.seededEditor=t,u.lastRenderedData=r;return}(0,n.deepEqual)(r,u.lastRenderedData)||(u.lastRenderedData=r,u.renderChain=u.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),()=>{m(),h()}),(0,e.onMounted)(h),(0,e.onBeforeUnmount)(m),s}var T=`block changed`;function E(t){let r=(0,e.shallowRef)(0),i=()=>{let n=(0,e.toValue)(t);return n===null?null:(0,e.toRaw)(n)},a=()=>{r.value},o=(0,e.shallowRef)(n.EMPTY_API),s={editor:null,handler:null},c=()=>{s.editor!==null&&s.handler!==null&&s.editor.off(T,s.handler),s.editor=null,s.handler=null};return(0,e.watch)(()=>i(),e=>{if(c(),r.value+=1,e===null){o.value=n.EMPTY_API;return}let t=()=>{r.value+=1};e.on(T,t),s.editor=e,s.handler=t,o.value=(0,n.createBlocksApiForEditor)(e,a)},{immediate:!0}),(0,e.onScopeDispose)(c),{getById:e=>o.value.getById(e),getChildren:e=>o.value.getChildren(e),insert:e=>o.value.insert(e),insertMany:e=>o.value.insertMany(e),insertTree:e=>o.value.insertTree(e),insertMarkdown:(e,t)=>o.value.insertMarkdown(e,t),exportMarkdown:()=>o.value.exportMarkdown(),move:(e,t)=>o.value.move(e,t),nest:(e,t)=>o.value.nest(e,t),unnest:e=>o.value.unnest(e),remove:e=>o.value.remove(e),update:(e,t,n)=>o.value.update(e,t,n),convert:(e,t,n,r)=>o.value.convert(e,t,n,r),transact:e=>o.value.transact(e),transactWithoutCapture:e=>o.value.transactWithoutCapture(e),getBlocksCount:()=>o.value.getBlocksCount(),getCurrentBlockIndex:()=>o.value.getCurrentBlockIndex(),getBlockByIndex:e=>o.value.getBlockByIndex(e),getBlockByElement:e=>o.value.getBlockByElement(e),getBlockData:e=>o.value.getBlockData(e),getBlockIndex:e=>o.value.getBlockIndex(e),composeBlockData:e=>o.value.composeBlockData(e),renderFromHTML:e=>o.value.renderFromHTML(e),insertOutputData:(e,t)=>o.value.insertOutputData(e,t),splitBlock:(e,t,n,r,i)=>o.value.splitBlock(e,t,n,r,i),insertInsideParent:(e,t,n)=>o.value.insertInsideParent(e,t,n),render:e=>o.value.render(e),clear:()=>o.value.clear(),isSyncingFromYjs:()=>o.value.isSyncingFromYjs()}}function D(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 O=(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)}}}),k=(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)(O,null,{default:()=>(0,e.h)(n.component,n.props)})])))}}),A=(0,e.defineComponent)({name:`BlokContent`,props:{editor:{type:Object,default:null}},setup(t){let n=(0,e.ref)(null),r=t=>{if(n.value===null||t===null)return;let r=a((0,e.toRaw)(t));r!==void 0&&n.value.appendChild(r)},i=t=>{var n;t!==null&&((n=a((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:x((0,e.toRaw)(r));return(0,e.h)(`div`,{ref:n},i===void 0?[]:[(0,e.h)(k,{registry:i})])}}}),j=`autofocus.defaultBlock.dataModel.placeholder.sanitizer.hideToolbar.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`.split(`.`),M=(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},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},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 a=(0,e.getCurrentInstance)(),o=e=>{let t=a==null?void 0:a.vnode.props;return t!=null&&e in t},s=()=>{let e={};for(let n of j){let r=t[n];r!==void 0&&(e[n]=r)}return o(`onChange`)&&(e.onChange=(e,t)=>{n(`change`,{api:e,event:t})}),(o(`onSave`)||o(`onUpdate:data`))&&(e.onSave=e=>{n(`update:data`,e),n(`save`,e)}),o(`onAfterRender`)&&(e.onAfterRender=e=>{n(`after-render`,e)}),o(`onThemeChange`)&&(e.onThemeChange=e=>{n(`theme-change`,e)}),e},c=w(()=>s(),()=>t.recreateKey);(0,e.watch)(c,(e,t,r)=>{if(e===null)return;let i=[];if(o(`onBlocksRendered`)){let t=e=>n(`blocks-rendered`,e);e.on(`blocks:rendered`,t),i.push([`blocks:rendered`,t])}if(o(`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 l={last:null};return(0,e.watch)(c,e=>{e!==null&&e!==l.last&&(l.last=e,n(`ready`,e))}),r({instance:(0,e.computed)(()=>c.value),save:()=>{var e;return(e=c.value)==null?void 0:e.save()},focus:e=>{var t;(t=c.value)==null||t.focus(e)},render:e=>{var t;return(t=c.value)==null?void 0:t.render(e)}}),()=>(0,e.h)(A,f({editor:c.value},i))}});function N(t){var r;let i=(0,e.defineComponent)({name:`VueBlock(${t.type})`,props:{ctx:{type:Object,required:!0}},setup(e){return t.setup(e.ctx)}});return r=class{static get toolbox(){return t.toolbox}static get isReadOnlySupported(){return!0}constructor(r){var i,a;this.hostEl=null,this.pendingDispatch=!1,this.commit=e=>{let r=(0,n.fillDefaults)(t.propSchema,f(f({},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 o=(i=r.config)==null?{}:i;this.registry=o[_];let s=r.api;this.pointerDrag=()=>{var e;return(s==null||(e=s.blocks)==null?void 0:e.isPointerDragActive)===!0},this.mirror=(0,n.fillDefaults)(t.propSchema,(0,e.toRaw)((a=r.data)==null?{}:a)),this.lastRendered=this.mirror,this.dataRef=(0,e.shallowRef)(this.mirror),this.readOnlyRef=(0,e.shallowRef)(r.readOnly);let c=this.blockApi;this.childrenComponent=(0,e.defineComponent)({name:`VueBlockChildren(${t.type})`,setup(){let t=(0,e.ref)(null),r=()=>{t.value!==null&&(0,n.mountChildBlocks)(t.value,c.getChildren())};return(0,e.onMounted)(r),(0,e.onUpdated)(r),()=>(0,e.h)(`div`,{ref:t,[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,readOnly:this.readOnlyRef,BlockChildren:this.childrenComponent};return(e=this.registry)==null||e.register(this.blockApi.id,{hostEl:t,component:i,props:{ctx:n}}),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}moved(){var e;(e=t.onMoved)==null||e.call(t,this.blockApi)}removed(){var e,n;(e=this.registry)==null||e.unregister(this.blockApi.id),(n=t.onRemoved)==null||n.call(t,this.blockApi)}destroy(){var e;(e=this.registry)==null||e.unregister(this.blockApi.id)}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}exports.BLOK_DEFAULT_CONFIG=p,exports.BlokContent=A,exports.BlokEditor=M,exports.createVueBlock=N,exports.provideBlok=m,exports.useBlocks=E,exports.useBlok=w,exports.useBlokDefaults=h,exports.useBlokReady=D;
package/dist/index.mjs CHANGED
@@ -1,49 +1,49 @@
1
1
  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";
2
2
  import { Blok as x } from "@bloklabs/core";
3
- import { DATA_ATTR as S, EMPTY_API as C, createBlocksApiForEditor as w, deepEqual as T, fillDefaults as E, mountChildBlocks as D, normalizeReadOnlyConfig as O } from "@bloklabs/core/adapters";
3
+ import { DATA_ATTR as ee, EMPTY_API as S, createBlocksApiForEditor as C, deepEqual as w, fillDefaults as T, mountChildBlocks as E, normalizeReadOnlyConfig as D, toRenderableData as O } from "@bloklabs/core/adapters";
4
4
  //#region src/holder-map.ts
5
5
  var k = /* @__PURE__ */ new WeakMap();
6
- function A(e, t) {
6
+ function te(e, t) {
7
7
  k.set(e, t);
8
8
  }
9
- function j(e) {
9
+ function A(e) {
10
10
  return k.get(e);
11
11
  }
12
- function M(e) {
12
+ function j(e) {
13
13
  k.delete(e);
14
14
  }
15
15
  //#endregion
16
16
  //#region \0@oxc-project+runtime@0.139.0/helpers/esm/typeof.js
17
- function N(e) {
17
+ function M(e) {
18
18
  "@babel/helpers - typeof";
19
- return N = typeof Symbol == "function" && typeof Symbol.iterator == "symbol" ? function(e) {
19
+ return M = typeof Symbol == "function" && typeof Symbol.iterator == "symbol" ? function(e) {
20
20
  return typeof e;
21
21
  } : function(e) {
22
22
  return e && typeof Symbol == "function" && e.constructor === Symbol && e !== Symbol.prototype ? "symbol" : typeof e;
23
- }, N(e);
23
+ }, M(e);
24
24
  }
25
25
  //#endregion
26
26
  //#region \0@oxc-project+runtime@0.139.0/helpers/esm/toPrimitive.js
27
- function P(e, t) {
28
- if (N(e) != "object" || !e) return e;
27
+ function N(e, t) {
28
+ if (M(e) != "object" || !e) return e;
29
29
  var n = e[Symbol.toPrimitive];
30
30
  if (n !== void 0) {
31
31
  var r = n.call(e, t || "default");
32
- if (N(r) != "object") return r;
32
+ if (M(r) != "object") return r;
33
33
  throw TypeError("@@toPrimitive must return a primitive value.");
34
34
  }
35
35
  return (t === "string" ? String : Number)(e);
36
36
  }
37
37
  //#endregion
38
38
  //#region \0@oxc-project+runtime@0.139.0/helpers/esm/toPropertyKey.js
39
- function F(e) {
40
- var t = P(e, "string");
41
- return N(t) == "symbol" ? t : t + "";
39
+ function P(e) {
40
+ var t = N(e, "string");
41
+ return M(t) == "symbol" ? t : t + "";
42
42
  }
43
43
  //#endregion
44
44
  //#region \0@oxc-project+runtime@0.139.0/helpers/esm/defineProperty.js
45
- function I(e, t, n) {
46
- return (t = F(t)) in e ? Object.defineProperty(e, t, {
45
+ function F(e, t, n) {
46
+ return (t = P(t)) in e ? Object.defineProperty(e, t, {
47
47
  value: n,
48
48
  enumerable: !0,
49
49
  configurable: !0,
@@ -52,7 +52,7 @@ function I(e, t, n) {
52
52
  }
53
53
  //#endregion
54
54
  //#region \0@oxc-project+runtime@0.139.0/helpers/esm/objectSpread2.js
55
- function L(e, t) {
55
+ function I(e, t) {
56
56
  var n = Object.keys(e);
57
57
  if (Object.getOwnPropertySymbols) {
58
58
  var r = Object.getOwnPropertySymbols(e);
@@ -62,12 +62,12 @@ function L(e, t) {
62
62
  }
63
63
  return n;
64
64
  }
65
- function R(e) {
65
+ function L(e) {
66
66
  for (var t = 1; t < arguments.length; t++) {
67
67
  var n = arguments[t] == null ? {} : arguments[t];
68
- t % 2 ? L(Object(n), !0).forEach(function(t) {
69
- I(e, t, n[t]);
70
- }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(n)) : L(Object(n)).forEach(function(t) {
68
+ t % 2 ? I(Object(n), !0).forEach(function(t) {
69
+ F(e, t, n[t]);
70
+ }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(n)) : I(Object(n)).forEach(function(t) {
71
71
  Object.defineProperty(e, t, Object.getOwnPropertyDescriptor(n, t));
72
72
  });
73
73
  }
@@ -75,25 +75,25 @@ function R(e) {
75
75
  }
76
76
  //#endregion
77
77
  //#region src/provide-blok.ts
78
- var z = Symbol("BLOK_DEFAULT_CONFIG");
79
- function B(e) {
80
- m(z, e);
78
+ var R = Symbol("BLOK_DEFAULT_CONFIG");
79
+ function z(e) {
80
+ m(R, e);
81
81
  }
82
- function V() {
83
- return o(z, {});
82
+ function B() {
83
+ return o(R, {});
84
84
  }
85
- function H(e, t) {
85
+ function V(e, t) {
86
86
  if (Object.keys(e).length === 0) return t;
87
- let n = R({}, e);
87
+ let n = L({}, e);
88
88
  for (let e of Object.keys(t)) {
89
89
  let r = t[e];
90
90
  r !== void 0 && (n[e] = r);
91
91
  }
92
- return (e.tools !== void 0 || t.tools !== void 0) && (n.tools = R(R({}, e.tools), t.tools)), n;
92
+ return (e.tools !== void 0 || t.tools !== void 0) && (n.tools = L(L({}, e.tools), t.tools)), n;
93
93
  }
94
94
  //#endregion
95
95
  //#region src/block-portal-registry.ts
96
- var U = "__blokPortalRegistry", W = () => {
96
+ var H = "__blokPortalRegistry", U = () => {
97
97
  let e = h(/* @__PURE__ */ new Map());
98
98
  return {
99
99
  entries: e,
@@ -108,19 +108,19 @@ var U = "__blokPortalRegistry", W = () => {
108
108
  r !== void 0 && Object.assign(r.props, n);
109
109
  }
110
110
  };
111
- }, G = /* @__PURE__ */ new WeakMap();
112
- function K(e, t) {
113
- G.set(e, t);
111
+ }, W = /* @__PURE__ */ new WeakMap();
112
+ function G(e, t) {
113
+ W.set(e, t);
114
114
  }
115
- function q(e) {
116
- return G.get(e);
115
+ function K(e) {
116
+ return W.get(e);
117
117
  }
118
- function J(e) {
119
- G.delete(e);
118
+ function q(e) {
119
+ W.delete(e);
120
120
  }
121
121
  //#endregion
122
122
  //#region src/useBlok.ts
123
- var Y = (e, t) => {
123
+ var J = (e, t) => {
124
124
  if (typeof e != "object" || !e) return e;
125
125
  let n = {};
126
126
  for (let [i, a] of Object.entries(e)) {
@@ -130,24 +130,24 @@ var Y = (e, t) => {
130
130
  n[i] = a;
131
131
  continue;
132
132
  }
133
- let o = typeof a == "function" ? { class: a } : R({}, a);
134
- o.config = R(R({}, (r = o.config) == null ? {} : r), {}, { [U]: t }), n[i] = o;
133
+ let o = typeof a == "function" ? { class: a } : L({}, a);
134
+ o.config = L(L({}, (r = o.config) == null ? {} : r), {}, { [H]: t }), n[i] = o;
135
135
  }
136
136
  return n;
137
137
  };
138
- function X(e, t) {
139
- let n = _(null), r = o(z, {}), i = () => H(r, y(e)), a = {
138
+ function Y(e, t) {
139
+ let n = _(null), r = o(R, {}), i = () => V(r, y(e)), a = {
140
140
  current: null,
141
141
  holder: null,
142
142
  lastRenderedData: i().data,
143
143
  seededEditor: null,
144
144
  renderChain: Promise.resolve()
145
145
  }, s = () => {
146
- let t = R({}, H(v(r), v(y(e))));
146
+ let t = L({}, V(v(r), v(y(e))));
147
147
  return delete t.holder, t.data !== void 0 && (t.data = v(t.data)), t;
148
148
  }, c = () => {
149
149
  if (a.current !== null) {
150
- M(a.current), J(a.current);
150
+ j(a.current), q(a.current);
151
151
  try {
152
152
  a.current.destroy();
153
153
  } catch (e) {}
@@ -156,13 +156,13 @@ function X(e, t) {
156
156
  }, u = () => {
157
157
  let e = document.createElement("div");
158
158
  a.holder = e;
159
- let t = s(), r = W();
160
- t.tools !== void 0 && (t.tools = Y(t.tools, r)), typeof t.onSave == "function" && (t.onSave = (...e) => {
159
+ let t = s(), r = U();
160
+ t.tools !== void 0 && (t.tools = J(t.tools, r)), typeof t.onSave == "function" && (t.onSave = (...e) => {
161
161
  var t, n;
162
162
  a.lastRenderedData = e[0], (t = (n = i()).onSave) == null || t.call(n, ...e);
163
163
  });
164
- let o = new x(R(R({}, t), {}, { holder: e }));
165
- a.current = o, A(o, e), K(o, r), o.isReady.then(() => {
164
+ let o = new x(L(L({}, t), {}, { holder: e }));
165
+ a.current = o, te(o, e), G(o, r), o.isReady.then(() => {
166
166
  a.current === o && (n.value = o);
167
167
  }).catch(() => {
168
168
  a.current === o && c();
@@ -170,8 +170,8 @@ function X(e, t) {
170
170
  };
171
171
  b([
172
172
  n,
173
- () => O(i().readOnly).enabled,
174
- () => O(i().readOnly).hideControls,
173
+ () => D(i().readOnly).enabled,
174
+ () => D(i().readOnly).hideControls,
175
175
  () => typeof i().readOnly == "object"
176
176
  ], ([e, t, n, r]) => {
177
177
  e && (r ? e.readOnly.set(t, { hideControls: n }) : e.readOnly.set(t));
@@ -189,17 +189,17 @@ function X(e, t) {
189
189
  var e;
190
190
  return (e = i().style) == null ? void 0 : e.tokens;
191
191
  }], ([e, t]) => {
192
- !e || t === void 0 || T(t, f.value) || (f.value = R({}, t), e.tokens.set(t));
192
+ !e || t === void 0 || w(t, f.value) || (f.value = L({}, t), e.tokens.set(t));
193
193
  }, {
194
194
  immediate: !0,
195
195
  deep: !0
196
196
  });
197
197
  let p = { value: i().i18n };
198
198
  b([n, () => i().i18n], ([e, t]) => {
199
- if (!e || t === void 0 || T(t, p.value)) return;
200
- p.value = R({}, t);
199
+ if (!e || t === void 0 || w(t, p.value)) return;
200
+ p.value = L({}, t);
201
201
  let { locale: n, messages: r, direction: i } = t;
202
- e.i18n.update(R(R(R({}, n === void 0 ? {} : { locale: n }), r === void 0 ? {} : { messages: r }), i === void 0 ? {} : { direction: i }));
202
+ e.i18n.update(L(L(L({}, n === void 0 ? {} : { locale: n }), r === void 0 ? {} : { messages: r }), i === void 0 ? {} : { direction: i }));
203
203
  }, {
204
204
  immediate: !0,
205
205
  deep: !0
@@ -209,7 +209,7 @@ function X(e, t) {
209
209
  value: void 0
210
210
  };
211
211
  return b([n, () => i().inlineToolbar], ([e, t]) => {
212
- if (!e || t === void 0 || m.editor === e && T(t, m.value)) return;
212
+ if (!e || t === void 0 || m.editor === e && w(t, m.value)) return;
213
213
  let n = Array.isArray(t) ? [...t] : t;
214
214
  m.editor = e, m.value = n, e.tools.setInlineToolbar(n);
215
215
  }, {
@@ -223,7 +223,7 @@ function X(e, t) {
223
223
  a.seededEditor = e, a.lastRenderedData = t;
224
224
  return;
225
225
  }
226
- T(t, a.lastRenderedData) || (a.lastRenderedData = t, a.renderChain = a.renderChain.catch(() => void 0).then(() => e.render(v(t))));
226
+ w(t, a.lastRenderedData) || (a.lastRenderedData = t, a.renderChain = a.renderChain.catch(() => void 0).then(() => e.render(O(v(t)))));
227
227
  }
228
228
  }, { immediate: !0 }), t !== void 0 && b(() => y(t), () => {
229
229
  c(), u();
@@ -231,28 +231,28 @@ function X(e, t) {
231
231
  }
232
232
  //#endregion
233
233
  //#region src/useBlocks.ts
234
- var Z = "block changed";
235
- function Q(e) {
234
+ var X = "block changed";
235
+ function Z(e) {
236
236
  let t = _(0), n = () => {
237
237
  let t = y(e);
238
238
  return t === null ? null : v(t);
239
239
  }, r = () => {
240
240
  t.value;
241
- }, i = _(C), a = {
241
+ }, i = _(S), a = {
242
242
  editor: null,
243
243
  handler: null
244
244
  }, o = () => {
245
- a.editor !== null && a.handler !== null && a.editor.off(Z, a.handler), a.editor = null, a.handler = null;
245
+ a.editor !== null && a.handler !== null && a.editor.off(X, a.handler), a.editor = null, a.handler = null;
246
246
  };
247
247
  return b(() => n(), (e) => {
248
248
  if (o(), t.value += 1, e === null) {
249
- i.value = C;
249
+ i.value = S;
250
250
  return;
251
251
  }
252
252
  let n = () => {
253
253
  t.value += 1;
254
254
  };
255
- e.on(Z, n), a.editor = e, a.handler = n, i.value = w(e, r);
255
+ e.on(X, n), a.editor = e, a.handler = n, i.value = C(e, r);
256
256
  }, { immediate: !0 }), f(o), {
257
257
  getById: (e) => i.value.getById(e),
258
258
  getChildren: (e) => i.value.getChildren(e),
@@ -287,7 +287,7 @@ function Q(e) {
287
287
  }
288
288
  //#endregion
289
289
  //#region src/useBlokReady.ts
290
- function ee(e = {}) {
290
+ function ne(e = {}) {
291
291
  let { within: t, settleOn: n } = e, r = _(!1), i = () => {
292
292
  var e;
293
293
  let i = t === void 0 || (e = y(t)) == null ? null : e;
@@ -300,7 +300,7 @@ function ee(e = {}) {
300
300
  }
301
301
  //#endregion
302
302
  //#region src/BlockPortalHost.ts
303
- var te = r({
303
+ var re = r({
304
304
  name: "BlockErrorBoundary",
305
305
  setup(e, { slots: t }) {
306
306
  return u(() => !1), () => {
@@ -308,7 +308,7 @@ var te = r({
308
308
  return (e = t.default) == null ? void 0 : e.call(t);
309
309
  };
310
310
  }
311
- }), ne = r({
311
+ }), Q = r({
312
312
  name: "BlockPortalHost",
313
313
  props: { registry: {
314
314
  type: Object,
@@ -318,7 +318,7 @@ var te = r({
318
318
  return () => a(e, Array.from(n.registry.entries.entries()).map(([e, n]) => a(t, {
319
319
  key: e,
320
320
  to: n.hostEl
321
- }, [a(te, null, { default: () => a(n.component, n.props) })])));
321
+ }, [a(re, null, { default: () => a(n.component, n.props) })])));
322
322
  }
323
323
  }), $ = r({
324
324
  name: "BlokContent",
@@ -329,11 +329,11 @@ var te = r({
329
329
  setup(e) {
330
330
  let t = g(null), n = (e) => {
331
331
  if (t.value === null || e === null) return;
332
- let n = j(v(e));
332
+ let n = A(v(e));
333
333
  n !== void 0 && t.value.appendChild(n);
334
334
  }, r = (e) => {
335
335
  var t;
336
- e !== null && ((t = j(v(e))) == null || t.remove());
336
+ e !== null && ((t = A(v(e))) == null || t.remove());
337
337
  };
338
338
  return d(() => {
339
339
  n(e.editor);
@@ -342,11 +342,11 @@ var te = r({
342
342
  }), l(() => {
343
343
  r(e.editor);
344
344
  }), () => {
345
- let n = e.editor, r = n === null ? void 0 : q(v(n));
346
- return a("div", { ref: t }, r === void 0 ? [] : [a(ne, { registry: r })]);
345
+ let n = e.editor, r = n === null ? void 0 : K(v(n));
346
+ return a("div", { ref: t }, r === void 0 ? [] : [a(Q, { registry: r })]);
347
347
  };
348
348
  }
349
- }), re = /* @__PURE__ */ "autofocus.defaultBlock.dataModel.placeholder.sanitizer.hideToolbar.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.onError".split("."), ie = r({
349
+ }), ie = /* @__PURE__ */ "autofocus.defaultBlock.dataModel.placeholder.sanitizer.hideToolbar.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".split("."), ae = r({
350
350
  name: "BlokEditor",
351
351
  inheritAttrs: !1,
352
352
  props: {
@@ -474,6 +474,10 @@ var te = r({
474
474
  type: Function,
475
475
  default: void 0
476
476
  },
477
+ onSubmit: {
478
+ type: Function,
479
+ default: void 0
480
+ },
477
481
  onError: {
478
482
  type: Function,
479
483
  default: void 0
@@ -496,7 +500,7 @@ var te = r({
496
500
  return t != null && e in t;
497
501
  }, l = () => {
498
502
  let n = {};
499
- for (let t of re) {
503
+ for (let t of ie) {
500
504
  let r = e[t];
501
505
  r !== void 0 && (n[t] = r);
502
506
  }
@@ -512,7 +516,7 @@ var te = r({
512
516
  }), c("onThemeChange") && (n.onThemeChange = (e) => {
513
517
  t("theme-change", e);
514
518
  }), n;
515
- }, u = X(() => l(), () => e.recreateKey);
519
+ }, u = Y(() => l(), () => e.recreateKey);
516
520
  b(u, (e, n, r) => {
517
521
  if (e === null) return;
518
522
  let i = [];
@@ -545,12 +549,12 @@ var te = r({
545
549
  var t;
546
550
  return (t = u.value) == null ? void 0 : t.render(e);
547
551
  }
548
- }), () => a($, R({ editor: u.value }, o));
552
+ }), () => a($, L({ editor: u.value }, o));
549
553
  }
550
554
  });
551
555
  //#endregion
552
556
  //#region src/createVueBlock.ts
553
- function ae(e) {
557
+ function oe(e) {
554
558
  var t;
555
559
  let n = r({
556
560
  name: `VueBlock(${e.type})`,
@@ -572,26 +576,26 @@ function ae(e) {
572
576
  constructor(t) {
573
577
  var n, i;
574
578
  this.hostEl = null, this.pendingDispatch = !1, this.commit = (t) => {
575
- let n = E(e.propSchema, R(R({}, this.mirror), t));
576
- T(n, this.mirror) || (this.mirror = n, this.lastRendered = n, this.dataRef.value = n, this.flushDispatch());
579
+ let n = T(e.propSchema, L(L({}, this.mirror), t));
580
+ w(n, this.mirror) || (this.mirror = n, this.lastRendered = n, this.dataRef.value = n, this.flushDispatch());
577
581
  }, this.blockApi = t.block;
578
582
  let o = (n = t.config) == null ? {} : n;
579
- this.registry = o[U];
583
+ this.registry = o[H];
580
584
  let s = t.api;
581
585
  this.pointerDrag = () => {
582
586
  var e;
583
587
  return (s == null || (e = s.blocks) == null ? void 0 : e.isPointerDragActive) === !0;
584
- }, this.mirror = E(e.propSchema, v((i = t.data) == null ? {} : i)), this.lastRendered = this.mirror, this.dataRef = _(this.mirror), this.readOnlyRef = _(t.readOnly);
588
+ }, this.mirror = T(e.propSchema, v((i = t.data) == null ? {} : i)), this.lastRendered = this.mirror, this.dataRef = _(this.mirror), this.readOnlyRef = _(t.readOnly);
585
589
  let c = this.blockApi;
586
590
  this.childrenComponent = r({
587
591
  name: `VueBlockChildren(${e.type})`,
588
592
  setup() {
589
593
  let e = g(null), t = () => {
590
- e.value !== null && D(e.value, c.getChildren());
594
+ e.value !== null && E(e.value, c.getChildren());
591
595
  };
592
596
  return d(t), p(t), () => a("div", {
593
597
  ref: e,
594
- [S.nestedBlocks]: ""
598
+ [ee.nestedBlocks]: ""
595
599
  });
596
600
  }
597
601
  });
@@ -622,8 +626,8 @@ function ae(e) {
622
626
  }
623
627
  async setData(t) {
624
628
  var n = this;
625
- let r = E(e.propSchema, v(t == null ? {} : t));
626
- return T(r, n.lastRendered) ? !0 : (n.mirror = r, n.lastRendered = r, n.dataRef.value = r, await c(), !0);
629
+ let r = T(e.propSchema, v(t == null ? {} : t));
630
+ return w(r, n.lastRendered) ? !0 : (n.mirror = r, n.lastRendered = r, n.dataRef.value = r, await c(), !0);
627
631
  }
628
632
  setReadOnly(e) {
629
633
  this.readOnlyRef.value = e;
@@ -659,4 +663,4 @@ function ae(e) {
659
663
  }, t.__isBlokVueBlock = !0, t;
660
664
  }
661
665
  //#endregion
662
- export { z as BLOK_DEFAULT_CONFIG, $ as BlokContent, ie as BlokEditor, ae as createVueBlock, B as provideBlok, Q as useBlocks, X as useBlok, V as useBlokDefaults, ee as useBlokReady };
666
+ export { R as BLOK_DEFAULT_CONFIG, $ as BlokContent, ae as BlokEditor, oe as createVueBlock, z as provideBlok, Z as useBlocks, Y as useBlok, B as useBlokDefaults, ne as useBlokReady };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bloklabs/vue",
3
- "version": "1.4.1",
3
+ "version": "1.4.3",
4
4
  "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.",
5
5
  "license": "Apache-2.0",
6
6
  "author": "JackUait",
@@ -54,7 +54,7 @@
54
54
  "build": "yarn run -T vite build --mode production"
55
55
  },
56
56
  "peerDependencies": {
57
- "@bloklabs/core": "^1.4.1",
57
+ "@bloklabs/core": "^1.4.3",
58
58
  "vue": "^3.5.0"
59
59
  }
60
60
  }
package/src/BlokEditor.ts CHANGED
@@ -66,6 +66,9 @@ export const BlokEditor = defineComponent({
66
66
  // Return-valued hook (the boolean is the "handled" signal), so it is a
67
67
  // declared prop copied into the config — not an emit-mapped callback.
68
68
  onEnter: { type: Function as PropType<BlokConfig['onEnter']>, default: undefined },
69
+ // Fire-and-forget submit hook (Enter-to-send) — a declared prop copied into
70
+ // config, delivering the serialized document.
71
+ onSubmit: { type: Function as PropType<BlokConfig['onSubmit']>, default: undefined },
69
72
  // Fire-and-forget error channel — a plain declared prop copied into config.
70
73
  onError: { type: Function as PropType<BlokConfig['onError']>, default: undefined },
71
74
  /** Changing this prop's identity destroys and recreates the editor. */
@@ -45,6 +45,7 @@ export const BLOK_EDITOR_CONFIG_KEYS = [
45
45
  'onBeforeRender',
46
46
  'onBeforePaste',
47
47
  'onEnter',
48
+ 'onSubmit',
48
49
  'onError',
49
50
  ] as const satisfies readonly (keyof UseBlokConfig)[];
50
51
 
package/src/useBlok.ts CHANGED
@@ -11,7 +11,7 @@ import {
11
11
  } from 'vue';
12
12
  import { Blok as BlokRuntime } from '@bloklabs/core';
13
13
  import { setHolder, removeHolder } from './holder-map';
14
- import { deepEqual , normalizeReadOnlyConfig } from '@bloklabs/core/adapters';
14
+ import { deepEqual , normalizeReadOnlyConfig, toRenderableData } from '@bloklabs/core/adapters';
15
15
  import { BLOK_DEFAULT_CONFIG, mergeBlokDefaults } from './provide-blok';
16
16
  import {
17
17
  createBlockPortalRegistry,
@@ -101,7 +101,7 @@ export function useBlok(
101
101
  const state: {
102
102
  current: Blok | null;
103
103
  holder: HTMLDivElement | null;
104
- lastRenderedData: OutputData | LooseOutputData | undefined;
104
+ lastRenderedData: OutputData | LooseOutputData | null | undefined;
105
105
  seededEditor: Blok | null;
106
106
  renderChain: Promise<void>;
107
107
  } = {
@@ -376,7 +376,12 @@ export function useBlok(
376
376
  }
377
377
 
378
378
  state.lastRenderedData = data;
379
- state.renderChain = state.renderChain.catch(() => undefined).then(() => ed.render(toRaw(data)));
379
+ // `data` may be null (a controlled "clear to empty"); render() throws on
380
+ // null, so normalize null → { blocks: [] } at the boundary. toRaw(null)
381
+ // stays null, so the helper still sees it.
382
+ state.renderChain = state.renderChain
383
+ .catch(() => undefined)
384
+ .then(() => ed.render(toRenderableData(toRaw(data))));
380
385
  },
381
386
  { immediate: true }
382
387
  );