bugfix no Tooltip for elements with same node name

src/routes/model/+page.svelte

@@ -26,6 +26,7 @@
         description: string;
         bind:string;
     }
+
     class SettingsSwitch implements SettingsUi{
         readonly type="switch";
         label:string;
@@ -37,6 +38,7 @@
             this.description = description;
         }
     }
+
     class SettingsSelector implements SettingsUi{
         readonly type="selector";
         label:string;
@@ -355,28 +357,28 @@
     <Modal isOpen={open} toggle={toggle} scrollable>
         <ModalHeader toggle={toggle}>{modalModule.name} settings</ModalHeader>
         <ModalBody>
-            {#each modalModule.html as element}
+            {#each modalModule.html as element, index}
                 {#if element.type=="switch"}
-                    <Input id={element.label} type="switch" label="{formatLabel(element.label)}" bind:checked={element.bind.value} on:change={()=>checkModalChanged()}/>
-                    <Tooltip target={element.label} placement="left">
+                    <Input id="uiElement{index}" type="switch" label="{formatLabel(element.label)}" bind:checked={element.bind.value} on:change={()=>checkModalChanged()}/>
+                    <Tooltip target="uiElement{index}" placement="left">
                         {element.description}
                     </Tooltip>
                 {:else if element.type=="label"}
                     <h3>{formatLabel(element.label)}</h3>
                 {:else if element.type =="selector"}
                     <h6>{formatLabel(element.label)}</h6>
-                    <Input id={element.label} type="select" bind:value={element.bind.value} on:change={()=>checkModalChanged()}>
+                    <Input id="uiElement{index}" type="select" bind:value={element.bind.value} on:change={()=>checkModalChanged()}>
                         {#each element.options as option}
                             <option>{option}</option>
                         {/each}
                     </Input>
-                    <Tooltip target={element.label} placement="left">
+                    <Tooltip target="uiElement{index}" placement="left">
                         {element.description}
                     </Tooltip>
                 {:else if element.type=="textfield"}
                     <h7>{formatLabel(element.label)}</h7>
-                    <Input id={element.label} type="text" bind:value={element.bind.value} on:change={()=>checkModalChanged()}/>
-                    <Tooltip target={element.label} placement="left">
+                    <Input id="uiElement{index}" type="text" bind:value={element.bind.value} on:change={()=>checkModalChanged()}/>
+                    <Tooltip target="uiElement{index}" placement="left">
                         {element.description}
                     </Tooltip>
                 {:else if element.type=="numberfield"}
@@ -388,8 +390,8 @@
                     {#if element.max!=Number.POSITIVE_INFINITY&&element.min!=Number.NEGATIVE_INFINITY}
                         <Input type="range" min={element.min} max={element.max} step={1} bind:value={element.bind.value} placeholder="range placeholder" on:change={()=>checkModalChanged()}/>
                     {/if}
-                    <Input id={element.label} type="number" min={element.min} max={element.max} bind:value={element.bind.value} on:change={()=>checkModalChanged()}/>
-                    <Tooltip target={element.label} placement="left">
+                    <Input id="uiElement{index}" type="number" min={element.min} max={element.max} bind:value={element.bind.value} on:change={()=>checkModalChanged()}/>
+                    <Tooltip target="uiElement{index}" placement="left">
                         {element.description}
                     </Tooltip>
                 {/if}