canvasengine 2.0.0-beta.3 → 2.0.0-beta.31
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/dist/DebugRenderer-DrlzuIVv.js +172 -0
- package/dist/DebugRenderer-DrlzuIVv.js.map +1 -0
- package/dist/components/Button.d.ts +136 -0
- package/dist/components/Button.d.ts.map +1 -0
- package/dist/components/Canvas.d.ts +18 -0
- package/dist/components/Canvas.d.ts.map +1 -0
- package/dist/components/Container.d.ts +80 -0
- package/dist/components/Container.d.ts.map +1 -0
- package/dist/components/DOMContainer.d.ts +77 -0
- package/dist/components/DOMContainer.d.ts.map +1 -0
- package/dist/components/DOMElement.d.ts +44 -0
- package/dist/components/DOMElement.d.ts.map +1 -0
- package/dist/components/DisplayObject.d.ts +82 -0
- package/dist/components/DisplayObject.d.ts.map +1 -0
- package/dist/components/Graphic.d.ts +65 -0
- package/dist/components/Graphic.d.ts.map +1 -0
- package/dist/components/Mesh.d.ts +202 -0
- package/dist/components/Mesh.d.ts.map +1 -0
- package/dist/components/NineSliceSprite.d.ts +17 -0
- package/dist/components/NineSliceSprite.d.ts.map +1 -0
- package/dist/components/ParticleEmitter.d.ts +5 -0
- package/dist/components/ParticleEmitter.d.ts.map +1 -0
- package/dist/components/Scene.d.ts +2 -0
- package/dist/components/Scene.d.ts.map +1 -0
- package/dist/components/Sprite.d.ts +174 -0
- package/dist/components/Sprite.d.ts.map +1 -0
- package/dist/components/Text.d.ts +21 -0
- package/dist/components/Text.d.ts.map +1 -0
- package/dist/components/TilingSprite.d.ts +18 -0
- package/dist/components/TilingSprite.d.ts.map +1 -0
- package/dist/components/Video.d.ts +15 -0
- package/dist/components/Video.d.ts.map +1 -0
- package/dist/components/Viewport.d.ts +106 -0
- package/dist/components/Viewport.d.ts.map +1 -0
- package/dist/components/index.d.ts +17 -0
- package/dist/components/index.d.ts.map +1 -0
- package/dist/components/types/DisplayObject.d.ts +106 -0
- package/dist/components/types/DisplayObject.d.ts.map +1 -0
- package/dist/components/types/MouseEvent.d.ts +4 -0
- package/dist/components/types/MouseEvent.d.ts.map +1 -0
- package/dist/components/types/Spritesheet.d.ts +366 -0
- package/dist/components/types/Spritesheet.d.ts.map +1 -0
- package/dist/components/types/index.d.ts +5 -0
- package/dist/components/types/index.d.ts.map +1 -0
- package/dist/directives/Drag.d.ts +70 -0
- package/dist/directives/Drag.d.ts.map +1 -0
- package/dist/directives/KeyboardControls.d.ts +530 -0
- package/dist/directives/KeyboardControls.d.ts.map +1 -0
- package/dist/directives/Scheduler.d.ts +36 -0
- package/dist/directives/Scheduler.d.ts.map +1 -0
- package/dist/directives/Sound.d.ts +26 -0
- package/dist/directives/Sound.d.ts.map +1 -0
- package/dist/directives/Transition.d.ts +11 -0
- package/dist/directives/Transition.d.ts.map +1 -0
- package/dist/directives/ViewportCull.d.ts +12 -0
- package/dist/directives/ViewportCull.d.ts.map +1 -0
- package/dist/directives/ViewportFollow.d.ts +19 -0
- package/dist/directives/ViewportFollow.d.ts.map +1 -0
- package/dist/directives/index.d.ts +2 -0
- package/dist/directives/index.d.ts.map +1 -0
- package/dist/engine/animation.d.ts +59 -0
- package/dist/engine/animation.d.ts.map +1 -0
- package/dist/engine/bootstrap.d.ts +16 -0
- package/dist/engine/bootstrap.d.ts.map +1 -0
- package/dist/engine/directive.d.ts +14 -0
- package/dist/engine/directive.d.ts.map +1 -0
- package/dist/engine/reactive.d.ts +95 -0
- package/dist/engine/reactive.d.ts.map +1 -0
- package/dist/engine/signal.d.ts +72 -0
- package/dist/engine/signal.d.ts.map +1 -0
- package/dist/engine/trigger.d.ts +51 -0
- package/dist/engine/trigger.d.ts.map +1 -0
- package/dist/engine/utils.d.ts +90 -0
- package/dist/engine/utils.d.ts.map +1 -0
- package/dist/hooks/addContext.d.ts +2 -0
- package/dist/hooks/addContext.d.ts.map +1 -0
- package/dist/hooks/useProps.d.ts +42 -0
- package/dist/hooks/useProps.d.ts.map +1 -0
- package/dist/hooks/useRef.d.ts +5 -0
- package/dist/hooks/useRef.d.ts.map +1 -0
- package/dist/index-DNDNQN-q.js +11088 -0
- package/dist/index-DNDNQN-q.js.map +1 -0
- package/dist/index.d.ts +15 -919
- package/dist/index.d.ts.map +1 -0
- package/dist/index.global.js +29 -0
- package/dist/index.global.js.map +1 -0
- package/dist/index.js +63 -2950
- package/dist/index.js.map +1 -1
- package/dist/utils/Ease.d.ts +17 -0
- package/dist/utils/Ease.d.ts.map +1 -0
- package/dist/utils/RadialGradient.d.ts +58 -0
- package/dist/utils/RadialGradient.d.ts.map +1 -0
- package/dist/utils/functions.d.ts +2 -0
- package/dist/utils/functions.d.ts.map +1 -0
- package/index.d.ts +4 -0
- package/package.json +12 -7
- package/src/components/Button.ts +269 -0
- package/src/components/Canvas.ts +53 -45
- package/src/components/Container.ts +2 -2
- package/src/components/DOMContainer.ts +123 -0
- package/src/components/DOMElement.ts +421 -0
- package/src/components/DisplayObject.ts +283 -190
- package/src/components/Graphic.ts +200 -34
- package/src/components/Mesh.ts +222 -0
- package/src/components/NineSliceSprite.ts +4 -1
- package/src/components/ParticleEmitter.ts +12 -8
- package/src/components/Sprite.ts +92 -22
- package/src/components/Text.ts +34 -14
- package/src/components/Video.ts +110 -0
- package/src/components/Viewport.ts +59 -43
- package/src/components/index.ts +7 -2
- package/src/components/types/DisplayObject.ts +30 -0
- package/src/directives/Drag.ts +357 -52
- package/src/directives/KeyboardControls.ts +3 -1
- package/src/directives/Sound.ts +94 -31
- package/src/directives/ViewportFollow.ts +35 -7
- package/src/engine/animation.ts +41 -5
- package/src/engine/bootstrap.ts +23 -3
- package/src/engine/directive.ts +2 -2
- package/src/engine/reactive.ts +542 -170
- package/src/engine/signal.ts +22 -2
- package/src/engine/trigger.ts +65 -9
- package/src/engine/utils.ts +97 -9
- package/src/hooks/useProps.ts +1 -1
- package/src/index.ts +4 -1
- package/src/utils/RadialGradient.ts +29 -0
- package/src/utils/functions.ts +7 -0
- package/testing/index.ts +12 -0
- package/tsconfig.json +17 -0
- package/vite.config.ts +39 -0
|
@@ -0,0 +1,82 @@
|
|
|
1
|
+
import { Element, Props } from '../engine/reactive';
|
|
2
|
+
import { AlignContent, EdgeSize, FlexDirection, ObjectFit, ObjectPosition, TransformOrigin } from './types/DisplayObject';
|
|
3
|
+
import { ObservablePoint } from 'pixi.js';
|
|
4
|
+
import { BehaviorSubject } from 'rxjs';
|
|
5
|
+
|
|
6
|
+
export interface ComponentInstance extends PixiMixins.ContainerOptions {
|
|
7
|
+
id?: string;
|
|
8
|
+
children?: ComponentInstance[];
|
|
9
|
+
onInit?(props: Props): void;
|
|
10
|
+
onUpdate?(props: Props): void;
|
|
11
|
+
onDestroy?(parent: Element, afterDestroy: () => void): void;
|
|
12
|
+
onMount?(context: Element, index?: number): void;
|
|
13
|
+
setWidth(width: number): void;
|
|
14
|
+
setHeight(height: number): void;
|
|
15
|
+
}
|
|
16
|
+
export declare const EVENTS: string[];
|
|
17
|
+
export type OnHook = (() => void) | (() => Promise<void> | void);
|
|
18
|
+
export declare function DisplayObject(extendClass: any): {
|
|
19
|
+
new (): {
|
|
20
|
+
[x: string]: any;
|
|
21
|
+
"__#1@#canvasContext": {
|
|
22
|
+
[key: string]: any;
|
|
23
|
+
} | null;
|
|
24
|
+
isFlex: boolean;
|
|
25
|
+
fullProps: Props;
|
|
26
|
+
isMounted: boolean;
|
|
27
|
+
_anchorPoints: ObservablePoint;
|
|
28
|
+
isCustomAnchor: boolean;
|
|
29
|
+
displayWidth: import('@signe/reactive').WritableSignal<number>;
|
|
30
|
+
displayHeight: import('@signe/reactive').WritableSignal<number>;
|
|
31
|
+
overrideProps: string[];
|
|
32
|
+
layout: any;
|
|
33
|
+
onBeforeDestroy: OnHook | null;
|
|
34
|
+
onAfterMount: OnHook | null;
|
|
35
|
+
subjectInit: BehaviorSubject<any>;
|
|
36
|
+
disableLayout: boolean;
|
|
37
|
+
"__#1@#registeredEvents": Map<string, Function>;
|
|
38
|
+
readonly deltaRatio: any;
|
|
39
|
+
readonly parentIsFlex: any;
|
|
40
|
+
onInit(props: Props): void;
|
|
41
|
+
onMount({ parent, props }: Element</*elided*/ any>, index?: number): Promise<void>;
|
|
42
|
+
onUpdate(props: Props): void;
|
|
43
|
+
onDestroy(parent: Element, afterDestroy?: () => void): Promise<void>;
|
|
44
|
+
setFlexDirection(direction: FlexDirection): void;
|
|
45
|
+
setFlexWrap(wrap: "wrap" | "nowrap" | "wrap-reverse"): void;
|
|
46
|
+
setAlignContent(align: AlignContent): void;
|
|
47
|
+
setAlignSelf(align: AlignContent): void;
|
|
48
|
+
setAlignItems(align: AlignContent): void;
|
|
49
|
+
setJustifyContent(justifyContent: "flex-start" | "flex-end" | "center" | "space-between" | "space-around"): void;
|
|
50
|
+
setPosition(position: EdgeSize): void;
|
|
51
|
+
setX(x: number): void;
|
|
52
|
+
setY(y: number): void;
|
|
53
|
+
setPadding(padding: EdgeSize): void;
|
|
54
|
+
setMargin(margin: EdgeSize): void;
|
|
55
|
+
setGap(gap: EdgeSize): void;
|
|
56
|
+
setBorder(border: EdgeSize): void;
|
|
57
|
+
setPositionType(positionType: "relative" | "absolute"): void;
|
|
58
|
+
setWidth(width: number): void;
|
|
59
|
+
setHeight(height: number): void;
|
|
60
|
+
getWidth(): number;
|
|
61
|
+
getHeight(): number;
|
|
62
|
+
setMinWidth(minWidth: number | string): void;
|
|
63
|
+
setMinHeight(minHeight: number | string): void;
|
|
64
|
+
setMaxWidth(maxWidth: number | string): void;
|
|
65
|
+
setMaxHeight(maxHeight: number | string): void;
|
|
66
|
+
setAspectRatio(aspectRatio: number): void;
|
|
67
|
+
setFlexGrow(flexGrow: number): void;
|
|
68
|
+
setFlexShrink(flexShrink: number): void;
|
|
69
|
+
setFlexBasis(flexBasis: number | string): void;
|
|
70
|
+
setRowGap(rowGap: number): void;
|
|
71
|
+
setColumnGap(columnGap: number): void;
|
|
72
|
+
setTop(top: number | string): void;
|
|
73
|
+
setLeft(left: number | string): void;
|
|
74
|
+
setRight(right: number | string): void;
|
|
75
|
+
setBottom(bottom: number | string): void;
|
|
76
|
+
setObjectFit(objectFit: ObjectFit): void;
|
|
77
|
+
setObjectPosition(objectPosition: ObjectPosition): void;
|
|
78
|
+
setTransformOrigin(transformOrigin: TransformOrigin): void;
|
|
79
|
+
};
|
|
80
|
+
[x: string]: any;
|
|
81
|
+
};
|
|
82
|
+
//# sourceMappingURL=DisplayObject.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DisplayObject.d.ts","sourceRoot":"","sources":["../../src/components/DisplayObject.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAa,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAE/D,OAAO,KAAK,EACV,YAAY,EACZ,QAAQ,EACR,aAAa,EACb,SAAS,EACT,cAAc,EACd,eAAe,EAChB,MAAM,uBAAuB,CAAC;AAE/B,OAAO,EAAc,eAAe,EAAE,MAAM,SAAS,CAAC;AAGtD,OAAO,EAAE,eAAe,EAAmB,MAAM,MAAM,CAAC;AAExD,MAAM,WAAW,iBAAkB,SAAQ,UAAU,CAAC,gBAAgB;IACpE,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,QAAQ,CAAC,EAAE,iBAAiB,EAAE,CAAC;IAC/B,MAAM,CAAC,CAAC,KAAK,EAAE,KAAK,GAAG,IAAI,CAAC;IAC5B,QAAQ,CAAC,CAAC,KAAK,EAAE,KAAK,GAAG,IAAI,CAAC;IAC9B,SAAS,CAAC,CAAC,MAAM,EAAE,OAAO,EAAE,YAAY,EAAE,MAAM,IAAI,GAAG,IAAI,CAAC;IAC5D,OAAO,CAAC,CAAC,OAAO,EAAE,OAAO,EAAE,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACjD,QAAQ,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IAC9B,SAAS,CAAC,MAAM,EAAE,MAAM,GAAG,IAAI,CAAC;CACjC;AAED,eAAO,MAAM,MAAM,UAqElB,CAAC;AAEF,MAAM,MAAM,MAAM,GAAG,CAAC,MAAM,IAAI,CAAC,GAAG,CAAC,MAAM,OAAO,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC,CAAC;AAEjE,wBAAgB,aAAa,CAAC,WAAW,KAAA;;;+BAErB;YACd,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;SACpB,GAAG,IAAI;gBACA,OAAO;mBACJ,KAAK;mBACL,OAAO;;wBAEF,OAAO;;;uBAGR,MAAM,EAAE;;yBAEN,MAAM,GAAG,IAAI;sBAChB,MAAM,GAAG,IAAI;;uBAEZ,OAAO;kCAEH,GAAG,CAAC,MAAM,EAAE,QAAQ,CAAC;;;sBAW1B,KAAK;mCAyCc,OAAO,gBAAe,UAAU,MAAM;wBAyBvD,KAAK;0BAqGG,OAAO,iBAAiB,MAAM,IAAI;oCAc9B,aAAa;0BAIvB,MAAM,GAAG,QAAQ,GAAG,cAAc;+BAI7B,YAAY;4BAIf,YAAY;6BAIX,YAAY;0CAM3B,YAAY,GACZ,UAAU,GACV,QAAQ,GACR,eAAe,GACf,cAAc;8BAKE,QAAQ;gBAoBtB,MAAM;gBAUN,MAAM;4BAUM,QAAQ;0BAoBV,QAAQ;oBAoBd,QAAQ;0BAIF,QAAQ;sCAoBI,UAAU,GAAG,UAAU;wBAIrC,MAAM;0BASJ,MAAM;;;8BAkBF,MAAM,GAAG,MAAM;gCAIb,MAAM,GAAG,MAAM;8BAIjB,MAAM,GAAG,MAAM;gCAIb,MAAM,GAAG,MAAM;oCAKX,MAAM;8BAKZ,MAAM;kCAIF,MAAM;gCAIR,MAAM,GAAG,MAAM;0BAKrB,MAAM;gCAIA,MAAM;oBAKlB,MAAM,GAAG,MAAM;sBAIb,MAAM,GAAG,MAAM;wBAIb,MAAM,GAAG,MAAM;0BAIb,MAAM,GAAG,MAAM;gCAKT,SAAS;0CAIC,cAAc;4CAIZ,eAAe;;;EAItD"}
|
|
@@ -0,0 +1,65 @@
|
|
|
1
|
+
import { Graphics as PixiGraphics } from 'pixi.js';
|
|
2
|
+
import { Element } from '../engine/reactive';
|
|
3
|
+
import { ComponentInstance } from './DisplayObject';
|
|
4
|
+
import { DisplayObjectProps } from './types/DisplayObject';
|
|
5
|
+
import { SignalOrPrimitive } from './types';
|
|
6
|
+
|
|
7
|
+
interface GraphicsProps extends DisplayObjectProps {
|
|
8
|
+
draw?: (graphics: PixiGraphics, width: number, height: number) => void;
|
|
9
|
+
}
|
|
10
|
+
interface RectProps extends DisplayObjectProps {
|
|
11
|
+
color: SignalOrPrimitive<string>;
|
|
12
|
+
}
|
|
13
|
+
interface CircleProps extends DisplayObjectProps {
|
|
14
|
+
radius: SignalOrPrimitive<number>;
|
|
15
|
+
color: SignalOrPrimitive<string>;
|
|
16
|
+
}
|
|
17
|
+
interface EllipseProps extends DisplayObjectProps {
|
|
18
|
+
color: SignalOrPrimitive<string>;
|
|
19
|
+
}
|
|
20
|
+
interface TriangleProps extends DisplayObjectProps {
|
|
21
|
+
base: SignalOrPrimitive<number>;
|
|
22
|
+
color: SignalOrPrimitive<string>;
|
|
23
|
+
}
|
|
24
|
+
interface SvgProps extends DisplayObjectProps {
|
|
25
|
+
/** SVG content as string (legacy prop) */
|
|
26
|
+
svg?: string;
|
|
27
|
+
/** URL source of the SVG file to load */
|
|
28
|
+
src?: string;
|
|
29
|
+
/** Direct SVG content as string */
|
|
30
|
+
content?: string;
|
|
31
|
+
}
|
|
32
|
+
export declare function Graphics(props: GraphicsProps): Element<ComponentInstance>;
|
|
33
|
+
export declare function Rect(props: RectProps): Element<ComponentInstance>;
|
|
34
|
+
export declare function Circle(props: CircleProps): Element<ComponentInstance>;
|
|
35
|
+
export declare function Ellipse(props: EllipseProps): Element<ComponentInstance>;
|
|
36
|
+
export declare function Triangle(props: TriangleProps): Element<ComponentInstance>;
|
|
37
|
+
/**
|
|
38
|
+
* Creates an SVG component that can render SVG graphics from URL, content, or legacy svg prop.
|
|
39
|
+
*
|
|
40
|
+
* This component provides three ways to display SVG graphics:
|
|
41
|
+
* - **src**: Load SVG from a URL using Assets.load with parseAsGraphicsContext option
|
|
42
|
+
* - **content**: Render SVG directly from string content using Graphics.svg() method
|
|
43
|
+
* - **svg**: Legacy prop for SVG content (for backward compatibility)
|
|
44
|
+
*
|
|
45
|
+
* @param props - Component properties including src, content, or svg
|
|
46
|
+
* @returns A reactive SVG component
|
|
47
|
+
* @example
|
|
48
|
+
* ```typescript
|
|
49
|
+
* // Load from URL
|
|
50
|
+
* const svgFromUrl = Svg({ src: "/assets/logo.svg" });
|
|
51
|
+
*
|
|
52
|
+
* // Direct content
|
|
53
|
+
* const svgFromContent = Svg({
|
|
54
|
+
* content: `<svg viewBox="0 0 100 100">
|
|
55
|
+
* <circle cx="50" cy="50" r="40" fill="blue"/>
|
|
56
|
+
* </svg>`
|
|
57
|
+
* });
|
|
58
|
+
*
|
|
59
|
+
* // Legacy usage
|
|
60
|
+
* const svgLegacy = Svg({ svg: "<svg>...</svg>" });
|
|
61
|
+
* ```
|
|
62
|
+
*/
|
|
63
|
+
export declare function Svg(props: SvgProps): Element<ComponentInstance>;
|
|
64
|
+
export {};
|
|
65
|
+
//# sourceMappingURL=Graphic.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Graphic.d.ts","sourceRoot":"","sources":["../../src/components/Graphic.ts"],"names":[],"mappings":"AACA,OAAO,EAAU,QAAQ,IAAI,YAAY,EAAE,MAAM,SAAS,CAAC;AAC3D,OAAO,EAAmB,OAAO,EAAqB,MAAM,oBAAoB,CAAC;AACjF,OAAO,EAAE,iBAAiB,EAAiB,MAAM,iBAAiB,CAAC;AACnE,OAAO,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAE3D,OAAO,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAG5C,UAAU,aAAc,SAAQ,kBAAkB;IAChD,IAAI,CAAC,EAAE,CAAC,QAAQ,EAAE,YAAY,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;CACxE;AAED,UAAU,SAAU,SAAQ,kBAAkB;IAC5C,KAAK,EAAE,iBAAiB,CAAC,MAAM,CAAC,CAAC;CAClC;AAED,UAAU,WAAY,SAAQ,kBAAkB;IAC9C,MAAM,EAAE,iBAAiB,CAAC,MAAM,CAAC,CAAC;IAClC,KAAK,EAAE,iBAAiB,CAAC,MAAM,CAAC,CAAC;CAClC;AAED,UAAU,YAAa,SAAQ,kBAAkB;IAC/C,KAAK,EAAE,iBAAiB,CAAC,MAAM,CAAC,CAAC;CAClC;AAED,UAAU,aAAc,SAAQ,kBAAkB;IAChD,IAAI,EAAE,iBAAiB,CAAC,MAAM,CAAC,CAAC;IAChC,KAAK,EAAE,iBAAiB,CAAC,MAAM,CAAC,CAAC;CAClC;AAED,UAAU,QAAS,SAAQ,kBAAkB;IAC3C,0CAA0C;IAC1C,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,yCAAyC;IACzC,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,mCAAmC;IACnC,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAiID,wBAAgB,QAAQ,CAAC,KAAK,EAAE,aAAa,8BAE5C;AAED,wBAAgB,IAAI,CAAC,KAAK,EAAE,SAAS,8BAoBpC;AAwBD,wBAAgB,MAAM,CAAC,KAAK,EAAE,WAAW,8BAQxC;AAED,wBAAgB,OAAO,CAAC,KAAK,EAAE,YAAY,8BAc1C;AAED,wBAAgB,QAAQ,CAAC,KAAK,EAAE,aAAa,8BAkB5C;AAED;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,wBAAgB,GAAG,CAAC,KAAK,EAAE,QAAQ,8BAyBlC"}
|
|
@@ -0,0 +1,202 @@
|
|
|
1
|
+
import { Geometry, Shader, Texture } from 'pixi.js';
|
|
2
|
+
import { Element } from '../engine/reactive';
|
|
3
|
+
import { ComponentInstance } from './DisplayObject';
|
|
4
|
+
import { DisplayObjectProps } from './types/DisplayObject';
|
|
5
|
+
import { SignalOrPrimitive } from './types';
|
|
6
|
+
import { ComponentFunction } from '../engine/signal';
|
|
7
|
+
|
|
8
|
+
/**
|
|
9
|
+
* Interface defining the properties for a Mesh component.
|
|
10
|
+
* Extends DisplayObjectProps to inherit common display object properties.
|
|
11
|
+
*/
|
|
12
|
+
interface MeshProps extends DisplayObjectProps {
|
|
13
|
+
/** The geometry defining the mesh structure (vertices, indices, UVs, etc.) */
|
|
14
|
+
geometry?: Geometry;
|
|
15
|
+
/** The shader to render the mesh with */
|
|
16
|
+
shader?: Shader;
|
|
17
|
+
/** The texture to apply to the mesh */
|
|
18
|
+
texture?: Texture | string;
|
|
19
|
+
/** The image URL to load as texture */
|
|
20
|
+
image?: string;
|
|
21
|
+
/** The tint color to apply to the mesh */
|
|
22
|
+
tint?: SignalOrPrimitive<number>;
|
|
23
|
+
/** Whether to round pixels for sharper rendering */
|
|
24
|
+
roundPixels?: SignalOrPrimitive<boolean>;
|
|
25
|
+
}
|
|
26
|
+
declare const CanvasMesh_base: {
|
|
27
|
+
new (): {
|
|
28
|
+
[x: string]: any;
|
|
29
|
+
"__#1@#canvasContext": {
|
|
30
|
+
[key: string]: any;
|
|
31
|
+
} | null;
|
|
32
|
+
isFlex: boolean;
|
|
33
|
+
fullProps: import('..').Props;
|
|
34
|
+
isMounted: boolean;
|
|
35
|
+
_anchorPoints: import('pixi.js').ObservablePoint;
|
|
36
|
+
isCustomAnchor: boolean;
|
|
37
|
+
displayWidth: import('@signe/reactive').WritableSignal<number>;
|
|
38
|
+
displayHeight: import('@signe/reactive').WritableSignal<number>;
|
|
39
|
+
overrideProps: string[];
|
|
40
|
+
layout: any;
|
|
41
|
+
onBeforeDestroy: import('./DisplayObject').OnHook | null;
|
|
42
|
+
onAfterMount: import('./DisplayObject').OnHook | null;
|
|
43
|
+
subjectInit: import('rxjs').BehaviorSubject<any>;
|
|
44
|
+
disableLayout: boolean;
|
|
45
|
+
"__#1@#registeredEvents": Map<string, Function>;
|
|
46
|
+
readonly deltaRatio: any;
|
|
47
|
+
readonly parentIsFlex: any;
|
|
48
|
+
onInit(props: import('..').Props): void;
|
|
49
|
+
onMount({ parent, props }: Element</*elided*/ any>, index?: number): Promise<void>;
|
|
50
|
+
onUpdate(props: import('..').Props): void;
|
|
51
|
+
onDestroy(parent: Element, afterDestroy?: () => void): Promise<void>;
|
|
52
|
+
setFlexDirection(direction: import('./types/DisplayObject').FlexDirection): void;
|
|
53
|
+
setFlexWrap(wrap: "wrap" | "nowrap" | "wrap-reverse"): void;
|
|
54
|
+
setAlignContent(align: import('./types/DisplayObject').AlignContent): void;
|
|
55
|
+
setAlignSelf(align: import('./types/DisplayObject').AlignContent): void;
|
|
56
|
+
setAlignItems(align: import('./types/DisplayObject').AlignContent): void;
|
|
57
|
+
setJustifyContent(justifyContent: "flex-start" | "flex-end" | "center" | "space-between" | "space-around"): void;
|
|
58
|
+
setPosition(position: import('./types/DisplayObject').EdgeSize): void;
|
|
59
|
+
setX(x: number): void;
|
|
60
|
+
setY(y: number): void;
|
|
61
|
+
setPadding(padding: import('./types/DisplayObject').EdgeSize): void;
|
|
62
|
+
setMargin(margin: import('./types/DisplayObject').EdgeSize): void;
|
|
63
|
+
setGap(gap: import('./types/DisplayObject').EdgeSize): void;
|
|
64
|
+
setBorder(border: import('./types/DisplayObject').EdgeSize): void;
|
|
65
|
+
setPositionType(positionType: "relative" | "absolute"): void;
|
|
66
|
+
setWidth(width: number): void;
|
|
67
|
+
setHeight(height: number): void;
|
|
68
|
+
getWidth(): number;
|
|
69
|
+
getHeight(): number;
|
|
70
|
+
setMinWidth(minWidth: number | string): void;
|
|
71
|
+
setMinHeight(minHeight: number | string): void;
|
|
72
|
+
setMaxWidth(maxWidth: number | string): void;
|
|
73
|
+
setMaxHeight(maxHeight: number | string): void;
|
|
74
|
+
setAspectRatio(aspectRatio: number): void;
|
|
75
|
+
setFlexGrow(flexGrow: number): void;
|
|
76
|
+
setFlexShrink(flexShrink: number): void;
|
|
77
|
+
setFlexBasis(flexBasis: number | string): void;
|
|
78
|
+
setRowGap(rowGap: number): void;
|
|
79
|
+
setColumnGap(columnGap: number): void;
|
|
80
|
+
setTop(top: number | string): void;
|
|
81
|
+
setLeft(left: number | string): void;
|
|
82
|
+
setRight(right: number | string): void;
|
|
83
|
+
setBottom(bottom: number | string): void;
|
|
84
|
+
setObjectFit(objectFit: import('./types/DisplayObject').ObjectFit): void;
|
|
85
|
+
setObjectPosition(objectPosition: import('./types/DisplayObject').ObjectPosition): void;
|
|
86
|
+
setTransformOrigin(transformOrigin: import('./types/DisplayObject').TransformOrigin): void;
|
|
87
|
+
};
|
|
88
|
+
[x: string]: any;
|
|
89
|
+
};
|
|
90
|
+
/**
|
|
91
|
+
* Canvas Mesh component class that extends DisplayObject with PixiMesh functionality.
|
|
92
|
+
* This component allows rendering of custom 3D meshes with shaders and textures.
|
|
93
|
+
*
|
|
94
|
+
* @example
|
|
95
|
+
* ```typescript
|
|
96
|
+
* // Basic mesh with geometry and texture
|
|
97
|
+
* const mesh = Mesh({
|
|
98
|
+
* geometry: myGeometry,
|
|
99
|
+
* texture: "path/to/texture.png",
|
|
100
|
+
* tint: 0xff0000
|
|
101
|
+
* });
|
|
102
|
+
*
|
|
103
|
+
* // Mesh with custom shader
|
|
104
|
+
* const customMesh = Mesh({
|
|
105
|
+
* geometry: myGeometry,
|
|
106
|
+
* shader: myCustomShader,
|
|
107
|
+
* draw: (mesh) => {
|
|
108
|
+
* // Custom mesh manipulation
|
|
109
|
+
* mesh.rotation += 0.01;
|
|
110
|
+
* }
|
|
111
|
+
* });
|
|
112
|
+
* ```
|
|
113
|
+
*/
|
|
114
|
+
declare class CanvasMesh extends CanvasMesh_base {
|
|
115
|
+
/**
|
|
116
|
+
* Constructor for the CanvasMesh component.
|
|
117
|
+
* Initializes the PixiMesh with default geometry and shader to prevent errors.
|
|
118
|
+
*
|
|
119
|
+
* @example
|
|
120
|
+
* ```typescript
|
|
121
|
+
* // This constructor is called internally by the engine
|
|
122
|
+
* const mesh = new CanvasMesh();
|
|
123
|
+
* ```
|
|
124
|
+
*/
|
|
125
|
+
constructor();
|
|
126
|
+
/**
|
|
127
|
+
* Initializes the mesh component with the provided properties.
|
|
128
|
+
* This method is called before onUpdate to set up initial state.
|
|
129
|
+
*
|
|
130
|
+
* @param props - The initial properties
|
|
131
|
+
* @example
|
|
132
|
+
* ```typescript
|
|
133
|
+
* // This method is called internally when the component is created
|
|
134
|
+
* mesh.onInit({
|
|
135
|
+
* geometry: myGeometry,
|
|
136
|
+
* texture: "texture.png"
|
|
137
|
+
* });
|
|
138
|
+
* ```
|
|
139
|
+
*/
|
|
140
|
+
onInit(props: MeshProps): void;
|
|
141
|
+
/**
|
|
142
|
+
* Updates the mesh component when properties change.
|
|
143
|
+
* Handles texture loading, shader updates, and other property changes.
|
|
144
|
+
*
|
|
145
|
+
* @param props - The updated properties
|
|
146
|
+
* @example
|
|
147
|
+
* ```typescript
|
|
148
|
+
* // This method is called internally when props change
|
|
149
|
+
* mesh.onUpdate({
|
|
150
|
+
* tint: 0x00ff00,
|
|
151
|
+
* texture: "new-texture.png"
|
|
152
|
+
* });
|
|
153
|
+
* ```
|
|
154
|
+
*/
|
|
155
|
+
onUpdate(props: MeshProps): Promise<void>;
|
|
156
|
+
/**
|
|
157
|
+
* Called when the component is about to be destroyed.
|
|
158
|
+
* Cleans up the draw effect subscription and calls the parent destroy method.
|
|
159
|
+
*
|
|
160
|
+
* @param parent - The parent element
|
|
161
|
+
* @param afterDestroy - Callback function to execute after destruction
|
|
162
|
+
* @example
|
|
163
|
+
* ```typescript
|
|
164
|
+
* // This method is typically called by the engine internally
|
|
165
|
+
* await mesh.onDestroy(parentElement, () => console.log('Mesh destroyed'));
|
|
166
|
+
* ```
|
|
167
|
+
*/
|
|
168
|
+
onDestroy(parent: Element<ComponentInstance>, afterDestroy: () => void): Promise<void>;
|
|
169
|
+
}
|
|
170
|
+
/**
|
|
171
|
+
* Creates a Mesh component with the specified properties.
|
|
172
|
+
* This is the main function used to create mesh instances in your application.
|
|
173
|
+
*
|
|
174
|
+
* @param props - The properties for the mesh component
|
|
175
|
+
* @returns A mesh component element
|
|
176
|
+
* @example
|
|
177
|
+
* ```typescript
|
|
178
|
+
* import { Mesh } from 'canvasengine';
|
|
179
|
+
*
|
|
180
|
+
* // Create a basic textured mesh
|
|
181
|
+
* const myMesh = Mesh({
|
|
182
|
+
* geometry: triangleGeometry,
|
|
183
|
+
* texture: "assets/texture.png",
|
|
184
|
+
* x: 100,
|
|
185
|
+
* y: 100,
|
|
186
|
+
* tint: 0xff0000
|
|
187
|
+
* });
|
|
188
|
+
*
|
|
189
|
+
* // Create a mesh with custom shader
|
|
190
|
+
* const shaderMesh = Mesh({
|
|
191
|
+
* geometry: planeGeometry,
|
|
192
|
+
* shader: customShader,
|
|
193
|
+
* draw: (mesh) => {
|
|
194
|
+
* mesh.rotation += 0.01;
|
|
195
|
+
* }
|
|
196
|
+
* });
|
|
197
|
+
* ```
|
|
198
|
+
*/
|
|
199
|
+
export declare const Mesh: ComponentFunction<MeshProps>;
|
|
200
|
+
export { CanvasMesh };
|
|
201
|
+
export type { MeshProps };
|
|
202
|
+
//# sourceMappingURL=Mesh.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Mesh.d.ts","sourceRoot":"","sources":["../../src/components/Mesh.ts"],"names":[],"mappings":"AACA,OAAO,EAAoB,QAAQ,EAAE,MAAM,EAAE,OAAO,EAAuB,MAAM,SAAS,CAAC;AAC3F,OAAO,EAAmB,OAAO,EAAqB,MAAM,oBAAoB,CAAC;AACjF,OAAO,EAAE,iBAAiB,EAAiB,MAAM,iBAAiB,CAAC;AACnE,OAAO,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAE3D,OAAO,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAC5C,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAErD;;;GAGG;AACH,UAAU,SAAU,SAAQ,kBAAkB;IAC5C,8EAA8E;IAC9E,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB,yCAAyC;IACzC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,uCAAuC;IACvC,OAAO,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAC3B,uCAAuC;IACvC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,0CAA0C;IAC1C,IAAI,CAAC,EAAE,iBAAiB,CAAC,MAAM,CAAC,CAAC;IACjC,oDAAoD;IACpD,WAAW,CAAC,EAAE,iBAAiB,CAAC,OAAO,CAAC,CAAC;CAC1C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAED;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,cAAM,UAAW,SAAQ,eAAuB;IAC9C;;;;;;;;;OASG;;IASH;;;;;;;;;;;;;OAaG;IACH,MAAM,CAAC,KAAK,EAAE,SAAS;IAkBvB;;;;;;;;;;;;;OAaG;IACG,QAAQ,CAAC,KAAK,EAAE,SAAS;IA4C/B;;;;;;;;;;;OAWG;IACG,SAAS,CAAC,MAAM,EAAE,OAAO,CAAC,iBAAiB,CAAC,EAAE,YAAY,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC;CAM7F;AAKD;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,eAAO,MAAM,IAAI,EAAE,iBAAiB,CAAC,SAAS,CAE7C,CAAC;AAGF,OAAO,EAAE,UAAU,EAAE,CAAC;AAGtB,YAAY,EAAE,SAAS,EAAE,CAAC"}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { Texture } from 'pixi.js';
|
|
2
|
+
import { DisplayObjectProps } from './types/DisplayObject';
|
|
3
|
+
|
|
4
|
+
interface NineSliceSpriteProps extends DisplayObjectProps {
|
|
5
|
+
image?: string;
|
|
6
|
+
texture?: Texture;
|
|
7
|
+
width?: number;
|
|
8
|
+
height?: number;
|
|
9
|
+
leftWidth?: number;
|
|
10
|
+
rightWidth?: number;
|
|
11
|
+
topHeight?: number;
|
|
12
|
+
bottomHeight?: number;
|
|
13
|
+
roundPixels?: boolean;
|
|
14
|
+
}
|
|
15
|
+
export declare function NineSliceSprite(props: NineSliceSpriteProps): import('..').Element<import('./DisplayObject').ComponentInstance>;
|
|
16
|
+
export {};
|
|
17
|
+
//# sourceMappingURL=NineSliceSprite.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"NineSliceSprite.d.ts","sourceRoot":"","sources":["../../src/components/NineSliceSprite.ts"],"names":[],"mappings":"AAAA,OAAO,EAAkD,OAAO,EAAE,MAAM,SAAS,CAAC;AAGlF,OAAO,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAG3D,UAAU,oBAAqB,SAAQ,kBAAkB;IACrD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,OAAO,CAAC;CACzB;AA8BD,wBAAgB,eAAe,CAAC,KAAK,EAAE,oBAAoB,qEAE1D"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ParticleEmitter.d.ts","sourceRoot":"","sources":["../../src/components/ParticleEmitter.ts"],"names":[],"mappings":"AACA,OAAO,EAAmB,OAAO,EAAqB,MAAM,oBAAoB,CAAC;AAGjF,OAAO,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AAoCpD,wBAAgB,gBAAgB,CAAC,KAAK,KAAA,8BAErC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Scene.d.ts","sourceRoot":"","sources":["../../src/components/Scene.ts"],"names":[],"mappings":"AAGA,wBAAgB,KAAK,CAAC,KAAK,KAAA,kJAE1B"}
|
|
@@ -0,0 +1,174 @@
|
|
|
1
|
+
import { Signal } from '@signe/reactive';
|
|
2
|
+
import { Sprite as PixiSprite, Texture } from 'pixi.js';
|
|
3
|
+
import { Element } from '../engine/reactive';
|
|
4
|
+
import { AnimationFrames, FrameOptions, SpritesheetOptions, TextureOptions, TransformOptions } from './types/Spritesheet';
|
|
5
|
+
import { ComponentFunction } from '../engine/signal';
|
|
6
|
+
import { DisplayObjectProps } from './types/DisplayObject';
|
|
7
|
+
import { Layout } from '@pixi/layout';
|
|
8
|
+
|
|
9
|
+
type Image = {
|
|
10
|
+
image: string;
|
|
11
|
+
};
|
|
12
|
+
type TextureOptionsMerging = TextureOptions & {
|
|
13
|
+
spriteWidth: number;
|
|
14
|
+
spriteHeight: number;
|
|
15
|
+
sound?: string;
|
|
16
|
+
} & Image & TransformOptions;
|
|
17
|
+
type FrameOptionsMerging = TextureOptionsMerging & FrameOptions;
|
|
18
|
+
type SpritesheetOptionsMerging = TextureOptionsMerging & SpritesheetOptions;
|
|
19
|
+
type AnimationDataFrames = {
|
|
20
|
+
sprites: FrameOptionsMerging[];
|
|
21
|
+
frames: Texture[][];
|
|
22
|
+
name: string;
|
|
23
|
+
animations: AnimationFrames;
|
|
24
|
+
params: any[];
|
|
25
|
+
data: TextureOptionsMerging;
|
|
26
|
+
};
|
|
27
|
+
export declare enum StandardAnimation {
|
|
28
|
+
Stand = "stand",
|
|
29
|
+
Walk = "walk"
|
|
30
|
+
}
|
|
31
|
+
declare const CanvasSprite_base: {
|
|
32
|
+
new (): {
|
|
33
|
+
[x: string]: any;
|
|
34
|
+
"__#1@#canvasContext": {
|
|
35
|
+
[key: string]: any;
|
|
36
|
+
} | null;
|
|
37
|
+
isFlex: boolean;
|
|
38
|
+
fullProps: import('..').Props;
|
|
39
|
+
isMounted: boolean;
|
|
40
|
+
_anchorPoints: import('pixi.js').ObservablePoint;
|
|
41
|
+
isCustomAnchor: boolean;
|
|
42
|
+
displayWidth: import('@signe/reactive').WritableSignal<number>;
|
|
43
|
+
displayHeight: import('@signe/reactive').WritableSignal<number>;
|
|
44
|
+
overrideProps: string[];
|
|
45
|
+
layout: any;
|
|
46
|
+
onBeforeDestroy: import('./DisplayObject').OnHook | null;
|
|
47
|
+
onAfterMount: import('./DisplayObject').OnHook | null;
|
|
48
|
+
subjectInit: import('rxjs').BehaviorSubject<any>;
|
|
49
|
+
disableLayout: boolean;
|
|
50
|
+
"__#1@#registeredEvents": Map<string, Function>;
|
|
51
|
+
readonly deltaRatio: any;
|
|
52
|
+
readonly parentIsFlex: any;
|
|
53
|
+
onInit(props: import('..').Props): void;
|
|
54
|
+
onMount({ parent, props }: Element</*elided*/ any>, index?: number): Promise<void>;
|
|
55
|
+
onUpdate(props: import('..').Props): void;
|
|
56
|
+
onDestroy(parent: Element, afterDestroy?: () => void): Promise<void>;
|
|
57
|
+
setFlexDirection(direction: import('./types/DisplayObject').FlexDirection): void;
|
|
58
|
+
setFlexWrap(wrap: "wrap" | "nowrap" | "wrap-reverse"): void;
|
|
59
|
+
setAlignContent(align: import('./types/DisplayObject').AlignContent): void;
|
|
60
|
+
setAlignSelf(align: import('./types/DisplayObject').AlignContent): void;
|
|
61
|
+
setAlignItems(align: import('./types/DisplayObject').AlignContent): void;
|
|
62
|
+
setJustifyContent(justifyContent: "flex-start" | "flex-end" | "center" | "space-between" | "space-around"): void;
|
|
63
|
+
setPosition(position: import('./types/DisplayObject').EdgeSize): void;
|
|
64
|
+
setX(x: number): void;
|
|
65
|
+
setY(y: number): void;
|
|
66
|
+
setPadding(padding: import('./types/DisplayObject').EdgeSize): void;
|
|
67
|
+
setMargin(margin: import('./types/DisplayObject').EdgeSize): void;
|
|
68
|
+
setGap(gap: import('./types/DisplayObject').EdgeSize): void;
|
|
69
|
+
setBorder(border: import('./types/DisplayObject').EdgeSize): void;
|
|
70
|
+
setPositionType(positionType: "relative" | "absolute"): void;
|
|
71
|
+
setWidth(width: number): void;
|
|
72
|
+
setHeight(height: number): void;
|
|
73
|
+
getWidth(): number;
|
|
74
|
+
getHeight(): number;
|
|
75
|
+
setMinWidth(minWidth: number | string): void;
|
|
76
|
+
setMinHeight(minHeight: number | string): void;
|
|
77
|
+
setMaxWidth(maxWidth: number | string): void;
|
|
78
|
+
setMaxHeight(maxHeight: number | string): void;
|
|
79
|
+
setAspectRatio(aspectRatio: number): void;
|
|
80
|
+
setFlexGrow(flexGrow: number): void;
|
|
81
|
+
setFlexShrink(flexShrink: number): void;
|
|
82
|
+
setFlexBasis(flexBasis: number | string): void;
|
|
83
|
+
setRowGap(rowGap: number): void;
|
|
84
|
+
setColumnGap(columnGap: number): void;
|
|
85
|
+
setTop(top: number | string): void;
|
|
86
|
+
setLeft(left: number | string): void;
|
|
87
|
+
setRight(right: number | string): void;
|
|
88
|
+
setBottom(bottom: number | string): void;
|
|
89
|
+
setObjectFit(objectFit: import('./types/DisplayObject').ObjectFit): void;
|
|
90
|
+
setObjectPosition(objectPosition: import('./types/DisplayObject').ObjectPosition): void;
|
|
91
|
+
setTransformOrigin(transformOrigin: import('./types/DisplayObject').TransformOrigin): void;
|
|
92
|
+
};
|
|
93
|
+
[x: string]: any;
|
|
94
|
+
};
|
|
95
|
+
export declare class CanvasSprite extends CanvasSprite_base {
|
|
96
|
+
hitbox: {
|
|
97
|
+
w: number;
|
|
98
|
+
h: number;
|
|
99
|
+
};
|
|
100
|
+
applyTransform: (frame: FrameOptionsMerging, data: TextureOptionsMerging, spritesheet: SpritesheetOptionsMerging) => Partial<FrameOptionsMerging>;
|
|
101
|
+
private spritesheet;
|
|
102
|
+
private currentAnimation;
|
|
103
|
+
private time;
|
|
104
|
+
private frameIndex;
|
|
105
|
+
private animations;
|
|
106
|
+
private subscriptionTick;
|
|
107
|
+
private subscriptionSheet;
|
|
108
|
+
private sheetParams;
|
|
109
|
+
private sheetCurrentAnimation;
|
|
110
|
+
private app;
|
|
111
|
+
onFinish: () => void;
|
|
112
|
+
get renderer(): import('pixi.js').Renderer;
|
|
113
|
+
private currentAnimationContainer;
|
|
114
|
+
private createTextures;
|
|
115
|
+
private createAnimations;
|
|
116
|
+
onMount(params: Element<CanvasSprite>): Promise<void>;
|
|
117
|
+
onUpdate(props: any): Promise<void>;
|
|
118
|
+
onDestroy(parent: Element, afterDestroy: () => void): Promise<void>;
|
|
119
|
+
has(name: string): boolean;
|
|
120
|
+
get(name: string): AnimationDataFrames;
|
|
121
|
+
isPlaying(name?: string): boolean;
|
|
122
|
+
stop(): void;
|
|
123
|
+
play(name: string, params?: any[]): void;
|
|
124
|
+
update({ deltaRatio }: {
|
|
125
|
+
deltaRatio: any;
|
|
126
|
+
}): void;
|
|
127
|
+
}
|
|
128
|
+
export interface CanvasSprite extends PixiSprite {
|
|
129
|
+
layout: Layout | null;
|
|
130
|
+
}
|
|
131
|
+
export interface SpriteProps extends DisplayObjectProps {
|
|
132
|
+
sheet?: {
|
|
133
|
+
definition?: SpritesheetOptionsMerging;
|
|
134
|
+
playing?: string;
|
|
135
|
+
params?: any;
|
|
136
|
+
onFinish?: () => void;
|
|
137
|
+
};
|
|
138
|
+
scaleMode?: number;
|
|
139
|
+
image?: string;
|
|
140
|
+
rectangle?: {
|
|
141
|
+
x: number;
|
|
142
|
+
y: number;
|
|
143
|
+
width: number;
|
|
144
|
+
height: number;
|
|
145
|
+
};
|
|
146
|
+
context?: {
|
|
147
|
+
tick: Signal;
|
|
148
|
+
};
|
|
149
|
+
}
|
|
150
|
+
export interface SpritePropsWithImage extends Omit<SpriteProps, "sheet"> {
|
|
151
|
+
image: string;
|
|
152
|
+
rectangle?: {
|
|
153
|
+
x: number;
|
|
154
|
+
y: number;
|
|
155
|
+
width: number;
|
|
156
|
+
height: number;
|
|
157
|
+
};
|
|
158
|
+
}
|
|
159
|
+
export interface SpritePropsWithSheet extends Omit<SpriteProps, "image" | "rectangle"> {
|
|
160
|
+
sheet: {
|
|
161
|
+
definition: SpritesheetOptionsMerging;
|
|
162
|
+
playing?: string;
|
|
163
|
+
params?: any;
|
|
164
|
+
onFinish?: () => void;
|
|
165
|
+
};
|
|
166
|
+
loader?: {
|
|
167
|
+
onProgress?: (progress: number) => void;
|
|
168
|
+
onComplete?: (texture: Texture) => void;
|
|
169
|
+
};
|
|
170
|
+
}
|
|
171
|
+
export type SpritePropTypes = SpritePropsWithImage | SpritePropsWithSheet;
|
|
172
|
+
export declare const Sprite: ComponentFunction<SpritePropTypes>;
|
|
173
|
+
export {};
|
|
174
|
+
//# sourceMappingURL=Sprite.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Sprite.d.ts","sourceRoot":"","sources":["../../src/components/Sprite.ts"],"names":[],"mappings":"AACA,OAAO,EAA8B,MAAM,EAAE,MAAM,iBAAiB,CAAC;AACrE,OAAO,EAIL,MAAM,IAAI,UAAU,EAEpB,OAAO,EACR,MAAM,SAAS,CAAC;AAEjB,OAAO,EACL,OAAO,EAIR,MAAM,oBAAoB,CAAC;AAG5B,OAAO,EACL,eAAe,EACf,YAAY,EACZ,kBAAkB,EAClB,cAAc,EACd,gBAAgB,EACjB,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AACrD,OAAO,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAE3D,OAAO,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AAItC,KAAK,KAAK,GAAG;IAAE,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC;AAE/B,KAAK,qBAAqB,GAAG,cAAc,GAAG;IAC5C,WAAW,EAAE,MAAM,CAAC;IACpB,YAAY,EAAE,MAAM,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,GAAG,KAAK,GACP,gBAAgB,CAAC;AAEnB,KAAK,mBAAmB,GAAG,qBAAqB,GAAG,YAAY,CAAC;AAChE,KAAK,yBAAyB,GAAG,qBAAqB,GAAG,kBAAkB,CAAC;AAM5E,KAAK,mBAAmB,GAAG;IACzB,OAAO,EAAE,mBAAmB,EAAE,CAAC;IAC/B,MAAM,EAAE,OAAO,EAAE,EAAE,CAAC;IACpB,IAAI,EAAE,MAAM,CAAC;IACb,UAAU,EAAE,eAAe,CAAC;IAC5B,MAAM,EAAE,GAAG,EAAE,CAAC;IACd,IAAI,EAAE,qBAAqB,CAAC;CAC7B,CAAC;AAEF,oBAAY,iBAAiB;IAC3B,KAAK,UAAU;IACf,IAAI,SAAS;CACd;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAED,qBAAa,YAAa,SAAQ,iBAAyB;IAClD,MAAM,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACjC,cAAc,EAAE,CACrB,KAAK,EAAE,mBAAmB,EAC1B,IAAI,EAAE,qBAAqB,EAC3B,WAAW,EAAE,yBAAyB,KACnC,OAAO,CAAC,mBAAmB,CAAC,CAAC;IAClC,OAAO,CAAC,WAAW,CAA4B;IAC/C,OAAO,CAAC,gBAAgB,CAAoC;IAC5D,OAAO,CAAC,IAAI,CAAa;IACzB,OAAO,CAAC,UAAU,CAAa;IAC/B,OAAO,CAAC,UAAU,CAA+C;IACjE,OAAO,CAAC,gBAAgB,CAAe;IACvC,OAAO,CAAC,iBAAiB,CAAsB;IAC/C,OAAO,CAAC,WAAW,CAAW;IAC9B,OAAO,CAAC,qBAAqB,CAAmC;IAChE,OAAO,CAAC,GAAG,CAA4B;IACvC,QAAQ,EAAE,MAAM,IAAI,CAAC;IAErB,IAAI,QAAQ,+BAEX;IAED,OAAO,CAAC,yBAAyB,CAA0B;YAE7C,cAAc;YA0Cd,gBAAgB;IAkDxB,OAAO,CAAC,MAAM,EAAE,OAAO,CAAC,YAAY,CAAC;IA8DrC,QAAQ,CAAC,KAAK,KAAA;IAmEd,SAAS,CAAC,MAAM,EAAE,OAAO,EAAE,YAAY,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC;IAczE,GAAG,CAAC,IAAI,EAAE,MAAM,GAAG,OAAO;IAI1B,GAAG,CAAC,IAAI,EAAE,MAAM,GAAG,mBAAmB;IAItC,SAAS,CAAC,IAAI,CAAC,EAAE,MAAM,GAAG,OAAO;IAMjC,IAAI;IAKJ,IAAI,CAAC,IAAI,EAAE,MAAM,EAAE,MAAM,GAAE,GAAG,EAAO;IAqDrC,MAAM,CAAC,EAAE,UAAU,EAAE;;KAAA;CA6GtB;AAED,MAAM,WAAW,YAAa,SAAQ,UAAU;IAC9C,MAAM,EAAE,MAAM,GAAG,IAAI,CAAC;CACvB;AAKD,MAAM,WAAW,WAAY,SAAQ,kBAAkB;IACrD,KAAK,CAAC,EAAE;QACN,UAAU,CAAC,EAAE,yBAAyB,CAAC;QACvC,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,MAAM,CAAC,EAAE,GAAG,CAAC;QACb,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;KACvB,CAAC;IACF,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE;QACV,CAAC,EAAE,MAAM,CAAC;QACV,CAAC,EAAE,MAAM,CAAC;QACV,KAAK,EAAE,MAAM,CAAC;QACd,MAAM,EAAE,MAAM,CAAC;KAChB,CAAC;IACF,OAAO,CAAC,EAAE;QACR,IAAI,EAAE,MAAM,CAAC;KACd,CAAC;CACH;AAED,MAAM,WAAW,oBAAqB,SAAQ,IAAI,CAAC,WAAW,EAAE,OAAO,CAAC;IACtE,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE;QACV,CAAC,EAAE,MAAM,CAAC;QACV,CAAC,EAAE,MAAM,CAAC;QACV,KAAK,EAAE,MAAM,CAAC;QACd,MAAM,EAAE,MAAM,CAAC;KAChB,CAAC;CACH;AAED,MAAM,WAAW,oBACf,SAAQ,IAAI,CAAC,WAAW,EAAE,OAAO,GAAG,WAAW,CAAC;IAChD,KAAK,EAAE;QACL,UAAU,EAAE,yBAAyB,CAAC;QACtC,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,MAAM,CAAC,EAAE,GAAG,CAAC;QACb,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;KACvB,CAAC;IACF,MAAM,CAAC,EAAE;QACP,UAAU,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;QACxC,UAAU,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;KACzC,CAAC;CACH;AAED,MAAM,MAAM,eAAe,GAAG,oBAAoB,GAAG,oBAAoB,CAAC;AAG1E,eAAO,MAAM,MAAM,EAAE,iBAAiB,CAAC,eAAe,CAErD,CAAC"}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import { TextStyle } from 'pixi.js';
|
|
2
|
+
import { Element } from '../engine/reactive';
|
|
3
|
+
import { ComponentInstance } from './DisplayObject';
|
|
4
|
+
import { DisplayObjectProps } from './types/DisplayObject';
|
|
5
|
+
|
|
6
|
+
export interface TextProps extends DisplayObjectProps {
|
|
7
|
+
text?: string;
|
|
8
|
+
style?: Partial<TextStyle>;
|
|
9
|
+
color?: string;
|
|
10
|
+
size?: string;
|
|
11
|
+
fontFamily?: string;
|
|
12
|
+
typewriter?: {
|
|
13
|
+
speed?: number;
|
|
14
|
+
start?: () => void;
|
|
15
|
+
onComplete?: () => void;
|
|
16
|
+
skip?: () => void;
|
|
17
|
+
};
|
|
18
|
+
context?: any;
|
|
19
|
+
}
|
|
20
|
+
export declare function Text(props: TextProps): Element<ComponentInstance>;
|
|
21
|
+
//# sourceMappingURL=Text.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Text.d.ts","sourceRoot":"","sources":["../../src/components/Text.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoB,SAAS,EAAE,MAAM,SAAS,CAAC;AACtD,OAAO,EAAsC,OAAO,EAAS,MAAM,oBAAoB,CAAC;AACxF,OAAO,EAAiB,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AACnE,OAAO,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAQ3D,MAAM,WAAW,SAAU,SAAQ,kBAAkB;IACnD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,CAAC;IAC3B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE;QACX,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,KAAK,CAAC,EAAE,MAAM,IAAI,CAAC;QACnB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;QACxB,IAAI,CAAC,EAAE,MAAM,IAAI,CAAC;KACnB,CAAC;IACF,OAAO,CAAC,EAAE,GAAG,CAAC;CACf;AA0ID,wBAAgB,IAAI,CAAC,KAAK,EAAE,SAAS,8BAEpC"}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { DisplayObjectProps } from './types/DisplayObject';
|
|
2
|
+
|
|
3
|
+
interface TilingSpriteProps extends DisplayObjectProps {
|
|
4
|
+
image?: string;
|
|
5
|
+
tileScale?: {
|
|
6
|
+
x: number;
|
|
7
|
+
y: number;
|
|
8
|
+
};
|
|
9
|
+
tilePosition?: {
|
|
10
|
+
x: number;
|
|
11
|
+
y: number;
|
|
12
|
+
};
|
|
13
|
+
width?: number;
|
|
14
|
+
height?: number;
|
|
15
|
+
}
|
|
16
|
+
export declare function TilingSprite(props: TilingSpriteProps): import('..').Element<import('./DisplayObject').ComponentInstance>;
|
|
17
|
+
export {};
|
|
18
|
+
//# sourceMappingURL=TilingSprite.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TilingSprite.d.ts","sourceRoot":"","sources":["../../src/components/TilingSprite.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAE3D,UAAU,iBAAkB,SAAQ,kBAAkB;IAClD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACrC,YAAY,CAAC,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACxC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;CACnB;AAyBD,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,qEAEpD"}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { Texture } from 'pixi.js';
|
|
2
|
+
|
|
3
|
+
interface VideoProps {
|
|
4
|
+
src: string;
|
|
5
|
+
paused?: boolean;
|
|
6
|
+
loop?: boolean;
|
|
7
|
+
muted?: boolean;
|
|
8
|
+
loader?: {
|
|
9
|
+
onComplete?: (texture: Texture) => void;
|
|
10
|
+
onProgress?: (progress: number) => void;
|
|
11
|
+
};
|
|
12
|
+
}
|
|
13
|
+
export declare function Video(props: VideoProps): import('..').Element<import('./DisplayObject').ComponentInstance> | Promise<import('..').Element<import('./DisplayObject').ComponentInstance>>;
|
|
14
|
+
export {};
|
|
15
|
+
//# sourceMappingURL=Video.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Video.d.ts","sourceRoot":"","sources":["../../src/components/Video.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,SAAS,CAAC;AAMlC,UAAU,UAAU;IAChB,GAAG,EAAE,MAAM,CAAC;IACZ,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,MAAM,CAAC,EAAE;QACL,UAAU,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;QACxC,UAAU,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;KAC3C,CAAC;CACL;AAED,wBAAgB,KAAK,CAAC,KAAK,EAAE,UAAU,kJA4FtC"}
|