webOwned()

function webOwned\<T\>(options: WebOwnedObservableOptions\<T\>): WebOwnedObservable\<T\>;

Defined in: src/lib/observable/webOwned.ts:104

Create a web-owned observable.

On web: Returns a full observable that triggers React re-renders. On client/server: Returns a stub that can hold values locally.

Use @Web decorated methods to update from client/server:

Type Parameters

Type Parameter
T

Parameters

Parameter	Type	Description
options	WebOwnedObservableOptions<T>	Configuration options.

Returns

WebOwnedObservable<T>

Web-owned observable.

Example

class MenuService {
    menuState = webOwned\<MenuState\>({
        id: "menu:state",
        initialValue: { open: false, items: [] },
    });
 
    // Client/server can call this to update web state
    @Web
    openMenu(ctx: EventContext<[string[]]>): void {
        const [items] = ctx.args;
        this.menuState.set({ open: true, items });
    }
}
 
// In React component
function MenuHud() {
    const menu = useObservable(menuService.menuState);
    return menu.open ? <div>...</div> : null;
}