@viewfly/core 1.1.10 → 2.0.0-alpha.0

package/bundles/index.d.ts

@@ -413,19 +413,14 @@ interface ComponentInstance<P> {
     $useMemo?(currentProps: P, prevProps: P): boolean;
 }
 type JSXNode = JSX.Element | JSX.ElementClass | string | number | boolean | null | undefined | Iterable<JSXNode>;
-interface ComponentAnnotation {
-    scope?: Scope;
-    providers?: Provider[];
-}
 interface ComponentSetup<P = any> {
     (props: P): (() => JSXNode) | ComponentInstance<P>;
-    annotation?: ComponentAnnotation;
 }
 /**
  * Viewfly 组件管理类，用于管理组件的生命周期，上下文等
  */
-declare class Component extends ReflectiveInjector {
-    private readonly parentComponent;
+declare class Component {
+    readonly parentComponent: Component | null;
     readonly type: ComponentSetup;
     props: Props;
     readonly key?: Key | undefined;
@@ -444,12 +439,11 @@ declare class Component extends ReflectiveInjector {
     private isFirstRendering;
     private refs;
     private listener;
-    constructor(parentComponent: Injector | null, type: ComponentSetup, props: Props, key?: Key | undefined);
+    constructor(parentComponent: Component | null, type: ComponentSetup, props: Props, key?: Key | undefined);
     markAsDirtied(): void;
     markAsChanged(changedComponent?: Component): void;
     render(update: (template: JSXNode, portalHost?: NativeNode) => void): void;
     update(newProps: Record<string, any>, updateChildren: (jsxNode: JSXNode) => void, reuseChildren: (skipSubComponentDiff: boolean) => void): void;
-    provide<T>(providers: Provider<T> | Provider<T>[]): void;
     destroy(): void;
     rendered(): void;
     private invokePropsChangedHooks;
@@ -457,38 +451,15 @@ declare class Component extends ReflectiveInjector {
     private invokeUpdatedHooks;
 }
 /**
- * 给组件添加注解
- * @param annotation
- * @param componentSetup
- * @example
- * ```ts
- * export customScope = new Scope('scopeName')
- * export const App = withAnnotation({
- *   scope: customScope,
- *   providers: [
- *     ExampleService
- *   ]
- * }, function(props: Props) {
- *   return () => {
- *     return <div>...</div>
- *   }
- * })
- * ```
+ * 获取当前组件实例
  */
-declare function withAnnotation<T extends ComponentSetup>(annotation: ComponentAnnotation, componentSetup: T): T;
+declare function getCurrentInstance(): Component;
+
+declare function createContext(providers: Provider[], scope?: Scope, parentInjector?: Injector): (props: Props) => () => JSXNode | JSXNode[];
 /**
  * 通过组件上下文获取 IoC 容器内数据的勾子方法
  */
 declare function inject<T extends Type<any> | AbstractType<any> | InjectionToken<any>, U = never>(token: T, notFoundValue?: U, flags?: InjectFlags): ExtractValueType<T> | U;
-/**
- * 获取当前组件实例
- */
-declare function getCurrentInstance(): Component;
-
-interface ContextProps extends Props {
-    providers: Provider[];
-}
-declare function Context(props: ContextProps): () => ViewFlyNode<string | ComponentSetup<any>>;
 
 declare function withMemo<T extends Props = Props>(canUseMemo: ComponentInstance<T>['$useMemo'], render: () => JSXNode): ComponentInstance<T>;
 
@@ -500,7 +471,7 @@ declare function createRenderer(component: Component, nativeRenderer: NativeRend
  */
 declare class RootComponent extends Component {
     private refresh;
-    constructor(parentInjector: Injector | null, factory: ComponentSetup, refresh: () => void);
+    constructor(factory: ComponentSetup, refresh: () => void);
     markAsChanged(changedComponent?: Component): void;
 }
 
@@ -602,4 +573,4 @@ interface Module {
 }
 declare function viewfly<T extends NativeNode>(config: Config): Application<T>;
 
-export { type AbstractInstanceType, type AbstractProvider, type AbstractType, type Application, type Atom, type ClassNames, type ClassProvider, Component, type ComponentAnnotation, type ComponentInstance, type ComponentSetup, type ComponentView, type Config, type ConstructorProvider, Context, type ContextProps, DynamicRef, type ElementNamespace, ElementNamespaceMap, type ExistingProvider, type ExtractInstanceType, type ExtractValueType, type FactoryProvider, ForwardRef, Fragment, Inject, type InjectDecorator, InjectFlags, Injectable, type InjectableDecorator, type InjectableOptions, InjectionToken, Injector, JSX, type JSXNode, JSXNodeFactory, type Key, type LifeCycleCallback, type Module, type NativeNode, NativeRenderer, type NormalizedProvider, NullInjector, Optional, type OptionalDecorator, Prop, type PropDecorator, type Props, type PropsChangedCallback, type ProvideScope, type Provider, type RefListener, type ReflectiveDependency, ReflectiveInjector, RootComponent, Scope, Self, type SelfDecorator, type Signal, SkipSelf, type SkipSelfDecorator, type StaticProvider, StaticRef, THROW_IF_NOT_FOUND, Type, type TypeProvider, type ValueProvider, type ViewFlyNode, type WatchCallback, computed, createDerived, createDynamicRef, createRef, createRenderer, createSignal, forwardRef, getCurrentInstance, getSetupContext, inject, jsx, jsxs, makeError, normalizeProvider, onMounted, onPropsChanged, onUnmounted, onUpdated, viewfly, watch, withAnnotation, withMemo };
+export { type AbstractInstanceType, type AbstractProvider, type AbstractType, type Application, type Atom, type ClassNames, type ClassProvider, Component, type ComponentInstance, type ComponentSetup, type ComponentView, type Config, type ConstructorProvider, DynamicRef, type ElementNamespace, ElementNamespaceMap, type ExistingProvider, type ExtractInstanceType, type ExtractValueType, type FactoryProvider, ForwardRef, Fragment, Inject, type InjectDecorator, InjectFlags, Injectable, type InjectableDecorator, type InjectableOptions, InjectionToken, Injector, JSX, type JSXNode, JSXNodeFactory, type Key, type LifeCycleCallback, type Module, type NativeNode, NativeRenderer, type NormalizedProvider, NullInjector, Optional, type OptionalDecorator, Prop, type PropDecorator, type Props, type PropsChangedCallback, type ProvideScope, type Provider, type RefListener, type ReflectiveDependency, ReflectiveInjector, RootComponent, Scope, Self, type SelfDecorator, type Signal, SkipSelf, type SkipSelfDecorator, type StaticProvider, StaticRef, THROW_IF_NOT_FOUND, Type, type TypeProvider, type ValueProvider, type ViewFlyNode, type WatchCallback, computed, createContext, createDerived, createDynamicRef, createRef, createRenderer, createSignal, forwardRef, getCurrentInstance, getSetupContext, inject, jsx, jsxs, makeError, normalizeProvider, onMounted, onPropsChanged, onUnmounted, onUpdated, viewfly, watch, withMemo };

package/bundles/index.esm.js

@@ -912,7 +912,7 @@ function toRefs(ref) {
 /**
  * Viewfly 组件管理类，用于管理组件的生命周期，上下文等
  */
-class Component extends ReflectiveInjector {
+class Component {
     get dirty() {
         return this._dirty;
     }
@@ -920,12 +920,6 @@ class Component extends ReflectiveInjector {
         return this._changed;
     }
     constructor(parentComponent, type, props, key) {
-        const annotation = type.annotation || {};
-        const providers = annotation.providers || [];
-        super(parentComponent, [...providers, {
-                provide: Injector,
-                useFactory: () => this
-            }], annotation.scope);
         Object.defineProperty(this, "parentComponent", {
             enumerable: true,
             configurable: true,
@@ -962,7 +956,6 @@ class Component extends ReflectiveInjector {
             writable: true,
             value: new Set()
         });
-        // $$view!: ComponentView
         Object.defineProperty(this, "unmountedCallbacks", {
             enumerable: true,
             configurable: true,
@@ -1132,10 +1125,6 @@ class Component extends ReflectiveInjector {
         updateChildren(template);
         this.rendered();
     }
-    provide(providers) {
-        providers = Array.isArray(providers) ? providers : [providers];
-        this.normalizedProviders.unshift(...providers.map(i => normalizeProvider(i)));
-    }
     destroy() {
         var _a, _b, _c;
         this.listener.destroy();
@@ -1152,13 +1141,12 @@ class Component extends ReflectiveInjector {
             this.parentComponent.changedSubComponents.delete(this);
         }
         this.parentComponent =
-            this.parentInjector =
-                this.propsChangedDestroyCallbacks =
-                    this.updatedDestroyCallbacks =
-                        this.mountCallbacks =
-                            this.updatedCallbacks =
-                                this.propsChangedCallbacks =
-                                    this.unmountedCallbacks = null;
+            this.propsChangedDestroyCallbacks =
+                this.updatedDestroyCallbacks =
+                    this.mountCallbacks =
+                        this.updatedCallbacks =
+                            this.propsChangedCallbacks =
+                                this.unmountedCallbacks = null;
         this.changedSubComponents.clear();
     }
     rendered() {
@@ -1236,43 +1224,44 @@ class Component extends ReflectiveInjector {
     }
 }
 /**
- * 给组件添加注解
- * @param annotation
- * @param componentSetup
- * @example
- * ```ts
- * export customScope = new Scope('scopeName')
- * export const App = withAnnotation({
- *   scope: customScope,
- *   providers: [
- *     ExampleService
- *   ]
- * }, function(props: Props) {
- *   return () => {
- *     return <div>...</div>
- *   }
- * })
- * ```
+ * 获取当前组件实例
  */
-function withAnnotation(annotation, componentSetup) {
-    const setup = function setup(props) {
-        return componentSetup(props);
+function getCurrentInstance() {
+    return getSetupContext();
+}
+
+const injectMap = new WeakMap();
+function getParentInjector(component) {
+    let start = component.parentComponent;
+    while (start) {
+        const injector = injectMap.get(start);
+        if (injector) {
+            return injector;
+        }
+        start = start.parentComponent;
+    }
+    return new NullInjector();
+}
+function createContext(providers, scope, parentInjector) {
+    return function context(props) {
+        const instance = getCurrentInstance();
+        const injector = new ReflectiveInjector(parentInjector || getParentInjector(instance), providers, scope);
+        injectMap.set(instance, injector);
+        return () => {
+            return props.children;
+        };
     };
-    setup.annotation = annotation;
-    return setup;
 }
 /**
  * 通过组件上下文获取 IoC 容器内数据的勾子方法
  */
 function inject(token, notFoundValue = THROW_IF_NOT_FOUND, flags) {
-    const component = getSetupContext();
-    return component.get(token, notFoundValue, flags);
+    const component = getCurrentInstance();
+    const injector = getParentInjector(component);
+    return injector.get(token, notFoundValue, flags);
 }
-/**
- * 获取当前组件实例
- */
-function getCurrentInstance() {
-    return getSetupContext();
+
+class NativeRenderer {
 }
 
 function Fragment(props) {
@@ -1294,33 +1283,6 @@ const JSXNodeFactory = {
     }
 };
 
-function Context(props) {
-    function createContextComponent(providers) {
-        return withAnnotation({
-            providers,
-        }, (childProps) => {
-            return () => {
-                return childProps.children;
-            };
-        });
-    }
-    let contextComponent = createContextComponent(props.providers);
-    onPropsChanged((newProps, oldProps) => {
-        if (newProps.providers === oldProps.providers) {
-            return;
-        }
-        contextComponent = createContextComponent(newProps.providers);
-    });
-    return () => {
-        return jsx(contextComponent, {
-            children: props.children
-        });
-    };
-}
-
-class NativeRenderer {
-}
-
 function withMemo(canUseMemo, render) {
     return {
         $useMemo: canUseMemo,
@@ -1408,9 +1370,8 @@ function applyChanges(nativeRenderer, component, atom, context, needMove) {
             view.host = context.host;
             view.isParent = context.isParent;
         }
-    }, () => {
-        // console.log(skipSubComponentDiff, '----')
-        //
+    }, (skipSubComponentDiff) => {
+        reuseComponentView(nativeRenderer, atom, context, needMove, skipSubComponentDiff);
     });
 }
 function diff(nativeRenderer, parentComponent, newAtom, oldAtom, context, needMove) {
@@ -1580,27 +1541,31 @@ function cleanElementChildren(atom, nativeRenderer) {
     }
 }
 function cleanView(nativeRenderer, atom, needClean) {
-    if (atom.nativeNode) {
-        if (needClean) {
-            nativeRenderer.remove(atom.nativeNode, atom.namespace);
-            needClean = false;
-        }
-        if (atom.type === ElementAtomType) {
-            const ref = atom.jsxNode.props[refKey];
-            applyRefs(ref, atom.nativeNode, false);
+    if (atom.type === ComponentAtomType) {
+        const jsxNode = atom.jsxNode;
+        if (jsxNode.instance.$portalHost) {
+            needClean = true;
         }
+        cleanChildren(atom, nativeRenderer, needClean);
+        jsxNode.destroy();
+        return;
+    }
+    if (needClean) {
+        nativeRenderer.remove(atom.nativeNode, atom.namespace);
+        needClean = false;
+    }
+    if (atom.type === ElementAtomType) {
+        const ref = atom.jsxNode.props[refKey];
+        applyRefs(ref, atom.nativeNode, false);
     }
+    cleanChildren(atom, nativeRenderer, needClean);
+}
+function cleanChildren(atom, nativeRenderer, needClean) {
     let child = atom.child;
     while (child) {
-        if (child.jsxNode instanceof Component && child.jsxNode.instance.$portalHost) {
-            needClean = true;
-        }
         cleanView(nativeRenderer, child, needClean);
         child = child.sibling;
     }
-    if (atom.jsxNode instanceof Component) {
-        atom.jsxNode.destroy();
-    }
 }
 function componentRender(nativeRenderer, component, from, context) {
     component.render((template, portalHost) => {
@@ -1653,7 +1618,9 @@ function createChainByNode(jsxNode, prevAtom, elementNamespace) {
     return prevAtom;
 }
 function createChainByChildren(children, prevAtom, elementNamespace) {
-    for (const item of children) {
+    const len = children.length;
+    for (let i = 0; i < len; i++) {
+        const item = children[i];
         prevAtom = createChainByNode(item, prevAtom, elementNamespace);
     }
     return prevAtom;
@@ -1745,7 +1712,9 @@ function updateNativeNodeProperties(nativeRenderer, newAtom, oldAtom, parentComp
     let unBindRefs;
     let bindRefs;
     let updatedChildren = false;
-    for (const [key, value] of changes.remove) {
+    let len = changes.remove.length;
+    for (let i = 0; i < len; i++) {
+        const [key, value] = changes.remove[i];
         if (key === 'children') {
             updatedChildren = true;
             cleanElementChildren(oldAtom, nativeRenderer);
@@ -1773,7 +1742,9 @@ function updateNativeNodeProperties(nativeRenderer, newAtom, oldAtom, parentComp
         }
         nativeRenderer.removeProperty(nativeNode, key, isSvg);
     }
-    for (const [key, newValue, oldValue] of changes.replace) {
+    len = changes.replace.length;
+    for (let i = 0; i < len; i++) {
+        const [key, newValue, oldValue] = changes.replace[i];
         if (key === 'children') {
             updatedChildren = true;
             newAtom.child = createChildChain(newValue, isSvg);
@@ -1818,7 +1789,9 @@ function updateNativeNodeProperties(nativeRenderer, newAtom, oldAtom, parentComp
         }
         nativeRenderer.setProperty(nativeNode, key, newValue, isSvg);
     }
-    for (const [key, value] of changes.add) {
+    len = changes.add.length;
+    for (let i = 0; i < len; i++) {
+        const [key, value] = changes.add[i];
         if (key === 'children') {
             updatedChildren = true;
             newAtom.child = createChildChain(value, isSvg);
@@ -1858,7 +1831,9 @@ function updateNativeNodeProperties(nativeRenderer, newAtom, oldAtom, parentComp
 function applyRefs(refs, nativeNode, binding) {
     if (refs) {
         const refList = Array.isArray(refs) ? refs : [refs];
-        for (const item of refList) {
+        const len = refList.length;
+        for (let i = 0; i < len; i++) {
+            const item = refList[i];
             if (item instanceof DynamicRef) {
                 binding ? item.bind(nativeNode) : item.unBind(nativeNode);
             }
@@ -1870,8 +1845,8 @@ function applyRefs(refs, nativeNode, binding) {
  * Viewfly 根组件，用于实现组件状态更新事件通知
  */
 class RootComponent extends Component {
-    constructor(parentInjector, factory, refresh) {
-        super(parentInjector, factory, {});
+    constructor(factory, refresh) {
+        super(null, factory, {});
         Object.defineProperty(this, "refresh", {
             enumerable: true,
             configurable: true,
@@ -2021,16 +1996,15 @@ function viewfly(config) {
     const modules = [];
     let destroyed = false;
     let appHost = null;
-    const rootComponent = new RootComponent(context || null, withAnnotation({
-        providers: [{
-                provide: NativeRenderer,
-                useValue: nativeRenderer
-            }]
-    }, () => {
+    const rootProviders = [];
+    const rootComponent = new RootComponent(() => {
+        const rootContext = createContext(rootProviders, void 0, context);
         return () => {
-            return destroyed ? null : root;
+            return jsx(rootContext, {
+                children: destroyed ? null : root
+            });
         };
-    }), function () {
+    }, function () {
         if (destroyed || !autoUpdate) {
             return;
         }
@@ -2052,7 +2026,8 @@ function viewfly(config) {
     }
     const app = {
         provide(providers) {
-            rootComponent.provide(providers);
+            providers = Array.isArray(providers) ? providers : [providers];
+            rootProviders.push(...providers);
             return app;
         },
         use(module) {
@@ -2102,4 +2077,4 @@ function viewfly(config) {
     return app;
 }
 
-export { Component, Context, DynamicRef, ElementNamespaceMap, ForwardRef, Fragment, Inject, InjectFlags, Injectable, InjectionToken, Injector, JSXNodeFactory, NativeRenderer, NullInjector, Optional, Prop, ReflectiveInjector, RootComponent, Scope, Self, SkipSelf, StaticRef, THROW_IF_NOT_FOUND, Type, computed, createDerived, createDynamicRef, createRef, createRenderer, createSignal, forwardRef, getCurrentInstance, getSetupContext, inject, jsx, jsxs, makeError, normalizeProvider, onMounted, onPropsChanged, onUnmounted, onUpdated, viewfly, watch, withAnnotation, withMemo };
+export { Component, DynamicRef, ElementNamespaceMap, ForwardRef, Fragment, Inject, InjectFlags, Injectable, InjectionToken, Injector, JSXNodeFactory, NativeRenderer, NullInjector, Optional, Prop, ReflectiveInjector, RootComponent, Scope, Self, SkipSelf, StaticRef, THROW_IF_NOT_FOUND, Type, computed, createContext, createDerived, createDynamicRef, createRef, createRenderer, createSignal, forwardRef, getCurrentInstance, getSetupContext, inject, jsx, jsxs, makeError, normalizeProvider, onMounted, onPropsChanged, onUnmounted, onUpdated, viewfly, watch, withMemo };

package/bundles/index.js

@@ -914,7 +914,7 @@ function toRefs(ref) {
 /**
  * Viewfly 组件管理类，用于管理组件的生命周期，上下文等
  */
-class Component extends ReflectiveInjector {
+class Component {
     get dirty() {
         return this._dirty;
     }
@@ -922,12 +922,6 @@ class Component extends ReflectiveInjector {
         return this._changed;
     }
     constructor(parentComponent, type, props, key) {
-        const annotation = type.annotation || {};
-        const providers = annotation.providers || [];
-        super(parentComponent, [...providers, {
-                provide: Injector,
-                useFactory: () => this
-            }], annotation.scope);
         Object.defineProperty(this, "parentComponent", {
             enumerable: true,
             configurable: true,
@@ -964,7 +958,6 @@ class Component extends ReflectiveInjector {
             writable: true,
             value: new Set()
         });
-        // $$view!: ComponentView
         Object.defineProperty(this, "unmountedCallbacks", {
             enumerable: true,
             configurable: true,
@@ -1134,10 +1127,6 @@ class Component extends ReflectiveInjector {
         updateChildren(template);
         this.rendered();
     }
-    provide(providers) {
-        providers = Array.isArray(providers) ? providers : [providers];
-        this.normalizedProviders.unshift(...providers.map(i => normalizeProvider(i)));
-    }
     destroy() {
         var _a, _b, _c;
         this.listener.destroy();
@@ -1154,13 +1143,12 @@ class Component extends ReflectiveInjector {
             this.parentComponent.changedSubComponents.delete(this);
         }
         this.parentComponent =
-            this.parentInjector =
-                this.propsChangedDestroyCallbacks =
-                    this.updatedDestroyCallbacks =
-                        this.mountCallbacks =
-                            this.updatedCallbacks =
-                                this.propsChangedCallbacks =
-                                    this.unmountedCallbacks = null;
+            this.propsChangedDestroyCallbacks =
+                this.updatedDestroyCallbacks =
+                    this.mountCallbacks =
+                        this.updatedCallbacks =
+                            this.propsChangedCallbacks =
+                                this.unmountedCallbacks = null;
         this.changedSubComponents.clear();
     }
     rendered() {
@@ -1238,43 +1226,44 @@ class Component extends ReflectiveInjector {
     }
 }
 /**
- * 给组件添加注解
- * @param annotation
- * @param componentSetup
- * @example
- * ```ts
- * export customScope = new Scope('scopeName')
- * export const App = withAnnotation({
- *   scope: customScope,
- *   providers: [
- *     ExampleService
- *   ]
- * }, function(props: Props) {
- *   return () => {
- *     return <div>...</div>
- *   }
- * })
- * ```
+ * 获取当前组件实例
  */
-function withAnnotation(annotation, componentSetup) {
-    const setup = function setup(props) {
-        return componentSetup(props);
+function getCurrentInstance() {
+    return getSetupContext();
+}
+
+const injectMap = new WeakMap();
+function getParentInjector(component) {
+    let start = component.parentComponent;
+    while (start) {
+        const injector = injectMap.get(start);
+        if (injector) {
+            return injector;
+        }
+        start = start.parentComponent;
+    }
+    return new NullInjector();
+}
+function createContext(providers, scope, parentInjector) {
+    return function context(props) {
+        const instance = getCurrentInstance();
+        const injector = new ReflectiveInjector(parentInjector || getParentInjector(instance), providers, scope);
+        injectMap.set(instance, injector);
+        return () => {
+            return props.children;
+        };
     };
-    setup.annotation = annotation;
-    return setup;
 }
 /**
  * 通过组件上下文获取 IoC 容器内数据的勾子方法
  */
 function inject(token, notFoundValue = THROW_IF_NOT_FOUND, flags) {
-    const component = getSetupContext();
-    return component.get(token, notFoundValue, flags);
+    const component = getCurrentInstance();
+    const injector = getParentInjector(component);
+    return injector.get(token, notFoundValue, flags);
 }
-/**
- * 获取当前组件实例
- */
-function getCurrentInstance() {
-    return getSetupContext();
+
+class NativeRenderer {
 }
 
 function Fragment(props) {
@@ -1296,33 +1285,6 @@ const JSXNodeFactory = {
     }
 };
 
-function Context(props) {
-    function createContextComponent(providers) {
-        return withAnnotation({
-            providers,
-        }, (childProps) => {
-            return () => {
-                return childProps.children;
-            };
-        });
-    }
-    let contextComponent = createContextComponent(props.providers);
-    onPropsChanged((newProps, oldProps) => {
-        if (newProps.providers === oldProps.providers) {
-            return;
-        }
-        contextComponent = createContextComponent(newProps.providers);
-    });
-    return () => {
-        return jsx(contextComponent, {
-            children: props.children
-        });
-    };
-}
-
-class NativeRenderer {
-}
-
 function withMemo(canUseMemo, render) {
     return {
         $useMemo: canUseMemo,
@@ -1410,9 +1372,8 @@ function applyChanges(nativeRenderer, component, atom, context, needMove) {
             view.host = context.host;
             view.isParent = context.isParent;
         }
-    }, () => {
-        // console.log(skipSubComponentDiff, '----')
-        //
+    }, (skipSubComponentDiff) => {
+        reuseComponentView(nativeRenderer, atom, context, needMove, skipSubComponentDiff);
     });
 }
 function diff(nativeRenderer, parentComponent, newAtom, oldAtom, context, needMove) {
@@ -1582,27 +1543,31 @@ function cleanElementChildren(atom, nativeRenderer) {
     }
 }
 function cleanView(nativeRenderer, atom, needClean) {
-    if (atom.nativeNode) {
-        if (needClean) {
-            nativeRenderer.remove(atom.nativeNode, atom.namespace);
-            needClean = false;
-        }
-        if (atom.type === ElementAtomType) {
-            const ref = atom.jsxNode.props[refKey];
-            applyRefs(ref, atom.nativeNode, false);
+    if (atom.type === ComponentAtomType) {
+        const jsxNode = atom.jsxNode;
+        if (jsxNode.instance.$portalHost) {
+            needClean = true;
         }
+        cleanChildren(atom, nativeRenderer, needClean);
+        jsxNode.destroy();
+        return;
+    }
+    if (needClean) {
+        nativeRenderer.remove(atom.nativeNode, atom.namespace);
+        needClean = false;
+    }
+    if (atom.type === ElementAtomType) {
+        const ref = atom.jsxNode.props[refKey];
+        applyRefs(ref, atom.nativeNode, false);
     }
+    cleanChildren(atom, nativeRenderer, needClean);
+}
+function cleanChildren(atom, nativeRenderer, needClean) {
     let child = atom.child;
     while (child) {
-        if (child.jsxNode instanceof Component && child.jsxNode.instance.$portalHost) {
-            needClean = true;
-        }
         cleanView(nativeRenderer, child, needClean);
         child = child.sibling;
     }
-    if (atom.jsxNode instanceof Component) {
-        atom.jsxNode.destroy();
-    }
 }
 function componentRender(nativeRenderer, component, from, context) {
     component.render((template, portalHost) => {
@@ -1655,7 +1620,9 @@ function createChainByNode(jsxNode, prevAtom, elementNamespace) {
     return prevAtom;
 }
 function createChainByChildren(children, prevAtom, elementNamespace) {
-    for (const item of children) {
+    const len = children.length;
+    for (let i = 0; i < len; i++) {
+        const item = children[i];
         prevAtom = createChainByNode(item, prevAtom, elementNamespace);
     }
     return prevAtom;
@@ -1747,7 +1714,9 @@ function updateNativeNodeProperties(nativeRenderer, newAtom, oldAtom, parentComp
     let unBindRefs;
     let bindRefs;
     let updatedChildren = false;
-    for (const [key, value] of changes.remove) {
+    let len = changes.remove.length;
+    for (let i = 0; i < len; i++) {
+        const [key, value] = changes.remove[i];
         if (key === 'children') {
             updatedChildren = true;
             cleanElementChildren(oldAtom, nativeRenderer);
@@ -1775,7 +1744,9 @@ function updateNativeNodeProperties(nativeRenderer, newAtom, oldAtom, parentComp
         }
         nativeRenderer.removeProperty(nativeNode, key, isSvg);
     }
-    for (const [key, newValue, oldValue] of changes.replace) {
+    len = changes.replace.length;
+    for (let i = 0; i < len; i++) {
+        const [key, newValue, oldValue] = changes.replace[i];
         if (key === 'children') {
             updatedChildren = true;
             newAtom.child = createChildChain(newValue, isSvg);
@@ -1820,7 +1791,9 @@ function updateNativeNodeProperties(nativeRenderer, newAtom, oldAtom, parentComp
         }
         nativeRenderer.setProperty(nativeNode, key, newValue, isSvg);
     }
-    for (const [key, value] of changes.add) {
+    len = changes.add.length;
+    for (let i = 0; i < len; i++) {
+        const [key, value] = changes.add[i];
         if (key === 'children') {
             updatedChildren = true;
             newAtom.child = createChildChain(value, isSvg);
@@ -1860,7 +1833,9 @@ function updateNativeNodeProperties(nativeRenderer, newAtom, oldAtom, parentComp
 function applyRefs(refs, nativeNode, binding) {
     if (refs) {
         const refList = Array.isArray(refs) ? refs : [refs];
-        for (const item of refList) {
+        const len = refList.length;
+        for (let i = 0; i < len; i++) {
+            const item = refList[i];
             if (item instanceof DynamicRef) {
                 binding ? item.bind(nativeNode) : item.unBind(nativeNode);
             }
@@ -1872,8 +1847,8 @@ function applyRefs(refs, nativeNode, binding) {
  * Viewfly 根组件，用于实现组件状态更新事件通知
  */
 class RootComponent extends Component {
-    constructor(parentInjector, factory, refresh) {
-        super(parentInjector, factory, {});
+    constructor(factory, refresh) {
+        super(null, factory, {});
         Object.defineProperty(this, "refresh", {
             enumerable: true,
             configurable: true,
@@ -2023,16 +1998,15 @@ function viewfly(config) {
     const modules = [];
     let destroyed = false;
     let appHost = null;
-    const rootComponent = new RootComponent(context || null, withAnnotation({
-        providers: [{
-                provide: NativeRenderer,
-                useValue: nativeRenderer
-            }]
-    }, () => {
+    const rootProviders = [];
+    const rootComponent = new RootComponent(() => {
+        const rootContext = createContext(rootProviders, void 0, context);
         return () => {
-            return destroyed ? null : root;
+            return jsx(rootContext, {
+                children: destroyed ? null : root
+            });
         };
-    }), function () {
+    }, function () {
         if (destroyed || !autoUpdate) {
             return;
         }
@@ -2054,7 +2028,8 @@ function viewfly(config) {
     }
     const app = {
         provide(providers) {
-            rootComponent.provide(providers);
+            providers = Array.isArray(providers) ? providers : [providers];
+            rootProviders.push(...providers);
             return app;
         },
         use(module) {
@@ -2105,7 +2080,6 @@ function viewfly(config) {
 }
 
 exports.Component = Component;
-exports.Context = Context;
 exports.DynamicRef = DynamicRef;
 exports.ElementNamespaceMap = ElementNamespaceMap;
 exports.ForwardRef = ForwardRef;
@@ -2128,6 +2102,7 @@ exports.StaticRef = StaticRef;
 exports.THROW_IF_NOT_FOUND = THROW_IF_NOT_FOUND;
 exports.Type = Type;
 exports.computed = computed;
+exports.createContext = createContext;
 exports.createDerived = createDerived;
 exports.createDynamicRef = createDynamicRef;
 exports.createRef = createRef;
@@ -2147,5 +2122,4 @@ exports.onUnmounted = onUnmounted;
 exports.onUpdated = onUpdated;
 exports.viewfly = viewfly;
 exports.watch = watch;
-exports.withAnnotation = withAnnotation;
 exports.withMemo = withMemo;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@viewfly/core",
-  "version": "1.1.10",
+  "version": "2.0.0-alpha.0",
   "description": "Viewfly is a simple and easy-to-use JavaScript framework with an intuitive development experience.",
   "main": "./bundles/index.js",
   "module": "./bundles/index.esm.js",
@@ -50,7 +50,7 @@
   "bugs": {
     "url": "https://github.com/viewfly/viewfly.git/issues"
   },
-  "gitHead": "08cdabe11ffa8fb6c9c4bc53898881af2396f735",
+  "gitHead": "5fdcdcdca224d1eecdfd6a68abb1c3fb9c01d88a",
   "dependencies": {
     "reflect-metadata": "^0.2.2"
   }