melon-split-pane

Usage

import React from 'react';
import SplitPane, {Pane} from 'melon-split-pane';
import ReactDOM from 'react-dom';

import './index.styl';

ReactDOM.render(
    <SplitPane direction="horizontal">
        <Pane basis={100} grow={1} shrink={0} min={200} max={500}>a</Pane>
        <Pane>b</Pane>
        <Pane>c</Pane>
    </SplitPane>,
    document.getElementById('app')
);

Setup

webpack

1. please check out this first.

2. npm install -S melon-split-pane

bower

1. bower install -S melon-split-pane

2. config your requirejs / esl

   require.config({
       paths: {
           'melon-split-pane': 'bower_components/melon-split-pane/lib/SplitPane'
       }
   });

API Document

check this out

Run the example

git clone git@github.com:react-melon/melon-split-pane.git
cd melon-split-pane
npm install
npm start
open http://localhost:8080/example

Thanks

Big thanks to BrowserStack for multiple-browsers automation testing!