Add UD Split pane.

src/UniversalDashboard/Controls/src/splitpane.ps1

@@ -0,0 +1,38 @@
+function New-UDSplitPane {
+    param(
+        [Parameter()]
+        [string]$Id = (New-Guid).ToString(),
+        [Parameter(Mandatory)]
+        [ScriptBlock]$Content,
+        [Parameter()]
+        [ValidateSet("vertical", "horizontal")]
+        [string]$Direction = "vertical",
+        [Parameter()]
+        [int]$MinimumSize,
+        [Parameter()]
+        [int]$DefaultSize
+    )
+
+    $Children = & $Content
+
+    if ($Children.Length -ne 2) {
+        throw "Split pane requires exactly two components in Content"
+    }
+
+    $Options = @{
+        content = $Children
+        id = $Id
+        split = $Direction
+        type = "ud-splitpane"
+    }
+
+    if ($PSCmdlet.MyInvocation.BoundParameters.ContainsKey("MinimumSize")) {
+        $Options["minSize"] = $MinimumSize
+    }
+
+    if ($PSCmdlet.MyInvocation.BoundParameters.ContainsKey("DefaultSize")) {
+        $Options["defaultSize"] = $DefaultSize
+    }
+
+    $Options
+}

src/client/package.json

@@ -38,6 +38,7 @@
     "react-redux": "5.0.7",
     "react-router-dom": "4.3.1",
     "react-spinkit": "^3.0.0",
+    "react-split-pane": "^0.1.87",
     "react-treebeard": "^2.1.0",
     "redux-thunk": "2.3.0",
     "tslib": "^1.9.3",

src/client/src/app/services/render-service.jsx

@@ -14,6 +14,9 @@ const UdDateTimeComponent = React.lazy(() => import('./../basics/datetime.jsx' /
 const UdElementComponent = React.lazy(() => import('./../ud-element.jsx' /* webpackChunkName: "ud-element" */))
 const UdIcon = React.lazy(() => import( './../ud-icon.jsx' /* webpackChunkName: "ud-icon" */))
 
+import UDSplitPane from './../ud-splitpane';
+UniversalDashboard.register("ud-splitpane", UDSplitPane);
+
 export function internalRenderComponent(component, history) {
     if (!component) return null;
 

src/client/src/app/ud-splitpane.jsx

@@ -0,0 +1,16 @@
+import React from 'react';
+import SplitPane from 'react-split-pane';
+
+export default class UDSplitPane extends React.Component {
+    render() {
+        var { content } = this.props;
+
+        if (content.length !== 2) {
+            throw "Split pane supports exactly two components."
+        }
+
+        var children = this.content.map(x => UniversalDashboard.renderComponent(x));
+
+        return <SplitPane {...props}>{children}</SplitPane>
+    }
+}