@bloklabs/vue 1.16.1 → 2.0.0
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/README.md +20 -0
- package/dist/index.cjs +1 -1
- package/dist/index.mjs +146 -104
- package/package.json +3 -4
- package/types/index.d.ts +57 -3
- package/src/BlockPortalHost.ts +0 -46
- package/src/BlokContent.ts +0 -103
- package/src/BlokEditor.ts +0 -326
- package/src/block-portal-registry.ts +0 -93
- package/src/blocks-snapshot.ts +0 -17
- package/src/blok-instance.ts +0 -40
- package/src/config-keys.ts +0 -82
- package/src/content-baseline-map.ts +0 -38
- package/src/createVueBlock.ts +0 -740
- package/src/holder-map.ts +0 -19
- package/src/index.ts +0 -30
- package/src/provide-blok.ts +0 -65
- package/src/registry-map.ts +0 -21
- package/src/types.ts +0 -36
- package/src/useBlocks.ts +0 -182
- package/src/useBlok.ts +0 -686
- package/src/useBlokReady.ts +0 -70
package/dist/index.mjs
CHANGED
|
@@ -1,21 +1,20 @@
|
|
|
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 { BlockChildrenMounted as S, DATA_ATTR as C, EMPTY_API as w, applyChildDecoration as T, changeTouchesSubtree as
|
|
4
|
-
|
|
3
|
+
import { BlockChildrenMounted as S, DATA_ATTR as C, EMPTY_API as w, applyChildDecoration as T, changeTouchesSubtree as ee, createBlocksApiForEditor as te, createChildDecorationLedger as ne, createEmittedEchoWindow as E, deepEqual as D, describeFromPropSchema as O, equalsOutputData as k, fillDefaults as A, mountChildBlocks as re, normalizeReadOnlyConfig as j, toRenderableData as ie, withSlotlessDescendants as ae } from "@bloklabs/core/adapters";
|
|
4
|
+
// src/content-baseline-map.ts
|
|
5
5
|
var M = /* @__PURE__ */ new WeakMap();
|
|
6
|
-
function
|
|
6
|
+
function oe(e, t) {
|
|
7
7
|
M.set(e, t);
|
|
8
8
|
}
|
|
9
|
-
function
|
|
9
|
+
function se(e) {
|
|
10
10
|
return M.get(e);
|
|
11
11
|
}
|
|
12
|
-
function
|
|
12
|
+
function ce(e) {
|
|
13
13
|
M.delete(e);
|
|
14
14
|
}
|
|
15
|
-
|
|
16
|
-
//#region src/holder-map.ts
|
|
15
|
+
// src/holder-map.ts
|
|
17
16
|
var N = /* @__PURE__ */ new WeakMap();
|
|
18
|
-
function
|
|
17
|
+
function le(e, t) {
|
|
19
18
|
N.set(e, t);
|
|
20
19
|
}
|
|
21
20
|
function P(e) {
|
|
@@ -24,8 +23,7 @@ function P(e) {
|
|
|
24
23
|
function F(e) {
|
|
25
24
|
N.delete(e);
|
|
26
25
|
}
|
|
27
|
-
|
|
28
|
-
//#region \0@oxc-project+runtime@0.152.0/helpers/esm/typeof.js
|
|
26
|
+
// \0@oxc-project+runtime@0.155.0/helpers/esm/typeof.js
|
|
29
27
|
function I(e) {
|
|
30
28
|
"@babel/helpers - typeof";
|
|
31
29
|
return I = typeof Symbol == "function" && typeof Symbol.iterator == "symbol" ? function(e) {
|
|
@@ -34,8 +32,7 @@ function I(e) {
|
|
|
34
32
|
return e && typeof Symbol == "function" && e.constructor === Symbol && e !== Symbol.prototype ? "symbol" : typeof e;
|
|
35
33
|
}, I(e);
|
|
36
34
|
}
|
|
37
|
-
|
|
38
|
-
//#region \0@oxc-project+runtime@0.152.0/helpers/esm/toPrimitive.js
|
|
35
|
+
// \0@oxc-project+runtime@0.155.0/helpers/esm/toPrimitive.js
|
|
39
36
|
function L(e, t) {
|
|
40
37
|
if (I(e) != "object" || !e) return e;
|
|
41
38
|
var n = e[Symbol.toPrimitive];
|
|
@@ -46,14 +43,12 @@ function L(e, t) {
|
|
|
46
43
|
}
|
|
47
44
|
return (t === "string" ? String : Number)(e);
|
|
48
45
|
}
|
|
49
|
-
|
|
50
|
-
//#region \0@oxc-project+runtime@0.152.0/helpers/esm/toPropertyKey.js
|
|
46
|
+
// \0@oxc-project+runtime@0.155.0/helpers/esm/toPropertyKey.js
|
|
51
47
|
function R(e) {
|
|
52
48
|
var t = L(e, "string");
|
|
53
49
|
return I(t) == "symbol" ? t : t + "";
|
|
54
50
|
}
|
|
55
|
-
|
|
56
|
-
//#region \0@oxc-project+runtime@0.152.0/helpers/esm/defineProperty.js
|
|
51
|
+
// \0@oxc-project+runtime@0.155.0/helpers/esm/defineProperty.js
|
|
57
52
|
function z(e, t, n) {
|
|
58
53
|
return (t = R(t)) in e ? Object.defineProperty(e, t, {
|
|
59
54
|
value: n,
|
|
@@ -62,8 +57,7 @@ function z(e, t, n) {
|
|
|
62
57
|
writable: !0
|
|
63
58
|
}) : e[t] = n, e;
|
|
64
59
|
}
|
|
65
|
-
|
|
66
|
-
//#region \0@oxc-project+runtime@0.152.0/helpers/esm/objectSpread2.js
|
|
60
|
+
// \0@oxc-project+runtime@0.155.0/helpers/esm/objectSpread2.js
|
|
67
61
|
function B(e, t) {
|
|
68
62
|
var n = Object.keys(e);
|
|
69
63
|
if (Object.getOwnPropertySymbols) {
|
|
@@ -85,8 +79,7 @@ function V(e) {
|
|
|
85
79
|
}
|
|
86
80
|
return e;
|
|
87
81
|
}
|
|
88
|
-
|
|
89
|
-
//#region src/provide-blok.ts
|
|
82
|
+
// src/provide-blok.ts
|
|
90
83
|
var H = Symbol("BLOK_DEFAULT_CONFIG");
|
|
91
84
|
function U(e) {
|
|
92
85
|
m(H, e);
|
|
@@ -103,9 +96,8 @@ function G(e, t) {
|
|
|
103
96
|
}
|
|
104
97
|
return (e.tools !== void 0 || t.tools !== void 0) && (n.tools = V(V({}, e.tools), t.tools)), n;
|
|
105
98
|
}
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
var K = "__blokPortalRegistry", le = () => {
|
|
99
|
+
// src/block-portal-registry.ts
|
|
100
|
+
var K = "__blokPortalRegistry", ue = () => {
|
|
109
101
|
let e = h(/* @__PURE__ */ new Map());
|
|
110
102
|
return {
|
|
111
103
|
entries: e,
|
|
@@ -122,17 +114,16 @@ var K = "__blokPortalRegistry", le = () => {
|
|
|
122
114
|
}
|
|
123
115
|
};
|
|
124
116
|
}, q = /* @__PURE__ */ new WeakMap();
|
|
125
|
-
function
|
|
117
|
+
function de(e, t) {
|
|
126
118
|
q.set(e, t);
|
|
127
119
|
}
|
|
128
|
-
function
|
|
120
|
+
function fe(e) {
|
|
129
121
|
return q.get(e);
|
|
130
122
|
}
|
|
131
|
-
function
|
|
123
|
+
function pe(e) {
|
|
132
124
|
q.delete(e);
|
|
133
125
|
}
|
|
134
|
-
|
|
135
|
-
//#region src/useBlok.ts
|
|
126
|
+
// src/useBlok.ts
|
|
136
127
|
var J = (e) => ({
|
|
137
128
|
onChange: e.onChange !== void 0,
|
|
138
129
|
onSave: e.onSave !== void 0,
|
|
@@ -140,7 +131,7 @@ var J = (e) => ({
|
|
|
140
131
|
onSubmit: e.onSubmit !== void 0,
|
|
141
132
|
onBeforeRender: e.onBeforeRender !== void 0,
|
|
142
133
|
onAfterRender: e.onAfterRender !== void 0
|
|
143
|
-
}),
|
|
134
|
+
}), me = (e) => `[Blok] \`data\` is ignored while collaboration is on: the document lives on the sync service and is shared with everyone editing it, so replacing it from this editor would overwrite their work. To replace the whole document, call POST /sync/${e == null ? "{doc}" : e}/reset on your server — it reloads the document from your own document endpoint and every open editor picks it up. To change part of it, use the blocks API (insert/update/delete).`, he = (e, t) => {
|
|
144
135
|
if (typeof e != "object" || !e) return e;
|
|
145
136
|
let n = {};
|
|
146
137
|
for (let [i, a] of Object.entries(e)) {
|
|
@@ -173,7 +164,7 @@ function Y(e, t) {
|
|
|
173
164
|
onBeforeRender: !1,
|
|
174
165
|
onAfterRender: !1
|
|
175
166
|
}
|
|
176
|
-
}, s =
|
|
167
|
+
}, s = E(), c = {
|
|
177
168
|
onChange: (...e) => {
|
|
178
169
|
var t, n;
|
|
179
170
|
(t = (n = i()).onChange) == null || t.call(n, ...e);
|
|
@@ -203,7 +194,7 @@ function Y(e, t) {
|
|
|
203
194
|
return delete t.holder, t.data !== void 0 && (t.data = v(t.data)), t;
|
|
204
195
|
}, f = () => {
|
|
205
196
|
if (a.current !== null) {
|
|
206
|
-
F(a.current),
|
|
197
|
+
F(a.current), pe(a.current), ce(a.current);
|
|
207
198
|
try {
|
|
208
199
|
a.current.destroy();
|
|
209
200
|
} catch (e) {}
|
|
@@ -212,17 +203,34 @@ function Y(e, t) {
|
|
|
212
203
|
}, p = () => {
|
|
213
204
|
let e = document.createElement("div");
|
|
214
205
|
a.holder = e;
|
|
215
|
-
let t = u(), r =
|
|
216
|
-
t.tools !== void 0 && (t.tools =
|
|
206
|
+
let t = u(), r = ue();
|
|
207
|
+
t.tools !== void 0 && (t.tools = he(t.tools, r));
|
|
217
208
|
let o = J(i());
|
|
218
209
|
t.onChange = o.onChange ? c.onChange : void 0, t.onSave = o.onSave ? c.onSave : void 0, t.onEnter = o.onEnter ? c.onEnter : void 0, t.onSubmit = o.onSubmit ? c.onSubmit : void 0, t.onBeforeRender = o.onBeforeRender ? c.onBeforeRender : void 0, t.onAfterRender = o.onAfterRender ? c.onAfterRender : void 0, a.appliedHandlerPresence = o;
|
|
219
|
-
let l =
|
|
220
|
-
|
|
210
|
+
let l = t.pageTitle;
|
|
211
|
+
l && (t.pageTitle = V(V({}, typeof l == "object" ? v(l) : {}), {}, {
|
|
212
|
+
onChange: (...e) => {
|
|
213
|
+
let t = i().pageTitle;
|
|
214
|
+
if (typeof t == "object" && t) {
|
|
215
|
+
var n;
|
|
216
|
+
(n = t.onChange) == null || n.call(t, ...e);
|
|
217
|
+
}
|
|
218
|
+
},
|
|
219
|
+
onIconChange: (...e) => {
|
|
220
|
+
let t = i().pageTitle;
|
|
221
|
+
if (typeof t == "object" && t) {
|
|
222
|
+
var n;
|
|
223
|
+
(n = t.onIconChange) == null || n.call(t, ...e);
|
|
224
|
+
}
|
|
225
|
+
}
|
|
226
|
+
}));
|
|
227
|
+
let d = new x(V(V({}, t), {}, { holder: e }));
|
|
228
|
+
a.current = d, a.constructedCollaboration = t.collaboration, le(d, e), de(d, r), oe(d, { markRendered: (e) => {
|
|
221
229
|
s.clear(), a.lastRenderedData = e;
|
|
222
|
-
} }),
|
|
223
|
-
a.current ===
|
|
230
|
+
} }), d.isReady.then(() => {
|
|
231
|
+
a.current === d && (n.value = d);
|
|
224
232
|
}).catch(() => {
|
|
225
|
-
a.current ===
|
|
233
|
+
a.current === d && f();
|
|
226
234
|
});
|
|
227
235
|
};
|
|
228
236
|
b([
|
|
@@ -302,25 +310,20 @@ function Y(e, t) {
|
|
|
302
310
|
return;
|
|
303
311
|
}
|
|
304
312
|
let n = a.lastRenderedData, r = a.pendingData;
|
|
305
|
-
if (n !== void 0 &&
|
|
313
|
+
if (n !== void 0 && k(t, n) || r !== void 0 && k(t, r) || s.matches(t)) return;
|
|
306
314
|
let i = a.constructedCollaboration;
|
|
307
|
-
|
|
308
|
-
a.collaborationWarnedFor !== e && (a.collaborationWarnedFor = e, console.warn(pe(i.doc)));
|
|
309
|
-
return;
|
|
310
|
-
}
|
|
311
|
-
s.clear(), a.pendingData = t, a.renderChain = a.renderChain.then(() => e.render(re(v(t)))).then(() => {
|
|
315
|
+
i === void 0 ? (s.clear(), a.pendingData = t, a.renderChain = a.renderChain.then(() => e.render(ie(v(t)))).then(() => {
|
|
312
316
|
a.lastRenderedData = t;
|
|
313
317
|
}, () => void 0).then(() => {
|
|
314
318
|
a.pendingData === t && (a.pendingData = void 0);
|
|
315
|
-
});
|
|
319
|
+
})) : a.collaborationWarnedFor !== e && (a.collaborationWarnedFor = e, console.warn(me(i.doc)));
|
|
316
320
|
}, { immediate: !0 }), t !== void 0 && b(() => y(t), () => {
|
|
317
321
|
f(), p();
|
|
318
322
|
}), d(p), l(f), n;
|
|
319
323
|
}
|
|
320
|
-
|
|
321
|
-
//#region src/useBlocks.ts
|
|
324
|
+
// src/useBlocks.ts
|
|
322
325
|
var X = "block changed";
|
|
323
|
-
function
|
|
326
|
+
function ge(e, t = {}) {
|
|
324
327
|
let n = _(0), r = () => {
|
|
325
328
|
let t = y(e);
|
|
326
329
|
return t === null ? null : v(t);
|
|
@@ -340,9 +343,9 @@ function he(e, t = {}) {
|
|
|
340
343
|
let r = (r) => {
|
|
341
344
|
var i;
|
|
342
345
|
let a = (i = y(t.within)) == null ? null : i;
|
|
343
|
-
(a === null ||
|
|
346
|
+
(a === null || ee(e, r, a)) && (n.value += 1);
|
|
344
347
|
};
|
|
345
|
-
e.on(X, r), o.editor = e, o.handler = r, a.value =
|
|
348
|
+
e.on(X, r), o.editor = e, o.handler = r, a.value = te(e, i);
|
|
346
349
|
}, { immediate: !0 }), f(s), {
|
|
347
350
|
getById: (e) => a.value.getById(e),
|
|
348
351
|
getChildren: (e) => a.value.getChildren(e),
|
|
@@ -350,7 +353,7 @@ function he(e, t = {}) {
|
|
|
350
353
|
insertMany: (e) => a.value.insertMany(e),
|
|
351
354
|
insertTree: (e) => a.value.insertTree(e),
|
|
352
355
|
insertMarkdown: (e, t) => a.value.insertMarkdown(e, t),
|
|
353
|
-
exportMarkdown: () => a.value.exportMarkdown(),
|
|
356
|
+
exportMarkdown: (e) => a.value.exportMarkdown(e),
|
|
354
357
|
move: (e, t) => a.value.move(e, t),
|
|
355
358
|
nest: (e, t) => a.value.nest(e, t),
|
|
356
359
|
unnest: (e) => a.value.unnest(e),
|
|
@@ -370,14 +373,14 @@ function he(e, t = {}) {
|
|
|
370
373
|
insertOutputData: (e, t) => a.value.insertOutputData(e, t),
|
|
371
374
|
splitBlock: (e, t, n, r, i) => a.value.splitBlock(e, t, n, r, i),
|
|
372
375
|
insertInsideParent: (e, t, n) => a.value.insertInsideParent(e, t, n),
|
|
376
|
+
create: (e) => a.value.create(e),
|
|
373
377
|
render: (e) => a.value.render(e),
|
|
374
378
|
clear: () => a.value.clear(),
|
|
375
379
|
isSyncingFromYjs: () => a.value.isSyncingFromYjs()
|
|
376
380
|
};
|
|
377
381
|
}
|
|
378
|
-
|
|
379
|
-
|
|
380
|
-
function ge(e = {}) {
|
|
382
|
+
// src/useBlokReady.ts
|
|
383
|
+
function _e(e = {}) {
|
|
381
384
|
let { within: t, settleOn: n } = e, r = _(!1), i = () => {
|
|
382
385
|
var e;
|
|
383
386
|
let i = t === void 0 || (e = y(t)) == null ? null : e;
|
|
@@ -388,9 +391,8 @@ function ge(e = {}) {
|
|
|
388
391
|
};
|
|
389
392
|
return f(x.subscribeReady(i)), d(i), r;
|
|
390
393
|
}
|
|
391
|
-
|
|
392
|
-
|
|
393
|
-
var _e = r({
|
|
394
|
+
// src/BlockPortalHost.ts
|
|
395
|
+
var ve = r({
|
|
394
396
|
name: "BlockErrorBoundary",
|
|
395
397
|
setup(e, { slots: t }) {
|
|
396
398
|
return u(() => !1), () => {
|
|
@@ -398,7 +400,7 @@ var _e = r({
|
|
|
398
400
|
return (e = t.default) == null ? void 0 : e.call(t);
|
|
399
401
|
};
|
|
400
402
|
}
|
|
401
|
-
}),
|
|
403
|
+
}), ye = r({
|
|
402
404
|
name: "BlockPortalHost",
|
|
403
405
|
props: { registry: {
|
|
404
406
|
type: Object,
|
|
@@ -408,14 +410,13 @@ var _e = r({
|
|
|
408
410
|
return () => a(e, Array.from(n.registry.entries.entries()).map(([e, n]) => a(t, {
|
|
409
411
|
key: e,
|
|
410
412
|
to: n.hostEl
|
|
411
|
-
}, [a(
|
|
413
|
+
}, [a(ve, null, { default: () => a(n.component, n.props) })])));
|
|
412
414
|
}
|
|
413
|
-
}), Z = Symbol("BLOK_EDITOR_INSTANCE"),
|
|
414
|
-
function
|
|
415
|
-
return o(Z,
|
|
415
|
+
}), Z = Symbol("BLOK_EDITOR_INSTANCE"), be = _(null);
|
|
416
|
+
function xe() {
|
|
417
|
+
return o(Z, be);
|
|
416
418
|
}
|
|
417
|
-
|
|
418
|
-
//#region src/BlokContent.ts
|
|
419
|
+
// src/BlokContent.ts
|
|
419
420
|
var Q = r({
|
|
420
421
|
name: "BlokContent",
|
|
421
422
|
props: { editor: {
|
|
@@ -440,17 +441,38 @@ var Q = r({
|
|
|
440
441
|
}), l(() => {
|
|
441
442
|
i(e.editor);
|
|
442
443
|
}), () => {
|
|
443
|
-
let n = e.editor, r = n === null ? void 0 :
|
|
444
|
-
return a("div", { ref: t }, r === void 0 ? [] : [a(
|
|
444
|
+
let n = e.editor, r = n === null ? void 0 : fe(v(n));
|
|
445
|
+
return a("div", { ref: t }, r === void 0 ? [] : [a(ye, { registry: r })]);
|
|
445
446
|
};
|
|
446
447
|
}
|
|
447
|
-
}),
|
|
448
|
+
}), Se = r({
|
|
449
|
+
name: "BlokTitle",
|
|
450
|
+
props: { editor: {
|
|
451
|
+
type: Object,
|
|
452
|
+
default: null
|
|
453
|
+
} },
|
|
454
|
+
setup(e) {
|
|
455
|
+
let t = g(null), n = (e) => {
|
|
456
|
+
e !== null && t.value !== null && v(e).title.mount(t.value);
|
|
457
|
+
}, r = (e) => {
|
|
458
|
+
let t = e === null ? void 0 : v(e).title;
|
|
459
|
+
typeof (t == null ? void 0 : t.mount) == "function" && t.mount(null);
|
|
460
|
+
};
|
|
461
|
+
return d(() => {
|
|
462
|
+
n(e.editor);
|
|
463
|
+
}), b(() => e.editor, (e, t) => {
|
|
464
|
+
r(t == null ? null : t), n(e);
|
|
465
|
+
}), l(() => {
|
|
466
|
+
r(e.editor);
|
|
467
|
+
}), () => a("div", { ref: t });
|
|
468
|
+
}
|
|
469
|
+
}), Ce = /* @__PURE__ */ "autofocus.defaultBlock.dataModel.placeholder.sanitizer.hideToolbar.toolbarPosition.maxHistoryLength.historyDebounceTime.newGroupDelay.globalUndoRedo.tools.data.minHeight.loader.logLevel.readOnly.i18n.link.linkPaste.inlineToolbar.inlineEmoji.find.tunes.style.theme.scrollToBlock.user.resolveUser.notifierPosition.notifier.width.onBeforeRender.onBeforePaste.onEnter.onSubmit.onError.onImageFailure.migrations.uploader.media.server.ticket.persistence.collaboration.documentId.tabSync.captureClicksBelowEditor.pageTitle.agent".split("."), $ = (e, t, n) => {
|
|
448
470
|
let r = t.flatMap((t) => {
|
|
449
471
|
var n;
|
|
450
472
|
return (n = e == null ? void 0 : e[t]) == null ? [] : n;
|
|
451
473
|
});
|
|
452
474
|
for (let e of r) typeof e == "function" && e(n);
|
|
453
|
-
},
|
|
475
|
+
}, we = r({
|
|
454
476
|
name: "BlokEditor",
|
|
455
477
|
inheritAttrs: !1,
|
|
456
478
|
props: {
|
|
@@ -646,6 +668,14 @@ var Q = r({
|
|
|
646
668
|
type: Boolean,
|
|
647
669
|
default: void 0
|
|
648
670
|
},
|
|
671
|
+
pageTitle: {
|
|
672
|
+
type: [Boolean, Object],
|
|
673
|
+
default: void 0
|
|
674
|
+
},
|
|
675
|
+
agent: {
|
|
676
|
+
type: Object,
|
|
677
|
+
default: void 0
|
|
678
|
+
},
|
|
649
679
|
recreateKey: { type: null }
|
|
650
680
|
},
|
|
651
681
|
emits: {
|
|
@@ -668,7 +698,7 @@ var Q = r({
|
|
|
668
698
|
});
|
|
669
699
|
let u = (e) => l.value.split("|").includes(e), d = () => {
|
|
670
700
|
let n = {};
|
|
671
|
-
for (let t of
|
|
701
|
+
for (let t of Ce) {
|
|
672
702
|
let r = e[t];
|
|
673
703
|
r !== void 0 && (n[t] = r);
|
|
674
704
|
}
|
|
@@ -678,11 +708,7 @@ var Q = r({
|
|
|
678
708
|
event: n
|
|
679
709
|
});
|
|
680
710
|
}), (u("onSave") || u("onUpdate:data")) && (n.onSave = (e) => {
|
|
681
|
-
|
|
682
|
-
Se(s.vnode.props, ["onUpdate:data", "onSave"], e);
|
|
683
|
-
return;
|
|
684
|
-
}
|
|
685
|
-
t("update:data", e), t("save", e);
|
|
711
|
+
(s == null ? void 0 : s.isUnmounted) === !0 ? $(s.vnode.props, ["onUpdate:data", "onSave"], e) : (t("update:data", e), t("save", e));
|
|
686
712
|
}), u("onAfterRender") && (n.onAfterRender = (e) => {
|
|
687
713
|
t("after-render", e);
|
|
688
714
|
}), u("onThemeChange") && (n.onThemeChange = (e) => {
|
|
@@ -725,30 +751,30 @@ var Q = r({
|
|
|
725
751
|
let t = f.value;
|
|
726
752
|
if (t !== null) return t.render(e).then(() => {
|
|
727
753
|
var n;
|
|
728
|
-
(n =
|
|
754
|
+
(n = se(t)) == null || n.markRendered(e);
|
|
729
755
|
});
|
|
730
756
|
}
|
|
731
757
|
}), () => a(Q, V({ editor: f.value }, o));
|
|
732
758
|
}
|
|
733
|
-
}),
|
|
759
|
+
}), Te = [
|
|
734
760
|
"toolbox",
|
|
735
761
|
"isReadOnlySupported",
|
|
736
762
|
"__isBlokVueBlock"
|
|
737
|
-
],
|
|
763
|
+
], Ee = /* @__PURE__ */ new Set([
|
|
738
764
|
void 0,
|
|
739
765
|
"user",
|
|
740
766
|
"api",
|
|
741
767
|
"convert"
|
|
742
|
-
]),
|
|
768
|
+
]), De = (e, t, n) => {
|
|
743
769
|
var r;
|
|
744
770
|
e == null || (r = e.events) == null || r.emit(S, {
|
|
745
771
|
blockId: t,
|
|
746
772
|
childIds: n.map((e) => e.id)
|
|
747
773
|
});
|
|
748
774
|
};
|
|
749
|
-
function
|
|
750
|
-
var t, n;
|
|
751
|
-
let
|
|
775
|
+
function Oe(e) {
|
|
776
|
+
var t, n, i;
|
|
777
|
+
let o = () => r({
|
|
752
778
|
name: `VueBlock(${e.type})`,
|
|
753
779
|
props: {
|
|
754
780
|
ctx: {
|
|
@@ -766,7 +792,7 @@ function Ee(e) {
|
|
|
766
792
|
return (e = t.notifyMounted) == null ? void 0 : e.call(t);
|
|
767
793
|
}), e.setup(t.ctx);
|
|
768
794
|
}
|
|
769
|
-
}),
|
|
795
|
+
}), s = (t = class {
|
|
770
796
|
static get toolbox() {
|
|
771
797
|
return e.toolbox;
|
|
772
798
|
}
|
|
@@ -774,8 +800,8 @@ function Ee(e) {
|
|
|
774
800
|
return !0;
|
|
775
801
|
}
|
|
776
802
|
constructor(t) {
|
|
777
|
-
var n,
|
|
778
|
-
this.wrappedComponent =
|
|
803
|
+
var n, i, s;
|
|
804
|
+
this.wrappedComponent = o(), this.mountSignalled = !1, this.hostEl = null, this.pendingDispatch = !1, this.anchorEl = null, this.toolbarAnchorRef = (e) => {
|
|
779
805
|
let t = e === null || e instanceof Element ? e : e.$el;
|
|
780
806
|
this.anchorEl = t instanceof HTMLElement ? t : null;
|
|
781
807
|
}, this.notifyMounted = () => {
|
|
@@ -786,12 +812,12 @@ function Ee(e) {
|
|
|
786
812
|
origin: this.origin,
|
|
787
813
|
api: this.api
|
|
788
814
|
};
|
|
789
|
-
if ((t = e.onMounted) == null || t.call(e, this.blockApi, n),
|
|
815
|
+
if ((t = e.onMounted) == null || t.call(e, this.blockApi, n), Ee.has(this.origin)) {
|
|
790
816
|
var r;
|
|
791
817
|
(r = e.onCreated) == null || r.call(e, this.blockApi, n);
|
|
792
818
|
}
|
|
793
819
|
}, this.commit = (t) => {
|
|
794
|
-
let n =
|
|
820
|
+
let n = A(e.propSchema, V(V({}, this.mirror), t));
|
|
795
821
|
D(n, this.mirror) || (this.mirror = n, this.lastRendered = n, this.dataRef.value = n, this.flushDispatch());
|
|
796
822
|
}, this.blockApi = t.block;
|
|
797
823
|
let c = (n = t.config) == null ? {} : n;
|
|
@@ -800,7 +826,7 @@ function Ee(e) {
|
|
|
800
826
|
this.pointerDrag = () => {
|
|
801
827
|
var e;
|
|
802
828
|
return (l == null || (e = l.blocks) == null ? void 0 : e.isPointerDragActive) === !0;
|
|
803
|
-
}, this.mirror =
|
|
829
|
+
}, this.mirror = A(e.propSchema, v((i = t.data) == null ? {} : i)), this.lastRendered = this.mirror, this.dataRef = _(this.mirror), this.readOnlyRef = _(t.readOnly), this.origin = (s = t.origin) == null ? "api" : s;
|
|
804
830
|
let u = this.blockApi, f = this.api;
|
|
805
831
|
this.childrenComponent = r({
|
|
806
832
|
name: `VueBlockChildren(${e.type})`,
|
|
@@ -815,13 +841,13 @@ function Ee(e) {
|
|
|
815
841
|
}
|
|
816
842
|
},
|
|
817
843
|
setup(e) {
|
|
818
|
-
let t = g(null), n =
|
|
844
|
+
let t = g(null), n = ne(), r = () => {
|
|
819
845
|
if (t.value === null) return;
|
|
820
846
|
let r = u.getChildren();
|
|
821
|
-
|
|
847
|
+
re(t.value, ae(r, (e) => f.blocks.getChildren(e))), T(n, r, {
|
|
822
848
|
childAttributes: e.childAttributes,
|
|
823
849
|
childContentAttributes: e.childContentAttributes
|
|
824
|
-
}),
|
|
850
|
+
}), De(f, u.id, r);
|
|
825
851
|
};
|
|
826
852
|
return d(r), p(r), () => a("div", {
|
|
827
853
|
ref: t,
|
|
@@ -860,8 +886,8 @@ function Ee(e) {
|
|
|
860
886
|
return this.mirror;
|
|
861
887
|
}
|
|
862
888
|
async setData(t) {
|
|
863
|
-
let n =
|
|
864
|
-
return D(n, this.lastRendered)
|
|
889
|
+
let n = A(e.propSchema, v(t == null ? {} : t));
|
|
890
|
+
return D(n, this.lastRendered) || (this.mirror = n, this.lastRendered = n, this.dataRef.value = n, await c()), !0;
|
|
865
891
|
}
|
|
866
892
|
setReadOnly(e) {
|
|
867
893
|
this.readOnlyRef.value = e;
|
|
@@ -877,13 +903,21 @@ function Ee(e) {
|
|
|
877
903
|
var n;
|
|
878
904
|
return ((n = e.onNavigationEnter) == null ? void 0 : n.call(e, t, this.blockApi)) === !0;
|
|
879
905
|
}
|
|
906
|
+
isReadOnly() {
|
|
907
|
+
var t;
|
|
908
|
+
return ((t = e.isReadOnly) == null ? void 0 : t.call(e, this.blockApi)) === !0;
|
|
909
|
+
}
|
|
910
|
+
isDataReadOnly() {
|
|
911
|
+
var t;
|
|
912
|
+
return ((t = e.isDataReadOnly) == null ? void 0 : t.call(e, this.blockApi)) === !0;
|
|
913
|
+
}
|
|
880
914
|
moved() {
|
|
881
915
|
var t;
|
|
882
916
|
(t = e.onMoved) == null || t.call(e, this.blockApi);
|
|
883
917
|
}
|
|
884
|
-
removed() {
|
|
885
|
-
var
|
|
886
|
-
(
|
|
918
|
+
removed(t) {
|
|
919
|
+
var n, r, i;
|
|
920
|
+
(n = this.registry) == null || n.unregister(this.blockApi.id, (r = this.hostEl) == null ? void 0 : r), (i = e.onRemoved) == null || i.call(e, this.blockApi, t);
|
|
887
921
|
}
|
|
888
922
|
destroy() {
|
|
889
923
|
var e, t;
|
|
@@ -897,22 +931,30 @@ function Ee(e) {
|
|
|
897
931
|
if (this.pendingDispatch) return;
|
|
898
932
|
this.pendingDispatch = !0;
|
|
899
933
|
let e = () => {
|
|
900
|
-
|
|
901
|
-
requestAnimationFrame(e);
|
|
902
|
-
return;
|
|
903
|
-
}
|
|
904
|
-
this.pendingDispatch = !1, this.blockApi.dispatchChange();
|
|
934
|
+
this.pointerDrag() ? requestAnimationFrame(e) : (this.pendingDispatch = !1, this.blockApi.dispatchChange());
|
|
905
935
|
};
|
|
906
936
|
requestAnimationFrame(e);
|
|
907
937
|
}
|
|
908
938
|
}, t.__isBlokVueBlock = !0, t);
|
|
909
|
-
for (let [t, r] of Object.entries((n = e.statics) == null ? {} : n))
|
|
939
|
+
for (let [t, r] of Object.entries((n = e.statics) == null ? {} : n)) Te.includes(t) || Object.defineProperty(s, t, {
|
|
910
940
|
value: r,
|
|
911
941
|
writable: !0,
|
|
912
942
|
enumerable: !0,
|
|
913
943
|
configurable: !0
|
|
914
944
|
});
|
|
915
|
-
return
|
|
945
|
+
return ((i = e.statics) == null ? void 0 : i.describe) === void 0 && Object.defineProperty(s, "describe", {
|
|
946
|
+
value: () => {
|
|
947
|
+
var t;
|
|
948
|
+
return O({
|
|
949
|
+
type: e.type,
|
|
950
|
+
title: e.toolbox !== void 0 && !Array.isArray(e.toolbox) ? e.toolbox.title : void 0,
|
|
951
|
+
propSchema: e.propSchema,
|
|
952
|
+
richTextFields: (t = e.statics) == null ? void 0 : t.richTextFields
|
|
953
|
+
});
|
|
954
|
+
},
|
|
955
|
+
writable: !0,
|
|
956
|
+
enumerable: !0,
|
|
957
|
+
configurable: !0
|
|
958
|
+
}), s;
|
|
916
959
|
}
|
|
917
|
-
|
|
918
|
-
export { H as BLOK_DEFAULT_CONFIG, Z as BLOK_EDITOR_INSTANCE, Q as BlokContent, Ce as BlokEditor, Ee as createVueBlock, U as provideBlok, he as useBlocks, Y as useBlok, W as useBlokDefaults, be as useBlokInstance, ge as useBlokReady };
|
|
960
|
+
export { H as BLOK_DEFAULT_CONFIG, Z as BLOK_EDITOR_INSTANCE, Q as BlokContent, we as BlokEditor, Se as BlokTitle, Oe as createVueBlock, U as provideBlok, ge as useBlocks, Y as useBlok, W as useBlokDefaults, xe as useBlokInstance, _e as useBlokReady };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@bloklabs/vue",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "2.0.0",
|
|
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",
|
|
@@ -44,8 +44,7 @@
|
|
|
44
44
|
},
|
|
45
45
|
"files": [
|
|
46
46
|
"dist",
|
|
47
|
-
"types"
|
|
48
|
-
"src"
|
|
47
|
+
"types"
|
|
49
48
|
],
|
|
50
49
|
"publishConfig": {
|
|
51
50
|
"access": "public"
|
|
@@ -54,7 +53,7 @@
|
|
|
54
53
|
"build": "yarn run -T vite build --mode production"
|
|
55
54
|
},
|
|
56
55
|
"peerDependencies": {
|
|
57
|
-
"@bloklabs/core": "^
|
|
56
|
+
"@bloklabs/core": "^2.0.0",
|
|
58
57
|
"vue": "^3.5.0"
|
|
59
58
|
}
|
|
60
59
|
}
|
package/types/index.d.ts
CHANGED
|
@@ -86,6 +86,24 @@ export declare function useBlok(
|
|
|
86
86
|
*/
|
|
87
87
|
export declare const BlokContent: DefineComponent<BlokContentProps>;
|
|
88
88
|
|
|
89
|
+
/** Props for the `BlokTitle` component. Other attributes fall through to its `<div>`. */
|
|
90
|
+
export interface BlokTitleProps {
|
|
91
|
+
/** The Blok editor instance, or null while it is not ready. */
|
|
92
|
+
editor: Blok | null;
|
|
93
|
+
}
|
|
94
|
+
|
|
95
|
+
/**
|
|
96
|
+
* Places the editor's page title in a `<div>` of your own, through `editor.title.mount`.
|
|
97
|
+
* The editor needs `pageTitle` set: this component only moves the title.
|
|
98
|
+
* On unmount the title goes back above the first block. Slot content is not rendered.
|
|
99
|
+
*
|
|
100
|
+
* @example
|
|
101
|
+
* ```ts
|
|
102
|
+
* h(BlokTitle, { editor: editorRef.value?.instance ?? null })
|
|
103
|
+
* ```
|
|
104
|
+
*/
|
|
105
|
+
export declare const BlokTitle: DefineComponent<BlokTitleProps>;
|
|
106
|
+
|
|
89
107
|
/**
|
|
90
108
|
* Props for `<BlokEditor>` — every `UseBlokConfig` option except the callbacks
|
|
91
109
|
* surfaced as emits (`onReady`/`onChange`/`onSave`/`onAfterRender`/`onThemeChange`),
|
|
@@ -226,6 +244,19 @@ export interface InsertSpec {
|
|
|
226
244
|
caret?: CaretTarget;
|
|
227
245
|
}
|
|
228
246
|
|
|
247
|
+
/** Spec for {@link UseBlocksApi.create}. */
|
|
248
|
+
export interface CreateSpec {
|
|
249
|
+
type?: string;
|
|
250
|
+
data?: BlockToolData;
|
|
251
|
+
/** `null` is the root. Omitted: the `before`/`after` sibling's parent, or the root. */
|
|
252
|
+
parentId?: string | null;
|
|
253
|
+
/** Defaults to `'end'`. */
|
|
254
|
+
position?: InsertPosition;
|
|
255
|
+
id?: string;
|
|
256
|
+
tunes?: { [name: string]: BlockTuneData };
|
|
257
|
+
focus?: boolean;
|
|
258
|
+
}
|
|
259
|
+
|
|
229
260
|
/**
|
|
230
261
|
* One node of a pre-built nested subtree for {@link UseBlocksApi.insertTree}.
|
|
231
262
|
*
|
|
@@ -311,7 +342,7 @@ export interface UseBlocksApi {
|
|
|
311
342
|
* `parentId` nests the import (top-level converted blocks are reparented under
|
|
312
343
|
* it); a dangling `parentId` (re-checked after the async convert) and a
|
|
313
344
|
* converter failure both return `[]`. Returns all created {@link BlockNode}s in
|
|
314
|
-
* document order. `config` is forwarded to the converter (gfm/toolMap/
|
|
345
|
+
* document order. `config` is forwarded to the converter (gfm/toolMap/onUnknownNode/title).
|
|
315
346
|
*/
|
|
316
347
|
insertMarkdown(
|
|
317
348
|
markdown: string,
|
|
@@ -323,8 +354,9 @@ export interface UseBlocksApi {
|
|
|
323
354
|
* {@link insertMarkdown}). Async: the serializer is lazy-loaded. Markdown cannot
|
|
324
355
|
* express every block, so some structure is dropped (table `colspan`/`rowspan`,
|
|
325
356
|
* heading columns). Returns `''` for an empty document. Pre-ready: `''`.
|
|
357
|
+
* `title: true` writes the page title first, as core's does.
|
|
326
358
|
*/
|
|
327
|
-
exportMarkdown(): Promise<string>;
|
|
359
|
+
exportMarkdown(options?: { title?: boolean }): Promise<string>;
|
|
328
360
|
/**
|
|
329
361
|
* Move `id` to a flat slot, as a single operation. No-op when `id` is unknown.
|
|
330
362
|
* For a relative `{ before|after }` target it is also a no-op when the ref is
|
|
@@ -448,6 +480,14 @@ export interface UseBlocksApi {
|
|
|
448
480
|
* `childData` defaults to an empty paragraph. Returns the created node. Pre-ready: `null`.
|
|
449
481
|
*/
|
|
450
482
|
insertInsideParent(parentId: string, insertIndex: number, childData?: BlockToolData): BlockNode | null;
|
|
483
|
+
/**
|
|
484
|
+
* Add a block the way a toolbox pick does, for a host button such as "New
|
|
485
|
+
* page" — delegates to core's `blocks.create`. Goes to the end of the root
|
|
486
|
+
* unless `parentId`/`position` say otherwise. Resolves `null` for an unknown
|
|
487
|
+
* tool or a place that does not exist; rejects with the tool's
|
|
488
|
+
* `prepareInsert` error, inserting nothing. Pre-ready: `null`.
|
|
489
|
+
*/
|
|
490
|
+
create(spec?: CreateSpec): Promise<BlockNode | null>;
|
|
451
491
|
/**
|
|
452
492
|
* Replace the WHOLE document with blocks parsed from saved {@link OutputData} —
|
|
453
493
|
* delegates to core's `blocks.render`. CLEARS existing content first (a
|
|
@@ -689,6 +729,19 @@ export interface CreateVueBlockSpec<Data extends BlockToolData = BlockToolData>
|
|
|
689
729
|
* @param block - this block's per-block API
|
|
690
730
|
*/
|
|
691
731
|
onNavigationEnter?: (event: KeyboardEvent, block: BlockAPI) => boolean;
|
|
732
|
+
/**
|
|
733
|
+
* Core's `isReadOnly` hook: true when this block takes no edits from the
|
|
734
|
+
* user or an agent while the editor stays editable (no delete, move, merge,
|
|
735
|
+
* nesting or undo into it). Asked on each gesture; a throw counts as true.
|
|
736
|
+
* @param block - this block's per-block API
|
|
737
|
+
*/
|
|
738
|
+
isReadOnly?: (block: BlockAPI) => boolean;
|
|
739
|
+
/**
|
|
740
|
+
* Core's `isDataReadOnly` hook: true when only this block's own data is
|
|
741
|
+
* frozen and its children stay open. A throw counts as true.
|
|
742
|
+
* @param block - this block's per-block API
|
|
743
|
+
*/
|
|
744
|
+
isDataReadOnly?: (block: BlockAPI) => boolean;
|
|
692
745
|
onRendered?: (block: BlockAPI) => void;
|
|
693
746
|
/**
|
|
694
747
|
* Fired ONCE per block instance, after the teleport's FIRST commit — the
|
|
@@ -729,7 +782,8 @@ export interface CreateVueBlockSpec<Data extends BlockToolData = BlockToolData>
|
|
|
729
782
|
*/
|
|
730
783
|
onCreated?: (block: BlockAPI, context: VueBlockMountedContext) => void;
|
|
731
784
|
onMoved?: (block: BlockAPI) => void;
|
|
732
|
-
|
|
785
|
+
/** `removal.deleted` is true when a local edit deleted the block (see BlockTool.removed). */
|
|
786
|
+
onRemoved?: (block: BlockAPI, removal?: { deleted: boolean }) => void;
|
|
733
787
|
}
|
|
734
788
|
|
|
735
789
|
/**
|