budibase/packages/bbui/src/ActionMenu/ActionMenu.svelte

43 lines
823 B
Svelte
Raw Normal View History

2021-04-12 17:10:55 +02:00
<script>
2021-04-23 09:41:49 +02:00
import Popover from "../Popover/Popover.svelte"
import Menu from "../Menu/Menu.svelte"
export let supressOpen = false
2021-04-23 09:41:49 +02:00
let anchor
let dropdown
2021-04-12 17:10:55 +02:00
2021-04-23 09:41:49 +02:00
// 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()
}
const closeOnClickWrapper = (cb) => {
dropdown.hide()
cb()
}
2021-04-12 17:10:55 +02:00
</script>
<div class="contents" use:getAnchor>
2021-04-23 09:41:49 +02:00
<slot name="button" />
2021-04-12 17:10:55 +02:00
</div>
<Popover bind:this={dropdown} {anchor} align="left">
2021-04-23 09:41:49 +02:00
<Menu>
2021-04-26 14:31:32 +02:00
<slot open={show} closeOnClick={closeOnClickWrapper} />
2021-04-23 09:41:49 +02:00
</Menu>
</Popover>
2021-04-12 17:10:55 +02:00
<style>
2021-04-23 09:41:49 +02:00
div {
display: contents;
}
</style>