[cowboyd]

Preact expects a compact DOM-shaped mutation surface, which presents a different integration challenge from Solid’s universal renderer. A small facade can satisfy those expectations by translating document, element, text, attribute, sibling, and listener operations into the Host contract. This validates that Bombshell can meet a framework where it is without leaking DOM assumptions into the core UI.

Like the Solid adapter, a Preact root mounts into an existing attached Host element and owns only reconciliation. Its JSX element types are derived from the same open HostElements map, so built-in and third-party elements retain framework-appropriate children, refs, keys, and event names without duplicating their core property definitions.

import { createUI } from '@clack/ui';
import { createRoot } from '@clack/ui-preact';
import { HelloWorld } from './app.tsx';

await using ui = await createUI({
	input: process.stdin,
	output: process.stdout,
});

const root = createRoot(ui.host.element);
root.render(<HelloWorld />);

await ui.main();

This PR adds @clack/ui-preact, including a minimal DOM-shaped facade over Host mutations, typed JSX intrinsic elements, and root mounting and unmounting. It adapts properties, text, movement, removal, and event listener identity without adding Preact-specific behavior to @clack/ui. It also adds the equivalent Preact Hello World example.

[socket-security]

Review the following changes in direct dependencies. Learn more about Socket for GitHub.

Diff	Package	Supply Chain Security	Vulnerability	Quality	Maintenance	License
	preact@​11.0.0-beta.2

View full report

[pkg-pr-new]

More templates

• @examples/basic
• @examples/hello-world
• @examples/hello-world-preact
• @examples/hello-world-solid

npm i https://pkg.pr.new/bombshell-dev/ui/@clack/ui@32

npm i https://pkg.pr.new/bombshell-dev/ui/@clack/ui-preact@32

npm i https://pkg.pr.new/bombshell-dev/ui/@clack/ui-solid@32

commit: afb5c8e

[cowboyd]

closing out in favor of a DOM based substrate. See #37