@khanacademy/wonder-blocks-search-field 1.0.2 → 1.0.3

package/CHANGELOG.md

@@ -1,5 +1,14 @@
 # @khanacademy/wonder-blocks-search-field
 
+## 1.0.3
+
+### Patch Changes
+
+-   @khanacademy/wonder-blocks-core@4.3.1
+-   @khanacademy/wonder-blocks-icon@1.2.27
+-   @khanacademy/wonder-blocks-icon-button@3.4.6
+-   @khanacademy/wonder-blocks-typography@1.1.31
+
 ## 1.0.2
 
 ### Patch Changes

package/dist/es/index.js

@@ -10,35 +10,12 @@ import Icon, { icons } from '@khanacademy/wonder-blocks-icon';
 import Color from '@khanacademy/wonder-blocks-color';
 import Spacing from '@khanacademy/wonder-blocks-spacing';
 
-// The default labels that will be used by different components
 const defaultLabels = {
   clearSearch: "Clear search"
 };
 
 const _excluded = ["clearAriaLabel", "disabled", "light", "id", "value", "placeholder", "style", "testId", "onClick", "onChange", "onFocus", "onBlur"];
-
-/**
- * Search Field. A TextField with a search icon on its left side
- * and an X icon on its right side.
- *
- * ### Usage
- * ```jsx
- * import {SearchField} from "@khanacademy/wonder-blocks-search-field";
- *
- * const [value, setValue] = React.useState("");
- *
- * const handleChange = (newValue: string) => {
- *     setValue(newValue);
- * };
- *
- * <SearchField
- *     id="some-id"
- *     value={value}
- *     onChange={handleChange}
- * />
- * ```
- */
-const SearchField = /*#__PURE__*/React.forwardRef((props, ref) => {
+const SearchField = React.forwardRef((props, ref) => {
   const {
     clearAriaLabel = defaultLabels.clearSearch,
     disabled = false,
@@ -53,20 +30,14 @@ const SearchField = /*#__PURE__*/React.forwardRef((props, ref) => {
     onFocus,
     onBlur
   } = props,
-        otherProps = _objectWithoutPropertiesLoose(props, _excluded); // We can't just use ref.current to clear the input because ref isn't
-  // always being passed in, so we use an innerRef to allow the
-  // handleClear() function to focus on the input element ref.
-
+        otherProps = _objectWithoutPropertiesLoose(props, _excluded);
 
   const innerRef = React.useRef(null);
 
   const handleClear = () => {
     var _innerRef$current;
 
-    // Empty the search text.
-    onChange(""); // Focus back on the text field since the clear button disappears after
-    // the field is cleared.
-
+    onChange("");
     innerRef == null ? void 0 : (_innerRef$current = innerRef.current) == null ? void 0 : _innerRef$current.focus();
   };
 
@@ -75,7 +46,7 @@ const SearchField = /*#__PURE__*/React.forwardRef((props, ref) => {
       return null;
     }
 
-    return /*#__PURE__*/React.createElement(IconButton, {
+    return React.createElement(IconButton, {
       icon: icons.dismiss,
       kind: "tertiary",
       onClick: handleClear,
@@ -84,19 +55,19 @@ const SearchField = /*#__PURE__*/React.forwardRef((props, ref) => {
     });
   };
 
-  return /*#__PURE__*/React.createElement(IDProvider, {
+  return React.createElement(IDProvider, {
     id: id,
     scope: "search-field"
-  }, uniqueId => /*#__PURE__*/React.createElement(View, {
+  }, uniqueId => React.createElement(View, {
     onClick: onClick,
     style: [styles.inputContainer, style]
-  }, /*#__PURE__*/React.createElement(Icon, {
+  }, React.createElement(Icon, {
     icon: icons.search,
     size: "medium",
     color: Color.offBlack64,
     style: styles.searchIcon,
     "aria-hidden": "true"
-  }), /*#__PURE__*/React.createElement(TextField, _extends({
+  }), React.createElement(TextField, _extends({
     id: `${uniqueId}-field`,
     type: "text",
     disabled: disabled,
@@ -106,10 +77,7 @@ const SearchField = /*#__PURE__*/React.forwardRef((props, ref) => {
     onBlur: onBlur,
     placeholder: placeholder,
     ref: node => {
-      // We have to set the value of both refs to
-      // the HTMLInputElement from TextField.
       if (ref) {
-        // $FlowIgnore[prop-missing]
         ref.current = node;
       }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@khanacademy/wonder-blocks-search-field",
-  "version": "1.0.2",
+  "version": "1.0.3",
   "design": "v1",
   "description": "Search Field components for Wonder Blocks.",
   "main": "dist/index.js",
@@ -17,17 +17,17 @@
   "dependencies": {
     "@babel/runtime": "^7.16.3",
     "@khanacademy/wonder-blocks-color": "^1.1.20",
-    "@khanacademy/wonder-blocks-core": "^4.3.0",
-    "@khanacademy/wonder-blocks-icon": "^1.2.26",
-    "@khanacademy/wonder-blocks-icon-button": "^3.4.5",
+    "@khanacademy/wonder-blocks-core": "^4.3.1",
+    "@khanacademy/wonder-blocks-icon": "^1.2.27",
+    "@khanacademy/wonder-blocks-icon-button": "^3.4.6",
     "@khanacademy/wonder-blocks-spacing": "^3.0.5",
-    "@khanacademy/wonder-blocks-typography": "^1.1.30"
+    "@khanacademy/wonder-blocks-typography": "^1.1.31"
   },
   "peerDependencies": {
     "aphrodite": "^1.2.5",
     "react": "16.14.0"
   },
   "devDependencies": {
-    "wb-dev-build-settings": "^0.3.0"
+    "wb-dev-build-settings": "^0.4.0"
   }
 }