@purpurds/autocomplete 7.4.0 → 7.5.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@purpurds/autocomplete",
-  "version": "7.4.0",
+  "version": "7.5.1",
   "license": "AGPL-3.0-only",
   "main": "./dist/autocomplete.cjs.js",
   "types": "./dist/autocomplete.d.ts",
@@ -17,13 +17,13 @@
   "dependencies": {
     "classnames": "~2.5.0",
     "eslint": "9.24.0",
-    "@purpurds/icon": "7.4.0",
-    "@purpurds/listbox": "7.4.0",
-    "@purpurds/heading": "7.4.0",
-    "@purpurds/notification": "7.4.0",
-    "@purpurds/paragraph": "7.4.0",
-    "@purpurds/text-field": "7.4.0",
-    "@purpurds/tokens": "7.4.0"
+    "@purpurds/heading": "7.5.1",
+    "@purpurds/icon": "7.5.1",
+    "@purpurds/listbox": "7.5.1",
+    "@purpurds/notification": "7.5.1",
+    "@purpurds/paragraph": "7.5.1",
+    "@purpurds/text-field": "7.5.1",
+    "@purpurds/tokens": "7.5.1"
   },
   "devDependencies": {
     "@storybook/blocks": "^8.6.4",
@@ -45,11 +45,11 @@
     "typescript": "^5.6.3",
     "vite": "^6.2.1",
     "vitest": "^3.1.2",
-    "@purpurds/button": "7.4.0",
+    "@purpurds/button": "7.5.1",
     "@purpurds/component-rig": "1.0.0",
-    "@purpurds/icon": "7.4.0",
-    "@purpurds/label": "7.4.0",
-    "@purpurds/search-field": "7.4.0"
+    "@purpurds/icon": "7.5.1",
+    "@purpurds/label": "7.5.1",
+    "@purpurds/search-field": "7.5.1"
   },
   "peerDependencies": {
     "@types/react": "^18 || ^19",

package/src/autocomplete.stories.tsx

@@ -57,7 +57,7 @@ const OnInputEventPitfallNotification = () => (
 );
 
 const meta = {
-  title: "Inputs/Autocomplete",
+  title: "Forms and Inputs/Autocomplete",
   component: Autocomplete,
   args: {
     options,
@@ -374,7 +374,7 @@ export const WithCombobox: Story = {
                 updateArgs({ selectedOption: undefined });
               }}
               placeholder="Find your fruit"
-              clearButtonAllyLabel="Clear text field"
+              clearButtonAriaLabel="Clear text field"
             />
           )}
           combobox

package/src/useAutocomplete.ts

@@ -268,18 +268,20 @@ export const useAutocomplete = <T extends AutocompleteOption>({
 
   const handleOnBlur: React.FocusEventHandler<HTMLInputElement> = (event) => {
     onInputBlur?.(event);
-    if (combobox) {
-      // Use a timeout to allow click events on the listbox to fire before this check
-      setTimeout(() => {
-        // If the blur happened due to a click inside the listbox, don't reset the value
-        if (
-          !inputRef.current?.contains(document.activeElement) &&
-          !listboxRef.current?.contains(document.activeElement)
-        ) {
+    // Use a timeout to allow click events on the listbox to fire before this check
+    setTimeout(() => {
+      if (
+        !inputRef.current?.contains(document.activeElement) &&
+        !listboxRef.current?.contains(document.activeElement)
+      ) {
+        closeListbox();
+
+        // If the blur happened due to a click inside the listbox for a combobox, don't reset the value
+        if (combobox) {
           populateInputField(selectedOption ? selectedOption.label : "");
         }
-      });
-    }
+      }
+    });
   };
 
   const listboxStyle: CSSProperties = {

package/src/utils.ts

@@ -1,4 +1,4 @@
-import { MutableRefObject, useCallback, useEffect, useRef } from "react";
+import { type MutableRefObject, useCallback, useEffect, useRef } from "react";
 
 // Used to "merge" "intersection types". Used to get comments on the props to the docs.
 export type Prettify<T> = {