[feat] grid controller

[fabiot21]

closes #38

• [x] controller class
• [X] example
• [x] fix format
• [x] tests
• [x] update README

@cuire please review this PR and change whatever you want.

example of usage -> /examples/add-remove-item

<script lang="ts">
        import Grid, { GridItem, type GridController } from '$lib';

        let items = [
                { id: crypto.randomUUID(), x: 0, y: 0, w: 2, h: 5 },
                { id: crypto.randomUUID(), x: 2, y: 2, w: 2, h: 2 },
                { id: crypto.randomUUID(), x: 2, y: 0, w: 1, h: 2 },
                { id: crypto.randomUUID(), x: 2, y: 6, w: 3, h: 2 },
                { id: crypto.randomUUID(), x: 2, y: 4, w: 2, h: 2 }
        ];

        const itemSize = { height: 40 };

        let gridController: GridController;

        function addNewItem() {
                const w = Math.floor(Math.random() * 2) + 1;
                const h = Math.floor(Math.random() * 5) + 1;
                const newPosition = gridController.getFirstAvailablePosition(w, h);
                items = newPosition
                    ? [...items, { id: crypto.randomUUID(), x: newPosition.x, y: newPosition.y, w, h }]
                    : items;
        }
</script>

<button
    class="btn"
    on:click={addNewItem}>Add New Item</button
>

<Grid {itemSize} cols={10} collision="push" bind:controller={gridController}>
    {#each items as item (item.id)}
        <GridItem id={item.id} bind:x={item.x} bind:y={item.y} bind:w={item.w} bind:h={item.h}>
            <div class="item">{item.id.slice(0, 5)}</div>
        </GridItem>
    {/each}
</Grid>

<style>
    /*..*/
</style>

[cuire]

I went on a short trip, will be back in 3-4 days.

[cuire]

Cool demo I like it a lot 💖

[cuire]

Awesome docs, smart way to export a type that used as an interface 😎