diff --git a/src/components/DropdownMenu.scss b/src/components/DropdownMenu.scss new file mode 100644 index 0000000..f4c509f --- /dev/null +++ b/src/components/DropdownMenu.scss @@ -0,0 +1,46 @@ +@import '../styles.scss'; + +.menu-dropdown { + position: relative; + overflow: visible; + + ul { + margin: 0; + padding: 0; + + li { + margin: 0; + padding: 0; + list-style-type : none; + } + } + + .items { + display: none; + position: absolute; + top: 100%; + left: 0; + background: white; + z-index: 2; + color: $black; + box-shadow: $box-shadow; + + &.visible { + display: block; + } + + button { + width: 100%; + text-align: left; + + &:hover { + background: $background-gray; + } + + &:disabled { + color: $gray; + background: unset; + } + } + } +} diff --git a/src/components/DropdownMenu.svelte b/src/components/DropdownMenu.svelte new file mode 100644 index 0000000..c2c64e8 --- /dev/null +++ b/src/components/DropdownMenu.svelte @@ -0,0 +1,63 @@ + + + + + diff --git a/src/components/JSONEditor.svelte b/src/components/JSONEditor.svelte index 304af46..464e1a4 100644 --- a/src/components/JSONEditor.svelte +++ b/src/components/JSONEditor.svelte @@ -45,8 +45,6 @@ let selection = null let clipboard = null - $: hasSelectionContents = selection != null && selection.paths != null - $: hasClipboardContents = clipboard != null && selection != null $: state = syncState(doc, state, [], (path) => path.length < 1) @@ -209,6 +207,15 @@ } } + function handleInsert() { + + if (selection != null) { + console.log('insert', { selection }) + + // TODO: impelemnt insert + } + } + // TODO: cleanup $: console.log('doc', doc) $: console.log('state', state) @@ -382,6 +389,10 @@ event.preventDefault() handleDuplicate() } + if (combo === 'Ctrl+Insert' || combo === 'Command+Insert') { + event.preventDefault() + handleInsert() + } if (combo === 'Escape') { event.preventDefault() selection = null @@ -433,9 +444,9 @@ searchText={searchText} searchResult={searchResult} bind:showSearch - hasSelectionContents={hasSelectionContents} - hasClipboardContents={hasClipboardContents} - + selection={selection} + clipboard={clipboard} + onCut={handleCut} onCopy={handleCopy} onPaste={handlePaste} diff --git a/src/components/JSONNode.svelte b/src/components/JSONNode.svelte index 74ecca6..df4c1c5 100644 --- a/src/components/JSONNode.svelte +++ b/src/components/JSONNode.svelte @@ -1,6 +1,7 @@