@codehz/draw-call 0.1.0 → 0.1.2
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/canvas.d.cts +304 -0
- package/canvas.d.mts +304 -0
- package/index.cjs +76 -620
- package/index.d.cts +28 -223
- package/index.d.mts +28 -223
- package/index.mjs +67 -612
- package/node.cjs +48 -0
- package/node.d.cts +12 -0
- package/node.d.mts +12 -0
- package/node.mjs +48 -0
- package/package.json +23 -9
- package/render.cjs +1312 -0
- package/render.mjs +1288 -0
package/index.d.cts
CHANGED
|
@@ -1,237 +1,42 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
color: string;
|
|
6
|
-
}
|
|
7
|
-
interface LinearGradientDescriptor {
|
|
8
|
-
type: "linear-gradient";
|
|
9
|
-
angle: number;
|
|
10
|
-
stops: ColorStop[];
|
|
11
|
-
}
|
|
12
|
-
interface RadialGradientDescriptor {
|
|
13
|
-
type: "radial-gradient";
|
|
14
|
-
startX?: number;
|
|
15
|
-
startY?: number;
|
|
16
|
-
startRadius?: number;
|
|
17
|
-
endX?: number;
|
|
18
|
-
endY?: number;
|
|
19
|
-
endRadius?: number;
|
|
20
|
-
stops: ColorStop[];
|
|
21
|
-
}
|
|
22
|
-
type GradientDescriptor = LinearGradientDescriptor | RadialGradientDescriptor;
|
|
23
|
-
type Color = string | CanvasGradient | CanvasPattern | GradientDescriptor;
|
|
24
|
-
declare function linearGradient(angle: number, ...stops: (string | [number, string])[]): LinearGradientDescriptor;
|
|
25
|
-
declare function radialGradient(options: {
|
|
26
|
-
startX?: number;
|
|
27
|
-
startY?: number;
|
|
28
|
-
startRadius?: number;
|
|
29
|
-
endX?: number;
|
|
30
|
-
endY?: number;
|
|
31
|
-
endRadius?: number;
|
|
32
|
-
}, ...stops: (string | [number, string])[]): RadialGradientDescriptor;
|
|
33
|
-
interface Spacing {
|
|
34
|
-
top?: number;
|
|
35
|
-
right?: number;
|
|
36
|
-
bottom?: number;
|
|
37
|
-
left?: number;
|
|
38
|
-
}
|
|
39
|
-
interface Border {
|
|
40
|
-
width?: number;
|
|
41
|
-
color?: Color;
|
|
42
|
-
radius?: number | [number, number, number, number];
|
|
43
|
-
}
|
|
44
|
-
interface Shadow {
|
|
45
|
-
offsetX?: number;
|
|
46
|
-
offsetY?: number;
|
|
47
|
-
blur?: number;
|
|
48
|
-
color?: Color;
|
|
49
|
-
}
|
|
50
|
-
interface FontProps {
|
|
51
|
-
family?: string;
|
|
52
|
-
size?: number;
|
|
53
|
-
weight?: number | "normal" | "bold";
|
|
54
|
-
style?: "normal" | "italic";
|
|
55
|
-
}
|
|
56
|
-
interface StrokeProps {
|
|
57
|
-
color: Color;
|
|
58
|
-
width: number;
|
|
59
|
-
dash?: number[];
|
|
60
|
-
cap?: "butt" | "round" | "square";
|
|
61
|
-
join?: "miter" | "round" | "bevel";
|
|
62
|
-
}
|
|
63
|
-
interface Bounds {
|
|
64
|
-
x: number;
|
|
65
|
-
y: number;
|
|
66
|
-
width: number;
|
|
67
|
-
height: number;
|
|
68
|
-
}
|
|
1
|
+
import { A as AlignItems, B as Color, C as SvgProps, D as SvgTransformProps, E as SvgTextChild, F as LayoutConstraints, G as RadialGradientDescriptor, H as FontProps, I as LayoutNode, J as Spacing, K as Shadow, L as LayoutProps, M as ContainerLayoutProps, N as FlexDirection, O as TextElement, P as JustifyContent, R as Border, S as SvgPolylineChild, T as SvgStyleProps, U as GradientDescriptor, V as ColorStop, W as LinearGradientDescriptor, X as linearGradient, Y as StrokeProps, Z as radialGradient, _ as SvgEllipseChild, a as BoxElement, b as SvgPathChild, c as ImageElement, d as StackElement, f as StackProps, g as SvgElement, h as SvgCircleChild, i as createCanvas, j as AlignSelf, k as TextProps, l as ImageProps, m as SvgChild, n as DrawCallCanvas, o as BoxProps, p as SvgAlign, q as Size, r as LayoutSize, s as Element, t as CanvasOptions, u as StackAlign, v as SvgGroupChild, w as SvgRectChild, x as SvgPolygonChild, y as SvgLineChild, z as Bounds } from "./canvas.cjs";
|
|
2
|
+
|
|
3
|
+
//#region src/components/Box.d.ts
|
|
4
|
+
declare function Box(props: BoxProps): BoxElement;
|
|
69
5
|
//#endregion
|
|
70
|
-
//#region src/
|
|
71
|
-
|
|
72
|
-
type JustifyContent = "start" | "end" | "center" | "space-between" | "space-around" | "space-evenly";
|
|
73
|
-
type AlignItems = "start" | "end" | "center" | "stretch" | "baseline";
|
|
74
|
-
type AlignSelf = "auto" | AlignItems;
|
|
75
|
-
interface LayoutProps {
|
|
76
|
-
width?: Size;
|
|
77
|
-
height?: Size;
|
|
78
|
-
minWidth?: number;
|
|
79
|
-
maxWidth?: number;
|
|
80
|
-
minHeight?: number;
|
|
81
|
-
maxHeight?: number;
|
|
82
|
-
margin?: number | Spacing;
|
|
83
|
-
padding?: number | Spacing;
|
|
84
|
-
flex?: number;
|
|
85
|
-
alignSelf?: AlignSelf;
|
|
86
|
-
}
|
|
87
|
-
interface ContainerLayoutProps extends LayoutProps {
|
|
88
|
-
direction?: FlexDirection;
|
|
89
|
-
justify?: JustifyContent;
|
|
90
|
-
align?: AlignItems;
|
|
91
|
-
gap?: number;
|
|
92
|
-
wrap?: boolean;
|
|
93
|
-
}
|
|
94
|
-
interface ComputedLayout {
|
|
95
|
-
x: number;
|
|
96
|
-
y: number;
|
|
97
|
-
width: number;
|
|
98
|
-
height: number;
|
|
99
|
-
contentX: number;
|
|
100
|
-
contentY: number;
|
|
101
|
-
contentWidth: number;
|
|
102
|
-
contentHeight: number;
|
|
103
|
-
}
|
|
104
|
-
interface LayoutConstraints {
|
|
105
|
-
minWidth: number;
|
|
106
|
-
maxWidth: number;
|
|
107
|
-
minHeight: number;
|
|
108
|
-
maxHeight: number;
|
|
109
|
-
}
|
|
6
|
+
//#region src/components/Image.d.ts
|
|
7
|
+
declare function Image(props: ImageProps): ImageElement;
|
|
110
8
|
//#endregion
|
|
111
|
-
//#region src/
|
|
112
|
-
|
|
113
|
-
interface ElementBase {
|
|
114
|
-
type: ElementType;
|
|
115
|
-
}
|
|
116
|
-
interface BoxProps extends ContainerLayoutProps {
|
|
117
|
-
background?: Color;
|
|
118
|
-
border?: Border;
|
|
119
|
-
shadow?: Shadow;
|
|
120
|
-
opacity?: number;
|
|
121
|
-
clip?: boolean;
|
|
122
|
-
children?: Element[];
|
|
123
|
-
}
|
|
124
|
-
interface BoxElement extends ElementBase, BoxProps {
|
|
125
|
-
type: "box";
|
|
126
|
-
}
|
|
127
|
-
interface TextProps extends LayoutProps {
|
|
128
|
-
content: string;
|
|
129
|
-
font?: FontProps;
|
|
130
|
-
color?: Color;
|
|
131
|
-
align?: "left" | "center" | "right";
|
|
132
|
-
verticalAlign?: "top" | "middle" | "bottom";
|
|
133
|
-
lineHeight?: number;
|
|
134
|
-
maxLines?: number;
|
|
135
|
-
ellipsis?: boolean;
|
|
136
|
-
wrap?: boolean;
|
|
137
|
-
shadow?: Shadow;
|
|
138
|
-
stroke?: StrokeProps;
|
|
139
|
-
}
|
|
140
|
-
interface TextElement extends ElementBase, TextProps {
|
|
141
|
-
type: "text";
|
|
142
|
-
}
|
|
143
|
-
interface ImageProps extends LayoutProps {
|
|
144
|
-
src: string | ImageBitmap | CanvasImageSource;
|
|
145
|
-
fit?: "contain" | "cover" | "fill" | "none" | "scale-down";
|
|
146
|
-
position?: {
|
|
147
|
-
x?: "left" | "center" | "right" | number;
|
|
148
|
-
y?: "top" | "center" | "bottom" | number;
|
|
149
|
-
};
|
|
150
|
-
border?: Border;
|
|
151
|
-
shadow?: Shadow;
|
|
152
|
-
opacity?: number;
|
|
153
|
-
}
|
|
154
|
-
interface ImageElement extends ElementBase, ImageProps {
|
|
155
|
-
type: "image";
|
|
156
|
-
}
|
|
157
|
-
type ShapeType = "rect" | "circle" | "ellipse" | "line" | "polygon" | "path";
|
|
158
|
-
interface ShapeProps extends LayoutProps {
|
|
159
|
-
shape: ShapeType;
|
|
160
|
-
fill?: Color;
|
|
161
|
-
stroke?: StrokeProps;
|
|
162
|
-
shadow?: Shadow;
|
|
163
|
-
points?: [number, number][];
|
|
164
|
-
path?: string;
|
|
165
|
-
}
|
|
166
|
-
interface ShapeElement extends ElementBase, ShapeProps {
|
|
167
|
-
type: "shape";
|
|
168
|
-
}
|
|
169
|
-
interface StackProps extends ContainerLayoutProps {
|
|
170
|
-
children: Element[];
|
|
171
|
-
background?: Color;
|
|
172
|
-
border?: Border;
|
|
173
|
-
shadow?: Shadow;
|
|
174
|
-
opacity?: number;
|
|
175
|
-
clip?: boolean;
|
|
176
|
-
}
|
|
177
|
-
interface StackElement extends ElementBase, StackProps {
|
|
178
|
-
type: "stack";
|
|
179
|
-
}
|
|
180
|
-
type Element = BoxElement | TextElement | ImageElement | ShapeElement | StackElement;
|
|
9
|
+
//#region src/components/Stack.d.ts
|
|
10
|
+
declare function Stack(props: StackProps): StackElement;
|
|
181
11
|
//#endregion
|
|
182
|
-
//#region src/
|
|
12
|
+
//#region src/components/Svg.d.ts
|
|
13
|
+
declare function Svg(props: SvgProps): SvgElement;
|
|
14
|
+
declare const svg: {
|
|
15
|
+
rect: (props: Omit<SvgRectChild, "type">) => SvgRectChild;
|
|
16
|
+
circle: (props: Omit<SvgCircleChild, "type">) => SvgCircleChild;
|
|
17
|
+
ellipse: (props: Omit<SvgEllipseChild, "type">) => SvgEllipseChild;
|
|
18
|
+
line: (props: Omit<SvgLineChild, "type">) => SvgLineChild;
|
|
19
|
+
polyline: (props: Omit<SvgPolylineChild, "type">) => SvgPolylineChild;
|
|
20
|
+
polygon: (props: Omit<SvgPolygonChild, "type">) => SvgPolygonChild;
|
|
21
|
+
path: (props: Omit<SvgPathChild, "type">) => SvgPathChild;
|
|
22
|
+
text: (props: Omit<SvgTextChild, "type">) => SvgTextChild;
|
|
23
|
+
g: (props: Omit<SvgGroupChild, "type">) => SvgGroupChild;
|
|
24
|
+
};
|
|
25
|
+
//#endregion
|
|
26
|
+
//#region src/components/Text.d.ts
|
|
27
|
+
declare function Text(props: TextProps): TextElement;
|
|
28
|
+
//#endregion
|
|
29
|
+
//#region src/layout/utils/measure.d.ts
|
|
183
30
|
interface MeasureContext {
|
|
184
31
|
measureText(text: string, font: FontProps): {
|
|
185
32
|
width: number;
|
|
186
33
|
height: number;
|
|
34
|
+
offset: number;
|
|
187
35
|
};
|
|
188
36
|
}
|
|
189
37
|
declare function createCanvasMeasureContext(ctx: CanvasRenderingContext2D): MeasureContext;
|
|
190
38
|
//#endregion
|
|
191
39
|
//#region src/layout/engine.d.ts
|
|
192
|
-
interface LayoutNode {
|
|
193
|
-
element: Element;
|
|
194
|
-
layout: ComputedLayout;
|
|
195
|
-
children: LayoutNode[];
|
|
196
|
-
lines?: string[];
|
|
197
|
-
}
|
|
198
40
|
declare function computeLayout(element: Element, ctx: MeasureContext, constraints: LayoutConstraints, x?: number, y?: number): LayoutNode;
|
|
199
41
|
//#endregion
|
|
200
|
-
|
|
201
|
-
interface CanvasOptions {
|
|
202
|
-
width: number;
|
|
203
|
-
height: number;
|
|
204
|
-
pixelRatio?: number;
|
|
205
|
-
canvas?: {
|
|
206
|
-
getContext(type: "2d"): CanvasRenderingContext2D | null;
|
|
207
|
-
width: number;
|
|
208
|
-
height: number;
|
|
209
|
-
};
|
|
210
|
-
}
|
|
211
|
-
interface LayoutSize {
|
|
212
|
-
width: number;
|
|
213
|
-
height: number;
|
|
214
|
-
}
|
|
215
|
-
interface DrawCallCanvas {
|
|
216
|
-
readonly width: number;
|
|
217
|
-
readonly height: number;
|
|
218
|
-
readonly pixelRatio: number;
|
|
219
|
-
render(element: Element): LayoutNode;
|
|
220
|
-
clear(): void;
|
|
221
|
-
getContext(): CanvasRenderingContext2D;
|
|
222
|
-
toDataURL(type?: string, quality?: number): string;
|
|
223
|
-
toBuffer(type?: "image/png" | "image/jpeg"): Promise<Buffer>;
|
|
224
|
-
}
|
|
225
|
-
declare function createCanvas(options: CanvasOptions): DrawCallCanvas;
|
|
226
|
-
declare function createCanvasAsync(options: Omit<CanvasOptions, "canvas">): Promise<DrawCallCanvas>;
|
|
227
|
-
//#endregion
|
|
228
|
-
//#region src/components/Box.d.ts
|
|
229
|
-
declare function Box(props: BoxProps): BoxElement;
|
|
230
|
-
//#endregion
|
|
231
|
-
//#region src/components/Stack.d.ts
|
|
232
|
-
declare function Stack(props: StackProps): StackElement;
|
|
233
|
-
//#endregion
|
|
234
|
-
//#region src/components/Text.d.ts
|
|
235
|
-
declare function Text(props: TextProps): TextElement;
|
|
236
|
-
//#endregion
|
|
237
|
-
export { type AlignItems, type AlignSelf, type Border, type Bounds, Box, type BoxElement, type BoxProps, type CanvasOptions, type Color, type ColorStop, type ContainerLayoutProps, type DrawCallCanvas, type Element, type FlexDirection, type FontProps, type GradientDescriptor, type JustifyContent, type LayoutNode, type LayoutProps, type LayoutSize, type LinearGradientDescriptor, type MeasureContext, type RadialGradientDescriptor, type Shadow, type Size, type Spacing, Stack, type StackElement, type StackProps, type StrokeProps, Text, type TextElement, type TextProps, computeLayout, createCanvas, createCanvasAsync, createCanvasMeasureContext, linearGradient, radialGradient };
|
|
42
|
+
export { type AlignItems, type AlignSelf, type Border, type Bounds, Box, type BoxElement, type BoxProps, type CanvasOptions, type Color, type ColorStop, type ContainerLayoutProps, type DrawCallCanvas, type Element, type FlexDirection, type FontProps, type GradientDescriptor, Image, type JustifyContent, type LayoutNode, type LayoutProps, type LayoutSize, type LinearGradientDescriptor, type MeasureContext, type RadialGradientDescriptor, type Shadow, type Size, type Spacing, Stack, type StackAlign, type StackElement, type StackProps, type StrokeProps, Svg, type SvgAlign, type SvgChild, type SvgCircleChild, type SvgElement, type SvgEllipseChild, type SvgGroupChild, type SvgLineChild, type SvgPathChild, type SvgPolygonChild, type SvgPolylineChild, type SvgProps, type SvgRectChild, type SvgStyleProps, type SvgTextChild, type SvgTransformProps, Text, type TextElement, type TextProps, computeLayout, createCanvas, createCanvasMeasureContext, linearGradient, radialGradient, svg };
|
package/index.d.mts
CHANGED
|
@@ -1,237 +1,42 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
color: string;
|
|
6
|
-
}
|
|
7
|
-
interface LinearGradientDescriptor {
|
|
8
|
-
type: "linear-gradient";
|
|
9
|
-
angle: number;
|
|
10
|
-
stops: ColorStop[];
|
|
11
|
-
}
|
|
12
|
-
interface RadialGradientDescriptor {
|
|
13
|
-
type: "radial-gradient";
|
|
14
|
-
startX?: number;
|
|
15
|
-
startY?: number;
|
|
16
|
-
startRadius?: number;
|
|
17
|
-
endX?: number;
|
|
18
|
-
endY?: number;
|
|
19
|
-
endRadius?: number;
|
|
20
|
-
stops: ColorStop[];
|
|
21
|
-
}
|
|
22
|
-
type GradientDescriptor = LinearGradientDescriptor | RadialGradientDescriptor;
|
|
23
|
-
type Color = string | CanvasGradient | CanvasPattern | GradientDescriptor;
|
|
24
|
-
declare function linearGradient(angle: number, ...stops: (string | [number, string])[]): LinearGradientDescriptor;
|
|
25
|
-
declare function radialGradient(options: {
|
|
26
|
-
startX?: number;
|
|
27
|
-
startY?: number;
|
|
28
|
-
startRadius?: number;
|
|
29
|
-
endX?: number;
|
|
30
|
-
endY?: number;
|
|
31
|
-
endRadius?: number;
|
|
32
|
-
}, ...stops: (string | [number, string])[]): RadialGradientDescriptor;
|
|
33
|
-
interface Spacing {
|
|
34
|
-
top?: number;
|
|
35
|
-
right?: number;
|
|
36
|
-
bottom?: number;
|
|
37
|
-
left?: number;
|
|
38
|
-
}
|
|
39
|
-
interface Border {
|
|
40
|
-
width?: number;
|
|
41
|
-
color?: Color;
|
|
42
|
-
radius?: number | [number, number, number, number];
|
|
43
|
-
}
|
|
44
|
-
interface Shadow {
|
|
45
|
-
offsetX?: number;
|
|
46
|
-
offsetY?: number;
|
|
47
|
-
blur?: number;
|
|
48
|
-
color?: Color;
|
|
49
|
-
}
|
|
50
|
-
interface FontProps {
|
|
51
|
-
family?: string;
|
|
52
|
-
size?: number;
|
|
53
|
-
weight?: number | "normal" | "bold";
|
|
54
|
-
style?: "normal" | "italic";
|
|
55
|
-
}
|
|
56
|
-
interface StrokeProps {
|
|
57
|
-
color: Color;
|
|
58
|
-
width: number;
|
|
59
|
-
dash?: number[];
|
|
60
|
-
cap?: "butt" | "round" | "square";
|
|
61
|
-
join?: "miter" | "round" | "bevel";
|
|
62
|
-
}
|
|
63
|
-
interface Bounds {
|
|
64
|
-
x: number;
|
|
65
|
-
y: number;
|
|
66
|
-
width: number;
|
|
67
|
-
height: number;
|
|
68
|
-
}
|
|
1
|
+
import { A as AlignItems, B as Color, C as SvgProps, D as SvgTransformProps, E as SvgTextChild, F as LayoutConstraints, G as RadialGradientDescriptor, H as FontProps, I as LayoutNode, J as Spacing, K as Shadow, L as LayoutProps, M as ContainerLayoutProps, N as FlexDirection, O as TextElement, P as JustifyContent, R as Border, S as SvgPolylineChild, T as SvgStyleProps, U as GradientDescriptor, V as ColorStop, W as LinearGradientDescriptor, X as linearGradient, Y as StrokeProps, Z as radialGradient, _ as SvgEllipseChild, a as BoxElement, b as SvgPathChild, c as ImageElement, d as StackElement, f as StackProps, g as SvgElement, h as SvgCircleChild, i as createCanvas, j as AlignSelf, k as TextProps, l as ImageProps, m as SvgChild, n as DrawCallCanvas, o as BoxProps, p as SvgAlign, q as Size, r as LayoutSize, s as Element, t as CanvasOptions, u as StackAlign, v as SvgGroupChild, w as SvgRectChild, x as SvgPolygonChild, y as SvgLineChild, z as Bounds } from "./canvas.mjs";
|
|
2
|
+
|
|
3
|
+
//#region src/components/Box.d.ts
|
|
4
|
+
declare function Box(props: BoxProps): BoxElement;
|
|
69
5
|
//#endregion
|
|
70
|
-
//#region src/
|
|
71
|
-
|
|
72
|
-
type JustifyContent = "start" | "end" | "center" | "space-between" | "space-around" | "space-evenly";
|
|
73
|
-
type AlignItems = "start" | "end" | "center" | "stretch" | "baseline";
|
|
74
|
-
type AlignSelf = "auto" | AlignItems;
|
|
75
|
-
interface LayoutProps {
|
|
76
|
-
width?: Size;
|
|
77
|
-
height?: Size;
|
|
78
|
-
minWidth?: number;
|
|
79
|
-
maxWidth?: number;
|
|
80
|
-
minHeight?: number;
|
|
81
|
-
maxHeight?: number;
|
|
82
|
-
margin?: number | Spacing;
|
|
83
|
-
padding?: number | Spacing;
|
|
84
|
-
flex?: number;
|
|
85
|
-
alignSelf?: AlignSelf;
|
|
86
|
-
}
|
|
87
|
-
interface ContainerLayoutProps extends LayoutProps {
|
|
88
|
-
direction?: FlexDirection;
|
|
89
|
-
justify?: JustifyContent;
|
|
90
|
-
align?: AlignItems;
|
|
91
|
-
gap?: number;
|
|
92
|
-
wrap?: boolean;
|
|
93
|
-
}
|
|
94
|
-
interface ComputedLayout {
|
|
95
|
-
x: number;
|
|
96
|
-
y: number;
|
|
97
|
-
width: number;
|
|
98
|
-
height: number;
|
|
99
|
-
contentX: number;
|
|
100
|
-
contentY: number;
|
|
101
|
-
contentWidth: number;
|
|
102
|
-
contentHeight: number;
|
|
103
|
-
}
|
|
104
|
-
interface LayoutConstraints {
|
|
105
|
-
minWidth: number;
|
|
106
|
-
maxWidth: number;
|
|
107
|
-
minHeight: number;
|
|
108
|
-
maxHeight: number;
|
|
109
|
-
}
|
|
6
|
+
//#region src/components/Image.d.ts
|
|
7
|
+
declare function Image(props: ImageProps): ImageElement;
|
|
110
8
|
//#endregion
|
|
111
|
-
//#region src/
|
|
112
|
-
|
|
113
|
-
interface ElementBase {
|
|
114
|
-
type: ElementType;
|
|
115
|
-
}
|
|
116
|
-
interface BoxProps extends ContainerLayoutProps {
|
|
117
|
-
background?: Color;
|
|
118
|
-
border?: Border;
|
|
119
|
-
shadow?: Shadow;
|
|
120
|
-
opacity?: number;
|
|
121
|
-
clip?: boolean;
|
|
122
|
-
children?: Element[];
|
|
123
|
-
}
|
|
124
|
-
interface BoxElement extends ElementBase, BoxProps {
|
|
125
|
-
type: "box";
|
|
126
|
-
}
|
|
127
|
-
interface TextProps extends LayoutProps {
|
|
128
|
-
content: string;
|
|
129
|
-
font?: FontProps;
|
|
130
|
-
color?: Color;
|
|
131
|
-
align?: "left" | "center" | "right";
|
|
132
|
-
verticalAlign?: "top" | "middle" | "bottom";
|
|
133
|
-
lineHeight?: number;
|
|
134
|
-
maxLines?: number;
|
|
135
|
-
ellipsis?: boolean;
|
|
136
|
-
wrap?: boolean;
|
|
137
|
-
shadow?: Shadow;
|
|
138
|
-
stroke?: StrokeProps;
|
|
139
|
-
}
|
|
140
|
-
interface TextElement extends ElementBase, TextProps {
|
|
141
|
-
type: "text";
|
|
142
|
-
}
|
|
143
|
-
interface ImageProps extends LayoutProps {
|
|
144
|
-
src: string | ImageBitmap | CanvasImageSource;
|
|
145
|
-
fit?: "contain" | "cover" | "fill" | "none" | "scale-down";
|
|
146
|
-
position?: {
|
|
147
|
-
x?: "left" | "center" | "right" | number;
|
|
148
|
-
y?: "top" | "center" | "bottom" | number;
|
|
149
|
-
};
|
|
150
|
-
border?: Border;
|
|
151
|
-
shadow?: Shadow;
|
|
152
|
-
opacity?: number;
|
|
153
|
-
}
|
|
154
|
-
interface ImageElement extends ElementBase, ImageProps {
|
|
155
|
-
type: "image";
|
|
156
|
-
}
|
|
157
|
-
type ShapeType = "rect" | "circle" | "ellipse" | "line" | "polygon" | "path";
|
|
158
|
-
interface ShapeProps extends LayoutProps {
|
|
159
|
-
shape: ShapeType;
|
|
160
|
-
fill?: Color;
|
|
161
|
-
stroke?: StrokeProps;
|
|
162
|
-
shadow?: Shadow;
|
|
163
|
-
points?: [number, number][];
|
|
164
|
-
path?: string;
|
|
165
|
-
}
|
|
166
|
-
interface ShapeElement extends ElementBase, ShapeProps {
|
|
167
|
-
type: "shape";
|
|
168
|
-
}
|
|
169
|
-
interface StackProps extends ContainerLayoutProps {
|
|
170
|
-
children: Element[];
|
|
171
|
-
background?: Color;
|
|
172
|
-
border?: Border;
|
|
173
|
-
shadow?: Shadow;
|
|
174
|
-
opacity?: number;
|
|
175
|
-
clip?: boolean;
|
|
176
|
-
}
|
|
177
|
-
interface StackElement extends ElementBase, StackProps {
|
|
178
|
-
type: "stack";
|
|
179
|
-
}
|
|
180
|
-
type Element = BoxElement | TextElement | ImageElement | ShapeElement | StackElement;
|
|
9
|
+
//#region src/components/Stack.d.ts
|
|
10
|
+
declare function Stack(props: StackProps): StackElement;
|
|
181
11
|
//#endregion
|
|
182
|
-
//#region src/
|
|
12
|
+
//#region src/components/Svg.d.ts
|
|
13
|
+
declare function Svg(props: SvgProps): SvgElement;
|
|
14
|
+
declare const svg: {
|
|
15
|
+
rect: (props: Omit<SvgRectChild, "type">) => SvgRectChild;
|
|
16
|
+
circle: (props: Omit<SvgCircleChild, "type">) => SvgCircleChild;
|
|
17
|
+
ellipse: (props: Omit<SvgEllipseChild, "type">) => SvgEllipseChild;
|
|
18
|
+
line: (props: Omit<SvgLineChild, "type">) => SvgLineChild;
|
|
19
|
+
polyline: (props: Omit<SvgPolylineChild, "type">) => SvgPolylineChild;
|
|
20
|
+
polygon: (props: Omit<SvgPolygonChild, "type">) => SvgPolygonChild;
|
|
21
|
+
path: (props: Omit<SvgPathChild, "type">) => SvgPathChild;
|
|
22
|
+
text: (props: Omit<SvgTextChild, "type">) => SvgTextChild;
|
|
23
|
+
g: (props: Omit<SvgGroupChild, "type">) => SvgGroupChild;
|
|
24
|
+
};
|
|
25
|
+
//#endregion
|
|
26
|
+
//#region src/components/Text.d.ts
|
|
27
|
+
declare function Text(props: TextProps): TextElement;
|
|
28
|
+
//#endregion
|
|
29
|
+
//#region src/layout/utils/measure.d.ts
|
|
183
30
|
interface MeasureContext {
|
|
184
31
|
measureText(text: string, font: FontProps): {
|
|
185
32
|
width: number;
|
|
186
33
|
height: number;
|
|
34
|
+
offset: number;
|
|
187
35
|
};
|
|
188
36
|
}
|
|
189
37
|
declare function createCanvasMeasureContext(ctx: CanvasRenderingContext2D): MeasureContext;
|
|
190
38
|
//#endregion
|
|
191
39
|
//#region src/layout/engine.d.ts
|
|
192
|
-
interface LayoutNode {
|
|
193
|
-
element: Element;
|
|
194
|
-
layout: ComputedLayout;
|
|
195
|
-
children: LayoutNode[];
|
|
196
|
-
lines?: string[];
|
|
197
|
-
}
|
|
198
40
|
declare function computeLayout(element: Element, ctx: MeasureContext, constraints: LayoutConstraints, x?: number, y?: number): LayoutNode;
|
|
199
41
|
//#endregion
|
|
200
|
-
|
|
201
|
-
interface CanvasOptions {
|
|
202
|
-
width: number;
|
|
203
|
-
height: number;
|
|
204
|
-
pixelRatio?: number;
|
|
205
|
-
canvas?: {
|
|
206
|
-
getContext(type: "2d"): CanvasRenderingContext2D | null;
|
|
207
|
-
width: number;
|
|
208
|
-
height: number;
|
|
209
|
-
};
|
|
210
|
-
}
|
|
211
|
-
interface LayoutSize {
|
|
212
|
-
width: number;
|
|
213
|
-
height: number;
|
|
214
|
-
}
|
|
215
|
-
interface DrawCallCanvas {
|
|
216
|
-
readonly width: number;
|
|
217
|
-
readonly height: number;
|
|
218
|
-
readonly pixelRatio: number;
|
|
219
|
-
render(element: Element): LayoutNode;
|
|
220
|
-
clear(): void;
|
|
221
|
-
getContext(): CanvasRenderingContext2D;
|
|
222
|
-
toDataURL(type?: string, quality?: number): string;
|
|
223
|
-
toBuffer(type?: "image/png" | "image/jpeg"): Promise<Buffer>;
|
|
224
|
-
}
|
|
225
|
-
declare function createCanvas(options: CanvasOptions): DrawCallCanvas;
|
|
226
|
-
declare function createCanvasAsync(options: Omit<CanvasOptions, "canvas">): Promise<DrawCallCanvas>;
|
|
227
|
-
//#endregion
|
|
228
|
-
//#region src/components/Box.d.ts
|
|
229
|
-
declare function Box(props: BoxProps): BoxElement;
|
|
230
|
-
//#endregion
|
|
231
|
-
//#region src/components/Stack.d.ts
|
|
232
|
-
declare function Stack(props: StackProps): StackElement;
|
|
233
|
-
//#endregion
|
|
234
|
-
//#region src/components/Text.d.ts
|
|
235
|
-
declare function Text(props: TextProps): TextElement;
|
|
236
|
-
//#endregion
|
|
237
|
-
export { type AlignItems, type AlignSelf, type Border, type Bounds, Box, type BoxElement, type BoxProps, type CanvasOptions, type Color, type ColorStop, type ContainerLayoutProps, type DrawCallCanvas, type Element, type FlexDirection, type FontProps, type GradientDescriptor, type JustifyContent, type LayoutNode, type LayoutProps, type LayoutSize, type LinearGradientDescriptor, type MeasureContext, type RadialGradientDescriptor, type Shadow, type Size, type Spacing, Stack, type StackElement, type StackProps, type StrokeProps, Text, type TextElement, type TextProps, computeLayout, createCanvas, createCanvasAsync, createCanvasMeasureContext, linearGradient, radialGradient };
|
|
42
|
+
export { type AlignItems, type AlignSelf, type Border, type Bounds, Box, type BoxElement, type BoxProps, type CanvasOptions, type Color, type ColorStop, type ContainerLayoutProps, type DrawCallCanvas, type Element, type FlexDirection, type FontProps, type GradientDescriptor, Image, type JustifyContent, type LayoutNode, type LayoutProps, type LayoutSize, type LinearGradientDescriptor, type MeasureContext, type RadialGradientDescriptor, type Shadow, type Size, type Spacing, Stack, type StackAlign, type StackElement, type StackProps, type StrokeProps, Svg, type SvgAlign, type SvgChild, type SvgCircleChild, type SvgElement, type SvgEllipseChild, type SvgGroupChild, type SvgLineChild, type SvgPathChild, type SvgPolygonChild, type SvgPolylineChild, type SvgProps, type SvgRectChild, type SvgStyleProps, type SvgTextChild, type SvgTransformProps, Text, type TextElement, type TextProps, computeLayout, createCanvas, createCanvasMeasureContext, linearGradient, radialGradient, svg };
|