zakodium-oss / react-science

React components and tools to build scientific applications.
https://react-science.pages.dev
MIT License
2 stars 6 forks source link

Add `Toolbar.MenuItem` or similar? #612

Closed targos closed 7 months ago

targos commented 9 months ago

See use case in NMRium: https://github.com/cheminfo/nmrium/blob/6618ec1f26eec0a2c22bda4a17aae6e5f218c0cc/src/component/toolbar/BasicToolBar.tsx#L231-L247

stropitek commented 8 months ago

Suggested API: Add the Toolbar.PopoverItem component which wraps a Toolbar.Item in a blueprintjs Popover

Used in a toolbar it would look something like this:

<Toolbar>
  <Toolbar.Item />
  <Toolbar.PopoverItem
    itemProps={{
      /* can pass props to configure the toolbar item */
    }}
    /* Can pass any popover props except children */
    content={
      /* Use blueprintjs components here to do the menu */
      <Menu><MenuItem/></Menu>
    }
  />
  <Toolbar.Item />
</Toolbar>

The placement of the menu items with respect to the toolbar should have a sensible default depending if the toolbar is horizontal or vertical (use a context to know about the type of toolbar in the children).

@targos can you review the API proposal?

targos commented 8 months ago

sgtm