From 98b4f9064fd204479f594f3f18290eaba817b556 Mon Sep 17 00:00:00 2001
From: Vitaly Rtishchev <rtivital@gmail.com>
Date: Thu, 18 Aug 2022 14:39:24 +0300
Subject: [PATCH] [@mantine/core] Add option to not call onChange in creatable
 Select and MultiSelect when onCreate function returns null or undefined
 (#2095)

---
 src/mantine-core/src/MultiSelect/MultiSelect.tsx | 12 +++++++-----
 src/mantine-core/src/Select/Select.tsx           | 12 +++++++-----
 2 files changed, 14 insertions(+), 10 deletions(-)

diff --git a/src/mantine-core/src/MultiSelect/MultiSelect.tsx b/src/mantine-core/src/MultiSelect/MultiSelect.tsx
index 1107906b4c6..531bcfbe1d9 100644
--- a/src/mantine-core/src/MultiSelect/MultiSelect.tsx
+++ b/src/mantine-core/src/MultiSelect/MultiSelect.tsx
@@ -75,7 +75,7 @@ export interface MultiSelectProps
   shouldCreate?(query: string, data: SelectItem[]): boolean;
 
   /** Called when create option is selected */
-  onCreate?(query: string): SelectItem | string;
+  onCreate?(query: string): SelectItem | string | null | undefined;
 
   /** Change dropdown component, can be used to add custom scrollbars */
   dropdownComponent?: any;
@@ -334,10 +334,12 @@ export const MultiSelect = forwardRef<HTMLInputElement, MultiSelectProps>((props
       } else {
         if (item.creatable && typeof onCreate === 'function') {
           const createdItem = onCreate(item.value);
-          if (typeof createdItem === 'string') {
-            setValue([..._value, createdItem]);
-          } else {
-            setValue([..._value, createdItem.value]);
+          if (typeof createdItem !== 'undefined' && createdItem !== null) {
+            if (typeof createdItem === 'string') {
+              setValue([..._value, createdItem]);
+            } else {
+              setValue([..._value, createdItem.value]);
+            }
           }
         } else {
           setValue([..._value, item.value]);
diff --git a/src/mantine-core/src/Select/Select.tsx b/src/mantine-core/src/Select/Select.tsx
index 7ba6dd04c1e..03c1cf84f04 100644
--- a/src/mantine-core/src/Select/Select.tsx
+++ b/src/mantine-core/src/Select/Select.tsx
@@ -107,7 +107,7 @@ export interface SelectProps
   shouldCreate?(query: string, data: SelectItem[]): boolean;
 
   /** Called when create option is selected */
-  onCreate?(query: string): SelectItem | string;
+  onCreate?(query: string): SelectItem | string | null | undefined;
 
   /** Change dropdown component, can be used to add native scrollbars */
   dropdownComponent?: any;
@@ -296,10 +296,12 @@ export const Select = forwardRef<HTMLInputElement, SelectProps>((props, ref) =>
       } else {
         if (item.creatable && typeof onCreate === 'function') {
           const createdItem = onCreate(item.value);
-          if (typeof createdItem === 'string') {
-            handleChange(createdItem);
-          } else {
-            handleChange(createdItem.value);
+          if (typeof createdItem !== 'undefined' && createdItem !== null) {
+            if (typeof createdItem === 'string') {
+              handleChange(createdItem);
+            } else {
+              handleChange(createdItem.value);
+            }
           }
         } else {
           handleChange(item.value);