feat: support generics on snippets (#2761)

* feat: support generics on snippets

* chore: remove log

* adjust grammar (holy shit that was fucked up)

---------

Co-authored-by: Simon Holthausen <[email protected]>

Author: paoloricciuti

packages/svelte-vscode/syntaxes/svelte.tmLanguage.src.yaml

@@ -234,11 +234,38 @@ repository:
   special-tags-modes:
     patterns:
     # Expressions or simple values.
-    - begin: (?<=(if|key|then|catch|snippet|html|render).*?)\G
+    - begin: (?<=(if|key|then|catch|html|render).*?)\G
       end: (?=})
       name: meta.embedded.expression.svelte source.ts
       patterns: [ include: source.ts ]
 
+    # Snippet blocks - special because of how source.ts will parse generics: If it realizes "oh this is a function definition" it will
+    # go into arrow function parsing mode and not stop until it finds a `=>`, which means it will go past the `}` snippet open boundary
+    # and fuck up the rest of the file syntax highlighting
+    - begin: (?<=snippet.*?)\G
+      end: (?=})
+      name: meta.embedded.expression.svelte source.ts
+      patterns:
+        # Match an identifier, but only if it is before a generic
+        - match: \G\s*([_$[:alpha:]][_$[:alnum:]]*)\s*(?=<)
+          captures:
+            1: { name: entity.name.function.ts }
+        # Match optional `<` ... `>` with inner as source.ts
+        - begin: (?<=<)
+          end: (?=>)
+          contentName: meta.type.parameters.ts
+          patterns: [ include: source.ts ]
+        # Match the `(...)` but not starting at `(` because then TS would see it as an arrow function and parse past our snippet open boundary
+        - begin: (?<=>\s*\()
+          end: (?=})
+          name: meta.embedded.expression.svelte source.ts
+          patterns: [ include: source.ts ]
+        # If the above three don't match (because there's no generic) then this one kicks in
+        - begin: \G
+          end: (?=})
+          name: meta.embedded.expression.svelte source.ts
+          patterns: [ include: source.ts ]
+
     # Const.
     - begin: (?<=const.*?)\G
       end: (?=})

packages/svelte2tsx/src/htmlxtojsx_v2/nodes/SnippetBlock.ts

@@ -116,7 +116,7 @@ export function handleSnippet(
             'const ',
             [snippetBlock.expression.start, snippetBlock.expression.end],
             IGNORE_POSITION_COMMENT,
-            ' = ('
+            ` = ${snippetBlock.typeParams ? `<${snippetBlock.typeParams}>` : ''}(`
         ];
 
         if (parameters) {

packages/svelte2tsx/test/svelte2tsx/samples/snippet-generics.v5/expectedv2.ts

@@ -0,0 +1,17 @@
+///<reference types="svelte" />
+;function $$render() {
+  const generic/*Ωignore_positionΩ*/ = <T extends string>(val: T)/*Ωignore_startΩ*/: ReturnType<import('svelte').Snippet>/*Ωignore_endΩ*/ => { async ()/*Ωignore_positionΩ*/ => {
+	val;
+};return __sveltets_2_any(0)};  const complex_generic/*Ωignore_positionΩ*/ = <T extends { bracket: "<" } | "<" | Set<"<>">>(val: T)/*Ωignore_startΩ*/: ReturnType<import('svelte').Snippet>/*Ωignore_endΩ*/ => { async ()/*Ωignore_positionΩ*/ => {
+	val;
+};return __sveltets_2_any(0)};
+;
+async () => {
+
+
+
+};
+return { props: /** @type {Record<string, never>} */ ({}), exports: {}, bindings: "", slots: {}, events: {} }}
+const Input__SvelteComponent_ = __sveltets_2_isomorphic_component(__sveltets_2_partial(__sveltets_2_with_any_event($$render())));
+/*Ωignore_startΩ*/type Input__SvelteComponent_ = InstanceType<typeof Input__SvelteComponent_>;
+/*Ωignore_endΩ*/export default Input__SvelteComponent_;

packages/svelte2tsx/test/svelte2tsx/samples/snippet-generics.v5/input.svelte

@@ -0,0 +1,10 @@
+<script lang="ts">
+</script>
+
+{#snippet generic<T extends string>(val: T)}
+	{val}
+{/snippet}
+
+{#snippet complex_generic<T extends { bracket: "<" } | "<" | Set<"<>">>(val: T)}
+	{val}
+{/snippet}