bcakmakoglu / vue-flow

A highly customizable Flowchart component for Vue 3. Features seamless zoom & pan πŸ”Ž, additional components like a Minimap πŸ—Ί and utilities to interact with state and graph.

Home Page:https://vueflow.dev/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

πŸ› [BUG]: Can no longer add classes to `MiniMap` in order to place other elements in the same `Panel`

snoozbuster opened this issue Β· comments

Is there an existing issue for this?

  • I have searched the existing issues and this is a new bug.

Current Behavior

Prior to @vueflow/minimap@1.3.0, I was able to write code similar to the following (using Bootstrap utilities to reset margin and position):

<Panel>
  <MiniMap class="position-static m-0" />
  <!-- other stuff -->
</Panel>

in order to put the minimap inside the same panel as other components. I used this for an effect like so:
image

In 1.3.0, classes are no longer applied to the Panel, but instead to the svg inside the Panel. Additionally, there is no way to add additional contents to the Panel such as via a slot or to use the MiniMap without a wrapping Panel.

Expected Behavior

I should be able to include a minimap alongside additional content in the same floating panel.

Steps To Reproduce

see code above

Relevant log output

No response

Anything else?

No response

Mh... You could just do Controls position="bottom-right" to have them on the same position.
Is it a hard requirement to put these in the same Panel? πŸ€”

This change could be reverted though but if a different solution is possible, I'd prefer that πŸ˜…

the two panels overlap if you put them both in the same position. Also, these controls are a custom set of buttons. Yes, this is a hard requirement for me.

There are a number of solutions which don't involve a revert - exposing the minimap component separate from the wrapping panel, adding a slot to the minimap, or adding a prop to the minimap which allows classes to be placed directly on the panel. Any of these would be sufficient for my usecase.

Well yeah, but wrapping it in a Panel isn't preventing Panels overlapping.
You put a third Panel around 2 components that already use a panel, so I'm not sure how "overlap" is the issue here?

I'mma be real with you, looking back at this I'm not even sure why I changed it in the first place.
This change will be reverted πŸ€·β€β™‚οΈ

Reverted in 1.29.0