feat(select): support number type

src/Select/Select.svelte

@@ -5,7 +5,7 @@
 
   /**
    * Specify the selected item value
-   * @type {string}
+   * @type {string | number}
    */
   export let selected = undefined;
 
@@ -73,6 +73,7 @@
   const selectedValue = writable(selected);
   const defaultSelectId = writable(null);
   const defaultValue = writable(null);
+  const itemTypesByValue = writable({});
 
   setContext("Select", {
     selectedValue,
@@ -89,9 +90,24 @@
           selectedValue.set(value);
         }
       }
+
+      itemTypesByValue.update((types) => ({
+        ...types,
+        [value]: typeof value,
+      }));
     },
   });
 
+  const handleChange = ({ target }) => {
+    let value = target.value;
+
+    if ($itemTypesByValue[value] === "number") {
+      value = Number(value);
+    }
+
+    selectedValue.set(value);
+  };
+
   afterUpdate(() => {
     selected = $selectedValue;
     dispatch("change", $selectedValue);
@@ -139,9 +155,7 @@
             class:bx--select-input="{true}"
             class:bx--select-input--sm="{size === 'sm'}"
             class:bx--select-input--xl="{size === 'xl'}"
-            on:change="{({ target }) => {
+            on:change="{handleChange}"
-              selectedValue.set(target.value);
-            }}"
             on:input
             on:focus
             on:blur
@@ -184,9 +198,7 @@
           class:bx--select-input="{true}"
           class:bx--select-input--sm="{size === 'sm'}"
           class:bx--select-input--xl="{size === 'xl'}"
-          on:change="{({ target }) => {
+          on:change="{handleChange}"
-            selectedValue.set(target.value);
-          }}"
           on:input
           on:focus
           on:blur

src/Select/SelectItem.svelte

@@ -1,5 +1,8 @@
 <script>
-  /** Specify the option value */
+  /**
+   * Specify the option value
+   * @type {string | number}
+   */
   export let value = "";
 
   /** Specify the option text */