Runtime API

These are imported from @opentf/web. (Reactive primitives are also what the macros compile to — prefer the macros in components.)

Reactivity

Export	Description
`signal(initial)`	Create a signal. Read/write via `.value`.
`computed(fn)`	Derived signal, cached.
`effect(fn)`	Run a reactive side effect; returns a disposer.
`batch(fn)`	Group writes into a single update.
`reactive(init)`	Deep reactive store — mutate nested data in place.
`isReactive(v)`	Whether `v` was created by `reactive()`.
`toRawValue(v)`	Underlying plain object for a reactive store.
`snapshot(v)`	Plain deep copy for submit payloads or persistence.

Prefer $state / $derived / $effect in components. Use reactive() for shared stores or nested data you update by mutation.

Routing

Export	Description
`mountApp(options)`	Boot the app: `{ pages, target, guard?, i18n? }`.
`Link`	Client-side navigation anchor (`<Link href="…">`). Localized automatically when i18n is enabled.
`router`	Reactive route facade: `pathname`, `params`, `query`, `locale`, `push`, `replace`.

Internationalization

URL path-prefix locale routing. Enable via mountApp({ i18n: { locales, defaultLocale } }) or the otfw.config i18n block. Messages and formatters live in @opentf/web-i18n.

Export	Signature	Description
`router.locale`	`string \| null`	Active locale (reactive); `null` when i18n is off.
`localizePath(path, locale?)`	`(string, string?) => string`	Prefix `path` for `locale` — default locale stays bare, any existing prefix is replaced. Defaults to the active locale.
`setLocale(locale)`	`(string) => void`	Set `router.locale` without navigating (previews/tests; routed apps derive it from the URL).
`configureI18n(config)`	`({ locales, defaultLocale }) => void`	Register the locales (what `mountApp({ i18n })` calls).
`resolveLocale(pathname)`	`(string) => { locale, path }`	Split a path into its locale and the locale-agnostic route (strips a non-default prefix).

Components & utilities

Export	Description
`ErrorBoundary`	Catches render/mount errors in its subtree and shows a fallback — see Error boundaries.
`Portal`	Renders children into a different DOM location — see Portal.
`RawHtml`	Injects a trusted HTML string.
`createContext(default)`	Context token with a fallback when no provider is found.
`ContextProvider`	`<ContextProvider context={…} value={…}>` — publishes `value` to descendants.
`readContext(ctx)`	Returns the resolved signal (`.value`); `$context` lowers to this in components.
`mount(view, target)`	Imperatively mount a view into an element.