@freegamestore/games 0.6.0 → 0.7.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/GameTopbar.d.ts +7 -1
- package/dist/GameTopbar.d.ts.map +1 -1
- package/dist/GameTopbar.js +74 -18
- package/dist/GameTopbar.js.map +1 -1
- package/package.json +1 -1
package/dist/GameTopbar.d.ts
CHANGED
|
@@ -31,6 +31,12 @@ export interface GameTopbarProps {
|
|
|
31
31
|
* surface, not a settings menu.
|
|
32
32
|
*/
|
|
33
33
|
actions?: ReactNode;
|
|
34
|
+
/**
|
|
35
|
+
* Game rules/instructions. When provided, an ℹ info icon appears in the
|
|
36
|
+
* topbar. Tapping it opens a fullscreen overlay with the rules content.
|
|
37
|
+
* Every game should populate this so players know how to play.
|
|
38
|
+
*/
|
|
39
|
+
rules?: ReactNode;
|
|
34
40
|
}
|
|
35
41
|
/**
|
|
36
42
|
* The single allowed topbar shape for FreeGameStore games. Brand
|
|
@@ -39,5 +45,5 @@ export interface GameTopbarProps {
|
|
|
39
45
|
*
|
|
40
46
|
* Use inside <GameShell topbar={<GameTopbar … />}>.
|
|
41
47
|
*/
|
|
42
|
-
export declare function GameTopbar({ title, score, stats, actions }: GameTopbarProps): React.JSX.Element;
|
|
48
|
+
export declare function GameTopbar({ title, score, stats, actions, rules }: GameTopbarProps): React.JSX.Element;
|
|
43
49
|
//# sourceMappingURL=GameTopbar.d.ts.map
|
package/dist/GameTopbar.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"GameTopbar.d.ts","sourceRoot":"","sources":["../src/GameTopbar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"GameTopbar.d.ts","sourceRoot":"","sources":["../src/GameTopbar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAEpC,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,MAAM,WAAW,cAAc;IAC7B,6DAA6D;IAC7D,KAAK,EAAE,MAAM,CAAC;IACd,mDAAmD;IACnD,KAAK,EAAE,SAAS,CAAC;IACjB;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED,MAAM,WAAW,eAAe;IAC9B,6DAA6D;IAC7D,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;OAGG;IACH,KAAK,CAAC,EAAE,cAAc,EAAE,CAAC;IAEzB;;;;OAIG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IAEpB;;;;OAIG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB;AAED;;;;;;GAMG;AACH,wBAAgB,UAAU,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,eAAe,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAiFtG"}
|
package/dist/GameTopbar.js
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
|
+
import { useState } from 'react';
|
|
2
3
|
/**
|
|
3
4
|
* The single allowed topbar shape for FreeGameStore games. Brand
|
|
4
5
|
* consistency: same font, same paddings, same color tokens, same stat
|
|
@@ -6,30 +7,85 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
6
7
|
*
|
|
7
8
|
* Use inside <GameShell topbar={<GameTopbar … />}>.
|
|
8
9
|
*/
|
|
9
|
-
export function GameTopbar({ title, score, stats, actions }) {
|
|
10
|
-
|
|
11
|
-
// from `score` if provided.
|
|
10
|
+
export function GameTopbar({ title, score, stats, actions, rules }) {
|
|
11
|
+
const [showRules, setShowRules] = useState(false);
|
|
12
12
|
const resolvedStats = stats && stats.length > 0
|
|
13
13
|
? stats
|
|
14
14
|
: score !== undefined
|
|
15
15
|
? [{ label: 'Score', value: score, accent: true }]
|
|
16
16
|
: [];
|
|
17
|
+
return (_jsxs(_Fragment, { children: [_jsxs("div", { style: {
|
|
18
|
+
display: 'flex',
|
|
19
|
+
alignItems: 'center',
|
|
20
|
+
justifyContent: 'space-between',
|
|
21
|
+
gap: '0.75rem',
|
|
22
|
+
padding: '0.25rem 0.75rem',
|
|
23
|
+
height: '2rem',
|
|
24
|
+
}, children: [_jsxs("div", { style: { display: 'flex', alignItems: 'center', gap: '0.5rem', minWidth: 0 }, children: [rules !== undefined && (_jsx("button", { onClick: () => setShowRules(true), style: {
|
|
25
|
+
background: 'none',
|
|
26
|
+
border: 'none',
|
|
27
|
+
cursor: 'pointer',
|
|
28
|
+
padding: 0,
|
|
29
|
+
minWidth: '2.75rem',
|
|
30
|
+
minHeight: '2.75rem',
|
|
31
|
+
display: 'flex',
|
|
32
|
+
alignItems: 'center',
|
|
33
|
+
justifyContent: 'center',
|
|
34
|
+
color: 'var(--muted, #999)',
|
|
35
|
+
fontSize: '1rem',
|
|
36
|
+
lineHeight: 1,
|
|
37
|
+
WebkitTapHighlightColor: 'transparent',
|
|
38
|
+
}, "aria-label": "Game rules", children: _jsxs("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", children: [_jsx("circle", { cx: "8", cy: "8", r: "6.5" }), _jsx("path", { d: "M8 11.5v0M8 5v4" })] }) })), title !== undefined && (_jsx("span", { style: {
|
|
39
|
+
fontFamily: '"Manrope", system-ui, sans-serif',
|
|
40
|
+
fontWeight: 600,
|
|
41
|
+
fontSize: '0.8rem',
|
|
42
|
+
letterSpacing: '-0.01em',
|
|
43
|
+
whiteSpace: 'nowrap',
|
|
44
|
+
overflow: 'hidden',
|
|
45
|
+
textOverflow: 'ellipsis',
|
|
46
|
+
}, children: title }))] }), _jsxs("div", { style: { display: 'flex', alignItems: 'center', gap: '0.75rem' }, children: [resolvedStats.map((s) => (_jsx(Stat, { stat: s }, s.label))), actions !== undefined && (_jsx("div", { style: { display: 'flex', gap: '0.4rem', alignItems: 'center' }, children: actions }))] })] }), showRules && rules !== undefined && (_jsx(RulesOverlay, { onClose: () => setShowRules(false), children: rules }))] }));
|
|
47
|
+
}
|
|
48
|
+
function RulesOverlay({ children, onClose }) {
|
|
17
49
|
return (_jsxs("div", { style: {
|
|
50
|
+
position: 'fixed',
|
|
51
|
+
inset: 0,
|
|
52
|
+
zIndex: 9999,
|
|
53
|
+
background: 'var(--paper, #0f0f0f)',
|
|
54
|
+
color: 'var(--ink, #f0f0f0)',
|
|
18
55
|
display: 'flex',
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
56
|
+
flexDirection: 'column',
|
|
57
|
+
overflow: 'hidden',
|
|
58
|
+
}, children: [_jsxs("div", { style: {
|
|
59
|
+
display: 'flex',
|
|
60
|
+
alignItems: 'center',
|
|
61
|
+
justifyContent: 'space-between',
|
|
62
|
+
padding: '0.5rem 0.75rem',
|
|
63
|
+
borderBottom: '1px solid var(--line, #2a2a2a)',
|
|
64
|
+
flexShrink: 0,
|
|
65
|
+
}, children: [_jsx("span", { style: {
|
|
66
|
+
fontFamily: '"Manrope", system-ui, sans-serif',
|
|
67
|
+
fontWeight: 700,
|
|
68
|
+
fontSize: '0.9rem',
|
|
69
|
+
}, children: "How to Play" }), _jsx("button", { onClick: onClose, style: {
|
|
70
|
+
background: 'none',
|
|
71
|
+
border: 'none',
|
|
72
|
+
cursor: 'pointer',
|
|
73
|
+
color: 'var(--muted, #999)',
|
|
74
|
+
fontSize: '1.2rem',
|
|
75
|
+
minWidth: '2.75rem',
|
|
76
|
+
minHeight: '2.75rem',
|
|
77
|
+
display: 'flex',
|
|
78
|
+
alignItems: 'center',
|
|
79
|
+
justifyContent: 'center',
|
|
80
|
+
WebkitTapHighlightColor: 'transparent',
|
|
81
|
+
}, "aria-label": "Close rules", children: "\u00D7" })] }), _jsx("div", { style: {
|
|
82
|
+
flex: 1,
|
|
83
|
+
overflowY: 'auto',
|
|
84
|
+
padding: '1rem',
|
|
85
|
+
fontFamily: '"Manrope", system-ui, sans-serif',
|
|
86
|
+
fontSize: '0.9rem',
|
|
87
|
+
lineHeight: 1.6,
|
|
88
|
+
}, children: children })] }));
|
|
33
89
|
}
|
|
34
90
|
function Stat({ stat }) {
|
|
35
91
|
return (_jsxs("div", { style: { textAlign: 'right', lineHeight: 1.05 }, children: [_jsx("div", { style: {
|
package/dist/GameTopbar.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"GameTopbar.js","sourceRoot":"","sources":["../src/GameTopbar.tsx"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"GameTopbar.js","sourceRoot":"","sources":["../src/GameTopbar.tsx"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED