@react-aria/searchfield 3.5.7 → 3.7.0

package/dist/zh-TW.module.js

@@ -0,0 +1,8 @@
+var $525f6fa4ac26e278$exports = {};
+$525f6fa4ac26e278$exports = {
+    "Clear search": `\u{6E05}\u{9664}\u{641C}\u{5C0B}\u{689D}\u{4EF6}`
+};
+
+
+export {$525f6fa4ac26e278$exports as default};
+//# sourceMappingURL=zh-TW.module.js.map

package/dist/zh-TW.module.js.map

@@ -0,0 +1 @@
+{"mappings":";AAAA,4BAAiB;IAAG,gBAAgB,CAAC,gDAAM,CAAC;AAC5C","sources":["packages/@react-aria/searchfield/intl/zh-TW.json"],"sourcesContent":["{\n  \"Clear search\": \"清除搜尋條件\"\n}\n"],"names":[],"version":3,"file":"zh-TW.module.js.map"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-aria/searchfield",
-  "version": "3.5.7",
+  "version": "3.7.0",
   "description": "Spectrum UI components in React",
   "license": "Apache-2.0",
   "main": "dist/main.js",
@@ -22,14 +22,13 @@
     "url": "https://github.com/adobe/react-spectrum"
   },
   "dependencies": {
-    "@react-aria/i18n": "^3.8.4",
-    "@react-aria/interactions": "^3.19.1",
-    "@react-aria/textfield": "^3.12.2",
-    "@react-aria/utils": "^3.21.1",
-    "@react-stately/searchfield": "^3.4.6",
-    "@react-types/button": "^3.9.0",
-    "@react-types/searchfield": "^3.5.1",
-    "@react-types/shared": "^3.21.0",
+    "@react-aria/i18n": "^3.10.0",
+    "@react-aria/textfield": "^3.14.0",
+    "@react-aria/utils": "^3.23.0",
+    "@react-stately/searchfield": "^3.5.0",
+    "@react-types/button": "^3.9.1",
+    "@react-types/searchfield": "^3.5.2",
+    "@react-types/shared": "^3.22.0",
     "@swc/helpers": "^0.5.0"
   },
   "peerDependencies": {
@@ -38,5 +37,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "3ecf62dcceea437cb12df1851636dd491bb6591c"
+  "gitHead": "86b38c87868ce7f262e0df905e5ac4eb2653791d"
 }

package/src/useSearchField.ts

@@ -13,7 +13,7 @@
 import {AriaButtonProps} from '@react-types/button';
 import {AriaSearchFieldProps} from '@react-types/searchfield';
 import {chain} from '@react-aria/utils';
-import {DOMAttributes} from '@react-types/shared';
+import {DOMAttributes, ValidationResult} from '@react-types/shared';
 import {InputHTMLAttributes, LabelHTMLAttributes, RefObject} from 'react';
 // @ts-ignore
 import intlMessages from '../intl/*.json';
@@ -21,7 +21,7 @@ import {SearchFieldState} from '@react-stately/searchfield';
 import {useLocalizedStringFormatter} from '@react-aria/i18n';
 import {useTextField} from '@react-aria/textfield';
 
-export interface SearchFieldAria {
+export interface SearchFieldAria extends ValidationResult {
   /** Props for the text field's visible label element (if any). */
   labelProps: LabelHTMLAttributes<HTMLLabelElement>,
   /** Props for the input element. */
@@ -45,7 +45,7 @@ export function useSearchField(
   state: SearchFieldState,
   inputRef: RefObject<HTMLInputElement>
 ): SearchFieldAria {
-  let stringFormatter = useLocalizedStringFormatter(intlMessages);
+  let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-aria/searchfield');
   let {
     isDisabled,
     isReadOnly,
@@ -57,7 +57,7 @@ export function useSearchField(
   let onKeyDown = (e) => {
     const key = e.key;
 
-    if (key === 'Enter' || key === 'Escape') {
+    if (key === 'Enter') {
       e.preventDefault();
     }
 
@@ -70,9 +70,13 @@ export function useSearchField(
     }
 
     if (key === 'Escape') {
-      state.setValue('');
-      if (onClear) {
-        onClear();
+      if (state.value === '') {
+        e.continuePropagation();
+      } else {
+        state.setValue('');
+        if (onClear) {
+          onClear();
+        }
       }
     }
   };
@@ -88,14 +92,14 @@ export function useSearchField(
   let onPressStart = () => {
     // this is in PressStart for mobile so that touching the clear button doesn't remove focus from
     // the input and close the keyboard
-    inputRef.current.focus();
+    inputRef.current?.focus();
   };
 
-  let {labelProps, inputProps, descriptionProps, errorMessageProps} = useTextField({
+  let {labelProps, inputProps, descriptionProps, errorMessageProps, ...validation} = useTextField({
     ...props,
     value: state.value,
     onChange: state.setValue,
-    onKeyDown: chain(onKeyDown, props.onKeyDown),
+    onKeyDown: !isReadOnly ? chain(onKeyDown, props.onKeyDown) : props.onKeyDown,
     type
   }, inputRef);
 
@@ -116,6 +120,7 @@ export function useSearchField(
       onPressStart
     },
     descriptionProps,
-    errorMessageProps
+    errorMessageProps,
+    ...validation
   };
 }