@viewfly/core 2.0.0 → 2.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +67 -4
- package/dist/_utils/make-error.d.ts +1 -0
- package/dist/base/_api.d.ts +13 -0
- package/dist/base/_utils.d.ts +46 -0
- package/dist/base/component.d.ts +65 -0
- package/dist/base/context.d.ts +42 -0
- package/dist/base/dep.d.ts +9 -0
- package/dist/base/injection-tokens.d.ts +20 -0
- package/dist/base/jsx-element.d.ts +64 -0
- package/dist/base/lifecycle.d.ts +37 -0
- package/dist/base/memo.d.ts +8 -0
- package/dist/base/ref.d.ts +44 -0
- package/dist/base/renderer.d.ts +4 -0
- package/dist/base/root.component.d.ts +9 -0
- package/dist/base/types.d.ts +32 -0
- package/dist/di/_api.d.ts +10 -0
- package/dist/di/forward-ref.d.ts +10 -0
- package/dist/di/injectable.d.ts +20 -0
- package/dist/di/injection-token.d.ts +8 -0
- package/dist/di/injector.d.ts +26 -0
- package/dist/di/metadata.d.ts +43 -0
- package/dist/di/null-injector.d.ts +6 -0
- package/dist/di/provider.d.ts +30 -0
- package/dist/di/reflective-injector.d.ts +30 -0
- package/dist/di/reflective-provider.d.ts +20 -0
- package/dist/di/type.d.ts +7 -0
- package/dist/di/utils/_api.d.ts +3 -0
- package/dist/di/utils/annotations.d.ts +33 -0
- package/dist/di/utils/decorators.d.ts +17 -0
- package/dist/di/utils/stringify.d.ts +1 -0
- package/dist/index.d.ts +6 -0
- package/dist/index.esm.js +2243 -0
- package/dist/index.js +2322 -0
- package/dist/jsx-runtime/index.d.ts +7 -0
- package/dist/jsx-runtime/index.esm.js +2 -0
- package/dist/jsx-runtime/index.js +26 -0
- package/dist/jsx-runtime.d.ts +7 -0
- package/dist/reactive/_api.d.ts +5 -0
- package/dist/reactive/_help.d.ts +15 -0
- package/dist/reactive/array-handlers.d.ts +30 -0
- package/dist/reactive/computed.d.ts +4 -0
- package/dist/reactive/effect.d.ts +13 -0
- package/dist/reactive/iterable-iterator.d.ts +5 -0
- package/dist/reactive/map-handlers.d.ts +12 -0
- package/dist/reactive/reactive.d.ts +89 -0
- package/dist/reactive/set-handlers.d.ts +11 -0
- package/dist/reactive/shallow-reactive.d.ts +6 -0
- package/dist/reactive/watch.d.ts +1 -0
- package/dist/signals/_api.d.ts +3 -0
- package/dist/signals/derived.d.ts +9 -0
- package/dist/signals/effect.d.ts +22 -0
- package/dist/signals/signal.d.ts +38 -0
- package/dist/viewfly.d.ts +30 -0
- package/package.json +25 -25
- package/bundles/index.d.ts +0 -722
- package/bundles/index.esm.js +0 -2621
- package/bundles/index.js +0 -2695
- package/jsx-runtime/index.d.ts +0 -25
- package/jsx-runtime/index.esm.js +0 -11
- package/jsx-runtime/index.js +0 -14
- package/jsx-runtime/package.json +0 -29
- package/rollup-d.config.ts +0 -14
package/README.md
CHANGED
|
@@ -1,6 +1,69 @@
|
|
|
1
|
-
|
|
2
|
-
================================
|
|
1
|
+
# @viewfly/core
|
|
3
2
|
|
|
4
|
-
Viewfly
|
|
3
|
+
Viewfly 的**内核包**:函数组件、JSX、响应式与信号、`watch`、生命周期、`inject` 与 IoC 相关 API、以及 **`withMark`** 等与 UI 逻辑直接相关的入口均由此包提供。
|
|
5
4
|
|
|
6
|
-
|
|
5
|
+
在浏览器里挂载应用请使用 **`@viewfly/platform-browser`** 的 **`createApp`**(其内部使用本包提供的应用模型)。
|
|
6
|
+
|
|
7
|
+
---
|
|
8
|
+
|
|
9
|
+
## 安装
|
|
10
|
+
|
|
11
|
+
```bash
|
|
12
|
+
pnpm add @viewfly/core
|
|
13
|
+
# 或 npm / yarn
|
|
14
|
+
```
|
|
15
|
+
|
|
16
|
+
本包依赖 **`reflect-metadata`**。正常从 **`@viewfly/core`** 的主入口导入时,会随模块加载一并初始化;若你的打包拆包方式导致依赖注入相关运行时异常,可在应用入口**最先**增加显式导入:
|
|
17
|
+
|
|
18
|
+
```ts
|
|
19
|
+
import 'reflect-metadata'
|
|
20
|
+
```
|
|
21
|
+
|
|
22
|
+
更稳妥的做法以 [官网](https://viewfly.org) 与当前版本的说明为准。
|
|
23
|
+
|
|
24
|
+
---
|
|
25
|
+
|
|
26
|
+
## JSX / TSX 配置
|
|
27
|
+
|
|
28
|
+
在 **`tsconfig.json`** 中启用 automatic JSX runtime,并把来源指向本包:
|
|
29
|
+
|
|
30
|
+
```json
|
|
31
|
+
{
|
|
32
|
+
"compilerOptions": {
|
|
33
|
+
"jsx": "react-jsx",
|
|
34
|
+
"jsxImportSource": "@viewfly/core"
|
|
35
|
+
}
|
|
36
|
+
}
|
|
37
|
+
```
|
|
38
|
+
|
|
39
|
+
使用 Babel 时,将 `@babel/preset-react` 的 `runtime: "automatic"` 与 `importSource: "@viewfly/core"` 对齐上述行为。
|
|
40
|
+
|
|
41
|
+
---
|
|
42
|
+
|
|
43
|
+
## 能力速览(面向使用者)
|
|
44
|
+
|
|
45
|
+
以下为日常开发中最常见的方向,**具体类型与参数以类型定义和官网为准**。
|
|
46
|
+
|
|
47
|
+
| 方向 | 公开 API 与用法提示 |
|
|
48
|
+
|------|---------------------|
|
|
49
|
+
| 组件 | 函数组件:在 JSX 中当标签使用;配合生命周期钩子使用。 |
|
|
50
|
+
| 生命周期 | **`onMounted`**、**`onUpdated`**、**`onUnmounted`** 等(须在组件 setup 阶段调用)。 |
|
|
51
|
+
| 响应式 | **`reactive`**、**`shallowReactive`**、**`watch`** 等(`reactive` 模块)。 |
|
|
52
|
+
| 信号 | **`createSignal`**、**`createEffect`**、**`createDerived`** 等(`signals` 模块)。 |
|
|
53
|
+
| 依赖注入 | 在组件内用 **`inject`** 解析 token;用 **`Injectable()`** 声明可注入类;用 **`withAnnotation`** 或 **`createContext`** / **`createContextProvider`** 挂载 **`Provider`**;根应用上通过 **`createApp(...).provide(...)`**(由 **`@viewfly/platform-browser`** 提供)注册全局提供者。 |
|
|
54
|
+
| 自定义 DOM 属性标记 | **`withMark(marks, setup)`**:为组件渲染出的元素附加与 `marks` 同名的属性(常用于 scoped CSS 的 `scopeId` 等场景)。 |
|
|
55
|
+
|
|
56
|
+
**说明**:源码中可能存在标有 **`@internal`** 或未在官网文档化的符号,它们仅供框架内部或实验用途,**不建议业务代码依赖**;升级版本时也可能在无 semver 预告的情况下变更。
|
|
57
|
+
|
|
58
|
+
---
|
|
59
|
+
|
|
60
|
+
## 文档与示例
|
|
61
|
+
|
|
62
|
+
- **官方文档**:[viewfly.org](https://viewfly.org)
|
|
63
|
+
- **本仓库试跑**:仓库根目录执行 `pnpm dev` 打开 playground
|
|
64
|
+
|
|
65
|
+
---
|
|
66
|
+
|
|
67
|
+
## License
|
|
68
|
+
|
|
69
|
+
MIT
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare function makeError(name: string): (message: string) => Error;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
export * from './component';
|
|
2
|
+
export * from './context';
|
|
3
|
+
export * from './dep';
|
|
4
|
+
export * from './injection-tokens';
|
|
5
|
+
export * from './jsx-element';
|
|
6
|
+
export * from './lifecycle';
|
|
7
|
+
export * from './memo';
|
|
8
|
+
export * from './ref';
|
|
9
|
+
export * from './renderer';
|
|
10
|
+
export * from './root.component';
|
|
11
|
+
export * from './types';
|
|
12
|
+
export { comparePropsWithCallbacks } from './_utils';
|
|
13
|
+
export type { Atom, ElementNamespace } from './_utils';
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
import { Key, ViewFlyNode } from './jsx-element';
|
|
2
|
+
import { NativeNode } from './injection-tokens';
|
|
3
|
+
import { Component, ComponentSetup } from './component';
|
|
4
|
+
export declare function hasChange(newProps: Record<string, any>, oldProps: Record<string, any>): boolean;
|
|
5
|
+
export declare const refKey = "ref";
|
|
6
|
+
export declare function comparePropsWithCallbacks(oldProps: Record<string, any>, newProps: Record<string, any>, onDeleted: (key: string, oldValue: any) => void, onAdded: (key: string, value: any) => void, onUpdated: (key: string, newValue: any, oldValue: any) => void): void;
|
|
7
|
+
export declare function classToString(config: unknown): string;
|
|
8
|
+
export declare function styleToObject(style: string | Record<string, any>): Record<string, any>;
|
|
9
|
+
export declare const TextAtomType: unique symbol;
|
|
10
|
+
export declare const ElementAtomType: unique symbol;
|
|
11
|
+
export declare const ComponentAtomType: unique symbol;
|
|
12
|
+
export type ElementNamespace = string | void;
|
|
13
|
+
export interface TextAtom {
|
|
14
|
+
type: typeof TextAtomType;
|
|
15
|
+
index: number;
|
|
16
|
+
jsxNode: string;
|
|
17
|
+
nodeType: string;
|
|
18
|
+
key?: null;
|
|
19
|
+
nativeNode: NativeNode | null;
|
|
20
|
+
child: Atom | null;
|
|
21
|
+
sibling: Atom | null;
|
|
22
|
+
namespace: ElementNamespace;
|
|
23
|
+
}
|
|
24
|
+
export interface ElementAtom {
|
|
25
|
+
type: typeof ElementAtomType;
|
|
26
|
+
index: number;
|
|
27
|
+
nodeType: string;
|
|
28
|
+
key?: Key;
|
|
29
|
+
jsxNode: ViewFlyNode<string>;
|
|
30
|
+
nativeNode: NativeNode | null;
|
|
31
|
+
child: Atom | null;
|
|
32
|
+
sibling: Atom | null;
|
|
33
|
+
namespace: ElementNamespace;
|
|
34
|
+
}
|
|
35
|
+
export interface ComponentAtom {
|
|
36
|
+
type: typeof ComponentAtomType;
|
|
37
|
+
index: number;
|
|
38
|
+
nodeType: ComponentSetup;
|
|
39
|
+
key?: Key;
|
|
40
|
+
jsxNode: ViewFlyNode<ComponentSetup> | Component;
|
|
41
|
+
nativeNode: NativeNode | null;
|
|
42
|
+
child: Atom | null;
|
|
43
|
+
sibling: Atom | null;
|
|
44
|
+
namespace: ElementNamespace;
|
|
45
|
+
}
|
|
46
|
+
export type Atom = TextAtom | ElementAtom | ComponentAtom;
|
|
@@ -0,0 +1,65 @@
|
|
|
1
|
+
import { Key, Props } from './jsx-element';
|
|
2
|
+
import { NativeNode } from './injection-tokens';
|
|
3
|
+
import { JSX } from './types';
|
|
4
|
+
import { LifeCycleCallback } from './lifecycle';
|
|
5
|
+
import { ComponentAtom } from './_utils';
|
|
6
|
+
export declare function getSetupContext(need?: boolean): Component;
|
|
7
|
+
export type ClassNames = string | Record<string, unknown> | false | null | undefined | ClassNames[];
|
|
8
|
+
export interface ComponentInstance<P> {
|
|
9
|
+
$portalHost?: NativeNode;
|
|
10
|
+
$render(): JSXNode;
|
|
11
|
+
$useMemo?(currentProps: P, prevProps: P): boolean;
|
|
12
|
+
}
|
|
13
|
+
export type JSXNode = JSX.Element | JSX.ElementClass | string | number | boolean | null | undefined | Iterable<JSXNode>;
|
|
14
|
+
export interface ComponentSetup<P = any> {
|
|
15
|
+
(props: P): (() => JSXNode) | ComponentInstance<P>;
|
|
16
|
+
}
|
|
17
|
+
export interface ComponentViewMetadata {
|
|
18
|
+
atom: ComponentAtom;
|
|
19
|
+
host: NativeNode;
|
|
20
|
+
isParent: boolean;
|
|
21
|
+
rootHost: NativeNode;
|
|
22
|
+
}
|
|
23
|
+
/**
|
|
24
|
+
* Viewfly 组件管理类,用于管理组件的生命周期,上下文等
|
|
25
|
+
*/
|
|
26
|
+
export declare class Component {
|
|
27
|
+
readonly parentComponent: Component | null;
|
|
28
|
+
readonly type: ComponentSetup;
|
|
29
|
+
props: Record<string, any>;
|
|
30
|
+
readonly key?: Key;
|
|
31
|
+
instance: ComponentInstance<Props>;
|
|
32
|
+
changedSubComponents: Set<Component>;
|
|
33
|
+
get dirty(): boolean;
|
|
34
|
+
get changed(): boolean;
|
|
35
|
+
/**
|
|
36
|
+
* @internal
|
|
37
|
+
*/
|
|
38
|
+
viewMetadata: ComponentViewMetadata;
|
|
39
|
+
unmountedCallbacks?: LifeCycleCallback[] | null;
|
|
40
|
+
mountCallbacks?: LifeCycleCallback[] | null;
|
|
41
|
+
updatedCallbacks?: LifeCycleCallback[] | null;
|
|
42
|
+
private updatedDestroyCallbacks?;
|
|
43
|
+
protected _dirty: boolean;
|
|
44
|
+
protected _changed: boolean;
|
|
45
|
+
private isFirstRendering;
|
|
46
|
+
private rawProps;
|
|
47
|
+
private refs;
|
|
48
|
+
private listener;
|
|
49
|
+
constructor(parentComponent: Component | null, type: ComponentSetup, props: Record<string, any>, key?: Key);
|
|
50
|
+
markAsDirtied(): void;
|
|
51
|
+
markAsChanged(changedComponent?: Component): void;
|
|
52
|
+
render(update: (template: JSXNode, portalHost?: NativeNode) => void): void;
|
|
53
|
+
updateProps(newProps: Record<string, any>): void;
|
|
54
|
+
canUpdate(oldProps: Record<string, any>, newProps: Record<string, any>): boolean;
|
|
55
|
+
rerender(): JSXNode;
|
|
56
|
+
destroy(): void;
|
|
57
|
+
rendered(): void;
|
|
58
|
+
private invokeMountHooks;
|
|
59
|
+
private invokeUpdatedHooks;
|
|
60
|
+
}
|
|
61
|
+
/**
|
|
62
|
+
* 获取当前组件实例
|
|
63
|
+
*/
|
|
64
|
+
export declare function getCurrentInstance(): Component;
|
|
65
|
+
export declare function registryComponentDestroyCallback(fn: () => void): void;
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import { AbstractType, ClassProvider, ExistingProvider, ExtractValueType, FactoryProvider, InjectFlags, InjectionToken, Injector, Provider, Scope, Type, ValueProvider } from '../di/_api';
|
|
2
|
+
import { Props } from './jsx-element';
|
|
3
|
+
import { ComponentSetup } from './component';
|
|
4
|
+
export declare function createContext(providers: Provider[], scope?: Scope | null, parentInjector?: Injector): (props: Props) => () => import('./component').JSXNode | import('./component').JSXNode[];
|
|
5
|
+
export interface ContextProviderParams<T> {
|
|
6
|
+
provide: Type<T> | AbstractType<T> | InjectionToken<T>;
|
|
7
|
+
}
|
|
8
|
+
export interface ContextProvider<T> extends Props {
|
|
9
|
+
useClass?: ClassProvider<T>['useClass'];
|
|
10
|
+
useFactory?: FactoryProvider<T>['useFactory'];
|
|
11
|
+
useValue?: ValueProvider<T>['useValue'];
|
|
12
|
+
useExisting?: ExistingProvider<T>['useExisting'];
|
|
13
|
+
}
|
|
14
|
+
export declare function createContextProvider<T>(params: ContextProviderParams<T>): (props: ContextProvider<T>) => () => import('./jsx-element').ViewFlyNode<string | ComponentSetup<any>>;
|
|
15
|
+
/**
|
|
16
|
+
* 通过组件上下文获取 IoC 容器内数据的勾子方法
|
|
17
|
+
*/
|
|
18
|
+
export declare function inject<T extends Type<any> | AbstractType<any> | InjectionToken<any>, U = never>(token: T, notFoundValue?: U, flags?: InjectFlags): ExtractValueType<T> | U;
|
|
19
|
+
export interface ComponentAnnotation {
|
|
20
|
+
scope?: Scope;
|
|
21
|
+
providers?: Provider[];
|
|
22
|
+
}
|
|
23
|
+
/**
|
|
24
|
+
* 给组件添加注解
|
|
25
|
+
* @param annotation
|
|
26
|
+
* @param componentSetup
|
|
27
|
+
* @example
|
|
28
|
+
* ```ts
|
|
29
|
+
* export customScope = new Scope('scopeName')
|
|
30
|
+
* export const App = withAnnotation({
|
|
31
|
+
* scope: customScope,
|
|
32
|
+
* providers: [
|
|
33
|
+
* ExampleService
|
|
34
|
+
* ]
|
|
35
|
+
* }, function(props: Props) {
|
|
36
|
+
* return () => {
|
|
37
|
+
* return <div>...</div>
|
|
38
|
+
* }
|
|
39
|
+
* })
|
|
40
|
+
* ```
|
|
41
|
+
*/
|
|
42
|
+
export declare function withAnnotation<T extends ComponentSetup>(annotation: ComponentAnnotation, componentSetup: T): T;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
export declare class Dep {
|
|
2
|
+
effect: () => void;
|
|
3
|
+
destroyCallbacks: Array<() => void>;
|
|
4
|
+
constructor(effect: () => void);
|
|
5
|
+
destroy(): void;
|
|
6
|
+
}
|
|
7
|
+
export declare function getDepContext(): Dep | undefined;
|
|
8
|
+
export declare function pushDepContext(dep: Dep): void;
|
|
9
|
+
export declare function popDepContext(): void;
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { ElementNamespace } from './_utils';
|
|
2
|
+
export type NativeNode = Record<string, any>;
|
|
3
|
+
export declare abstract class NativeRenderer<ElementNode = NativeNode, TextNode = NativeNode> {
|
|
4
|
+
abstract createElement(name: string, namespace: ElementNamespace): ElementNode;
|
|
5
|
+
abstract createTextNode(textContent: string, namespace: ElementNamespace): TextNode;
|
|
6
|
+
abstract setProperty(node: ElementNode, key: string, value: any, namespace: ElementNamespace): void;
|
|
7
|
+
abstract appendChild(parent: ElementNode, newChild: ElementNode | TextNode, namespace: ElementNamespace): void;
|
|
8
|
+
abstract prependChild(parent: ElementNode, newChild: ElementNode | TextNode, namespace: ElementNamespace): void;
|
|
9
|
+
abstract removeProperty(node: ElementNode, key: string, namespace: ElementNamespace): void;
|
|
10
|
+
abstract setStyle(target: ElementNode, key: string, value: any, namespace: ElementNamespace): void;
|
|
11
|
+
abstract removeStyle(target: ElementNode, key: string, namespace: ElementNamespace): void;
|
|
12
|
+
abstract setClass(target: ElementNode, value: string, namespace: ElementNamespace): void;
|
|
13
|
+
abstract listen<T = any>(node: ElementNode, type: string, callback: (ev: T) => any, namespace: ElementNamespace): void;
|
|
14
|
+
abstract unListen(node: ElementNode, type: string, callback: (ev: any) => any, namespace: ElementNamespace): void;
|
|
15
|
+
abstract remove(node: ElementNode | TextNode, namespace: ElementNamespace): void;
|
|
16
|
+
abstract cleanChildren(node: ElementNode, namespace: ElementNamespace): void;
|
|
17
|
+
abstract syncTextContent(target: TextNode, content: string, namespace: ElementNamespace): void;
|
|
18
|
+
abstract insertAfter(newNode: ElementNode | TextNode, ref: ElementNode | TextNode, namespace: ElementNamespace): void;
|
|
19
|
+
abstract getNameSpace(type: string, namespace: ElementNamespace): string | void;
|
|
20
|
+
}
|
|
@@ -0,0 +1,64 @@
|
|
|
1
|
+
import { ComponentSetup, JSXNode } from './component';
|
|
2
|
+
import { NativeNode } from './injection-tokens';
|
|
3
|
+
export interface Props {
|
|
4
|
+
children?: JSXNode | JSXNode[];
|
|
5
|
+
}
|
|
6
|
+
export declare function Fragment(props: Props): () => JSXNode | JSXNode[];
|
|
7
|
+
export type Key = number | string;
|
|
8
|
+
export declare function jsx(type: string | ComponentSetup, props: Props & Record<string, any>, key?: Key): ViewFlyNode;
|
|
9
|
+
export declare const jsxs: typeof jsx;
|
|
10
|
+
export interface ViewFlyNode<T = string | ComponentSetup> {
|
|
11
|
+
type: T;
|
|
12
|
+
props: Props & Record<string, any>;
|
|
13
|
+
key?: Key;
|
|
14
|
+
}
|
|
15
|
+
export declare const JSXNodeFactory: {
|
|
16
|
+
createNode<T = string | ComponentSetup<any>>(type: T, props: Props & Record<string, any>, key?: Key): ViewFlyNode<T>;
|
|
17
|
+
};
|
|
18
|
+
/**
|
|
19
|
+
* 给组件的视图元素节点添加自定义属性标记
|
|
20
|
+
* @param marks
|
|
21
|
+
* @param setup
|
|
22
|
+
* @example
|
|
23
|
+
* ```tsx
|
|
24
|
+
* const App = withMark('mark', function(props) {
|
|
25
|
+
* return () => {
|
|
26
|
+
* return <div>...</div>
|
|
27
|
+
* }
|
|
28
|
+
* })
|
|
29
|
+
* ```
|
|
30
|
+
*/
|
|
31
|
+
export declare function withMark<T extends ComponentSetup>(marks: string | string[], setup: T): T;
|
|
32
|
+
/**
|
|
33
|
+
* 内部使用
|
|
34
|
+
* @internal
|
|
35
|
+
* @param mark
|
|
36
|
+
* @param render
|
|
37
|
+
*/
|
|
38
|
+
export declare function applyMark(mark: string | string[], render: () => JSXNode): JSXNode;
|
|
39
|
+
export interface PortalProps<T extends NativeNode> extends Props {
|
|
40
|
+
host: T;
|
|
41
|
+
}
|
|
42
|
+
/**
|
|
43
|
+
* 将子节点渲染到指定节点
|
|
44
|
+
* @param props
|
|
45
|
+
* @example
|
|
46
|
+
* ```tsx
|
|
47
|
+
* function App() {
|
|
48
|
+
* const modal = document.getElementById('modal')!
|
|
49
|
+
* return () => {
|
|
50
|
+
* return (
|
|
51
|
+
* <div>
|
|
52
|
+
* <Portal host={modal}>
|
|
53
|
+
* 这里的内容将渲染到 modal 节点
|
|
54
|
+
* </Portal>
|
|
55
|
+
* </div>
|
|
56
|
+
* )
|
|
57
|
+
* }
|
|
58
|
+
* }
|
|
59
|
+
* ```
|
|
60
|
+
*/
|
|
61
|
+
export declare function Portal<T extends NativeNode>(props: PortalProps<T>): {
|
|
62
|
+
$portalHost: T;
|
|
63
|
+
$render(): JSXNode | JSXNode[];
|
|
64
|
+
};
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
export interface LifeCycleCallback {
|
|
2
|
+
(): void | (() => void);
|
|
3
|
+
}
|
|
4
|
+
/**
|
|
5
|
+
* 当组件第一次渲染完成时触发
|
|
6
|
+
* @param callback
|
|
7
|
+
* ```tsx
|
|
8
|
+
* function App() {
|
|
9
|
+
* onMount(() => {
|
|
10
|
+
* console.log('App mounted!')
|
|
11
|
+
* })
|
|
12
|
+
* return () => <div>...</div>
|
|
13
|
+
* }
|
|
14
|
+
* ```
|
|
15
|
+
*/
|
|
16
|
+
export declare function onMounted(callback: LifeCycleCallback): void;
|
|
17
|
+
/**
|
|
18
|
+
* 当组件视图更新后调用
|
|
19
|
+
* @param callback
|
|
20
|
+
* ```tsx
|
|
21
|
+
* function App() {
|
|
22
|
+
* onUpdated(() => {
|
|
23
|
+
* console.log('App updated!')
|
|
24
|
+
* return () => {
|
|
25
|
+
* console.log('destroy prev update!')
|
|
26
|
+
* }
|
|
27
|
+
* })
|
|
28
|
+
* return () => <div>...</div>
|
|
29
|
+
* }
|
|
30
|
+
* ```
|
|
31
|
+
*/
|
|
32
|
+
export declare function onUpdated(callback: LifeCycleCallback): () => void;
|
|
33
|
+
/**
|
|
34
|
+
* 当组件销毁时调用回调函数
|
|
35
|
+
* @param callback
|
|
36
|
+
*/
|
|
37
|
+
export declare function onUnmounted(callback: () => void): void;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { Props } from './jsx-element';
|
|
2
|
+
import { ComponentInstance, JSXNode } from './component';
|
|
3
|
+
/**
|
|
4
|
+
* @deprecated 即将弃用,Viewfly 默认就有 memo 的效果
|
|
5
|
+
* @param canUseMemo
|
|
6
|
+
* @param render
|
|
7
|
+
*/
|
|
8
|
+
export declare function withMemo<T extends Props = Props>(canUseMemo: ComponentInstance<T>['$useMemo'], render: () => JSXNode): ComponentInstance<T>;
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
import { ComponentInstance } from './component';
|
|
2
|
+
export interface RefListener<T> {
|
|
3
|
+
(current: T): void | (() => void);
|
|
4
|
+
}
|
|
5
|
+
export type ExtractInstanceType<T, U = T extends (...args: any) => any ? ReturnType<T> : T> = U extends ComponentInstance<any> ? Omit<U, keyof ComponentInstance<any>> : U extends Function ? never : T;
|
|
6
|
+
export interface AbstractInstanceType<T extends Record<string, any>> {
|
|
7
|
+
(): T & ComponentInstance<any>;
|
|
8
|
+
}
|
|
9
|
+
export declare class DynamicRef<T> {
|
|
10
|
+
private callback;
|
|
11
|
+
private unBindMap;
|
|
12
|
+
private targetCaches;
|
|
13
|
+
constructor(callback: RefListener<T>);
|
|
14
|
+
bind(value: T): void;
|
|
15
|
+
unBind(value: T): void;
|
|
16
|
+
}
|
|
17
|
+
/**
|
|
18
|
+
* 用于节点渲染完成时获取 DOM 节点
|
|
19
|
+
* @param callback 获取 DOM 节点的回调函数
|
|
20
|
+
* @example
|
|
21
|
+
* ```tsx
|
|
22
|
+
* function App() {
|
|
23
|
+
* const ref = createDynamicRef(node => {
|
|
24
|
+
* function fn() {
|
|
25
|
+
* // do something...
|
|
26
|
+
* }
|
|
27
|
+
* node.addEventListener('click', fn)
|
|
28
|
+
* return () => {
|
|
29
|
+
* node.removeEventListener('click', fn)
|
|
30
|
+
* }
|
|
31
|
+
* })
|
|
32
|
+
* return () => {
|
|
33
|
+
* return <div ref={ref}>xxx</div>
|
|
34
|
+
* }
|
|
35
|
+
* }
|
|
36
|
+
* ```
|
|
37
|
+
*/
|
|
38
|
+
export declare function createDynamicRef<T, U = ExtractInstanceType<T>>(callback: RefListener<U>): DynamicRef<U>;
|
|
39
|
+
export declare class StaticRef<T> extends DynamicRef<T> {
|
|
40
|
+
get current(): T | null;
|
|
41
|
+
private _current;
|
|
42
|
+
constructor();
|
|
43
|
+
}
|
|
44
|
+
export declare function createRef<T, U = ExtractInstanceType<T>>(): StaticRef<U>;
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import { NativeNode, NativeRenderer } from './injection-tokens';
|
|
2
|
+
import { ElementNamespace } from './_utils';
|
|
3
|
+
import { Component } from './component';
|
|
4
|
+
export declare function createRenderer(component: Component, nativeRenderer: NativeRenderer, namespace: ElementNamespace): (host: NativeNode) => void;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { Component, ComponentSetup } from './component';
|
|
2
|
+
/**
|
|
3
|
+
* Viewfly 根组件,用于实现组件状态更新事件通知
|
|
4
|
+
*/
|
|
5
|
+
export declare class RootComponent extends Component {
|
|
6
|
+
private refresh;
|
|
7
|
+
constructor(factory: ComponentSetup, refresh: () => void);
|
|
8
|
+
markAsChanged(changedComponent?: Component): void;
|
|
9
|
+
}
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
import { Key, ViewFlyNode } from './jsx-element';
|
|
2
|
+
import { ComponentInstance, ComponentSetup } from './component';
|
|
3
|
+
import { DynamicRef, ExtractInstanceType } from './ref';
|
|
4
|
+
export declare namespace JSX {
|
|
5
|
+
type ElementType = keyof IntrinsicElements | ComponentSetup;
|
|
6
|
+
interface Element extends ViewFlyNode {
|
|
7
|
+
}
|
|
8
|
+
interface KeyedAttributes {
|
|
9
|
+
key?: Key;
|
|
10
|
+
}
|
|
11
|
+
interface IntrinsicAttributes extends KeyedAttributes {
|
|
12
|
+
ref?: any;
|
|
13
|
+
[key: string]: any;
|
|
14
|
+
}
|
|
15
|
+
interface RefAttributes<T> extends KeyedAttributes {
|
|
16
|
+
ref?: DynamicRef<ExtractInstanceType<T>> | DynamicRef<ExtractInstanceType<T>>[];
|
|
17
|
+
}
|
|
18
|
+
interface ElementClass<P = any> extends ComponentInstance<P> {
|
|
19
|
+
}
|
|
20
|
+
interface ElementAttributesProperty {
|
|
21
|
+
props: {};
|
|
22
|
+
}
|
|
23
|
+
interface ElementChildrenAttribute {
|
|
24
|
+
children: {};
|
|
25
|
+
}
|
|
26
|
+
interface IntrinsicElements {
|
|
27
|
+
[name: string]: any;
|
|
28
|
+
}
|
|
29
|
+
interface IntrinsicClassAttributes<T> {
|
|
30
|
+
ref?: DynamicRef<T>;
|
|
31
|
+
}
|
|
32
|
+
}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
export * from './forward-ref';
|
|
2
|
+
export * from './injectable';
|
|
3
|
+
export * from './injection-token';
|
|
4
|
+
export * from './injector';
|
|
5
|
+
export * from './metadata';
|
|
6
|
+
export * from './null-injector';
|
|
7
|
+
export * from './provider';
|
|
8
|
+
export * from './reflective-injector';
|
|
9
|
+
export * from './reflective-provider';
|
|
10
|
+
export * from './type';
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
export declare class Scope {
|
|
2
|
+
name: string;
|
|
3
|
+
constructor(name: string);
|
|
4
|
+
toString(): string;
|
|
5
|
+
}
|
|
6
|
+
export type ProvideScope = 'root' | Scope;
|
|
7
|
+
export interface InjectableOptions {
|
|
8
|
+
provideIn: ProvideScope;
|
|
9
|
+
}
|
|
10
|
+
export interface Injectable {
|
|
11
|
+
provideIn?: ProvideScope;
|
|
12
|
+
}
|
|
13
|
+
export interface InjectableDecorator {
|
|
14
|
+
(options?: InjectableOptions): ClassDecorator;
|
|
15
|
+
new (options?: InjectableOptions): Injectable;
|
|
16
|
+
}
|
|
17
|
+
/**
|
|
18
|
+
* 可注入类的装饰器
|
|
19
|
+
*/
|
|
20
|
+
export declare const Injectable: InjectableDecorator;
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import { AbstractType, Type } from './type';
|
|
2
|
+
import { InjectionToken } from './injection-token';
|
|
3
|
+
/**
|
|
4
|
+
* 查找规则
|
|
5
|
+
*/
|
|
6
|
+
export declare enum InjectFlags {
|
|
7
|
+
/** 默认查找规则 */
|
|
8
|
+
Default = "Default",
|
|
9
|
+
/** 锁定当前容器 */
|
|
10
|
+
Self = "Self",
|
|
11
|
+
/** 跳过当前容器 */
|
|
12
|
+
SkipSelf = "SkipSelf",
|
|
13
|
+
/** 可选查找 */
|
|
14
|
+
Optional = "Optional"
|
|
15
|
+
}
|
|
16
|
+
/**
|
|
17
|
+
* 根据 token 推断返回数据类型
|
|
18
|
+
*/
|
|
19
|
+
export type ExtractValueType<T> = T extends Type<any> ? InstanceType<T> : T extends AbstractType<infer K> ? K : T extends InjectionToken<infer V> ? V : never;
|
|
20
|
+
/**
|
|
21
|
+
* DI 容器抽象基类
|
|
22
|
+
*/
|
|
23
|
+
export declare abstract class Injector {
|
|
24
|
+
abstract parentInjector: Injector | null;
|
|
25
|
+
abstract get<T extends Type<any> | AbstractType<any> | InjectionToken<any>, U = never>(token: T, notFoundValue?: U, flags?: InjectFlags): ExtractValueType<T> | U;
|
|
26
|
+
}
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
import { AbstractType, Type } from './type';
|
|
2
|
+
import { ExtractValueType, InjectFlags } from './injector';
|
|
3
|
+
import { InjectionToken } from './injection-token';
|
|
4
|
+
import { ForwardRef } from './forward-ref';
|
|
5
|
+
export interface Inject {
|
|
6
|
+
token: InjectionToken<any> | Type<any> | ForwardRef<InjectionToken<any> | Type<any>>;
|
|
7
|
+
}
|
|
8
|
+
export interface InjectDecorator {
|
|
9
|
+
(token: InjectionToken<any> | Type<any> | ForwardRef<InjectionToken<any> | Type<any>>): ParameterDecorator;
|
|
10
|
+
new (token: InjectionToken<any> | Type<any> | ForwardRef<InjectionToken<any> | Type<any>>): Inject;
|
|
11
|
+
}
|
|
12
|
+
/**
|
|
13
|
+
* 构造函数参数装饰器,用于改变注入 token
|
|
14
|
+
*/
|
|
15
|
+
export declare const Inject: InjectDecorator;
|
|
16
|
+
export interface Self {
|
|
17
|
+
}
|
|
18
|
+
export interface SelfDecorator {
|
|
19
|
+
(): ParameterDecorator;
|
|
20
|
+
new (): Self;
|
|
21
|
+
}
|
|
22
|
+
export declare const Self: SelfDecorator;
|
|
23
|
+
export interface SkipSelf {
|
|
24
|
+
}
|
|
25
|
+
export interface SkipSelfDecorator {
|
|
26
|
+
(): ParameterDecorator;
|
|
27
|
+
new (): SkipSelf;
|
|
28
|
+
}
|
|
29
|
+
export declare const SkipSelf: SkipSelfDecorator;
|
|
30
|
+
export interface Optional {
|
|
31
|
+
}
|
|
32
|
+
export interface OptionalDecorator {
|
|
33
|
+
(): ParameterDecorator;
|
|
34
|
+
new (): Optional;
|
|
35
|
+
}
|
|
36
|
+
export declare const Optional: OptionalDecorator;
|
|
37
|
+
export interface Prop {
|
|
38
|
+
}
|
|
39
|
+
export interface PropDecorator {
|
|
40
|
+
<T extends Type<any> | AbstractType<any> | InjectionToken<any>, U = never>(token?: T | ForwardRef<ExtractValueType<T>>, notFoundValue?: U, flags?: InjectFlags): PropertyDecorator;
|
|
41
|
+
new (token: any): Prop;
|
|
42
|
+
}
|
|
43
|
+
export declare const Prop: PropDecorator;
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import { AbstractType, Type } from './type';
|
|
2
|
+
import { InjectionToken } from './injection-token';
|
|
3
|
+
export interface ClassProvider<T = any> {
|
|
4
|
+
provide: Type<T> | AbstractType<T> | InjectionToken<T>;
|
|
5
|
+
useClass: Type<T>;
|
|
6
|
+
deps?: any[];
|
|
7
|
+
}
|
|
8
|
+
export interface FactoryProvider<T = any> {
|
|
9
|
+
provide: Type<T> | AbstractType<T> | InjectionToken<T>;
|
|
10
|
+
useFactory: (...args: any[]) => T;
|
|
11
|
+
deps?: any[];
|
|
12
|
+
}
|
|
13
|
+
export interface ValueProvider<T = any> {
|
|
14
|
+
provide: Type<T> | AbstractType<T> | InjectionToken<T>;
|
|
15
|
+
useValue: T;
|
|
16
|
+
}
|
|
17
|
+
export interface ExistingProvider<T = any> {
|
|
18
|
+
provide: Type<T> | AbstractType<T> | InjectionToken<T>;
|
|
19
|
+
useExisting: T;
|
|
20
|
+
}
|
|
21
|
+
export interface ConstructorProvider<T = any> {
|
|
22
|
+
provide: Type<T>;
|
|
23
|
+
deps?: [];
|
|
24
|
+
}
|
|
25
|
+
export interface TypeProvider<T = any> extends Type<T> {
|
|
26
|
+
}
|
|
27
|
+
export interface AbstractProvider<T = any> extends AbstractType<T> {
|
|
28
|
+
}
|
|
29
|
+
export type StaticProvider<T = any> = ClassProvider<T> | FactoryProvider<T> | ValueProvider<T> | ExistingProvider<T> | ConstructorProvider<T>;
|
|
30
|
+
export type Provider<T = any> = TypeProvider<T> | AbstractProvider<T> | StaticProvider<T>;
|