Studio: use accordions in SchemaBasedArray.svelte to make browsing more easy

This commit is contained in:
Pieter Vander Vennet 2024-06-19 00:29:19 +02:00
parent f2e3888a56
commit 62944c3883
4 changed files with 39 additions and 26 deletions

View file

@ -6,6 +6,7 @@
import type { ConfigMeta } from "./configMeta"
import EditLayerState from "./EditLayerState"
import SchemaBasedInput from "./SchemaBasedInput.svelte"
import AccordionSingle from "../Flowbite/AccordionSingle.svelte"
export let state: EditLayerState
export let configs: ConfigMeta[]
@ -25,15 +26,15 @@
{:else if configs.length === 0}
Bug: Region received empty list as configuration at {path.join(".")}
{:else if title}
<div class="flex w-full flex-col">
<h3>{title}</h3>
<div class="flex w-full flex-col gap-y-1 border border-black pl-2">
<slot name="description" />
{#each configsFiltered as config}
<SchemaBasedInput {state} path={config.path} schema={config} />
{/each}
</div>
</div>
<AccordionSingle>
<div slot="header">{title}</div>
<div class="flex w-full flex-col gap-y-1 border border-black pl-2">
<slot name="description" />
{#each configsFiltered as config}
<SchemaBasedInput {state} path={config.path} schema={config} />
{/each}
</div>
</AccordionSingle>
{:else}
<div class="flex w-full flex-col gap-y-1 pl-2">
{#each configsFiltered as config}