@pingux/astro 2.0.0-alpha.1 → 2.0.0-alpha.4

package/lib/cjs/components/ScrollBox/ScrollBox.js

@@ -1,95 +1,64 @@
 "use strict";
 
 var _typeof = require("@babel/runtime-corejs3/helpers/typeof");
-
 var _Object$keys = require("@babel/runtime-corejs3/core-js-stable/object/keys");
-
 var _Object$getOwnPropertySymbols = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols");
-
 var _filterInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/filter");
-
 var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
-
 var _forEachInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/for-each");
-
 var _Object$getOwnPropertyDescriptors = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors");
-
 var _Object$defineProperties = require("@babel/runtime-corejs3/core-js-stable/object/define-properties");
-
 var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
-
 var _WeakMap = require("@babel/runtime-corejs3/core-js-stable/weak-map");
-
 var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
-
 _Object$defineProperty(exports, "__esModule", {
   value: true
 });
-
 exports["default"] = void 0;
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
-
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
-
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/slicedToArray"));
-
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/objectWithoutProperties"));
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
-var _Box = _interopRequireDefault(require("../Box"));
-
 var _useStatusClasses2 = _interopRequireDefault(require("../../hooks/useStatusClasses"));
-
+var _Box = _interopRequireDefault(require("../Box"));
 var _react2 = require("@emotion/react");
-
 var _excluded = ["maxHeight", "children", "sx", "hasShadows", "onScroll"];
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = _Object$defineProperty && _Object$getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? _Object$getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { _Object$defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
 function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); enumerableOnly && (symbols = _filterInstanceProperty(symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context, _context2; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(source), !0)).call(_context, function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context2 = ownKeys(Object(source))).call(_context2, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
-
 /**
  * Scrollbox is a container that allows content to be scrolled
  */
+
 var ScrollBox = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   var maxHeight = props.maxHeight,
-      children = props.children,
-      sx = props.sx,
-      hasShadows = props.hasShadows,
-      scrollHandler = props.onScroll,
-      others = (0, _objectWithoutProperties2["default"])(props, _excluded);
-
+    children = props.children,
+    sx = props.sx,
+    hasShadows = props.hasShadows,
+    scrollHandler = props.onScroll,
+    others = (0, _objectWithoutProperties2["default"])(props, _excluded);
   var _useState = (0, _react.useState)(0),
-      _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
-      scrollTopPosition = _useState2[0],
-      setScrollTopPosition = _useState2[1];
-
+    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
+    scrollTopPosition = _useState2[0],
+    setScrollTopPosition = _useState2[1];
   var _useState3 = (0, _react.useState)(false),
-      _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
-      isTopShadowShowing = _useState4[0],
-      setIsTopShadowShowing = _useState4[1];
-
+    _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
+    isTopShadowShowing = _useState4[0],
+    setIsTopShadowShowing = _useState4[1];
   var _useState5 = (0, _react.useState)(true),
-      _useState6 = (0, _slicedToArray2["default"])(_useState5, 2),
-      isBottomShadowShowing = _useState6[0],
-      setIsBottomShadowShowing = _useState6[1];
-
+    _useState6 = (0, _slicedToArray2["default"])(_useState5, 2),
+    isBottomShadowShowing = _useState6[0],
+    setIsBottomShadowShowing = _useState6[1];
   var outerRef = (0, _react.useRef)();
   /* istanbul ignore next */
-
   (0, _react.useImperativeHandle)(ref, function () {
     return outerRef.current;
   });
-  /* istanbul ignore next */
 
+  /* istanbul ignore next */
   (0, _react.useLayoutEffect)(function () {
     if (outerRef.current && outerRef.current.firstChild) {
       if (outerRef.current.firstChild.offsetHeight !== 0) {
@@ -98,25 +67,21 @@ var ScrollBox = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
       }
     }
   }, [scrollTopPosition]);
-  /* istanbul ignore next */
 
+  /* istanbul ignore next */
   var onScroll = function onScroll() {
     var _outerRef$current;
-
     if ((_outerRef$current = outerRef.current) !== null && _outerRef$current !== void 0 && _outerRef$current.firstChild) {
       var _outerRef$current2, _outerRef$current2$fi;
-
       setScrollTopPosition((_outerRef$current2 = outerRef.current) === null || _outerRef$current2 === void 0 ? void 0 : (_outerRef$current2$fi = _outerRef$current2.firstChild) === null || _outerRef$current2$fi === void 0 ? void 0 : _outerRef$current2$fi.scrollTop);
     }
   };
-
   var _useStatusClasses = (0, _useStatusClasses2["default"])('', {
-    hasShadows: hasShadows,
-    isTopShadowShowing: isTopShadowShowing,
-    isBottomShadowShowing: isBottomShadowShowing
-  }),
-      classNames = _useStatusClasses.classNames;
-
+      hasShadows: hasShadows,
+      isTopShadowShowing: isTopShadowShowing,
+      isBottomShadowShowing: isBottomShadowShowing
+    }),
+    classNames = _useStatusClasses.classNames;
   return (0, _react2.jsx)(_react["default"].Fragment, null, (0, _react2.jsx)(_Box["default"], {
     variant: "scrollBox.topShadowBox",
     className: classNames,
@@ -142,10 +107,8 @@ ScrollBox.defaultProps = {
 ScrollBox.propTypes = {
   /** Height at which the content within ScrollBox will overflow */
   maxHeight: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].object, _propTypes["default"].number]),
-
   /** Callback that fires when scrolling is done inside the ScrollBox */
   onScroll: _propTypes["default"].func,
-
   /** If true the box will render top and bottom shadows with scroll */
   hasShadows: _propTypes["default"].bool
 };

package/lib/cjs/components/ScrollBox/ScrollBox.stories.js

@@ -1,25 +1,16 @@
 "use strict";
 
 var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
-
 var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
-
 _Object$defineProperty(exports, "__esModule", {
   value: true
 });
-
 exports["default"] = exports.Default = void 0;
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
-
 var _react = _interopRequireDefault(require("react"));
-
-var _ScrollBox = _interopRequireDefault(require("./ScrollBox"));
-
 var _Box = _interopRequireDefault(require("../Box"));
-
+var _ScrollBox = _interopRequireDefault(require("./ScrollBox"));
 var _react2 = require("@emotion/react");
-
 var _default = {
   title: 'Components/ScrollBox',
   component: _ScrollBox["default"],
@@ -33,7 +24,6 @@ var _default = {
   }
 };
 exports["default"] = _default;
-
 var Default = function Default(args) {
   return (0, _react2.jsx)(_ScrollBox["default"], (0, _extends2["default"])({
     maxHeight: "100px"
@@ -43,5 +33,4 @@ var Default = function Default(args) {
     }
   }, (0, _react2.jsx)("p", null, "Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur?")));
 };
-
 exports.Default = Default;

package/lib/cjs/components/ScrollBox/ScrollBox.styles.js

@@ -1,11 +1,9 @@
 "use strict";
 
 var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
-
 _Object$defineProperty(exports, "__esModule", {
   value: true
 });
-
 exports["default"] = void 0;
 var topShadowBox = {
   '&.has-shadows.is-top-shadow-showing': {

package/lib/cjs/components/ScrollBox/ScrollBox.test.js

@@ -1,35 +1,24 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
-
 var _setTimeout2 = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/set-timeout"));
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
-
 var _react = _interopRequireDefault(require("react"));
-
 var _testWrapper = require("../../utils/testUtils/testWrapper");
-
 var _ScrollBox = _interopRequireDefault(require("./ScrollBox"));
-
 var _react2 = require("@emotion/react");
-
 var testId = 'scrollBoxTestId';
 var defaultProps = {
   'data-testid': testId,
   'maxHeight': '100px'
 };
-
 var getComponent = function getComponent() {
   var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   return (0, _testWrapper.render)((0, _react2.jsx)(_ScrollBox["default"], (0, _extends2["default"])({}, defaultProps, props)));
 };
-
 test('maxHeight passes into the component', function () {
   getComponent();
-
   var scrollBoxComponent = _testWrapper.screen.getByTestId(testId);
-
   expect(scrollBoxComponent).toBeInTheDocument();
   expect(scrollBoxComponent).toHaveStyle({
     maxHeight: '100px'
@@ -39,13 +28,9 @@ test('passing hasShadows renders the shadow css', function () {
   getComponent({
     hasShadows: true
   });
-
   var scrollBoxComponent = _testWrapper.screen.getByTestId(testId);
-
   expect(scrollBoxComponent).toBeInTheDocument();
-
   var shadows = _testWrapper.screen.getAllByRole('separator');
-
   expect(shadows[0]).toHaveClass('has-shadows');
   expect(shadows[1]).toHaveClass('has-shadows');
 });
@@ -53,13 +38,9 @@ test('with hasShadows prop only the bottom shadow is rendered first', function (
   getComponent({
     hasShadows: true
   });
-
   var scrollBoxComponent = _testWrapper.screen.getByTestId(testId);
-
   expect(scrollBoxComponent).toBeInTheDocument();
-
   var shadows = _testWrapper.screen.getAllByRole('separator');
-
   expect(shadows[0]).not.toHaveClass('is-top-shadow-showing');
   expect(shadows[1]).toHaveClass('is-bottom-shadow-showing');
 });
@@ -67,19 +48,14 @@ test('with hasShadows prop only the top shadow is rendered after scroll to down'
   getComponent({
     hasShadows: true
   });
-
   var scrollBoxComponent = _testWrapper.screen.getByTestId(testId);
-
   expect(scrollBoxComponent).toBeInTheDocument();
-
   _testWrapper.fireEvent.scroll(scrollBoxComponent, {
     target: {
       scrollY: 100
     }
   });
-
   var shadows = _testWrapper.screen.getAllByRole('separator');
-
   (0, _setTimeout2["default"])(function () {
     expect(shadows[0]).toHaveClass('is-top-shadow-showing');
     expect(shadows[1]).not.toHaveClass('is-bottom-shadow-showing');

package/lib/cjs/components/ScrollBox/index.js

@@ -1,18 +1,14 @@
 "use strict";
 
 var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
-
 var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
-
 _Object$defineProperty(exports, "__esModule", {
   value: true
 });
-
 _Object$defineProperty(exports, "default", {
   enumerable: true,
   get: function get() {
     return _ScrollBox["default"];
   }
 });
-
 var _ScrollBox = _interopRequireDefault(require("./ScrollBox"));

package/lib/cjs/components/SearchField/Search.styles.js

@@ -1,11 +1,9 @@
 "use strict";
 
 var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
-
 _Object$defineProperty(exports, "__esModule", {
   value: true
 });
-
 exports.wrapper = exports.icon = exports["default"] = exports.clearButtonIcon = void 0;
 var clearButtonIcon = {
   color: 'neutral.40'

package/lib/cjs/components/SearchField/SearchField.js

@@ -1,67 +1,37 @@
 "use strict";
 
 var _typeof = require("@babel/runtime-corejs3/helpers/typeof");
-
 var _Object$keys = require("@babel/runtime-corejs3/core-js-stable/object/keys");
-
 var _Object$getOwnPropertySymbols = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols");
-
 var _filterInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/filter");
-
 var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
-
 var _forEachInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/for-each");
-
 var _Object$getOwnPropertyDescriptors = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors");
-
 var _Object$defineProperties = require("@babel/runtime-corejs3/core-js-stable/object/define-properties");
-
 var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
-
 var _WeakMap = require("@babel/runtime-corejs3/core-js-stable/weak-map");
-
 var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
-
 _Object$defineProperty(exports, "__esModule", {
   value: true
 });
-
 exports["default"] = void 0;
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
-
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
-
 var _react = _interopRequireWildcard(require("react"));
-
+var _reactAria = require("react-aria");
+var _reactStately = require("react-stately");
 var _CloseIcon = _interopRequireDefault(require("mdi-react/CloseIcon"));
-
 var _SearchIcon = _interopRequireDefault(require("mdi-react/SearchIcon"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
-var _reactAria = require("react-aria");
-
-var _reactStately = require("react-stately");
-
-var _ = require("../../");
-
+var _ = require("../..");
+var _hooks = require("../../hooks");
 var _ariaAttributes = require("../../utils/devUtils/props/ariaAttributes");
-
 var _fieldAttributes = require("../../utils/devUtils/props/fieldAttributes");
-
-var _hooks = require("../../hooks");
-
 var _react2 = require("@emotion/react");
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = _Object$defineProperty && _Object$getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? _Object$getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { _Object$defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
 function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); enumerableOnly && (symbols = _filterInstanceProperty(symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context, _context2; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(source), !0)).call(_context, function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context2 = ownKeys(Object(source))).call(_context2, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
-
 /**
  * Renders a search field with associated controls including visual elements and keyboard
  * interaction handlers.
@@ -73,49 +43,43 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
  */
 var SearchField = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   var autocomplete = props.autocomplete,
-      hasAutoFocus = props.hasAutoFocus,
-      hasNoClearButton = props.hasNoClearButton,
-      icon = props.icon,
-      isExcludedFromTabOrder = props.isExcludedFromTabOrder,
-      label = props.label,
-      controlProps = props.controlProps,
-      iconProps = props.iconProps,
-      labelProps = props.labelProps;
+    hasAutoFocus = props.hasAutoFocus,
+    hasNoClearButton = props.hasNoClearButton,
+    icon = props.icon,
+    isExcludedFromTabOrder = props.isExcludedFromTabOrder,
+    label = props.label,
+    controlProps = props.controlProps,
+    iconProps = props.iconProps,
+    labelProps = props.labelProps;
   var searchRef = (0, _react.useRef)();
   (0, _hooks.usePropWarning)(props, 'disabled', 'isDisabled');
   /* istanbul ignore next */
-
   (0, _react.useImperativeHandle)(ref, function () {
     return searchRef.current;
   });
   var state = (0, _reactStately.useSearchFieldState)(props);
-
   var _useSearchField = (0, _reactAria.useSearchField)(_objectSpread({
-    autoComplete: autocomplete,
-    autoFocus: hasAutoFocus,
-    excludeFromTabOrder: isExcludedFromTabOrder
-  }, props), state, searchRef),
-      raLabelProps = _useSearchField.labelProps,
-      raInputProps = _useSearchField.inputProps,
-      clearButtonProps = _useSearchField.clearButtonProps;
-
+      autoComplete: autocomplete,
+      autoFocus: hasAutoFocus,
+      excludeFromTabOrder: isExcludedFromTabOrder
+    }, props), state, searchRef),
+    raLabelProps = _useSearchField.labelProps,
+    raInputProps = _useSearchField.inputProps,
+    clearButtonProps = _useSearchField.clearButtonProps;
   var _useField = (0, _hooks.useField)(_objectSpread(_objectSpread({}, props), {}, {
-    labelProps: _objectSpread(_objectSpread({}, labelProps), raLabelProps),
-    controlProps: _objectSpread(_objectSpread({}, controlProps), raInputProps)
-  })),
-      fieldContainerProps = _useField.fieldContainerProps,
-      fieldControlInputProps = _useField.fieldControlInputProps,
-      fieldControlWrapperProps = _useField.fieldControlWrapperProps,
-      fieldLabelProps = _useField.fieldLabelProps;
-
+      labelProps: _objectSpread(_objectSpread({}, labelProps), raLabelProps),
+      controlProps: _objectSpread(_objectSpread({}, controlProps), raInputProps)
+    })),
+    fieldContainerProps = _useField.fieldContainerProps,
+    fieldControlInputProps = _useField.fieldControlInputProps,
+    fieldControlWrapperProps = _useField.fieldControlWrapperProps,
+    fieldLabelProps = _useField.fieldLabelProps;
   var handleKeyDownEvent = function handleKeyDownEvent(e) {
     var key = e.key;
-
     if (key === 'Enter' || key === ' ') {
       state.setValue('');
     }
   };
-
   return (0, _react2.jsx)(_.Box, fieldContainerProps, label && (0, _react2.jsx)(_.Label, fieldLabelProps), (0, _react2.jsx)(_.Box, (0, _extends2["default"])({
     variant: "forms.search.wrapper"
   }, fieldControlWrapperProps), (0, _react2.jsx)(_.Input, (0, _extends2["default"])({
@@ -148,120 +112,95 @@ SearchField.propTypes = _objectSpread(_objectSpread({
    * group, or application.
    */
   'aria-activedescendant': _propTypes["default"].string,
-
   /**
    * Indicates whether inputting text could trigger display of one or more predictions of the
    * user's intended value for an input and specifies how predictions would be presented if they
    * are made.
    */
   'aria-autocomplete': _propTypes["default"].oneOf(['none', 'inline', 'list', 'both']),
-
   /**
    * @ignore
    * Indicates the availability and type of interactive popup element, such as menu or dialog, that
    * can be triggered by an element.
    */
   'aria-haspopup': _propTypes["default"].oneOf([true, false, 'menu', 'listbox', 'tree', 'grid', 'dialog']),
-
   /** How the input should handle autocompletion according to the browser. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#htmlattrdefautocomplete). The `autocomplete` prop is an alias for this. */
   autoComplete: _propTypes["default"].string,
-
   /** @ignore Alias for `autoComplete` prop. Exists for backwards-compatibility. */
   autocomplete: _propTypes["default"].string,
-
   /** The default value (uncontrolled). */
   defaultValue: _propTypes["default"].string,
-
   /** Whether the element should receive focus on render. */
   hasAutoFocus: _propTypes["default"].bool,
-
   /** Whether to display the clear button or not. */
   hasNoClearButton: _propTypes["default"].bool,
-
   /** The icon to display alongside the placeholder text. */
   icon: _propTypes["default"].elementType,
-
   /** The element's unique identifier. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/id). */
   id: _propTypes["default"].string,
-
   /** Whether the input is disabled. */
   isDisabled: _propTypes["default"].bool,
-
   /** The content to display as the label. */
   label: _propTypes["default"].node,
-
   /** The name of the input element, used when submitting an HTML form. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#htmlattrdefname). */
   name: _propTypes["default"].string,
-
   /** Temporary text that occupies the text input when it is empty. */
   placeholder: _propTypes["default"].string,
-
   /** The current value (controlled). */
   value: _propTypes["default"].string,
-
   /**
    * Handler that is called when the SearchField is submitted.
    * (value: string) => void
    */
   onSubmit: _propTypes["default"].func,
-
   /**
    * Handler that is called when the clear button is pressed.
    * () => void
    */
   onClear: _propTypes["default"].func,
-
   /**
    * Handler that is called when the element receives focus.
    * (e: FocusEvent) => void
    */
   onFocus: _propTypes["default"].func,
-
   /**
    * Handler that is called when the element loses focus.
    * (e: FocusEvent) => void
    */
   onBlur: _propTypes["default"].func,
-
   /**
    * Handler that is called when a key is pressed.
    * (e: KeyboardEvent) => void
    */
   onKeyDown: _propTypes["default"].func,
-
   /**
    * Handler that is called when a key is released.
    * (e: KeyboardEvent) => void
    */
   onKeyUp: _propTypes["default"].func,
-
   /**
    * Handler that is called when the value changes.
    * (value: string) => void
    */
   onChange: _propTypes["default"].func,
-
   /** Props object that is spread into the icon element. */
   iconProps: _propTypes["default"].shape({}),
   // NOTE: unsurfaced useSearchField / useSearchFieldState props listed below
 
   /** @ignore Whether the input can be selected but not changed by the user. */
   isReadOnly: _propTypes["default"].bool,
-
   /**
    * @ignore
    * Whether user input is required on the input before form submission.
    * Often paired with the necessityIndicator prop to add a visual indicator to the input.
    */
   isRequired: _propTypes["default"].bool,
-
   /**
    * @ignore
    * Handler that is called when the element's focus status changes.
    * (isFocused: boolean) => void
    */
   onFocusChange: _propTypes["default"].func,
-
   /**
    * @ignore
    * Whether to exclude the element from the sequential tab order. If true, the element will not be
@@ -270,71 +209,57 @@ SearchField.propTypes = _objectSpread(_objectSpread({
    * available.
    */
   isExcludedFromTabOrder: _propTypes["default"].bool,
-
   /** The maximum number of characters supported by the input set by the user. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#htmlattrdefmaxlength). */
   maxLength: _propTypes["default"].number,
-
   /** @ignore The minimum number of characters required by the input. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#htmlattrdefminlength). */
   minLength: _propTypes["default"].number,
-
   /** @ignore Regex pattern that the value of the input must match to be valid. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#htmlattrdefpattern). */
   pattern: _propTypes["default"].string,
-
   /** @ignore The type of input to render. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#htmlattrdeftype). */
   type: _propTypes["default"].string,
-
   /**
    * @ignore
    * Hints at the type of data that might be entered by the user while editing the element or its
    * contents. See [MDN](https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute).
    */
   inputMode: _propTypes["default"].oneOf(['none', 'text', 'tel', 'url', 'email', 'numeric', 'decimal', 'search']),
-
   /**
    * @ignore
    * Handler that is called when the user copies text. See [MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/oncopy).
    */
   onCopy: _propTypes["default"].func,
-
   /** @ignore Handler that is called when the user cuts text. See [MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/oncut). */
   onCut: _propTypes["default"].func,
-
   /** @ignore Handler that is called when the user pastes text. See [MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/onpaste). */
   onPaste: _propTypes["default"].func,
-
   /**
    * @ignore
    * Handler that is called when a text composition system starts a new text composition session.
    * See [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Element/compositionstart_event).
    */
   onCompositionStart: _propTypes["default"].func,
-
   /**
    * @ignore
    * Handler that is called when a text composition system completes or cancels the current text
    * composition session. See [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Element/compositionend_event).
    */
   onCompositionEnd: _propTypes["default"].func,
-
   /**
    * @ignore
    * Handler that is called when a new character is received in the current text composition
    * session. See [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Element/compositionupdate_event).
    */
   onCompositionUpdate: _propTypes["default"].func,
-
   /**
    * @ignore
    * Handler that is called when text in the input is selected. See [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Element/select_event).
    */
   onSelect: _propTypes["default"].func,
-
   /**
    * @ignore
    * Handler that is called when the input value is about to be modified. See [MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/beforeinput_event).
    */
   onBeforeInput: _propTypes["default"].func,
-
   /**
    * @ignore
    * Handler that is called when the input value is modified. See [MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/input_event).