[POC] HTML / CSS layouting investigation

[ThomThomson]

Intro

It may be possible to build a layouting solution which can meet our needs using no external libraries at all. We should investigate this possibility as part of our layout engine investigation

This proof of concept was built as a space time, in 3 days. While this solution has checked off some of the requirements below, it is still very far from a complete proof of concept for this solution. To be considered proof that this direction is viable for Kibana, we need the following features:

Feature Requirements

Beta Give feedback

1. Drag and drop positioning of panels in a grid
2. Clearly visible positioning on drop. (grid guidelines)
3. Collision detection between panels
4. The ability to support Kibana's existing 48 column layout. (customizable column counts)
5. Compaction algorithm (we should reverse-engineer this from an existing layout engine)
6. Panel reordering algorithm (we should reverse-engineer this from an existing layout engine)
7. Drag to resize from bottom right of panel
8. The ability to drag a panel from one grid to another (required for collapsible panels)
9. The ability for grids to expand when a panel is dragged near the bottom

With these features in place, we can build a demo of many panels on a page with multiple collapsible sections, show the demo to internal stakeholders, and determine whether or not to move this solution into Kibana.

[elasticmachine]

Pinging @elastic/kibana-presentation (Team:Presentation)

[ThomThomson]

Closing this as complete. The POC has been a success, with all required features demonstrated.

This PR will introduce the new engine into Kibana in the form of an example plugin.

The project to make Collapsable Panels possible on Dashboards with this new engine can be followed here