jsx-runtime.ts

Source

escapeHtml

function

Escapes HTML special characters to prevent XSS.

Source

function escapeHtml(str: string): string

Returns

string -

toHtmlAttr

function

Converts a camelCase attribute name to kebab-case for HTML. Special handling for data- and aria- attributes.

Source

function toHtmlAttr(name: string): string

Returns

string -

renderAttr

function

Renders an attribute value to a string.

Source

function renderAttr(name: string, value: unknown): string

Returns

string -

JSXElementType

type

JSX element type - either a string (intrinsic) or a function component.

Source

JSXChild

type

Valid JSX child types.

Source

JSXNode

interface

JSX node - the result of JSX expressions.

Source

JSXProps

interface

Props with children.

Source

renderChildren

function

Renders children to HTML string.

Source

function renderChildren(children: JSXChild): string

Returns

string -

jsx

function

Creates a JSX element. This is the core function called by the JSX transform.

Source

export function jsx(
  type: JSXElementType,
  props: JSXProps,
  _key?: string,
  ): JSXNode

Returns

JSXNode -

jsxs

function

Creates a JSX element with static children. Called by the JSX transform for elements with multiple children.

Source

export function jsxs(
  type: JSXElementType,
  props: JSXProps,
  key?: string,
  ): JSXNode

Returns

JSXNode -

Fragment

function

Fragment component - renders children without a wrapper element.

Source

Returns

JSXNode -

renderToString

function

Renders a JSX node to an HTML string.

Source

export function renderToString(node: JSXNode): string

Returns

string -

raw

function

Creates raw HTML without escaping. Use with caution - only for trusted content.

Source

export function raw(html: string): JSXNode

Returns

JSXNode -

Examples

<div>{raw('<strong>Bold</strong>')}</div>

when

function

Conditionally renders content.

Source

export function when(condition: boolean, content: JSXNode): JSXNode

Returns

JSXNode -

Examples

{when(isLoggedIn, <UserMenu />)}

each

function

Maps over an array and renders each item.

Source

Returns

JSXNode -

Examples

{each(items, (item) => <li>{item.name}</li>)}