es6 syntax parenthesis make this short but cant understand

Question

I am looking at a library (react-resizable). Never seen this syntax before and my google-fu is weak.

comments are helping me understand what the code does, but the syntax is such that I dont really understand how it's doing it.

// What we're doing here is getting the child of this element, and cloning it with this element's props.
// We are then defining its children as:
// Its original children (resizable's child's children), and
// A draggable handle.

return (0, _cloneElement2.default)(children, _extends({}, p, {
  className: className,
  children: [children.props.children, _react2.default.createElement(
    _reactDraggable.DraggableCore,
    _extends({}, draggableOpts, {
      key: 'resizableHandle',
      onStop: this.resizeHandler('onResizeStop'),
      onStart: this.resizeHandler('onResizeStart'),
      onDrag: this.resizeHandler('onResize')
    }),
    _react2.default.createElement('span', { className: 'react-resizable-handle' })
  )]
}));