1<script lang="ts">
2 import * as Dialog from '$lib/components/ui/dialog';
3 import { ChatSettings } from '$lib/components/app';
4
5 interface Props {
6 onOpenChange?: (open: boolean) => void;
7 open?: boolean;
8 }
9
10 let { onOpenChange, open = false }: Props = $props();
11
12 let chatSettingsRef: ChatSettings | undefined = $state();
13
14 function handleClose() {
15 onOpenChange?.(false);
16 }
17
18 function handleSave() {
19 onOpenChange?.(false);
20 }
21
22 $effect(() => {
23 if (open && chatSettingsRef) {
24 chatSettingsRef.reset();
25 }
26 });
27</script>
28
29<Dialog.Root {open} onOpenChange={handleClose}>
30 <Dialog.Content
31 class="z-999999 flex h-[100dvh] max-h-[100dvh] min-h-[100dvh] flex-col gap-0 rounded-none p-0
32 md:h-[64vh] md:max-h-[64vh] md:min-h-0 md:rounded-lg"
33 style="max-width: 48rem;"
34 >
35 <ChatSettings bind:this={chatSettingsRef} onSave={handleSave} />
36 </Dialog.Content>
37</Dialog.Root>