@bloklabs/vue 1.4.2 → 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 +1 -1
- package/dist/index.mjs +87 -83
- package/package.json +2 -2
- package/src/BlokEditor.ts +3 -0
- package/src/config-keys.ts +1 -0
- package/src/useBlok.ts +8 -3
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
|
|
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
|
|
6
|
+
function te(e, t) {
|
|
7
7
|
k.set(e, t);
|
|
8
8
|
}
|
|
9
|
-
function
|
|
9
|
+
function A(e) {
|
|
10
10
|
return k.get(e);
|
|
11
11
|
}
|
|
12
|
-
function
|
|
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
|
|
17
|
+
function M(e) {
|
|
18
18
|
"@babel/helpers - typeof";
|
|
19
|
-
return
|
|
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
|
-
},
|
|
23
|
+
}, M(e);
|
|
24
24
|
}
|
|
25
25
|
//#endregion
|
|
26
26
|
//#region \0@oxc-project+runtime@0.139.0/helpers/esm/toPrimitive.js
|
|
27
|
-
function
|
|
28
|
-
if (
|
|
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 (
|
|
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
|
|
40
|
-
var t =
|
|
41
|
-
return
|
|
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
|
|
46
|
-
return (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
|
|
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
|
|
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 ?
|
|
69
|
-
|
|
70
|
-
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(n)) :
|
|
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
|
|
79
|
-
function
|
|
80
|
-
m(
|
|
78
|
+
var R = Symbol("BLOK_DEFAULT_CONFIG");
|
|
79
|
+
function z(e) {
|
|
80
|
+
m(R, e);
|
|
81
81
|
}
|
|
82
|
-
function
|
|
83
|
-
return o(
|
|
82
|
+
function B() {
|
|
83
|
+
return o(R, {});
|
|
84
84
|
}
|
|
85
|
-
function
|
|
85
|
+
function V(e, t) {
|
|
86
86
|
if (Object.keys(e).length === 0) return t;
|
|
87
|
-
let n =
|
|
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 =
|
|
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
|
|
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
|
-
},
|
|
112
|
-
function
|
|
113
|
-
|
|
111
|
+
}, W = /* @__PURE__ */ new WeakMap();
|
|
112
|
+
function G(e, t) {
|
|
113
|
+
W.set(e, t);
|
|
114
114
|
}
|
|
115
|
-
function
|
|
116
|
-
return
|
|
115
|
+
function K(e) {
|
|
116
|
+
return W.get(e);
|
|
117
117
|
}
|
|
118
|
-
function
|
|
119
|
-
|
|
118
|
+
function q(e) {
|
|
119
|
+
W.delete(e);
|
|
120
120
|
}
|
|
121
121
|
//#endregion
|
|
122
122
|
//#region src/useBlok.ts
|
|
123
|
-
var
|
|
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 } :
|
|
134
|
-
o.config =
|
|
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
|
|
139
|
-
let n = _(null), r = o(
|
|
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 =
|
|
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
|
-
|
|
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 =
|
|
160
|
-
t.tools !== void 0 && (t.tools =
|
|
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(
|
|
165
|
-
a.current = o,
|
|
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
|
-
() =>
|
|
174
|
-
() =>
|
|
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 ||
|
|
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 ||
|
|
200
|
-
p.value =
|
|
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(
|
|
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 &&
|
|
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
|
-
|
|
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
|
|
235
|
-
function
|
|
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 = _(
|
|
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(
|
|
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 =
|
|
249
|
+
i.value = S;
|
|
250
250
|
return;
|
|
251
251
|
}
|
|
252
252
|
let n = () => {
|
|
253
253
|
t.value += 1;
|
|
254
254
|
};
|
|
255
|
-
e.on(
|
|
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
|
|
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
|
|
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
|
-
}),
|
|
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(
|
|
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 =
|
|
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 =
|
|
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 :
|
|
346
|
-
return a("div", { ref: t }, r === void 0 ? [] : [a(
|
|
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
|
-
}),
|
|
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
|
|
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 =
|
|
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($,
|
|
552
|
+
}), () => a($, L({ editor: u.value }, o));
|
|
549
553
|
}
|
|
550
554
|
});
|
|
551
555
|
//#endregion
|
|
552
556
|
//#region src/createVueBlock.ts
|
|
553
|
-
function
|
|
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 =
|
|
576
|
-
|
|
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[
|
|
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 =
|
|
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 &&
|
|
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
|
-
[
|
|
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 =
|
|
626
|
-
return
|
|
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 {
|
|
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.
|
|
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.
|
|
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. */
|
package/src/config-keys.ts
CHANGED
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
|
-
|
|
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
|
);
|