Baseline

A compact UI component that summarizes feature support across tools/engines.

Renders a summary row with a title, followed by grouped tool badges indicating support (checkmark) and optional labels. Useful for compatibility sections and release notes.

Props

  • title
    string
    Required
    The title displayed in the summary row.
  • href
    string
    Optional link for the entire block. When provided, the whole summary area becomes a link. Clicking the link will not toggle the disclosure.
  • target
    React.HTMLAttributeAnchorTarget

    Optional target attribute for the link.

  • rel
    string

    Optional rel attribute for the link.

  • toolGroups
    array of $$array
    Required

    Groups of tools shown as rounded clusters. Each inner array is rendered as a separate group, and each BaselineTool becomes an item with an icon and optional label/checkmark state.

<Baseline

  title="Node.js Support"

  toolGroups={[

    [

      {

        label: 'Bun',

        supported: true,

        tool: 'bun'

      },

      {

        label: 'npm',

        supported: true,

        tool: 'npm'

      },

      {

        label: 'pnpm',

        supported: false,

        tool: 'pnpm'

      }

    ]

  ]}

/>
Built with