ReactSelect: Export styled async component from react-select

packages/core/helper-plugin/lib/src/components/ReactSelect/Async/Async.js

@@ -0,0 +1,41 @@
+import PropTypes from 'prop-types';
+import React from 'react';
+import SelectAsync from 'react-select/async';
+import { useTheme } from 'styled-components';
+
+import ClearIndicator from '../components/ClearIndicator';
+import DropdownIndicator from '../components/DropdownIndicator';
+import IndicatorSeparator from '../components/IndicatorSeparator';
+
+import getSelectStyles from '../utils/getSelectStyles';
+
+const ReactSelectAsync = ({ components, styles, error, ariaErrorMessage, ...props }) => {
+  const theme = useTheme();
+  const customStyles = getSelectStyles(theme, error);
+
+  return (
+    <SelectAsync
+      {...props}
+      components={{ ClearIndicator, DropdownIndicator, IndicatorSeparator, ...components }}
+      aria-errormessage={error && ariaErrorMessage}
+      aria-invalid={!!error}
+      styles={{ ...customStyles, ...styles }}
+    />
+  );
+};
+
+export default ReactSelectAsync;
+
+ReactSelectAsync.defaultProps = {
+  ariaErrorMessage: undefined,
+  components: undefined,
+  error: undefined,
+  styles: undefined,
+};
+
+ReactSelectAsync.propTypes = {
+  ariaErrorMessage: PropTypes.string,
+  components: PropTypes.object,
+  error: PropTypes.string,
+  styles: PropTypes.object,
+};

packages/core/helper-plugin/lib/src/components/ReactSelect/Async/index.js

@@ -0,0 +1 @@
+export default from './Async';

packages/core/helper-plugin/lib/src/components/ReactSelect/index.js

@@ -1,3 +1 @@
-import ReactSelect from './ReactSelect';
+export default from './ReactSelect';
-
-export default ReactSelect;

packages/core/helper-plugin/lib/src/index.js

@@ -64,6 +64,7 @@ export { default as PageSizeURLQuery } from './components/PageSizeURLQuery';
 export { default as RelativeTime } from './components/RelativeTime';
 export { default as DateTimePicker } from './components/DateTimePicker';
 export { default as ReactSelect } from './components/ReactSelect';
+export { default as ReactSelectAsync } from './components/ReactSelect/Async';
 export { default as Link } from './components/Link';
 export { default as LinkButton } from './components/LinkButton';