Rnd has multiple children now, ref can point to sth. else

src/widget/editable-widget-container.js

@@ -76,28 +76,16 @@ class EditableWidgetContainer extends React.Component {
 
     /* hand over new dimensions to child element so that the rotation is displayed correctly
     *  already before the dashboard changes are saved
-    */
+    
     if (this.props.widget.type === 'Line') {
       this.refs.child0.illustrateDuringEdit(widget.width, widget.height);
-    }
+    }*/
   };
 
   render() {
     const widget = this.props.widget;
-    let isLine = false;
     let children = null;
 
-    // clone WidgetLine child element so that it can be referenced while resizing
-    if (widget.type === 'Line') {
-      isLine = true;
-
-      children = React.Children.map(this.props.children,
-        (child, index) => React.cloneElement(child, {
-          ref: `child${index}`
-        })
-      );
-    }
-
     let resizingRestricted = false;
     if (widget.customProperties.resizeRightLeftLock || widget.customProperties.resizeTopBottomLock) {
       resizingRestricted = true;
@@ -122,29 +110,6 @@ class EditableWidgetContainer extends React.Component {
       'locked': widget.isLocked
     });
 
-    if (isLine) {
-      return <Rnd
-        ref={c => { this.rnd = c; }}
-        default={{ x: Number(widget.x), y: Number(widget.y), width: widget.width, height: widget.height }}
-        minWidth={widget.minWidth}
-        minHeight={widget.minHeight}
-        maxWidth={widget.customProperties.maxWidth || '100%'}
-        lockAspectRatio={Boolean(widget.customProperties.lockAspect)}
-        bounds={'parent'}
-        className={widgetClasses}
-        onResizeStart={this.borderWasClicked}
-        onResizeStop={this.resizeStop}
-        onDragStop={this.dragStop}
-        dragGrid={gridArray}
-        resizeGrid={gridArray}
-        zindex={widget.z}
-        enableResizing={resizing}
-        disableDragging={widget.isLocked}
-      >
-        {children}
-      </Rnd>;
-    }
-
     return <Rnd
       ref={c => { this.rnd = c; }}
       default={{ x: Number(widget.x), y: Number(widget.y), width: widget.width, height: widget.height }}

src/widget/widget-context-menu.js

@@ -90,7 +90,7 @@ class WidgetContextMenu extends React.Component {
   render() {
     const isLocked = this.props.widget.locked;
     const ContextMenu = () => (
-      <Menu id={'widgetMenu'+ this.props.index} style={{zIndex: 1000}}>
+      <Menu id={'widgetMenu'+ this.props.index} style={{zIndex: 1000, display: 'inline-block'}}>
       <Item disabled={isLocked} onClick={this.editWidget}>Edit</Item>
       <Item disabled={isLocked} onClick={this.deleteWidget}>Delete</Item>
 
@@ -108,8 +108,8 @@ class WidgetContextMenu extends React.Component {
       </Menu>
   );
 
-    return <div>
-    <MenuProvider id={'widgetMenu'+ this.props.index}>
+    return <div style={{display: "inline-block"}}>
+    <MenuProvider id={'widgetMenu'+ this.props.index} style={{display: 'inline-block'}}>
     <Widget
               data={this.props.widget}
               onWidgetChange={this.props.onWidgetChange}