/split-ui

Primary LanguageTypeScriptMIT LicenseMIT

split-ui

A React component library for creating resizable panel layouts with flexible sizing options and SSR support.

Bundle Js @split-ui/react

Quick Start

Installation

npm install @split-ui/react
# or
pnpm add @split-ui/react

Basic Usage

import { Panel, Resizer } from '@split-ui/react';
import '@split-ui/react/styles.css';

function App() {
  return (
    <Panel group orientation="horizontal" style={{ height: '100vh' }}>
      <Panel initialSize="200px">Sidebar</Panel>
      <Resizer />
      <Panel>Main Content</Panel>
      <Resizer />
      <Panel initialSize="25%">Right Panel</Panel>
    </Panel>
  );
}

Documentation

  • Interactive examples
  • Complete API reference
  • Implementation guides
  • Comparison with other libraries

License

MIT © Jan Potoms

Links