From 3541b2458735ce9790dcf4a8df1c40df817a1252 Mon Sep 17 00:00:00 2001
From: braks <78412429+bcakmakoglu@users.noreply.github.com>
Date: Mon, 10 Oct 2022 14:20:20 +0200
Subject: [PATCH] feat(additional-components): add `Panel` component

---
 packages/additional-components/src/index.ts       |  1 +
 .../additional-components/src/panel/Panel.vue     | 15 +++++++++++++++
 packages/additional-components/src/panel/index.ts |  2 ++
 packages/additional-components/src/panel/types.ts | 12 ++++++++++++
 4 files changed, 30 insertions(+)
 create mode 100644 packages/additional-components/src/panel/Panel.vue
 create mode 100644 packages/additional-components/src/panel/index.ts
 create mode 100644 packages/additional-components/src/panel/types.ts

diff --git a/packages/additional-components/src/index.ts b/packages/additional-components/src/index.ts
index 0b2e289a..f70b4fcb 100644
--- a/packages/additional-components/src/index.ts
+++ b/packages/additional-components/src/index.ts
@@ -6,3 +6,4 @@
 export * from './background'
 export * from './controls'
 export * from './minimap'
+export * from './panel'
diff --git a/packages/additional-components/src/panel/Panel.vue b/packages/additional-components/src/panel/Panel.vue
new file mode 100644
index 00000000..267e4aa4
--- /dev/null
+++ b/packages/additional-components/src/panel/Panel.vue
@@ -0,0 +1,15 @@
+<script lang="ts" setup>
+import { useVueFlow } from '@vue-flow/core'
+import type { PanelProps } from './types'
+
+const props = defineProps<PanelProps>()
+
+const pointerEvents = useVueFlow()
+const positionClasses = computed(() => `${props.position}`.split('-'))
+</script>
+
+<template>
+  <div class="vue-flow__panel" :class="positionClasses" :style="{ pointerEvents }">
+    <slot />
+  </div>
+</template>
diff --git a/packages/additional-components/src/panel/index.ts b/packages/additional-components/src/panel/index.ts
new file mode 100644
index 00000000..9ca690ce
--- /dev/null
+++ b/packages/additional-components/src/panel/index.ts
@@ -0,0 +1,2 @@
+export { default as Panel } from './Panel.vue'
+export * from './types'
diff --git a/packages/additional-components/src/panel/types.ts b/packages/additional-components/src/panel/types.ts
new file mode 100644
index 00000000..8aac379b
--- /dev/null
+++ b/packages/additional-components/src/panel/types.ts
@@ -0,0 +1,12 @@
+export enum PanelPosition {
+  TopLeft = 'top-left',
+  TopCenter = 'top-center',
+  TopRight = 'top-right',
+  BottomLeft = 'bottom-left',
+  BottomCenter = 'bottom-center',
+  BottomRight = 'bottom-right',
+}
+
+export interface PanelProps {
+  position: PanelPosition
+}