'use strict'
!(function(require, directRequire) {
  const a = require('react'),
    b = require('lodash')
  class c extends a.Component {
    constructor(a) {
      super(a),
        (this.handleMouseDown = a => {
          const b = (this.curEdge = a.target.dataset.edge),
            c = 'left' === b || 'right' === b
          ;(this.startInfo[this.curEdge] = {
            width: c ? this.container.offsetWidth : 0,
            height: c ? 0 : this.container.offsetHeight,
            x: a.clientX,
            y: a.clientY
          }),
            (this.resizing = !0),
            this.document.addEventListener('mousemove', this.handleMouseMove),
            this.props.onResizeStart && this.props.onResizeStart(a)
        }),
        (this.handleMouseMove = a => {
          return this.accept
            ? void ((this.accept = !1),
              'left' === this.curEdge
                ? (this.container.style.width =
                    this.startInfo[this.curEdge].width +
                    this.startInfo[this.curEdge].x -
                    a.clientX +
                    'px')
                : 'right' === this.curEdge
                  ? (this.container.style.width =
                      this.startInfo[this.curEdge].width +
                      a.clientX -
                      this.startInfo[this.curEdge].x +
                      'px')
                  : 'top' === this.curEdge
                    ? (this.container.style.height =
                        this.startInfo[this.curEdge].height +
                        this.startInfo[this.curEdge].y -
                        a.clientY +
                        'px')
                    : 'bottom' === this.curEdge &&
                      (this.container.style.height =
                        this.startInfo[this.curEdge].height +
                        a.clientY -
                        this.startInfo[this.curEdge].y +
                        'px'),
              this.props.onResize && this.props.onResize(a))
            : void setTimeout(() => (this.accept = !0), 10)
        }),
        (this.handleMouseUp = a => {
          this.resizing &&
            (this.document.removeEventListener(
              'mousemove',
              this.handleMouseMove
            ),
            (this.resizing = !1),
            this.props.onResizeStop &&
              this.props.onResizeStop(
                a,
                this.container.offsetWidth,
                this.container.offsetHeight
              ))
        }),
        (this.assignRef = a => {
          ;(this.container = a), this.props.innerRef && this.props.innerRef(a)
        }),
        (this.resizing = !1),
        (this.resizerLStyle = {
          position: 'absolute',
          width: '10px',
          height: '100%',
          top: '0px',
          left: '-5px',
          cursor: 'col-resize'
        }),
        (this.resizerRStyle = {
          position: 'absolute',
          width: '10px',
          height: '100%',
          top: '0px',
          right: '-5px',
          cursor: 'col-resize'
        }),
        (this.resizerTStyle = {
          position: 'absolute',
          width: '100%',
          height: '10px',
          top: '-5px',
          left: '0',
          cursor: 'row-resize'
        }),
        (this.resizerBStyle = {
          position: 'absolute',
          width: '100%',
          height: '10px',
          bottom: '-5px',
          left: '0',
          cursor: 'row-resize'
        }),
        (this.curEdge = ''),
        (this.startInfo = {}),
        (this.state = { mounted: !1 })
    }
    componentDidMount() {
      this.state.mounted ||
        ((this.document = this.getDocumentElement(this.container)),
        this.document.addEventListener('mouseup', this.handleMouseUp),
        this.setState({ mounted: !0 }))
    }
    getDocumentElement(a) {
      return a.parentElement ? this.getDocumentElement(a.parentElement) : a
    }
    render() {
      const c = this.props.leftResizable
          ? a.createElement('div', {
              style: this.resizerLStyle,
              onMouseDown: this.handleMouseDown,
              'data-edge': 'left'
            })
          : null,
        d = this.props.rightResizable
          ? a.createElement('div', {
              style: this.resizerRStyle,
              onMouseDown: this.handleMouseDown,
              'data-edge': 'right'
            })
          : null,
        e = this.props.topResizable
          ? a.createElement('div', {
              style: this.resizerTStyle,
              onMouseDown: this.handleMouseDown,
              'data-edge': 'top'
            })
          : null,
        f = this.props.bottomResizable
          ? a.createElement('div', {
              style: this.resizerBStyle,
              onMouseDown: this.handleMouseDown,
              'data-edge': 'bottom'
            })
          : null,
        g = b.merge(
          {
            position: 'relative',
            width: this.props.width || 'auto',
            height: this.props.height || 'auto',
            boxSizing: 'border-box'
          },
          this.props.style || {}
        )
      return a.createElement(
        'div',
        {
          ref: this.assignRef,
          className: this.props.className || '',
          style: g
        },
        this.props.children,
        c,
        d,
        e,
        f
      )
    }
  }
  module.exports = c
})(require('lazyload'), require)
