60 lines
1.6 KiB
Svelte
60 lines
1.6 KiB
Svelte
<label class="form-label">{label}</label>
|
|
|
|
<WrappedSelect placeholder="Select panel..." items={panels} optionIdentifier="panel_id" nameMapper={labelMapper}
|
|
bind:selectedValue={selectedRaw} on:input={update} on:clear={handleClear} {isMulti} {isSearchable} />
|
|
|
|
<script>
|
|
import {onMount} from "svelte";
|
|
import WrappedSelect from "./WrappedSelect.svelte";
|
|
|
|
export let label;
|
|
export let panels;
|
|
export let selected;
|
|
export let isMulti = true;
|
|
export let isSearchable = false;
|
|
|
|
let selectedRaw = isMulti ? panels.filter((p) => selected.includes(p.panel_id)) : selected;
|
|
|
|
function labelMapper(panel) {
|
|
return panel.title || "";
|
|
}
|
|
|
|
function update() {
|
|
if (selectedRaw === undefined) {
|
|
selectedRaw = [];
|
|
}
|
|
|
|
if (isMulti) {
|
|
selected = selectedRaw.map((panel) => panel.panel_id);
|
|
} else {
|
|
if (selectedRaw) {
|
|
selected = selectedRaw.panel_id;
|
|
} else {
|
|
selected = undefined;
|
|
}
|
|
}
|
|
}
|
|
|
|
function handleClear() {
|
|
if (isMulti) {
|
|
selected = [];
|
|
} else {
|
|
selected = undefined;
|
|
}
|
|
}
|
|
|
|
function applyOverrides() {
|
|
if (isMulti) {
|
|
//selected = [];
|
|
selectedRaw = panels.filter((p) => selected.includes(p.panel_id));
|
|
} else {
|
|
if (selectedRaw) {
|
|
selectedRaw = selectedRaw.panel_id;
|
|
}
|
|
}
|
|
}
|
|
|
|
onMount(() => {
|
|
applyOverrides();
|
|
});
|
|
</script> |