beast-devtools

A Beast project powered by TSRX and Octane.

bun install
bun run dev

Edit src/App.btsx to get started. Declare typed props at the top of the BTSX file; the Beast bundler adapter compiles it into native TSRX and then lets Octane produce the browser module.

The starter pins the tested [email protected] toolchain. Run the complete local verification before shipping:

bun run check

Use scope when setup belongs to an exact child position instead of the whole component:

scope
  setup const label = "Owned by this child";
  p #{label}

Octane signals need no build option. Import octane/signals in a module to enable native signal reads there:

import { createScope } from "octane/signals"

Record application changes in CHANGELOG.md.

Beast DevTools

This repository develops @beastjs/devtools, an in-page devtools overlay for Beast and Octane apps. The package lives in devtools/ as a Bun workspace. The app at the root is its playground and uses the package by name, the same way a real app would:

// vite.config.ts
beastOctane({ octane: { profile: "auto" } }), // runtime hook in dev only
beastDevtools({ include: ["src"], analyzer: { depthLimit: 5, minLines: 8, fileLines: 30 } }),

bun run dev builds the plugin and starts the playground. Open the overlay from the Beast button or with Alt+Shift+D. See the package README for what each panel does.

| Path | Contents | | --- | --- | | devtools/vite.ts | The Vite plugin: injects the overlay, serves its JSON API, and pushes an HMR event when .btsx files change. | | devtools/server/ | Node side: compiles, source-maps, analyzes and refactors .btsx files. Built to devtools/dist/. | | devtools/client/ | The overlay, written in BTSX. It ships as source and is compiled by the host app's toolchain. | | devtools/shared/ | Wire types shared by both sides. | | devtools/test/fixtures/ | A snapshot of the deeply nested starter App.btsx that the analyzer tests run against. |

Edits under devtools/client/ hot-reload in the playground. Changes to devtools/vite.ts or devtools/server/ need bun run --cwd devtools build and a dev-server restart.

Publishing

1. Update version in devtools/package.json and add an entry to devtools/CHANGELOG.md.
2. Run bun run check (type check, tests, plugin build, app build).
3. Run bun run devtools:pack to review exactly which files will be published.
4. Publish from the package directory: cd devtools && npm publish. prepublishOnly rebuilds and retests, and publishConfig.access is public. You must be logged in to npm with publish rights on the @beastjs scope.

Selected stack

• Bundler: vite
• UI: base-ui (@octanejs/base-ui)
• Styling: Tailwind CSS v4

import { Button } from "@octanejs/base-ui/button";