Renderer

Renderer runtime, app hooks, save APIs, main-process events, and file-based page routing.

The Renderer module is the React side of a NarraLeaf desktop app. It mounts the generated app entry, provides the application shell, embeds the NarraLeaf-React Player, and exposes hooks for saves, playback state, and renderer-to-main communication.

import {
    render,
    useApp,
    useGamePlayback,
    useSaveAction,
    invokeMainEvent,
} from "narraleaf/renderer";

Guides

Render

Understand the generated renderer entry and the render() boot function.

App State

Access the RendererApp shell and playback state.

Save System

Use save hooks, current snapshots, quick saves, and save metadata.

Main Events

Call string-keyed or typed main-process handlers from the renderer.

Page Router

Learn the file-based page rules scanned by the CLI.

Public Exports

render
useApp
useAppState
useGamePlayback
useCurrentSaved
useCurrentSavedRef
useSaveAction
useSavedGames
readGame
requestMain
invokeMainEvent
SaveType

The renderer entry also exports public types such as RendererApp, RendererAppRootProps, GameMetadata, route module types, save result types, MainProcessEventMap, and MainProcessEventEntry.

Relationship to NarraLeaf-React

NarraLeaf uses NarraLeaf-React for story playback. Create stories, scenes, characters, menus, and displayables with NarraLeaf-React, then export the story through the NarraLeaf renderer app's metadata.story.