chore(web): migration svelte 5 syntax (#13883)

web/src/lib/components/shared-components/settings/setting-select.svelte

@@ -5,15 +5,29 @@
   import Icon from '$lib/components/elements/icon.svelte';
   import { mdiChevronDown } from '@mdi/js';
 
-  export let value: string | number;
-  export let options: { value: string | number; text: string }[];
-  export let label = '';
-  export let desc = '';
-  export let name = '';
-  export let isEdited = false;
-  export let number = false;
-  export let disabled = false;
-  export let onSelect: (setting: string | number) => void = () => {};
+  interface Props {
+    value: string | number;
+    options: { value: string | number; text: string }[];
+    label?: string;
+    desc?: string;
+    name?: string;
+    isEdited?: boolean;
+    number?: boolean;
+    disabled?: boolean;
+    onSelect?: (setting: string | number) => void;
+  }
+
+  let {
+    value = $bindable(),
+    options,
+    label = '',
+    desc = '',
+    name = '',
+    isEdited = false,
+    number = false,
+    disabled = false,
+    onSelect = () => {},
+  }: Props = $props();
 
   const handleChange = (e: Event) => {
     value = (e.target as HTMLInputElement).value;
@@ -62,7 +76,7 @@
       {name}
       id="{name}-select"
       bind:value
-      on:change={handleChange}
+      onchange={handleChange}
     >
       {#each options as option}
         <option value={option.value}>{option.text}</option>