<ControlButton />

<ControlButton /> コンポーネントを使用してコントロールパネルにボタンを追加し、<Controls /> コンポーネントの子として渡すことができます。

import { MagicWand } from '@radix-ui/react-icons'
import { ReactFlow,  Controls, ControlButton } from '@xyflow/react'
 
export default function Flow() {
  return (
    <ReactFlow nodes={[...]} edges={[...]}>
      <Controls>
        <ControlButton onClick={() => alert('Something magical just happened. ✨')}>
          <MagicWand />
        </ControlButton>
      </Controls>
    </ReactFlow>
  )
}

プロパティ

<ControlButton /> コンポーネントは、HTMLの <button /> 要素で有効な任意のプロパティを受け入れます。

コンポーネント型