Fix existing issue where command palette sits behinds modals
This commit is contained in:
parent
ce0ad154da
commit
10c5eee87e
|
@ -10,6 +10,7 @@
|
||||||
export let inline = false
|
export let inline = false
|
||||||
export let disableCancel = false
|
export let disableCancel = false
|
||||||
export let autoFocus = true
|
export let autoFocus = true
|
||||||
|
export let zIndex = 999
|
||||||
|
|
||||||
const dispatch = createEventDispatcher()
|
const dispatch = createEventDispatcher()
|
||||||
let visible = fixed || inline
|
let visible = fixed || inline
|
||||||
|
@ -101,7 +102,11 @@
|
||||||
<Portal target=".modal-container">
|
<Portal target=".modal-container">
|
||||||
{#if visible}
|
{#if visible}
|
||||||
<!-- svelte-ignore a11y-no-static-element-interactions -->
|
<!-- svelte-ignore a11y-no-static-element-interactions -->
|
||||||
<div class="spectrum-Underlay is-open" on:mousedown|self={cancel}>
|
<div
|
||||||
|
class="spectrum-Underlay is-open"
|
||||||
|
on:mousedown|self={cancel}
|
||||||
|
style="z-index:{zIndex || 999}"
|
||||||
|
>
|
||||||
<div
|
<div
|
||||||
class="background"
|
class="background"
|
||||||
in:fade={{ duration: 200 }}
|
in:fade={{ duration: 200 }}
|
||||||
|
@ -132,7 +137,6 @@
|
||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
z-index: 999;
|
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
overflow-x: hidden;
|
overflow-x: hidden;
|
||||||
background: transparent;
|
background: transparent;
|
||||||
|
|
|
@ -77,12 +77,6 @@
|
||||||
$: runtimeExpression = readableToRuntimeBinding(enrichedBindings, value)
|
$: runtimeExpression = readableToRuntimeBinding(enrichedBindings, value)
|
||||||
$: requestUpdateEvaluation(runtimeExpression, context)
|
$: requestUpdateEvaluation(runtimeExpression, context)
|
||||||
$: bindingHelpers = new BindingHelpers(getCaretPosition, insertAtPos)
|
$: bindingHelpers = new BindingHelpers(getCaretPosition, insertAtPos)
|
||||||
$: {
|
|
||||||
// Ensure a valid side panel option is always selected
|
|
||||||
if (sidePanel && !sidePanelOptions.includes(sidePanel)) {
|
|
||||||
sidePanel = sidePanelOptions[0]
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const debouncedUpdateEvaluation = Utils.debounce((expression, context) => {
|
const debouncedUpdateEvaluation = Utils.debounce((expression, context) => {
|
||||||
expressionResult = processStringSync(expression || "", context)
|
expressionResult = processStringSync(expression || "", context)
|
||||||
|
|
|
@ -188,7 +188,7 @@
|
||||||
{/if}
|
{/if}
|
||||||
|
|
||||||
<svelte:window on:keydown={handleKeyDown} />
|
<svelte:window on:keydown={handleKeyDown} />
|
||||||
<Modal bind:this={commandPaletteModal}>
|
<Modal bind:this={commandPaletteModal} zIndex={999999}>
|
||||||
<CommandPalette />
|
<CommandPalette />
|
||||||
</Modal>
|
</Modal>
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue