<!--
    Component: ThemeDecorator
    Storybook decorator that initializes ThemeManager for theme-related stories.
    Ensures theme management works correctly in Storybook's iframe environment.
-->
<script lang="ts">
import { themeManager } from '$features/ChangeAppTheme';
import {
    onDestroy,
    onMount,
} from 'svelte';

interface Props {
    children: import('svelte').Snippet;
}

let { children }: Props = $props();

// Initialize themeManager on mount
onMount(() => {
    themeManager.init();
});

// Clean up themeManager when story unmounts
onDestroy(() => {
    themeManager.destroy();
});
</script>

{@render children()}
