1
0
Fork 0
mirror of synced 2024-10-03 10:36:59 +13:00

converts component dropdown to action

This commit is contained in:
Keviin Åberg Kultalahti 2021-04-26 12:29:45 +02:00
parent 0b0dd3cbea
commit 21ee564f5b

View file

@ -3,7 +3,7 @@
import { store, currentAsset } from "builderStore"
import ConfirmDialog from "components/common/ConfirmDialog.svelte"
import { findComponentParent } from "builderStore/storeUtils"
import { Icon, Popover } from "@budibase/bbui"
import { ActionMenu, MenuItem, MenuSection, Icon, Popover } from "@budibase/bbui"
import { DropdownContainer, DropdownItem } from "components/common/Dropdowns"
export let component
@ -72,62 +72,20 @@
}
</script>
<div bind:this={anchor} on:click|stopPropagation>
<div class="icon" on:click={dropdown.show}><Icon hoverable name="MoreSmallList" /></div>
<Popover bind:this={dropdown} width="170px" {anchor} align="left">
<DropdownContainer on:click={hideDropdown}>
<DropdownItem
icon="ri-delete-bin-line"
title="Delete"
on:click={() => confirmDeleteDialog.show()}
/>
<DropdownItem
icon="ri-arrow-up-line"
title="Move up"
on:click={moveUpComponent}
/>
<DropdownItem
icon="ri-arrow-down-line"
title="Move down"
on:click={moveDownComponent}
/>
<DropdownItem
icon="ri-repeat-one-line"
title="Duplicate"
on:click={duplicateComponent}
/>
<DropdownItem
icon="ri-scissors-cut-line"
title="Cut"
on:click={() => storeComponentForCopy(true)}
/>
<DropdownItem
icon="ri-file-copy-line"
title="Copy"
on:click={() => storeComponentForCopy(false)}
/>
<hr class="hr-style" />
<DropdownItem
icon="ri-insert-row-top"
title="Paste above"
disabled={noPaste}
on:click={() => pasteComponent("above")}
/>
<DropdownItem
icon="ri-insert-row-bottom"
title="Paste below"
disabled={noPaste}
on:click={() => pasteComponent("below")}
/>
<DropdownItem
icon="ri-insert-column-right"
title="Paste inside"
disabled={noPaste || noChildrenAllowed}
on:click={() => pasteComponent("inside")}
/>
</DropdownContainer>
</Popover>
</div>
<ActionMenu bind:this={dropdown}>
<div slot="button" class="icon" on:click={dropdown.show}>
<Icon s hoverable name="MoreSmallList" />
</div>
<MenuItem icon="Delete" on:click={confirmDeleteDialog.show}>Delete</MenuItem>
<MenuItem icon="ChevronUp" on:click={moveUpComponent}>Move up</MenuItem>
<MenuItem icon="ChevronDown" on:click={moveDownComponent}>Move down</MenuItem>
<MenuItem icon="Duplicate" on:click={duplicateComponent}>Duplicate</MenuItem>
<MenuItem icon="Cut" on:click={() => storeComponentForCopy(true)}>Cut</MenuItem>
<MenuItem icon="Copy" on:click={() => storeComponentForCopy(false)}>Copy</MenuItem>
<MenuItem icon="LayersBringToFront" on:click={() => pasteComponent("above")} disabled={noPaste}>Paste above</MenuItem>
<MenuItem icon="LayersSendToBack" on:click={() => pasteComponent("below")} disabled={noPaste}>Paste below</MenuItem>
<MenuItem icon="ShowOneLayer" on:click={() => pasteComponent("inside")} disabled={noPaste || noChildrenAllowed}>Paste inside</MenuItem>
</ActionMenu>
<ConfirmDialog
bind:this={confirmDeleteDialog}
title="Confirm Deletion"