Allow snippet to use animate directive

[Refzlund]

Describe the problem

This is currently not allowed:

{#snippet test(item)}
    <div animate:flip>{item}</div>
{/snippet}

{#each arr as item (item)}
    {@render test(item)}
{/each}

This would be useful if you for instance, make a snippet that renders a list of items;

{#snippet test(item)}
    <div animate:flip>{item}</div>
{/snippet}

{#snippet list(array, itemSnippet)}
    {#each arr as item (item)}
        {@render itemSnippet(item)}
    {/each}
{/snippet}

{@render list(arr, test)}

As a practical example; I'm working on a drag-and-drop library runic-reorder which utilises above strategy.

This way of working with snippets expands the ease of use for design choices when creating a library.

I bring this up, as I noticed on Svelte Playground that snippets are a lot like regular elements, and attaching $.animation(div_1, () => flip, null); within a snippet might be feasable🙏

Describe the proposed solution

{#snippet test(item)}
    <div animate:flip>{item}</div>
{/snippet}

{#each arr as item (item)}
    {@render itemSnippet(item)}
{/each}

or in compiled version words

// snippet
const test = ($$anchor, item = $.noop) => {
    var div = root_1();
    var text = $.child(div, true);

    $.reset(div);
    $.template_effect(() => $.set_text(text, item()));
    $.animation(div, () => flip, null); // this
    $.append($$anchor, div);
};

Importance

would make my life easier

[Refzlund]

I've created a branch feat: enable animate directive for snippets. If this feature is a no-go, let me know🦒