feat: MiniMapNode slot

# What's changed?

* Add a slot to minimap nodes to allow customizing the node content
* slots receive current node position and dimensions to position elements and selected + dragging params
This commit is contained in:
Braks
2022-04-13 22:48:23 +02:00
parent 79ede4cf84
commit 567ce96640
4 changed files with 12 additions and 18 deletions
@@ -84,8 +84,7 @@ export default {
class="vue-flow__minimap"
>
<template v-for="node of store.getNodes" :key="`mini-map-node-${node.id}`">
<slot
:name="`node-${node.type}`"
<MiniMapNode
:position="node.computedPosition"
:dimensions="node.dimensions"
:style="node.style"
@@ -96,18 +95,14 @@ export default {
:stroke-width="props.nodeStrokeWidth"
:shape-rendering="shapeRendering"
>
<MiniMapNode
<slot
:name="`node-${node.type}`"
:position="node.computedPosition"
:dimensions="node.dimensions"
:style="node.style"
:class="nodeClassNameFunc(node)"
:color="nodeColorFunc(node)"
:border-radius="props.nodeBorderRadius"
:stroke-color="nodeStrokeColorFunc(node)"
:stroke-width="props.nodeStrokeWidth"
:shape-rendering="shapeRendering"
:selected="node.selected"
:dragging="node.dragging"
/>
</slot>
</MiniMapNode>
</template>
<path class="vue-flow__minimap-mask" :d="d" :fill="props.maskColor" fill-rule="evenodd" />
</svg>
@@ -18,6 +18,7 @@ export default {
<template>
<rect
class="vue-flow__minimap-node"
:class="attrs.class"
:x="props.position.x"
:y="props.position.y"
:rx="props.borderRadius"
@@ -29,4 +30,5 @@ export default {
:stroke-width="props.strokeWidth"
:shape-rendering="props.shapeRendering"
/>
<slot />
</template>
@@ -1,6 +1,3 @@
// These components are not used by vue flow directly
// but the user can add them as children of a vue flow component
export { default as MiniMap } from './MiniMap/MiniMap.vue'
export { default as Controls } from './Controls/Controls.vue'
export { default as Background } from './Background/Background.vue'