React components

This page shows a sample customer React component.


Component example

Clicks: 0

Code sample

import * as React from 'react';

export function Counter() {
  const [count, setCount] = React.useState(0);

  return (
    <div style={{ border: '1px solid red', padding: '10px' }}>
      <div style={{ fontSize: '18px', marginBottom: '10px' }}>
        Clicks: <strong>{count}</strong>
      </div>
      <button onClick={() => setCount(count + 1)}> Click </button>
    </div>
  );
}

Usage in MDX:

import { Counter } from '../components/Counter.tsx'

<Counter />