fix: fix to generate variable name (#53)

Author: baseballyama

.changeset/purple-wolves-add.md

@@ -0,0 +1,5 @@
+---
+'svelte-preprocess-delegate-events': patch
+---
+
+fix to generate variable name

src/preprocess/index.js

@@ -29,12 +29,14 @@ const collectUsedVars = (parsed) => {
  * @returns {string}
  */
 const getUniqueVarName = (usedVarNames, name) => {
+  // Remove chars that can not use for variable name.
+  const normalized = name.replace(/[^a-zA-Z_$]|^(\d)/g, '_');
   let i = 0;
   while (usedVarNames.has(`${name}${i}`)) {
     i++;
   }
-  usedVarNames.add(`${name}${i}`);
-  return `${name}${i}`;
+  usedVarNames.add(`${normalized}${i}`);
+  return `${normalized}${i}`;
 };
 
 /**

test/fixture/element-svelte:element/input.svelte

@@ -0,0 +1,5 @@
+<script>
+  export let tag = 'p';
+</script>
+
+<svelte:element this={tag} on:*>Click Me</svelte:element>

test/fixture/element-svelte:element/output.svelte

@@ -0,0 +1,12 @@
+<script>
+  import { boundElements } from 'svelte-preprocess-delegate-events/runtime';
+  import { registerDelegatedEvents } from 'svelte-preprocess-delegate-events/runtime';
+  import { get_current_component } from 'svelte/internal';
+  export let tag = 'p';
+
+  const svelte_element0 = boundElements();
+  const component0 = get_current_component();
+  $: registerDelegatedEvents(svelte_element0.bounds, component0, (handler) => handler, {});
+</script>
+
+<svelte:element this={tag} bind:this={svelte_element0.bounds}>Click Me</svelte:element>