fix: multiselect in ComboBox

Appsilon · Jun 29, 2023 · d8c98d0 · d8c98d0
1 parent 96d2e9f
commit d8c98d0
Showing 1 changed file with 14 additions and 2 deletions.
diff --git a/js/src/inputs.jsx b/js/src/inputs.jsx
@@ -29,10 +29,22 @@ export const ColorPicker = InputAdapter(Fluent.ColorPicker, (value, setValue) =>
   onChange: (e, v) => setValue(v.str),
 }), { policy: debounce, delay: 250 });
 
-export const ComboBox = InputAdapter(Fluent.ComboBox, (value, setValue) => ({
+export const ComboBox = InputAdapter(Fluent.ComboBox, (value, setValue, props) => ({
   selectedKey: value && value.key,
   text: value && value.text,
-  onChange: (e, option, i, text) => setValue(option || (text ? { text } : null)),
+  onChange: (e, option, i, text) => {
+    if (props.multiSelect) {
+      const options = new Set(props.options.map((item) => item.key));
+      let newValue = (Array.isArray(value) ? value : [value])
+        .filter((key) => options.has(key)); // Some options might have been removed.
+      newValue = option.selected
+        ? [...newValue, option.key]
+        : newValue.filter((key) => key !== option.key);
+      setValue(newValue);
+    } else {
+      setValue(option || (text ? { text } : null));
+    }
+  },
 }), { policy: debounce, delay: 250 });
 
 export const DatePicker = InputAdapter(Fluent.DatePicker, (value, setValue) => ({