Cannot use +Layout.svelte in svelte kit

konstaui / konsta

Mobile UI components made with Tailwind CSS

MIT License

3.55k stars 131 forks source link

Check that this is really a bug

[X] I confirm

Reproduction link

Bug description

Using a layout is required if you want to build this with sveltekit and have anything useful. When I do so, the slots don't load, and you just get a blank screen.

Expected Behavior

No response

Actual Behavior

No response

Konsta UI version

3.0.1

Platform/Target and Browser Versions

All

Validations

[X] Follow our Code of Conduct
[X] Read the docs.
[X] Check that there isn't already an issue that request the same feature to avoid creating a duplicate.
[X] Make sure this is a Konsta UI issue and not a framework-specific issue

Would you like to open a PR for this bug?

[ ] I'm willing to open a PR

I am using sveltekit 1.5.0, konsta ^3.0.0 and I'm using +layout.svelte with only KonstaUI and everything works fine, the following is an example of one of the layouts, using <slot />:

<script>
    import '$lib/style/app.css';
    import { Notification } from 'konsta/svelte';
    import { App } from 'konsta/svelte';
    import { toastContent, toast } from '$lib/stores/global';
</script>

<App safeAreas theme="ios">
    <slot />

    <Notification
        colors={{ bgIos: $toastContent.color || 'bg-white' }}
        opened={$toastContent}
        title="C-Square"
        subtitle={$toastContent.title}
        text={$toastContent.text}
        class="mt-10"
        onClick={() => toast.hide()}
    />
</App>

Can you check that +layout.svelte has a lower "L" and in case post your code?

konstaui / konsta