@textbus/adapter-vue 4.0.0-alpha.32 → 4.0.0-alpha.34

Sign up to get free protection for your applications and to get access to all the features.
Files changed (4) hide show
  1. package/bundles/adapter.d.ts +1 -0
  2. package/bundles/index.esm.js +22 -1
  3. package/bundles/index.js +21 -0
  4. package/package.json +4 -4
package/bundles/adapter.d.ts CHANGED
@@ -17,6 +17,7 @@ export declare class Adapter extends DomAdapter<VNode, VNode> {
17
17
  private components;
18
18
  private componentRefs;
19
19
  private componentRendingStack;
20
+ private compositionRef;
20
21
  constructor(components: VueAdapterComponents, mount: (host: HTMLElement, root: VNode) => (void | (() => void)));
21
22
  componentRender(component: Component): VNode;
22
23
  slotRender(slot: Slot, slotHostRender: (children: Array<VElement | VTextNode | Component>) => VElement, renderEnv?: any): VNode;
package/bundles/index.esm.js CHANGED
@@ -1,4 +1,4 @@
1
- import { getCurrentInstance, onMounted, onUpdated, onUnmounted, ref, h } from 'vue';
1
+ import { ref, watchEffect, getCurrentInstance, onMounted, onUpdated, onUnmounted, h } from 'vue';
2
2
  import { Subject } from '@tanbo/stream';
3
3
  import { makeError, VElement, VTextNode, replaceEmpty, invokeListener } from '@textbus/core';
4
4
  import { DomAdapter } from '@textbus/platform-browser';
@@ -14,6 +14,10 @@ class Adapter extends DomAdapter {
14
14
  this.components = {};
15
15
  this.componentRefs = new WeakMap();
16
16
  this.componentRendingStack = [];
17
+ this.compositionRef = ref();
18
+ watchEffect(() => {
19
+ this.compositionNode = this.compositionRef.value || null;
20
+ });
17
21
  Object.keys(components).forEach(key => {
18
22
  const vueComponent = components[key];
19
23
  const setup = vueComponent.setup;
@@ -35,9 +39,14 @@ class Adapter extends DomAdapter {
35
39
  }
36
40
  });
37
41
  onUpdated(() => {
42
+ var _a;
38
43
  self.componentRendingStack.pop();
39
44
  component.changeMarker.rendered();
40
45
  self.onViewUpdated.next();
46
+ if (!(((_a = self.componentRefs.get(component)) === null || _a === void 0 ? void 0 : _a.value) instanceof HTMLElement)) {
47
+ // eslint-disable-next-line max-len
48
+ throw adapterError(`Component \`${component.name}\` is not bound to rootRef, you must bind rootRef to the root element node of the component view.`);
49
+ }
41
50
  });
42
51
  onUnmounted(() => {
43
52
  sub.unsubscribe();
@@ -86,6 +95,18 @@ class Adapter extends DomAdapter {
86
95
  this.slotRootVElementCaches.set(slot, vElement);
87
96
  const vNodeToJSX = (vNode) => {
88
97
  const children = [];
98
+ if (this.composition && this.composition.slot === slot) {
99
+ this.insertCompositionByIndex(slot, vNode, this.composition, () => {
100
+ return new VElement('span', {
101
+ style: {
102
+ textDecoration: 'underline'
103
+ },
104
+ ref: this.compositionRef
105
+ }, [
106
+ new VTextNode(this.composition.text)
107
+ ]);
108
+ });
109
+ }
89
110
  for (let i = 0; i < vNode.children.length; i++) {
90
111
  const child = vNode.children[i];
91
112
  if (child instanceof VElement) {
package/bundles/index.js CHANGED
@@ -16,6 +16,10 @@ class Adapter extends platformBrowser.DomAdapter {
16
16
  this.components = {};
17
17
  this.componentRefs = new WeakMap();
18
18
  this.componentRendingStack = [];
19
+ this.compositionRef = vue.ref();
20
+ vue.watchEffect(() => {
21
+ this.compositionNode = this.compositionRef.value || null;
22
+ });
19
23
  Object.keys(components).forEach(key => {
20
24
  const vueComponent = components[key];
21
25
  const setup = vueComponent.setup;
@@ -37,9 +41,14 @@ class Adapter extends platformBrowser.DomAdapter {
37
41
  }
38
42
  });
39
43
  vue.onUpdated(() => {
44
+ var _a;
40
45
  self.componentRendingStack.pop();
41
46
  component.changeMarker.rendered();
42
47
  self.onViewUpdated.next();
48
+ if (!(((_a = self.componentRefs.get(component)) === null || _a === void 0 ? void 0 : _a.value) instanceof HTMLElement)) {
49
+ // eslint-disable-next-line max-len
50
+ throw adapterError(`Component \`${component.name}\` is not bound to rootRef, you must bind rootRef to the root element node of the component view.`);
51
+ }
43
52
  });
44
53
  vue.onUnmounted(() => {
45
54
  sub.unsubscribe();
@@ -88,6 +97,18 @@ class Adapter extends platformBrowser.DomAdapter {
88
97
  this.slotRootVElementCaches.set(slot, vElement);
89
98
  const vNodeToJSX = (vNode) => {
90
99
  const children = [];
100
+ if (this.composition && this.composition.slot === slot) {
101
+ this.insertCompositionByIndex(slot, vNode, this.composition, () => {
102
+ return new core.VElement('span', {
103
+ style: {
104
+ textDecoration: 'underline'
105
+ },
106
+ ref: this.compositionRef
107
+ }, [
108
+ new core.VTextNode(this.composition.text)
109
+ ]);
110
+ });
111
+ }
91
112
  for (let i = 0; i < vNode.children.length; i++) {
92
113
  const child = vNode.children[i];
93
114
  if (child instanceof core.VElement) {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@textbus/adapter-vue",
3
- "version": "4.0.0-alpha.32",
3
+ "version": "4.0.0-alpha.34",
4
4
  "description": "Textbus is a rich text editor and framework that is highly customizable and extensible to achieve rich wysiwyg effects.",
5
5
  "main": "./bundles/index.js",
6
6
  "module": "./bundles/index.esm.js",
@@ -26,8 +26,8 @@
26
26
  ],
27
27
  "dependencies": {
28
28
  "@tanbo/stream": "^1.2.3",
29
- "@textbus/core": "^4.0.0-alpha.31",
30
- "@textbus/platform-browser": "^4.0.0-alpha.32",
29
+ "@textbus/core": "^4.0.0-alpha.34",
30
+ "@textbus/platform-browser": "^4.0.0-alpha.34",
31
31
  "vue": "^3.3.4"
32
32
  },
33
33
  "devDependencies": {
@@ -48,5 +48,5 @@
48
48
  "bugs": {
49
49
  "url": "https://github.com/textbus/textbus.git/issues"
50
50
  },
51
- "gitHead": "00d52c23dde48068e14e46379b85ddac0743c6ff"
51
+ "gitHead": "b6f9bfbce3135865fc0c8a3e6b622a7040019634"
52
52
  }