update: mini map to accept node slot instead of "nodes" slot

* some type updates

Signed-off-by: Braks <78412429+bcakmakoglu@users.noreply.github.com>
This commit is contained in:
Braks
2021-11-18 18:17:00 +01:00
parent a493168daf
commit 3e24a3585a
3 changed files with 18 additions and 6 deletions

View File

@@ -6,7 +6,7 @@ export interface ControlButtonProps extends ButtonHTMLAttributes {}
const props: any = defineProps<ControlButtonProps>()
</script>
<template>
<button :class="['vue-flow__controls-button']" v-bind="props">
<button class="vue-flow__controls-button" v-bind="props">
<slot></slot>
</button>
</template>

View File

@@ -90,8 +90,20 @@ const d = computed(() => {
:viewBox="`${viewBox.x || 0} ${viewBox.y || 0} ${viewBox.width || 0} ${viewBox.height || 0}`"
class="vue-flow__minimap"
>
<slot name="mini-map-nodes" :nodes="nodes" :view-box="viewBox">
<template v-for="(node, i) of nodes" :key="`mini-map-node-${i}`">
<template v-for="node of nodes" :key="`mini-map-node-${node.id}`">
<slot
:x="node.__rf.position.x"
:y="node.__rf.position.y"
:width="node.__rf.width"
:height="node.__rf.height"
:style="node.style"
:class="nodeClassNameFunc(node)"
:color="nodeColorFunc(node)"
:border-radius="props.nodeBorderRadius"
:stroke-color="nodeStrokeColorFunc(node)"
:stroke-width="props.nodeStrokeWidth"
:shape-rendering="shapeRendering"
>
<MiniMapNode
:x="node.__rf.position.x"
:y="node.__rf.position.y"
@@ -105,8 +117,8 @@ const d = computed(() => {
:stroke-width="props.nodeStrokeWidth"
:shape-rendering="shapeRendering"
/>
</template>
</slot>
</slot>
</template>
<path class="vue-flow__minimap-mask" :d="d" :fill="props.maskColor" fill-rule="evenodd" />
</svg>
</template>

View File

@@ -8,7 +8,7 @@ interface MiniMapNodeProps {
height?: number
borderRadius?: number
color?: string
shapeRendering?: 'auto' | 'optimizeSpeed' | 'crispEdges' | 'geometricPrecision' | 'inherit'
shapeRendering?: CSSProperties['shapeRendering']
strokeColor?: string
strokeWidth?: number
}