@bloklabs/vue 1.1.1

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 ADDED
@@ -0,0 +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()})};return(0,e.watch)([s,()=>(0,n.normalizeReadOnlyConfig)(l().readOnly).enabled],([e,t])=>{e&&e.readOnly.set(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}),(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()}}var D=(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)}}}),O=(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)(D,null,{default:()=>(0,e.h)(n.component,n.props)})])))}}),k=(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)(O,{registry:i})])}}}),A=`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`.split(`.`),j=(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,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},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 A){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)(k,f({editor:c.value},i))}});function M(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));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=k,exports.BlokEditor=j,exports.createVueBlock=M,exports.provideBlok=m,exports.useBlocks=E,exports.useBlok=w,exports.useBlokDefaults=h;
package/dist/index.mjs ADDED
@@ -0,0 +1,602 @@
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
+ 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";
4
+ //#region src/holder-map.ts
5
+ var k = /* @__PURE__ */ new WeakMap();
6
+ function A(e, t) {
7
+ k.set(e, t);
8
+ }
9
+ function j(e) {
10
+ return k.get(e);
11
+ }
12
+ function ee(e) {
13
+ k.delete(e);
14
+ }
15
+ //#endregion
16
+ //#region \0@oxc-project+runtime@0.126.0/helpers/typeof.js
17
+ function M(e) {
18
+ "@babel/helpers - typeof";
19
+ return M = typeof Symbol == "function" && typeof Symbol.iterator == "symbol" ? function(e) {
20
+ return typeof e;
21
+ } : function(e) {
22
+ return e && typeof Symbol == "function" && e.constructor === Symbol && e !== Symbol.prototype ? "symbol" : typeof e;
23
+ }, M(e);
24
+ }
25
+ //#endregion
26
+ //#region \0@oxc-project+runtime@0.126.0/helpers/toPrimitive.js
27
+ function N(e, t) {
28
+ if (M(e) != "object" || !e) return e;
29
+ var n = e[Symbol.toPrimitive];
30
+ if (n !== void 0) {
31
+ var r = n.call(e, t || "default");
32
+ if (M(r) != "object") return r;
33
+ throw TypeError("@@toPrimitive must return a primitive value.");
34
+ }
35
+ return (t === "string" ? String : Number)(e);
36
+ }
37
+ //#endregion
38
+ //#region \0@oxc-project+runtime@0.126.0/helpers/toPropertyKey.js
39
+ function P(e) {
40
+ var t = N(e, "string");
41
+ return M(t) == "symbol" ? t : t + "";
42
+ }
43
+ //#endregion
44
+ //#region \0@oxc-project+runtime@0.126.0/helpers/defineProperty.js
45
+ function F(e, t, n) {
46
+ return (t = P(t)) in e ? Object.defineProperty(e, t, {
47
+ value: n,
48
+ enumerable: !0,
49
+ configurable: !0,
50
+ writable: !0
51
+ }) : e[t] = n, e;
52
+ }
53
+ //#endregion
54
+ //#region \0@oxc-project+runtime@0.126.0/helpers/objectSpread2.js
55
+ function I(e, t) {
56
+ var n = Object.keys(e);
57
+ if (Object.getOwnPropertySymbols) {
58
+ var r = Object.getOwnPropertySymbols(e);
59
+ t && (r = r.filter(function(t) {
60
+ return Object.getOwnPropertyDescriptor(e, t).enumerable;
61
+ })), n.push.apply(n, r);
62
+ }
63
+ return n;
64
+ }
65
+ function L(e) {
66
+ for (var t = 1; t < arguments.length; t++) {
67
+ var n = arguments[t] == null ? {} : arguments[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
+ Object.defineProperty(e, t, Object.getOwnPropertyDescriptor(n, t));
72
+ });
73
+ }
74
+ return e;
75
+ }
76
+ //#endregion
77
+ //#region src/provide-blok.ts
78
+ var R = Symbol("BLOK_DEFAULT_CONFIG");
79
+ function z(e) {
80
+ m(R, e);
81
+ }
82
+ function B() {
83
+ return o(R, {});
84
+ }
85
+ function V(e, t) {
86
+ if (Object.keys(e).length === 0) return t;
87
+ let n = L({}, e);
88
+ for (let e of Object.keys(t)) {
89
+ let r = t[e];
90
+ r !== void 0 && (n[e] = r);
91
+ }
92
+ return (e.tools !== void 0 || t.tools !== void 0) && (n.tools = L(L({}, e.tools), t.tools)), n;
93
+ }
94
+ //#endregion
95
+ //#region src/block-portal-registry.ts
96
+ var H = "__blokPortalRegistry", U = () => {
97
+ let e = h(/* @__PURE__ */ new Map());
98
+ return {
99
+ entries: e,
100
+ register(t, n) {
101
+ e.set(t, s(n));
102
+ },
103
+ unregister(t) {
104
+ e.delete(t);
105
+ },
106
+ setProps(t, n) {
107
+ let r = e.get(t);
108
+ r !== void 0 && Object.assign(r.props, n);
109
+ }
110
+ };
111
+ }, W = /* @__PURE__ */ new WeakMap();
112
+ function G(e, t) {
113
+ W.set(e, t);
114
+ }
115
+ function K(e) {
116
+ return W.get(e);
117
+ }
118
+ function q(e) {
119
+ W.delete(e);
120
+ }
121
+ //#endregion
122
+ //#region src/useBlok.ts
123
+ var J = (e, t) => {
124
+ if (typeof e != "object" || !e) return e;
125
+ let n = {};
126
+ for (let [i, a] of Object.entries(e)) {
127
+ var r;
128
+ let e = typeof a == "function" ? a : a == null ? void 0 : a.class;
129
+ if (!(typeof e == "function" && e.__isBlokVueBlock === !0)) {
130
+ n[i] = a;
131
+ continue;
132
+ }
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
+ }
136
+ return n;
137
+ };
138
+ function Y(e, t) {
139
+ let n = _(null), r = o(R, {}), i = () => V(r, y(e)), a = {
140
+ current: null,
141
+ holder: null,
142
+ lastRenderedData: i().data,
143
+ seededEditor: null,
144
+ renderChain: Promise.resolve()
145
+ }, s = () => {
146
+ let t = L({}, V(v(r), v(y(e))));
147
+ return delete t.holder, t.data !== void 0 && (t.data = v(t.data)), t;
148
+ }, c = () => {
149
+ if (a.current !== null) {
150
+ ee(a.current), q(a.current);
151
+ try {
152
+ a.current.destroy();
153
+ } catch (e) {}
154
+ }
155
+ a.current = null, a.holder = null, n.value = null;
156
+ }, u = () => {
157
+ let e = document.createElement("div");
158
+ a.holder = 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
+ var t, n;
162
+ a.lastRenderedData = e[0], (t = (n = i()).onSave) == null || t.call(n, ...e);
163
+ });
164
+ let o = new x(L(L({}, t), {}, { holder: e }));
165
+ a.current = o, A(o, e), G(o, r), o.isReady.then(() => {
166
+ a.current === o && (n.value = o);
167
+ }).catch(() => {
168
+ a.current === o && c();
169
+ });
170
+ };
171
+ return b([n, () => O(i().readOnly).enabled], ([e, t]) => {
172
+ e && e.readOnly.set(t);
173
+ }, { immediate: !0 }), b([n, () => i().theme], ([e, t]) => {
174
+ e && t !== void 0 && e.theme.set(t);
175
+ }, { immediate: !0 }), b([n, () => i().width], ([e, t]) => {
176
+ e && t !== void 0 && e.width.set(t);
177
+ }, { immediate: !0 }), b([n, () => i().placeholder], ([e, t]) => {
178
+ e && t !== void 0 && e.placeholder.set(t);
179
+ }, { immediate: !0 }), b([n, () => i().autofocus], ([e, t]) => {
180
+ e && t && e.focus();
181
+ }, { immediate: !0 }), b([n, () => i().data], ([e, t]) => {
182
+ if (!(!e || t === void 0)) {
183
+ if (a.seededEditor !== e) {
184
+ a.seededEditor = e, a.lastRenderedData = t;
185
+ return;
186
+ }
187
+ T(t, a.lastRenderedData) || (a.lastRenderedData = t, a.renderChain = a.renderChain.catch(() => void 0).then(() => e.render(v(t))));
188
+ }
189
+ }, { immediate: !0 }), t !== void 0 && b(() => y(t), () => {
190
+ c(), u();
191
+ }), d(u), l(c), n;
192
+ }
193
+ //#endregion
194
+ //#region src/useBlocks.ts
195
+ var X = "block changed";
196
+ function Z(e) {
197
+ let t = _(0), n = () => {
198
+ let t = y(e);
199
+ return t === null ? null : v(t);
200
+ }, r = () => {
201
+ t.value;
202
+ }, i = _(C), a = {
203
+ editor: null,
204
+ handler: null
205
+ }, o = () => {
206
+ a.editor !== null && a.handler !== null && a.editor.off(X, a.handler), a.editor = null, a.handler = null;
207
+ };
208
+ return b(() => n(), (e) => {
209
+ if (o(), t.value += 1, e === null) {
210
+ i.value = C;
211
+ return;
212
+ }
213
+ let n = () => {
214
+ t.value += 1;
215
+ };
216
+ e.on(X, n), a.editor = e, a.handler = n, i.value = w(e, r);
217
+ }, { immediate: !0 }), f(o), {
218
+ getById: (e) => i.value.getById(e),
219
+ getChildren: (e) => i.value.getChildren(e),
220
+ insert: (e) => i.value.insert(e),
221
+ insertMany: (e) => i.value.insertMany(e),
222
+ insertTree: (e) => i.value.insertTree(e),
223
+ insertMarkdown: (e, t) => i.value.insertMarkdown(e, t),
224
+ exportMarkdown: () => i.value.exportMarkdown(),
225
+ move: (e, t) => i.value.move(e, t),
226
+ nest: (e, t) => i.value.nest(e, t),
227
+ unnest: (e) => i.value.unnest(e),
228
+ remove: (e) => i.value.remove(e),
229
+ update: (e, t, n) => i.value.update(e, t, n),
230
+ convert: (e, t, n, r) => i.value.convert(e, t, n, r),
231
+ transact: (e) => i.value.transact(e),
232
+ transactWithoutCapture: (e) => i.value.transactWithoutCapture(e),
233
+ getBlocksCount: () => i.value.getBlocksCount(),
234
+ getCurrentBlockIndex: () => i.value.getCurrentBlockIndex(),
235
+ getBlockByIndex: (e) => i.value.getBlockByIndex(e),
236
+ getBlockByElement: (e) => i.value.getBlockByElement(e),
237
+ getBlockData: (e) => i.value.getBlockData(e),
238
+ getBlockIndex: (e) => i.value.getBlockIndex(e),
239
+ composeBlockData: (e) => i.value.composeBlockData(e),
240
+ renderFromHTML: (e) => i.value.renderFromHTML(e),
241
+ insertOutputData: (e, t) => i.value.insertOutputData(e, t),
242
+ splitBlock: (e, t, n, r, a) => i.value.splitBlock(e, t, n, r, a),
243
+ insertInsideParent: (e, t, n) => i.value.insertInsideParent(e, t, n),
244
+ render: (e) => i.value.render(e),
245
+ clear: () => i.value.clear(),
246
+ isSyncingFromYjs: () => i.value.isSyncingFromYjs()
247
+ };
248
+ }
249
+ //#endregion
250
+ //#region src/BlockPortalHost.ts
251
+ var Q = r({
252
+ name: "BlockErrorBoundary",
253
+ setup(e, { slots: t }) {
254
+ return u(() => !1), () => {
255
+ var e;
256
+ return (e = t.default) == null ? void 0 : e.call(t);
257
+ };
258
+ }
259
+ }), te = r({
260
+ name: "BlockPortalHost",
261
+ props: { registry: {
262
+ type: Object,
263
+ required: !0
264
+ } },
265
+ setup(n) {
266
+ return () => a(e, Array.from(n.registry.entries.entries()).map(([e, n]) => a(t, {
267
+ key: e,
268
+ to: n.hostEl
269
+ }, [a(Q, null, { default: () => a(n.component, n.props) })])));
270
+ }
271
+ }), $ = r({
272
+ name: "BlokContent",
273
+ props: { editor: {
274
+ type: Object,
275
+ default: null
276
+ } },
277
+ setup(e) {
278
+ let t = g(null), n = (e) => {
279
+ if (t.value === null || e === null) return;
280
+ let n = j(v(e));
281
+ n !== void 0 && t.value.appendChild(n);
282
+ }, r = (e) => {
283
+ var t;
284
+ e !== null && ((t = j(v(e))) == null || t.remove());
285
+ };
286
+ return d(() => {
287
+ n(e.editor);
288
+ }), b(() => e.editor, (e, t) => {
289
+ r(t == null ? null : t), n(e);
290
+ }), l(() => {
291
+ r(e.editor);
292
+ }), () => {
293
+ let n = e.editor, r = n === null ? void 0 : K(v(n));
294
+ return a("div", { ref: t }, r === void 0 ? [] : [a(te, { registry: r })]);
295
+ };
296
+ }
297
+ }), ne = /* @__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".split("."), re = r({
298
+ name: "BlokEditor",
299
+ inheritAttrs: !1,
300
+ props: {
301
+ autofocus: {
302
+ type: Boolean,
303
+ default: void 0
304
+ },
305
+ defaultBlock: {
306
+ type: String,
307
+ default: void 0
308
+ },
309
+ dataModel: {
310
+ type: String,
311
+ default: void 0
312
+ },
313
+ placeholder: {
314
+ type: [String, Boolean],
315
+ default: void 0
316
+ },
317
+ sanitizer: {
318
+ type: Object,
319
+ default: void 0
320
+ },
321
+ hideToolbar: {
322
+ type: Boolean,
323
+ default: void 0
324
+ },
325
+ maxHistoryLength: {
326
+ type: Number,
327
+ default: void 0
328
+ },
329
+ historyDebounceTime: {
330
+ type: Number,
331
+ default: void 0
332
+ },
333
+ newGroupDelay: {
334
+ type: Number,
335
+ default: void 0
336
+ },
337
+ globalUndoRedo: {
338
+ type: Boolean,
339
+ default: void 0
340
+ },
341
+ tools: {
342
+ type: Object,
343
+ default: void 0
344
+ },
345
+ data: {
346
+ type: Object,
347
+ default: void 0
348
+ },
349
+ minHeight: {
350
+ type: Number,
351
+ default: void 0
352
+ },
353
+ logLevel: {
354
+ type: String,
355
+ default: void 0
356
+ },
357
+ readOnly: {
358
+ type: Boolean,
359
+ default: void 0
360
+ },
361
+ i18n: {
362
+ type: Object,
363
+ default: void 0
364
+ },
365
+ link: {
366
+ type: Object,
367
+ default: void 0
368
+ },
369
+ linkPaste: {
370
+ type: Object,
371
+ default: void 0
372
+ },
373
+ inlineToolbar: {
374
+ type: [Array, Boolean],
375
+ default: void 0
376
+ },
377
+ tunes: {
378
+ type: Array,
379
+ default: void 0
380
+ },
381
+ style: {
382
+ type: Object,
383
+ default: void 0
384
+ },
385
+ theme: {
386
+ type: String,
387
+ default: void 0
388
+ },
389
+ scrollToBlock: {
390
+ type: Object,
391
+ default: void 0
392
+ },
393
+ user: {
394
+ type: Object,
395
+ default: void 0
396
+ },
397
+ resolveUser: {
398
+ type: Function,
399
+ default: void 0
400
+ },
401
+ notifierPosition: {
402
+ type: String,
403
+ default: void 0
404
+ },
405
+ notifier: {
406
+ type: Function,
407
+ default: void 0
408
+ },
409
+ width: {
410
+ type: String,
411
+ default: void 0
412
+ },
413
+ onBeforeRender: {
414
+ type: Function,
415
+ default: void 0
416
+ },
417
+ onBeforePaste: {
418
+ type: Function,
419
+ default: void 0
420
+ },
421
+ recreateKey: { type: null }
422
+ },
423
+ emits: {
424
+ ready: (e) => !0,
425
+ change: (e) => !0,
426
+ save: (e) => !0,
427
+ "update:data": (e) => !0,
428
+ "after-render": (e) => !0,
429
+ "theme-change": (e) => !0,
430
+ "blocks-rendered": (e) => !0,
431
+ "block-rendered": (e) => !0
432
+ },
433
+ setup(e, { emit: t, expose: r, attrs: o }) {
434
+ let s = i(), c = (e) => {
435
+ let t = s == null ? void 0 : s.vnode.props;
436
+ return t != null && e in t;
437
+ }, l = () => {
438
+ let n = {};
439
+ for (let t of ne) {
440
+ let r = e[t];
441
+ r !== void 0 && (n[t] = r);
442
+ }
443
+ return c("onChange") && (n.onChange = (e, n) => {
444
+ t("change", {
445
+ api: e,
446
+ event: n
447
+ });
448
+ }), (c("onSave") || c("onUpdate:data")) && (n.onSave = (e) => {
449
+ t("update:data", e), t("save", e);
450
+ }), c("onAfterRender") && (n.onAfterRender = (e) => {
451
+ t("after-render", e);
452
+ }), c("onThemeChange") && (n.onThemeChange = (e) => {
453
+ t("theme-change", e);
454
+ }), n;
455
+ }, u = Y(() => l(), () => e.recreateKey);
456
+ b(u, (e, n, r) => {
457
+ if (e === null) return;
458
+ let i = [];
459
+ if (c("onBlocksRendered")) {
460
+ let n = (e) => t("blocks-rendered", e);
461
+ e.on("blocks:rendered", n), i.push(["blocks:rendered", n]);
462
+ }
463
+ if (c("onBlockRendered")) {
464
+ let n = (e) => t("block-rendered", e);
465
+ e.on("block:rendered", n), i.push(["block:rendered", n]);
466
+ }
467
+ r(() => {
468
+ for (let [t, n] of i) e.off(t, n);
469
+ });
470
+ });
471
+ let d = { last: null };
472
+ return b(u, (e) => {
473
+ e !== null && e !== d.last && (d.last = e, t("ready", e));
474
+ }), r({
475
+ instance: n(() => u.value),
476
+ save: () => {
477
+ var e;
478
+ return (e = u.value) == null ? void 0 : e.save();
479
+ },
480
+ focus: (e) => {
481
+ var t;
482
+ (t = u.value) == null || t.focus(e);
483
+ },
484
+ render: (e) => {
485
+ var t;
486
+ return (t = u.value) == null ? void 0 : t.render(e);
487
+ }
488
+ }), () => a($, L({ editor: u.value }, o));
489
+ }
490
+ });
491
+ //#endregion
492
+ //#region src/createVueBlock.ts
493
+ function ie(e) {
494
+ var t;
495
+ let n = r({
496
+ name: `VueBlock(${e.type})`,
497
+ props: { ctx: {
498
+ type: Object,
499
+ required: !0
500
+ } },
501
+ setup(t) {
502
+ return e.setup(t.ctx);
503
+ }
504
+ });
505
+ return t = class {
506
+ static get toolbox() {
507
+ return e.toolbox;
508
+ }
509
+ static get isReadOnlySupported() {
510
+ return !0;
511
+ }
512
+ constructor(t) {
513
+ var n, i;
514
+ this.hostEl = null, this.pendingDispatch = !1, this.commit = (t) => {
515
+ let n = E(e.propSchema, L(L({}, this.mirror), t));
516
+ this.mirror = n, this.lastRendered = n, this.dataRef.value = n, this.flushDispatch();
517
+ }, this.blockApi = t.block;
518
+ let o = (n = t.config) == null ? {} : n;
519
+ this.registry = o[H];
520
+ let s = t.api;
521
+ this.pointerDrag = () => {
522
+ var e;
523
+ return (s == null || (e = s.blocks) == null ? void 0 : e.isPointerDragActive) === !0;
524
+ }, this.mirror = E(e.propSchema, v((i = t.data) == null ? {} : i)), this.lastRendered = this.mirror, this.dataRef = _(this.mirror), this.readOnlyRef = _(t.readOnly);
525
+ let c = this.blockApi;
526
+ this.childrenComponent = r({
527
+ name: `VueBlockChildren(${e.type})`,
528
+ setup() {
529
+ let e = g(null), t = () => {
530
+ e.value !== null && D(e.value, c.getChildren());
531
+ };
532
+ return d(t), p(t), () => a("div", {
533
+ ref: e,
534
+ [S.nestedBlocks]: ""
535
+ });
536
+ }
537
+ });
538
+ }
539
+ render() {
540
+ var e;
541
+ let t = document.createElement("div");
542
+ t.setAttribute("data-blok-mutation-free", "true"), this.hostEl = t;
543
+ let r = {
544
+ data: this.dataRef,
545
+ commit: this.commit,
546
+ block: this.blockApi,
547
+ readOnly: this.readOnlyRef,
548
+ BlockChildren: this.childrenComponent
549
+ };
550
+ return (e = this.registry) == null || e.register(this.blockApi.id, {
551
+ hostEl: t,
552
+ component: n,
553
+ props: { ctx: r }
554
+ }), t;
555
+ }
556
+ rendered() {
557
+ var t;
558
+ (t = e.onRendered) == null || t.call(e, this.blockApi);
559
+ }
560
+ save() {
561
+ return this.mirror;
562
+ }
563
+ async setData(t) {
564
+ var n = this;
565
+ let r = E(e.propSchema, v(t == null ? {} : t));
566
+ return T(r, n.lastRendered) ? !0 : (n.mirror = r, n.lastRendered = r, n.dataRef.value = r, await c(), !0);
567
+ }
568
+ setReadOnly(e) {
569
+ this.readOnlyRef.value = e;
570
+ }
571
+ moved() {
572
+ var t;
573
+ (t = e.onMoved) == null || t.call(e, this.blockApi);
574
+ }
575
+ removed() {
576
+ var t, n;
577
+ (t = this.registry) == null || t.unregister(this.blockApi.id), (n = e.onRemoved) == null || n.call(e, this.blockApi);
578
+ }
579
+ destroy() {
580
+ var e;
581
+ (e = this.registry) == null || e.unregister(this.blockApi.id);
582
+ }
583
+ flushDispatch() {
584
+ if (!this.pointerDrag()) {
585
+ this.pendingDispatch = !1, this.blockApi.dispatchChange();
586
+ return;
587
+ }
588
+ if (this.pendingDispatch) return;
589
+ this.pendingDispatch = !0;
590
+ let e = () => {
591
+ if (this.pointerDrag()) {
592
+ requestAnimationFrame(e);
593
+ return;
594
+ }
595
+ this.pendingDispatch = !1, this.blockApi.dispatchChange();
596
+ };
597
+ requestAnimationFrame(e);
598
+ }
599
+ }, t.__isBlokVueBlock = !0, t;
600
+ }
601
+ //#endregion
602
+ export { R as BLOK_DEFAULT_CONFIG, $ as BlokContent, re as BlokEditor, ie as createVueBlock, z as provideBlok, Z as useBlocks, Y as useBlok, B as useBlokDefaults };
package/package.json ADDED
@@ -0,0 +1,39 @@
1
+ {
2
+ "name": "@bloklabs/vue",
3
+ "version": "1.1.1",
4
+ "description": "Vue 3 bindings for the Blok editor",
5
+ "license": "Apache-2.0",
6
+ "author": "JackUait",
7
+ "repository": {
8
+ "type": "git",
9
+ "url": "git+https://github.com/JackUait/blok.git",
10
+ "directory": "packages/vue"
11
+ },
12
+ "type": "module",
13
+ "sideEffects": false,
14
+ "main": "./dist/index.cjs",
15
+ "module": "./dist/index.mjs",
16
+ "types": "./types/index.d.ts",
17
+ "exports": {
18
+ ".": {
19
+ "types": "./types/index.d.ts",
20
+ "import": "./dist/index.mjs",
21
+ "require": "./dist/index.cjs"
22
+ }
23
+ },
24
+ "files": [
25
+ "dist",
26
+ "types",
27
+ "src"
28
+ ],
29
+ "publishConfig": {
30
+ "access": "public"
31
+ },
32
+ "scripts": {
33
+ "build": "yarn run -T vite build --mode production"
34
+ },
35
+ "peerDependencies": {
36
+ "@bloklabs/core": "^1.1.1",
37
+ "vue": "^3.5.0"
38
+ }
39
+ }