Collapsible button group in block editor

[kristofferjs]

• Auto-collapsing groups in toolbar when needed
• Insert menu supports not being collapsed
• Display a "show menu" button when there is no room for all
• Touch scrolling in mobile with paper-cut-shadow™ to show scrollability

[skogsmaskin]

I get a studio crash when trying to put the editor in fullscreen (this was with example-studio):

Stack trace:
Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

Check the render method of `Component`.
    at invariant (/static/js/vendor.bundle.js:6457:15)
    at createFiberFromTypeAndProps (/static/js/vendor.bundle.js:16619:11)
    at createFiberFromElement (/static/js/vendor.bundle.js:16640:15)
    at createChild (/static/js/vendor.bundle.js:18427:28)
    at reconcileChildrenArray (/static/js/vendor.bundle.js:18678:25)
    at reconcileChildFibers (/static/js/vendor.bundle.js:19001:14)
    at reconcileChildren (/static/js/vendor.bundle.js:20804:28)
    at updateHostComponent (/static/js/vendor.bundle.js:21265:3)
    at beginWork (/static/js/vendor.bundle.js:22051:14)
    at performUnitOfWork (/static/js/vendor.bundle.js:25714:12)
Component stack:
    in div (created by Component)
    in div (created by Component)
    in Component (created by Measure)
    in Measure (created by Toolbar)
    in Toolbar (created by BlockEditor)
    in div (created by BlockEditor)
    in div (created by BlockEditor)
    in Escapable (created by Stacked)
    in Stacked (created by StackedEscapable)
    in StackedEscapable (created by BlockEditor)
    in Portal (created by BlockEditor)
    in div (created by BlockEditor)
    in BlockEditor (created by BlockEditorInput)
    in div (created by BlockEditorInput)
    in BlockEditorInput (created by SyncWrapper)
    in div (created by SyncWrapper)
    in SyncWrapper (created by withPatches(SyncWrapper))
    in withPatches(SyncWrapper) (created by FunkyEditor)
    in div (created by FunkyEditor)
    in FunkyEditor (created by FormBuilderInput)
    in div (created by FormBuilderInput)
    in FormBuilderInput (created by Field)
    in div (created by Field)
    in Field (created by ObjectInput)
    in div (created by ObjectInput)
    in ObjectInput (created by FormBuilderInput)
    in div (created by FormBuilderInput)
    in FormBuilderInput (created by SanityFormBuilder)
    in FormBuilderContext (created by SanityFormBuilderContext)
    in SanityFormBuilderContext (created by SanityFormBuilder)
    in SanityFormBuilder (created by Editor)
    in form (created by Editor)
    in div (created by Editor)
    in div (created by Pane)
    in div (created by ScrollContainer)
    in ScrollContainer (created by Pane)
    in div (created by Pane)
    in div (created by Pane)
    in Pane (created by Styleable(Pane))
    in Styleable(Pane) (created by Editor)
    in Editor (created by withRouter(Editor))
    in withRouter(Editor) (created by EditorPane)
    in EditorPane (created by withDocumentType(EditorPane))
    in withDocumentType(EditorPane) (created by Pane)
    in Pane (created by DeskToolPanes)
    in SplitPaneWrapper (created by DeskToolPanes)
    in div
    in Pane
    in div
    in SplitPane (created by PanesSplitController)
    in div (created by PanesSplitController)
    in div
    in Pane
    in div
    in SplitPane (created by PanesSplitController)
    in div (created by PanesSplitController)
    in div
    in Pane
    in div
    in SplitPane (created by PanesSplitController)
    in div (created by PanesSplitController)
    in PanesSplitController (created by DeskToolPanes)
    in DeskToolPanes (created by DeskTool)
    in div (created by DeskTool)
    in DeskTool (created by withRouter(DeskTool))
    in withRouter(DeskTool) (created by DeskToolPaneStateSyncer)
    in DeskToolPaneStateSyncer (created by RenderTool)
    in RenderTool (created by SchemaErrorReporter)
    in RouteScope (created by SchemaErrorReporter)
    in div (created by SchemaErrorReporter)
    in div (created by SchemaErrorReporter)
    in div (created by SchemaErrorReporter)
    in SchemaErrorReporter (created by DefaultLayout)
    in DefaultLayout (created by withRouter(DefaultLayout))
    in withRouter(DefaultLayout) (created by DefaultLayoutContainer)
    in RouterProvider (created by DefaultLayoutContainer)
    in LoginWrapper (created by DefaultLayoutContainer)
    in DefaultLayoutContainer (created by SanityRoot)
    in div (created by SanityRoot)
    in SanityRoot
    in AppContainer

[skogsmaskin]

Also get some warnings about missing React keys:

react-dom.development.js:506 Warning: Each child in a list should have a unique "key" prop. See https://fb.me/react-warning-keys for more information.
    in InsertMenu (created by PrimaryGroup)
    in div (created by PrimaryGroup)
    in div (created by PrimaryGroup)
    in PrimaryGroup (created by Component)
    in div (created by Component)
    in div (created by Component)
    in div (created by Component)
    in Component (created by Measure)
    in Measure (created by Toolbar)
    in Toolbar (created by BlockEditor)

[skogsmaskin]

Looks really promising! Please fix the above issues, and I'll look closer!

[kristofferjs]

Cool!. Will test and debug in example studio

[kristofferjs]

Did some fixes. Should also work in example-studio now.

[skogsmaskin]

@kristofferj - great work!

I'm approving if you remove the flow-bin update to package.json. Not sure which implications it will have.

[kristofferjs]

@skogsmaskin done

[skogsmaskin]

Approved!

[kristofferjs]

Cool. I wait until after the release to merge it, since I want it to be tested more before we merge.