@textbus/adapter-vue 4.0.0-alpha.45 → 4.0.0-alpha.46

Sign up to get free protection for your applications and to get access to all the features.
Files changed (3) hide show
  1. package/bundles/index.esm.js +61 -1
  2. package/bundles/index.js +60 -0
  3. package/package.json +4 -4
package/bundles/index.esm.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import { makeError, VElement, VTextNode } from '@textbus/core';
2
- import { ref, h } from 'vue';
2
+ import { ref, h, getCurrentInstance, onMounted, onUpdated, onUnmounted } from 'vue';
3
3
  import { DomAdapter } from '@textbus/platform-browser';
4
4
 
5
5
  const adapterError = makeError('VueAdapter');
@@ -81,6 +81,66 @@ class VueAdapter extends DomAdapter {
81
81
  // private compositionRef = ref<HTMLElement>()
82
82
  this.componentRefs = new WeakMap();
83
83
  this.components = {};
84
+ // watchEffect(() => {
85
+ // this.compositionNode = this.compositionRef.value || null
86
+ // })
87
+ Object.keys(components).forEach(key => {
88
+ const vueComponent = components[key];
89
+ const setup = vueComponent.setup;
90
+ const self = this;
91
+ vueComponent.setup = function (props) {
92
+ const component = props.component;
93
+ const vueInstance = getCurrentInstance();
94
+ const sub = component.changeMarker.onChange.subscribe(() => {
95
+ if (component.changeMarker.dirty) {
96
+ vueInstance.proxy.$forceUpdate();
97
+ }
98
+ });
99
+ onMounted(() => {
100
+ if (props.rootRef.value) {
101
+ self.componentRootElementCaches.set(component, props.rootRef.value);
102
+ }
103
+ else {
104
+ self.componentRootElementCaches.remove(component);
105
+ }
106
+ });
107
+ onUpdated(() => {
108
+ var _a;
109
+ const context = self.componentRendingStack[self.componentRendingStack.length - 1];
110
+ if (context === component) {
111
+ self.componentRendingStack.pop();
112
+ }
113
+ component.changeMarker.rendered();
114
+ self.onViewUpdated.next();
115
+ if (!(((_a = self.componentRefs.get(component)) === null || _a === void 0 ? void 0 : _a.value) instanceof HTMLElement)) {
116
+ // eslint-disable-next-line max-len
117
+ throw adapterError(`Component \`${component.name}\` is not bound to rootRef, you must bind rootRef to the root element node of the component view.`);
118
+ }
119
+ });
120
+ onUnmounted(() => {
121
+ sub.unsubscribe();
122
+ });
123
+ const result = setup(props);
124
+ if (typeof result === 'function') {
125
+ return function () {
126
+ component.__slots__.forEach(i => self.renderedSlotCache.delete(i));
127
+ component.__slots__.length = 0;
128
+ self.componentRendingStack.push(component);
129
+ return result();
130
+ };
131
+ }
132
+ return result;
133
+ };
134
+ if (vueComponent.render) {
135
+ const oldRender = vueComponent.render;
136
+ vueComponent.render = function (context, ...args) {
137
+ context.component.__slots__.length = 0;
138
+ self.componentRendingStack.push(context.component);
139
+ return oldRender.apply(this, [context, ...args]);
140
+ };
141
+ }
142
+ this.components[key] = vueComponent;
143
+ });
84
144
  }
85
145
  copy() {
86
146
  document.execCommand('copy');
package/bundles/index.js CHANGED
@@ -83,6 +83,66 @@ class VueAdapter extends platformBrowser.DomAdapter {
83
83
  // private compositionRef = ref<HTMLElement>()
84
84
  this.componentRefs = new WeakMap();
85
85
  this.components = {};
86
+ // watchEffect(() => {
87
+ // this.compositionNode = this.compositionRef.value || null
88
+ // })
89
+ Object.keys(components).forEach(key => {
90
+ const vueComponent = components[key];
91
+ const setup = vueComponent.setup;
92
+ const self = this;
93
+ vueComponent.setup = function (props) {
94
+ const component = props.component;
95
+ const vueInstance = vue.getCurrentInstance();
96
+ const sub = component.changeMarker.onChange.subscribe(() => {
97
+ if (component.changeMarker.dirty) {
98
+ vueInstance.proxy.$forceUpdate();
99
+ }
100
+ });
101
+ vue.onMounted(() => {
102
+ if (props.rootRef.value) {
103
+ self.componentRootElementCaches.set(component, props.rootRef.value);
104
+ }
105
+ else {
106
+ self.componentRootElementCaches.remove(component);
107
+ }
108
+ });
109
+ vue.onUpdated(() => {
110
+ var _a;
111
+ const context = self.componentRendingStack[self.componentRendingStack.length - 1];
112
+ if (context === component) {
113
+ self.componentRendingStack.pop();
114
+ }
115
+ component.changeMarker.rendered();
116
+ self.onViewUpdated.next();
117
+ if (!(((_a = self.componentRefs.get(component)) === null || _a === void 0 ? void 0 : _a.value) instanceof HTMLElement)) {
118
+ // eslint-disable-next-line max-len
119
+ throw adapterError(`Component \`${component.name}\` is not bound to rootRef, you must bind rootRef to the root element node of the component view.`);
120
+ }
121
+ });
122
+ vue.onUnmounted(() => {
123
+ sub.unsubscribe();
124
+ });
125
+ const result = setup(props);
126
+ if (typeof result === 'function') {
127
+ return function () {
128
+ component.__slots__.forEach(i => self.renderedSlotCache.delete(i));
129
+ component.__slots__.length = 0;
130
+ self.componentRendingStack.push(component);
131
+ return result();
132
+ };
133
+ }
134
+ return result;
135
+ };
136
+ if (vueComponent.render) {
137
+ const oldRender = vueComponent.render;
138
+ vueComponent.render = function (context, ...args) {
139
+ context.component.__slots__.length = 0;
140
+ self.componentRendingStack.push(context.component);
141
+ return oldRender.apply(this, [context, ...args]);
142
+ };
143
+ }
144
+ this.components[key] = vueComponent;
145
+ });
86
146
  }
87
147
  copy() {
88
148
  document.execCommand('copy');
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@textbus/adapter-vue",
3
- "version": "4.0.0-alpha.45",
3
+ "version": "4.0.0-alpha.46",
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.45",
30
- "@textbus/platform-browser": "^4.0.0-alpha.45",
29
+ "@textbus/core": "^4.0.0-alpha.46",
30
+ "@textbus/platform-browser": "^4.0.0-alpha.46",
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": "c41bde494a0bbf6c58cb9ea7400e068ed6acada3"
51
+ "gitHead": "7dfdc91ecd8ddef5746e9dd1f84f795c0529dc11"
52
52
  }