refactor(minimap): move minimap to separate package

Signed-off-by: braks <78412429+bcakmakoglu@users.noreply.github.com>
2022-12-13 14:53:44 +01:00
parent e44b683b74
commit 281279044c
13 changed files with 594 additions and 10 deletions
@@ -0,0 +1,40 @@
+import type { CSSProperties, Slots } from 'vue'
+import type { MiniMapNodeProps } from './types'
+import { MiniMapSlots } from './types'
+
+export default defineComponent({
+  name: 'MiniMapNode',
+  props: ['id', 'position', 'dimensions', 'strokeWidth', 'strokeColor', 'borderRadius', 'color', 'shapeRendering', 'type'],
+  emits: ['click', 'dblclick', 'mouseenter', 'mousemove', 'mouseleave'],
+  setup(props: MiniMapNodeProps, { attrs, emit }) {
+    const miniMapSlots: Slots = inject(MiniMapSlots)!
+
+    return () => {
+      const style = (attrs.style ?? {}) as CSSProperties
+      const slot = miniMapSlots[`node-${props.type}`]
+
+      if (slot) return slot!(props)
+
+      return h('rect', {
+        id: props.id,
+        class: ['vue-flow__minimap-node', attrs.class].join(' '),
+        style,
+        x: props.position.x,
+        y: props.position.y,
+        rx: props.borderRadius,
+        ry: props.borderRadius,
+        width: props.dimensions.width,
+        height: props.dimensions.height,
+        fill: props.color || (style.background as string) || style.backgroundColor,
+        stroke: props.strokeColor,
+        strokeWidth: props.strokeWidth,
+        shapeRendering: props.shapeRendering,
+        onClick: (e: MouseEvent) => emit('click', e),
+        onDblClick: (e: MouseEvent) => emit('dblclick', e),
+        onMouseenter: (e: MouseEvent) => emit('mouseenter', e),
+        onMousemove: (e: MouseEvent) => emit('mousemove', e),
+        onMouseleave: (e: MouseEvent) => emit('mouseleave', e),
+      })
+    }
+  },
+})