@carbon/react 0.17.0-rc.0 → 1.0.0

package/lib/components/RadioButtonGroup/next/RadioButtonGroup.js

@@ -0,0 +1,151 @@
+/**
+ * Copyright IBM Corp. 2016, 2021
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
+var PropTypes = require('prop-types');
+var React = require('react');
+var cx = require('classnames');
+var index = require('../../Text/index.js');
+var usePrefix = require('../../../internal/usePrefix.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
+
+var RadioButtonGroup = /*#__PURE__*/React__default["default"].forwardRef(function RadioButtonGroup(_ref, ref) {
+  var _classNames;
+
+  var children = _ref.children,
+      className = _ref.className,
+      defaultSelected = _ref.defaultSelected,
+      disabled = _ref.disabled,
+      _ref$labelPosition = _ref.labelPosition,
+      labelPosition = _ref$labelPosition === void 0 ? 'right' : _ref$labelPosition,
+      legendText = _ref.legendText,
+      name = _ref.name,
+      _ref$onChange = _ref.onChange,
+      onChange = _ref$onChange === void 0 ? function () {} : _ref$onChange,
+      _ref$orientation = _ref.orientation,
+      orientation = _ref$orientation === void 0 ? 'horizontal' : _ref$orientation,
+      valueSelected = _ref.valueSelected;
+  var prefix = usePrefix.usePrefix();
+
+  var _useState = React.useState(valueSelected !== null && valueSelected !== void 0 ? valueSelected : defaultSelected),
+      _useState2 = _rollupPluginBabelHelpers.slicedToArray(_useState, 2),
+      selected = _useState2[0],
+      setSelected = _useState2[1];
+
+  var _useState3 = React.useState(valueSelected),
+      _useState4 = _rollupPluginBabelHelpers.slicedToArray(_useState3, 2),
+      prevValueSelected = _useState4[0],
+      setPrevValueSelected = _useState4[1];
+  /**
+   * prop + state alignment - getDerivedStateFromProps
+   * only update if selected prop changes
+   */
+
+
+  if (valueSelected !== prevValueSelected) {
+    setSelected(valueSelected);
+    setPrevValueSelected(valueSelected);
+  }
+
+  function getRadioButtons() {
+    var mappedChildren = React__default["default"].Children.map(children, function (radioButton) {
+      var value = radioButton.props.value;
+      return /*#__PURE__*/React__default["default"].cloneElement(radioButton, {
+        name: name,
+        key: value,
+        value: value,
+        onChange: handleOnChange,
+        checked: value === selected
+      });
+    });
+    return mappedChildren;
+  }
+
+  function handleOnChange(newSelection, value, evt) {
+    if (newSelection !== selected) {
+      setSelected(newSelection);
+      onChange(newSelection, name, evt);
+    }
+  }
+
+  var fieldsetClasses = cx__default["default"]("".concat(prefix, "--radio-button-group"), (_classNames = {}, _rollupPluginBabelHelpers.defineProperty(_classNames, "".concat(prefix, "--radio-button-group--").concat(orientation), orientation === 'vertical'), _rollupPluginBabelHelpers.defineProperty(_classNames, "".concat(prefix, "--radio-button-group--label-").concat(labelPosition), labelPosition), _classNames));
+  var wrapperClasses = cx__default["default"]("".concat(prefix, "--form-item"), className);
+  return /*#__PURE__*/React__default["default"].createElement("div", {
+    className: wrapperClasses,
+    ref: ref
+  }, /*#__PURE__*/React__default["default"].createElement("fieldset", {
+    className: fieldsetClasses,
+    disabled: disabled
+  }, legendText && /*#__PURE__*/React__default["default"].createElement(index.Legend, {
+    className: "".concat(prefix, "--label")
+  }, legendText), getRadioButtons()));
+});
+RadioButtonGroup.propTypes = {
+  /**
+   * Provide a collection of `<RadioButton>` components to render in the group
+   */
+  children: PropTypes__default["default"].node,
+
+  /**
+   * Provide an optional className to be applied to the container node
+   */
+  className: PropTypes__default["default"].string,
+
+  /**
+   * Specify the `<RadioButton>` to be selected by default
+   */
+  defaultSelected: PropTypes__default["default"].oneOfType([PropTypes__default["default"].string, PropTypes__default["default"].number]),
+
+  /**
+   * Specify whether the group is disabled
+   */
+  disabled: PropTypes__default["default"].bool,
+
+  /**
+   * Provide where label text should be placed
+   */
+  labelPosition: PropTypes__default["default"].oneOf(['left', 'right']),
+
+  /**
+   * Provide a legend to the RadioButtonGroup input that you are
+   * exposing to the user
+   */
+  legendText: PropTypes__default["default"].node,
+
+  /**
+   * Specify the name of the underlying `<input>` nodes
+   */
+  name: PropTypes__default["default"].string.isRequired,
+
+  /**
+   * Provide an optional `onChange` hook that is called whenever the value of
+   * the group changes
+   */
+  onChange: PropTypes__default["default"].func,
+
+  /**
+   * Provide where radio buttons should be placed
+   */
+  orientation: PropTypes__default["default"].oneOf(['horizontal', 'vertical']),
+
+  /**
+   * Specify the value that is currently selected in the group
+   */
+  valueSelected: PropTypes__default["default"].oneOfType([PropTypes__default["default"].string, PropTypes__default["default"].number])
+};
+var RadioButtonGroupNext = RadioButtonGroup;
+
+exports["default"] = RadioButtonGroupNext;

package/lib/components/RadioTile/RadioTile.js

@@ -0,0 +1,150 @@
+/**
+ * Copyright IBM Corp. 2016, 2021
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
+var iconsReact = require('@carbon/icons-react');
+var cx = require('classnames');
+var PropTypes = require('prop-types');
+var React = require('react');
+var useId = require('../../internal/useId.js');
+var index = require('../FeatureFlags/index.js');
+var usePrefix = require('../../internal/usePrefix.js');
+var deprecate = require('../../prop-types/deprecate.js');
+var match = require('../../internal/keyboard/match.js');
+var keys = require('../../internal/keyboard/keys.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
+var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+var _CheckmarkFilled;
+
+var _excluded = ["children", "className", "disabled", "light", "checked", "name", "value", "id", "onChange", "tabIndex"];
+
+function RadioTile(_ref) {
+  var _cx;
+
+  var children = _ref.children,
+      customClassName = _ref.className,
+      disabled = _ref.disabled,
+      light = _ref.light,
+      checked = _ref.checked,
+      name = _ref.name,
+      value = _ref.value,
+      id = _ref.id,
+      onChange = _ref.onChange,
+      tabIndex = _ref.tabIndex,
+      rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
+
+  var prefix = usePrefix.usePrefix();
+  var inputId = useId.useFallbackId(id);
+  var enabled = index.useFeatureFlag('enable-v11-release');
+  var className = cx__default["default"](customClassName, "".concat(prefix, "--tile"), "".concat(prefix, "--tile--selectable"), (_cx = {}, _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--tile--is-selected"), checked), _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--tile--light"), light), _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--tile--disabled"), disabled), _cx));
+  var inputProps = enabled ? {} : rest;
+  var labelProps = enabled ? rest : {};
+
+  function handleOnChange(evt) {
+    onChange(value, name, evt);
+  }
+
+  function handleOnKeyDown(evt) {
+    if (match.matches(evt, [keys.Enter, keys.Space])) {
+      evt.preventDefault();
+      onChange(value, name, evt);
+    }
+  }
+
+  return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("input", _rollupPluginBabelHelpers["extends"]({}, inputProps, {
+    checked: checked,
+    className: "".concat(prefix, "--tile-input"),
+    disabled: disabled,
+    id: inputId,
+    name: name,
+    onChange: !disabled ? handleOnChange : null,
+    onKeyDown: !disabled ? handleOnKeyDown : null,
+    tabIndex: !disabled ? tabIndex : null,
+    type: "radio",
+    value: value
+  })), /*#__PURE__*/React__default["default"].createElement("label", _rollupPluginBabelHelpers["extends"]({}, labelProps, {
+    htmlFor: inputId,
+    className: className
+  }), /*#__PURE__*/React__default["default"].createElement("span", {
+    className: "".concat(prefix, "--tile__checkmark")
+  }, _CheckmarkFilled || (_CheckmarkFilled = /*#__PURE__*/React__default["default"].createElement(iconsReact.CheckmarkFilled, null))), /*#__PURE__*/React__default["default"].createElement("span", {
+    className: "".concat(prefix, "--tile-content")
+  }, children)));
+}
+
+RadioTile.propTypes = {
+  /**
+   * `true` if this tile should be selected.
+   */
+  checked: PropTypes__default["default"].bool,
+
+  /**
+   * The tile content.
+   */
+  children: PropTypes__default["default"].node,
+
+  /**
+   * The CSS class names.
+   */
+  className: PropTypes__default["default"].string,
+
+  /**
+   * `true` if the `<input>` should be checked at initialization.
+   */
+  defaultChecked: PropTypes__default["default"].bool,
+
+  /**
+   * Specify whether the RadioTile should be disabled
+   */
+  disabled: PropTypes__default["default"].bool,
+
+  /**
+   * The ID of the `<input>`.
+   */
+  id: PropTypes__default["default"].string,
+
+  /**
+   * `true` to use the light version. For use on $ui-01 backgrounds only.
+   * Don't use this to make tile background color same as container background color.
+   */
+  light: deprecate["default"](PropTypes__default["default"].bool, 'The `light` prop for `RadioTile` is no longer needed and has ' + 'been deprecated in v11 in favor of the new `Layer` component. It will be moved in the next major release.'),
+
+  /**
+   * The `name` of the `<input>`.
+   */
+  name: PropTypes__default["default"].string,
+
+  /**
+   * The handler of the massaged `change` event on the `<input>`.
+   */
+  onChange: PropTypes__default["default"].func,
+
+  /**
+   * Specify the tab index of the wrapper element
+   */
+  tabIndex: PropTypes__default["default"].number,
+
+  /**
+   * The `value` of the `<input>`.
+   */
+  value: PropTypes__default["default"].oneOfType([PropTypes__default["default"].string, PropTypes__default["default"].number]).isRequired
+};
+RadioTile.defaultProps = {
+  onChange: function onChange() {},
+  tabIndex: 0
+};
+
+exports["default"] = RadioTile;

package/lib/components/Search/Search.Skeleton.js

@@ -0,0 +1,60 @@
+/**
+ * Copyright IBM Corp. 2016, 2021
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
+var PropTypes = require('prop-types');
+var React = require('react');
+var cx = require('classnames');
+var usePrefix = require('../../internal/usePrefix.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
+
+var _excluded = ["small", "className"];
+
+var SearchSkeleton = function SearchSkeleton(_ref) {
+  var _cx;
+
+  var small = _ref.small,
+      className = _ref.className,
+      rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
+
+  var prefix = usePrefix.usePrefix();
+  var searchClasses = cx__default["default"](className, (_cx = {}, _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--skeleton"), true), _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--search--xl"), !small), _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--search--sm"), small), _cx));
+  return /*#__PURE__*/React__default["default"].createElement("div", _rollupPluginBabelHelpers["extends"]({
+    className: searchClasses
+  }, rest), /*#__PURE__*/React__default["default"].createElement("span", {
+    className: "".concat(prefix, "--label")
+  }), /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "".concat(prefix, "--search-input")
+  }));
+};
+
+SearchSkeleton.propTypes = {
+  /**
+   * Specify an optional className to add.
+   */
+  className: PropTypes__default["default"].string,
+
+  /**
+   * Specify whether the Search should be a small variant
+   */
+  small: PropTypes__default["default"].bool
+};
+SearchSkeleton.defaultProps = {
+  small: false
+};
+var SearchSkeleton$1 = SearchSkeleton;
+
+exports["default"] = SearchSkeleton$1;

package/lib/components/Search/Search.js

@@ -0,0 +1,299 @@
+/**
+ * Copyright IBM Corp. 2016, 2021
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
+var PropTypes = require('prop-types');
+var React = require('react');
+var cx = require('classnames');
+var iconsReact = require('@carbon/icons-react');
+var events = require('../../tools/events.js');
+var deprecate = require('../../prop-types/deprecate.js');
+var index = require('../FeatureFlags/index.js');
+var usePrefix = require('../../internal/usePrefix.js');
+var match = require('../../internal/keyboard/match.js');
+var keys = require('../../internal/keyboard/keys.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
+
+var _Close;
+
+var _excluded = ["className", "type", "id", "placeHolderText", "placeholder", "labelText", "closeButtonLabelText", "small", "size", "light", "disabled", "onChange", "onKeyDown", "renderIcon", "onClear"];
+
+var Search = /*#__PURE__*/function (_Component) {
+  _rollupPluginBabelHelpers.inherits(Search, _Component);
+
+  var _super = _rollupPluginBabelHelpers.createSuper(Search);
+
+  function Search() {
+    var _this;
+
+    _rollupPluginBabelHelpers.classCallCheck(this, Search);
+
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    _this = _super.call.apply(_super, [this].concat(args));
+
+    _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.assertThisInitialized(_this), "state", {
+      hasContent: _this.props.value || _this.props.defaultValue || false,
+      prevValue: _this.props.value
+    });
+
+    _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.assertThisInitialized(_this), "clearInput", function (evt) {
+      if (!_this.props.value) {
+        _this.input.value = '';
+
+        _this.props.onChange(evt);
+      } else {
+        var clearedEvt = Object.assign({}, evt.target, {
+          target: {
+            value: ''
+          }
+        });
+
+        _this.props.onChange(clearedEvt);
+      }
+
+      _this.props.onClear();
+
+      _this.setState({
+        hasContent: false
+      }, function () {
+        return _this.input.focus();
+      });
+    });
+
+    _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.assertThisInitialized(_this), "handleChange", function (evt) {
+      _this.setState({
+        hasContent: evt.target.value !== ''
+      });
+    });
+
+    _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.assertThisInitialized(_this), "handleKeyDown", function (evt) {
+      if (match.match(evt, keys.Escape)) {
+        _this.clearInput(evt);
+      }
+    });
+
+    return _this;
+  }
+
+  _rollupPluginBabelHelpers.createClass(Search, [{
+    key: "render",
+    value: function render() {
+      var _this2 = this;
+
+      var _this$props = this.props,
+          className = _this$props.className,
+          type = _this$props.type,
+          _this$props$id = _this$props.id,
+          id = _this$props$id === void 0 ? this._inputId = this._inputId || "search__input__id_".concat(Math.random().toString(36).substr(2)) : _this$props$id,
+          placeHolderText = _this$props.placeHolderText,
+          placeholder = _this$props.placeholder,
+          labelText = _this$props.labelText,
+          closeButtonLabelText = _this$props.closeButtonLabelText,
+          small = _this$props.small,
+          _this$props$size = _this$props.size,
+          size = _this$props$size === void 0 ? !small ? 'xl' : 'sm' : _this$props$size,
+          light = _this$props.light,
+          disabled = _this$props.disabled,
+          onChange = _this$props.onChange,
+          onKeyDown = _this$props.onKeyDown,
+          renderIcon = _this$props.renderIcon;
+          _this$props.onClear;
+          var other = _rollupPluginBabelHelpers.objectWithoutProperties(_this$props, _excluded);
+
+      var hasContent = this.state.hasContent;
+      var scope = this.context;
+      var enabled;
+
+      if (scope.enabled) {
+        enabled = scope.enabled('enable-v11-release');
+      }
+
+      return /*#__PURE__*/React__default["default"].createElement(usePrefix.PrefixContext.Consumer, null, function (prefix) {
+        var _classNames, _classNames2;
+
+        var searchClasses = cx__default["default"]((_classNames = {}, _rollupPluginBabelHelpers.defineProperty(_classNames, "".concat(prefix, "--search"), true), _rollupPluginBabelHelpers.defineProperty(_classNames, "".concat(prefix, "--search--sm"), size === 'sm'), _rollupPluginBabelHelpers.defineProperty(_classNames, "".concat(prefix, "--search--lg"), enabled ? size === 'md' : size === 'lg'), _rollupPluginBabelHelpers.defineProperty(_classNames, "".concat(prefix, "--search--xl"), enabled ? size === 'lg' : size === 'xl'), _rollupPluginBabelHelpers.defineProperty(_classNames, "".concat(prefix, "--search--light"), light), _rollupPluginBabelHelpers.defineProperty(_classNames, "".concat(prefix, "--search--disabled"), disabled), _rollupPluginBabelHelpers.defineProperty(_classNames, className, className), _classNames));
+        var clearClasses = cx__default["default"]((_classNames2 = {}, _rollupPluginBabelHelpers.defineProperty(_classNames2, "".concat(prefix, "--search-close"), true), _rollupPluginBabelHelpers.defineProperty(_classNames2, "".concat(prefix, "--search-close--hidden"), !hasContent), _classNames2));
+        var customIcon;
+
+        if (renderIcon) {
+          customIcon = /*#__PURE__*/React__default["default"].cloneElement(renderIcon, {
+            className: "".concat(prefix, "--search-magnifier-icon")
+          });
+        }
+
+        var searchId = "".concat(id, "-search");
+        var searchIcon = renderIcon ? customIcon : /*#__PURE__*/React__default["default"].createElement(iconsReact.Search, {
+          className: "".concat(prefix, "--search-magnifier-icon")
+        });
+        return /*#__PURE__*/React__default["default"].createElement("div", {
+          role: "search",
+          "aria-labelledby": searchId,
+          className: searchClasses
+        }, /*#__PURE__*/React__default["default"].createElement("div", {
+          className: "".concat(prefix, "--search-magnifier"),
+          ref: function ref(magnifier) {
+            _this2.magnifier = magnifier;
+          }
+        }, searchIcon), /*#__PURE__*/React__default["default"].createElement("label", {
+          id: searchId,
+          htmlFor: id,
+          className: "".concat(prefix, "--label")
+        }, labelText), /*#__PURE__*/React__default["default"].createElement("input", _rollupPluginBabelHelpers["extends"]({
+          role: "searchbox",
+          autoComplete: "off"
+        }, other, {
+          type: type,
+          disabled: disabled,
+          className: "".concat(prefix, "--search-input"),
+          id: id,
+          placeholder: placeHolderText || placeholder,
+          onChange: events.composeEventHandlers([onChange, _this2.handleChange]),
+          onKeyDown: events.composeEventHandlers([onKeyDown, _this2.handleKeyDown]),
+          ref: function ref(input) {
+            _this2.input = input;
+          }
+        })), /*#__PURE__*/React__default["default"].createElement("button", {
+          className: clearClasses,
+          disabled: disabled,
+          onClick: _this2.clearInput,
+          type: "button",
+          "aria-label": closeButtonLabelText
+        }, _Close || (_Close = /*#__PURE__*/React__default["default"].createElement(iconsReact.Close, null))));
+      });
+    }
+  }], [{
+    key: "getDerivedStateFromProps",
+    value: function getDerivedStateFromProps(_ref, state) {
+      var value = _ref.value;
+      var prevValue = state.prevValue;
+      return prevValue === value ? null : {
+        hasContent: !!value,
+        prevValue: value
+      };
+    }
+  }]);
+
+  return Search;
+}(React.Component);
+
+_rollupPluginBabelHelpers.defineProperty(Search, "propTypes", {
+  /**
+   * Specify an optional className to be applied to the container node
+   */
+  className: PropTypes__default["default"].string,
+
+  /**
+   * Specify a label to be read by screen readers on the "close" button
+   */
+  closeButtonLabelText: PropTypes__default["default"].string,
+
+  /**
+   * Optionally provide the default value of the `<input>`
+   */
+  defaultValue: PropTypes__default["default"].oneOfType([PropTypes__default["default"].string, PropTypes__default["default"].number]),
+
+  /**
+   * Specify whether the `<input>` should be disabled
+   */
+  disabled: PropTypes__default["default"].bool,
+
+  /**
+   * Specify a custom `id` for the input
+   */
+  id: PropTypes__default["default"].string,
+
+  /**
+   * Provide the label text for the Search icon
+   */
+  labelText: PropTypes__default["default"].node.isRequired,
+
+  /**
+   * Specify light version or default version of this control
+   */
+  light: PropTypes__default["default"].bool,
+
+  /**
+   * Optional callback called when the search value changes.
+   */
+  onChange: PropTypes__default["default"].func,
+
+  /**
+   * Optional callback called when the search value is cleared.
+   */
+  onClear: PropTypes__default["default"].func,
+
+  /**
+   * Provide a handler that is invoked on the key down event for the input
+   */
+  onKeyDown: PropTypes__default["default"].func,
+
+  /**
+   * Deprecated in favor of `placeholder`
+   */
+  placeHolderText: deprecate["default"](PropTypes__default["default"].string, "\nThe prop `placeHolderText` for Search has been deprecated in favor of `placeholder`. Please use `placeholder` instead."),
+
+  /**
+   * Provide an optional placeholder text for the Search.
+   * Note: if the label and placeholder differ,
+   * VoiceOver on Mac will read both
+   */
+  placeholder: PropTypes__default["default"].string,
+
+  /**
+   * Rendered icon for the Search.
+   * Can be a React component class
+   */
+  renderIcon: PropTypes__default["default"].oneOfType([PropTypes__default["default"].func, PropTypes__default["default"].object]),
+
+  /**
+   * Specify the search size
+   */
+  size: PropTypes__default["default"].oneOf(['sm', 'md', 'lg', 'xl']),
+
+  /**
+   * Specify whether the Search should be a small variant
+   */
+
+  /**
+   * Specify whether the load was successful
+   */
+  small: deprecate["default"](PropTypes__default["default"].bool, "\nThe prop `small` for Search has been deprecated in favor of `size`. Please use `size=\"sm\"` instead."),
+
+  /**
+   * Optional prop to specify the type of the `<input>`
+   */
+  type: PropTypes__default["default"].string,
+
+  /**
+   * Specify the value of the `<input>`
+   */
+  value: PropTypes__default["default"].oneOfType([PropTypes__default["default"].string, PropTypes__default["default"].number])
+});
+
+_rollupPluginBabelHelpers.defineProperty(Search, "contextType", index.FeatureFlagContext);
+
+_rollupPluginBabelHelpers.defineProperty(Search, "defaultProps", {
+  type: 'text',
+  placeholder: '',
+  closeButtonLabelText: 'Clear search input',
+  onChange: function onChange() {},
+  onClear: function onClear() {}
+});
+
+exports["default"] = Search;