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

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.
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
  }