diff --git a/frontend/src/components/DeletePaletteEntryModal.svelte b/frontend/src/components/DeletePaletteEntryModal.svelte
new file mode 100644
index 0000000..32e66ec
--- /dev/null
+++ b/frontend/src/components/DeletePaletteEntryModal.svelte
@@ -0,0 +1,33 @@
+
+
+ open = false}
+ on:click:button--secondary={() => open = false}
+ on:submit={() => {
+ open = false
+ // TODO
+ //file.push(new RemoveSwatchUndoable(paletteIndex, replaceWithSwatch ? replaceIndex : -1))
+ }}
+>
+
+ {#if replaceWithSwatch}
+
+
+ {/if}
+
\ No newline at end of file
diff --git a/frontend/src/sections/Palette.svelte b/frontend/src/sections/Palette.svelte
index 2ec39ef..df29239 100644
--- a/frontend/src/sections/Palette.svelte
+++ b/frontend/src/sections/Palette.svelte
@@ -3,6 +3,8 @@
import { ReplaceSwatchUndoable, type LoadedFile, AddSwatchUndoable, MoveSwatchUndoable } from '../types/file'
import { createEventDispatcher } from 'svelte'
import type { Undoable } from '../types/undo'
+ import { ContextMenu, ContextMenuOption, OverflowMenu, OverflowMenuItem } from 'carbon-components-svelte';
+ import DeletePaletteEntryModal from '../components/DeletePaletteEntryModal.svelte'
export let file: LoadedFile
let lastFile: LoadedFile
@@ -47,6 +49,9 @@
}
function paletteClick(event: MouseEvent) {
+ if (event.button === 2) {
+ return
+ }
const target = event.target as HTMLSpanElement
const index = parseInt(target.getAttribute('x-index') || '0')
if (event.shiftKey) {
@@ -124,6 +129,19 @@
}
}
}
+
+ let showDeleteDialog: boolean = false
+ let targetIndex: number = -1
+ function onContextMenu(e: CustomEvent) {
+ targetIndex = parseInt((e.detail as HTMLSpanElement).getAttribute('x-index') || '-1')
+ }
+ function showDeleteSwatchDialog(e: CustomEvent) {
+ showDeleteDialog = true
+ }
+
+ // These are entry refs for sharing the ContextMenu.
+ let _refs = []
+ $: refs = _refs.filter(Boolean)
@@ -136,13 +154,17 @@
{/if}
{#if swatchIndex !== draggingIndex}
-
+
{swatchIndex}
{/if}
{/each}
+
+
+
+