PropsTable

The reference table a docs page prints for props, options, fields or a request body.

Name Type Default Required Description

url string — Yes The address every probe requests.

intervalSeconds number 60 No How often each region probes.

assertions object — No What a response must satisfy to count as up.

Show child parametersHide child parameters

Name	Type	Default	Required	Description
`status`	`number`	`200`	No	The status code to expect.
`maxLatencyMs`	`number`	—	No	The slowest response that still passes.
`bodyContains`	`string`	—	No	Text the body must include.

View code

tsx

<PropsTable
	aria-label="HTTP monitor fields"
	labels={labels}
	rows={[
		{ name: "url", type: "string", required: true, description: "The address every probe requests." },
		{ name: "method", type: '"GET" | "HEAD" | "POST" | …', default: '"GET"', description: "…" },
		{ name: "assertions", type: "object", description: "…", children: [
			{ name: "status", type: "number", default: "200", description: "The status code to expect." },
		] },
	]}
/>

Demo docs sites

Whole pages built only from @sdxc/ui, each for an invented product with its own palette and type. They open in a new tab.

Every demo, landings and docs sites alike, is listed in the demo gallery.

Installation

An ordinary dependency: install it, import the theme once, and import the component where it is used.

Terminal

npm add @sdxc/ui remix

typescript

import "@sdxc/ui/theme.css";

Usage

typescript

import { PropsTable } from "@sdxc/ui/docs";

Renders the table inside a box that is its own size container. Above 36rem it reads as five columns; at or below, each row stacks with the column label before each value. A long type wraps inside its cell, so the table never widens the page.

Props

Read from the component's own types, so every prop, every default and every allowed value is listed.

Prop	Type	Required	Description
`rows`	`readonly Row[]`	Yes
`labels`	`Labels`	Yes
`"aria-label"`	`string`	No	Names the table for a reader who reaches it without the heading above it.

Also accepts everything in Omit<TagProps<"div">, "children">.