ReactSelect: Export styled async component from react-select

This commit is contained in:
Gustav Hansen 2022-08-08 15:48:16 +02:00
parent 78c8651e1e
commit 884aee6e96
4 changed files with 44 additions and 3 deletions

View File

@ -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,
};

View File

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

View File

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

View File

@ -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';