refactor(webui): typed Selector events
This commit is contained in:
parent
fe516edf85
commit
940c0553ad
8 changed files with 17 additions and 13 deletions
|
@ -26,8 +26,8 @@
|
||||||
|
|
||||||
$: if (adding && selector) selector.focus();
|
$: if (adding && selector) selector.focus();
|
||||||
|
|
||||||
async function add(ev: CustomEvent<SelectorValue>) {
|
async function add(ev: CustomEvent<SelectorValue | undefined>) {
|
||||||
if (ev.detail.t !== 'Address') {
|
if (ev.detail?.t !== 'Address') {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
dispatch('add', ev.detail.c);
|
dispatch('add', ev.detail.c);
|
||||||
|
|
|
@ -50,8 +50,8 @@
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
async function add(ev: CustomEvent<SelectorValue>) {
|
async function add(ev: CustomEvent<SelectorValue | undefined>) {
|
||||||
if (!$entity || ev.detail.t !== 'Attribute') {
|
if (!$entity || ev.detail?.t !== 'Attribute') {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -229,9 +229,9 @@
|
||||||
resizeObserver.observe(viewEl as any);
|
resizeObserver.observe(viewEl as any);
|
||||||
});
|
});
|
||||||
|
|
||||||
async function onSelectorInput(ev: CustomEvent<SelectorValue>) {
|
async function onSelectorInput(ev: CustomEvent<SelectorValue | undefined>) {
|
||||||
const value = ev.detail;
|
const value = ev.detail;
|
||||||
if (value.t !== 'Address') return;
|
if (value?.t !== 'Address') return;
|
||||||
const address = value.c;
|
const address = value.c;
|
||||||
|
|
||||||
const [xValue, yValue] = selectorCoords as any;
|
const [xValue, yValue] = selectorCoords as any;
|
||||||
|
@ -261,7 +261,7 @@
|
||||||
types={['Attribute', 'NewAttribute']}
|
types={['Attribute', 'NewAttribute']}
|
||||||
initial={x ? { t: 'Attribute', name: x } : undefined}
|
initial={x ? { t: 'Attribute', name: x } : undefined}
|
||||||
on:input={(ev) => {
|
on:input={(ev) => {
|
||||||
if (ev.detail.t === 'Attribute') x = ev.detail.name;
|
if (ev.detail?.t === 'Attribute') x = ev.detail.name;
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
<div class="value">
|
<div class="value">
|
||||||
|
@ -277,7 +277,7 @@
|
||||||
types={['Attribute', 'NewAttribute']}
|
types={['Attribute', 'NewAttribute']}
|
||||||
initial={y ? { t: 'Attribute', name: y } : undefined}
|
initial={y ? { t: 'Attribute', name: y } : undefined}
|
||||||
on:input={(ev) => {
|
on:input={(ev) => {
|
||||||
if (ev.detail.t === 'Attribute') y = ev.detail.name;
|
if (ev.detail?.t === 'Attribute') y = ev.detail.name;
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
<div class="value">
|
<div class="value">
|
||||||
|
|
|
@ -28,7 +28,7 @@
|
||||||
lastSearched = lastSearched.slice(0, 10);
|
lastSearched = lastSearched.slice(0, 10);
|
||||||
}
|
}
|
||||||
|
|
||||||
async function onInput(event: CustomEvent<SelectorValue>) {
|
async function onInput(event: CustomEvent<SelectorValue | undefined>) {
|
||||||
const value = event.detail;
|
const value = event.detail;
|
||||||
if (!value) return;
|
if (!value) return;
|
||||||
|
|
||||||
|
|
|
@ -20,7 +20,7 @@
|
||||||
$: if (editing && selector) selector.focus();
|
$: if (editing && selector) selector.focus();
|
||||||
$: if (!focus && !hover) editing = false;
|
$: if (!focus && !hover) editing = false;
|
||||||
|
|
||||||
function onInput(ev: CustomEvent<SelectorValue>) {
|
function onInput(ev: CustomEvent<SelectorValue | undefined>) {
|
||||||
newValue = ev.detail;
|
newValue = ev.detail;
|
||||||
selector.focus();
|
selector.focus();
|
||||||
}
|
}
|
||||||
|
|
|
@ -93,7 +93,10 @@
|
||||||
import debug from 'debug';
|
import debug from 'debug';
|
||||||
import Spinner from './Spinner.svelte';
|
import Spinner from './Spinner.svelte';
|
||||||
|
|
||||||
const dispatch = createEventDispatcher();
|
const dispatch = createEventDispatcher<{
|
||||||
|
input: SelectorValue | undefined;
|
||||||
|
focus: boolean;
|
||||||
|
}>();
|
||||||
const dbg = debug('kestrel:Selector');
|
const dbg = debug('kestrel:Selector');
|
||||||
let selectorEl: HTMLElement;
|
let selectorEl: HTMLElement;
|
||||||
|
|
||||||
|
|
|
@ -123,7 +123,7 @@
|
||||||
|
|
||||||
$: if (adding && addSelector) addSelector.focus();
|
$: if (adding && addSelector) addSelector.focus();
|
||||||
|
|
||||||
function addEntity(ev: CustomEvent<SelectorValue>) {
|
function addEntity(ev: CustomEvent<SelectorValue | undefined>) {
|
||||||
dbg('Adding entity', ev.detail);
|
dbg('Adding entity', ev.detail);
|
||||||
const addAddress = ev.detail?.t == 'Address' ? ev.detail.c : undefined;
|
const addAddress = ev.detail?.t == 'Address' ? ev.detail.c : undefined;
|
||||||
if (!addAddress) return;
|
if (!addAddress) return;
|
||||||
|
|
|
@ -364,7 +364,8 @@
|
||||||
<div class="cell mark-attribute">
|
<div class="cell mark-attribute">
|
||||||
<Selector
|
<Selector
|
||||||
types={['Attribute', 'NewAttribute']}
|
types={['Attribute', 'NewAttribute']}
|
||||||
on:input={(ev) => (newEntryAttribute = ev.detail?.name)}
|
on:input={(ev) =>
|
||||||
|
(newEntryAttribute = ev.detail?.t === 'Attribute' ? ev.detail?.name : '')}
|
||||||
on:focus={(ev) => (addFocus = ev.detail)}
|
on:focus={(ev) => (addFocus = ev.detail)}
|
||||||
keepFocusOnSet
|
keepFocusOnSet
|
||||||
bind:this={newAttrSelector}
|
bind:this={newAttrSelector}
|
||||||
|
|
Loading…
Reference in a new issue