vite-plugin-taro-runtime 0.7.12 → 0.8.0-beta.0

package/dist/runtime/dom-external/mutation-observer/implements.d.ts

@@ -51,5 +51,7 @@ declare class MutationObserverImpl {
     takeRecords(): MutationRecord[];
 }
 
-export { MutationObserverImpl };
+declare function hasMutationObservers(): boolean;
+
+export { MutationObserverImpl, hasMutationObservers };
 export type { MutationCallback, MutationObserverInit };

package/dist/runtime/dom-external/mutation-observer/implements.js

@@ -1,4 +1,8 @@
 const observers = [];
+/** Read observer presence directly from the current registrations. */
+function hasMutationObservers() {
+    return observers.length > 0;
+}
 /**
  * The MutationObserver provides the ability
  * to watch for changes being made to the DOM tree.
@@ -104,5 +108,5 @@ function recordMutation(record) {
     });
 }
 
-export { MutationObserverImpl, recordMutation };
+export { MutationObserverImpl, hasMutationObservers, recordMutation };
 //# sourceMappingURL=implements.js.map

package/dist/runtime/dom-external/mutation-observer/index.d.ts

@@ -9,6 +9,8 @@ declare class MutationObserver {
     observe(...args: [TaroNode, MutationObserverInit?]): void;
     disconnect(): void;
     takeRecords(): MutationRecord[];
+    /** Whether any observers are currently registered. */
+    static get hasObservers(): boolean;
     static record(record: MutationRecord): void;
 }
 

package/dist/runtime/dom-external/mutation-observer/index.js

@@ -1,5 +1,5 @@
 import { noop } from '@tarojs/shared';
-import { MutationObserverImpl, recordMutation } from './implements.js';
+import { MutationObserverImpl, hasMutationObservers, recordMutation } from './implements.js';
 
 class MutationObserver {
     constructor(callback) {
@@ -26,6 +26,10 @@ class MutationObserver {
     takeRecords() {
         return this.core.takeRecords();
     }
+    /** Check before preparing mutation snapshots, sibling lookups or record objects. */
+    static get hasObservers() {
+        return ENABLE_MUTATION_OBSERVER && hasMutationObservers();
+    }
     static record(record) {
         recordMutation(record);
     }

package/dist/runtime/dom-external/node.js

@@ -1,6 +1,14 @@
-import { PROPS, DATASET, OBJECT, STYLE } from '../constants/index.js';
+import { TaroElement } from '../dom/element.js';
+import { TaroNode } from '../dom/node.js';
+import { Style } from '../dom/style.js';
 import { parser } from './inner-html/parser.js';
 
+// Capture the template defaults before hosts replace presentation delegates during startup.
+// Clone construction needs host initialization, not incremental template payloads, even for roots.
+const templateAttributeUpdate = TaroElement.prototype.delegateAttributeUpdate;
+const templateStyleUpdate = Style.prototype.delegateStyleUpdate;
+const templateChildInsertion = TaroNode.prototype.delegateChildInsertion;
+
 /**
  * An implementation of `Element.insertAdjacentHTML()`
  * to support Vue 3 with a version of or greater than `vue@3.1.2`
@@ -31,31 +39,61 @@ function insertAdjacentHTML(position, html) {
         }
     }
 }
-function cloneNode(isDeep = false) {
+function cloneNode(isDeep) {
     const document = this.ownerDocument;
-    let newNode;
-    if (this.nodeType === 1 /* NodeType.ELEMENT_NODE */) {
-        newNode = document.createElement(this.nodeName);
+    if (this.nodeType === 3 /* NodeType.TEXT_NODE */) {
+        // Creation supplies both the logical and native initial value in one operation.
+        return document.createTextNode(this._value);
     }
-    else if (this.nodeType === 3 /* NodeType.TEXT_NODE */) {
-        newNode = document.createTextNode('');
+    const newNode = document.createElement(this.nodeName);
+    /*
+     * A clone owns fresh identity and handler state. Copy attributes directly rather than invoking
+     * public setters: cloning must retain the source's ID lookup and produce no mutation records.
+     * Notify replaced presentation delegates while copying, so native hosts receive each value
+     * during construction. Template clones only need the copied logical state.
+     */
+    if (newNode.delegateAttributeUpdate === templateAttributeUpdate) {
+        newNode.props = Object.assign({}, this.props);
     }
-    for (const key in this) {
-        const value = this[key];
-        // eslint-disable-next-line valid-typeof
-        if ([PROPS, DATASET].includes(key) && typeof value === OBJECT) {
-            newNode[key] = Object.assign({}, value);
+    else {
+        for (const name of Object.keys(this.props)) {
+            const value = this.props[name];
+            newNode.props[name] = value;
+            newNode.delegateAttributeUpdate(name, value, false);
         }
-        else if (key === '_value') {
-            newNode[key] = value;
+    }
+    newNode.dataset = Object.assign({}, this.dataset);
+    // Copy an existing declaration; unstyled sources and clones retain lazy allocation.
+    const sourceStyle = this._style;
+    if (sourceStyle) {
+        const style = newNode.style;
+        style._value = Object.assign({}, sourceStyle._value);
+        for (const name of sourceStyle._usedStyleProp) {
+            style._usedStyleProp.add(name);
+            // Dynamic CSS variables and hyphen-prefixed properties keep their original accessors.
+            if (name[0] === '-') {
+                style.setCssVariables(name);
+            }
         }
-        else if (key === STYLE) {
-            newNode.style._value = Object.assign({}, value._value);
-            newNode.style._usedStyleProp = new Set(Array.from(value._usedStyleProp));
+        if (style._usedStyleProp.size > 0 && style.delegateStyleUpdate !== templateStyleUpdate) {
+            style.delegateStyleUpdate();
         }
     }
     if (isDeep) {
-        newNode.childNodes = this.childNodes.map(node => node.cloneNode(true));
+        const notifyInsertion = newNode.delegateChildInsertion !== templateChildInsertion;
+        for (const child of this.childNodes) {
+            const clonedChild = child.cloneNode(true);
+            /*
+             * Construct the logical relationship before its native insertion. Calling appendChild
+             * here would also record observer mutations and search for the preceding sibling.
+             * This construction loop visits each edge once and leaves ordinary mutations unchanged.
+             */
+            clonedChild.parentNode = newNode;
+            newNode.childNodes.push(clonedChild);
+            if (notifyInsertion) {
+                newNode.delegateChildInsertion(clonedChild, undefined, 0, undefined);
+            }
+        }
     }
     return newNode;
 }

package/dist/runtime/dsl/common.d.ts

@@ -10,6 +10,7 @@ declare function getPath(id: string, options?: Record<string, unknown>): string;
 declare function getOnReadyEventKey(path: string): string;
 declare function getOnShowEventKey(path: string): string;
 declare function getOnHideEventKey(path: string): string;
+/** Creates native lifecycles; onLoad reads the receiver's parameters and can delegate mounting with its load callback. */
 declare function createPageConfig(component: any, pageName?: string, data?: Record<string, unknown>, pageConfig?: PageConfig): PageInstance;
 declare function createComponentConfig(component: React.ComponentClass, componentName?: string, data?: Record<string, unknown>): any;
 declare function createRecursiveComponentConfig(componentName?: string, forceCustomWrapper?: boolean): any;

package/dist/runtime/dsl/common.js

@@ -4,7 +4,7 @@ import { taroWindowProvider } from '../bom/window.js';
 import { PAGE_INIT, OPTIONS, EXTERNAL_CLASSES, BEHAVIORS, CONTEXT_ACTIONS, VIEW, ON_HIDE, ON_READY, ON_SHOW, ON_LOAD, CUSTOM_WRAPPER } from '../constants/index.js';
 import { Current } from '../current.js';
 import { eventHandler } from '../dom/event.js';
-import { bumpNearestCtxEpochForRoot } from '../dom/nearest-ctx.js';
+import { invalidateNearestCtx } from '../dom/nearest-ctx.js';
 import { eventCenter } from '../emitter/emitter.js';
 import env from '../env.js';
 import { perf } from '../perf.js';
@@ -70,9 +70,8 @@ function createPageConfig(component, pageName, data, pageConfig) {
     // 小程序 Page 构造器是一个傲娇小公主，不能把复杂的对象挂载到参数上
     const id = pageName !== null && pageName !== void 0 ? pageName : `taro_page_${pageId()}`;
     const [ONLOAD, ONUNLOAD, ONREADY, ONSHOW, ONHIDE, LIFECYCLES, SIDE_EFFECT_LIFECYCLES,] = hooks.call('getMiniLifecycleImpl').page;
-    let pageElement = null;
-    let unmounting = false;
-    let prepareMountList = [];
+    // Native instances of the same route have independent lifecycle completion.
+    const hasLoaded = new WeakMap();
     function setCurrentRouter(page) {
         const router = process.env.TARO_PLATFORM === 'web' ? page.$taroPath : page.route || page.__route__ || page.$taroPath;
         Current.router = {
@@ -87,91 +86,40 @@ function createPageConfig(component, pageName, data, pageConfig) {
             Current.router.exitState = page.exitState;
         }
     }
-    let loadResolver;
-    let hasLoaded;
     const config = {
-        [ONLOAD](options = {}, cb) {
-            hasLoaded = new Promise(resolve => { loadResolver = resolve; });
-            perf.start(PAGE_INIT);
-            Current.page = this;
-            this.config = pageConfig || {};
-            // this.$taroPath 是页面唯一标识
-            const prerenderIdentity = config.__vpt_meta?.prerenderIdentity;
-            if (prerenderIdentity) {
-                config.__vpt_meta.prerenderIdentity = undefined;
-            }
-            const uniqueOptions = prerenderIdentity?.params ?? Object.assign({}, options, { $taroTimestamp: Date.now() });
-            const $taroPath = this.$taroPath = prerenderIdentity?.path ?? getPath(id, uniqueOptions);
-            if (process.env.TARO_PLATFORM === 'web') {
-                config.path = $taroPath;
-            }
-            // this.$taroParams 作为暴露给开发者的页面参数对象，可以被随意修改
-            if (this.$taroParams == null) {
-                this.$taroParams = uniqueOptions;
-            }
-            setCurrentRouter(this);
-            // 初始化当前页面的上下文信息
-            if (process.env.TARO_PLATFORM !== 'web') {
-                taroWindowProvider.trigger(CONTEXT_ACTIONS.INIT, $taroPath);
-            }
-            const mount = () => {
-                Current.app.mount(component, $taroPath, () => {
-                    if (process.env.TARO_ENV === 'tt' && isEnableTTDom()) {
-                        pageElement = env.document.getPageDocumentById(this.__webviewId__);
-                    }
-                    else {
-                        pageElement = env.document.getElementById($taroPath);
-                    }
-                    ensure(pageElement !== null, '没有找到页面实例。');
-                    safeExecute($taroPath, ON_LOAD, this.$taroParams);
-                    loadResolver();
-                    if (process.env.TARO_PLATFORM !== 'web') {
-                        pageElement.ctx = this;
-                        bumpNearestCtxEpochForRoot(pageElement);
-                        if (process.env.TARO_ENV === 'tt' && isEnableTTDom()) {
-                            pageElement.sync();
-                        }
-                        else {
-                            pageElement.performUpdate(true, cb);
-                        }
-                    }
-                    else {
-                        isFunction(cb) && cb();
-                    }
-                });
+        [ONLOAD](_options, mount) {
+            // Resolve this instance's lifecycle barrier after its load handlers run.
+            let loadResolver;
+            hasLoaded.set(this, new Promise(resolve => { loadResolver = resolve; }));
+            const dispatch = () => {
+                const result = safeExecute(this.$taroPath, ON_LOAD, this.$taroParams);
+                loadResolver();
+                return result;
             };
-            if (unmounting) {
-                prepareMountList.push(mount);
-            }
-            else {
-                mount();
-            }
+            return mount ? mount(dispatch) : dispatch();
         },
         [ONUNLOAD]() {
             const $taroPath = this.$taroPath;
+            const pageElement = process.env.TARO_ENV === 'tt' && isEnableTTDom()
+                ? env.document.getPageDocumentById(this.__webviewId__)
+                : env.document.getElementById($taroPath);
             // 销毁当前页面的上下文信息
             if (process.env.TARO_PLATFORM !== 'web') {
                 taroWindowProvider.trigger(CONTEXT_ACTIONS.DESTROY, $taroPath);
             }
             // 触发onUnload生命周期
             safeExecute($taroPath, ONUNLOAD);
-            unmounting = true;
             Current.app.unmount($taroPath, () => {
-                unmounting = false;
+                hasLoaded.delete(this);
                 instances.delete($taroPath);
                 if (pageElement) {
-                    bumpNearestCtxEpochForRoot(pageElement);
+                    invalidateNearestCtx(pageElement);
                     pageElement.ctx = null;
-                    pageElement = null;
-                }
-                if (prepareMountList.length) {
-                    prepareMountList.forEach(fn => fn());
-                    prepareMountList = [];
                 }
             });
         },
         [ONREADY]() {
-            hasLoaded.then(() => {
+            hasLoaded.get(this).then(() => {
                 // 触发生命周期
                 safeExecute(this.$taroPath, ON_READY);
                 // 通过事件触发子组件的生命周期
@@ -180,7 +128,7 @@ function createPageConfig(component, pageName, data, pageConfig) {
             });
         },
         [ONSHOW](options = {}) {
-            hasLoaded.then(() => {
+            hasLoaded.get(this).then(() => {
                 // 设置 Current 的 page 和 router
                 Current.page = this;
                 setCurrentRouter(this);
@@ -242,7 +190,7 @@ function createPageConfig(component, pageName, data, pageConfig) {
                     return exec();
                 }
                 if (isDefer) {
-                    hasLoaded.then(exec);
+                    hasLoaded.get(this).then(exec);
                 }
                 else {
                     return exec();
@@ -341,7 +289,7 @@ function createRecursiveComponentConfig(componentName, forceCustomWrapper = fals
                     const el = env.document.getElementById(componentId);
                     if (el) {
                         el.ctx = this;
-                        bumpNearestCtxEpochForRoot(el._root);
+                        invalidateNearestCtx(el);
                     }
                 }
             },
@@ -358,7 +306,7 @@ function createRecursiveComponentConfig(componentName, forceCustomWrapper = fals
                     const el = env.document.getElementById(componentId);
                     if (el) {
                         el.ctx = null;
-                        bumpNearestCtxEpochForRoot(el._root);
+                        invalidateNearestCtx(el);
                     }
                 }
             }

package/dist/runtime/dsl/instance.d.ts

@@ -26,7 +26,8 @@ interface ReactAppInstance<T = AppInstance> extends Component$1<T>, AppInstance
 interface PageLifeCycle extends Show {
     eh?(event: MpEvent): void;
     onAddToFavorites?(): void;
-    onLoad?(options: Record<string, unknown>, cb?: TFunc): void;
+    /** Dispatches $taroParams; mount receives the load callback after lifecycle ordering is initialized. */
+    onLoad?(options: Record<string, unknown>, mount?: TFunc): void;
     onOptionMenuClick?(): void;
     onKeyboardHeight?(obj: {
         height: number;
@@ -56,8 +57,6 @@ interface PageLifeCycle extends Show {
     onUnload?(): void;
 }
 interface PageInstance extends PageLifeCycle {
-    /** @internal VPT metadata; native onLoad consumes the prepared identity once. */
-    __vpt_meta?: { prerenderIdentity?: { path: string; params: Record<string, unknown> } };
     /** 页面的初始数据 */
     data?: Record<string, unknown> | (() => Record<string, unknown>);
     /** 页面路径 */

package/dist/runtime/index.d.ts

@@ -12,7 +12,7 @@ export { taroHistoryProvider as history, taroLocationProvider as location, taroW
 export { TaroElement } from './dom/element.js';
 export { TaroEvent, createEvent, eventHandler, eventHandlerTTDom } from './dom/event.js';
 export { FormElement } from './dom/form.js';
-export { bumpNearestCtxEpochForRoot, getNearestCtx, isNearestCtxEnv } from './dom/nearest-ctx.js';
+export { bumpNearestCtxEpochForRoot, getNearestCtx, invalidateNearestCtx, isNearestCtxEnv } from './dom/nearest-ctx.js';
 export { TaroNode } from './dom/node.js';
 export { TaroRootElement } from './dom/root.js';
 export { Style } from './dom/style.js';

package/dist/runtime/index.js

@@ -13,7 +13,7 @@ export { taroHistoryProvider as history, taroLocationProvider as location, taroW
 export { TaroElement } from './dom/element.js';
 export { TaroEvent, createEvent, eventHandler, eventHandlerTTDom } from './dom/event.js';
 export { FormElement } from './dom/form.js';
-export { bumpNearestCtxEpochForRoot, getNearestCtx, isNearestCtxEnv } from './dom/nearest-ctx.js';
+export { bumpNearestCtxEpochForRoot, getNearestCtx, invalidateNearestCtx, isNearestCtxEnv } from './dom/nearest-ctx.js';
 export { TaroNode } from './dom/node.js';
 export { TaroRootElement } from './dom/root.js';
 export { Style } from './dom/style.js';

package/dist/runtime/utils/index.js

@@ -57,7 +57,7 @@ function isParentBound(node, type) {
         if (!node || node.nodeName === ROOT_STR || node.nodeName === 'root-portal') {
             return false;
         }
-        else if ((_a = node.__handlers[type]) === null || _a === void 0 ? void 0 : _a.length) {
+        else if ((_a = node.getEventHandlers(type)) === null || _a === void 0 ? void 0 : _a.length) {
             return true;
         }
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vite-plugin-taro-runtime",
-  "version": "0.7.12",
+  "version": "0.8.0-beta.0",
   "description": "Taro runtime, React, and platform support for vite-plugin-taro.",
   "author": "sep2",
   "license": "MIT",
@@ -72,6 +72,11 @@
     },
     "./plugin-framework-react/runtime": "./dist/plugin-framework-react/runtime.js",
     "./plugin-html/runtime": "./dist/plugin-html/runtime.js",
+    "./plugin-html/html-elements": {
+      "types": "./dist/plugin-html/html-elements.d.ts",
+      "import": "./dist/plugin-html/html-elements.js",
+      "default": "./dist/plugin-html/html-elements.js"
+    },
     "./plugin-platform-weapp/runtime": "./dist/plugin-platform-weapp/runtime.js",
     "./plugin-platform-weapp/components-react": {
       "types": "./dist/plugin-platform-weapp/types/components-react.d.ts",
@@ -119,6 +124,7 @@
     "README.md"
   ],
   "sideEffects": [
+    "./dist/runtime/index.js",
     "./dist/runtime/dom-external/index.js",
     "./dist/react/react.esm.js",
     "./dist/plugin-framework-react/runtime.js",

package/types/tt-document.d.ts

@@ -13,13 +13,30 @@ export interface TTNativeNode {
     removeChild(child: TTNativeNode): void
 }
 
+/** SDK Style exposes dynamic property setters alongside its whole-style and CSS-variable APIs. */
+export interface TTNativeStyle {
+    [name: string]: unknown
+    cssText: string
+    setProperty(name: string, value: string | number): void
+}
+
+/**
+ * 已核对的 TT SDK 4.4.0.3 包装事件在此保留原始平台负载，供 Taro 共享事件流程构造逻辑事件。
+ * 这里只声明桥接实际读取的形状；上游提供对应事件类型后可直接复用其声明。
+ * Taro 原生事件入口若直接接受 SDK 事件并完成负载转换，host 可移除对 _rawEvent 的依赖。
+ */
+export interface TTNativeEvent {
+    readonly _rawEvent: { readonly data: MpEvent }
+}
+
 export interface TTNativeElement extends TTNativeNode {
     id: string
+    readonly style: TTNativeStyle
     readonly attributes: Readonly<Record<string, unknown>>
     setAttribute(name: string, value: unknown): void
     removeAttribute(name: string): void
-    addEventListener(name: string, listener: (event: MpEvent) => unknown): void
-    removeEventListener(name: string, listener: (event: MpEvent) => unknown): void
+    addEventListener(name: string, listener: (event: TTNativeEvent) => unknown): void
+    removeEventListener(name: string, listener: (event: TTNativeEvent) => unknown): void
 }
 
 export interface TTNativeComponent extends TTNativeElement {
@@ -31,6 +48,8 @@ export interface TTNativeComponent extends TTNativeElement {
 export interface TTNativeDocument {
     getPageDocumentById(id: number): TTNativeElement | undefined
     createElement(name: string): TTNativeElement
+    /** Creates a native component resolved from the owning Page's registration, using Taro's SDK options. */
+    createNativeComponent(name: string, options: { __tt__inner__options__: { name: string } }): TTNativeComponent
     createTextNode(text: string): TTNativeNode
 }