@rsmax/runtime 1.0.1

package/esm/VNode.d.ts

@@ -0,0 +1,45 @@
+import Container from './Container';
+export interface RawNode {
+    id: number;
+    type: string;
+    props?: any;
+    nodes?: {
+        [key: number]: RawNode;
+    };
+    children?: Array<RawNode | number>;
+    text?: string;
+}
+export default class VNode {
+    id: number;
+    container: Container;
+    mounted: boolean;
+    deleted: boolean;
+    type: string;
+    props?: any;
+    parent: VNode | null;
+    firstChild: VNode | null;
+    lastChild: VNode | null;
+    size: number;
+    previousSibling: VNode | null;
+    nextSibling: VNode | null;
+    text?: string;
+    callbackIds: Set<string>;
+    constructor({ id, type, props, container }: {
+        id: number;
+        type: string;
+        props?: any;
+        container: any;
+    });
+    appendChild(node: VNode): void;
+    removeChild(node: VNode): void;
+    insertBefore(node: VNode, referenceNode: VNode): void;
+    update(payload?: any[]): void;
+    get index(): number;
+    get children(): VNode[];
+    get path(): string[];
+    isMounted(): boolean;
+    isDeleted(): boolean;
+    registerCallback(propKey: string, propValue: any): string;
+    unregisteredCallbacks(): void;
+    toJSON(): RawNode;
+}

package/esm/VNode.js

@@ -0,0 +1,250 @@
+import propsAlias, { propAlias } from './propsAlias';
+import { REMAX_METHOD, TYPE_TEXT } from './constants';
+import { RuntimeOptions } from '@rsmax/framework-shared';
+import { createCallbackProxy } from './SyntheticEvent/createCallbackProxy';
+function toRawNode(node) {
+    if (node.type === TYPE_TEXT) {
+        return {
+            id: node.id,
+            type: node.type,
+            text: node.text,
+        };
+    }
+    return {
+        id: node.id,
+        type: node.type,
+        props: propsAlias(node.props, node.type),
+        children: [],
+        text: node.text,
+    };
+}
+function toRawProps(prop, value, type) {
+    return propAlias(prop, value, type);
+}
+export default class VNode {
+    constructor({ id, type, props, container }) {
+        this.mounted = false;
+        this.deleted = false;
+        this.parent = null;
+        this.firstChild = null;
+        this.lastChild = null;
+        this.size = 0;
+        this.previousSibling = null;
+        this.nextSibling = null;
+        this.callbackIds = new Set();
+        this.id = id;
+        this.container = container;
+        this.type = type;
+        this.props = props;
+    }
+    appendChild(node) {
+        this.removeChild(node);
+        this.size += 1;
+        node.parent = this;
+        node.deleted = false; // 交换节点时删除的节点会被复用
+        if (!this.firstChild) {
+            this.firstChild = node;
+        }
+        if (this.lastChild) {
+            this.lastChild.nextSibling = node;
+            node.previousSibling = this.lastChild;
+        }
+        this.lastChild = node;
+        if (this.isMounted()) {
+            this.container.requestUpdate({
+                type: 'splice',
+                path: this.path,
+                start: node.index,
+                id: node.id,
+                deleteCount: 0,
+                children: this.children,
+                items: [node.toJSON()],
+                node: this,
+            });
+        }
+    }
+    removeChild(node) {
+        const { previousSibling, nextSibling } = node;
+        if (node.parent !== this) {
+            return;
+        }
+        const index = node.index;
+        this.size -= 1;
+        if (this.firstChild === node) {
+            this.firstChild = node.nextSibling;
+        }
+        if (this.lastChild === node) {
+            this.lastChild = node.previousSibling;
+        }
+        if (previousSibling) {
+            previousSibling.nextSibling = nextSibling;
+        }
+        if (nextSibling) {
+            nextSibling.previousSibling = previousSibling;
+        }
+        node.previousSibling = null;
+        node.nextSibling = null;
+        node.deleted = true;
+        node.unregisteredCallbacks();
+        if (this.isMounted()) {
+            this.container.requestUpdate({
+                type: 'splice',
+                path: this.path,
+                start: index,
+                id: node.id,
+                deleteCount: 1,
+                children: this.children,
+                items: [],
+                node: this,
+            });
+        }
+    }
+    insertBefore(node, referenceNode) {
+        this.removeChild(node);
+        this.size += 1;
+        node.parent = this;
+        node.deleted = false; // 交换节点时删除的节点会被复用
+        if (referenceNode === this.firstChild) {
+            this.firstChild = node;
+        }
+        if (referenceNode.previousSibling) {
+            referenceNode.previousSibling.nextSibling = node;
+            node.previousSibling = referenceNode.previousSibling;
+        }
+        referenceNode.previousSibling = node;
+        node.nextSibling = referenceNode;
+        if (this.isMounted()) {
+            this.container.requestUpdate({
+                type: 'splice',
+                path: this.path,
+                start: node.index,
+                id: node.id,
+                deleteCount: 0,
+                children: this.children,
+                items: [node.toJSON()],
+                node: this,
+            });
+        }
+    }
+    update(payload) {
+        if (this.type === 'text' || !payload) {
+            this.container.requestUpdate({
+                type: 'splice',
+                // root 不会更新，所以肯定有 parent
+                path: this.parent.path,
+                start: this.index,
+                id: this.id,
+                deleteCount: 1,
+                items: [this.toJSON()],
+                node: this,
+            });
+            return;
+        }
+        const parentPath = this.parent.path;
+        for (let i = 0; i < payload.length; i = i + 2) {
+            const [propName, propValue] = toRawProps(payload[i], payload[i + 1], this.type);
+            let path = [...parentPath, 'nodes', this.id.toString(), 'props'];
+            if (RuntimeOptions.get('platform') === 'ali') {
+                path = [...parentPath, `children[${this.index}].props`];
+            }
+            this.container.requestUpdate({
+                type: 'set',
+                path,
+                name: propName,
+                value: propValue,
+                node: this,
+            });
+        }
+    }
+    get index() {
+        let value = 0;
+        let previousSibling = this.previousSibling;
+        while (previousSibling) {
+            value += 1;
+            previousSibling = previousSibling.previousSibling;
+        }
+        return value;
+    }
+    get children() {
+        const arr = [];
+        let item = this.firstChild;
+        while (item) {
+            arr.push(item);
+            item = item.nextSibling;
+        }
+        return arr;
+    }
+    get path() {
+        const dataPath = [];
+        const parents = [];
+        let parent = this.parent;
+        while (parent) {
+            parents.unshift(parent);
+            parent = parent.parent;
+        }
+        for (let i = 0; i < parents.length; i++) {
+            const child = parents[i + 1] || this;
+            if (RuntimeOptions.get('platform') === 'ali') {
+                dataPath.push('children');
+                dataPath.push(child.index.toString());
+            }
+            else {
+                dataPath.push('nodes');
+                dataPath.push(child.id.toString());
+            }
+        }
+        return dataPath;
+    }
+    isMounted() {
+        return this.parent ? this.parent.isMounted() : this.mounted;
+    }
+    isDeleted() {
+        var _a, _b;
+        return this.deleted === true ? this.deleted : (_b = (_a = this.parent) === null || _a === void 0 ? void 0 : _a.isDeleted()) !== null && _b !== void 0 ? _b : false;
+    }
+    registerCallback(propKey, propValue) {
+        const id = `${REMAX_METHOD}_${this.id}_${propKey}`;
+        this.callbackIds.add(id);
+        this.container.createCallback(id, createCallbackProxy(propKey, this, propValue));
+        return id;
+    }
+    unregisteredCallbacks() {
+        this.callbackIds.forEach(id => {
+            this.container.removeCallback(id);
+        });
+    }
+    toJSON() {
+        const stack = [];
+        const rawNode = toRawNode(this);
+        stack.push({
+            currentNode: rawNode,
+            children: this.children,
+        });
+        while (stack.length > 0) {
+            // while 循环已经保证了不会有空值
+            const stackItem = stack.pop();
+            const { children = [], currentNode } = stackItem;
+            for (let i = children.length - 1; i >= 0; i--) {
+                const currentVNode = children[i];
+                const currentRawNode = toRawNode(currentVNode);
+                if (RuntimeOptions.get('platform') !== 'ali') {
+                    currentNode.children.unshift(currentRawNode.id);
+                }
+                else {
+                    currentNode.children.unshift(currentRawNode);
+                }
+                if (RuntimeOptions.get('platform') !== 'ali') {
+                    if (!currentNode.nodes) {
+                        currentNode.nodes = {};
+                    }
+                    currentNode.nodes[currentRawNode.id] = currentRawNode;
+                }
+                stack.push({
+                    currentNode: currentRawNode,
+                    children: currentVNode.children,
+                });
+            }
+        }
+        return rawNode;
+    }
+}

package/esm/constants.d.ts

@@ -0,0 +1,3 @@
+export declare const REMAX_ROOT_BACKUP = "$$REMAX_ROOT_BACKUP";
+export declare const REMAX_METHOD = "$$REMAX_METHOD";
+export declare const TYPE_TEXT = "plain-text";

package/esm/constants.js

@@ -0,0 +1,3 @@
+export const REMAX_ROOT_BACKUP = '$$REMAX_ROOT_BACKUP';
+export const REMAX_METHOD = '$$REMAX_METHOD';
+export const TYPE_TEXT = 'plain-text';

package/esm/createAppConfig.d.ts

@@ -0,0 +1,2 @@
+import './polyfills/Function';
+export default function createAppConfig(this: any, App: any): any;

package/esm/createAppConfig.js

@@ -0,0 +1,95 @@
+import './polyfills/Function';
+import * as React from 'react';
+import { ForwardRef } from 'react-is';
+import render from './render';
+import AppContainer from './AppContainer';
+import { AppInstanceContext, AppLifecycle, callbackName, isClassComponent, RuntimeOptions, } from '@rsmax/framework-shared';
+class DefaultAppComponent extends React.Component {
+    render() {
+        return React.createElement(React.Fragment, this.props);
+    }
+}
+export default function createAppConfig(App) {
+    const WrappedApp = RuntimeOptions.get('pluginDriver').onAppComponent(App);
+    const createConfig = (AppComponent = DefaultAppComponent) => {
+        const config = {
+            _container: new AppContainer(),
+            _pages: [],
+            _instance: React.createRef(),
+            onLaunch(options) {
+                this._container.context = this;
+                this._render();
+                return this.callLifecycle(AppLifecycle.launch, options);
+            },
+            callLifecycle(lifecycle, ...args) {
+                const callbacks = AppInstanceContext.lifecycleCallback[lifecycle] || [];
+                let result;
+                callbacks.forEach((callback) => {
+                    result = callback(...args);
+                });
+                if (result) {
+                    return result;
+                }
+                const callback = callbackName(lifecycle);
+                if (this._instance.current && this._instance.current[callback]) {
+                    return this._instance.current[callback](...args);
+                }
+            },
+            _mount(pageInstance) {
+                /**
+                 * 飞书开发者工具的问题，这里的 this 跟 getApp 拿到的不是同一个实例
+                 */
+                if (!this._container.context) {
+                    this._container.context = this;
+                }
+                this._pages.push(pageInstance);
+                this._render();
+            },
+            _unmount(pageInstance) {
+                this._pages.splice(this._pages.indexOf(pageInstance), 1);
+                this._render();
+            },
+            _render() {
+                const props = {};
+                if (isClassComponent(AppComponent) || AppComponent.$$typeof === ForwardRef) {
+                    props.ref = this._instance;
+                }
+                return render(React.createElement(AppComponent, props, this._pages.map((p) => p.element)), this._container);
+            },
+            onShow(options) {
+                return this.callLifecycle(AppLifecycle.show, options);
+            },
+            onHide() {
+                return this.callLifecycle(AppLifecycle.hide);
+            },
+            onError(error) {
+                return this.callLifecycle(AppLifecycle.error, error);
+            },
+            // 微信
+            onPageNotFound(options) {
+                return this.callLifecycle(AppLifecycle.pageNotFound, options);
+            },
+            // 微信
+            onUnhandledRejection(options) {
+                return this.callLifecycle(AppLifecycle.unhandledRejection, options);
+            },
+            // 微信
+            onThemeChange(options) {
+                return this.callLifecycle(AppLifecycle.themeChange, options);
+            },
+        };
+        const lifecycleEvent = {
+            // 阿里
+            onShareAppMessage(options) {
+                return this.callLifecycle(AppLifecycle.shareAppMessage, options);
+            },
+        };
+        (RuntimeOptions.get('appEvents') || []).forEach(eventName => {
+            if (lifecycleEvent[eventName]) {
+                config[eventName] = lifecycleEvent[eventName];
+            }
+        });
+        return RuntimeOptions.get('pluginDriver').onAppConfig(config);
+    };
+    return createConfig(WrappedApp);
+}

package/esm/createComponentConfig.d.ts

@@ -0,0 +1,2 @@
+import * as React from 'react';
+export default function createComponentConfig(Component: React.ComponentType<any>): any;

package/esm/createComponentConfig.js

@@ -0,0 +1,45 @@
+import * as React from 'react';
+import { RuntimeOptions, ComponentInstanceContext } from '@rsmax/framework-shared';
+import Container from './Container';
+import render from './render';
+export default function createComponentConfig(Component) {
+    const config = {
+        data: {
+            action: {},
+            root: {
+                children: [],
+            },
+        },
+        didMount() {
+            if (!this.container) {
+                this.init();
+            }
+        },
+        didUpdate(prevProps, prevData) {
+            if (prevData !== this.data) {
+                return;
+            }
+            this.render();
+        },
+        didUnmount() {
+            this.container.clearUpdate();
+            render(null, this.container);
+        },
+        methods: {
+            init() {
+                this.component = RuntimeOptions.get('pluginDriver').onMiniComponent({
+                    component: Component,
+                    context: this,
+                });
+                this.container = new Container(this);
+                this.render();
+            },
+            render() {
+                this.element = render(React.createElement(ComponentInstanceContext.Provider, {
+                    value: this,
+                }, React.createElement(this.component, this.props)), this.container);
+            },
+        },
+    };
+    return config;
+}

package/esm/createComponentConfig.wechat.d.ts

@@ -0,0 +1,2 @@
+import * as React from 'react';
+export default function createComponentConfig(Component: React.ComponentType<any>): any;

package/esm/createComponentConfig.wechat.js

@@ -0,0 +1,60 @@
+import * as React from 'react';
+import { RuntimeOptions, ComponentInstanceContext } from '@rsmax/framework-shared';
+import Container from './Container';
+import render from './render';
+export default function createComponentConfig(Component) {
+    const config = {
+        options: {
+            styleIsolation: 'apply-shared',
+        },
+        data: {
+            action: {},
+            root: {
+                children: [],
+            },
+        },
+        attached: function () {
+            // 在组件实例进入页面节点树时执行
+            if (!this.container) {
+                this.init();
+            }
+        },
+        detached: function () {
+            // 在组件实例被从页面节点树移除时执行
+            this.container.clearUpdate();
+            render(null, this.container);
+        },
+        /*
+        TODO: 当前微信无对应语法支持监听props
+              且必须显示设定 properties，才能在组件中使用 this.properties.name
+              所以当前的实现不支持在微信端 props
+        eg:
+        properties: {
+          name: String
+        },
+    
+        didUpdate(prevProps: any, prevData: any) {
+          if (prevData !== this.data) {
+            return;
+          }
+    
+          this.render();
+        },*/
+        methods: {
+            init() {
+                this.component = RuntimeOptions.get('pluginDriver').onMiniComponent({
+                    component: Component,
+                    context: this,
+                });
+                this.container = new Container(this);
+                this.render();
+            },
+            render() {
+                this.element = render(React.createElement(ComponentInstanceContext.Provider, {
+                    value: this,
+                }, React.createElement(this.component, this.properties)), this.container);
+            },
+        },
+    };
+    return config;
+}

package/esm/createHostComponent.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export default function createHostComponent<P = any>(name: string, component?: React.ComponentType<P>): any;

package/esm/createHostComponent.js

@@ -0,0 +1,14 @@
+import React from 'react';
+import { RuntimeOptions } from '@rsmax/framework-shared';
+export default function createHostComponent(name, component) {
+    if (component) {
+        return component;
+    }
+    const Component = React.forwardRef((props, ref) => {
+        let element = React.createElement(name, Object.assign(Object.assign({}, props), { ref }));
+        element = RuntimeOptions.get('pluginDriver').onCreateHostComponentElement(element);
+        return element;
+    });
+    Component.displayName = name;
+    return RuntimeOptions.get('pluginDriver').onCreateHostComponent(Component);
+}

package/esm/createNativeComponent.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export default function createNativeComponent(name: string): React.ForwardRefExoticComponent<React.RefAttributes<unknown>>;

package/esm/createNativeComponent.js

@@ -0,0 +1,17 @@
+import React from 'react';
+export default function createNativeComponent(name) {
+    const Component = React.forwardRef((props, ref) => {
+        const newProps = Object.assign({}, props);
+        newProps.__ref =
+            typeof ref === 'function'
+                ? ref
+                : (e) => {
+                    if (ref) {
+                        ref.current = e;
+                    }
+                };
+        return React.createElement(name, newProps);
+    });
+    Component.displayName = name;
+    return Component;
+}

package/esm/createPageConfig.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+export declare function resetPageId(): void;
+export default function createPageConfig(Page: React.ComponentType<any>, name: string): any;