/
component.ts
77 lines (66 loc) · 2.26 KB
/
component.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
import Vue, { VueConstructor, VNode, ComponentOptions as Vue2ComponentOptions } from 'vue';
import { ComponentPropsOptions, ExtractPropTypes } from './componentProps';
import { UnwrapRef } from '../reactivity';
export type Data = { [key: string]: unknown };
export type ComponentInstance = InstanceType<VueConstructor>;
// public properties exposed on the proxy, which is used as the render context
// in templates (as `this` in the render option)
type ComponentRenderProxy<P = {}, S = {}, PublicProps = P> = {
$data: S;
$props: PublicProps;
$attrs: Data;
$refs: Data;
$slots: Data;
$root: ComponentInstance | null;
$parent: ComponentInstance | null;
$emit: (event: string, ...args: unknown[]) => void;
} & P &
S;
// for Vetur and TSX support
type VueConstructorProxy<PropsOptions, RawBindings> = {
new (): ComponentRenderProxy<
ExtractPropTypes<PropsOptions>,
UnwrapRef<RawBindings>,
ExtractPropTypes<PropsOptions, false>
>;
};
type VueProxy<PropsOptions, RawBindings> = Vue2ComponentOptions<
never,
UnwrapRef<RawBindings>,
never,
never,
PropsOptions,
ExtractPropTypes<PropsOptions, false>
> &
VueConstructorProxy<PropsOptions, RawBindings>;
export interface SetupContext {
readonly attrs: Record<string, string>;
readonly slots: { [key: string]: VNode[] | undefined };
readonly parent: ComponentInstance | null;
root: ComponentInstance;
emit(event: string, ...args: any[]): void;
}
type RenderFunction<Props> = (props: Props, ctx: SetupContext) => VNode;
export type SetupFunction<Props, RawBindings> = (
this: void,
props: Props,
ctx: SetupContext
) => RawBindings | RenderFunction<Props>;
export interface ComponentOptions<
PropsOptions = ComponentPropsOptions,
RawBindings = Data,
Props = ExtractPropTypes<PropsOptions>
> {
props?: PropsOptions;
setup?: SetupFunction<Props, RawBindings>;
}
// object format with object props declaration
// see `ExtractPropTypes` in ./componentProps.ts
export function createComponent<PropsOptions, RawBindings>(
options: ComponentOptions<PropsOptions, RawBindings> &
Omit<Vue2ComponentOptions<Vue>, keyof ComponentOptions<never, never>>
): VueProxy<PropsOptions, RawBindings>;
// implementation, close to no-op
export function createComponent(options: any) {
return options as any;
}