36 lines
714 B
Svelte
36 lines
714 B
Svelte
<script lang="ts">
|
|
import Dropdown from '$lib/components/ui/Dropdown.svelte';
|
|
import { Palette } from 'lucide-svelte';
|
|
import { AVAILABLE_THEMES } from '$lib/utils/themes';
|
|
|
|
let {
|
|
value = 'none',
|
|
onValueChange,
|
|
color
|
|
}: {
|
|
value?: string;
|
|
onValueChange: (theme: string) => void;
|
|
color?: string | null;
|
|
} = $props();
|
|
|
|
const themeItems = $derived(
|
|
Object.entries(AVAILABLE_THEMES).map(([key, theme]) => ({
|
|
value: key,
|
|
label: theme.name
|
|
}))
|
|
);
|
|
</script>
|
|
|
|
<Dropdown
|
|
items={themeItems}
|
|
selectedValue={value}
|
|
onSelect={onValueChange}
|
|
{color}
|
|
showCheckmark={true}
|
|
ariaLabel="Select theme pattern"
|
|
>
|
|
{#snippet icon()}
|
|
<Palette class="h-[1.2rem] w-[1.2rem]" />
|
|
{/snippet}
|
|
</Dropdown>
|