loading-games 1.0.1 → 2.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +1 -1
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +1 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.js +1 -1
- package/dist/index.js.map +1 -1
- package/dist/react/index.d.cts +131 -3
- package/dist/react/index.d.ts +131 -3
- package/dist/svelte/index.d.ts +130 -3
- package/dist/vue/index.d.cts +131 -3
- package/dist/vue/index.d.ts +131 -3
- package/package.json +1 -1
package/dist/react/index.d.cts
CHANGED
|
@@ -1,6 +1,134 @@
|
|
|
1
1
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
-
|
|
3
|
-
|
|
2
|
+
|
|
3
|
+
/**
|
|
4
|
+
* loading-games — TypeScript Types
|
|
5
|
+
*
|
|
6
|
+
* This file is the single source of truth for all types.
|
|
7
|
+
* Re-export from here in all packages.
|
|
8
|
+
*/
|
|
9
|
+
/** All built-in game identifiers. 'random' selects a different game each time. */
|
|
10
|
+
type GameName = 'snake' | 'brick-breaker' | 'flappy' | '2048' | 'wordle-lite' | 'asteroids' | 'memory-cards' | 'whack-a-mole' | 'random';
|
|
11
|
+
/** Size presets. 'full' creates a full-viewport overlay. */
|
|
12
|
+
type GameSize = 'sm' | 'md' | 'lg' | 'full';
|
|
13
|
+
/** Animation played when loading completes and the game exits. */
|
|
14
|
+
type ExitAnimation = 'fade' | 'slide' | 'none';
|
|
15
|
+
/**
|
|
16
|
+
* Theme color tokens.
|
|
17
|
+
* All fields optional — unset values fall back to CSS variables or system defaults.
|
|
18
|
+
*
|
|
19
|
+
* @example
|
|
20
|
+
* { primary: '#6366F1', background: '#0F0F0F' }
|
|
21
|
+
*/
|
|
22
|
+
interface ThemeObject {
|
|
23
|
+
/** Main accent color — buttons, score, active game elements */
|
|
24
|
+
primary?: string;
|
|
25
|
+
/** Canvas / component background */
|
|
26
|
+
background?: string;
|
|
27
|
+
/** Card and panel surfaces */
|
|
28
|
+
surface?: string;
|
|
29
|
+
/** Primary text (labels, scores, UI) */
|
|
30
|
+
text?: string;
|
|
31
|
+
/** Secondary highlight / accent */
|
|
32
|
+
accent?: string;
|
|
33
|
+
}
|
|
34
|
+
/** Fired on every score change via onScore callback. */
|
|
35
|
+
interface Score {
|
|
36
|
+
game: Exclude<GameName, 'random'>;
|
|
37
|
+
/** Current score in this session */
|
|
38
|
+
current: number;
|
|
39
|
+
/** All-time personal best (from localStorage) */
|
|
40
|
+
personalBest: number;
|
|
41
|
+
/** true if current just exceeded the previous personal best */
|
|
42
|
+
isNewRecord: boolean;
|
|
43
|
+
}
|
|
44
|
+
/** Fired when a game round ends (not when loading ends). */
|
|
45
|
+
interface GameResult {
|
|
46
|
+
game: Exclude<GameName, 'random'>;
|
|
47
|
+
finalScore: number;
|
|
48
|
+
/** How long the game was active in milliseconds */
|
|
49
|
+
duration: number;
|
|
50
|
+
isNewRecord: boolean;
|
|
51
|
+
}
|
|
52
|
+
/**
|
|
53
|
+
* Complete configuration for a LoadingGame instance.
|
|
54
|
+
* All fields optional — sensible defaults apply.
|
|
55
|
+
*
|
|
56
|
+
* @example
|
|
57
|
+
* {
|
|
58
|
+
* game: 'snake',
|
|
59
|
+
* active: isLoading,
|
|
60
|
+
* theme: { primary: '#6366F1', background: '#0F0F0F' },
|
|
61
|
+
* onScore: (s) => console.log(s),
|
|
62
|
+
* }
|
|
63
|
+
*/
|
|
64
|
+
interface LoadingGameOptions {
|
|
65
|
+
/**
|
|
66
|
+
* Which game to render.
|
|
67
|
+
* 'random' selects a different game each activation.
|
|
68
|
+
* @default 'random'
|
|
69
|
+
*/
|
|
70
|
+
game?: GameName;
|
|
71
|
+
/**
|
|
72
|
+
* Controls whether the game is shown.
|
|
73
|
+
* Set to true when loading begins, false when it ends.
|
|
74
|
+
* @default false
|
|
75
|
+
*/
|
|
76
|
+
active?: boolean;
|
|
77
|
+
/**
|
|
78
|
+
* Theme color overrides.
|
|
79
|
+
* Merged with CSS variables and system color scheme.
|
|
80
|
+
*/
|
|
81
|
+
theme?: ThemeObject;
|
|
82
|
+
/**
|
|
83
|
+
* Container size preset.
|
|
84
|
+
* 'full' renders a full-viewport overlay.
|
|
85
|
+
* @default 'md'
|
|
86
|
+
*/
|
|
87
|
+
size?: GameSize;
|
|
88
|
+
/**
|
|
89
|
+
* Milliseconds to wait before showing the game.
|
|
90
|
+
* Prevents a jarring flash for fast loads.
|
|
91
|
+
* If loading completes before delay, game never renders.
|
|
92
|
+
* @default 800
|
|
93
|
+
*/
|
|
94
|
+
delay?: number;
|
|
95
|
+
/**
|
|
96
|
+
* Minimum milliseconds to show the game once it appears.
|
|
97
|
+
* Prevents a confusing half-second flash.
|
|
98
|
+
* @default 0
|
|
99
|
+
*/
|
|
100
|
+
minDisplay?: number;
|
|
101
|
+
/**
|
|
102
|
+
* Animation when the game exits after loading completes.
|
|
103
|
+
* @default 'fade'
|
|
104
|
+
*/
|
|
105
|
+
exitAnimation?: ExitAnimation;
|
|
106
|
+
/**
|
|
107
|
+
* Persist personal bests in localStorage.
|
|
108
|
+
* @default true
|
|
109
|
+
*/
|
|
110
|
+
saveScores?: boolean;
|
|
111
|
+
/**
|
|
112
|
+
* Namespace for score storage.
|
|
113
|
+
* Allows multiple instances to maintain separate leaderboards.
|
|
114
|
+
* @default undefined (global namespace)
|
|
115
|
+
*/
|
|
116
|
+
namespace?: string;
|
|
117
|
+
/** Fires every time the score changes. */
|
|
118
|
+
onScore?: (score: Score) => void;
|
|
119
|
+
/** Fires when a game round ends (game over, not loading end). */
|
|
120
|
+
onGameOver?: (result: GameResult) => void;
|
|
121
|
+
/**
|
|
122
|
+
* Fires when loading completes and the game has fully exited.
|
|
123
|
+
* Use this to trigger post-load UI updates.
|
|
124
|
+
*/
|
|
125
|
+
onComplete?: () => void;
|
|
126
|
+
/**
|
|
127
|
+
* Fires when loading fails.
|
|
128
|
+
* The game exits immediately, without animation.
|
|
129
|
+
*/
|
|
130
|
+
onError?: (err: Error) => void;
|
|
131
|
+
}
|
|
4
132
|
|
|
5
133
|
declare global {
|
|
6
134
|
namespace JSX {
|
|
@@ -30,4 +158,4 @@ interface LoadingGameProps extends LoadingGameOptions {
|
|
|
30
158
|
*/
|
|
31
159
|
declare function LoadingGame({ game, active, theme, size, delay, minDisplay, exitAnimation, saveScores, namespace, onScore, onGameOver, onComplete, onError, className, style, }: LoadingGameProps): react_jsx_runtime.JSX.Element;
|
|
32
160
|
|
|
33
|
-
export { LoadingGame, type LoadingGameProps };
|
|
161
|
+
export { type ExitAnimation, type GameName, type GameResult, type GameSize, LoadingGame, type LoadingGameOptions, type LoadingGameProps, type Score, type ThemeObject };
|
package/dist/react/index.d.ts
CHANGED
|
@@ -1,6 +1,134 @@
|
|
|
1
1
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
-
|
|
3
|
-
|
|
2
|
+
|
|
3
|
+
/**
|
|
4
|
+
* loading-games — TypeScript Types
|
|
5
|
+
*
|
|
6
|
+
* This file is the single source of truth for all types.
|
|
7
|
+
* Re-export from here in all packages.
|
|
8
|
+
*/
|
|
9
|
+
/** All built-in game identifiers. 'random' selects a different game each time. */
|
|
10
|
+
type GameName = 'snake' | 'brick-breaker' | 'flappy' | '2048' | 'wordle-lite' | 'asteroids' | 'memory-cards' | 'whack-a-mole' | 'random';
|
|
11
|
+
/** Size presets. 'full' creates a full-viewport overlay. */
|
|
12
|
+
type GameSize = 'sm' | 'md' | 'lg' | 'full';
|
|
13
|
+
/** Animation played when loading completes and the game exits. */
|
|
14
|
+
type ExitAnimation = 'fade' | 'slide' | 'none';
|
|
15
|
+
/**
|
|
16
|
+
* Theme color tokens.
|
|
17
|
+
* All fields optional — unset values fall back to CSS variables or system defaults.
|
|
18
|
+
*
|
|
19
|
+
* @example
|
|
20
|
+
* { primary: '#6366F1', background: '#0F0F0F' }
|
|
21
|
+
*/
|
|
22
|
+
interface ThemeObject {
|
|
23
|
+
/** Main accent color — buttons, score, active game elements */
|
|
24
|
+
primary?: string;
|
|
25
|
+
/** Canvas / component background */
|
|
26
|
+
background?: string;
|
|
27
|
+
/** Card and panel surfaces */
|
|
28
|
+
surface?: string;
|
|
29
|
+
/** Primary text (labels, scores, UI) */
|
|
30
|
+
text?: string;
|
|
31
|
+
/** Secondary highlight / accent */
|
|
32
|
+
accent?: string;
|
|
33
|
+
}
|
|
34
|
+
/** Fired on every score change via onScore callback. */
|
|
35
|
+
interface Score {
|
|
36
|
+
game: Exclude<GameName, 'random'>;
|
|
37
|
+
/** Current score in this session */
|
|
38
|
+
current: number;
|
|
39
|
+
/** All-time personal best (from localStorage) */
|
|
40
|
+
personalBest: number;
|
|
41
|
+
/** true if current just exceeded the previous personal best */
|
|
42
|
+
isNewRecord: boolean;
|
|
43
|
+
}
|
|
44
|
+
/** Fired when a game round ends (not when loading ends). */
|
|
45
|
+
interface GameResult {
|
|
46
|
+
game: Exclude<GameName, 'random'>;
|
|
47
|
+
finalScore: number;
|
|
48
|
+
/** How long the game was active in milliseconds */
|
|
49
|
+
duration: number;
|
|
50
|
+
isNewRecord: boolean;
|
|
51
|
+
}
|
|
52
|
+
/**
|
|
53
|
+
* Complete configuration for a LoadingGame instance.
|
|
54
|
+
* All fields optional — sensible defaults apply.
|
|
55
|
+
*
|
|
56
|
+
* @example
|
|
57
|
+
* {
|
|
58
|
+
* game: 'snake',
|
|
59
|
+
* active: isLoading,
|
|
60
|
+
* theme: { primary: '#6366F1', background: '#0F0F0F' },
|
|
61
|
+
* onScore: (s) => console.log(s),
|
|
62
|
+
* }
|
|
63
|
+
*/
|
|
64
|
+
interface LoadingGameOptions {
|
|
65
|
+
/**
|
|
66
|
+
* Which game to render.
|
|
67
|
+
* 'random' selects a different game each activation.
|
|
68
|
+
* @default 'random'
|
|
69
|
+
*/
|
|
70
|
+
game?: GameName;
|
|
71
|
+
/**
|
|
72
|
+
* Controls whether the game is shown.
|
|
73
|
+
* Set to true when loading begins, false when it ends.
|
|
74
|
+
* @default false
|
|
75
|
+
*/
|
|
76
|
+
active?: boolean;
|
|
77
|
+
/**
|
|
78
|
+
* Theme color overrides.
|
|
79
|
+
* Merged with CSS variables and system color scheme.
|
|
80
|
+
*/
|
|
81
|
+
theme?: ThemeObject;
|
|
82
|
+
/**
|
|
83
|
+
* Container size preset.
|
|
84
|
+
* 'full' renders a full-viewport overlay.
|
|
85
|
+
* @default 'md'
|
|
86
|
+
*/
|
|
87
|
+
size?: GameSize;
|
|
88
|
+
/**
|
|
89
|
+
* Milliseconds to wait before showing the game.
|
|
90
|
+
* Prevents a jarring flash for fast loads.
|
|
91
|
+
* If loading completes before delay, game never renders.
|
|
92
|
+
* @default 800
|
|
93
|
+
*/
|
|
94
|
+
delay?: number;
|
|
95
|
+
/**
|
|
96
|
+
* Minimum milliseconds to show the game once it appears.
|
|
97
|
+
* Prevents a confusing half-second flash.
|
|
98
|
+
* @default 0
|
|
99
|
+
*/
|
|
100
|
+
minDisplay?: number;
|
|
101
|
+
/**
|
|
102
|
+
* Animation when the game exits after loading completes.
|
|
103
|
+
* @default 'fade'
|
|
104
|
+
*/
|
|
105
|
+
exitAnimation?: ExitAnimation;
|
|
106
|
+
/**
|
|
107
|
+
* Persist personal bests in localStorage.
|
|
108
|
+
* @default true
|
|
109
|
+
*/
|
|
110
|
+
saveScores?: boolean;
|
|
111
|
+
/**
|
|
112
|
+
* Namespace for score storage.
|
|
113
|
+
* Allows multiple instances to maintain separate leaderboards.
|
|
114
|
+
* @default undefined (global namespace)
|
|
115
|
+
*/
|
|
116
|
+
namespace?: string;
|
|
117
|
+
/** Fires every time the score changes. */
|
|
118
|
+
onScore?: (score: Score) => void;
|
|
119
|
+
/** Fires when a game round ends (game over, not loading end). */
|
|
120
|
+
onGameOver?: (result: GameResult) => void;
|
|
121
|
+
/**
|
|
122
|
+
* Fires when loading completes and the game has fully exited.
|
|
123
|
+
* Use this to trigger post-load UI updates.
|
|
124
|
+
*/
|
|
125
|
+
onComplete?: () => void;
|
|
126
|
+
/**
|
|
127
|
+
* Fires when loading fails.
|
|
128
|
+
* The game exits immediately, without animation.
|
|
129
|
+
*/
|
|
130
|
+
onError?: (err: Error) => void;
|
|
131
|
+
}
|
|
4
132
|
|
|
5
133
|
declare global {
|
|
6
134
|
namespace JSX {
|
|
@@ -30,4 +158,4 @@ interface LoadingGameProps extends LoadingGameOptions {
|
|
|
30
158
|
*/
|
|
31
159
|
declare function LoadingGame({ game, active, theme, size, delay, minDisplay, exitAnimation, saveScores, namespace, onScore, onGameOver, onComplete, onError, className, style, }: LoadingGameProps): react_jsx_runtime.JSX.Element;
|
|
32
160
|
|
|
33
|
-
export { LoadingGame, type LoadingGameProps };
|
|
161
|
+
export { type ExitAnimation, type GameName, type GameResult, type GameSize, LoadingGame, type LoadingGameOptions, type LoadingGameProps, type Score, type ThemeObject };
|
package/dist/svelte/index.d.ts
CHANGED
|
@@ -1,5 +1,132 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
/**
|
|
2
|
+
* loading-games — TypeScript Types
|
|
3
|
+
*
|
|
4
|
+
* This file is the single source of truth for all types.
|
|
5
|
+
* Re-export from here in all packages.
|
|
6
|
+
*/
|
|
7
|
+
/** All built-in game identifiers. 'random' selects a different game each time. */
|
|
8
|
+
type GameName = 'snake' | 'brick-breaker' | 'flappy' | '2048' | 'wordle-lite' | 'asteroids' | 'memory-cards' | 'whack-a-mole' | 'random';
|
|
9
|
+
/** Size presets. 'full' creates a full-viewport overlay. */
|
|
10
|
+
type GameSize = 'sm' | 'md' | 'lg' | 'full';
|
|
11
|
+
/** Animation played when loading completes and the game exits. */
|
|
12
|
+
type ExitAnimation = 'fade' | 'slide' | 'none';
|
|
13
|
+
/**
|
|
14
|
+
* Theme color tokens.
|
|
15
|
+
* All fields optional — unset values fall back to CSS variables or system defaults.
|
|
16
|
+
*
|
|
17
|
+
* @example
|
|
18
|
+
* { primary: '#6366F1', background: '#0F0F0F' }
|
|
19
|
+
*/
|
|
20
|
+
interface ThemeObject {
|
|
21
|
+
/** Main accent color — buttons, score, active game elements */
|
|
22
|
+
primary?: string;
|
|
23
|
+
/** Canvas / component background */
|
|
24
|
+
background?: string;
|
|
25
|
+
/** Card and panel surfaces */
|
|
26
|
+
surface?: string;
|
|
27
|
+
/** Primary text (labels, scores, UI) */
|
|
28
|
+
text?: string;
|
|
29
|
+
/** Secondary highlight / accent */
|
|
30
|
+
accent?: string;
|
|
31
|
+
}
|
|
32
|
+
/** Fired on every score change via onScore callback. */
|
|
33
|
+
interface Score {
|
|
34
|
+
game: Exclude<GameName, 'random'>;
|
|
35
|
+
/** Current score in this session */
|
|
36
|
+
current: number;
|
|
37
|
+
/** All-time personal best (from localStorage) */
|
|
38
|
+
personalBest: number;
|
|
39
|
+
/** true if current just exceeded the previous personal best */
|
|
40
|
+
isNewRecord: boolean;
|
|
41
|
+
}
|
|
42
|
+
/** Fired when a game round ends (not when loading ends). */
|
|
43
|
+
interface GameResult {
|
|
44
|
+
game: Exclude<GameName, 'random'>;
|
|
45
|
+
finalScore: number;
|
|
46
|
+
/** How long the game was active in milliseconds */
|
|
47
|
+
duration: number;
|
|
48
|
+
isNewRecord: boolean;
|
|
49
|
+
}
|
|
50
|
+
/**
|
|
51
|
+
* Complete configuration for a LoadingGame instance.
|
|
52
|
+
* All fields optional — sensible defaults apply.
|
|
53
|
+
*
|
|
54
|
+
* @example
|
|
55
|
+
* {
|
|
56
|
+
* game: 'snake',
|
|
57
|
+
* active: isLoading,
|
|
58
|
+
* theme: { primary: '#6366F1', background: '#0F0F0F' },
|
|
59
|
+
* onScore: (s) => console.log(s),
|
|
60
|
+
* }
|
|
61
|
+
*/
|
|
62
|
+
interface LoadingGameOptions {
|
|
63
|
+
/**
|
|
64
|
+
* Which game to render.
|
|
65
|
+
* 'random' selects a different game each activation.
|
|
66
|
+
* @default 'random'
|
|
67
|
+
*/
|
|
68
|
+
game?: GameName;
|
|
69
|
+
/**
|
|
70
|
+
* Controls whether the game is shown.
|
|
71
|
+
* Set to true when loading begins, false when it ends.
|
|
72
|
+
* @default false
|
|
73
|
+
*/
|
|
74
|
+
active?: boolean;
|
|
75
|
+
/**
|
|
76
|
+
* Theme color overrides.
|
|
77
|
+
* Merged with CSS variables and system color scheme.
|
|
78
|
+
*/
|
|
79
|
+
theme?: ThemeObject;
|
|
80
|
+
/**
|
|
81
|
+
* Container size preset.
|
|
82
|
+
* 'full' renders a full-viewport overlay.
|
|
83
|
+
* @default 'md'
|
|
84
|
+
*/
|
|
85
|
+
size?: GameSize;
|
|
86
|
+
/**
|
|
87
|
+
* Milliseconds to wait before showing the game.
|
|
88
|
+
* Prevents a jarring flash for fast loads.
|
|
89
|
+
* If loading completes before delay, game never renders.
|
|
90
|
+
* @default 800
|
|
91
|
+
*/
|
|
92
|
+
delay?: number;
|
|
93
|
+
/**
|
|
94
|
+
* Minimum milliseconds to show the game once it appears.
|
|
95
|
+
* Prevents a confusing half-second flash.
|
|
96
|
+
* @default 0
|
|
97
|
+
*/
|
|
98
|
+
minDisplay?: number;
|
|
99
|
+
/**
|
|
100
|
+
* Animation when the game exits after loading completes.
|
|
101
|
+
* @default 'fade'
|
|
102
|
+
*/
|
|
103
|
+
exitAnimation?: ExitAnimation;
|
|
104
|
+
/**
|
|
105
|
+
* Persist personal bests in localStorage.
|
|
106
|
+
* @default true
|
|
107
|
+
*/
|
|
108
|
+
saveScores?: boolean;
|
|
109
|
+
/**
|
|
110
|
+
* Namespace for score storage.
|
|
111
|
+
* Allows multiple instances to maintain separate leaderboards.
|
|
112
|
+
* @default undefined (global namespace)
|
|
113
|
+
*/
|
|
114
|
+
namespace?: string;
|
|
115
|
+
/** Fires every time the score changes. */
|
|
116
|
+
onScore?: (score: Score) => void;
|
|
117
|
+
/** Fires when a game round ends (game over, not loading end). */
|
|
118
|
+
onGameOver?: (result: GameResult) => void;
|
|
119
|
+
/**
|
|
120
|
+
* Fires when loading completes and the game has fully exited.
|
|
121
|
+
* Use this to trigger post-load UI updates.
|
|
122
|
+
*/
|
|
123
|
+
onComplete?: () => void;
|
|
124
|
+
/**
|
|
125
|
+
* Fires when loading fails.
|
|
126
|
+
* The game exits immediately, without animation.
|
|
127
|
+
*/
|
|
128
|
+
onError?: (err: Error) => void;
|
|
129
|
+
}
|
|
3
130
|
|
|
4
131
|
/**
|
|
5
132
|
* Svelte wrapper for loading-games
|
|
@@ -85,4 +212,4 @@ interface LoadingGameInstance {
|
|
|
85
212
|
*/
|
|
86
213
|
declare function createLoadingGame(container: HTMLElement, options?: LoadingGameActionOptions): LoadingGameInstance;
|
|
87
214
|
|
|
88
|
-
export { type LoadingGameActionOptions, type LoadingGameInstance, createLoadingGame, loadingGame };
|
|
215
|
+
export { type ExitAnimation, type GameName, type GameResult, type GameSize, type LoadingGameActionOptions, type LoadingGameInstance, type LoadingGameOptions, type Score, type ThemeObject, createLoadingGame, loadingGame };
|
package/dist/vue/index.d.cts
CHANGED
|
@@ -1,7 +1,135 @@
|
|
|
1
1
|
import * as vue from 'vue';
|
|
2
2
|
import { Ref } from 'vue';
|
|
3
|
-
|
|
4
|
-
|
|
3
|
+
|
|
4
|
+
/**
|
|
5
|
+
* loading-games — TypeScript Types
|
|
6
|
+
*
|
|
7
|
+
* This file is the single source of truth for all types.
|
|
8
|
+
* Re-export from here in all packages.
|
|
9
|
+
*/
|
|
10
|
+
/** All built-in game identifiers. 'random' selects a different game each time. */
|
|
11
|
+
type GameName = 'snake' | 'brick-breaker' | 'flappy' | '2048' | 'wordle-lite' | 'asteroids' | 'memory-cards' | 'whack-a-mole' | 'random';
|
|
12
|
+
/** Size presets. 'full' creates a full-viewport overlay. */
|
|
13
|
+
type GameSize = 'sm' | 'md' | 'lg' | 'full';
|
|
14
|
+
/** Animation played when loading completes and the game exits. */
|
|
15
|
+
type ExitAnimation = 'fade' | 'slide' | 'none';
|
|
16
|
+
/**
|
|
17
|
+
* Theme color tokens.
|
|
18
|
+
* All fields optional — unset values fall back to CSS variables or system defaults.
|
|
19
|
+
*
|
|
20
|
+
* @example
|
|
21
|
+
* { primary: '#6366F1', background: '#0F0F0F' }
|
|
22
|
+
*/
|
|
23
|
+
interface ThemeObject {
|
|
24
|
+
/** Main accent color — buttons, score, active game elements */
|
|
25
|
+
primary?: string;
|
|
26
|
+
/** Canvas / component background */
|
|
27
|
+
background?: string;
|
|
28
|
+
/** Card and panel surfaces */
|
|
29
|
+
surface?: string;
|
|
30
|
+
/** Primary text (labels, scores, UI) */
|
|
31
|
+
text?: string;
|
|
32
|
+
/** Secondary highlight / accent */
|
|
33
|
+
accent?: string;
|
|
34
|
+
}
|
|
35
|
+
/** Fired on every score change via onScore callback. */
|
|
36
|
+
interface Score {
|
|
37
|
+
game: Exclude<GameName, 'random'>;
|
|
38
|
+
/** Current score in this session */
|
|
39
|
+
current: number;
|
|
40
|
+
/** All-time personal best (from localStorage) */
|
|
41
|
+
personalBest: number;
|
|
42
|
+
/** true if current just exceeded the previous personal best */
|
|
43
|
+
isNewRecord: boolean;
|
|
44
|
+
}
|
|
45
|
+
/** Fired when a game round ends (not when loading ends). */
|
|
46
|
+
interface GameResult {
|
|
47
|
+
game: Exclude<GameName, 'random'>;
|
|
48
|
+
finalScore: number;
|
|
49
|
+
/** How long the game was active in milliseconds */
|
|
50
|
+
duration: number;
|
|
51
|
+
isNewRecord: boolean;
|
|
52
|
+
}
|
|
53
|
+
/**
|
|
54
|
+
* Complete configuration for a LoadingGame instance.
|
|
55
|
+
* All fields optional — sensible defaults apply.
|
|
56
|
+
*
|
|
57
|
+
* @example
|
|
58
|
+
* {
|
|
59
|
+
* game: 'snake',
|
|
60
|
+
* active: isLoading,
|
|
61
|
+
* theme: { primary: '#6366F1', background: '#0F0F0F' },
|
|
62
|
+
* onScore: (s) => console.log(s),
|
|
63
|
+
* }
|
|
64
|
+
*/
|
|
65
|
+
interface LoadingGameOptions {
|
|
66
|
+
/**
|
|
67
|
+
* Which game to render.
|
|
68
|
+
* 'random' selects a different game each activation.
|
|
69
|
+
* @default 'random'
|
|
70
|
+
*/
|
|
71
|
+
game?: GameName;
|
|
72
|
+
/**
|
|
73
|
+
* Controls whether the game is shown.
|
|
74
|
+
* Set to true when loading begins, false when it ends.
|
|
75
|
+
* @default false
|
|
76
|
+
*/
|
|
77
|
+
active?: boolean;
|
|
78
|
+
/**
|
|
79
|
+
* Theme color overrides.
|
|
80
|
+
* Merged with CSS variables and system color scheme.
|
|
81
|
+
*/
|
|
82
|
+
theme?: ThemeObject;
|
|
83
|
+
/**
|
|
84
|
+
* Container size preset.
|
|
85
|
+
* 'full' renders a full-viewport overlay.
|
|
86
|
+
* @default 'md'
|
|
87
|
+
*/
|
|
88
|
+
size?: GameSize;
|
|
89
|
+
/**
|
|
90
|
+
* Milliseconds to wait before showing the game.
|
|
91
|
+
* Prevents a jarring flash for fast loads.
|
|
92
|
+
* If loading completes before delay, game never renders.
|
|
93
|
+
* @default 800
|
|
94
|
+
*/
|
|
95
|
+
delay?: number;
|
|
96
|
+
/**
|
|
97
|
+
* Minimum milliseconds to show the game once it appears.
|
|
98
|
+
* Prevents a confusing half-second flash.
|
|
99
|
+
* @default 0
|
|
100
|
+
*/
|
|
101
|
+
minDisplay?: number;
|
|
102
|
+
/**
|
|
103
|
+
* Animation when the game exits after loading completes.
|
|
104
|
+
* @default 'fade'
|
|
105
|
+
*/
|
|
106
|
+
exitAnimation?: ExitAnimation;
|
|
107
|
+
/**
|
|
108
|
+
* Persist personal bests in localStorage.
|
|
109
|
+
* @default true
|
|
110
|
+
*/
|
|
111
|
+
saveScores?: boolean;
|
|
112
|
+
/**
|
|
113
|
+
* Namespace for score storage.
|
|
114
|
+
* Allows multiple instances to maintain separate leaderboards.
|
|
115
|
+
* @default undefined (global namespace)
|
|
116
|
+
*/
|
|
117
|
+
namespace?: string;
|
|
118
|
+
/** Fires every time the score changes. */
|
|
119
|
+
onScore?: (score: Score) => void;
|
|
120
|
+
/** Fires when a game round ends (game over, not loading end). */
|
|
121
|
+
onGameOver?: (result: GameResult) => void;
|
|
122
|
+
/**
|
|
123
|
+
* Fires when loading completes and the game has fully exited.
|
|
124
|
+
* Use this to trigger post-load UI updates.
|
|
125
|
+
*/
|
|
126
|
+
onComplete?: () => void;
|
|
127
|
+
/**
|
|
128
|
+
* Fires when loading fails.
|
|
129
|
+
* The game exits immediately, without animation.
|
|
130
|
+
*/
|
|
131
|
+
onError?: (err: Error) => void;
|
|
132
|
+
}
|
|
5
133
|
|
|
6
134
|
/**
|
|
7
135
|
* useLoadingGame — Vue 3 composable for programmatic control
|
|
@@ -154,4 +282,4 @@ declare const LoadingGame: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
|
154
282
|
namespace: string;
|
|
155
283
|
}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
|
|
156
284
|
|
|
157
|
-
export { LoadingGame, type UseLoadingGameOptions, type UseLoadingGameReturn, LoadingGame as default, useLoadingGame };
|
|
285
|
+
export { type ExitAnimation, type GameName, type GameResult, type GameSize, LoadingGame, type LoadingGameOptions, type Score, type ThemeObject, type UseLoadingGameOptions, type UseLoadingGameReturn, LoadingGame as default, useLoadingGame };
|