Solid.js Render entrypoint

Render entrypoint

To use Cascade with Solid.js, configure your bundler to set jsxImportSource to @cascadetui/solid and preload the runtime if necessary. Then call the render function to mount your root component into the terminal.

import { render } from "@cascadetui/solid"
import { createSignal } from "solid-js"

function App() {
  const [count, setCount] = createSignal(0)
  return <text content={'Count: ' + count()} onMouseDown={() => setCount((n) => n + 1)} />
}

await render(() => <App />)

The Solid renderer shares the same event loop and lifetime as the core renderer, so you can use keyboard hooks and lifecycle methods as usual.

As your app grows, treat your root component like a normal UI shell: header + main + footer. Keep state at the lowest level that needs it, and pass callbacks down to child components.