Remove a pane

Example

Click the button to remove the right pane. The removePane API is available through the useWindow hook, which reads the Window API from the surrounding WindowProvider.



import { Window, WindowProvider, useWindow } from 'react-bwin';
import 'react-bwin/react-bwin.css';

function RemovePane() {
  const { removePane } = useWindow();

  return (
    <div style={{ width: 400, height: 260 }}>
      <button onClick={() => removePane('pane-2')}>Remove pane</button>
      <Window
        fitContainer
        panes={[
          { position: 'left', id: 'pane-1', content: <div>Pane 1</div> },
          {
            position: 'right',
            id: 'pane-2',
            content: <div>Pane 2</div>,
          },
        ]}
      />
    </div>
  );
}

export default function Example() {
  return (
    <WindowProvider>
      <RemovePane />
    </WindowProvider>
  );
}