@react-text-game/ui 0.2.0 → 0.2.2

package/README.md

@@ -2,12 +2,61 @@
 
 UI components library for react-text-game built with React 19, TypeScript, and Tailwind CSS v4.
 
+> Install this package inside your own React project. It depends on `@react-text-game/core` for game state and Tailwind CSS v4 for styling tokens.
+
 ## Installation
 
+### 1. Install and configure Tailwind CSS
+
+Follow the official Tailwind installation guide for your stack: [tailwindcss.com/docs/installation](https://tailwindcss.com/docs/installation).
+
+### 2. Add react-text-game packages
+
 ```bash
-bun install
+# Bun (repo default)
+bun add @react-text-game/core @react-text-game/ui
+
+# npm
+npm install @react-text-game/core @react-text-game/ui
+
+# yarn
+yarn add @react-text-game/core @react-text-game/ui
+```
+
+### 3. Import the UI theme tokens
+
+Import the shared styles once in your global stylesheet (for example `src/index.css`, `src/main.css`, or whichever file you feed into your bundler):
+
+```css
+@import "@react-text-game/ui/styles";
+
+@theme {
+  --color-primary-500: oklch(0.65 0.25 265); /* optional override */
+}
 ```
 
+### Minimal implementation
+
+Once Tailwind is wired up and packages are installed, the lightest viable setup only needs two pieces:
+
+1. Wrap your React tree with `GameProvider` and pass the core engine options.
+2. Render `PassageController` somewhere inside the provider.
+
+```tsx
+// src/App.tsx
+import { GameProvider, PassageController } from '@react-text-game/ui';
+
+export function App() {
+  return (
+    <GameProvider options={{ gameName: 'My Text Adventure', isDevMode: true }}>
+      <PassageController />
+    </GameProvider>
+  );
+}
+```
+
+With those two components in place, the UI handles menus, passage rendering, and save/load modals. You can immediately start defining entities and passages through `@react-text-game/core`.
+
 ## Development
 
 ```bash
@@ -29,16 +78,19 @@ All components use semantic color names (like `primary`, `secondary`, `success`,
 ### Available Semantic Colors
 
 #### Brand Colors
+
 - `primary-*` (50-950) - Main brand color
 - `secondary-*` (50-950) - Secondary brand color
 
 #### Semantic State Colors
+
 - `success-*` (50-950) - Success states
 - `warning-*` (50-950) - Warning states
 - `danger-*` (50-950) - Error/danger states
 - `info-*` (50-950) - Informational states
 
 #### Neutral/UI Colors
+
 - `muted-*` (50-950) - Muted/subtle UI elements
 - `background` - Main background color
 - `foreground` - Main text color
@@ -127,7 +179,7 @@ You can override any theme color in your application's CSS file:
 }
 ```
 
-2. **Import components** in your React code:
+1. **Import components** in your React code:
 
 ```tsx
 import { Button, MainMenu, StoryComponent } from '@react-text-game/ui';
@@ -173,6 +225,7 @@ function App() {
 ```
 
 **Available component overrides:**
+
 - `MainMenu` - Main game menu
 - `story.Heading` - Story passage heading
 - `story.Text` - Story text content
@@ -186,11 +239,13 @@ Any components not specified will use the default implementation.
 ### Color Format: oklch()
 
 This package uses the `oklch()` color format from Tailwind CSS v4, which provides:
+
 - **Perceptually uniform** colors
 - **Better dark mode** transitions
 - **Predictable lightness** control
 
 Format: `oklch(lightness chroma hue)`
+
 - `lightness`: 0-1 (0 = black, 1 = white)
 - `chroma`: 0-0.4 (saturation intensity)
 - `hue`: 0-360 (color angle)
@@ -225,6 +280,7 @@ Components also accept `className` props for additional styling:
 This package uses **global CSS variables** (like `--color-primary-500`, `--color-background`, etc.) that may conflict with other design systems if you're mixing multiple component libraries.
 
 **Example conflict:**
+
 ```css
 /* Both systems try to define the same variables */
 @import "@react-text-game/ui/styles";  /* Uses --color-primary-500 */
@@ -267,6 +323,7 @@ function App() {
 ```
 
 Then create scoped overrides:
+
 ```css
 /* app.css */
 @import "@react-text-game/ui/styles";
@@ -308,6 +365,7 @@ If you need fine-grained control, manually remap variables:
 ```
 
 Then create wrapper components:
+
 ```tsx
 // CustomButton.tsx
 import { Button as RTGButton } from '@react-text-game/ui';
@@ -333,6 +391,7 @@ export const GameButton = (props) => (
 ## Components
 
 ### Core Components
+
 - `Button` - Customizable button with multiple variants (solid, faded, bordered, light, flat, ghost, shadow)
 - `Spinner` - Loading spinner
 - `GameProvider` - Main game wrapper with dev tools
@@ -344,6 +403,7 @@ export const GameButton = (props) => (
 - `Tooltip` - Tooltip component
 
 ### Story Components (Overridable)
+
 - `Heading` - Story passage heading (formerly `Header`)
 - `Text` - Story text content
 - `Image` - Story images
@@ -352,6 +412,7 @@ export const GameButton = (props) => (
 - `Conversation` - Story conversation dialogs
 
 ### Hooks & Context
+
 - `useSaveLoadMenu` - Hook to control save/load modal (exported from main package)
 
 ## License

package/dist/components/ErrorBoundary/index.d.ts

@@ -1,2 +1,3 @@
 export * from './ErrorBoundary';
+export type * from './types';
 //# sourceMappingURL=index.d.ts.map

package/dist/components/ErrorBoundary/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ErrorBoundary/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ErrorBoundary/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC;AAChC,mBAAmB,SAAS,CAAC"}

package/dist/components/GameProvider/GameProvider.d.ts

@@ -1,10 +1,9 @@
 import { NewOptions } from "@react-text-game/core";
 import { PropsWithChildren } from "react";
 import { Components } from "../../context/ComponentsContext";
-type GameProviderProps = PropsWithChildren<{
+export type GameProviderProps = PropsWithChildren<{
     options: NewOptions;
     components?: Components;
 }>;
 export declare const GameProvider: ({ children, options, components, }: GameProviderProps) => import("react/jsx-runtime").JSX.Element | null;
-export {};
 //# sourceMappingURL=GameProvider.d.ts.map

package/dist/components/GameProvider/GameProvider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"GameProvider.d.ts","sourceRoot":"","sources":["../../../src/components/GameProvider/GameProvider.tsx"],"names":[],"mappings":"AAEA,OAAO,EAEH,UAAU,EAGb,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,iBAAiB,EAAuB,MAAM,OAAO,CAAC;AAK/D,OAAO,EAAE,UAAU,EAAsB,MAAM,4BAA4B,CAAC;AAS5E,KAAK,iBAAiB,GAAG,iBAAiB,CAAC;IACvC,OAAO,EAAE,UAAU,CAAC;IACpB,UAAU,CAAC,EAAE,UAAU,CAAC;CAC3B,CAAC,CAAC;AAOH,eAAO,MAAM,YAAY,GAAI,oCAI1B,iBAAiB,mDA4CnB,CAAC"}
+{"version":3,"file":"GameProvider.d.ts","sourceRoot":"","sources":["../../../src/components/GameProvider/GameProvider.tsx"],"names":[],"mappings":"AAEA,OAAO,EAEH,UAAU,EAGb,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,iBAAiB,EAAuB,MAAM,OAAO,CAAC;AAK/D,OAAO,EAAE,UAAU,EAAsB,MAAM,4BAA4B,CAAC;AAS5E,MAAM,MAAM,iBAAiB,GAAG,iBAAiB,CAAC;IAC9C,OAAO,EAAE,UAAU,CAAC;IACpB,UAAU,CAAC,EAAE,UAAU,CAAC;CAC3B,CAAC,CAAC;AAOH,eAAO,MAAM,YAAY,GAAI,oCAI1B,iBAAiB,mDA4CnB,CAAC"}

package/dist/components/ReloadButton.d.ts

@@ -1,5 +1,5 @@
 import { ButtonProps } from "../components/common";
-type ReloadButtonProps = Omit<ButtonProps, "children" | "onClick"> & Readonly<{
+export type ReloadButtonProps = Omit<ButtonProps, "children" | "onClick"> & Readonly<{
     /**
      * If true, the button will display only the icon without any text.
      *
@@ -11,5 +11,4 @@ export declare const Icon: ({ className }: {
     className?: string;
 }) => import("react/jsx-runtime").JSX.Element;
 export declare const ReloadButton: ({ isIconOnly, className, ...props }: ReloadButtonProps) => import("react/jsx-runtime").JSX.Element;
-export {};
 //# sourceMappingURL=ReloadButton.d.ts.map

package/dist/components/ReloadButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ReloadButton.d.ts","sourceRoot":"","sources":["../../src/components/ReloadButton.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAU,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAEzD,KAAK,iBAAiB,GAAG,IAAI,CAAC,WAAW,EAAE,UAAU,GAAG,SAAS,CAAC,GAC9D,QAAQ,CAAC;IACL;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;CACxB,CAAC,CAAC;AAEP,eAAO,MAAM,IAAI,GAAI,eAAe;IAAE,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,4CAezD,CAAC;AAEF,eAAO,MAAM,YAAY,GAAI,qCAI1B,iBAAiB,4CAanB,CAAC"}
+{"version":3,"file":"ReloadButton.d.ts","sourceRoot":"","sources":["../../src/components/ReloadButton.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAU,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAEzD,MAAM,MAAM,iBAAiB,GAAG,IAAI,CAAC,WAAW,EAAE,UAAU,GAAG,SAAS,CAAC,GACrE,QAAQ,CAAC;IACL;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;CACxB,CAAC,CAAC;AAEP,eAAO,MAAM,IAAI,GAAI,eAAe;IAAE,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,4CAezD,CAAC;AAEF,eAAO,MAAM,YAAY,GAAI,qCAI1B,iBAAiB,4CAanB,CAAC"}

package/dist/components/SaveButton.d.ts

@@ -1,6 +1,6 @@
 import { ButtonProps } from "../components/common";
 import { SaveLoadMode } from "../context/SaveLoadMenuContext";
-type SaveButtonProps = Omit<ButtonProps, "children" | "onClick"> & Readonly<{
+export type SaveButtonProps = Omit<ButtonProps, "children" | "onClick"> & Readonly<{
     /**
      * If true, the button will display only the icon without any text.
      *
@@ -17,5 +17,4 @@ type SaveButtonProps = Omit<ButtonProps, "children" | "onClick"> & Readonly<{
     mode?: Omit<SaveLoadMode, "load">;
 }>;
 export declare const SaveButton: ({ isIconOnly, className, mode, ...props }: SaveButtonProps) => import("react/jsx-runtime").JSX.Element;
-export {};
 //# sourceMappingURL=SaveButton.d.ts.map

package/dist/components/SaveButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SaveButton.d.ts","sourceRoot":"","sources":["../../src/components/SaveButton.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAU,WAAW,EAAE,MAAM,oBAAoB,CAAC;AACzD,OAAO,EAAE,YAAY,EAAE,MAAM,8BAA8B,CAAC;AAG5D,KAAK,eAAe,GAAG,IAAI,CAAC,WAAW,EAAE,UAAU,GAAG,SAAS,CAAC,GAC5D,QAAQ,CAAC;IACL;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;;;OAMG;IACH,IAAI,CAAC,EAAE,IAAI,CAAC,YAAY,EAAE,MAAM,CAAC,CAAC;CACrC,CAAC,CAAC;AAkBP,eAAO,MAAM,UAAU,GAAI,2CAKxB,eAAe,4CAajB,CAAC"}
+{"version":3,"file":"SaveButton.d.ts","sourceRoot":"","sources":["../../src/components/SaveButton.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAU,WAAW,EAAE,MAAM,oBAAoB,CAAC;AACzD,OAAO,EAAE,YAAY,EAAE,MAAM,8BAA8B,CAAC;AAG5D,MAAM,MAAM,eAAe,GAAG,IAAI,CAAC,WAAW,EAAE,UAAU,GAAG,SAAS,CAAC,GACnE,QAAQ,CAAC;IACL;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;;;OAMG;IACH,IAAI,CAAC,EAAE,IAAI,CAAC,YAAY,EAAE,MAAM,CAAC,CAAC;CACrC,CAAC,CAAC;AAkBP,eAAO,MAAM,UAAU,GAAI,2CAKxB,eAAe,4CAajB,CAAC"}

package/dist/components/common/Tooltip.d.ts

@@ -1,6 +1,6 @@
 import { ReactNode } from "react";
-type Placement = "top" | "top-right" | "top-left" | "bottom" | "bottom-right" | "bottom-left" | "right" | "left";
-type TooltipProps = Readonly<{
+export type Placement = "top" | "top-right" | "top-left" | "bottom" | "bottom-right" | "bottom-left" | "right" | "left";
+export type TooltipProps = Readonly<{
     children: ReactNode;
     disabled?: boolean | undefined;
     content: ReactNode;
@@ -8,5 +8,4 @@ type TooltipProps = Readonly<{
     placement?: Placement | undefined;
 }>;
 export declare const Tooltip: ({ children, disabled, content, className, placement, }: TooltipProps) => import("react/jsx-runtime").JSX.Element;
-export {};
 //# sourceMappingURL=Tooltip.d.ts.map

package/dist/components/common/Tooltip.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../../../src/components/common/Tooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,KAAK,SAAS,GACR,KAAK,GACL,WAAW,GACX,UAAU,GACV,QAAQ,GACR,cAAc,GACd,aAAa,GACb,OAAO,GACP,MAAM,CAAC;AAEb,KAAK,YAAY,GAAG,QAAQ,CAAC;IACzB,QAAQ,EAAE,SAAS,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAC/B,OAAO,EAAE,SAAS,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC/B,SAAS,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;CACrC,CAAC,CAAC;AAwBH,eAAO,MAAM,OAAO,GAAI,wDAMrB,YAAY,4CAmBd,CAAC"}
+{"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../../../src/components/common/Tooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,MAAM,MAAM,SAAS,GACf,KAAK,GACL,WAAW,GACX,UAAU,GACV,QAAQ,GACR,cAAc,GACd,aAAa,GACb,OAAO,GACP,MAAM,CAAC;AAEb,MAAM,MAAM,YAAY,GAAG,QAAQ,CAAC;IAChC,QAAQ,EAAE,SAAS,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAC/B,OAAO,EAAE,SAAS,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC/B,SAAS,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;CACrC,CAAC,CAAC;AAwBH,eAAO,MAAM,OAAO,GAAI,wDAMrB,YAAY,4CAmBd,CAAC"}

package/dist/components/index.d.ts

@@ -3,4 +3,6 @@ export * from "./GameProvider";
 export { PassageController } from "./PassageController";
 export * from "./ReloadButton";
 export * from "./SaveButton";
+export * from "./common";
+export * from "./StoryComponent/components";
 //# sourceMappingURL=index.d.ts.map

package/dist/components/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC;AAChC,cAAc,gBAAgB,CAAC;AAC/B,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,cAAc,gBAAgB,CAAC;AAC/B,cAAc,cAAc,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC;AAChC,cAAc,gBAAgB,CAAC;AAC/B,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,cAAc,gBAAgB,CAAC;AAC/B,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,6BAA6B,CAAC"}

package/dist/components/index.js

@@ -3,4 +3,6 @@ export * from "./GameProvider";
 export { PassageController } from "./PassageController";
 export * from "./ReloadButton";
 export * from "./SaveButton";
+export * from "./common";
+export * from "./StoryComponent/components";
 //# sourceMappingURL=index.js.map

package/dist/components/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC;AAChC,cAAc,gBAAgB,CAAC;AAC/B,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,cAAc,gBAAgB,CAAC;AAC/B,cAAc,cAAc,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC;AAChC,cAAc,gBAAgB,CAAC;AAC/B,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,cAAc,gBAAgB,CAAC;AAC/B,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,6BAA6B,CAAC"}

package/dist/context/SaveLoadMenuContext/SaveLoadMenuContext.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SaveLoadMenuContext.d.ts","sourceRoot":"","sources":["../../../src/context/SaveLoadMenuContext/SaveLoadMenuContext.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,YAAY,EAAE,MAAM,8BAA8B,CAAC;AAE5D,MAAM,WAAW,uBAAuB;IACpC,MAAM,EAAE,OAAO,CAAC;IAChB,IAAI,EAAE,YAAY,CAAC;IACnB,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,gBAAgB,EAAE,MAAM,IAAI,CAAC;IAC7B,KAAK,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,eAAO,MAAM,mBAAmB,8DAEpB,CAAC"}
+{"version":3,"file":"SaveLoadMenuContext.d.ts","sourceRoot":"","sources":["../../../src/context/SaveLoadMenuContext/SaveLoadMenuContext.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,YAAY,EAAE,MAAM,8BAA8B,CAAC;AAE5D,MAAM,WAAW,uBAAuB;IACpC,MAAM,EAAE,OAAO,CAAC;IAChB,IAAI,EAAE,YAAY,CAAC;IACnB,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,gBAAgB,EAAE,MAAM,IAAI,CAAC;IAC7B,KAAK,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,eAAO,MAAM,mBAAmB,8DAEpB,CAAC"}

package/dist/context/SaveLoadMenuContext/SaveLoadMenuContext.js

@@ -1,3 +1,4 @@
+"use client";
 import { createContext } from "react";
 export const SaveLoadMenuContext = createContext(undefined);
 //# sourceMappingURL=SaveLoadMenuContext.js.map

package/dist/context/SaveLoadMenuContext/SaveLoadMenuContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"SaveLoadMenuContext.js","sourceRoot":"","sources":["../../../src/context/SaveLoadMenuContext/SaveLoadMenuContext.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAatC,MAAM,CAAC,MAAM,mBAAmB,GAAG,aAAa,CAE9C,SAAS,CAAC,CAAC"}
+{"version":3,"file":"SaveLoadMenuContext.js","sourceRoot":"","sources":["../../../src/context/SaveLoadMenuContext/SaveLoadMenuContext.ts"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAatC,MAAM,CAAC,MAAM,mBAAmB,GAAG,aAAa,CAE9C,SAAS,CAAC,CAAC"}

package/dist/index.d.ts

@@ -1,3 +1,5 @@
 export * from './components';
 export { useSaveLoadMenu } from './context/SaveLoadMenuContext';
+export type { SaveLoadMenuContextType, SaveLoadMode, } from './context/SaveLoadMenuContext';
+export type { Components, StoryComponents } from './context/ComponentsContext';
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,OAAO,EAAE,eAAe,EAAE,MAAM,+BAA+B,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,OAAO,EAAE,eAAe,EAAE,MAAM,+BAA+B,CAAC;AAChE,YAAY,EACR,uBAAuB,EACvB,YAAY,GACf,MAAM,+BAA+B,CAAC;AACvC,YAAY,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@react-text-game/ui",
-    "version": "0.2.0",
+    "version": "0.2.2",
     "description": "UI components library for react-text-game",
     "private": false,
     "type": "module",
@@ -8,6 +8,7 @@
     "module": "dist/index.js",
     "types": "dist/index.d.ts",
     "repository": "github:laruss/react-text-game",
+    "homepage": "https://laruss.github.io/react-text-game/",
     "scripts": {
         "dev": "tsc --watch & tsc-alias --watch & bun run build:css --watch",
         "build": "tsc && tsc-alias && bun run build:css",