narraleaf-react 0.4.0 → 0.4.2

package/README.md

@@ -1,10 +1,15 @@
-![](docs/nlr-logo-banner.png)
+<picture>
+  <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/NarraLeaf/.github/refs/heads/master/doc/banner-md-transparent.png">
+  <source media="(prefers-color-scheme: light)" srcset="https://raw.githubusercontent.com/NarraLeaf/.github/refs/heads/master/doc/banner-md-light.png">
+  <img alt="Fallback image description" src="https://raw.githubusercontent.com/NarraLeaf/.github/refs/heads/master/doc/banner-md-light.png">
+</picture>
 
-# NarraLeaf-React
+<h1 align="center">NarraLeaf-React</h1>
 
-English | [简体中文](docs/README.zh-CN.md)
+<h4 align="center">A React visual novel player framework</h3>
+
+<p align="center">English | <a href="docs/README.zh-CN.md">简体中文</a></p>
 
-A React visual novel player framework
 
 ## What is NarraLeaf-React?
 
@@ -46,7 +51,7 @@ scene1.action([
   johnSmith
     .say("Hello, world!")
     .say`This is my first ${b("NarraLeaf")} story.`
-    .say`Start editing ${c("src/story.js", "#0000ff")} and enjoy the journey!`,
+    .say`Start editing ${c("src/story.js", "#00f")} and enjoy the journey!`,
 
   /**
    * John Doe: Also, don't forget to check out the documentation!
@@ -100,6 +105,9 @@ npm install narraleaf-react
   - [Conditional](https://react.narraleaf.com/documentation/basic/conditional)
   - [Voice](https://react.narraleaf.com/documentation/basic/voice)
   - [Manage Preferences](https://react.narraleaf.com/documentation/basic/manage-preferences)
+- [Solutions](https://react.narraleaf.com/documentation/solutions)
+  - [Customizing the font](https://react.narraleaf.com/documentation/solutions/font)
+  - [Migration from Ren'Py](https://react.narraleaf.com/documentation/solutions/from-renpy)
 - [Core](https://react.narraleaf.com/documentation/core)
   - [Elements](https://react.narraleaf.com/documentation/core/elements)
     - [Scene](https://react.narraleaf.com/documentation/core/elements/scene)
@@ -116,13 +124,16 @@ npm install narraleaf-react
     - [Text](https://react.narraleaf.com/documentation/core/elements/text)
     - [Persistent](https://react.narraleaf.com/documentation/core/elements/persistent)
     - [Story](https://react.narraleaf.com/documentation/core/elements/story)
+    - [Displayable](https://react.narraleaf.com/documentation/core/elements/displayable)
+    - [Layer](https://react.narraleaf.com/documentation/core/elements/layer)
+    - [Service](https://react.narraleaf.com/documentation/core/elements/service)
+    - [Video](https://react.narraleaf.com/documentation/core/elements/video)
   - [Animation](https://react.narraleaf.com/documentation/core/animation)
   - [Game](https://react.narraleaf.com/documentation/core/game)
+  - [Plugin](https://react.narraleaf.com/documentation/core/plugin)
+  - [Utils](https://react.narraleaf.com/documentation/core/utils)
 - [Player](https://react.narraleaf.com/documentation/player)
-- [Customization](https://react.narraleaf.com/documentation/custom)
-- [Migration](https://react.narraleaf.com/documentation/migration)
-  - [From Ren'Py](https://react.narraleaf.com/documentation/migration/from-renpy)
-- Info
+- About
   - [License](https://react.narraleaf.com/documentation/info/license)
   - [Incompatible Changes](https://react.narraleaf.com/documentation/info/incompatible-changes)
 

package/dist/game/nlcore/action/gameHistory.d.ts

@@ -10,7 +10,7 @@ type GameElementHistory = {
     voice: string | null;
 } | {
     type: "menu";
-    text: string;
+    text: string | null;
     selected: string;
 };
 export type GameHistory = GameHistoryAction & {

package/dist/game/nlcore/action/logicAction.d.ts

@@ -32,6 +32,15 @@ import { LayerAction } from "../action/actions/layerAction";
 import { ExposedStateType } from "../../player/type";
 import { Video } from "../elements/video";
 import { VideoAction } from "../action/actions/videoAction";
+export interface LogicActionInterface {
+    DisplayableElements: Text | Image | Layer | AbstractDisplayable<any, any>;
+    DisplayableExposed: ExposedStateType.image | ExposedStateType.layer | ExposedStateType.text;
+    GameElement: Character | Scene | Story | Image | Condition | Script | Menu | Sound | Control | Text | AbstractDisplayable<any, any> | Persistent<any> | ServiceSkeleton | Video;
+    Actions: TypedAction | CharacterAction | ConditionAction | ImageAction | SceneAction | ScriptAction | StoryAction | MenuAction | SoundAction | ControlAction | TextAction | DisplayableAction | PersistentAction | ServiceAction | LayerAction | VideoAction;
+    ActionTypes: Values<typeof CharacterActionTypes> | Values<typeof ConditionActionTypes> | Values<typeof ImageActionTypes> | Values<typeof SceneActionTypes> | Values<typeof ScriptActionTypes> | Values<typeof StoryActionTypes> | Values<typeof MenuActionTypes> | Values<typeof SoundAction.ActionTypes> | Values<typeof ControlAction.ActionTypes> | Values<typeof TextAction.ActionTypes> | Values<typeof DisplayableActionTypes> | Values<typeof PersistentActionTypes> | StringKeyOf<ServiceActionContentType> | Values<typeof LayerActionTypes> | Values<typeof VideoActionTypes>;
+    ActionContents: CharacterActionContentType & ConditionActionContentType & ImageActionContentType & SceneActionContentType & ScriptActionContentType & StoryActionContentType & MenuActionContentType & SoundActionContentType & ControlActionContentType & TextActionContentType & DisplayableActionContentType & PersistentActionContentType & ServiceActionContentType & LayerActionContentType & VideoActionContentType;
+}
+export declare const LogicAction: {};
 export declare namespace LogicAction {
     type DisplayableElements = Text | Image | Layer | AbstractDisplayable<any, any>;
     type DisplayableExposed = ExposedStateType.image | ExposedStateType.layer | ExposedStateType.text;
@@ -40,3 +49,4 @@ export declare namespace LogicAction {
     type ActionTypes = Values<typeof CharacterActionTypes> | Values<typeof ConditionActionTypes> | Values<typeof ImageActionTypes> | Values<typeof SceneActionTypes> | Values<typeof ScriptActionTypes> | Values<typeof StoryActionTypes> | Values<typeof MenuActionTypes> | Values<typeof SoundAction.ActionTypes> | Values<typeof ControlAction.ActionTypes> | Values<typeof TextAction.ActionTypes> | Values<typeof DisplayableActionTypes> | Values<typeof PersistentActionTypes> | StringKeyOf<ServiceActionContentType> | Values<typeof LayerActionTypes> | Values<typeof VideoActionTypes>;
     type ActionContents = CharacterActionContentType & ConditionActionContentType & ImageActionContentType & SceneActionContentType & ScriptActionContentType & StoryActionContentType & MenuActionContentType & SoundActionContentType & ControlActionContentType & TextActionContentType & DisplayableActionContentType & PersistentActionContentType & ServiceActionContentType & LayerActionContentType & VideoActionContentType;
 }
+export type LogicAction = typeof LogicAction;

package/dist/game/nlcore/common/types.d.ts

@@ -1,7 +1,9 @@
-import { TransformDefinitions } from "../elements/transform/type";
-import { Origins } from "../elements/story";
 import { ServiceHandlerCtx } from "../elements/service";
+import { Origins } from "../elements/story";
+import { TransformDefinitions } from "../elements/transform/type";
 import { IGamePluginRegistry } from "../game/plugin/plugin";
 import { LiveGameEventToken } from "../types";
+import { GameHistory } from "../action/gameHistory";
+import { GameConfig } from "../gameTypes";
 export * from "../elements/type";
-export type { TransformDefinitions, Origins, ServiceHandlerCtx, IGamePluginRegistry, LiveGameEventToken, };
+export type { GameHistory, IGamePluginRegistry, LiveGameEventToken, Origins, ServiceHandlerCtx, TransformDefinitions, GameConfig, };

package/dist/game/nlcore/elements/character/sentence.d.ts

@@ -1,9 +1,9 @@
-import { Sound } from "../../elements/sound";
 import type { Character } from "../../elements/character";
+import { Pausing } from "../../elements/character/pause";
 import { Word } from "../../elements/character/word";
-import { Color, Font } from "../../types";
 import type { ScriptCtx } from "../../elements/script";
-import { Pausing } from "../../elements/character/pause";
+import { Sound } from "../../elements/sound";
+import { Color, Font } from "../../types";
 export type SentenceConfig = {
     pause?: boolean | number;
     voice: Sound | null;

package/dist/game/nlcore/elements/menu.d.ts

@@ -13,7 +13,7 @@ export type Choice = {
     prompt: Sentence;
 };
 export type MenuData = {
-    prompt: Sentence;
+    prompt: Sentence | null;
     choices: Choice[];
 };
 export declare class Menu extends Actionable<any, Menu> {
@@ -23,9 +23,11 @@ export declare class Menu extends Actionable<any, Menu> {
      * @returns A new menu
      */
     static prompt(prompt: SentencePrompt | Sentence, config?: MenuConfig): Menu;
+    static choose(arg0: Sentence | MenuChoice | SentencePrompt, arg1?: ChainedActions): Proxied<Menu, Chained<LogicAction.Actions>>;
     constructor(prompt: SentencePrompt, config?: MenuConfig);
     constructor(prompt: Sentence, config?: MenuConfig);
     constructor(prompt: SentencePrompt | Sentence, config: MenuConfig);
+    constructor(prompt: null, config?: MenuConfig);
     /**
      * Add a choice to the menu
      * @example
@@ -37,4 +39,5 @@ export declare class Menu extends Actionable<any, Menu> {
     choose(choice: MenuChoice): Proxied<Menu, Chained<LogicAction.Actions>>;
     choose(prompt: Sentence, action: ChainedActions): Proxied<Menu, Chained<LogicAction.Actions>>;
     choose(prompt: SentencePrompt, action: ChainedActions): Proxied<Menu, Chained<LogicAction.Actions>>;
+    choose(arg0: Sentence | MenuChoice | SentencePrompt, arg1?: ChainedActions): Proxied<Menu, Chained<LogicAction.Actions>>;
 }

package/dist/game/nlcore/game.d.ts

@@ -8,9 +8,29 @@ declare enum GameSettingsNamespace {
     game = "game"
 }
 export type GamePreference = {
+    /**
+     * If true, the game will automatically forward to the next sentence when the player has finished the current sentence
+     * @default false
+     */
     autoForward: boolean;
+    /**
+     * If true, the game will allow the player to skip the dialog
+     * @default true
+     */
     skip: boolean;
+    /**
+     * If true, the game will show the dialog
+     * @default true
+     */
     showDialog: boolean;
+    /**
+     * The multiplier of the dialog speed
+     *
+     * Dialog speed will apply to:
+     * - The text speed
+     * - The auto-forward delay
+     */
+    gameSpeed: number;
 };
 export type GameHooks = {
     /**

package/dist/game/nlcore/gameTypes.d.ts

@@ -28,36 +28,6 @@ export interface SavedGame {
     };
 }
 export type GameConfig = {
-    app: {
-        debug: boolean;
-        /**
-         * Log level for the logger
-         * Set to true to enable all logs
-         */
-        logger: {
-            log: boolean;
-            info: boolean;
-            warn: boolean;
-            error: boolean;
-            debug: boolean;
-            trace: boolean;
-            verbose: boolean;
-        } | boolean;
-        /**
-         * If true, the game will show the inspector when you hover over the element
-         */
-        inspector: boolean;
-        /**
-         * The config of {@link GameStateGuard}
-         */
-        guard: GuardConfig;
-        /**
-         * Quality of the screenshot, between 0 and 1
-         * @default 1
-         * @deprecated Moved to `$root.screenshotQuality`
-         */
-        screenshotQuality: number;
-    };
     /**
      * The id of the container element for the game
      * @default "__narraleaf_content"
@@ -176,7 +146,6 @@ export type GameConfig = {
     /**
      * Quality of the screenshot, between 0 and 1
      * @default 1
-     * @deprecated Moved to `$root.screenshotQuality`
      */
     screenshotQuality: number;
     /**
@@ -205,6 +174,13 @@ export type GameConfig = {
      * @default 3000
      */
     autoForwardDelay: number;
+    /**
+     * The default pause duration in milliseconds when auto-forward is enabled
+     *
+     * When auto-forward is enabled, any Pause without a custom duration will use this value
+     * @default 1000
+     */
+    autoForwardDefaultPause: number;
     /**
      * If true, when you press [GameConfig.player.skipKey], the game will skip the image transform
      * @default true
@@ -292,6 +268,60 @@ export type GameConfig = {
      * @default () => {}
      */
     onError: (error: Error) => void;
+    app: {
+        debug: boolean;
+        /**
+         * Log level for the logger
+         * Set to true to enable all logs
+         */
+        logger: {
+            log: boolean;
+            info: boolean;
+            warn: boolean;
+            error: boolean;
+            debug: boolean;
+            trace: boolean;
+            verbose: boolean;
+        } | boolean;
+        /**
+         * If true, the game will show the inspector when you hover over the element
+         */
+        inspector: boolean;
+        /**
+         * The config of {@link GameStateGuard}
+         */
+        guard: GuardConfig;
+    };
+    /**
+     * Default font size for the game
+     * @default "16px"
+     */
+    fontSize: React.CSSProperties["fontSize"];
+    /**
+     * Default font weight for the game
+     * @default 400
+     */
+    fontWeight: number;
+    /**
+     * Default font weight for the game
+     * @default 700
+     */
+    fontWeightBold: number;
+    /**
+     * Default font family for the game
+     * @default "sans-serif"
+     */
+    fontFamily: React.CSSProperties["fontFamily"];
+    /**
+     * Override the default stage
+     * @default null
+     */
+    stage: React.ReactNode | null;
+    /**
+     * The default color for the menu choices
+     * @default "#000"
+     */
+    defaultMenuChoiceColor: Color;
 };
 export type GameSettings = {
     volume: number;

package/dist/game/player/elements/Player.d.ts

@@ -1,5 +1,4 @@
 import "client-only";
-import "@player/lib/styles/style.css";
 import { PlayerProps } from "../elements/type";
 import React from "react";
 export default function Player({ story, width, height, className, onReady, onEnd, children, active, }: Readonly<PlayerProps>): React.JSX.Element;

package/dist/game/player/elements/menu/UIMenu/Item.d.ts

@@ -2,5 +2,11 @@ import React from "react";
 export interface ItemProps {
     className?: string;
     style?: React.CSSProperties;
+    /**
+     * The keyboard binding for this item, see [Key_Values](https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/key/Key_Values) for more information
+     *
+     * When this key is pressed, the item will be selected and the action will be executed
+     */
+    bindKey?: string;
 }
-export default function Item({ className, style }: ItemProps): React.JSX.Element;
+export default function Item({ className, style, bindKey }: ItemProps): React.JSX.Element;

package/dist/game/player/elements/menu/type.d.ts

@@ -5,11 +5,11 @@ import { Word } from "../../../nlcore/elements/character/word";
 import { Pausing } from "../../../nlcore/elements/character/pause";
 import { Chosen } from "../../type";
 export interface MenuElementProps {
-    prompt: Sentence;
+    prompt: Sentence | null;
     choices: Choice[];
     afterChoose: (choice: Chosen) => void;
     state: GameState;
-    words: Word<Pausing | string>[];
+    words: Word<Pausing | string>[] | null;
 }
 export interface IUserMenuProps {
     items: number[];

package/dist/game/player/elements/say/Dialog.d.ts

@@ -1,27 +1,11 @@
-import React from "react";
 import { DialogProps } from "../../elements/say/type";
-import { GameState } from "../../../nlcore/common/game";
-import { Sentence } from "../../../nlcore/elements/character/sentence";
-import { Word } from "../../../nlcore/elements/character/word";
-import { Pausing } from "../../../nlcore/elements/character/pause";
-/**
- * Props-based wrapper component
- * Provides a clean interface for direct prop usage
- */
-export interface RawDialogProps extends Omit<DialogProps, "onClick"> {
-    sentence: Sentence;
-    words: Word<Pausing | string>[];
-    gameState: GameState;
-    useTypeEffect?: boolean;
-    onClick?: (skiped?: boolean) => void;
-    onFinished?: () => void;
-}
-export declare function RawDialog(props: RawDialogProps): React.JSX.Element;
+import React from "react";
+export declare function RawDialog(props: DialogProps): React.JSX.Element;
 /**
  * Context-based wrapper component
  * Provides integration with the say context
  */
-export declare function Dialog({ children, ...props }: DialogProps): React.JSX.Element;
+export declare function Dialog({ children, ...props }: DialogProps): React.JSX.Element | null;
 export default Dialog;
 /**
  * Default dialog component with Texts as children

package/dist/game/player/elements/say/Sentence.d.ts

@@ -1,9 +1,20 @@
-import React from "react";
-import { Word } from "../../../nlcore/elements/character/word";
 import { Pausing } from "../../../nlcore/elements/character/pause";
-import { DialogElementProps } from "./type";
-import { GameState } from "../../../../game/nlcore/common/game";
 import { Sentence } from "../../../nlcore/elements/character/sentence";
+import { Word } from "../../../nlcore/elements/character/word";
+import { GameState } from "../../../../game/nlcore/common/game";
+import { Color } from "../../../../game/nlcore/types";
+import React from "react";
+import { DialogElementProps } from "./type";
+import { DialogState } from "./UIDialog";
+type BaseTextsProps = {
+    /**
+     * The default color of the text
+     */
+    defaultColor?: Color;
+    className?: string;
+    style?: React.CSSProperties;
+    dialog?: DialogState;
+} & React.HTMLAttributes<HTMLDivElement>;
 /**
  * Props-based wrapper component
  * Provides a clean interface for direct prop usage
@@ -17,10 +28,10 @@ export interface TextsProps extends DialogElementProps {
     count?: number;
     words?: Word<Pausing | string>[];
 }
-export declare function RawTexts(props: TextsProps): React.JSX.Element;
+export declare function RawTexts(props: BaseTextsProps): React.JSX.Element;
 /**
  * Context-based wrapper component
  * Provides integration with the sentence context
  */
-export declare function Texts(props: DialogElementProps): React.JSX.Element;
+export declare function Texts(props: BaseTextsProps): React.JSX.Element;
 export default Texts;

package/dist/game/player/elements/say/UIDialog.d.ts

@@ -1,3 +1,65 @@
+import { Pausing } from "../../../nlcore/elements/character/pause";
+import { Word } from "../../../nlcore/elements/character/word";
+import { GameState } from "../../../../game/nlcore/common/game";
+import { EventDispatcher } from "../../../../util/data";
 import React from "react";
-import { PlayerDialogProps } from "./type";
-export default function PlayerDialog({ action, onClick, useTypeEffect, gameState, }: Readonly<PlayerDialogProps>): React.JSX.Element;
+import { DialogAction, DialogStateType, SayElementProps } from "./type";
+type DialogEvents = {
+    "event:dialog.requestComplete": [];
+    "event:dialog.complete": [];
+    "event:dialog.forceSkip": [];
+};
+type DialogStateConfig = {
+    useTypeEffect: boolean;
+    action: DialogAction;
+    evaluatedWords: Word<Pausing | string>[];
+    gameState: GameState;
+};
+export declare class DialogState {
+    static Events: {
+        requestComplete: "event:dialog.requestComplete";
+        complete: "event:dialog.complete";
+        forceSkip: "event:dialog.forceSkip";
+    };
+    readonly config: Readonly<DialogStateConfig>;
+    readonly events: EventDispatcher<DialogEvents>;
+    private _state;
+    private _count;
+    private _forceSkipped;
+    private _idle;
+    private autoForwardScheduler;
+    constructor(config: DialogStateConfig);
+    get state(): DialogStateType;
+    get deps(): React.DependencyList;
+    isIdle(): boolean;
+    setIdle(idle: boolean): void;
+    /**
+     * Only for dialog component to call
+     *
+     * Calling this method will request the sentence to be completed
+     * If the sentence is already completed, it will exit the dialog
+     */
+    requestComplete(): void;
+    /**
+     * Only for dialog state to call
+     *
+     * Force the sentence to cancel/skip all the tasks
+     */
+    forceSkip(): void;
+    /**
+     * Only for sentence component to call
+     *
+     * Only call this method when the sentence is completed
+     * Calling this method will schedule the exit of the dialog
+     */
+    dispatchComplete(): void;
+    emitComplete(): void;
+    isEnded(): boolean;
+    setPause(pause: boolean): void;
+    isForceSkipped(): boolean;
+    tryScheduleAutoForward(): void;
+    cancelAutoForward(): void;
+    private scheduleAutoForward;
+}
+export default function PlayerDialog({ action, onFinished, useTypeEffect, gameState, }: Readonly<SayElementProps>): React.JSX.Element;
+export {};

package/dist/game/player/elements/say/context.d.ts

@@ -1,19 +1,4 @@
-import { GameState } from "../../../../game/nlcore/common/game";
-import { SayElementProps } from "./type";
 import React from "react";
-import { Sentence } from "../../../nlcore/elements/character/sentence";
-import { Word } from "../../../nlcore/elements/character/word";
-import { Pausing } from "../../../nlcore/elements/character/pause";
-export declare const SayContext: React.Context<SayElementProps | null>;
-export declare function useSayContext(): SayElementProps;
-export interface SentenceContext {
-    sentence: Sentence;
-    gameState: GameState;
-    finished: boolean;
-    useTypeEffect: boolean;
-    onCompleted?: () => void;
-    count: number;
-    words: Word<Pausing | string>[];
-}
-export declare const SentenceContext: React.Context<SentenceContext | null>;
-export declare function useSentenceContext(): SentenceContext;
+import { DialogState } from "./UIDialog";
+export declare const DialogContext: React.Context<DialogState | null>;
+export declare function useDialogContext(): DialogState;

package/dist/game/player/elements/say/type.d.ts

@@ -6,23 +6,21 @@ import { Pausing } from "../../../nlcore/elements/character/pause";
 import React from "react";
 export interface SayElementProps {
     action: {
-        sentence: Sentence;
+        sentence: Sentence | null;
         character: Character | null;
-        words: Word<Pausing | string>[];
+        words: Word<Pausing | string>[] | null;
+        id?: string;
     };
     /**
+     * @deprecated
      * Callback function to be called when the player triggers the next action
      */
     onClick?: (skiped?: boolean) => void;
-    onFinished?: () => void;
+    onFinished?: (skiped?: boolean) => void;
     useTypeEffect?: boolean;
     gameState: GameState;
 }
-export interface PlayerDialogProps extends SayElementProps {
-    onFinished?: () => void;
-}
 export interface IDialogProps {
-    isFinished: boolean;
 }
 export type DialogProps = {
     children: React.ReactNode;
@@ -33,3 +31,23 @@ export type DialogElementProps = {
 export interface IDialogElementProps extends React.HTMLAttributes<HTMLDivElement> {
     children?: never;
 }
+export declare enum DialogStateType {
+    Pending = "pending",
+    Paused = "paused",
+    Ended = "ended"
+}
+export interface DialogContext {
+    gameState: GameState;
+    action: {
+        sentence: Sentence | null;
+        character: Character | null;
+        words: Word<Pausing | string>[] | null;
+    };
+    state: DialogStateType;
+}
+export type DialogAction = {
+    sentence: Sentence | null;
+    character: Character | null;
+    words: Word<Pausing | string>[] | null;
+    id?: string;
+};

package/dist/game/player/elements/say/useDialog.d.ts

@@ -0,0 +1,21 @@
+/**
+ * Represents the context of a dialog, containing information about its completion status
+ * and the text content.
+ */
+export type DialogContext = {
+    /** Whether the dialog has finished displaying */
+    done: boolean;
+    /** The text content of the dialog */
+    text: string;
+};
+/**
+ * A custom hook that provides access to the current dialog's state and content.
+ * It retrieves the dialog information from the sentence context and processes
+ * the words to generate the final text.
+ *
+ * @returns {DialogContext} An object containing the dialog's completion status and text content
+ */
+export declare function useDialog(): {
+    done: boolean;
+    text: string;
+};

package/dist/game/player/gameState.d.ts

@@ -125,7 +125,7 @@ export declare class GameState {
         text: string;
     };
     createMenu(menu: MenuData, afterChoose?: (choice: Chosen) => void, scene?: Scene): LiveGameEventToken & {
-        prompt: string;
+        prompt: null | string;
     };
     createDisplayable(displayable: LogicAction.DisplayableElements, scene?: Scene | null, layer?: Layer | null): this;
     disposeDisplayable(displayable: LogicAction.DisplayableElements, scene?: Scene | null, layer?: Layer | null): this;

package/dist/game/player/lib/PageRouter/PageRouter.d.ts

@@ -5,7 +5,7 @@ type PageRouterProps = Readonly<{
 /**
  * Page Router for NarraLeaf-React
  *
- * **Note**: only `Page` components are allowed as children, other components will be ignored.
+ * **Note**: only `Page` and `Stage` components are allowed as children, other components will be ignored.
  *
  * @example
  * ```tsx

package/dist/game/player/libElements.d.ts

@@ -7,5 +7,6 @@ import Item from "./elements/menu/UIMenu/Item";
 import Notifications from "./elements/notification/Notifications";
 import Texts from "./elements/say/Sentence";
 import Nametag from "./elements/say/Nametag";
-import Dialog from "../../game/player/elements/say/Dialog";
-export { Isolated, usePreference, Stage, Page, GameMenu, Item, Notifications, Texts, Nametag, Dialog, };
+import Dialog from "./elements/say/Dialog";
+import { useDialog } from "./elements/say/useDialog";
+export { Isolated, usePreference, Stage, Page, GameMenu, Item, Notifications, Texts, Nametag, Dialog, useDialog, };

package/dist/index.d.ts

@@ -1,2 +1,3 @@
 export * from "./game/nlcore/common/core";
 export * from "./game/nlcore/common/player";
+import "./styles/index.css";