@mackin.com/styleguide 9.2.1 → 9.2.4

package/index.js

@@ -1012,21 +1012,24 @@ const Autocomplete = (p) => {
         listBorderRadius = theme.controls.borderRadius || '0.5rem';
     }
     const onPickValue = (v) => {
-        p.onPick(v);
-        // wait for the re-render.  the value will not update if the control has focus
+        var _a;
+        // the TextInput will not respond to outer value changes if it has focus.
+        // here we clear first and then onPickValue will re-focus after all updates.
+        (_a = input.current) === null || _a === void 0 ? void 0 : _a.blur();
         setTimeout(() => {
-            var _a;
-            (_a = input.current) === null || _a === void 0 ? void 0 : _a.focus();
+            // blur is now complete
+            p.onPick(v);
+            // wait for the re-render.  the value will not update if the control has focus
+            setTimeout(() => {
+                var _a;
+                (_a = input.current) === null || _a === void 0 ? void 0 : _a.focus();
+            }, 0);
         }, 0);
     };
     return (React__namespace.createElement("div", { onClick: e => {
             e.stopPropagation();
         }, onKeyDown: e => {
-            var _a;
             if (e.key === 'Escape') {
-                // the TextInput will not respond to outer value changes if it has focus.
-                // here we clear first and then onPickValue will re-focus after all updates.
-                (_a = input.current) === null || _a === void 0 ? void 0 : _a.blur();
                 onPickValue(undefined);
             }
         }, ref: element, className: css.cx(css.css({
@@ -1087,6 +1090,9 @@ const Autocomplete = (p) => {
                                     (_b = getNextTabElement(listItemIndex, -1)) === null || _b === void 0 ? void 0 : _b.focus();
                                 }
                                 else if (e.key === 'Enter') {
+                                    e.stopPropagation();
+                                    // this will prevent the click event from firing in addition to this enter key event.
+                                    e.preventDefault();
                                     onPickValue(v);
                                 }
                             }, className: css.cx(buttonMarkerClass + listItemIndex, css.css({
@@ -4758,7 +4764,11 @@ class AutocompleteEntityController {
         return this._options.map(o => o.name);
     }
     async onChange(newValue) {
+        const clearEntity = newValue !== this._ctrl.value;
         await this._ctrl.onChange(newValue);
+        if (clearEntity) {
+            this._pickedEntity = undefined;
+        }
         this.trySyncCtrlOptions();
     }
     onPick(newValue) {

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@mackin.com/styleguide",
-    "version": "9.2.1",
+    "version": "9.2.4",
     "description": "",
     "main": "./index.js",
     "types": "./index.d.ts",