From cef3437c5073a7e983bdfe1d8c2784d78c95bd0d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Keviin=20=C3=85berg=20Kultalahti?= <kevin.aberg@gmail.com>
Date: Mon, 12 Apr 2021 17:10:55 +0200
Subject: [PATCH] Implements ActionMenu component

---
 .../bbui/src/ActionMenu/ActionMenu.svelte     | 30 +++++++++++++++++++
 .../bbui/src/Actions/position_dropdown.js     |  4 +--
 2 files changed, 32 insertions(+), 2 deletions(-)

diff --git a/packages/bbui/src/ActionMenu/ActionMenu.svelte b/packages/bbui/src/ActionMenu/ActionMenu.svelte
index e69de29bb2..33b2fcbdd1 100644
--- a/packages/bbui/src/ActionMenu/ActionMenu.svelte
+++ b/packages/bbui/src/ActionMenu/ActionMenu.svelte
@@ -0,0 +1,30 @@
+<script>
+    import DropdownMenu from '../DropdownMenu/DropdownMenu.svelte'
+    import Menu from '../Menu/Menu.svelte'
+    let anchor;
+    let dropdown;
+
+    // This is needed because display: contents is considered "invisible".
+    // It should only ever be an action button, so should be fine.
+    function getAnchor(node) {
+        anchor = node.firstChild
+    }
+    
+    export const hide = () => { dropdown.hide() }
+    export const show = () => { dropdown.show() }
+</script>
+
+<div class="contents" use:getAnchor  on:click={dropdown.show}>
+    <slot name="button" />
+</div>
+<DropdownMenu bind:this={dropdown} {anchor} align="left">
+    <Menu>
+        <slot />
+    </Menu>
+</DropdownMenu>
+
+<style>
+    div {
+        display: contents;
+    }
+</style>
\ No newline at end of file
diff --git a/packages/bbui/src/Actions/position_dropdown.js b/packages/bbui/src/Actions/position_dropdown.js
index 9bf5a40a67..a25cc1bbd5 100644
--- a/packages/bbui/src/Actions/position_dropdown.js
+++ b/packages/bbui/src/Actions/position_dropdown.js
@@ -18,10 +18,10 @@ export default function positionDropdown(element, { anchor, align }) {
     if (spaceAbove > spaceBelow) {
       positionSide = "bottom"
       maxHeight = spaceAbove - 20
-      y = window.innerHeight - spaceAbove
+      y = window.innerHeight - spaceAbove + 5
     } else {
       positionSide = "top"
-      y = bottom
+      y = bottom + 5
       maxHeight = spaceBelow - 20
     }