сделал выпадающий список в таблице

src/App.svelte

@@ -156,42 +156,34 @@
     ],
   };
 
-  let widgetCollection = {};
+  let widgetCollection = [];
-  widgetCollection = {
+
-    undef: "Ошибка",
+  widgetCollection = [
-    toggleBtn: "Переключатель",
+    {
-    btn: "Кнопка",
+      id: "toggle",
-    select: "Кнопка переключатель",
+      val: "Переключатель",
-    range: "Ползунок",
+    },
-    inputDate: "Окно ввода даты",
+    {
-    inputTime: "Окно ввода времени 1",
+      id: "btn",
-    inputTimeClock: "Окно ввода времени 2",
+      val: "Кнопка",
-    inputDigit: "Окно ввода цифры",
+    },
-    inputDigitTemp: "Окно ввода температуры",
+    {
-    inputText: "Окно ввода текста",
+      id: "select",
-    chart: "График без точек",
+      val: "Кнопка переключатель",
-    chart2: "График с точками",
+    },
-    chart3: "График дневного расхода (столбики)",
+    {
-    chart4: "График дневного расхода (плавный)",
+      id: "range",
-    fillgauge: "Бочка",
+      val: "Ползунок",
-    progressline: "Линия",
+    },
-    progressround: "Круг",
+    {
-    anydata: "Текст",
+      id: "anydata",
-    anydataHum: "Влажность (%)",
+      val: "Текст",
-    anydataPress: "Давление (mm)",
+    },
-    anydataTemp: "Температура (°С)",
+    {
-    anydataPpb: "Части на миллиард (ppb)",
+      id: "input",
-    anydataPpm: "Части на миллион (ppm)",
+      val: "Ввод",
-    anydataVlt: "Напряжение (Vlt)",
+    },
-    anydataAmp: "Сила тока (Amp)",
+  ];
-    anydataWtt: "Мощность (Wtt)",
-    anydataWhr: "Энергия (Whr)",
-    anydataHtz: "Частота (Htz)",
-    anydataTime: "Манометр",
-    alarm: "Тревожное сообщение 1",
-    anydataAlarm: "Тревожное сообщение 2",
-    na: "Без виджета",
-  };
 
   //configuration
   let config = [];
@@ -673,10 +665,10 @@
                     <td class="tbl-bdy">{element.subtype}</td>
                     <td class="tbl-bdy"><input bind:value={element.id} class="tbl-ipt w-full" type="text" /></td>
                     <td class="tbl-bdy"
-                      ><select class="tbl-ipt w-full" bind:value={selectedDeviceData}>
+                      ><select bind:value={element.widget} class="tbl-ipt w-full">
-                        {#each deviceList as device}
+                        {#each widgetCollection as widget}
-                          <option value={device}>
+                          <option value={widget.id}>
-                            {device.name}
+                            {widget.val}
                           </option>
                         {/each}
                       </select></td>
@@ -732,7 +724,7 @@
         <Card title={"Список устройств"}>
           <table class="table-fixed w-full">
             <thead class="bg-gray-50 ">
-              <tr>
+              <tr class="tbl-txt-sz tbl-txt-p">
                 <th class="tbl-hd">Название устройства</th>
                 <th class="tbl-hd">IP адрес</th>
                 <th class="tbl-hd">Идентификатор</th>
@@ -741,7 +733,7 @@
             </thead>
             <tbody class="bg-white">
               {#each deviceList as device}
-                <tr>
+                <tr class="tbl-txt-sz tbl-txt-p">
                   <td class="tbl-bdy">{device.name}</td>
                   <td class="tbl-bdy"><a href={"http://" + device.ip}>{device.ip}</a></td>
                   <td class="tbl-bdy">{device.id}</td>
@@ -749,7 +741,7 @@
                 </tr>
               {/each}
               {#if showInput}
-                <tr>
+                <tr class="tbl-txt-sz tbl-txt-p">
                   <td class="tbl-bdy"><input bind:value={newDevice.name} class="tbl-ipt w-full" type="text" /></td>
                   <td class="tbl-bdy"><input bind:value={newDevice.ip} class="tbl-ipt w-full" type="text" /></td>
                   <td class="tbl-bdy"><input bind:value={newDevice.id} class="tbl-ipt w-full" type="text" /></td>