@rsmax/runtime 1.0.1

package/esm/createPageConfig.js

@@ -0,0 +1,183 @@
+import React from 'react';
+import { callbackName, createPageWrapper, Lifecycle, RuntimeOptions } from '@rsmax/framework-shared';
+import stopPullDownRefresh from './stopPullDownRefresh';
+import Container from './Container';
+import { createPortal } from './ReactPortal';
+import render from './render';
+import { unstable_batchedUpdates } from './index';
+let idCounter = 0;
+function generatePageId() {
+    const id = idCounter;
+    const pageId = 'page_' + id;
+    idCounter += 1;
+    return pageId;
+}
+// for testing
+export function resetPageId() {
+    idCounter = 0;
+}
+export default function createPageConfig(Page, name) {
+    var _a;
+    let app;
+    try {
+        app = getApp();
+    }
+    catch (e) {
+        app = null;
+    }
+    const config = {
+        data: {
+            root: {
+                children: [],
+            },
+            modalRoot: {
+                children: [],
+            },
+        },
+        wrapperRef: React.createRef(),
+        lifecycleCallback: {},
+        onLoad(query) {
+            const PageWrapper = createPageWrapper(Page, name);
+            this.pageId = generatePageId();
+            this.lifecycleCallback = {};
+            this.data = {
+                root: {
+                    children: [],
+                },
+                modalRoot: {
+                    children: [],
+                },
+            };
+            this.query = query;
+            this.container = new Container(this, 'root');
+            this.modalContainer = new Container(this, 'modalRoot');
+            const pageElement = React.createElement(PageWrapper, {
+                page: this,
+                query,
+                modalContainer: this.modalContainer,
+                ref: this.wrapperRef,
+            });
+            if (app && app._mount) {
+                this.element = createPortal(pageElement, this.container, this.pageId);
+                app._mount(this);
+            }
+            else {
+                this.element = render(pageElement, this.container);
+            }
+            return this.callLifecycle(Lifecycle.load, query);
+        },
+        onUnload() {
+            this.callLifecycle(Lifecycle.unload);
+            this.unloaded = true;
+            this.container.clearUpdate();
+            if (app) {
+                app._unmount(this);
+            }
+        },
+        onTabItemTap(e) {
+            return this.callLifecycle(Lifecycle.tabItemTap, e);
+        },
+        onResize(e) {
+            return this.callLifecycle(Lifecycle.resize, e);
+        },
+        /**
+         * Lifecycle start
+         */
+        registerLifecycle(lifecycle, callback) {
+            this.lifecycleCallback[lifecycle] = this.lifecycleCallback[lifecycle] || [];
+            this.lifecycleCallback[lifecycle].push(callback);
+            return () => {
+                this.lifecycleCallback[lifecycle].splice(this.lifecycleCallback[lifecycle].indexOf(callback), 1);
+            };
+        },
+        callLifecycle(lifecycle, ...args) {
+            const callbacks = this.lifecycleCallback[lifecycle] || [];
+            let result;
+            // 生命周期中可能改变 state 导致 callbacks 发生变化
+            [...callbacks].map((callback) => {
+                result = unstable_batchedUpdates(args => {
+                    return callback(...args);
+                }, args);
+            });
+            if (result) {
+                return result;
+            }
+            const callback = callbackName(lifecycle);
+            if (this.wrapperRef.current && this.wrapperRef.current[callback]) {
+                return this.wrapperRef.current[callback](...args);
+            }
+        },
+        events: {
+            // 页面返回时触发
+            onBack(e) {
+                return this.callLifecycle(Lifecycle.back, e);
+            },
+            // 键盘高度变化时触发
+            onKeyboardHeight(e) {
+                return this.callLifecycle(Lifecycle.keyboardHeight, e);
+            },
+            onTabItemTap(e) {
+                return this.callLifecycle(Lifecycle.tabItemTap, e);
+            },
+            // 点击但切换tabItem前触发
+            beforeTabItemTap() {
+                return this.callLifecycle(Lifecycle.beforeTabItemTap);
+            },
+            onResize(e) {
+                return this.callLifecycle(Lifecycle.resize, e);
+            },
+        },
+        onShow() {
+            return this.callLifecycle(Lifecycle.show);
+        },
+        onHide() {
+            return this.callLifecycle(Lifecycle.hide);
+        },
+        onReady() {
+            return this.callLifecycle(Lifecycle.ready);
+        },
+        onPullDownRefresh(e) {
+            const result = this.callLifecycle(Lifecycle.pullDownRefresh, e);
+            if (result && typeof result.then === 'function') {
+                Promise.resolve(result).then(() => {
+                    stopPullDownRefresh();
+                });
+            }
+        },
+        onReachBottom() {
+            return this.callLifecycle(Lifecycle.reachBottom);
+        },
+        onTitleClick() {
+            return this.callLifecycle(Lifecycle.titleClick);
+        },
+        onOptionMenuClick(e) {
+            return this.callLifecycle(Lifecycle.optionMenuClick, e);
+        },
+        onPopMenuClick(e) {
+            return this.callLifecycle(Lifecycle.popMenuClick, e);
+        },
+        onPullIntercept() {
+            return this.callLifecycle(Lifecycle.pullIntercept);
+        },
+        /**
+         * lifecycle end
+         */
+    };
+    const lifecycleEvents = {
+        onPageScroll(e) {
+            return this.callLifecycle(Lifecycle.pageScroll, e);
+        },
+        onShareAppMessage(options) {
+            return this.callLifecycle(Lifecycle.shareAppMessage, options) || {};
+        },
+        onShareTimeline(options) {
+            return this.callLifecycle(Lifecycle.shareTimeline, options) || {};
+        },
+    };
+    ((_a = RuntimeOptions.get('pageEvents')[name]) !== null && _a !== void 0 ? _a : []).forEach(eventName => {
+        if (lifecycleEvents[eventName]) {
+            config[eventName] = lifecycleEvents[eventName];
+        }
+    });
+    return RuntimeOptions.get('pluginDriver').onPageConfig({ config, page: name });
+}

package/esm/hooks/index.d.ts

@@ -0,0 +1,3 @@
+export { usePageEvent, useAppEvent, usePageInstance, useComponentInstance } from '@rsmax/framework-shared';
+export { default as useNativeEffect } from './useNativeEffect';
+export { default as useQuery } from './useQuery';

package/esm/hooks/index.js

@@ -0,0 +1,3 @@
+export { usePageEvent, useAppEvent, usePageInstance, useComponentInstance } from '@rsmax/framework-shared';
+export { default as useNativeEffect } from './useNativeEffect';
+export { default as useQuery } from './useQuery';

package/esm/hooks/useNativeEffect.d.ts

@@ -0,0 +1,3 @@
+import { DependencyList } from 'react';
+import { Listener } from '../nativeEffect';
+export default function useNativeEffect(listener: Listener, deps?: DependencyList): void;

package/esm/hooks/useNativeEffect.js

@@ -0,0 +1,7 @@
+import { useLayoutEffect } from 'react';
+import nativeEffect from '../nativeEffect';
+export default function useNativeEffect(listener, deps) {
+    useLayoutEffect(() => {
+        return nativeEffect.connect(listener, !!deps);
+    }, deps);
+}

package/esm/hooks/useQuery.d.ts

@@ -0,0 +1,3 @@
+export default function useQuery<Q extends Record<string, string | undefined> = {
+    [name: string]: string | undefined;
+}>(): Q;

package/esm/hooks/useQuery.js

@@ -0,0 +1,6 @@
+import { useContext } from 'react';
+import { PageInstanceContext } from '@rsmax/framework-shared';
+export default function useQuery() {
+    const pageInstance = useContext(PageInstanceContext);
+    return pageInstance.query;
+}

package/esm/hostConfig/diffProperties.d.ts

@@ -0,0 +1 @@
+export default function diffProperties(lastRawProps: Record<string, any> | null | undefined, nextRawProps: Record<string, any> | null | undefined): null | any[];

package/esm/hostConfig/diffProperties.js

@@ -0,0 +1,97 @@
+import { includes } from '@rsmax/framework-shared';
+const STYLE = ['style', 'placeholderStyle'];
+const CHILDREN = 'children';
+const CLASS_NAME = 'className';
+export default function diffProperties(lastRawProps, nextRawProps) {
+    const updatePayload = [];
+    const lastProps = lastRawProps;
+    const nextProps = nextRawProps;
+    let propKey;
+    let styleName;
+    const hasOwnProperty = Object.prototype.hasOwnProperty;
+    const styleUpdates = {};
+    for (propKey in lastProps) {
+        if (hasOwnProperty.call(nextProps, propKey) ||
+            !hasOwnProperty.call(lastProps, propKey) ||
+            lastProps[propKey] == null) {
+            continue;
+        }
+        if (includes(STYLE, propKey)) {
+            const lastStyle = lastProps[propKey];
+            for (styleName in lastStyle) {
+                if (hasOwnProperty.call(lastStyle, styleName)) {
+                    if (!styleUpdates[propKey]) {
+                        styleUpdates[propKey] = {};
+                    }
+                    styleUpdates[propKey][styleName] = '';
+                }
+            }
+        }
+        else {
+            // For all other deleted properties we add it to the queue. We use
+            // the whitelist in the commit phase instead.
+            updatePayload.push(propKey, propKey === CLASS_NAME ? '' : null);
+        }
+    }
+    for (propKey in nextProps) {
+        const nextProp = nextProps[propKey];
+        const lastProp = lastProps != null ? lastProps[propKey] : undefined;
+        if (!hasOwnProperty.call(nextProps, propKey) || nextProp === lastProp || (nextProp == null && lastProp == null)) {
+            continue;
+        }
+        if (includes(STYLE, propKey)) {
+            if (process.env.NODE_ENV === 'development') {
+                if (nextProp) {
+                    // Freeze the next style object so that we can assume it won't be
+                    // mutated. We have already warned for this in the past.
+                    Object.freeze(nextProp);
+                }
+            }
+            if (lastProp) {
+                // Unset styles on `lastProp` but not on `nextProp`.
+                for (styleName in lastProp) {
+                    if (hasOwnProperty.call(lastProp, styleName) && (!nextProp || !hasOwnProperty.call(nextProp, styleName))) {
+                        if (!styleUpdates[propKey]) {
+                            styleUpdates[propKey] = {};
+                        }
+                        styleUpdates[propKey][styleName] = '';
+                    }
+                }
+                // Update styles that changed since `lastProp`.
+                for (styleName in nextProp) {
+                    if (hasOwnProperty.call(nextProp, styleName) && lastProp[styleName] !== nextProp[styleName]) {
+                        if (!styleUpdates[propKey]) {
+                            styleUpdates[propKey] = {};
+                        }
+                        styleUpdates[propKey][styleName] = nextProp[styleName];
+                    }
+                }
+            }
+            else {
+                // Relies on `updateStylesByID` not mutating `styleUpdates`.
+                if (!styleUpdates[propKey]) {
+                    updatePayload.push(propKey, null);
+                }
+                styleUpdates[propKey] = nextProp;
+            }
+        }
+        else if (propKey === CHILDREN) {
+            if (lastProp !== nextProp && (typeof nextProp === 'string' || typeof nextProp === 'number')) {
+                updatePayload.push(propKey, '' + nextProp);
+            }
+        }
+        else {
+            // For any other property we always add it to the queue and then we
+            // filter it out using the whitelist during the commit.
+            updatePayload.push(propKey, nextProp);
+        }
+    }
+    // 由于 style 要转换成 string， 所以必须整个 style 对象都更新
+    for (const styleKey in styleUpdates) {
+        const styleValue = styleUpdates[styleKey];
+        if (styleValue) {
+            updatePayload.push(styleKey, Object.assign({}, lastProps[styleKey], styleValue));
+        }
+    }
+    return updatePayload.length ? updatePayload : null;
+}

package/esm/hostConfig/index.d.ts

@@ -0,0 +1,42 @@
+import VNode from '../VNode';
+import Container from '../Container';
+declare const _default: {
+    now: any;
+    getPublicInstance: <T>(inst: T) => T;
+    getRootHostContext: () => {};
+    shouldSetTextContent(type: string): boolean;
+    prepareForCommit: () => null;
+    preparePortalMount: () => void;
+    clearContainer: () => void;
+    resetAfterCommit: (container: Container) => void;
+    getChildHostContext: () => {};
+    createInstance(type: string, newProps: any, container: Container): VNode;
+    createTextInstance(text: string, container: Container): VNode;
+    commitTextUpdate(node: VNode, oldText: string, newText: string): void;
+    prepareUpdate(node: VNode, type: string, lastProps: any, nextProps: any): any[] | null;
+    commitUpdate(node: VNode, updatePayload: any, type: string, oldProps: any, newProps: any): void;
+    appendInitialChild: (parent: VNode, child: VNode) => void;
+    appendChild(parent: VNode, child: VNode): void;
+    insertBefore(parent: VNode, child: VNode, beforeChild: VNode): void;
+    removeChild(parent: VNode, child: VNode): void;
+    finalizeInitialChildren: () => boolean;
+    appendChildToContainer(container: any, child: VNode): void;
+    insertInContainerBefore(container: any, child: VNode, beforeChild: VNode): void;
+    removeChildFromContainer(container: any, child: VNode): void;
+    hideInstance(instance: VNode): void;
+    hideTextInstance(instance: VNode): void;
+    unhideInstance(instance: VNode, props: any): void;
+    unhideTextInstance(instance: VNode, text: string): void;
+    /**
+     * 当 fiber 被标记为 Deletion 时，dom被卸载后，从dom节点上删除 react 初始化的内容，如 __reactProps$xxxx 等. 详见React源码
+     * https://github.com/facebook/react/blob/8b31835fc0a4de479a816471764f0e1d103ae205/packages/react-reconciler/src/forks/ReactFiberConfig.custom.js#L78
+     */
+    detachDeletedInstance(): {};
+    schedulePassiveEffects: any;
+    cancelPassiveEffects: any;
+    shouldYield: any;
+    scheduleDeferredCallback: any;
+    cancelDeferredCallback: any;
+    supportsMutation: boolean;
+};
+export default _default;

package/esm/hostConfig/index.js

@@ -0,0 +1,154 @@
+import scheduler from 'scheduler';
+import { TYPE_TEXT } from '../constants';
+import { generate } from '../instanceId';
+import VNode from '../VNode';
+import diffProperties from './diffProperties';
+const { unstable_scheduleCallback: scheduleDeferredCallback, unstable_cancelCallback: cancelDeferredCallback, unstable_shouldYield: shouldYield, unstable_now: now, } = scheduler;
+const DOM_TAG_MAP = {
+    span: 'text',
+    div: 'view',
+    img: 'image',
+};
+function processProps(newProps, node) {
+    const props = {};
+    node.unregisteredCallbacks();
+    for (const propKey of Object.keys(newProps)) {
+        if (typeof newProps[propKey] === 'function') {
+            props[propKey] = node.registerCallback(propKey, newProps[propKey]);
+        }
+        else if (propKey === 'style') {
+            props[propKey] = newProps[propKey] || '';
+        }
+        else if (propKey === 'children') {
+            // pass
+        }
+        else {
+            props[propKey] = newProps[propKey];
+        }
+    }
+    return props;
+}
+const rootHostContext = {};
+const childHostContext = {};
+export default {
+    now,
+    getPublicInstance: (inst) => {
+        return inst;
+    },
+    getRootHostContext: () => {
+        return rootHostContext;
+    },
+    shouldSetTextContent(type) {
+        return type === 'stub-block';
+    },
+    prepareForCommit: () => {
+        return null;
+    },
+    preparePortalMount: () => {
+        // nothing to do
+    },
+    clearContainer: () => {
+        // nothing to do
+    },
+    resetAfterCommit: (container) => {
+        container.applyUpdate();
+    },
+    getChildHostContext: () => {
+        return childHostContext;
+    },
+    createInstance(type, newProps, container) {
+        var _a;
+        const id = generate();
+        const node = new VNode({
+            id,
+            type: (_a = DOM_TAG_MAP[type]) !== null && _a !== void 0 ? _a : type,
+            props: {},
+            container,
+        });
+        node.props = processProps(newProps, node);
+        return node;
+    },
+    createTextInstance(text, container) {
+        const id = generate();
+        const node = new VNode({
+            id,
+            type: TYPE_TEXT,
+            props: null,
+            container,
+        });
+        node.text = text;
+        return node;
+    },
+    commitTextUpdate(node, oldText, newText) {
+        if (oldText !== newText) {
+            node.text = newText;
+            node.update();
+        }
+    },
+    prepareUpdate(node, type, lastProps, nextProps) {
+        lastProps = processProps(lastProps, node);
+        nextProps = processProps(nextProps, node);
+        return diffProperties(lastProps, nextProps);
+    },
+    commitUpdate(node, updatePayload, type, oldProps, newProps) {
+        node.props = processProps(newProps, node);
+        node.update(updatePayload);
+    },
+    appendInitialChild: (parent, child) => {
+        parent.appendChild(child);
+    },
+    appendChild(parent, child) {
+        parent.appendChild(child);
+    },
+    insertBefore(parent, child, beforeChild) {
+        parent.insertBefore(child, beforeChild);
+    },
+    removeChild(parent, child) {
+        parent.removeChild(child);
+    },
+    finalizeInitialChildren: () => {
+        return false;
+    },
+    appendChildToContainer(container, child) {
+        container.appendChild(child);
+        child.mounted = true;
+    },
+    insertInContainerBefore(container, child, beforeChild) {
+        container.insertBefore(child, beforeChild);
+    },
+    removeChildFromContainer(container, child) {
+        container.removeChild(child);
+    },
+    hideInstance(instance) {
+        var _a;
+        const originStyle = (_a = instance.props) === null || _a === void 0 ? void 0 : _a.style;
+        const newStyle = Object.assign({}, originStyle || {}, { display: 'none' }); // 微信和阿里的小程序都不支持在内联样式中加`important!`
+        instance.props = Object.assign({}, instance.props || {}, { style: newStyle });
+        instance.update();
+    },
+    hideTextInstance(instance) {
+        instance.text = '';
+        instance.update();
+    },
+    unhideInstance(instance, props) {
+        instance.props = props;
+        instance.update();
+    },
+    unhideTextInstance(instance, text) {
+        instance.text = text;
+        instance.update();
+    },
+    /**
+     * 当 fiber 被标记为 Deletion 时，dom被卸载后，从dom节点上删除 react 初始化的内容，如 __reactProps$xxxx 等. 详见React源码
+     * https://github.com/facebook/react/blob/8b31835fc0a4de479a816471764f0e1d103ae205/packages/react-reconciler/src/forks/ReactFiberConfig.custom.js#L78
+     */
+    detachDeletedInstance() {
+        return {};
+    },
+    schedulePassiveEffects: scheduleDeferredCallback,
+    cancelPassiveEffects: cancelDeferredCallback,
+    shouldYield,
+    scheduleDeferredCallback,
+    cancelDeferredCallback,
+    supportsMutation: true,
+};

package/esm/index.d.ts

@@ -0,0 +1,14 @@
+export { default as render } from './render';
+export { default as createAppConfig } from './createAppConfig';
+export { default as createPageConfig } from './createPageConfig';
+export { default as createComponentConfig } from './createComponentConfig';
+export { default as createNativeComponent } from './createNativeComponent';
+export { default as createHostComponent } from './createHostComponent';
+export { createPortal } from './ReactPortal';
+export { RuntimeOptions, PluginDriver } from '@rsmax/framework-shared';
+export * from './hooks';
+export declare const unstable_batchedUpdates: <A, R>(fn: (a: A) => R, a: A) => R;
+declare const _default: {
+    unstable_batchedUpdates: <A, R>(fn: (a: A) => R, a: A) => R;
+};
+export default _default;

package/esm/index.js

@@ -0,0 +1,14 @@
+export { default as render } from './render';
+export { default as createAppConfig } from './createAppConfig';
+export { default as createPageConfig } from './createPageConfig';
+export { default as createComponentConfig } from './createComponentConfig';
+export { default as createNativeComponent } from './createNativeComponent';
+export { default as createHostComponent } from './createHostComponent';
+export { createPortal } from './ReactPortal';
+export { RuntimeOptions, PluginDriver } from '@rsmax/framework-shared';
+export * from './hooks';
+import { ReactReconcilerInst } from './render';
+export const unstable_batchedUpdates = ReactReconcilerInst.batchedUpdates;
+export default {
+    unstable_batchedUpdates,
+};

package/esm/instanceId.d.ts

@@ -0,0 +1,2 @@
+export declare function reset(): void;
+export declare function generate(): number;

package/esm/instanceId.js

@@ -0,0 +1,9 @@
+let instanceId = 0;
+export function reset() {
+    instanceId = 0;
+}
+export function generate() {
+    const id = instanceId;
+    instanceId += 1;
+    return id;
+}

package/esm/nativeEffect.d.ts

@@ -0,0 +1,10 @@
+export type Listener = () => void;
+declare function dispose(listener: Listener): void;
+declare function connect(listener: Listener, once: boolean): () => void;
+declare function run(): void;
+declare const _default: {
+    connect: typeof connect;
+    run: typeof run;
+    dispose: typeof dispose;
+};
+export default _default;

package/esm/nativeEffect.js

@@ -0,0 +1,23 @@
+const effector = {
+    listenerConfigs: [],
+};
+function dispose(listener) {
+    effector.listenerConfigs = effector.listenerConfigs.filter(config => config.listener !== listener);
+}
+function connect(listener, once) {
+    effector.listenerConfigs.push({ listener, once });
+    return () => dispose(listener);
+}
+function run() {
+    effector.listenerConfigs.forEach(config => {
+        config.listener();
+        if (config.once) {
+            dispose(config.listener);
+        }
+    });
+}
+export default {
+    connect,
+    run,
+    dispose,
+};

package/esm/polyfills/Function.js

@@ -0,0 +1,29 @@
+"use strict";
+/* eslint-disable prefer-rest-params */
+/* istanbul ignore next */
+if (typeof Function.prototype.call === 'undefined') {
+    Function.prototype.call = function (context) {
+        context = context || window;
+        context.fn = this;
+        const args = [...arguments].slice(1);
+        const result = context.fn(...args);
+        delete context.fn;
+        return result;
+    };
+}
+/* istanbul ignore next */
+if (typeof Function.prototype.apply === 'undefined') {
+    Function.prototype.apply = function (context) {
+        context = context || window;
+        context.fn = this;
+        let result;
+        if (arguments[1]) {
+            result = context.fn(...arguments[1]);
+        }
+        else {
+            result = context.fn();
+        }
+        delete context.fn;
+        return result;
+    };
+}

package/esm/propsAlias.d.ts

@@ -0,0 +1,6 @@
+export declare function getAlias(prop: string, type: string): string;
+export interface GenericProps {
+    [key: string]: any;
+}
+export declare function propAlias(prop: string, value: any, type: string): any[];
+export default function propsAlias(props: GenericProps, type: string): GenericProps;

package/esm/propsAlias.js

@@ -0,0 +1,42 @@
+import plainStyle from './utils/plainStyle';
+import { RuntimeOptions } from '@rsmax/framework-shared';
+export function getAlias(prop, type) {
+    var _a, _b;
+    const hostComponent = RuntimeOptions.get('hostComponents')[type];
+    const prefix = `${RuntimeOptions.get('platform')}-`;
+    // 判断是否是平台独有属性
+    if (prop.startsWith(prefix)) {
+        return prop.replace(new RegExp(`^${prefix}`), '');
+    }
+    return (_b = (_a = hostComponent === null || hostComponent === void 0 ? void 0 : hostComponent.alias) === null || _a === void 0 ? void 0 : _a[prop]) !== null && _b !== void 0 ? _b : prop;
+}
+function getValue(prop, value) {
+    if (prop.toLowerCase().endsWith('style') && Object.prototype.toString.call(value) === '[object Object]') {
+        return plainStyle(value);
+    }
+    return value;
+}
+export function propAlias(prop, value, type) {
+    return [getAlias(prop, type), getValue(prop, value)];
+}
+export default function propsAlias(props, type) {
+    if (!props) {
+        return props;
+    }
+    const prefix = `${RuntimeOptions.get('platform')}-`;
+    const aliasProps = {};
+    for (const prop in props) {
+        // 平台前缀属性优先级提升
+        // @see https://github.com/remaxjs/remax/issues/1409
+        const hasPrefix = prop.startsWith(prefix);
+        const key = getAlias(prop, type);
+        const value = getValue(prop, props[prop]);
+        if (hasPrefix) {
+            aliasProps[key] = value;
+        }
+        else {
+            aliasProps[key] = aliasProps[key] || value;
+        }
+    }
+    return aliasProps;
+}