alice.pds.demo.boltless.dev
This repository has no description
1<script lang="ts">
2 import type { Snippet } from "svelte";
3 import EmptyState from "./EmptyState.svelte";
4
5 interface Props {
6 title?: string;
7 empty: boolean;
8 emptyMessage: string;
9 listClass?: string;
10 header?: Snippet;
11 footer?: Snippet;
12 children: Snippet;
13 }
14
15 let {
16 title,
17 empty,
18 emptyMessage,
19 listClass = "flex flex-col gap-4",
20 header,
21 footer,
22 children
23 }: Props = $props();
24</script>
25
26<section>
27 {#if title}
28 <h2 class="px-2 pb-4 typography-paragraph-large font-medium">{title}</h2>
29 {/if}
30 {@render header?.()}
31 {#if empty}
32 <EmptyState message={emptyMessage} />
33 {:else}
34 <div class={listClass}>
35 {@render children()}
36 </div>
37 {@render footer?.()}
38 {/if}
39</section>