src/Splitter.js
// Wrap children into Panes and adds divider between them
Wrap children into Panes and adds divider between them
Wrap children into Panes and adds divider between them
function wrapChildren() {
    const arr = [];
    const count = React.Children.count(children);
    const arrChildren = React.Children.toArray(children);
    if (count > 0) {
      arr.push(
        <Pane key="pane-0" vertical={vertical}>
          {arrChildren[0]}
        </Pane>
      );
      if (count > 1) {
        const sty = {};
        if (vertical) sty.height = `${DIVIDER_SIZE}px`;
        else sty.width = `${DIVIDER_SIZE}px`;
        arr.push(
          <div
            key="divider"
            className={resizing ? "divider resizing" : "divider"}
            onMouseDown={() => setResizing(true)}
            style={sty}
          >
            <div />
          </div>
        );
        const secondPaneStyle = { flexBasis };
        arr.push(
          <Pane key="pane-1" vertical={vertical} style={secondPaneStyle}>
            {arrChildren[1]}
          </Pane>
        );
      }
    }
    return arr;
  }
function wrapChildren ( ) { const arr = [ ] ; const count = React . Children . count ( children ) ; const arrChildren = React . Children . toArray ( children ) ; if ( count > 0 ) { arr . push ( < Pane key = "pane-0" vertical = { vertical } > { arrChildren [ 0 ] } < / Pane > ) ; if ( count > 1 ) { const sty = { } ; if ( vertical ) sty . height = ` ${ DIVIDER_SIZE } ` ; else sty . width = ` ${ DIVIDER_SIZE } ` ; arr . push ( < div key = "divider" className = { resizing ? "divider resizing" : "divider" } onMouseDown = { ( ) => setResizing ( true ) } style = { sty } > < div / > < / div > ) ; const secondPaneStyle = { flexBasis } ; arr . push ( < Pane key = "pane-1" vertical = { vertical } style = { secondPaneStyle } > { arrChildren [ 1 ] } < / Pane > ) ; } } return arr ; }
Wrap children into Panes and adds divider between them
Wrap children into Panes and adds divider between them
// add divider // and set the second pane size via css flex-basis