@textbus/adapter-react 4.0.0-alpha.23 → 4.0.0-alpha.26

package/bundles/adapter.d.ts

@@ -1,13 +1,13 @@
 import { JSX } from 'react';
 import { Subject } from '@tanbo/stream';
-import { Component, ComponentInstance, ExtractComponentInstanceType, Slot, VElement, VTextNode } from '@textbus/core';
+import { Component, Slot, VElement, VTextNode } from '@textbus/core';
 import { DomAdapter } from '@textbus/platform-browser';
-export interface ViewComponentProps<T extends Component = Component> {
-    component: ExtractComponentInstanceType<T>;
+export interface ViewComponentProps<T extends Component> {
+    component: T;
     rootRef: ((rootNode: HTMLElement) => void);
 }
 export interface ReactAdapterComponents {
-    [key: string]: (props: ViewComponentProps) => JSX.Element;
+    [key: string]: (props: ViewComponentProps<any>) => JSX.Element;
 }
 /**
  * Textbus 桥接 React 渲染能力适配器，用于在 React 项目中渲染 Textbus 数据
@@ -15,7 +15,8 @@ export interface ReactAdapterComponents {
 export declare class Adapter extends DomAdapter<JSX.Element, JSX.Element> {
     onViewUpdated: Subject<void>;
     private components;
+    private componentRendingStack;
     constructor(components: ReactAdapterComponents, mount: (host: HTMLElement, root: JSX.Element) => (void | (() => void)));
-    componentRender(component: ComponentInstance): JSX.Element;
-    slotRender(slot: Slot, slotHostRender: (children: Array<VElement | VTextNode | ComponentInstance>) => VElement, renderEnv?: any): JSX.Element;
+    componentRender(component: Component): JSX.Element;
+    slotRender(slot: Slot, slotHostRender: (children: Array<VElement | VTextNode | Component>) => VElement, renderEnv?: any): JSX.Element;
 }

package/bundles/index.esm.js

@@ -24,6 +24,7 @@ class Adapter extends DomAdapter {
         super(mount);
         this.onViewUpdated = new Subject();
         this.components = {};
+        this.componentRendingStack = [];
         Object.keys(components).forEach(key => {
             this.components[key] = (props) => {
                 const component = props.component;
@@ -41,7 +42,9 @@ class Adapter extends DomAdapter {
                 useEffect(() => {
                     this.onViewUpdated.next();
                 }, [updateKey]);
-                return components[key]({
+                component.__slots__.length = 0;
+                this.componentRendingStack.push(component);
+                const vNode = components[key]({
                     component,
                     rootRef: (rootNode) => {
                         if (rootNode) {
@@ -52,6 +55,8 @@ class Adapter extends DomAdapter {
                         }
                     }
                 });
+                this.componentRendingStack.pop();
+                return vNode;
             };
         });
     }
@@ -67,6 +72,8 @@ class Adapter extends DomAdapter {
         throw adapterError(`cannot found view component \`${component.name}\`!`);
     }
     slotRender(slot, slotHostRender, renderEnv) {
+        const context = this.componentRendingStack[this.componentRendingStack.length - 1];
+        context.__slots__.push(slot);
         const vElement = slot.toTree(slotHostRender, renderEnv);
         this.slotRootVElementCaches.set(slot, vElement);
         const vNodeToJSX = (vNode) => {

package/bundles/index.js

@@ -26,6 +26,7 @@ class Adapter extends platformBrowser.DomAdapter {
         super(mount);
         this.onViewUpdated = new stream.Subject();
         this.components = {};
+        this.componentRendingStack = [];
         Object.keys(components).forEach(key => {
             this.components[key] = (props) => {
                 const component = props.component;
@@ -43,7 +44,9 @@ class Adapter extends platformBrowser.DomAdapter {
                 react.useEffect(() => {
                     this.onViewUpdated.next();
                 }, [updateKey]);
-                return components[key]({
+                component.__slots__.length = 0;
+                this.componentRendingStack.push(component);
+                const vNode = components[key]({
                     component,
                     rootRef: (rootNode) => {
                         if (rootNode) {
@@ -54,6 +57,8 @@ class Adapter extends platformBrowser.DomAdapter {
                         }
                     }
                 });
+                this.componentRendingStack.pop();
+                return vNode;
             };
         });
     }
@@ -69,6 +74,8 @@ class Adapter extends platformBrowser.DomAdapter {
         throw adapterError(`cannot found view component \`${component.name}\`!`);
     }
     slotRender(slot, slotHostRender, renderEnv) {
+        const context = this.componentRendingStack[this.componentRendingStack.length - 1];
+        context.__slots__.push(slot);
         const vElement = slot.toTree(slotHostRender, renderEnv);
         this.slotRootVElementCaches.set(slot, vElement);
         const vNodeToJSX = (vNode) => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@textbus/adapter-react",
-  "version": "4.0.0-alpha.23",
+  "version": "4.0.0-alpha.26",
   "description": "Textbus is a rich text editor and framework that is highly customizable and extensible to achieve rich wysiwyg effects.",
   "main": "./bundles/index.js",
   "module": "./bundles/index.esm.js",
@@ -26,8 +26,8 @@
   ],
   "dependencies": {
     "@tanbo/stream": "^1.2.3",
-    "@textbus/core": "^4.0.0-alpha.23",
-    "@textbus/platform-browser": "^4.0.0-alpha.23",
+    "@textbus/core": "^4.0.0-alpha.26",
+    "@textbus/platform-browser": "^4.0.0-alpha.26",
     "react": "^17.0.0 || ^18.0.0"
   },
   "devDependencies": {
@@ -49,5 +49,5 @@
   "bugs": {
     "url": "https://github.com/textbus/textbus.git/issues"
   },
-  "gitHead": "9e6009fcccc582cc91aca24e39af5a64e012f07e"
+  "gitHead": "36aff3db9897ccd73ba4533972991d537778bd6e"
 }