hostComponent

hostComponent<P>(tag, factory?): (props) => ReactElement

Defined in: react/components/factory.tsx:31

Builds a React component that maps 1:1 onto a ztui host element.

All props (including children) are forwarded verbatim to the host element; the reconciler’s host-config maps any prop whose name matches a field on the underlying widget. The typed P parameter is purely for authoring DX — it lets callers declare a FooProps interface and get prop-type checking at the call site without hand-writing a destructure-and-respread wrapper per widget.

Pass factory to also register the tag in one step — the common case for a custom widget, so you don’t call registerElement separately:

export const Gauge = hostComponent("ztui-gauge", () => new GaugeWidget());

Registration still lives in the framework-neutral core registry (registerElement from ztui); this is just the React binding wiring it up for you. A binding for another framework (Solid, Vue, …) would call registerElement from its own component factory the same way, so the widget layer never depends on any particular UI framework.

Type Parameters

P

P extends ComponentProps = ComponentProps

Parameters

tag

string

The host element tag, e.g. “ztui-gauge”.

factory?

() => Widget

Optional Widget constructor; when given, the tag is registered.

Returns

(props) => ReactElement