@tastic/shell 0.6.0 → 0.8.0

package/README.md

@@ -102,6 +102,7 @@ the front of an in-app link, so a route starting with a game id equal to the bas
 | `fonts?` | Fonts the pack's own art needs, loaded behind the splash screen beside the icon font. |
 | `fontFamily?` | The typeface on every Paper text variant. Unset is Paper's own. |
 | `otaVersion` | The version label in Settings. |
+| `useSettingsRules?` | A hook returning what goes first in every Settings dialog, above the shell's rows: the rules of the game it's opened in. Null where there's nothing (Home). |
 | `SettingsSections?` | The pack's own Settings sections, in every Settings dialog, under the shell's rows and any a play screen adds. |
 | `reducers?` | The pack's own store keys (what `SettingsSections` saves), beside the shell's and the games'. Never a key either already mounts. |
 | `StatsSections?` | A section across the pack's games (a calendar of play), first on the stats screen's Stats tab, handed its two filters (`PackStatsSectionsProps`: `profileId`, null for Everyone, and `gameId`, null for All Games). |
@@ -111,7 +112,7 @@ PuckTastic and DuelTastic draw what they always did:
 
 | Field | |
 | --- | --- |
-| `Backdrop?` | A table drawn once behind the whole stack (Solitaire's felt). The stack's two layers go transparent (the screens' `contentStyle` and the navigation theme's `colors.background`, which React Navigation paints around every screen), the root window stays dark so light mode doesn't flash white on a push, Android's push and pop crossfade (its default holds the outgoing screen opaque), and Home, each loadout, the stats screen and Profiles draw transparent, with their buttons and tabs on the theme's surface. |
+| `Backdrop?` | A table drawn once behind the whole stack (Solitaire's felt). The stack's two layers go transparent (the screens' `contentStyle` and the navigation theme's `colors.background`, which React Navigation paints around every screen), the root window stays dark so light mode doesn't flash white on a push, Android's push and pop crossfade (its default holds the outgoing screen opaque), and Home, each loadout, the stats screen and Profiles draw transparent, with their buttons and tabs on the theme's surface (a loadout's Ready buttons too, filled with the seat's color once ready). |
 | `foreground?` | The color of what those screens draw straight on the background (the hero, the corner buttons, headers), and at half strength a loadout's muted options. Unset is black or white with the theme. |
 | `Provider?` | Mounted once around How to Play and the stack, inside the store, the theme, profiles and every game's `Provider` (one stats context across the pack's games). |
 | `useScreenOptions?` | A hook returning stack screen options (`StackScreenOptions`), merged after the shell's own (a status bar style of the pack's own, Reduce Motion's crossfade). The shell's already follow the app's theme, and stay dark over a `Backdrop`. |
@@ -135,8 +136,8 @@ PuckTastic and DuelTastic draw what they always did:
 
 Each game is one object: its `id`, `title`, `blurb` and `icon` (a component drawn in the seats'
 colors, or `imageGameIcon({ light, dark })` for a light and dark pair of pictures), its seat 2
-choices (`seatTwo`: `'cpu'`, `'person'`, `'nobody'`) and whether 2 Player seats its players side by
-side in a wide window (`sideBySideWhenWide`), the store `reducers` it mounts, its root `Provider`, its `useLoadout(mode)`, its
+choices (`seatTwo`: `'cpu'`, `'person'`, `'nobody'`), whether 2 Player seats its players side by side
+at a computer (`sideBySideAtComputer`) and in a wide window (`sideBySideWhenWide`), the store `reducers` it mounts, its root `Provider`, its `useLoadout(mode)`, its
 `PlayScreen`, its `StatsSections` and `AchievementList`, `resetStats`, and its How to Play `guide`.
 See `src/types.ts` for every field.
 
@@ -144,9 +145,9 @@ What a game can leave out or add, each optional, so a two-seat game sets none of
 
 | Field | |
 | --- | --- |
-| no `seatTwo` (nor `sideBySideWhenWide`) | A game for one player: its loadout has no seat 2 button, every round is solo (`useActiveRound` falls back to `'solo'`), and its How to Play describes a solo round. |
+| no `seatTwo` (nor `sideBySideWhenWide`) | A game for one player: its loadout has no opponent button, every round is solo (`useActiveRound` falls back to `'solo'`), and its How to Play describes a solo round. |
 | no `useLoadout` | Nothing to set up first: Home opens its play screen straight away, after its How to Play the first time, and a link to its loadout plays it. Its rule variants go in its play screen's Settings: `<SettingsDialog>` takes `children`. |
-| no `cpuDifficulty` (in `GameLoadout`) | A CPU with no levels: seat 2's menu offers one plain CPU. |
+| no `cpuDifficulty` (in `GameLoadout`) | A CPU with no levels: player 1's opponent menu offers one plain CPU. |
 | `resumable` | A cold launch drops the player back into its play screen if they left the app there rather than backing out of it. The shell remembers only which game (`lastActiveGame`); the game saves and restores its own board. |
 | `Preview` | Drawn on Home in place of the icon (`GamePreviewProps`: `width`, `height`, the seats' colors, `dark`), in a box of `PREVIEW_ASPECT` (360:200), a frame after Home first paints. While any game has one, Home shows tiles: rows upright, and on a wide screen a grid beside the hero and seat 1's button. A game without one keeps its icon. |
 | no `icon` | Only with a `Preview`, which Home draws in its place. |
@@ -205,10 +206,10 @@ screen right now) and `onBack`/`onSettings`, plus `centerLineY` when the line be
 the window's middle.
 
 - **Where:** the window's top corners; 2 Player face to face, the side edges at the line between the
-  players (the top corners are the far player's end); desktop web (a browser window at least
-  `MATCH_CHIPS_DESKTOP_MIN_WIDTH`, 768, wide), the page's top corners always.
+  players (the top corners are the far player's end); at a computer (`useAtComputer`: the web without
+  a touch-first screen), the page's top corners always.
 - **When:** faded out over `MATCH_CHIPS_FADE_MS` (150) and not pressable while `playing`, back the moment
-  it stops; up all match on desktop web.
+  it stops; up all match at a computer.
 - **Look:** a 24 icon in the theme's full contrast on a translucent chip of the page's color.
 
 ## Peer dependencies
@@ -233,7 +234,7 @@ became a package (the lower of the two where they differ).
 | `@rific/feedback-press` | >=0.13.1 | haptic and sound settings, the UI sounds |
 | `@rific/toaster` | >=0.10.1 | toasts (DuelTastic runs 0.12, PuckTastic 0.10) |
 | `@tastic/core` | >=0.15.0 | the seat mode from the window's shape, the root background |
-| `@tastic/hud` | >=0.27.1 | Settings, the stats screen, the loadout's panels (its Skia-free `/lobby` entry, new in 0.26.0; 0.27.1's options for a pack drawn on its own backdrop), How to Play |
+| `@tastic/hud` | >=0.29.0 | Settings, the stats screen, the loadout's panels (its Skia-free `/lobby` entry, new in 0.26.0; 0.27.1's options for a pack drawn on its own backdrop; 0.28.0's Ready pill; 0.29.0's leading Settings sections), How to Play |
 | `@tastic/profile` | >=0.16.2 | profiles, the seat buttons, seat colors |
 | `@tastic/achievements` | >=0.6.0 | `createGameStats`, `forgetProfileAchievements` |
 | `@tastic/split-screen` | >=0.5.5 | the 2 Player loadout's two halves |

package/dist/index.d.mts

@@ -207,6 +207,7 @@ interface GameDefinition {
     Preview?: ComponentType<GamePreviewProps>;
     seatTwo?: readonly SeatTwo[];
     sideBySideWhenWide?: boolean;
+    sideBySideAtComputer?: boolean;
     reducers: Record<string, Reducer>;
     Provider?: ComponentType<{
         children: ReactNode;
@@ -279,6 +280,7 @@ interface PackDefinition {
     fontFamily?: string;
     otaVersion: number;
     SettingsSections?: ComponentType;
+    useSettingsRules?: () => ReactNode;
     reducers?: Record<string, Reducer>;
     StatsSections?: ComponentType<PackStatsSectionsProps>;
     Backdrop?: ComponentType;
@@ -399,17 +401,16 @@ declare function imageGameIcon(images: {
     dark: ImageSourcePropType;
 }): ComponentType<GameIconProps>;
 
-declare const MATCH_CHIPS_DESKTOP_MIN_WIDTH = 768;
 declare const MATCH_CHIPS_FADE_MS = 150;
 interface MatchChipsProps {
     /** Whether play is on right now (a live puck, a shot in flight, a round being ridden). While it is,
      * the chips fade out and can't be pressed, so they never cover play; they come back the moment it
-     * stops (between points, a round's card, Game Over). Ignored on desktop web, where they stay up. */
+     * stops (between points, a round's card, Game Over). Ignored at a computer, where they stay up. */
     playing: boolean;
     /** Two players at opposite ends of one screen right now (2 Player face to face). The chips then sit
      * on the side edges at the line between the players, rather than in the top corners, which are the
-     * far player's end. False for one human (vs CPU, solo) and for side by side. Ignored on desktop
-     * web: both players share one upright screen there. */
+     * far player's end. False for one human (vs CPU, solo) and for side by side. Ignored at a
+     * computer: both players share one upright screen there. */
     faceToFace: boolean;
     /** Where that line between the players is, as a y in the window. Defaults to the window's middle;
      * pass it when the board isn't centered (a band of score above it, say). */
@@ -420,7 +421,8 @@ interface MatchChipsProps {
 /** The back and settings chips over a match, in every game of every pack: one rule for where they sit
  * and when they show. The window's top corners (the same spot as hud's CornerActionButtons on every
  * other screen), except 2 Player face to face, which puts them on the side edges at the line between
- * the players; faded out while play is on, except on desktop web. */
+ * the players; faded out while play is on, except at a computer (useAtComputer: the web without a
+ * touch-first screen), where they stay up in the page's corners. */
 declare function MatchChips({ playing, faceToFace, centerLineY, onBack, onSettings }: MatchChipsProps): react.JSX.Element;
 
 interface SettingsDialogProps {
@@ -441,6 +443,8 @@ declare function useAppSettings(): {
     setSettings: (patch: Partial<AppSettings>) => void;
 };
 
+declare function useAtComputer(): boolean;
+
 declare function useOpponent(): {
     seatTwo: SeatTwo;
     setSeatTwo: (seatTwo: SeatTwo) => void;
@@ -575,5 +579,5 @@ declare function createPlayerSettings<S extends WithControls<C>, C>({ id, defaul
     };
 };
 
-export { DEFAULT_APP_SETTINGS, DEFAULT_OPPONENT, GUEST_PLAYER_ID, HomeScreen, LoadoutRoute, MATCH_CHIPS_DESKTOP_MIN_WIDTH, MATCH_CHIPS_FADE_MS, MatchChips, PREVIEW_ASPECT, PackProvider, PlayRoute, ProfilesProvider, ProfilesRoute, RootLayout, SettingsDialog, StatsScreen, appSettingsActions, reducer$1 as appSettingsReducer, createGameGuideSlice, createGameStats, createPackStore, createPlayerSettings, createSeatColorsReducer, createShellReducers, defaultProfileSelectionState, defaultSeatColorsState, forgetProfileAchievements, humanSeatsFor, imageGameIcon, liveplayActions, reducer$3 as liveplayReducer, onProfileRemoved, opponentActions, reducer$2 as opponentReducer, profileSelectionActions, reducer as profileSelectionReducer, roundModeFor, seatColorsActions, seatPlayerKey, seatTwoFor, useActiveRound, useAppSettings, useGameGuide, useOpponent, usePack, usePackGame, useProfiles, useSeatColors };
+export { DEFAULT_APP_SETTINGS, DEFAULT_OPPONENT, GUEST_PLAYER_ID, HomeScreen, LoadoutRoute, MATCH_CHIPS_FADE_MS, MatchChips, PREVIEW_ASPECT, PackProvider, PlayRoute, ProfilesProvider, ProfilesRoute, RootLayout, SettingsDialog, StatsScreen, appSettingsActions, reducer$1 as appSettingsReducer, createGameGuideSlice, createGameStats, createPackStore, createPlayerSettings, createSeatColorsReducer, createShellReducers, defaultProfileSelectionState, defaultSeatColorsState, forgetProfileAchievements, humanSeatsFor, imageGameIcon, liveplayActions, reducer$3 as liveplayReducer, onProfileRemoved, opponentActions, reducer$2 as opponentReducer, profileSelectionActions, reducer as profileSelectionReducer, roundModeFor, seatColorsActions, seatPlayerKey, seatTwoFor, useActiveRound, useAppSettings, useAtComputer, useGameGuide, useOpponent, usePack, usePackGame, useProfiles, useSeatColors };
 export type { ActiveRound, AppSettings, FeedbackSounds, GameDefinition, GameGuide, GameGuideState, GameIconProps, GameLoadout, GamePreviewProps, GameRulesProps, GuidelessGameDefinition, HeroTitleProps, HomeTab, LiveplaySliceState, LoadoutOptionsProps, MatchChipsProps, OpponentState, PackDefinition, PackGameDefinition, PackGuide, PackStatsReset, PackStatsSectionsProps, PackStatsTab, PackStore, PackStoreConfig, PackStoreSource, PickerAlign, PlayerControlsState, PlayerSettingsState, ProfileSelectionState, RecordResult, RoundMode, Seat, SeatColorsState, SeatControlLook, SeatTwo, SettingsDialogProps, ShellState, StackScreenOptions };

package/dist/index.d.ts

@@ -207,6 +207,7 @@ interface GameDefinition {
     Preview?: ComponentType<GamePreviewProps>;
     seatTwo?: readonly SeatTwo[];
     sideBySideWhenWide?: boolean;
+    sideBySideAtComputer?: boolean;
     reducers: Record<string, Reducer>;
     Provider?: ComponentType<{
         children: ReactNode;
@@ -279,6 +280,7 @@ interface PackDefinition {
     fontFamily?: string;
     otaVersion: number;
     SettingsSections?: ComponentType;
+    useSettingsRules?: () => ReactNode;
     reducers?: Record<string, Reducer>;
     StatsSections?: ComponentType<PackStatsSectionsProps>;
     Backdrop?: ComponentType;
@@ -399,17 +401,16 @@ declare function imageGameIcon(images: {
     dark: ImageSourcePropType;
 }): ComponentType<GameIconProps>;
 
-declare const MATCH_CHIPS_DESKTOP_MIN_WIDTH = 768;
 declare const MATCH_CHIPS_FADE_MS = 150;
 interface MatchChipsProps {
     /** Whether play is on right now (a live puck, a shot in flight, a round being ridden). While it is,
      * the chips fade out and can't be pressed, so they never cover play; they come back the moment it
-     * stops (between points, a round's card, Game Over). Ignored on desktop web, where they stay up. */
+     * stops (between points, a round's card, Game Over). Ignored at a computer, where they stay up. */
     playing: boolean;
     /** Two players at opposite ends of one screen right now (2 Player face to face). The chips then sit
      * on the side edges at the line between the players, rather than in the top corners, which are the
-     * far player's end. False for one human (vs CPU, solo) and for side by side. Ignored on desktop
-     * web: both players share one upright screen there. */
+     * far player's end. False for one human (vs CPU, solo) and for side by side. Ignored at a
+     * computer: both players share one upright screen there. */
     faceToFace: boolean;
     /** Where that line between the players is, as a y in the window. Defaults to the window's middle;
      * pass it when the board isn't centered (a band of score above it, say). */
@@ -420,7 +421,8 @@ interface MatchChipsProps {
 /** The back and settings chips over a match, in every game of every pack: one rule for where they sit
  * and when they show. The window's top corners (the same spot as hud's CornerActionButtons on every
  * other screen), except 2 Player face to face, which puts them on the side edges at the line between
- * the players; faded out while play is on, except on desktop web. */
+ * the players; faded out while play is on, except at a computer (useAtComputer: the web without a
+ * touch-first screen), where they stay up in the page's corners. */
 declare function MatchChips({ playing, faceToFace, centerLineY, onBack, onSettings }: MatchChipsProps): react.JSX.Element;
 
 interface SettingsDialogProps {
@@ -441,6 +443,8 @@ declare function useAppSettings(): {
     setSettings: (patch: Partial<AppSettings>) => void;
 };
 
+declare function useAtComputer(): boolean;
+
 declare function useOpponent(): {
     seatTwo: SeatTwo;
     setSeatTwo: (seatTwo: SeatTwo) => void;
@@ -575,5 +579,5 @@ declare function createPlayerSettings<S extends WithControls<C>, C>({ id, defaul
     };
 };
 
-export { DEFAULT_APP_SETTINGS, DEFAULT_OPPONENT, GUEST_PLAYER_ID, HomeScreen, LoadoutRoute, MATCH_CHIPS_DESKTOP_MIN_WIDTH, MATCH_CHIPS_FADE_MS, MatchChips, PREVIEW_ASPECT, PackProvider, PlayRoute, ProfilesProvider, ProfilesRoute, RootLayout, SettingsDialog, StatsScreen, appSettingsActions, reducer$1 as appSettingsReducer, createGameGuideSlice, createGameStats, createPackStore, createPlayerSettings, createSeatColorsReducer, createShellReducers, defaultProfileSelectionState, defaultSeatColorsState, forgetProfileAchievements, humanSeatsFor, imageGameIcon, liveplayActions, reducer$3 as liveplayReducer, onProfileRemoved, opponentActions, reducer$2 as opponentReducer, profileSelectionActions, reducer as profileSelectionReducer, roundModeFor, seatColorsActions, seatPlayerKey, seatTwoFor, useActiveRound, useAppSettings, useGameGuide, useOpponent, usePack, usePackGame, useProfiles, useSeatColors };
+export { DEFAULT_APP_SETTINGS, DEFAULT_OPPONENT, GUEST_PLAYER_ID, HomeScreen, LoadoutRoute, MATCH_CHIPS_FADE_MS, MatchChips, PREVIEW_ASPECT, PackProvider, PlayRoute, ProfilesProvider, ProfilesRoute, RootLayout, SettingsDialog, StatsScreen, appSettingsActions, reducer$1 as appSettingsReducer, createGameGuideSlice, createGameStats, createPackStore, createPlayerSettings, createSeatColorsReducer, createShellReducers, defaultProfileSelectionState, defaultSeatColorsState, forgetProfileAchievements, humanSeatsFor, imageGameIcon, liveplayActions, reducer$3 as liveplayReducer, onProfileRemoved, opponentActions, reducer$2 as opponentReducer, profileSelectionActions, reducer as profileSelectionReducer, roundModeFor, seatColorsActions, seatPlayerKey, seatTwoFor, useActiveRound, useAppSettings, useAtComputer, useGameGuide, useOpponent, usePack, usePackGame, useProfiles, useSeatColors };
 export type { ActiveRound, AppSettings, FeedbackSounds, GameDefinition, GameGuide, GameGuideState, GameIconProps, GameLoadout, GamePreviewProps, GameRulesProps, GuidelessGameDefinition, HeroTitleProps, HomeTab, LiveplaySliceState, LoadoutOptionsProps, MatchChipsProps, OpponentState, PackDefinition, PackGameDefinition, PackGuide, PackStatsReset, PackStatsSectionsProps, PackStatsTab, PackStore, PackStoreConfig, PackStoreSource, PickerAlign, PlayerControlsState, PlayerSettingsState, ProfileSelectionState, RecordResult, RoundMode, Seat, SeatColorsState, SeatControlLook, SeatTwo, SettingsDialogProps, ShellState, StackScreenOptions };