@tarojs/runtime 3.3.16 → 3.3.20

package/dist/dsl/common.d.ts

@@ -1,5 +1,4 @@
 /// <reference types="react" />
-import { eventHandler } from '../dom/event';
 import type { PageConfig } from '@tarojs/taro';
 import type { Instance, PageInstance, PageProps } from './instance';
 export declare function injectPageInstance(inst: Instance<PageProps>, id: string): void;
@@ -13,24 +12,4 @@ export declare function getOnShowEventKey(path: string): string;
 export declare function getOnHideEventKey(path: string): string;
 export declare function createPageConfig(component: any, pageName?: string, data?: Record<string, unknown>, pageConfig?: PageConfig): PageInstance;
 export declare function createComponentConfig(component: React.ComponentClass, componentName?: string, data?: Record<string, unknown>): any;
-export declare function createRecursiveComponentConfig(componentName?: string): {
-    properties: {
-        i: {
-            type: ObjectConstructor;
-            value: {
-                nn: string;
-            };
-        };
-        l: {
-            type: StringConstructor;
-            value: string;
-        };
-    };
-    options: {
-        addGlobalClass: boolean;
-        virtualHost: boolean;
-    };
-    methods: {
-        eh: typeof eventHandler;
-    };
-};
+export declare function createRecursiveComponentConfig(componentName?: string): any;

package/dist/dsl/instance.d.ts

@@ -21,13 +21,13 @@ interface VueInternal {
 export interface PageProps {
     tid?: string;
 }
-export interface ReactPageComponent<T = PageProps> extends ComponentClass<T>, Show, PageInstance {
+export interface ReactPageComponent<T = PageProps> extends ComponentClass<T>, PageInstance {
 }
-export interface ReactPageInstance<T = PageProps> extends Component<T>, Show, PageInstance {
+export interface ReactPageInstance<T = PageProps> extends Component<T>, PageInstance {
     componentDidShow?(): void;
     componentDidHide?(): void;
 }
-export interface ReactAppInstance<T = AppInstance> extends Component<T>, Show, AppInstance {
+export interface ReactAppInstance<T = AppInstance> extends Component<T>, AppInstance {
 }
 export interface PageLifeCycle extends Show {
     onPullDownRefresh?(): void;
@@ -63,15 +63,17 @@ export interface PageInstance extends PageLifeCycle {
     options?: Record<string, unknown>;
 }
 interface Show {
-    componentDidShow?(options?: unknown): void;
-    componentDidHide?(options?: unknown): void;
-    onShow?(options?: unknown): void;
-    onHide?(options?: unknown): void;
+    componentDidShow?(): void;
+    componentDidHide?(): void;
+    onShow?(): void;
+    onHide?(): void;
 }
 export interface AppInstance extends Show {
-    onLaunch?(options?: string): void;
+    onLaunch?(options?: Record<string, unknown>): void;
     mount?(component: React.ComponentClass | ComponentOptions<VueCtor> | Vue3Component, id: string, cb: (...args: any[]) => void): void;
     mount?(component: React.ComponentClass | ComponentOptions<VueCtor> | Vue3Component, id: string, cb: () => void): void;
+    componentDidShow?(options?: Record<string, unknown>): void;
+    onShow?(options?: Record<string, unknown>): void;
     unmount?(id: string): void;
     unmount?(id: string, cb: () => void): void;
     onPageNotFound?(res: any): void;

package/dist/dsl/react.d.ts

@@ -5,8 +5,9 @@ import type { AppInstance, ReactPageComponent, PageProps } from './instance';
 export declare let R: typeof React;
 export declare let PageContext: React.Context<string>;
 export declare function connectReactPage(R: typeof React, id: string): (component: ReactPageComponent) => React.ComponentClass<PageProps>;
-export declare function createReactApp(App: React.ComponentClass, react: typeof React, reactdom: any, config: AppConfig): AppInstance;
+export declare function createReactApp(App: React.ComponentClass, react: typeof React, dom: any, config: AppConfig): AppInstance;
 export declare function createNativeComponentConfig(Component: any, react: typeof React, reactdom: any, componentConfig: any): {
+    options: any;
     properties: {
         props: {
             type: null;
@@ -19,7 +20,7 @@ export declare function createNativeComponentConfig(Component: any, react: typeo
     ready(): void;
     detached(): void;
     pageLifetimes: {
-        show(): void;
+        show(options: any): void;
         hide(): void;
     };
     methods: {

package/dist/runtime.esm.js

@@ -1285,7 +1285,8 @@ function shortcutAttr(key) {
         default:
             return key;
     }
-}
+}
+const customWrapperCache = new Map();
 
 let TaroEventTarget = class TaroEventTarget {
     constructor(// eslint-disable-next-line @typescript-eslint/indent
@@ -2141,7 +2142,7 @@ let TaroElement = class TaroElement extends TaroNode {
         qualifiedName = shortcutAttr(qualifiedName);
         const payload = {
             path: `${this._path}.${toCamelCase(qualifiedName)}`,
-            value
+            value: isFunction$1(value) ? () => value : value
         };
         (_b = (_a = this.hooks).modifySetAttrPayload) === null || _b === void 0 ? void 0 : _b.call(_a, this, qualifiedName, payload);
         this.enqueueUpdate(payload);
@@ -3458,17 +3459,17 @@ let TaroRootElement = class TaroRootElement extends TaroElement {
                         const dataPathArr = p.split('.');
                         let hasCustomWrapper = false;
                         for (let i = dataPathArr.length; i > 0; i--) {
-                            const allPath = dataPathArr.slice(0, i).join('.');
-                            const getData = get(ctx.__data__ || ctx.data, allPath);
-                            if (getData && getData.nn && getData.nn === CUSTOM_WRAPPER) {
+                            const allPath = dataPathArr.slice(1, i).join('.').replace(/\bcn\b/g, 'childNodes');
+                            const getData = get(this, allPath);
+                            if (getData && getData.nodeName && getData.nodeName === CUSTOM_WRAPPER) {
                                 const customWrapperId = getData.uid;
-                                const customWrapper = ctx.selectComponent(`#${customWrapperId}`);
+                                const customWrapper = customWrapperCache.get(customWrapperId);
                                 const splitedPath = dataPathArr.slice(i).join('.');
                                 if (customWrapper) {
                                     hasCustomWrapper = true;
                                     customWrapperMap.set(customWrapper, Object.assign(Object.assign({}, (customWrapperMap.get(customWrapper) || {})), { [`i.${splitedPath}`]: data[p] }));
+                                    break;
                                 }
-                                break;
                             }
                         }
                         if (!hasCustomWrapper) {
@@ -3971,8 +3972,12 @@ class StyleTagParser {
         // console.log('res this.styles: ', this.styles)
     }
     parseSelector(src) {
-        // todo: 属性选择器里可以带空格：[a = "b"]，这里的 split(' ') 需要作兼容
-        const list = src.trim().replace(/ *([>~+]) */g, ' $1').replace(/ +/g, ' ').split(' ');
+        const list = src
+            .trim()
+            .replace(/ *([>~+]) */g, ' $1')
+            .replace(/ +/g, ' ')
+            .replace(/\[\s*([^[\]=\s]+)\s*=\s*([^[\]=\s]+)\s*\]/g, '[$1=$2]')
+            .split(' ');
         const selectors = list.map(item => {
             const firstChar = item.charAt(0);
             const selector = {
@@ -5018,11 +5023,11 @@ if (process.env.TARO_ENV && process.env.TARO_ENV !== 'h5') {
     if (!(DATE in window$1)) {
         window$1.Date = Date;
     }
-    window$1.setTimeout = function (cb, delay) {
-        setTimeout(cb, delay);
+    window$1.setTimeout = function (...args) {
+        return setTimeout(...args);
     };
-    window$1.clearTimeout = function (seed) {
-        clearTimeout(seed);
+    window$1.clearTimeout = function (...args) {
+        return clearTimeout(...args);
     };
 }
 
@@ -5164,11 +5169,8 @@ function stringify(obj) {
     return path === '' ? path : '?' + path;
 }
 function getPath(id, options) {
-    let path = id;
-    if (!isBrowser) {
-        path = id + stringify(options);
-    }
-    return path;
+    const idx = id.indexOf('?');
+    return `${idx > -1 ? id.substring(0, idx) : id}${stringify(isBrowser ? { stamp: (options === null || options === void 0 ? void 0 : options.stamp) || '' } : options)}`;
 }
 function getOnReadyEventKey(path) {
     return path + '.' + 'onReady';
@@ -5189,7 +5191,7 @@ function createPageConfig(component, pageName, data, pageConfig) {
     let loadResolver;
     let hasLoaded;
     const config = {
-        onLoad(options, cb) {
+        onLoad(options = {}, cb) {
             hasLoaded = new Promise(resolve => { loadResolver = resolve; });
             perf.start(PAGE_INIT);
             Current.page = this;
@@ -5197,6 +5199,9 @@ function createPageConfig(component, pageName, data, pageConfig) {
             options.$taroTimestamp = Date.now();
             // this.$taroPath 是页面唯一标识，不可变，因此页面参数 options 也不可变
             this.$taroPath = getPath(id, options);
+            if (isBrowser) {
+                config.path = this.$taroPath;
+            }
             // this.$taroParams 作为暴露给开发者的页面参数对象，可以被随意修改
             if (this.$taroParams == null) {
                 this.$taroParams = Object.assign({}, options);
@@ -5334,9 +5339,6 @@ function createPageConfig(component, pageName, data, pageConfig) {
     if (!isUndefined(data)) {
         config.data = data;
     }
-    if (isBrowser) {
-        config.path = id;
-    }
     return config;
 }
 function createComponentConfig(component, componentName, data) {
@@ -5380,8 +5382,26 @@ function createComponentConfig(component, componentName, data) {
     return config;
 }
 function createRecursiveComponentConfig(componentName) {
-    return {
-        properties: {
+    const isCustomWrapper = componentName === 'custom-wrapper';
+    const lifeCycles = isCustomWrapper
+        ? {
+            attached() {
+                var _a;
+                const componentId = (_a = this.data.i) === null || _a === void 0 ? void 0 : _a.uid;
+                if (isString(componentId)) {
+                    customWrapperCache.set(componentId, this);
+                }
+            },
+            detached() {
+                var _a;
+                const componentId = (_a = this.data.i) === null || _a === void 0 ? void 0 : _a.uid;
+                if (isString(componentId)) {
+                    customWrapperCache.delete(componentId);
+                }
+            }
+        }
+        : EMPTY_OBJ;
+    return Object.assign({ properties: {
             i: {
                 type: Object,
                 value: {
@@ -5392,15 +5412,12 @@ function createRecursiveComponentConfig(componentName) {
                 type: String,
                 value: ''
             }
-        },
-        options: {
+        }, options: {
             addGlobalClass: true,
-            virtualHost: componentName !== 'custom-wrapper'
-        },
-        methods: {
+            virtualHost: !isCustomWrapper
+        }, methods: {
             eh: eventHandler
-        }
-    };
+        } }, lifeCycles);
 }
 
 const hooks$3 = container.get(SERVICE_IDENTIFIER.Hooks);
@@ -5507,9 +5524,10 @@ function setReconciler() {
     }
 }
 const pageKeyId = incrementId();
-function createReactApp(App, react, reactdom, config) {
+function createReactApp(App, react, dom, config) {
+    var _a;
     R = react;
-    ReactDOM = reactdom;
+    ReactDOM = dom;
     ensure(!!ReactDOM, '构建 React/Nerv 项目请把 process.env.FRAMEWORK 设置为 \'react\'/\'nerv\' ');
     const ref = R.createRef();
     const isReactComponent = isClassComponent(R, App);
@@ -5551,8 +5569,7 @@ function createReactApp(App, react, reactdom, config) {
     }
     let wrapper;
     if (!isBrowser) {
-        // eslint-disable-next-line react/no-render-return-value
-        wrapper = ReactDOM.render(R.createElement(AppWrapper), document$2.getElementById('app'));
+        wrapper = (_a = ReactDOM.render) === null || _a === void 0 ? void 0 : _a.call(ReactDOM, R.createElement(AppWrapper), document$2.getElementById('app'));
     }
     const app = Object.create({
         render(cb) {
@@ -5576,11 +5593,11 @@ function createReactApp(App, react, reactdom, config) {
             enumerable: true,
             writable: true,
             value(options) {
+                var _a;
                 Current.router = Object.assign({ params: options === null || options === void 0 ? void 0 : options.query }, options);
                 if (isBrowser) {
                     // 由于 H5 路由初始化的时候会清除 app 下的 dom 元素，所以需要在路由初始化后执行 render
-                    // eslint-disable-next-line react/no-render-return-value
-                    wrapper = ReactDOM.render(R.createElement(AppWrapper), document$2.getElementById('app'));
+                    wrapper = (_a = ReactDOM.render) === null || _a === void 0 ? void 0 : _a.call(ReactDOM, R.createElement(AppWrapper), document$2.getElementById((config === null || config === void 0 ? void 0 : config.appId) || 'app'));
                 }
                 const app = ref.current;
                 // For taroize
@@ -5619,16 +5636,16 @@ function createReactApp(App, react, reactdom, config) {
                     app.componentDidShow(options);
                 }
                 // app useDidShow
-                triggerAppHook('onShow');
+                triggerAppHook('onShow', options);
             }
         },
         onHide: {
             enumerable: true,
             writable: true,
-            value(options) {
+            value() {
                 const app = ref.current;
                 if (app != null && isFunction$1(app.componentDidHide)) {
-                    app.componentDidHide(options);
+                    app.componentDidHide();
                 }
                 // app useDidHide
                 triggerAppHook('onHide');
@@ -5645,13 +5662,13 @@ function createReactApp(App, react, reactdom, config) {
             }
         }
     });
-    function triggerAppHook(lifecycle) {
+    function triggerAppHook(lifecycle, ...option) {
         const instance = getPageInstance(HOOKS_APP_ID);
         if (instance) {
             const app = ref.current;
             const func = hooks$3.getLifecycle(instance, lifecycle);
             if (Array.isArray(func)) {
-                func.forEach(cb => cb.apply(app));
+                func.forEach(cb => cb.apply(app, option));
             }
         }
     }
@@ -5731,6 +5748,7 @@ function createNativeComponentConfig(Component, react, reactdom, componentConfig
     ReactDOM = reactdom;
     setReconciler();
     const config = {
+        options: componentConfig,
         properties: {
             props: {
                 type: null,
@@ -5758,8 +5776,8 @@ function createNativeComponentConfig(Component, react, reactdom, componentConfig
             Current.app.unmount(this.compId);
         },
         pageLifetimes: {
-            show() {
-                safeExecute(this.compId, 'onShow');
+            show(options) {
+                safeExecute(this.compId, 'onShow', options);
             },
             hide() {
                 safeExecute(this.compId, 'onHide');
@@ -5935,7 +5953,7 @@ function createVueApp(App, vue, config) {
                 Current.router = Object.assign({ params: options === null || options === void 0 ? void 0 : options.query }, options);
                 if (isBrowser) {
                     // 由于 H5 路由初始化的时候会清除 app 下的 dom 元素，所以需要在路由初始化后再执行 render
-                    wrapper.$mount(document$2.getElementById('app'));
+                    wrapper.$mount(document$2.getElementById((config === null || config === void 0 ? void 0 : config.appId) || 'app'));
                 }
                 appInstance = wrapper.$refs.app;
                 if (appInstance != null && isFunction$1(appInstance.$options.onLaunch)) {
@@ -5976,10 +5994,6 @@ function createVue3Page(h, id) {
             },
             created() {
                 injectPageInstance(this, id);
-                // vue3 组件 created 时机比小程序页面 onShow 慢，因此在 created 后再手动触发一次 onShow。
-                this.$nextTick(() => {
-                    safeExecute(id, 'onShow');
-                });
             }
         };
         if (isArray$1(component.mixins)) {
@@ -6083,7 +6097,7 @@ function createVue3App(app, h, config) {
                 var _a;
                 Current.router = Object.assign({ params: options === null || options === void 0 ? void 0 : options.query }, options);
                 if (isBrowser) {
-                    appInstance = app.mount('#app');
+                    appInstance = app.mount(`#${config.appId || 'app'}`);
                 }
                 // 把 App Class 上挂载的额外属性同步到全局 app 对象中
                 // eslint-disable-next-line dot-notation