@textbus/adapter-viewfly 4.0.0-alpha.9 → 4.0.1

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 (6) hide show
  1. package/bundles/index.esm.js +106 -88
  2. package/bundles/index.js +109 -87
  3. package/bundles/public-api.d.ts +3 -1
  4. package/bundles/viewfly-adapter.d.ts +16 -0
  5. package/package.json +8 -6
  6. package/bundles/adapter.d.ts +0 -22
package/bundles/index.esm.js CHANGED
@@ -1,24 +1,108 @@
1
- import { getCurrentInstance, onUpdated, useRef, jsx, Ref } from '@viewfly/core';
2
- import { Subject } from '@tanbo/stream';
3
- import { makeError, VElement, VTextNode, replaceEmpty } from '@textbus/core';
1
+ export { NodeViewAdapter as ViewflyVDomAdapter } from '@textbus/platform-node';
2
+ import { makeError, VElement, VTextNode, merge } from '@textbus/core';
3
+ import { createDynamicRef, DynamicRef, jsx, withAnnotation, getCurrentInstance, onUpdated } from '@viewfly/core';
4
4
  import { DomAdapter } from '@textbus/platform-browser';
5
5
 
6
- const adapterError = makeError('ViewflyAdapter');
7
- /**
8
- * Textbus 桥接 [Viewfly](https://viewfly.org) 渲染能力适配器，用于在 Viewfly 项目中渲染 Textbus 数据
9
- */
10
- class Adapter extends DomAdapter {
6
+ const adapterError = makeError('ViewflyDOMRenderer');
7
+ class ViewflyAdapter extends DomAdapter {
11
8
  constructor(components, mount) {
12
- super(mount);
13
- this.onViewUpdated = new Subject();
9
+ super({
10
+ createCompositionNode(compositionState, updateNativeCompositionNode) {
11
+ const ref = createDynamicRef(node => {
12
+ updateNativeCompositionNode(node);
13
+ return () => {
14
+ updateNativeCompositionNode(null);
15
+ };
16
+ });
17
+ return new VElement('span', {
18
+ style: {
19
+ textDecoration: 'underline'
20
+ },
21
+ ref
22
+ }, [
23
+ new VTextNode(compositionState.text)
24
+ ]);
25
+ },
26
+ getParentNode(node) {
27
+ return node.parentNode;
28
+ },
29
+ getChildNodes(parentElement) {
30
+ return Array.from(parentElement.childNodes);
31
+ },
32
+ isNativeElementNode(node) {
33
+ return node instanceof HTMLElement;
34
+ },
35
+ getChildByIndex(parentElement, index) {
36
+ return parentElement.childNodes[index];
37
+ },
38
+ getAndUpdateSlotRootNativeElement(vEle, update) {
39
+ const currentRef = vEle.attrs.get('ref');
40
+ const ref = createDynamicRef(nativeNode => {
41
+ update(nativeNode);
42
+ return () => {
43
+ update(null);
44
+ };
45
+ });
46
+ if (currentRef instanceof DynamicRef) {
47
+ vEle.attrs.set('ref', [currentRef, ref]);
48
+ }
49
+ else if (Array.isArray(currentRef)) {
50
+ currentRef.push(ref);
51
+ }
52
+ else {
53
+ vEle.attrs.set('ref', ref);
54
+ }
55
+ },
56
+ componentRender: (component) => {
57
+ const comp = this.components[component.name] || this.components['*'];
58
+ if (comp) {
59
+ let ref = this.componentRefs.get(component);
60
+ if (!ref) {
61
+ ref = createDynamicRef(rootNode => {
62
+ this.componentRootElementCaches.set(component, rootNode);
63
+ return () => {
64
+ this.componentRootElementCaches.remove(component);
65
+ };
66
+ });
67
+ this.componentRefs.set(component, ref);
68
+ }
69
+ return jsx(comp, {
70
+ component,
71
+ rootRef: ref
72
+ }, component.id);
73
+ }
74
+ throw adapterError(`cannot found view component \`${component.name}\`!`);
75
+ },
76
+ vElementToViewElement(vNode, children) {
77
+ const key = vNode.attrs.get('key');
78
+ vNode.attrs.delete('key');
79
+ const props = Object.assign({}, (Array.from(vNode.attrs).reduce((a, b) => {
80
+ a[b[0]] = b[1];
81
+ return a;
82
+ }, {})));
83
+ if (vNode.classes.size) {
84
+ props.class = Array.from(vNode.classes).join(' ');
85
+ }
86
+ if (vNode.styles) {
87
+ props.style = Array.from(vNode.styles).reduce((a, b) => {
88
+ a[b[0]] = b[1];
89
+ return a;
90
+ }, {});
91
+ }
92
+ if (children.length) {
93
+ props.children = children;
94
+ }
95
+ return jsx(vNode.tagName, props, key);
96
+ }
97
+ }, mount);
14
98
  this.components = {};
15
99
  this.componentRefs = new WeakMap();
16
100
  let isRoot = true;
17
- Object.keys(components).forEach(key => {
18
- this.components[key] = (props) => {
101
+ Object.entries(components).forEach(([key, viewFlyComponent]) => {
102
+ this.components[key] = withAnnotation(Object.assign({}, viewFlyComponent.annotation), (props) => {
19
103
  const comp = getCurrentInstance();
20
104
  const textbusComponent = props.component;
21
- textbusComponent.changeMarker.onChange.subscribe(() => {
105
+ merge(textbusComponent.changeMarker.onChange, textbusComponent.changeMarker.onForceChange).subscribe(() => {
22
106
  if (textbusComponent.changeMarker.dirty) {
23
107
  comp.markAsDirtied();
24
108
  }
@@ -31,84 +115,18 @@ class Adapter extends DomAdapter {
31
115
  }
32
116
  onUpdated(() => {
33
117
  textbusComponent.changeMarker.rendered();
118
+ if (!this.componentRootElementCaches.get(textbusComponent)) {
119
+ // eslint-disable-next-line max-len
120
+ throw adapterError(`Component \`${textbusComponent.name}\` is not bound to rootRef, you must bind rootRef to the root element node of the component view.`);
121
+ }
34
122
  });
35
- return components[key](props);
36
- };
123
+ return viewFlyComponent(props);
124
+ });
37
125
  });
38
126
  }
39
- componentRender(component) {
40
- const comp = this.components[component.name] || this.components['*'];
41
- if (comp) {
42
- component.changeMarker.rendered();
43
- let ref = this.componentRefs.get(component);
44
- if (!ref) {
45
- ref = useRef(rootNode => {
46
- this.componentRootElementCaches.set(component, rootNode);
47
- return () => {
48
- this.componentRootElementCaches.remove(component);
49
- };
50
- });
51
- this.componentRefs.set(component, ref);
52
- }
53
- return jsx(comp, {
54
- component,
55
- rootRef: ref
56
- }, component.id);
57
- }
58
- throw adapterError(`cannot found view component \`${component.name}\`!`);
59
- }
60
- slotRender(slot, slotHostRender, renderEnv) {
61
- const vElement = slot.toTree(slotHostRender, renderEnv);
62
- this.slotRootVElementCaches.set(slot, vElement);
63
- const vNodeToJSX = (vNode) => {
64
- const children = [];
65
- for (let i = 0; i < vNode.children.length; i++) {
66
- const child = vNode.children[i];
67
- if (child instanceof VElement) {
68
- children.push(vNodeToJSX(child));
69
- }
70
- else if (child instanceof VTextNode) {
71
- children.push(replaceEmpty(child.textContent));
72
- }
73
- else {
74
- children.push(this.componentRender(child));
75
- }
76
- }
77
- const props = Object.assign({}, (Array.from(vNode.attrs).reduce((a, b) => {
78
- a[b[0]] = b[1];
79
- return a;
80
- }, {})));
81
- if (vNode.classes.size) {
82
- props.class = Array.from(vNode.classes).join(' ');
83
- }
84
- if (vNode.styles) {
85
- props.style = Array.from(vNode.styles).reduce((a, b) => {
86
- a[b[0]] = b[1];
87
- return a;
88
- }, {});
89
- }
90
- if (children.length) {
91
- props.children = children;
92
- }
93
- return jsx(vNode.tagName, props);
94
- };
95
- const jsxNode = vNodeToJSX(vElement);
96
- const currentRef = jsxNode.props.ref;
97
- const ref = useRef(nativeNode => {
98
- this.slotRootNativeElementCaches.set(slot, nativeNode);
99
- });
100
- if (currentRef instanceof Ref) {
101
- jsxNode.props.ref = [currentRef, ref];
102
- }
103
- else if (Array.isArray(currentRef)) {
104
- currentRef.push(ref);
105
- }
106
- else {
107
- jsxNode.props.ref = ref;
108
- }
109
- slot.changeMarker.rendered();
110
- return jsxNode;
127
+ copy() {
128
+ document.execCommand('copy');
111
129
  }
112
130
  }
113
131
 
114
- export { Adapter };
132
+ export { ViewflyAdapter };
package/bundles/index.js CHANGED
@@ -1,26 +1,110 @@
1
1
  'use strict';
2
2
 
3
- var core$1 = require('@viewfly/core');
4
- var stream = require('@tanbo/stream');
3
+ var platformNode = require('@textbus/platform-node');
5
4
  var core = require('@textbus/core');
5
+ var core$1 = require('@viewfly/core');
6
6
  var platformBrowser = require('@textbus/platform-browser');
7
7
 
8
- const adapterError = core.makeError('ViewflyAdapter');
9
- /**
10
- * Textbus 桥接 [Viewfly](https://viewfly.org) 渲染能力适配器，用于在 Viewfly 项目中渲染 Textbus 数据
11
- */
12
- class Adapter extends platformBrowser.DomAdapter {
8
+ const adapterError = core.makeError('ViewflyDOMRenderer');
9
+ class ViewflyAdapter extends platformBrowser.DomAdapter {
13
10
  constructor(components, mount) {
14
- super(mount);
15
- this.onViewUpdated = new stream.Subject();
11
+ super({
12
+ createCompositionNode(compositionState, updateNativeCompositionNode) {
13
+ const ref = core$1.createDynamicRef(node => {
14
+ updateNativeCompositionNode(node);
15
+ return () => {
16
+ updateNativeCompositionNode(null);
17
+ };
18
+ });
19
+ return new core.VElement('span', {
20
+ style: {
21
+ textDecoration: 'underline'
22
+ },
23
+ ref
24
+ }, [
25
+ new core.VTextNode(compositionState.text)
26
+ ]);
27
+ },
28
+ getParentNode(node) {
29
+ return node.parentNode;
30
+ },
31
+ getChildNodes(parentElement) {
32
+ return Array.from(parentElement.childNodes);
33
+ },
34
+ isNativeElementNode(node) {
35
+ return node instanceof HTMLElement;
36
+ },
37
+ getChildByIndex(parentElement, index) {
38
+ return parentElement.childNodes[index];
39
+ },
40
+ getAndUpdateSlotRootNativeElement(vEle, update) {
41
+ const currentRef = vEle.attrs.get('ref');
42
+ const ref = core$1.createDynamicRef(nativeNode => {
43
+ update(nativeNode);
44
+ return () => {
45
+ update(null);
46
+ };
47
+ });
48
+ if (currentRef instanceof core$1.DynamicRef) {
49
+ vEle.attrs.set('ref', [currentRef, ref]);
50
+ }
51
+ else if (Array.isArray(currentRef)) {
52
+ currentRef.push(ref);
53
+ }
54
+ else {
55
+ vEle.attrs.set('ref', ref);
56
+ }
57
+ },
58
+ componentRender: (component) => {
59
+ const comp = this.components[component.name] || this.components['*'];
60
+ if (comp) {
61
+ let ref = this.componentRefs.get(component);
62
+ if (!ref) {
63
+ ref = core$1.createDynamicRef(rootNode => {
64
+ this.componentRootElementCaches.set(component, rootNode);
65
+ return () => {
66
+ this.componentRootElementCaches.remove(component);
67
+ };
68
+ });
69
+ this.componentRefs.set(component, ref);
70
+ }
71
+ return core$1.jsx(comp, {
72
+ component,
73
+ rootRef: ref
74
+ }, component.id);
75
+ }
76
+ throw adapterError(`cannot found view component \`${component.name}\`!`);
77
+ },
78
+ vElementToViewElement(vNode, children) {
79
+ const key = vNode.attrs.get('key');
80
+ vNode.attrs.delete('key');
81
+ const props = Object.assign({}, (Array.from(vNode.attrs).reduce((a, b) => {
82
+ a[b[0]] = b[1];
83
+ return a;
84
+ }, {})));
85
+ if (vNode.classes.size) {
86
+ props.class = Array.from(vNode.classes).join(' ');
87
+ }
88
+ if (vNode.styles) {
89
+ props.style = Array.from(vNode.styles).reduce((a, b) => {
90
+ a[b[0]] = b[1];
91
+ return a;
92
+ }, {});
93
+ }
94
+ if (children.length) {
95
+ props.children = children;
96
+ }
97
+ return core$1.jsx(vNode.tagName, props, key);
98
+ }
99
+ }, mount);
16
100
  this.components = {};
17
101
  this.componentRefs = new WeakMap();
18
102
  let isRoot = true;
19
- Object.keys(components).forEach(key => {
20
- this.components[key] = (props) => {
103
+ Object.entries(components).forEach(([key, viewFlyComponent]) => {
104
+ this.components[key] = core$1.withAnnotation(Object.assign({}, viewFlyComponent.annotation), (props) => {
21
105
  const comp = core$1.getCurrentInstance();
22
106
  const textbusComponent = props.component;
23
- textbusComponent.changeMarker.onChange.subscribe(() => {
107
+ core.merge(textbusComponent.changeMarker.onChange, textbusComponent.changeMarker.onForceChange).subscribe(() => {
24
108
  if (textbusComponent.changeMarker.dirty) {
25
109
  comp.markAsDirtied();
26
110
  }
@@ -33,84 +117,22 @@ class Adapter extends platformBrowser.DomAdapter {
33
117
  }
34
118
  core$1.onUpdated(() => {
35
119
  textbusComponent.changeMarker.rendered();
120
+ if (!this.componentRootElementCaches.get(textbusComponent)) {
121
+ // eslint-disable-next-line max-len
122
+ throw adapterError(`Component \`${textbusComponent.name}\` is not bound to rootRef, you must bind rootRef to the root element node of the component view.`);
123
+ }
36
124
  });
37
- return components[key](props);
38
- };
125
+ return viewFlyComponent(props);
126
+ });
39
127
  });
40
128
  }
41
- componentRender(component) {
42
- const comp = this.components[component.name] || this.components['*'];
43
- if (comp) {
44
- component.changeMarker.rendered();
45
- let ref = this.componentRefs.get(component);
46
- if (!ref) {
47
- ref = core$1.useRef(rootNode => {
48
- this.componentRootElementCaches.set(component, rootNode);
49
- return () => {
50
- this.componentRootElementCaches.remove(component);
51
- };
52
- });
53
- this.componentRefs.set(component, ref);
54
- }
55
- return core$1.jsx(comp, {
56
- component,
57
- rootRef: ref
58
- }, component.id);
59
- }
60
- throw adapterError(`cannot found view component \`${component.name}\`!`);
61
- }
62
- slotRender(slot, slotHostRender, renderEnv) {
63
- const vElement = slot.toTree(slotHostRender, renderEnv);
64
- this.slotRootVElementCaches.set(slot, vElement);
65
- const vNodeToJSX = (vNode) => {
66
- const children = [];
67
- for (let i = 0; i < vNode.children.length; i++) {
68
- const child = vNode.children[i];
69
- if (child instanceof core.VElement) {
70
- children.push(vNodeToJSX(child));
71
- }
72
- else if (child instanceof core.VTextNode) {
73
- children.push(core.replaceEmpty(child.textContent));
74
- }
75
- else {
76
- children.push(this.componentRender(child));
77
- }
78
- }
79
- const props = Object.assign({}, (Array.from(vNode.attrs).reduce((a, b) => {
80
- a[b[0]] = b[1];
81
- return a;
82
- }, {})));
83
- if (vNode.classes.size) {
84
- props.class = Array.from(vNode.classes).join(' ');
85
- }
86
- if (vNode.styles) {
87
- props.style = Array.from(vNode.styles).reduce((a, b) => {
88
- a[b[0]] = b[1];
89
- return a;
90
- }, {});
91
- }
92
- if (children.length) {
93
- props.children = children;
94
- }
95
- return core$1.jsx(vNode.tagName, props);
96
- };
97
- const jsxNode = vNodeToJSX(vElement);
98
- const currentRef = jsxNode.props.ref;
99
- const ref = core$1.useRef(nativeNode => {
100
- this.slotRootNativeElementCaches.set(slot, nativeNode);
101
- });
102
- if (currentRef instanceof core$1.Ref) {
103
- jsxNode.props.ref = [currentRef, ref];
104
- }
105
- else if (Array.isArray(currentRef)) {
106
- currentRef.push(ref);
107
- }
108
- else {
109
- jsxNode.props.ref = ref;
110
- }
111
- slot.changeMarker.rendered();
112
- return jsxNode;
129
+ copy() {
130
+ document.execCommand('copy');
113
131
  }
114
132
  }
115
133
 
116
- exports.Adapter = Adapter;
134
+ Object.defineProperty(exports, 'ViewflyVDomAdapter', {
135
+ enumerable: true,
136
+ get: function () { return platformNode.NodeViewAdapter; }
137
+ });
138
+ exports.ViewflyAdapter = ViewflyAdapter;
package/bundles/public-api.d.ts CHANGED
@@ -1 +1,3 @@
1
- export * from './adapter';
1
+ import { NodeViewAdapter as ViewflyVDomAdapter } from '@textbus/platform-node';
2
+ export * from './viewfly-adapter';
3
+ export { ViewflyVDomAdapter };
package/bundles/viewfly-adapter.d.ts ADDED
@@ -0,0 +1,16 @@
1
+ import { Component, ViewMount } from '@textbus/core';
2
+ import { ComponentSetup, DynamicRef, JSXNode } from '@viewfly/core';
3
+ import { DomAdapter } from '@textbus/platform-browser';
4
+ export interface ViewComponentProps<T extends Component> {
5
+ component: T;
6
+ rootRef: DynamicRef<HTMLElement>;
7
+ }
8
+ export interface ViewflyAdapterComponents {
9
+ [key: string]: ComponentSetup<ViewComponentProps<any>>;
10
+ }
11
+ export declare class ViewflyAdapter extends DomAdapter<JSXNode, Element> {
12
+ private components;
13
+ private componentRefs;
14
+ constructor(components: ViewflyAdapterComponents, mount: ViewMount<JSXNode, HTMLElement>);
15
+ copy(): void;
16
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@textbus/adapter-viewfly",
3
- "version": "4.0.0-alpha.9",
3
+ "version": "4.0.1",
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,10 +25,12 @@
25
25
  "typescript editor"
26
26
  ],
27
27
  "dependencies": {
28
- "@tanbo/stream": "^1.2.0",
29
- "@textbus/core": "^4.0.0-alpha.8",
30
- "@textbus/platform-browser": "^4.0.0-alpha.8",
31
- "@viewfly/core": "^0.3.0"
28
+ "@tanbo/stream": "^1.2.5",
29
+ "@textbus/core": "^4.0.1",
30
+ "@textbus/platform-browser": "^4.0.1",
31
+ "@textbus/platform-node": "^4.0.1",
32
+ "@viewfly/core": "^1.0.0-alpha.22",
33
+ "@viewfly/platform-browser": "^1.0.0-alpha.22"
32
34
  },
33
35
  "devDependencies": {
34
36
  "@rollup/plugin-commonjs": "^23.0.2",
@@ -48,5 +50,5 @@
48
50
  "bugs": {
49
51
  "url": "https://github.com/textbus/textbus.git/issues"
50
52
  },
51
- "gitHead": "aedc8b31ad474c0b09ac356a42365f2bce61c19e"
53
+ "gitHead": "650431b993553439e58d48949bd9cadda23fb147"
52
54
  }
package/bundles/adapter.d.ts DELETED
@@ -1,22 +0,0 @@
1
- import { JSXComponent, JSXInternal, Ref } from '@viewfly/core';
2
- import { Subject } from '@tanbo/stream';
3
- import { Component, ComponentInstance, ExtractComponentInstanceType, Slot, VElement, VTextNode } from '@textbus/core';
4
- import { DomAdapter } from '@textbus/platform-browser';
5
- export interface ViewComponentProps<T extends Component = Component> {
6
- component: ExtractComponentInstanceType<T>;
7
- rootRef: Ref<HTMLElement>;
8
- }
9
- export interface ViewflyAdapterComponents {
10
- [key: string]: JSXInternal.ComponentSetup<ViewComponentProps>;
11
- }
12
- /**
13
- * Textbus 桥接 [Viewfly](https://viewfly.org) 渲染能力适配器，用于在 Viewfly 项目中渲染 Textbus 数据
14
- */
15
- export declare class Adapter extends DomAdapter<JSXComponent, JSXInternal.Element> {
16
- onViewUpdated: Subject<void>;
17
- private components;
18
- private componentRefs;
19
- constructor(components: ViewflyAdapterComponents, mount: (host: HTMLElement, root: JSXComponent) => (void | (() => void)));
20
- componentRender(component: ComponentInstance): JSXInternal.JSXNode;
21
- slotRender(slot: Slot, slotHostRender: (children: Array<VElement | VTextNode | ComponentInstance>) => VElement, renderEnv?: any): JSXInternal.Element;
22
- }