Split View

Simple react split view component with a draggable separator. Easy to add in your favorite project. Lightweight library.

How to install Split View component

With NPM as package manager

NPM below 5.0.0

npm install --save @ashxjs/split-view

NPM above 5.0.0

npm install @ashxjs/split-view

With Yarn as package manager

yarn add @ashxjs/split-view

Using Split-View component

Easy to use

import LeftComponent from "./LeftComponent";
import RightComponent from "./RightComponent";

<>
    <SplitView
        left={LeftComponent}
        right={RightComponent}
        defaultLeftPanelWidth={"33vw"}
        />
</>

Component Props

Props name Default value Description
left none Left component to render
right none Right component to render
defaultLeftPanelWidth none Initialize the default left panel size when component first render

GitHub

View Github