@viewfly/core 0.0.1-alpha.1 → 0.0.1-alpha.10

package/bundles/model/component.d.ts

@@ -1,23 +1,25 @@
 import { Provider, ReflectiveInjector, AbstractType, Type, InjectionToken, InjectFlags, Injector } from '@tanbo/di';
-import { JSXProps, JSXElement, Props } from './jsx-element';
-export interface ComponentFactory {
-    (context: Injector): Component;
+import { Props, JSXElement, Key, JSXTypeof } from './jsx-element';
+export declare class JSXComponent {
+    createInstance: (injector: Component) => Component;
+    constructor(createInstance: (injector: Component) => Component);
 }
-export type JSXTemplate = JSXElement | ComponentFactory | null | void;
-export interface ComponentSetup {
-    (props: JSXProps<any>): () => JSXTemplate;
+export type JSXTemplate = JSXElement | JSXComponent | null | void;
+export interface ComponentSetup<T extends Props<any> = Props<any>> {
+    (props?: T): () => JSXTemplate;
 }
 /**
  * Viewfly 组件管理类，用于管理组件的生命周期，上下文等
  */
-export declare class Component extends ReflectiveInjector {
+export declare class Component extends ReflectiveInjector implements JSXTypeof {
     setup: ComponentSetup;
-    config: JSXProps<any> | null;
+    props: Props<any>;
+    key?: Key | undefined;
+    $$typeOf: ComponentSetup<Props<any>>;
     destroyCallbacks: LifeCycleCallback[];
     mountCallbacks: LifeCycleCallback[];
     propsChangedCallbacks: PropsChangedCallback<any>[];
     updatedCallbacks: LifeCycleCallback[];
-    props: Props;
     get dirty(): boolean;
     get changed(): boolean;
     protected _dirty: boolean;
@@ -26,7 +28,8 @@ export declare class Component extends ReflectiveInjector {
     private updatedDestroyCallbacks;
     private propsChangedDestroyCallbacks;
     private isFirstRending;
-    constructor(context: Injector, setup: ComponentSetup, config: JSXProps<any> | null);
+    constructor(context: Injector, setup: ComponentSetup, props: Props<any>, key?: Key | undefined);
+    is(target: JSXTypeof): boolean;
     addProvide<T>(providers: Provider<T> | Provider<T>[]): void;
     init(): {
         template: JSXTemplate;
@@ -35,7 +38,7 @@ export declare class Component extends ReflectiveInjector {
     markAsDirtied(): void;
     markAsChanged(): void;
     rendered(): void;
-    invokePropsChangedHooks(newProps: JSXProps<any> | null): void;
+    invokePropsChangedHooks(newProps: Props<any>): void;
     destroy(): void;
     private invokeMountHooks;
     private invokeUpdatedHooks;
@@ -43,7 +46,7 @@ export declare class Component extends ReflectiveInjector {
 export interface LifeCycleCallback {
     (): void | (() => void);
 }
-export interface PropsChangedCallback<T extends JSXProps<any>> {
+export interface PropsChangedCallback<T extends Props<any>> {
     (currentProps: T | null, oldProps: T | null): void | (() => void);
 }
 /**
@@ -94,7 +97,7 @@ export declare function onUpdated(callback: LifeCycleCallback): () => void;
  * }
  * ```
  */
-export declare function onPropsChanged<T extends JSXProps<any>>(callback: PropsChangedCallback<T>): () => void;
+export declare function onPropsChanged<T extends Props<any>>(callback: PropsChangedCallback<T>): () => void;
 /**
  * 当组件销毁时调用回调函数
  * @param callback
@@ -103,13 +106,13 @@ export declare function onDestroy(callback: () => void): void;
 export interface RefListener<T> {
     (current: T): void | (() => void);
 }
-export declare class Ref<T> {
+export declare class Ref<T extends object> {
     private callback;
-    private component;
-    private unListenFn;
-    constructor(callback: RefListener<T>, component: Component);
-    update(value: T): void;
-    unListen(): void;
+    private unBindMap;
+    private targetCaches;
+    constructor(callback: RefListener<T>);
+    bind(value: T): void;
+    unBind(value: T): void;
 }
 /**
  * 用于节点渲染完成时获取 DOM 节点
@@ -132,7 +135,7 @@ export declare class Ref<T> {
  * }
  * ```
  */
-export declare function useRef<T>(callback: RefListener<T>): Ref<T>;
+export declare function useRef<T extends object>(callback: RefListener<T>): Ref<T>;
 declare const depsKey: unique symbol;
 /**
  * 组件状态实例，直接调用可以获取最新的状态，通过 set 方法可以更新状态
@@ -144,10 +147,10 @@ export interface Signal<T> {
      */
     (): T;
     /**
-     * 更新组件状态的方法，可以传入最新的值，或者传入一个函数，并返回最新的值
+     * 更新组件状态的方法，可以传入最新的值
      * @param newState
      */
-    set(newState: T | ((oldState: T) => T)): void;
+    set(newState: T): void;
     [depsKey]: Set<LifeCycleCallback>;
 }
 /**
@@ -174,14 +177,35 @@ export interface Signal<T> {
  * }
  */
 export declare function useSignal<T>(state: T): Signal<T>;
+/**
+ * 使用派生值，Viewfly 会收集回调函数内同步执行时访问的 Signal，
+ * 并在你获取 useDerived 函数返回的 Signal 的值时，自动计算最新的值。
+ *
+ * @param callback
+ * @param isContinue 可选的停止函数，在每次值更新后调用，当返回值为 false 时，将不再监听依赖的变化
+ */
+export declare function useDerived<T>(callback: () => T, isContinue?: (data: T) => unknown): Signal<T>;
+export interface EffectCallback<T, U> {
+    (newValue: T, oldValue: U): void | (() => void);
+}
 /**
  * 监听状态变化，当任意一个状态发生变更时，触发回调。
  * useEffect 会返回一个取消监听的函数，调用此函数，可以取消监听。
  * 当在组件中调用时，组件销毁时会自动取消监听。
- * @param deps 依赖的状态 Signal，可以是一个 Signal，只可以一个数包含 Signal 的数组
+ * @param deps 依赖的状态 Signal，可以是一个 Signal，只可以一个数包含 Signal 的数组，或者是一个求值函数
  * @param effect 状态变更后的回调函数
  */
-export declare function useEffect(deps: Signal<any> | Signal<any>[], effect: LifeCycleCallback): () => void;
+export declare function useEffect<T>(deps: Signal<T>, effect: EffectCallback<T, T>): () => void;
+export declare function useEffect<T>(deps: [Signal<T>], effect: EffectCallback<[T], [T]>): () => void;
+export declare function useEffect<T, T1>(deps: [Signal<T>, Signal<T1>], effect: EffectCallback<[T, T1], [T, T1]>): () => void;
+export declare function useEffect<T, T1, T2>(deps: [Signal<T>, Signal<T1>, Signal<T2>], effect: EffectCallback<[T, T1, T2], [T, T1, T2]>): () => void;
+export declare function useEffect<T, T1, T2, T3>(deps: [Signal<T>, Signal<T1>, Signal<T2>, Signal<T3>], effect: EffectCallback<[T, T1, T2, T3], [T, T1, T2, T3]>): () => void;
+export declare function useEffect<T, T1, T2, T3, T4>(deps: [Signal<T>, Signal<T1>, Signal<T2>, Signal<T3>, Signal<T4>], effect: EffectCallback<[T, T1, T2, T3, T4], [T, T1, T2, T3, T4]>): () => void;
+export declare function useEffect<T, T1, T2, T3, T4, T5>(deps: [Signal<T>, Signal<T1>, Signal<T2>, Signal<T3>, Signal<T4>, Signal<T5>], effect: EffectCallback<[T, T1, T2, T3, T4, T5], [T, T1, T2, T3, T4, T5]>): () => void;
+export declare function useEffect<T, T1, T2, T3, T4, T5, T6>(deps: [Signal<T>, Signal<T1>, Signal<T2>, Signal<T3>, Signal<T4>, Signal<T5>, Signal<T6>], effect: EffectCallback<[T, T1, T2, T3, T4, T5, T6], [T, T1, T2, T3, T4, T5, T6]>): () => void;
+export declare function useEffect<T, T1, T2, T3, T4, T5, T6, T7>(deps: [Signal<T>, Signal<T1>, Signal<T2>, Signal<T3>, Signal<T4>, Signal<T5>, Signal<T6>, Signal<T7>], effect: EffectCallback<[T, T1, T2, T3, T4, T5, T6, T7], [T, T1, T2, T3, T4, T5, T6, T7]>): () => void;
+export declare function useEffect<T>(deps: () => T, effect: EffectCallback<T, T>): () => void;
+export declare function useEffect<T = any>(deps: Signal<any>[], effect: EffectCallback<T[], T[]>): () => void;
 /**
  * 通过 IoC 容器当前组件提供上下文共享数据的方法
  * @param provider

package/bundles/model/jsx-element.d.ts

@@ -1,39 +1,31 @@
-import { ComponentFactory, ComponentSetup } from './component';
-export type JSXChildNode = JSXElement | ComponentFactory | string | number | boolean | null | undefined;
-export interface JSXProps<T = JSXChildNode | JSXChildNode[]> {
+import { JSXComponent, ComponentSetup } from './component';
+export type JSXChildNode = JSXElement | JSXComponent | string | number | boolean | null | undefined | JSXChildNode[];
+export interface Props<T = JSXChildNode | JSXChildNode[]> {
     children?: T;
     [key: string]: any;
     [key: symbol]: any;
 }
-export declare function Fragment(props: Props | null): () => JSXFragment;
-export declare class JSXFragment {
-    props: Props | null;
-    constructor(props: Props | null);
+export declare const Fragment: () => never;
+export type Key = number | string;
+export declare function jsx<T extends JSXChildNode>(name: string, config: Props<T>, key?: Key): JSXElement;
+export declare function jsx<T extends JSXChildNode>(setup: ComponentSetup, config: Props<T>, key?: Key): JSXComponent;
+export declare function jsxs<T extends JSXChildNode[]>(name: string, config: Props<T>, key?: Key): JSXElement;
+export declare function jsxs<T extends JSXChildNode[]>(setup: ComponentSetup, config: Props<T>, key?: Key): JSXComponent;
+export interface JSXTypeof {
+    $$typeOf: string | ComponentSetup;
+    is(target: JSXTypeof): boolean;
 }
-export declare function jsx<T extends JSXChildNode>(name: string, config: JSXProps<T> | null): JSXElement;
-export declare function jsx<T extends JSXChildNode>(setup: ComponentSetup, config: JSXProps<T> | null): ComponentFactory;
-export declare function jsxs<T extends JSXChildNode[]>(name: string, config: JSXProps<T> | null): JSXElement;
-export declare function jsxs<T extends JSXChildNode[]>(setup: ComponentSetup, config: JSXProps<T> | null): ComponentFactory;
-export interface VElementListeners {
-    [listenKey: string]: <T extends Event>(ev: T) => any;
-}
-export declare class JSXText {
+export declare class JSXText implements JSXTypeof {
     text: string;
+    $$typeOf: string;
     constructor(text: string);
+    is(target: JSXTypeof): boolean;
 }
-export type VNode = JSXElement | ComponentFactory | JSXText;
-export declare class Props {
-    attrs: Map<string, any>;
-    styles: Map<string, string | number>;
-    classes: Set<string>;
-    listeners: VElementListeners;
-    children: VNode[];
-    constructor(props: JSXProps<JSXChildNode> | JSXProps<JSXChildNode[]> | null);
-    static classToArray(config: unknown): string[];
-}
-export declare class JSXElement {
+export declare class JSXElement implements JSXTypeof {
     name: string;
-    config: JSXProps<any> | null;
-    props: Props;
-    constructor(name: string, config: JSXProps<any> | null);
+    props: Props<any>;
+    key?: Key | undefined;
+    $$typeOf: string;
+    constructor(name: string, props: Props<any>, key?: Key | undefined);
+    is(target: JSXTypeof): boolean;
 }

package/bundles/model/root.component.d.ts

@@ -1,10 +1,11 @@
 import { Subject } from '@tanbo/stream';
+import { NullInjector } from '@tanbo/di';
 import { Component, ComponentSetup } from './component';
 /**
  * Viewfly 根组件，用于实现组件状态更新事件通知
  */
 export declare class RootComponent extends Component {
     changeEmitter: Subject<void>;
-    constructor(factory: ComponentSetup);
+    constructor(factory: ComponentSetup, parentInjector?: NullInjector);
     markAsChanged(): void;
 }

package/bundles/public-api.d.ts

@@ -1,5 +1,6 @@
 import 'reflect-metadata';
 export * from '@tanbo/di';
+export * from './_utils/make-error';
 export * from './foundation/_api';
 export * from './model/_api';
 export * from './viewfly';

package/bundles/viewfly.d.ts

@@ -1,7 +1,7 @@
-import { Provider, ReflectiveInjector } from '@tanbo/di';
+import { Injector, Provider, ReflectiveInjector } from '@tanbo/di';
 import { NativeNode } from './foundation/_api';
-import { ComponentFactory, JSXElement } from './model/_api';
-export type RootNode = JSXElement | ComponentFactory;
+import { JSXComponent, JSXElement } from './model/_api';
+export type RootNode = JSXElement | JSXComponent;
 /**
  * Viewfly 配置项
  */
@@ -14,6 +14,8 @@ export interface Config {
     autoUpdate?: boolean;
     /** 根节点 */
     root: RootNode;
+    /** 根组件的上下文 */
+    context?: Injector;
 }
 /**
  * Viewfly 核心类，用于启动一个 Viewfly 应用
@@ -27,7 +29,7 @@ export declare class Viewfly extends ReflectiveInjector {
     /**
      * 启动 Viewfly
      */
-    start(): void;
+    run(): void;
     /**
      * 销毁 Viewfly 实例
      */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@viewfly/core",
-  "version": "0.0.1-alpha.1",
+  "version": "0.0.1-alpha.10",
   "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",
@@ -16,7 +16,8 @@
   "keywords": [],
   "dependencies": {
     "@tanbo/di": "^1.1.4",
-    "@tanbo/stream": "^1.1.9"
+    "@tanbo/stream": "^1.1.9",
+    "reflect-metadata": "^0.1.13"
   },
   "devDependencies": {
     "@rollup/plugin-commonjs": "^23.0.2",
@@ -36,5 +37,5 @@
   "bugs": {
     "url": "https://github.com/viewfly/viewfly.git/issues"
   },
-  "gitHead": "abca65615d81e3a6617d5fe588cdf38142a3523a"
+  "gitHead": "6e542df7602aec6a451b2db9a89928ad8bb9f05a"
 }