blitzwing/cobalt-7
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

web/dialog: internal refactor

Browse source
This commit is contained in:
dumbmoron 2024-07-22 09:24:17 +00:00 committed by wukko
parent 9787a04e19
commit 705fac16a6
No known key found for this signature in database
GPG key ID: 3E30B3F26C7B4AA2
3 changed files with 14 additions and 33 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
web/src/components/dialog/DialogHolder.svelte
View file

@ -9,22 +9,11 @@
<div id="dialog-holder">
{#each $dialogs as dialog}
{#if dialog.type === "small"}
<SmallDialog
id={dialog.id}
title={dialog.title}
meowbalt={dialog.meowbalt}
icon={dialog.icon}
bodyText={dialog.bodyText}
bodySubText={dialog.bodySubText}
buttons={dialog.buttons}
/>
{@const { type, ...data } = dialog}
{#if type === "small"}
<SmallDialog {...data} />
{:else if dialog.type === "picker"}
<PickerDialog
id={dialog.id}
items={dialog.items}
buttons={dialog.buttons}
/>
<PickerDialog {...data} />
{/if}
{/each}
<div id="dialog-backdrop" class:visible={backdropVisible}></div>

16
web/src/components/dialog/PickerDialog.svelte
View file

@ -15,8 +15,8 @@
import IconBoxMultiple from "@tabler/icons-svelte/IconBoxMultiple.svelte";
export let id: string;
export let items: Optional<DialogPickerItem[]>;
export let buttons: Optional<DialogButton[]>;
export let items: Optional<DialogPickerItem[]> = undefined;
export let buttons: Optional<DialogButton[]> = undefined;
let dialogDescription = "dialog.picker.description.";
@ -50,14 +50,6 @@
open = true;
});
}
// item id for alt text
let counter = 0;
const itemNumber = () => {
counter++
return counter
}
</script>
<dialog
@ -81,8 +73,8 @@
</div>
<div class="picker-body">
{#if items}
{#each items as item}
<PickerItem {item} number={itemNumber()} />
{#each items as item, i}
<PickerItem {item} number={i + 1} />
{/each}
{/if}
</div>

12
web/src/components/dialog/SmallDialog.svelte
View file

@ -13,12 +13,12 @@
import IconAlertTriangle from "@tabler/icons-svelte/IconAlertTriangle.svelte";
export let id: string;
export let meowbalt: Optional<MeowbaltEmotions>;
export let icon: Optional<SmallDialogIcons>;
export let title: string = "";
export let bodyText: string = "";
export let bodySubText: string = "";
export let buttons: Optional<DialogButton[]>;
export let meowbalt: Optional<MeowbaltEmotions> = undefined;
export let icon: Optional<SmallDialogIcons> = undefined;
export let title = "";
export let bodyText = "";
export let bodySubText = "";
export let buttons: Optional<DialogButton[]> = undefined;
let dialogParent: HTMLDialogElement;