@rbxts/fusion-3.0

TypeScript bindings for Fusion 3.0 — a modern reactive UI library for Roblox by Elttob.

The underlying library is shipped as its original Luau source; this package adds TypeScript declarations and per-class prop typing via @rbxts/types.

Install

npm install @rbxts/fusion-3.0

Usage

import Fusion from "@rbxts/fusion-3.0";
import { Players } from "@rbxts/services";

const scope = Fusion.scoped(Fusion);
const count = Fusion.Value(scope, 0);

Fusion.New(scope, "ScreenGui")({
  Parent: Players.LocalPlayer.WaitForChild("PlayerGui"),
  [Fusion.Children]: Fusion.New(scope, "TextButton")({
    Size: new UDim2(0, 200, 0, 50),
    Text: Fusion.Computed(scope, (use) => `Count: ${use(count)}`),
    [Fusion.OnEvent("Activated")]: () => count.set(Fusion.peek(count) + 1),
  }),
});

Documentation

For API reference, tutorials, and everything else, see the official Fusion 0.3 docs. This package exposes the same runtime API — only the syntax is TypeScript.

• Tutorials
• API reference
• Upstream source (Luau)

Differences from upstream

• Distributed as Luau source with TypeScript declarations (no TS-to-Luau compile step).
• PropertyTable accepts object literals ({ Text: "Hi" }) instead of Map.
• New and Hydrate are generic: Fusion.New(scope, "Frame")({ ... }) type-checks props against Frame's writable properties.

Credits

Fusion is the work of Daniel P H Fox (Elttob) and contributors. This package only provides TypeScript bindings.

License

MIT. See LICENSE. Upstream Fusion is also MIT.