@tastic/shell 0.7.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). |
@@ -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

@@ -280,6 +280,7 @@ interface PackDefinition {
     fontFamily?: string;
     otaVersion: number;
     SettingsSections?: ComponentType;
+    useSettingsRules?: () => ReactNode;
     reducers?: Record<string, Reducer>;
     StatsSections?: ComponentType<PackStatsSectionsProps>;
     Backdrop?: ComponentType;

package/dist/index.d.ts

@@ -280,6 +280,7 @@ interface PackDefinition {
     fontFamily?: string;
     otaVersion: number;
     SettingsSections?: ComponentType;
+    useSettingsRules?: () => ReactNode;
     reducers?: Record<string, Reducer>;
     StatsSections?: ComponentType<PackStatsSectionsProps>;
     Backdrop?: ComponentType;

package/dist/index.js

@@ -635,12 +635,14 @@ function useAppSettings() {
 
 // src/components/SettingsDialog.tsx
 var import_jsx_runtime11 = require("react/jsx-runtime");
+var noSettingsRules = () => null;
 function SettingsDialog({ visible, onDismiss, onShowHowToPlay, children }) {
   const onUpdateError = (0, import_toaster3.useUpdateErrorToast)();
   const { settings, setSettings } = useAppSettings();
-  const { otaVersion, SettingsSections, edgeGuard = true } = usePack();
+  const { otaVersion, SettingsSections, edgeGuard = true, useSettingsRules = noSettingsRules } = usePack();
+  const rules = useSettingsRules();
   const edgeGuardProps = edgeGuard ? { deferBottomEdgeGestures: settings.deferBottomEdgeGestures, onDeferBottomEdgeGestures: (value) => setSettings({ deferBottomEdgeGestures: value }) } : {};
-  return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_chrome3.BaseSettingsDialog, { visible, onDismiss, version: otaVersion, ...edgeGuardProps, onUpdateError, onShowHowToPlay, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_chrome3.BaseSettingsDialog, { visible, onDismiss, version: otaVersion, ...edgeGuardProps, onUpdateError, onShowHowToPlay, leading: rules, children: [
     children,
     SettingsSections && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(SettingsSections, {})
   ] });

package/dist/index.mjs

@@ -558,12 +558,14 @@ function useAppSettings() {
 
 // src/components/SettingsDialog.tsx
 import { jsx as jsx11, jsxs as jsxs3 } from "react/jsx-runtime";
+var noSettingsRules = () => null;
 function SettingsDialog({ visible, onDismiss, onShowHowToPlay, children }) {
   const onUpdateError = useUpdateErrorToast2();
   const { settings, setSettings } = useAppSettings();
-  const { otaVersion, SettingsSections, edgeGuard = true } = usePack();
+  const { otaVersion, SettingsSections, edgeGuard = true, useSettingsRules = noSettingsRules } = usePack();
+  const rules = useSettingsRules();
   const edgeGuardProps = edgeGuard ? { deferBottomEdgeGestures: settings.deferBottomEdgeGestures, onDeferBottomEdgeGestures: (value) => setSettings({ deferBottomEdgeGestures: value }) } : {};
-  return /* @__PURE__ */ jsxs3(BaseSettingsDialog, { visible, onDismiss, version: otaVersion, ...edgeGuardProps, onUpdateError, onShowHowToPlay, children: [
+  return /* @__PURE__ */ jsxs3(BaseSettingsDialog, { visible, onDismiss, version: otaVersion, ...edgeGuardProps, onUpdateError, onShowHowToPlay, leading: rules, children: [
     children,
     SettingsSections && /* @__PURE__ */ jsx11(SettingsSections, {})
   ] });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tastic/shell",
-  "version": "0.7.0",
+  "version": "0.8.0",
   "description": "The app around a pack of React Native games, two-seat or for one player: Home, the loadout, the stats screen, Profiles and Settings, the pack's Redux store and its root providers, driven by one PackDefinition",
   "keywords": [
     "react-native",
@@ -70,7 +70,7 @@
     "@expo/vector-icons": "^15.1.1",
     "@infinitetoken/eslint-config": "^0.2.1",
     "@infinitetoken/jest-config": "^0.5.2",
-    "@infinitetoken/tsconfig": "^0.6.0",
+    "@infinitetoken/tsconfig": "^0.7.0",
     "@react-native-async-storage/async-storage": "2.2.0",
     "@react-native-masked-view/masked-view": "0.3.2",
     "@react-native/jest-preset": "^0.88.0",
@@ -86,7 +86,7 @@
     "@tastic/achievements": "^0.6.0",
     "@tastic/core": "^0.16.0",
     "@tastic/edge-guard": "^0.1.5",
-    "@tastic/hud": "^0.28.0",
+    "@tastic/hud": "^0.29.0",
     "@tastic/profile": "^0.18.0",
     "@tastic/split-screen": "^0.5.5",
     "@testing-library/react-native": "^14.1.0",
@@ -137,7 +137,7 @@
     "@tastic/achievements": ">=0.6.0",
     "@tastic/core": ">=0.16.0",
     "@tastic/edge-guard": ">=0.1.5",
-    "@tastic/hud": ">=0.28.0",
+    "@tastic/hud": ">=0.29.0",
     "@tastic/profile": ">=0.18.0",
     "@tastic/split-screen": ">=0.5.5",
     "expo-blur": ">=58.0.4",

package/src/components/SettingsDialog.tsx

@@ -17,20 +17,25 @@ export interface SettingsDialogProps {
   children?: ReactNode
 }
 
+// A pack without rules to put first (PackDefinition.useSettingsRules).
+const noSettingsRules = () => null
+
 // The pack-wide Settings dialog: everything the shell puts in it applies to every game (Edge Guard,
 // theme, sound, haptics, Keep Awake), so it reads and writes the app
-// settings itself. Under those, a play screen's own rows and then the pack's own sections
+// settings itself. Above those, the rules of the game it's opened in (PackDefinition.useSettingsRules);
+// under them, a play screen's own rows and then the pack's own sections
 // (PackDefinition.SettingsSections), in every Settings dialog the pack opens. A pack with edgeGuard
 // false gets no Edge Guard row: hud draws it on iOS whenever its props are passed.
 export function SettingsDialog({ visible, onDismiss, onShowHowToPlay, children }: SettingsDialogProps) {
   const onUpdateError = useUpdateErrorToast()
   const { settings, setSettings } = useAppSettings()
   // The pack's otaVersion (src/constants/release.ts, which the OTA tooling bumps).
-  const { otaVersion, SettingsSections, edgeGuard = true } = usePack()
+  const { otaVersion, SettingsSections, edgeGuard = true, useSettingsRules = noSettingsRules } = usePack()
+  const rules = useSettingsRules()
   const edgeGuardProps = edgeGuard ? { deferBottomEdgeGestures: settings.deferBottomEdgeGestures, onDeferBottomEdgeGestures: (value: boolean) => setSettings({ deferBottomEdgeGestures: value }) } : {}
 
   return (
-    <BaseSettingsDialog visible={visible} onDismiss={onDismiss} version={otaVersion} {...edgeGuardProps} onUpdateError={onUpdateError} onShowHowToPlay={onShowHowToPlay}>
+    <BaseSettingsDialog visible={visible} onDismiss={onDismiss} version={otaVersion} {...edgeGuardProps} onUpdateError={onUpdateError} onShowHowToPlay={onShowHowToPlay} leading={rules}>
       {children}
       {SettingsSections && <SettingsSections />}
     </BaseSettingsDialog>

package/src/types.ts

@@ -292,6 +292,11 @@ export interface PackDefinition {
   // The pack's own Settings sections (how cards look, how play is helped along), in every Settings
   // dialog under the shell's own rows and any a play screen adds. Their values live in `reducers`.
   SettingsSections?: ComponentType
+  // What goes FIRST in every Settings dialog the pack opens, above the shell's own rows: the rules of
+  // the game the dialog is opened in (Solitaire finds it from the route), which someone opening
+  // Settings from a game is most likely there for. Null where there is nothing to put first (Home), and
+  // the dialog is then as it was. A hook, called on every render of the dialog.
+  useSettingsRules?: () => ReactNode
   // Store keys of the pack's own, beside the shell's and each game's (GameDefinition.reducers): what
   // SettingsSections saves, or anything else that belongs to every game. Never a key the shell or a
   // game already mounts.