@thewhateverapp/tile-sdk 0.13.33 → 0.13.35
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/bridge/TileBridge.d.ts +6 -1
- package/dist/bridge/TileBridge.d.ts.map +1 -1
- package/dist/bridge/TileBridge.js +15 -1
- package/dist/react/PixiGame.d.ts +156 -0
- package/dist/react/PixiGame.d.ts.map +1 -0
- package/dist/react/PixiGame.js +206 -0
- package/dist/react/index.d.ts +2 -0
- package/dist/react/index.d.ts.map +1 -1
- package/dist/react/index.js +6 -0
- package/dist/spec/schema.d.ts +20 -20
- package/package.json +14 -2
|
@@ -351,7 +351,12 @@ export declare class TileBridge {
|
|
|
351
351
|
/**
|
|
352
352
|
* Subscribe to visibility state changes
|
|
353
353
|
* Called when parent sends visibility show/hide events (e.g., TikTok-style feed)
|
|
354
|
-
*
|
|
354
|
+
*
|
|
355
|
+
* IMPORTANT: If a visibility message has already been received from the parent,
|
|
356
|
+
* the handler is immediately called with the current state. This prevents race
|
|
357
|
+
* conditions where the video player registers after the visibility message arrives.
|
|
358
|
+
*
|
|
359
|
+
* @param handler Callback receiving { visible: boolean, muted: boolean }
|
|
355
360
|
* @returns Unsubscribe function
|
|
356
361
|
*/
|
|
357
362
|
onVisibilityChange(handler: (state: VisibilityState) => void): () => void;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TileBridge.d.ts","sourceRoot":"","sources":["../../src/bridge/TileBridge.ts"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"TileBridge.d.ts","sourceRoot":"","sources":["../../src/bridge/TileBridge.ts"],"names":[],"mappings":"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"}
|
|
@@ -1366,10 +1366,24 @@ export class TileBridge {
|
|
|
1366
1366
|
/**
|
|
1367
1367
|
* Subscribe to visibility state changes
|
|
1368
1368
|
* Called when parent sends visibility show/hide events (e.g., TikTok-style feed)
|
|
1369
|
-
*
|
|
1369
|
+
*
|
|
1370
|
+
* IMPORTANT: If a visibility message has already been received from the parent,
|
|
1371
|
+
* the handler is immediately called with the current state. This prevents race
|
|
1372
|
+
* conditions where the video player registers after the visibility message arrives.
|
|
1373
|
+
*
|
|
1374
|
+
* @param handler Callback receiving { visible: boolean, muted: boolean }
|
|
1370
1375
|
* @returns Unsubscribe function
|
|
1371
1376
|
*/
|
|
1372
1377
|
onVisibilityChange(handler) {
|
|
1378
|
+
// If we've already received a visibility message from parent, immediately
|
|
1379
|
+
// call the handler with the current state. This handles the race condition
|
|
1380
|
+
// where VideoPlayer.setupVisibilityHandling() is called after the initial
|
|
1381
|
+
// visibility message was received and processed.
|
|
1382
|
+
if (this.receivedVisibilityMessage) {
|
|
1383
|
+
console.log('[TileBridge] 👁️ Replaying current visibility state to new listener:', this.visibilityState);
|
|
1384
|
+
// Use setTimeout to ensure handler is called after subscription is set up
|
|
1385
|
+
setTimeout(() => handler(this.visibilityState), 0);
|
|
1386
|
+
}
|
|
1373
1387
|
return this.on('visibility:update', handler);
|
|
1374
1388
|
}
|
|
1375
1389
|
// ============= AUDIOCONTEXT REGISTRATION API =============
|
|
@@ -0,0 +1,156 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* PixiGame - A wrapper component that abstracts @pixi/react v8's Application boilerplate
|
|
3
|
+
*
|
|
4
|
+
* @pixi/react v8 requires:
|
|
5
|
+
* 1. Importing pixi.js classes
|
|
6
|
+
* 2. Calling extend() to register them
|
|
7
|
+
* 3. Using them as <pixi*> JSX elements (e.g., <pixiContainer>, <pixiSprite>)
|
|
8
|
+
* 4. Hooks like useTick must be used INSIDE the Application tree
|
|
9
|
+
*
|
|
10
|
+
* This component handles all of that setup automatically.
|
|
11
|
+
*
|
|
12
|
+
* @example
|
|
13
|
+
* ```tsx
|
|
14
|
+
* import { PixiGame, useGameLoop } from '@thewhateverapp/tile-sdk';
|
|
15
|
+
*
|
|
16
|
+
* function MyGame() {
|
|
17
|
+
* return (
|
|
18
|
+
* <PixiGame>
|
|
19
|
+
* <GameContent />
|
|
20
|
+
* </PixiGame>
|
|
21
|
+
* );
|
|
22
|
+
* }
|
|
23
|
+
*
|
|
24
|
+
* function GameContent() {
|
|
25
|
+
* const playerRef = useRef({ x: 128, y: 400 });
|
|
26
|
+
*
|
|
27
|
+
* useGameLoop((delta) => {
|
|
28
|
+
* // Game logic here - runs every frame
|
|
29
|
+
* playerRef.current.x += 1 * delta;
|
|
30
|
+
* });
|
|
31
|
+
*
|
|
32
|
+
* // Use lowercase 'pixi' prefix for pixi.js elements
|
|
33
|
+
* return (
|
|
34
|
+
* <pixiContainer>
|
|
35
|
+
* <pixiSprite texture={texture} x={playerRef.current.x} />
|
|
36
|
+
* </pixiContainer>
|
|
37
|
+
* );
|
|
38
|
+
* }
|
|
39
|
+
* ```
|
|
40
|
+
*/
|
|
41
|
+
import React, { ReactNode } from 'react';
|
|
42
|
+
import { useApplication, extend } from '@pixi/react';
|
|
43
|
+
export { extend };
|
|
44
|
+
export { useApplication };
|
|
45
|
+
/**
|
|
46
|
+
* Tile dimensions - standard tile size
|
|
47
|
+
*/
|
|
48
|
+
export declare const TILE_WIDTH = 256;
|
|
49
|
+
export declare const TILE_HEIGHT = 554;
|
|
50
|
+
export interface PixiGameProps {
|
|
51
|
+
children: ReactNode;
|
|
52
|
+
/** Width in pixels (default: 256 for tile) */
|
|
53
|
+
width?: number;
|
|
54
|
+
/** Height in pixels (default: 554 for tile) */
|
|
55
|
+
height?: number;
|
|
56
|
+
/** Background color (default: black) */
|
|
57
|
+
background?: string | number;
|
|
58
|
+
/** Whether to use antialiasing (default: true) */
|
|
59
|
+
antialias?: boolean;
|
|
60
|
+
/** Resolution/pixel ratio (default: window.devicePixelRatio || 1) */
|
|
61
|
+
resolution?: number;
|
|
62
|
+
/** Whether game is paused */
|
|
63
|
+
paused?: boolean;
|
|
64
|
+
/** Callback when Application is ready */
|
|
65
|
+
onReady?: () => void;
|
|
66
|
+
}
|
|
67
|
+
/**
|
|
68
|
+
* PixiGame - Main wrapper component for pixi.js games
|
|
69
|
+
*
|
|
70
|
+
* Provides the Application context that @pixi/react hooks need.
|
|
71
|
+
* All game content should be rendered as children of this component.
|
|
72
|
+
*
|
|
73
|
+
* After importing PixiGame, use pixi.js elements with the 'pixi' prefix:
|
|
74
|
+
* - <pixiContainer> - Container for grouping elements
|
|
75
|
+
* - <pixiSprite texture={...}> - Sprite with texture
|
|
76
|
+
* - <pixiGraphics draw={...}> - Graphics with draw callback
|
|
77
|
+
* - <pixiText text="..." style={...}> - Text element
|
|
78
|
+
*/
|
|
79
|
+
export declare function PixiGame({ children, width, height, background, antialias, resolution, paused, onReady, }: PixiGameProps): React.JSX.Element;
|
|
80
|
+
/**
|
|
81
|
+
* useGameLoop - A more intuitive name for useTick
|
|
82
|
+
*
|
|
83
|
+
* Runs a callback every frame with delta time.
|
|
84
|
+
* Must be used inside a PixiGame component (or any @pixi/react Application).
|
|
85
|
+
*
|
|
86
|
+
* @param callback - Function called every frame with delta time (in frames, ~1 at 60fps)
|
|
87
|
+
* @param enabled - Whether the loop is active (default: true)
|
|
88
|
+
*
|
|
89
|
+
* @example
|
|
90
|
+
* ```tsx
|
|
91
|
+
* function GameContent() {
|
|
92
|
+
* const posRef = useRef({ x: 0, y: 0 });
|
|
93
|
+
*
|
|
94
|
+
* useGameLoop((delta) => {
|
|
95
|
+
* posRef.current.x += 2 * delta;
|
|
96
|
+
* if (posRef.current.x > 256) posRef.current.x = 0;
|
|
97
|
+
* });
|
|
98
|
+
*
|
|
99
|
+
* return <pixiSprite x={posRef.current.x} y={posRef.current.y} texture={...} />;
|
|
100
|
+
* }
|
|
101
|
+
* ```
|
|
102
|
+
*/
|
|
103
|
+
export declare function useGameLoop(callback: (ticker: {
|
|
104
|
+
deltaTime: number;
|
|
105
|
+
}) => void, enabled?: boolean): void;
|
|
106
|
+
/**
|
|
107
|
+
* useGameState - Helper for managing game state with refs
|
|
108
|
+
*
|
|
109
|
+
* Returns a ref and a forceUpdate function for when you need to trigger re-renders.
|
|
110
|
+
* Use refs for continuous game state (position, velocity) to avoid re-render loops.
|
|
111
|
+
*
|
|
112
|
+
* @example
|
|
113
|
+
* ```tsx
|
|
114
|
+
* function GameContent() {
|
|
115
|
+
* const [state, forceUpdate] = useGameState({
|
|
116
|
+
* playerX: 128,
|
|
117
|
+
* playerY: 400,
|
|
118
|
+
* score: 0,
|
|
119
|
+
* });
|
|
120
|
+
*
|
|
121
|
+
* useGameLoop((delta) => {
|
|
122
|
+
* state.current.playerX += 1 * delta;
|
|
123
|
+
* if (state.current.score !== previousScore) {
|
|
124
|
+
* forceUpdate(); // Only re-render when score changes
|
|
125
|
+
* }
|
|
126
|
+
* });
|
|
127
|
+
*
|
|
128
|
+
* return <pixiText text={`Score: ${state.current.score}`} />;
|
|
129
|
+
* }
|
|
130
|
+
* ```
|
|
131
|
+
*/
|
|
132
|
+
export declare function useGameState<T extends object>(initialState: T): [React.MutableRefObject<T>, () => void];
|
|
133
|
+
/**
|
|
134
|
+
* useGameInput - Simple keyboard input hook for games
|
|
135
|
+
*
|
|
136
|
+
* Returns a ref with currently pressed keys.
|
|
137
|
+
* Can be used inside or outside PixiGame component.
|
|
138
|
+
*
|
|
139
|
+
* @example
|
|
140
|
+
* ```tsx
|
|
141
|
+
* function GameContent() {
|
|
142
|
+
* const keys = useGameInput();
|
|
143
|
+
* const posRef = useRef({ x: 128, y: 400 });
|
|
144
|
+
*
|
|
145
|
+
* useGameLoop((delta) => {
|
|
146
|
+
* if (keys.current.ArrowLeft) posRef.current.x -= 5 * delta;
|
|
147
|
+
* if (keys.current.ArrowRight) posRef.current.x += 5 * delta;
|
|
148
|
+
* if (keys.current[' ']) jump(); // Space key
|
|
149
|
+
* });
|
|
150
|
+
*
|
|
151
|
+
* return <pixiSprite x={posRef.current.x} y={posRef.current.y} texture={...} />;
|
|
152
|
+
* }
|
|
153
|
+
* ```
|
|
154
|
+
*/
|
|
155
|
+
export declare function useGameInput(): React.MutableRefObject<Record<string, boolean>>;
|
|
156
|
+
//# sourceMappingURL=PixiGame.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"PixiGame.d.ts","sourceRoot":"","sources":["../../src/react/PixiGame.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuCG;AAEH,OAAO,KAAK,EAAE,EAAE,SAAS,EAAkC,MAAM,OAAO,CAAC;AACzE,OAAO,EAAe,cAAc,EAAW,MAAM,EAAE,MAAM,aAAa,CAAC;AA0B3E,OAAO,EAAE,MAAM,EAAE,CAAC;AAGlB,OAAO,EAAE,cAAc,EAAE,CAAC;AAE1B;;GAEG;AACH,eAAO,MAAM,UAAU,MAAM,CAAC;AAC9B,eAAO,MAAM,WAAW,MAAM,CAAC;AAE/B,MAAM,WAAW,aAAa;IAC5B,QAAQ,EAAE,SAAS,CAAC;IACpB,8CAA8C;IAC9C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,+CAA+C;IAC/C,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,wCAAwC;IACxC,UAAU,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC7B,kDAAkD;IAClD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,qEAAqE;IACrE,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,6BAA6B;IAC7B,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,yCAAyC;IACzC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,QAAQ,CAAC,EACvB,QAAQ,EACR,KAAkB,EAClB,MAAoB,EACpB,UAAqB,EACrB,SAAgB,EAChB,UAAU,EACV,MAAc,EACd,OAAO,GACR,EAAE,aAAa,qBAiBf;AA2BD;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,wBAAgB,WAAW,CACzB,QAAQ,EAAE,CAAC,MAAM,EAAE;IAAE,SAAS,EAAE,MAAM,CAAA;CAAE,KAAK,IAAI,EACjD,OAAO,GAAE,OAAc,QAMxB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,wBAAgB,YAAY,CAAC,CAAC,SAAS,MAAM,EAC3C,YAAY,EAAE,CAAC,GACd,CAAC,KAAK,CAAC,gBAAgB,CAAC,CAAC,CAAC,EAAE,MAAM,IAAI,CAAC,CASzC;AAED;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,wBAAgB,YAAY,oDAwB3B"}
|
|
@@ -0,0 +1,206 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
/**
|
|
3
|
+
* PixiGame - A wrapper component that abstracts @pixi/react v8's Application boilerplate
|
|
4
|
+
*
|
|
5
|
+
* @pixi/react v8 requires:
|
|
6
|
+
* 1. Importing pixi.js classes
|
|
7
|
+
* 2. Calling extend() to register them
|
|
8
|
+
* 3. Using them as <pixi*> JSX elements (e.g., <pixiContainer>, <pixiSprite>)
|
|
9
|
+
* 4. Hooks like useTick must be used INSIDE the Application tree
|
|
10
|
+
*
|
|
11
|
+
* This component handles all of that setup automatically.
|
|
12
|
+
*
|
|
13
|
+
* @example
|
|
14
|
+
* ```tsx
|
|
15
|
+
* import { PixiGame, useGameLoop } from '@thewhateverapp/tile-sdk';
|
|
16
|
+
*
|
|
17
|
+
* function MyGame() {
|
|
18
|
+
* return (
|
|
19
|
+
* <PixiGame>
|
|
20
|
+
* <GameContent />
|
|
21
|
+
* </PixiGame>
|
|
22
|
+
* );
|
|
23
|
+
* }
|
|
24
|
+
*
|
|
25
|
+
* function GameContent() {
|
|
26
|
+
* const playerRef = useRef({ x: 128, y: 400 });
|
|
27
|
+
*
|
|
28
|
+
* useGameLoop((delta) => {
|
|
29
|
+
* // Game logic here - runs every frame
|
|
30
|
+
* playerRef.current.x += 1 * delta;
|
|
31
|
+
* });
|
|
32
|
+
*
|
|
33
|
+
* // Use lowercase 'pixi' prefix for pixi.js elements
|
|
34
|
+
* return (
|
|
35
|
+
* <pixiContainer>
|
|
36
|
+
* <pixiSprite texture={texture} x={playerRef.current.x} />
|
|
37
|
+
* </pixiContainer>
|
|
38
|
+
* );
|
|
39
|
+
* }
|
|
40
|
+
* ```
|
|
41
|
+
*/
|
|
42
|
+
import React, { useCallback, useRef, useEffect } from 'react';
|
|
43
|
+
import { Application, useApplication, useTick, extend } from '@pixi/react';
|
|
44
|
+
import { Container, Sprite, Graphics, Text, AnimatedSprite, TilingSprite, NineSliceSprite, Mesh, } from 'pixi.js';
|
|
45
|
+
// Register all common pixi.js classes so they're available as JSX elements
|
|
46
|
+
// After this, you can use <pixiContainer>, <pixiSprite>, <pixiGraphics>, etc.
|
|
47
|
+
extend({
|
|
48
|
+
Container,
|
|
49
|
+
Sprite,
|
|
50
|
+
Graphics,
|
|
51
|
+
Text,
|
|
52
|
+
AnimatedSprite,
|
|
53
|
+
TilingSprite,
|
|
54
|
+
NineSliceSprite,
|
|
55
|
+
Mesh,
|
|
56
|
+
});
|
|
57
|
+
// Re-export the extend function for advanced use cases
|
|
58
|
+
export { extend };
|
|
59
|
+
// Re-export useApplication for advanced use cases
|
|
60
|
+
export { useApplication };
|
|
61
|
+
/**
|
|
62
|
+
* Tile dimensions - standard tile size
|
|
63
|
+
*/
|
|
64
|
+
export const TILE_WIDTH = 256;
|
|
65
|
+
export const TILE_HEIGHT = 554;
|
|
66
|
+
/**
|
|
67
|
+
* PixiGame - Main wrapper component for pixi.js games
|
|
68
|
+
*
|
|
69
|
+
* Provides the Application context that @pixi/react hooks need.
|
|
70
|
+
* All game content should be rendered as children of this component.
|
|
71
|
+
*
|
|
72
|
+
* After importing PixiGame, use pixi.js elements with the 'pixi' prefix:
|
|
73
|
+
* - <pixiContainer> - Container for grouping elements
|
|
74
|
+
* - <pixiSprite texture={...}> - Sprite with texture
|
|
75
|
+
* - <pixiGraphics draw={...}> - Graphics with draw callback
|
|
76
|
+
* - <pixiText text="..." style={...}> - Text element
|
|
77
|
+
*/
|
|
78
|
+
export function PixiGame({ children, width = TILE_WIDTH, height = TILE_HEIGHT, background = 0x000000, antialias = true, resolution, paused = false, onReady, }) {
|
|
79
|
+
const handleReady = useCallback(() => {
|
|
80
|
+
onReady?.();
|
|
81
|
+
}, [onReady]);
|
|
82
|
+
return (React.createElement(Application, { width: width, height: height, background: background, antialias: antialias, resolution: resolution ?? (typeof window !== 'undefined' ? window.devicePixelRatio : 1), onInit: handleReady },
|
|
83
|
+
React.createElement(GameWrapper, { paused: paused }, children)));
|
|
84
|
+
}
|
|
85
|
+
/**
|
|
86
|
+
* Internal wrapper that provides pause functionality
|
|
87
|
+
*/
|
|
88
|
+
function GameWrapper({ children, paused, }) {
|
|
89
|
+
const { app } = useApplication();
|
|
90
|
+
useEffect(() => {
|
|
91
|
+
if (app?.ticker) {
|
|
92
|
+
if (paused) {
|
|
93
|
+
app.ticker.stop();
|
|
94
|
+
}
|
|
95
|
+
else {
|
|
96
|
+
app.ticker.start();
|
|
97
|
+
}
|
|
98
|
+
}
|
|
99
|
+
}, [app, paused]);
|
|
100
|
+
return React.createElement(React.Fragment, null, children);
|
|
101
|
+
}
|
|
102
|
+
/**
|
|
103
|
+
* useGameLoop - A more intuitive name for useTick
|
|
104
|
+
*
|
|
105
|
+
* Runs a callback every frame with delta time.
|
|
106
|
+
* Must be used inside a PixiGame component (or any @pixi/react Application).
|
|
107
|
+
*
|
|
108
|
+
* @param callback - Function called every frame with delta time (in frames, ~1 at 60fps)
|
|
109
|
+
* @param enabled - Whether the loop is active (default: true)
|
|
110
|
+
*
|
|
111
|
+
* @example
|
|
112
|
+
* ```tsx
|
|
113
|
+
* function GameContent() {
|
|
114
|
+
* const posRef = useRef({ x: 0, y: 0 });
|
|
115
|
+
*
|
|
116
|
+
* useGameLoop((delta) => {
|
|
117
|
+
* posRef.current.x += 2 * delta;
|
|
118
|
+
* if (posRef.current.x > 256) posRef.current.x = 0;
|
|
119
|
+
* });
|
|
120
|
+
*
|
|
121
|
+
* return <pixiSprite x={posRef.current.x} y={posRef.current.y} texture={...} />;
|
|
122
|
+
* }
|
|
123
|
+
* ```
|
|
124
|
+
*/
|
|
125
|
+
export function useGameLoop(callback, enabled = true) {
|
|
126
|
+
useTick({
|
|
127
|
+
callback: (ticker) => callback(ticker),
|
|
128
|
+
isEnabled: enabled,
|
|
129
|
+
});
|
|
130
|
+
}
|
|
131
|
+
/**
|
|
132
|
+
* useGameState - Helper for managing game state with refs
|
|
133
|
+
*
|
|
134
|
+
* Returns a ref and a forceUpdate function for when you need to trigger re-renders.
|
|
135
|
+
* Use refs for continuous game state (position, velocity) to avoid re-render loops.
|
|
136
|
+
*
|
|
137
|
+
* @example
|
|
138
|
+
* ```tsx
|
|
139
|
+
* function GameContent() {
|
|
140
|
+
* const [state, forceUpdate] = useGameState({
|
|
141
|
+
* playerX: 128,
|
|
142
|
+
* playerY: 400,
|
|
143
|
+
* score: 0,
|
|
144
|
+
* });
|
|
145
|
+
*
|
|
146
|
+
* useGameLoop((delta) => {
|
|
147
|
+
* state.current.playerX += 1 * delta;
|
|
148
|
+
* if (state.current.score !== previousScore) {
|
|
149
|
+
* forceUpdate(); // Only re-render when score changes
|
|
150
|
+
* }
|
|
151
|
+
* });
|
|
152
|
+
*
|
|
153
|
+
* return <pixiText text={`Score: ${state.current.score}`} />;
|
|
154
|
+
* }
|
|
155
|
+
* ```
|
|
156
|
+
*/
|
|
157
|
+
export function useGameState(initialState) {
|
|
158
|
+
const stateRef = useRef(initialState);
|
|
159
|
+
const [, setTick] = React.useState(0);
|
|
160
|
+
const forceUpdate = useCallback(() => {
|
|
161
|
+
setTick((t) => t + 1);
|
|
162
|
+
}, []);
|
|
163
|
+
return [stateRef, forceUpdate];
|
|
164
|
+
}
|
|
165
|
+
/**
|
|
166
|
+
* useGameInput - Simple keyboard input hook for games
|
|
167
|
+
*
|
|
168
|
+
* Returns a ref with currently pressed keys.
|
|
169
|
+
* Can be used inside or outside PixiGame component.
|
|
170
|
+
*
|
|
171
|
+
* @example
|
|
172
|
+
* ```tsx
|
|
173
|
+
* function GameContent() {
|
|
174
|
+
* const keys = useGameInput();
|
|
175
|
+
* const posRef = useRef({ x: 128, y: 400 });
|
|
176
|
+
*
|
|
177
|
+
* useGameLoop((delta) => {
|
|
178
|
+
* if (keys.current.ArrowLeft) posRef.current.x -= 5 * delta;
|
|
179
|
+
* if (keys.current.ArrowRight) posRef.current.x += 5 * delta;
|
|
180
|
+
* if (keys.current[' ']) jump(); // Space key
|
|
181
|
+
* });
|
|
182
|
+
*
|
|
183
|
+
* return <pixiSprite x={posRef.current.x} y={posRef.current.y} texture={...} />;
|
|
184
|
+
* }
|
|
185
|
+
* ```
|
|
186
|
+
*/
|
|
187
|
+
export function useGameInput() {
|
|
188
|
+
const keysRef = useRef({});
|
|
189
|
+
useEffect(() => {
|
|
190
|
+
const handleKeyDown = (e) => {
|
|
191
|
+
keysRef.current[e.key] = true;
|
|
192
|
+
keysRef.current[e.code] = true;
|
|
193
|
+
};
|
|
194
|
+
const handleKeyUp = (e) => {
|
|
195
|
+
keysRef.current[e.key] = false;
|
|
196
|
+
keysRef.current[e.code] = false;
|
|
197
|
+
};
|
|
198
|
+
window.addEventListener('keydown', handleKeyDown);
|
|
199
|
+
window.addEventListener('keyup', handleKeyUp);
|
|
200
|
+
return () => {
|
|
201
|
+
window.removeEventListener('keydown', handleKeyDown);
|
|
202
|
+
window.removeEventListener('keyup', handleKeyUp);
|
|
203
|
+
};
|
|
204
|
+
}, []);
|
|
205
|
+
return keysRef;
|
|
206
|
+
}
|
package/dist/react/index.d.ts
CHANGED
|
@@ -4,5 +4,7 @@ export { useTile } from './useTile';
|
|
|
4
4
|
export { useKeyboard } from './useKeyboard';
|
|
5
5
|
export { TileContainer } from './TileContainer';
|
|
6
6
|
export { withTile } from './withTile';
|
|
7
|
+
export { PixiGame, useGameLoop, useGameState, useGameInput, extend, useApplication, TILE_WIDTH, TILE_HEIGHT, } from './PixiGame';
|
|
8
|
+
export type { PixiGameProps } from './PixiGame';
|
|
7
9
|
export * from './overlay';
|
|
8
10
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/react/index.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC3D,YAAY,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AACvD,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAItC,cAAc,WAAW,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/react/index.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC3D,YAAY,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AACvD,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAItC,OAAO,EACL,QAAQ,EACR,WAAW,EACX,YAAY,EACZ,YAAY,EAEZ,MAAM,EACN,cAAc,EAEd,UAAU,EACV,WAAW,GACZ,MAAM,YAAY,CAAC;AACpB,YAAY,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAGhD,cAAc,WAAW,CAAC"}
|
package/dist/react/index.js
CHANGED
|
@@ -5,5 +5,11 @@ export { useKeyboard } from './useKeyboard';
|
|
|
5
5
|
export { TileContainer } from './TileContainer';
|
|
6
6
|
export { withTile } from './withTile';
|
|
7
7
|
// TileInitializer removed - router should be injected directly into TileProvider
|
|
8
|
+
// PixiGame wrapper for @pixi/react games - abstracts Application context boilerplate
|
|
9
|
+
export { PixiGame, useGameLoop, useGameState, useGameInput,
|
|
10
|
+
// Re-exported from @pixi/react
|
|
11
|
+
extend, useApplication,
|
|
12
|
+
// Constants
|
|
13
|
+
TILE_WIDTH, TILE_HEIGHT, } from './PixiGame';
|
|
8
14
|
// Overlay components for hybrid tiles (video/image with interactive overlays)
|
|
9
15
|
export * from './overlay';
|
package/dist/spec/schema.d.ts
CHANGED
|
@@ -28,10 +28,10 @@ declare const ActionSchema: z.ZodObject<{
|
|
|
28
28
|
$action: z.ZodEnum<["emit", "setState", "sequence", "openTile", "openFull", "navigate", "dismiss", "fx"]>;
|
|
29
29
|
payload: z.ZodOptional<z.ZodRecord<z.ZodString, z.ZodUnknown>>;
|
|
30
30
|
}, "strip", z.ZodTypeAny, {
|
|
31
|
-
$action: "navigate" | "
|
|
31
|
+
$action: "navigate" | "emit" | "setState" | "sequence" | "openTile" | "openFull" | "dismiss" | "fx";
|
|
32
32
|
payload?: Record<string, unknown> | undefined;
|
|
33
33
|
}, {
|
|
34
|
-
$action: "navigate" | "
|
|
34
|
+
$action: "navigate" | "emit" | "setState" | "sequence" | "openTile" | "openFull" | "dismiss" | "fx";
|
|
35
35
|
payload?: Record<string, unknown> | undefined;
|
|
36
36
|
}>;
|
|
37
37
|
declare const PropValueSchema: z.ZodType<unknown>;
|
|
@@ -61,20 +61,20 @@ declare const CaptionTrackSchema: z.ZodObject<{
|
|
|
61
61
|
}, "strip", z.ZodTypeAny, {
|
|
62
62
|
position: "center" | "bottom" | "top";
|
|
63
63
|
size: "sm" | "md" | "lg" | "xs" | "xl" | "2xl";
|
|
64
|
-
background?: "none" | "solid" | "gradient" | undefined;
|
|
65
64
|
color?: string | undefined;
|
|
65
|
+
background?: "none" | "solid" | "gradient" | undefined;
|
|
66
66
|
}, {
|
|
67
67
|
position: "center" | "bottom" | "top";
|
|
68
68
|
size: "sm" | "md" | "lg" | "xs" | "xl" | "2xl";
|
|
69
|
-
background?: "none" | "solid" | "gradient" | undefined;
|
|
70
69
|
color?: string | undefined;
|
|
70
|
+
background?: "none" | "solid" | "gradient" | undefined;
|
|
71
71
|
}>;
|
|
72
72
|
}, "strip", z.ZodTypeAny, {
|
|
73
73
|
style: {
|
|
74
74
|
position: "center" | "bottom" | "top";
|
|
75
75
|
size: "sm" | "md" | "lg" | "xs" | "xl" | "2xl";
|
|
76
|
-
background?: "none" | "solid" | "gradient" | undefined;
|
|
77
76
|
color?: string | undefined;
|
|
77
|
+
background?: "none" | "solid" | "gradient" | undefined;
|
|
78
78
|
};
|
|
79
79
|
segments: {
|
|
80
80
|
text: string;
|
|
@@ -86,8 +86,8 @@ declare const CaptionTrackSchema: z.ZodObject<{
|
|
|
86
86
|
style: {
|
|
87
87
|
position: "center" | "bottom" | "top";
|
|
88
88
|
size: "sm" | "md" | "lg" | "xs" | "xl" | "2xl";
|
|
89
|
-
background?: "none" | "solid" | "gradient" | undefined;
|
|
90
89
|
color?: string | undefined;
|
|
90
|
+
background?: "none" | "solid" | "gradient" | undefined;
|
|
91
91
|
};
|
|
92
92
|
segments: {
|
|
93
93
|
text: string;
|
|
@@ -347,11 +347,11 @@ export declare const OverlaySpecSchema: z.ZodObject<{
|
|
|
347
347
|
offsetMs: z.ZodOptional<z.ZodNumber>;
|
|
348
348
|
scale: z.ZodOptional<z.ZodNumber>;
|
|
349
349
|
}, "strip", z.ZodTypeAny, {
|
|
350
|
-
offsetMs?: number | undefined;
|
|
351
350
|
scale?: number | undefined;
|
|
352
|
-
}, {
|
|
353
351
|
offsetMs?: number | undefined;
|
|
352
|
+
}, {
|
|
354
353
|
scale?: number | undefined;
|
|
354
|
+
offsetMs?: number | undefined;
|
|
355
355
|
}>>;
|
|
356
356
|
freezeWhen: z.ZodOptional<z.ZodType<unknown, z.ZodTypeDef, unknown>>;
|
|
357
357
|
}, "strip", z.ZodTypeAny, {
|
|
@@ -360,8 +360,8 @@ export declare const OverlaySpecSchema: z.ZodObject<{
|
|
|
360
360
|
toleranceMs: number;
|
|
361
361
|
onSeek: "recompute";
|
|
362
362
|
transform?: {
|
|
363
|
-
offsetMs?: number | undefined;
|
|
364
363
|
scale?: number | undefined;
|
|
364
|
+
offsetMs?: number | undefined;
|
|
365
365
|
} | undefined;
|
|
366
366
|
freezeWhen?: unknown;
|
|
367
367
|
}, {
|
|
@@ -370,8 +370,8 @@ export declare const OverlaySpecSchema: z.ZodObject<{
|
|
|
370
370
|
toleranceMs: number;
|
|
371
371
|
onSeek: "recompute";
|
|
372
372
|
transform?: {
|
|
373
|
-
offsetMs?: number | undefined;
|
|
374
373
|
scale?: number | undefined;
|
|
374
|
+
offsetMs?: number | undefined;
|
|
375
375
|
} | undefined;
|
|
376
376
|
freezeWhen?: unknown;
|
|
377
377
|
}>;
|
|
@@ -408,20 +408,20 @@ export declare const OverlaySpecSchema: z.ZodObject<{
|
|
|
408
408
|
}, "strip", z.ZodTypeAny, {
|
|
409
409
|
position: "center" | "bottom" | "top";
|
|
410
410
|
size: "sm" | "md" | "lg" | "xs" | "xl" | "2xl";
|
|
411
|
-
background?: "none" | "solid" | "gradient" | undefined;
|
|
412
411
|
color?: string | undefined;
|
|
412
|
+
background?: "none" | "solid" | "gradient" | undefined;
|
|
413
413
|
}, {
|
|
414
414
|
position: "center" | "bottom" | "top";
|
|
415
415
|
size: "sm" | "md" | "lg" | "xs" | "xl" | "2xl";
|
|
416
|
-
background?: "none" | "solid" | "gradient" | undefined;
|
|
417
416
|
color?: string | undefined;
|
|
417
|
+
background?: "none" | "solid" | "gradient" | undefined;
|
|
418
418
|
}>;
|
|
419
419
|
}, "strip", z.ZodTypeAny, {
|
|
420
420
|
style: {
|
|
421
421
|
position: "center" | "bottom" | "top";
|
|
422
422
|
size: "sm" | "md" | "lg" | "xs" | "xl" | "2xl";
|
|
423
|
-
background?: "none" | "solid" | "gradient" | undefined;
|
|
424
423
|
color?: string | undefined;
|
|
424
|
+
background?: "none" | "solid" | "gradient" | undefined;
|
|
425
425
|
};
|
|
426
426
|
segments: {
|
|
427
427
|
text: string;
|
|
@@ -433,8 +433,8 @@ export declare const OverlaySpecSchema: z.ZodObject<{
|
|
|
433
433
|
style: {
|
|
434
434
|
position: "center" | "bottom" | "top";
|
|
435
435
|
size: "sm" | "md" | "lg" | "xs" | "xl" | "2xl";
|
|
436
|
-
background?: "none" | "solid" | "gradient" | undefined;
|
|
437
436
|
color?: string | undefined;
|
|
437
|
+
background?: "none" | "solid" | "gradient" | undefined;
|
|
438
438
|
};
|
|
439
439
|
segments: {
|
|
440
440
|
text: string;
|
|
@@ -636,8 +636,8 @@ export declare const OverlaySpecSchema: z.ZodObject<{
|
|
|
636
636
|
style: {
|
|
637
637
|
position: "center" | "bottom" | "top";
|
|
638
638
|
size: "sm" | "md" | "lg" | "xs" | "xl" | "2xl";
|
|
639
|
-
background?: "none" | "solid" | "gradient" | undefined;
|
|
640
639
|
color?: string | undefined;
|
|
640
|
+
background?: "none" | "solid" | "gradient" | undefined;
|
|
641
641
|
};
|
|
642
642
|
segments: {
|
|
643
643
|
text: string;
|
|
@@ -683,8 +683,8 @@ export declare const OverlaySpecSchema: z.ZodObject<{
|
|
|
683
683
|
style: {
|
|
684
684
|
position: "center" | "bottom" | "top";
|
|
685
685
|
size: "sm" | "md" | "lg" | "xs" | "xl" | "2xl";
|
|
686
|
-
background?: "none" | "solid" | "gradient" | undefined;
|
|
687
686
|
color?: string | undefined;
|
|
687
|
+
background?: "none" | "solid" | "gradient" | undefined;
|
|
688
688
|
};
|
|
689
689
|
segments: {
|
|
690
690
|
text: string;
|
|
@@ -726,8 +726,8 @@ export declare const OverlaySpecSchema: z.ZodObject<{
|
|
|
726
726
|
toleranceMs: number;
|
|
727
727
|
onSeek: "recompute";
|
|
728
728
|
transform?: {
|
|
729
|
-
offsetMs?: number | undefined;
|
|
730
729
|
scale?: number | undefined;
|
|
730
|
+
offsetMs?: number | undefined;
|
|
731
731
|
} | undefined;
|
|
732
732
|
freezeWhen?: unknown;
|
|
733
733
|
};
|
|
@@ -768,8 +768,8 @@ export declare const OverlaySpecSchema: z.ZodObject<{
|
|
|
768
768
|
style: {
|
|
769
769
|
position: "center" | "bottom" | "top";
|
|
770
770
|
size: "sm" | "md" | "lg" | "xs" | "xl" | "2xl";
|
|
771
|
-
background?: "none" | "solid" | "gradient" | undefined;
|
|
772
771
|
color?: string | undefined;
|
|
772
|
+
background?: "none" | "solid" | "gradient" | undefined;
|
|
773
773
|
};
|
|
774
774
|
segments: {
|
|
775
775
|
text: string;
|
|
@@ -805,8 +805,8 @@ export declare const OverlaySpecSchema: z.ZodObject<{
|
|
|
805
805
|
toleranceMs: number;
|
|
806
806
|
onSeek: "recompute";
|
|
807
807
|
transform?: {
|
|
808
|
-
offsetMs?: number | undefined;
|
|
809
808
|
scale?: number | undefined;
|
|
809
|
+
offsetMs?: number | undefined;
|
|
810
810
|
} | undefined;
|
|
811
811
|
freezeWhen?: unknown;
|
|
812
812
|
};
|
|
@@ -847,8 +847,8 @@ export declare const OverlaySpecSchema: z.ZodObject<{
|
|
|
847
847
|
style: {
|
|
848
848
|
position: "center" | "bottom" | "top";
|
|
849
849
|
size: "sm" | "md" | "lg" | "xs" | "xl" | "2xl";
|
|
850
|
-
background?: "none" | "solid" | "gradient" | undefined;
|
|
851
850
|
color?: string | undefined;
|
|
851
|
+
background?: "none" | "solid" | "gradient" | undefined;
|
|
852
852
|
};
|
|
853
853
|
segments: {
|
|
854
854
|
text: string;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@thewhateverapp/tile-sdk",
|
|
3
|
-
"version": "0.13.
|
|
3
|
+
"version": "0.13.35",
|
|
4
4
|
"description": "SDK for building interactive tiles on The Whatever App platform",
|
|
5
5
|
"main": "./dist/index.js",
|
|
6
6
|
"types": "./dist/index.d.ts",
|
|
@@ -59,13 +59,25 @@
|
|
|
59
59
|
"zod": "^3.22.0"
|
|
60
60
|
},
|
|
61
61
|
"peerDependencies": {
|
|
62
|
-
"react": "^18.0.0"
|
|
62
|
+
"react": "^18.0.0",
|
|
63
|
+
"@pixi/react": "^8.0.0",
|
|
64
|
+
"pixi.js": "^8.0.0"
|
|
65
|
+
},
|
|
66
|
+
"peerDependenciesMeta": {
|
|
67
|
+
"@pixi/react": {
|
|
68
|
+
"optional": true
|
|
69
|
+
},
|
|
70
|
+
"pixi.js": {
|
|
71
|
+
"optional": true
|
|
72
|
+
}
|
|
63
73
|
},
|
|
64
74
|
"devDependencies": {
|
|
75
|
+
"@pixi/react": "^8.0.0",
|
|
65
76
|
"@types/node": "^20.0.0",
|
|
66
77
|
"@types/react": "^18.2.48",
|
|
67
78
|
"eslint": "^9.39.1",
|
|
68
79
|
"next": "^14.2.0",
|
|
80
|
+
"pixi.js": "^8.0.0",
|
|
69
81
|
"typescript": "^5.3.3"
|
|
70
82
|
}
|
|
71
83
|
}
|