typeTable() renders structured contract tables for props, REST parameters and config options: monospace type badges, required stars, deprecated marks and collapsible details. Rows expand through the native <details> element — no JavaScript involved.

Preview

typeTable()

PropType

label*string

Button label.

variant'solid' | 'outline' | 'ghost'

Visual variant.

Default'solid'

sizedeprecated'sm' | 'md' | 'lg'

Default'md'

typeTable({
  label: { type: 'string', required: true, description: 'Button label.' },
  variant: { type: "'solid' | 'outline' | 'ghost'", default: "'solid'", description: 'Visual variant.' },
  size: { type: "'sm' | 'md' | 'lg'", default: "'md'", deprecated: true },
});

Props

The builder takes the contract data and optional labels. Localized pages pass Chinese labels; the <PropsTable> wrapper forwards both.

OptionType

type*Record

Contract data — one entry per parameter, keyed by name.

labelsTypeTableLabels

Header and keyword labels for localized pages.

Default{}

TypeNode.type*string

Short type signature shown on the summary row.

TypeNode.descriptionstring

Field description (inline HTML allowed).

TypeNode.typeDescriptionstring

Full type signature, shown when expanded.

TypeNode.typeDescriptionLinkstring

Optional link attached to the full type signature.

TypeNode.defaultstring

Default value, shown when expanded.

TypeNode.requiredboolean

Render a required star after the name.

Defaultfalse

TypeNode.deprecatedboolean

Strike the name and render a deprecated badge.

Defaultfalse

Notes

• typeTable() is a pure builder: inject with set:html, wrap in <Preview> for live demos, or use the <PropsTable> wrapper directly in MDX.
• Rows expand/collapse natively — no data-cpd-* hooks, no runtime cost.
• Colors inherit the --cpd-* tokens; light/dark is automatic.