@purpurds/autocomplete 5.15.0 → 5.16.0

package/dist/useAutocomplete.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useAutocomplete.d.ts","sourceRoot":"","sources":["../src/useAutocomplete.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAiB,SAAS,EAAE,MAAM,OAAO,CAAC;AAE7E,OAAO,KAAK,EAAE,gBAAgB,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAIxE,MAAM,MAAM,MAAM,GAAG;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,UAAU,GAAG,IAAI,CAAC,qBAAqB,CAAC,OAAO,CAAC,EAAE,SAAS,GAAG,aAAa,CAAC,GAAG;IACzF,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,WAAW,EAAE,MAAM,IAAI,CAAC;CACzB,CAAC;AAEF,MAAM,MAAM,sBAAsB,CAAC,CAAC,SAAS,MAAM,IAAI;IAIrD,QAAQ,CAAC,EAAE,OAAO,CAAC;IAInB,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAI/B,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAI3B,UAAU,CAAC,EAAE,MAAM,CAAC;IAIpB,YAAY,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,GAAG,SAAS,EAAE,MAAM,EAAE,CAAC,KAAK,OAAO,CAAC;IAItE,EAAE,EAAE,MAAM,CAAC;IAIX,YAAY,EAAE,MAAM,CAAC;IAIrB,gBAAgB,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAInC,aAAa,CAAC,EAAE,SAAS,CAAC;IAI1B,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAIxC,WAAW,CAAC,EAAE,OAAO,CAAC;IAItB,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,CAAC,GAAG,SAAS,KAAK,IAAI,CAAC;IAI3C,OAAO,EAAE,CAAC,EAAE,CAAC;IAIb,cAAc,CAAC,EAAE,CAAC,CAAC;IACnB,CAAC,aAAa,CAAC,CAAC,EAAE,MAAM,CAAC;CAC1B,CAAC;AAEF,eAAO,MAAM,eAAe,GAAI,CAAC,SAAS,MAAM,mOAgB7C,sBAAsB,CAAC,CAAC,CAAC;;;;;;;;kCA4KW,CAAC,SAAS,MAAM,KAAG,gBAAgB;;CAqDzE,CAAC"}
+{"version":3,"file":"useAutocomplete.d.ts","sourceRoot":"","sources":["../src/useAutocomplete.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAiB,SAAS,EAAE,MAAM,OAAO,CAAC;AAE7E,OAAO,KAAK,EAAE,gBAAgB,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAIxE,MAAM,MAAM,MAAM,GAAG;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,UAAU,GAAG,IAAI,CAAC,qBAAqB,CAAC,OAAO,CAAC,EAAE,SAAS,GAAG,aAAa,CAAC,GAAG;IACzF,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,WAAW,EAAE,MAAM,IAAI,CAAC;CACzB,CAAC;AAEF,MAAM,MAAM,sBAAsB,CAAC,CAAC,SAAS,MAAM,IAAI;IAIrD,QAAQ,CAAC,EAAE,OAAO,CAAC;IAInB,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAI/B,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAI3B,UAAU,CAAC,EAAE,MAAM,CAAC;IAIpB,YAAY,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,GAAG,SAAS,EAAE,MAAM,EAAE,CAAC,KAAK,OAAO,CAAC;IAItE,EAAE,EAAE,MAAM,CAAC;IAIX,YAAY,EAAE,MAAM,CAAC;IAIrB,gBAAgB,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAInC,aAAa,CAAC,EAAE,SAAS,CAAC;IAI1B,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAIxC,WAAW,CAAC,EAAE,OAAO,CAAC;IAItB,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,CAAC,GAAG,SAAS,KAAK,IAAI,CAAC;IAI3C,OAAO,EAAE,CAAC,EAAE,CAAC;IAIb,cAAc,CAAC,EAAE,CAAC,CAAC;IACnB,CAAC,aAAa,CAAC,CAAC,EAAE,MAAM,CAAC;CAC1B,CAAC;AAEF,eAAO,MAAM,eAAe,GAAI,CAAC,SAAS,MAAM,mOAgB7C,sBAAsB,CAAC,CAAC,CAAC;;;;;;;;kCAqLW,CAAC,SAAS,MAAM,KAAG,gBAAgB;;CAqDzE,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@purpurds/autocomplete",
-  "version": "5.15.0",
+  "version": "5.16.0",
   "license": "AGPL-3.0-only",
   "main": "./dist/autocomplete.cjs.js",
   "types": "./dist/autocomplete.d.ts",
@@ -15,11 +15,11 @@
   "source": "src/autocomplete.tsx",
   "dependencies": {
     "classnames": "~2.5.0",
-    "@purpurds/icon": "5.15.0",
-    "@purpurds/listbox": "5.15.0",
-    "@purpurds/paragraph": "5.15.0",
-    "@purpurds/text-field": "5.15.0",
-    "@purpurds/tokens": "5.15.0"
+    "@purpurds/icon": "5.16.0",
+    "@purpurds/text-field": "5.16.0",
+    "@purpurds/tokens": "5.16.0",
+    "@purpurds/paragraph": "5.16.0",
+    "@purpurds/listbox": "5.16.0"
   },
   "devDependencies": {
     "@rushstack/eslint-patch": "~1.10.0",
@@ -45,10 +45,10 @@
     "typescript": "^5.5.4",
     "vite": "5.3.4",
     "vitest": "~1.5.0",
-    "@purpurds/button": "5.15.0",
     "@purpurds/component-rig": "1.0.0",
-    "@purpurds/icon": "5.15.0",
-    "@purpurds/search-field": "5.15.0"
+    "@purpurds/icon": "5.16.0",
+    "@purpurds/button": "5.16.0",
+    "@purpurds/search-field": "5.16.0"
   },
   "scripts": {
     "build:dev": "vite",

package/src/autocomplete.test.tsx

@@ -1,7 +1,7 @@
 import React from "react";
 import { TextField } from "@purpurds/text-field";
 import * as matchers from "@testing-library/jest-dom/matchers";
-import { cleanup, fireEvent, render, screen } from "@testing-library/react";
+import { cleanup, fireEvent, render, screen, waitFor } from "@testing-library/react";
 import { afterEach, describe, expect, it, vi } from "vitest";
 
 import { Autocomplete } from "./autocomplete";
@@ -593,7 +593,7 @@ describe("B2xAutocomplete", () => {
     expect(input.value).toEqual("random text");
   });
 
-  it("should reset input value on blur for combobox with no selected option", () => {
+  it("should reset input value on blur for combobox with no selected option", async () => {
     const onSelectMock = vi.fn();
     render(
       <Autocomplete
@@ -613,10 +613,12 @@ describe("B2xAutocomplete", () => {
     fireEvent.change(input, { target: { value: "random text" } });
     expect(input.value).toEqual("random text");
     fireEvent.blur(input);
-    expect(input.value).toEqual("");
+    await waitFor(() => {
+      expect(input.value).toEqual("");
+    });
   });
 
-  it("should reset input value on blur for combobox with selected option", () => {
+  it("should reset input value on blur for combobox with selected option", async () => {
     const onSelectMock = vi.fn();
     render(
       <Autocomplete
@@ -637,6 +639,8 @@ describe("B2xAutocomplete", () => {
     fireEvent.change(input, { target: { value: "random text" } });
     expect(input.value).toEqual("random text");
     fireEvent.blur(input);
-    expect(input.value).toEqual(options[0].label);
+    await waitFor(() => {
+      expect(input.value).toEqual(options[0].label);
+    });
   });
 });

package/src/useAutocomplete.ts

@@ -245,7 +245,16 @@ export const useAutocomplete = <T extends Option>({
 
   const handleOnBlur = () => {
     if (combobox) {
-      populateInputField(selectedOption?.label ?? "");
+      // 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)
+        ) {
+          populateInputField(selectedOption ? selectedOption.label : "");
+        }
+      });
     }
   };