remix replacement

This commit is contained in:
Keviin Åberg Kultalahti 2021-04-23 12:39:48 +02:00
parent 3ac72ec42b
commit b97fe50a4a
1 changed files with 25 additions and 15 deletions

View File

@ -3,7 +3,7 @@
import { store, currentAsset } from "builderStore" import { store, currentAsset } from "builderStore"
import ConfirmDialog from "components/common/ConfirmDialog.svelte" import ConfirmDialog from "components/common/ConfirmDialog.svelte"
import { findComponentParent } from "builderStore/storeUtils" import { findComponentParent } from "builderStore/storeUtils"
import { Popover } from "@budibase/bbui" import { Icon, Popover } from "@budibase/bbui"
import { DropdownContainer, DropdownItem } from "components/common/Dropdowns" import { DropdownContainer, DropdownItem } from "components/common/Dropdowns"
export let component export let component
@ -30,7 +30,7 @@
if (currentIndex === 0) { if (currentIndex === 0) {
return return
} }
const newChildren = parent._children.filter(c => c !== component) const newChildren = parent._children.filter((c) => c !== component)
newChildren.splice(currentIndex - 1, 0, component) newChildren.splice(currentIndex - 1, 0, component)
parent._children = newChildren parent._children = newChildren
store.actions.preview.saveSelected() store.actions.preview.saveSelected()
@ -46,7 +46,7 @@
if (currentIndex === parent._children.length - 1) { if (currentIndex === parent._children.length - 1) {
return return
} }
const newChildren = parent._children.filter(c => c !== component) const newChildren = parent._children.filter((c) => c !== component)
newChildren.splice(currentIndex + 1, 0, component) newChildren.splice(currentIndex + 1, 0, component)
parent._children = newChildren parent._children = newChildren
store.actions.preview.saveSelected() store.actions.preview.saveSelected()
@ -66,56 +66,65 @@
store.actions.components.copy(component, cut) store.actions.components.copy(component, cut)
} }
const pasteComponent = mode => { const pasteComponent = (mode) => {
// lives in store - also used by drag drop // lives in store - also used by drag drop
store.actions.components.paste(component, mode) store.actions.components.paste(component, mode)
} }
</script> </script>
<div bind:this={anchor} on:click|stopPropagation> <div bind:this={anchor} on:click|stopPropagation>
<div class="icon" on:click={dropdown.show}><i class="ri-more-line" /></div> <div class="icon" on:click={dropdown.show}><Icon hoverable name="MoreSmallList" /></div>
<Popover bind:this={dropdown} width="170px" {anchor} align="left"> <Popover bind:this={dropdown} width="170px" {anchor} align="left">
<DropdownContainer on:click={hideDropdown}> <DropdownContainer on:click={hideDropdown}>
<DropdownItem <DropdownItem
icon="ri-delete-bin-line" icon="ri-delete-bin-line"
title="Delete" title="Delete"
on:click={() => confirmDeleteDialog.show()} /> on:click={() => confirmDeleteDialog.show()}
/>
<DropdownItem <DropdownItem
icon="ri-arrow-up-line" icon="ri-arrow-up-line"
title="Move up" title="Move up"
on:click={moveUpComponent} /> on:click={moveUpComponent}
/>
<DropdownItem <DropdownItem
icon="ri-arrow-down-line" icon="ri-arrow-down-line"
title="Move down" title="Move down"
on:click={moveDownComponent} /> on:click={moveDownComponent}
/>
<DropdownItem <DropdownItem
icon="ri-repeat-one-line" icon="ri-repeat-one-line"
title="Duplicate" title="Duplicate"
on:click={duplicateComponent} /> on:click={duplicateComponent}
/>
<DropdownItem <DropdownItem
icon="ri-scissors-cut-line" icon="ri-scissors-cut-line"
title="Cut" title="Cut"
on:click={() => storeComponentForCopy(true)} /> on:click={() => storeComponentForCopy(true)}
/>
<DropdownItem <DropdownItem
icon="ri-file-copy-line" icon="ri-file-copy-line"
title="Copy" title="Copy"
on:click={() => storeComponentForCopy(false)} /> on:click={() => storeComponentForCopy(false)}
/>
<hr class="hr-style" /> <hr class="hr-style" />
<DropdownItem <DropdownItem
icon="ri-insert-row-top" icon="ri-insert-row-top"
title="Paste above" title="Paste above"
disabled={noPaste} disabled={noPaste}
on:click={() => pasteComponent('above')} /> on:click={() => pasteComponent("above")}
/>
<DropdownItem <DropdownItem
icon="ri-insert-row-bottom" icon="ri-insert-row-bottom"
title="Paste below" title="Paste below"
disabled={noPaste} disabled={noPaste}
on:click={() => pasteComponent('below')} /> on:click={() => pasteComponent("below")}
/>
<DropdownItem <DropdownItem
icon="ri-insert-column-right" icon="ri-insert-column-right"
title="Paste inside" title="Paste inside"
disabled={noPaste || noChildrenAllowed} disabled={noPaste || noChildrenAllowed}
on:click={() => pasteComponent('inside')} /> on:click={() => pasteComponent("inside")}
/>
</DropdownContainer> </DropdownContainer>
</Popover> </Popover>
</div> </div>
@ -124,7 +133,8 @@
title="Confirm Deletion" title="Confirm Deletion"
body={`Are you sure you wish to delete this '${definition?.name}' component?`} body={`Are you sure you wish to delete this '${definition?.name}' component?`}
okText="Delete Component" okText="Delete Component"
onOk={deleteComponent} /> onOk={deleteComponent}
/>
<style> <style>
hr { hr {