add createOnPaste option for select

reaviz · Apr 30, 2024 · 20e4ca0 · 20e4ca0
1 parent 25cd4ef
commit 20e4ca0
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 2 deletions.
diff --git a/src/form/Select/MultiSelect.story.tsx b/src/form/Select/MultiSelect.story.tsx
@@ -134,6 +134,7 @@ export const Createable = () => {
         multiple
         closeOnSelect={false}
         createable
+        createOnPaste
         selectOnKeys={['Enter', 'Space', 'Comma']}
         searchOptions={{ threshold: 0 }}
         placeholder="Add some categories or pick existing one..."

diff --git a/src/form/Select/Select.tsx b/src/form/Select/Select.tsx
@@ -119,6 +119,11 @@ export interface SelectProps {
    */
   createable?: boolean;
 
+  /**
+   * Whether you can create new options when paste text inside input.
+   */
+  createOnPaste?: boolean;
+
   /**
    * The list of KeyCodes for creating select values.
    * The default is ['Enter']
@@ -228,6 +233,7 @@ export const Select: FC<Partial<SelectProps>> = ({
   placeholder,
   disabled,
   createable,
+  createOnPaste,
   selectOnKeys,
   loading,
   multiple,
@@ -639,7 +645,7 @@ export const Select: FC<Partial<SelectProps>> = ({
 
   const onPasteHandler = useCallback(
     (e: React.ClipboardEvent<HTMLInputElement>) => {
-      if (createable && multiple) {
+      if (createOnPaste && multiple) {
         const inputElement = e.target as HTMLInputElement;
         const inputValue = inputElement.value;
         const clipboardValue = e.clipboardData.getData('Text');
@@ -665,7 +671,7 @@ export const Select: FC<Partial<SelectProps>> = ({
       }
     },
     [
-      createable,
+      createOnPaste,
       multiple,
       onChange,
       onOptionsChange,