TypeError: Class constructor SvelteMasonryInfiniteGrid cannot be invoked without 'new'

[kaanyalova]

Description

When I try to use any of the examples in the https://naver.github.io/egjs-infinitegrid/Guides#masonryinfinitegrid using Svelte 5 i get this error

TypeError: Class constructor SvelteMasonryInfiniteGrid cannot be invoked without 'new'
    at _page (/home/kaan/Belgeler/svelte-/src/routes/+page.svelte:30:85)
    at /home/kaan/Belgeler/svelte-/.svelte-kit/generated/root.svelte:45:41
    at Module.slot (/home/kaan/Belgeler/svelte-/node_modules/svelte/src/internal/server/index.js:413:3)
    at _layout (/home/kaan/Belgeler/svelte-/src/routes/+layout.svelte:22:24)
    at Root (/home/kaan/Belgeler/svelte-/.svelte-kit/generated/root.svelte:44:40)
    at Module.render (/home/kaan/Belgeler/svelte-/node_modules/svelte/src/internal/server/index.js:116:2)
    at Function._render [as render] (/home/kaan/Belgeler/svelte-/node_modules/svelte/src/legacy/legacy-server.js:26:18)
    at Module.render_response (/home/kaan/Belgeler/svelte-/node_modules/@sveltejs/kit/src/runtime/server/page/render.js:171:29)
    at async Module.render_page (/home/kaan/Belgeler/svelte-/node_modules/@sveltejs/kit/src/runtime/server/page/index.js:286:10)
    at async resolve (/home/kaan/Belgeler/svelte-/node_modules/@sveltejs/kit/src/runtime/server/respond.js:446:18)

Steps to check or reproduce

Create a new svelte 5 app using bun create svelte@latest Add the library using bun install @egjs/svelte-infinitegrid Try to use any of the examples

[kaanyalova]

Manually passing a GridClass to InfiniteGrid seems to work

<script>

    import { MasonryInfiniteGrid as GridClass } from '@egjs/infinitegrid';
    import { InfiniteGrid } from '@egjs/svelte-infinitegrid';

    let items = getItems(0, 10);

    function getItems(nextGroupKey, count) {
        const nextItems = [];

        for (let i = 0; i < count; ++i) {
            const nextKey = nextGroupKey * count + i;

            nextItems.push({ groupKey: nextGroupKey, key: nextKey });
        }
        return nextItems;
    }
</script>

<InfiniteGrid
    {GridClass}
    class="container"
    gap={5}
    {items}
    on:requestAppend={({ detail: e }) => {
        const nextGroupKey = (+e.groupKey || 0) + 1;

        items = [...items, ...getItems(nextGroupKey, 10)];
    }}
    let:visibleItems
>
    {#each visibleItems as item (item.key)}
        <div class="item">
            <div class="thumbnail">
                <img
                    width="250"
                    src={`https://naver.github.io/egjs-infinitegrid/assets/image/${(item.key % 33) + 1}.jpg`}
                    alt="egjs"
                />
            </div>
            <div class="info">{`egjs ${item.key}`}</div>
        </div>
    {/each}
</InfiniteGrid>

Other class based Svelte components don't work because class based components were deprecated in Svelte 5. https://svelte-5-preview.vercel.app/docs/breaking-changes