@szhsin/react-autocomplete - npm Package Compare versions

Comparing version 0.8.2 to 0.8.3

dist/cjs/index.js

@@ -93,2 +93,5 @@ 'use strict';
 
+const scrollIntoView = element => element == null ? void 0 : element.scrollIntoView({
+  block: 'nearest'
+});
 const autocomplete = ({
@@ -109,13 +112,14 @@ rovingText
 }) => {
-  const updateValue = (value, type) => {
+  const updateValue = (type, value, item) => {
     cxInstance.b = value;
     setInputValue(value);
     onChange(value, {
-      type
+      type,
+      item
     });
   };
-  const updateAndCloseList = (value, type) => {
+  const updateAndCloseList = (type, value, item) => {
     if (open) {
       if (value != null) {
-        updateValue(value, type);
+        updateValue(type, value, item);
       }
@@ -139,3 +143,3 @@ setOpen(false);
       setOpen(true);
-      updateValue(e.target.value, 'input');
+      updateValue('input', e.target.value);
     },
@@ -151,7 +155,7 @@ onSelect: e => {
         setFocusItem();
-        updateValue(value, 'input');
+        updateValue('input', value);
       }
     },
     onClick: () => setOpen(true),
-    onBlur: () => updateAndCloseList(getItemValue(focusItem), 'blur'),
+    onBlur: () => updateAndCloseList('blur', getItemValue(focusItem), focusItem),
     onKeyDown: e => {
@@ -169,6 +173,6 @@ switch (e.key) {
         case 'Enter':
-          updateAndCloseList(getItemValue(focusItem), 'submit');
+          updateAndCloseList('submit', getItemValue(focusItem), focusItem);
           break;
         case 'Escape':
-          updateAndCloseList(cxInstance.b, 'esc');
+          updateAndCloseList('esc', cxInstance.b);
           break;
@@ -181,3 +185,4 @@ }
   }) => ({
-    onClick: () => !isItemDisabled(item) && updateAndCloseList(getItemValue(item), 'submit')
+    ref: focusItem === item ? scrollIntoView : null,
+    onClick: () => !isItemDisabled(item) && updateAndCloseList('submit', getItemValue(item), item)
   });
@@ -184,0 +189,0 @@ return {

dist/esm/features/autocomplete.js

@@ -0,1 +1,4 @@
+const scrollIntoView = element => element == null ? void 0 : element.scrollIntoView({
+  block: 'nearest'
+});
 const autocomplete = ({
@@ -16,13 +19,14 @@ rovingText
 }) => {
-  const updateValue = (value, type) => {
+  const updateValue = (type, value, item) => {
     cxInstance.b = value;
     setInputValue(value);
     onChange(value, {
-      type
+      type,
+      item
     });
   };
-  const updateAndCloseList = (value, type) => {
+  const updateAndCloseList = (type, value, item) => {
     if (open) {
       if (value != null) {
-        updateValue(value, type);
+        updateValue(type, value, item);
       }
@@ -46,3 +50,3 @@ setOpen(false);
       setOpen(true);
-      updateValue(e.target.value, 'input');
+      updateValue('input', e.target.value);
     },
@@ -58,7 +62,7 @@ onSelect: e => {
         setFocusItem();
-        updateValue(value, 'input');
+        updateValue('input', value);
       }
     },
     onClick: () => setOpen(true),
-    onBlur: () => updateAndCloseList(getItemValue(focusItem), 'blur'),
+    onBlur: () => updateAndCloseList('blur', getItemValue(focusItem), focusItem),
     onKeyDown: e => {
@@ -76,6 +80,6 @@ switch (e.key) {
         case 'Enter':
-          updateAndCloseList(getItemValue(focusItem), 'submit');
+          updateAndCloseList('submit', getItemValue(focusItem), focusItem);
           break;
         case 'Escape':
-          updateAndCloseList(cxInstance.b, 'esc');
+          updateAndCloseList('esc', cxInstance.b);
           break;
@@ -88,3 +92,4 @@ }
   }) => ({
-    onClick: () => !isItemDisabled(item) && updateAndCloseList(getItemValue(item), 'submit')
+    ref: focusItem === item ? scrollIntoView : null,
+    onClick: () => !isItemDisabled(item) && updateAndCloseList('submit', getItemValue(item), item)
   });
@@ -91,0 +96,0 @@ return {

package.json

 {
   "name": "@szhsin/react-autocomplete",
-  "version": "0.8.2",
+  "version": "0.8.3",
   "description": "",
@@ -5,0 +5,0 @@ "author": "Zheng Song",

types/common.d.ts

@@ -21,2 +21,3 @@ import type { HTMLAttributes, InputHTMLAttributes } from 'react';
         type: ChangeType;
+        item: T | null | undefined;
     }) => void;
@@ -23,0 +24,0 @@ }

No alert changes

Improved metrics

Total package byte prevSize

20893

increased by2.33%

Lines of code

636

increased by1.76%

No dependency changes