@textbus/adapter-vue 4.0.0-alpha.3 → 4.0.0-alpha.30

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 +9 -8
  2. package/bundles/index.esm.js +12 -5
  3. package/bundles/index.js +12 -5
  4. package/package.json +5 -5
package/bundles/adapter.d.ts CHANGED
@@ -1,13 +1,13 @@
1
1
  import { DefineComponent, Ref, VNode } from 'vue';
2
2
  import { Subject } from '@tanbo/stream';
3
- import { Component, ComponentInstance, ExtractComponentInstanceType, Slot, VElement, VTextNode } from '@textbus/core';
3
+ import { Component, Slot, VElement, VTextNode } from '@textbus/core';
4
4
  import { DomAdapter } from '@textbus/platform-browser';
5
- export interface ViewComponentProps<T extends Component = Component> {
6
- component: ExtractComponentInstanceType<T>;
5
+ export interface ViewComponentProps<T extends Component> {
6
+ component: T;
7
7
  rootRef: Ref<HTMLElement | undefined>;
8
8
  }
9
- export interface ReactAdapterComponents {
10
- [key: string]: DefineComponent<ViewComponentProps>;
9
+ export interface VueAdapterComponents {
10
+ [key: string]: DefineComponent<ViewComponentProps<any>>;
11
11
  }
12
12
  /**
13
13
  * Textbus 桥接 Vue 渲染能力适配器，用于在 Vue 项目中渲染 Textbus 数据
@@ -16,7 +16,8 @@ export declare class Adapter extends DomAdapter<VNode, VNode> {
16
16
  onViewUpdated: Subject<void>;
17
17
  private components;
18
18
  private componentRefs;
19
- constructor(components: ReactAdapterComponents, mount: (host: HTMLElement, root: VNode) => (void | (() => void)));
20
- componentRender(component: ComponentInstance): VNode;
21
- slotRender(slot: Slot, slotHostRender: (children: Array<VElement | VTextNode | ComponentInstance>) => VElement): VNode;
19
+ private componentRendingStack;
20
+ constructor(components: VueAdapterComponents, mount: (host: HTMLElement, root: VNode) => (void | (() => void)));
21
+ componentRender(component: Component): VNode;
22
+ slotRender(slot: Slot, slotHostRender: (children: Array<VElement | VTextNode | Component>) => VElement, renderEnv?: any): VNode;
22
23
  }
package/bundles/index.esm.js CHANGED
@@ -13,6 +13,7 @@ class Adapter extends DomAdapter {
13
13
  this.onViewUpdated = new Subject();
14
14
  this.components = {};
15
15
  this.componentRefs = new WeakMap();
16
+ this.componentRendingStack = [];
16
17
  Object.keys(components).forEach(key => {
17
18
  const vueComponent = components[key];
18
19
  const setup = vueComponent.setup;
@@ -34,6 +35,7 @@ class Adapter extends DomAdapter {
34
35
  }
35
36
  });
36
37
  onUpdated(() => {
38
+ component.changeMarker.rendered();
37
39
  self.onViewUpdated.next();
38
40
  });
39
41
  onUnmounted(() => {
@@ -47,22 +49,27 @@ class Adapter extends DomAdapter {
47
49
  componentRender(component) {
48
50
  const comp = this.components[component.name] || this.components['*'];
49
51
  if (comp) {
50
- component.changeMarker.rendered();
51
52
  let rootRef = this.componentRefs.get(component);
52
53
  if (!rootRef) {
53
54
  rootRef = ref();
54
55
  this.componentRefs.set(component, rootRef);
55
56
  }
56
- return h(comp, {
57
+ component.__slots__.length = 0;
58
+ this.componentRendingStack.push(component);
59
+ const vNode = h(comp, {
57
60
  component,
58
61
  rootRef,
59
62
  key: component.id
60
63
  });
64
+ this.componentRendingStack.pop();
65
+ return vNode;
61
66
  }
62
67
  throw adapterError(`cannot found view component \`${component.name}\`!`);
63
68
  }
64
- slotRender(slot, slotHostRender) {
65
- const vElement = slot.toTree(slotHostRender);
69
+ slotRender(slot, slotHostRender, renderEnv) {
70
+ const context = this.componentRendingStack[this.componentRendingStack.length - 1];
71
+ context.__slots__.push(slot);
72
+ const vElement = slot.toTree(slotHostRender, renderEnv);
66
73
  this.slotRootVElementCaches.set(slot, vElement);
67
74
  const vNodeToJSX = (vNode) => {
68
75
  const children = [];
@@ -95,7 +102,7 @@ class Adapter extends DomAdapter {
95
102
  };
96
103
  const refFn = (nativeNode) => {
97
104
  if (!nativeNode) {
98
- this.slotRootNativeElementCaches.remove(nativeNode);
105
+ this.slotRootNativeElementCaches.remove(slot);
99
106
  }
100
107
  else {
101
108
  this.slotRootNativeElementCaches.set(slot, nativeNode);
package/bundles/index.js CHANGED
@@ -15,6 +15,7 @@ class Adapter extends platformBrowser.DomAdapter {
15
15
  this.onViewUpdated = new stream.Subject();
16
16
  this.components = {};
17
17
  this.componentRefs = new WeakMap();
18
+ this.componentRendingStack = [];
18
19
  Object.keys(components).forEach(key => {
19
20
  const vueComponent = components[key];
20
21
  const setup = vueComponent.setup;
@@ -36,6 +37,7 @@ class Adapter extends platformBrowser.DomAdapter {
36
37
  }
37
38
  });
38
39
  vue.onUpdated(() => {
40
+ component.changeMarker.rendered();
39
41
  self.onViewUpdated.next();
40
42
  });
41
43
  vue.onUnmounted(() => {
@@ -49,22 +51,27 @@ class Adapter extends platformBrowser.DomAdapter {
49
51
  componentRender(component) {
50
52
  const comp = this.components[component.name] || this.components['*'];
51
53
  if (comp) {
52
- component.changeMarker.rendered();
53
54
  let rootRef = this.componentRefs.get(component);
54
55
  if (!rootRef) {
55
56
  rootRef = vue.ref();
56
57
  this.componentRefs.set(component, rootRef);
57
58
  }
58
- return vue.h(comp, {
59
+ component.__slots__.length = 0;
60
+ this.componentRendingStack.push(component);
61
+ const vNode = vue.h(comp, {
59
62
  component,
60
63
  rootRef,
61
64
  key: component.id
62
65
  });
66
+ this.componentRendingStack.pop();
67
+ return vNode;
63
68
  }
64
69
  throw adapterError(`cannot found view component \`${component.name}\`!`);
65
70
  }
66
- slotRender(slot, slotHostRender) {
67
- const vElement = slot.toTree(slotHostRender);
71
+ slotRender(slot, slotHostRender, renderEnv) {
72
+ const context = this.componentRendingStack[this.componentRendingStack.length - 1];
73
+ context.__slots__.push(slot);
74
+ const vElement = slot.toTree(slotHostRender, renderEnv);
68
75
  this.slotRootVElementCaches.set(slot, vElement);
69
76
  const vNodeToJSX = (vNode) => {
70
77
  const children = [];
@@ -97,7 +104,7 @@ class Adapter extends platformBrowser.DomAdapter {
97
104
  };
98
105
  const refFn = (nativeNode) => {
99
106
  if (!nativeNode) {
100
- this.slotRootNativeElementCaches.remove(nativeNode);
107
+ this.slotRootNativeElementCaches.remove(slot);
101
108
  }
102
109
  else {
103
110
  this.slotRootNativeElementCaches.set(slot, nativeNode);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@textbus/adapter-vue",
3
- "version": "4.0.0-alpha.3",
3
+ "version": "4.0.0-alpha.30",
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",
@@ -25,9 +25,9 @@
25
25
  "typescript editor"
26
26
  ],
27
27
  "dependencies": {
28
- "@tanbo/stream": "^1.2.0",
29
- "@textbus/core": "^4.0.0-alpha.1",
30
- "@textbus/platform-browser": "^4.0.0-alpha.1",
28
+ "@tanbo/stream": "^1.2.3",
29
+ "@textbus/core": "^4.0.0-alpha.30",
30
+ "@textbus/platform-browser": "^4.0.0-alpha.30",
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": "cf4fd289b73bc777124a32fe42bb58eba05a34f1"
51
+ "gitHead": "9b14d8cf2a2473f31a36b51ee3d988ddecf776fb"
52
52
  }