carbon-react 104.26.0 → 104.26.1

package/lib/components/search/search.component.js

@@ -63,10 +63,12 @@ const Search = ({
   const [searchValue, setSearchValue] = (0, _react.useState)(initialValue);
   const [isFocused, setIsFocused] = (0, _react.useState)(false);
   const [searchIsActive, setSearchIsActive] = (0, _react.useState)(initialValue.length >= threshold);
+  (0, _react.useEffect)(() => {
+    setSearchIsActive(!isControlled ? searchValue.length >= threshold : value.length >= threshold);
+  }, [isControlled, searchValue, threshold, value]);
   const [iconType, iconTabIndex] = (0, _react.useMemo)(() => {
     const isSearchValueEmpty = !isControlled ? searchValue.length === 0 : value.length === 0;
     const isFocusedOrActive = isFocused || searchIsActive || (inputRef === null || inputRef === void 0 ? void 0 : inputRef.current) === document.activeElement;
-    setSearchIsActive(!isControlled ? searchValue.length >= threshold : value.length >= threshold);
 
     if (!isSearchValueEmpty) {
       return ["cross", 0];
@@ -89,8 +91,12 @@ const Search = ({
     }
   };
 
-  const handleOnFocus = () => {
+  const handleFocus = e => {
     setIsFocused(true);
+
+    if (onFocus) {
+      onFocus(e);
+    }
   };
 
   let buttonProps = {};
@@ -130,14 +136,22 @@ const Search = ({
     ev.preventDefault();
   };
 
-  const handleBlur = () => {
+  const handleBlur = e => {
     setIsFocused(false);
+
+    if (onBlur) {
+      onBlur(e);
+    }
   };
 
   const handleKeyDown = ev => {
     if (_events.default.isAlphabetKey(ev) || _events.default.isNumberKey(ev)) {
       ev.stopPropagation();
     }
+
+    if (onKeyDown) {
+      onKeyDown(ev);
+    }
   };
 
   const assignInput = input => {
@@ -156,11 +170,6 @@ const Search = ({
     mb: 0
   }, (0, _utils.filterStyledSystemMarginProps)(rest), (0, _tags.default)("search", rest), {
     id: id,
-    onFocus: handleOnFocus,
-    onClick: handleOnFocus,
-    onBlur: handleBlur,
-    onChange: handleChange,
-    onKeyDown: handleKeyDown,
     name: name
   }, rest), /*#__PURE__*/_react.default.createElement(_textbox.default, {
     placeholder: placeholder,
@@ -170,10 +179,10 @@ const Search = ({
     iconOnClick: handleIconClick,
     iconOnMouseDown: handleMouseDown,
     "aria-label": ariaLabel,
-    onFocus: onFocus,
-    onBlur: onBlur,
-    onChange: onChange,
-    onKeyDown: onKeyDown,
+    onFocus: handleFocus,
+    onBlur: handleBlur,
+    onChange: handleChange,
+    onKeyDown: handleKeyDown,
     inputRef: assignInput,
     tabIndex: tabIndex
   }), searchButton && /*#__PURE__*/_react.default.createElement(_search.StyledSearchButton, null, Boolean(isFocused || (!isControlled ? searchValue.length : value.length)) && /*#__PURE__*/_react.default.createElement(_button.default, _extends({

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "carbon-react",
-  "version": "104.26.0",
+  "version": "104.26.1",
   "description": "A library of reusable React components for easily building user interfaces.",
   "engineStrict": true,
   "engines": {