@ntbjs/react-components 2.0.0-rc.26 → 2.0.0-rc.27

package/build/{CompactAutocompleteSelect-797778cb.js → CompactAutocompleteSelect-52c49513.js}

@@ -1,32 +1,23 @@
-'use strict';
+import { _ as _extends } from './_rollupPluginBabelHelpers-c245b26a.js';
+import { isEmpty } from 'lodash';
+import { nanoid } from 'nanoid';
+import { a as applyDefaultTheme, P as PropTypes } from './defaultTheme-1bcc2541.js';
+import React__default, { useState, useMemo } from 'react';
+import './Alert-e6847a22.js';
+import './Badge-d93586a9.js';
+import './Popover-20050b91.js';
+import './Tab-04d435c3.js';
+import './Tabs-74d1ea8a.js';
+import { T as Tooltip } from './Tooltip-c1d1199e.js';
+import './VerificationStatusIcon-49cb1c1b.js';
+import styled, { keyframes, css } from 'styled-components';
+import Select, { components } from 'react-select';
+import { withAsyncPaginate, AsyncPaginate } from 'react-select-async-paginate';
+import CreatableSelect from 'react-select/creatable';
+import { S as SvgClose } from './close-a5d37608.js';
+import { S as SvgExpandMore } from './expand-more-c5523c46.js';
 
-var _rollupPluginBabelHelpers = require('./_rollupPluginBabelHelpers-4b342fad.js');
-var lodash = require('lodash');
-var nanoid = require('nanoid');
-var defaultTheme = require('./defaultTheme-d9a7342e.js');
-var React = require('react');
-require('./Alert-8a511bdc.js');
-require('./Badge-aa4cd9c1.js');
-require('./Popover-c4be47ea.js');
-require('./Tab-ccbca1f2.js');
-require('./Tabs-b06c0e24.js');
-var Tooltip = require('./Tooltip-d5882b82.js');
-require('./VerificationStatusIcon-9876b68f.js');
-var styled = require('styled-components');
-var Select = require('react-select');
-var reactSelectAsyncPaginate = require('react-select-async-paginate');
-var CreatableSelect = require('react-select/creatable');
-var close = require('./close-1751121a.js');
-var expandMore = require('./expand-more-d74e2bd2.js');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
-var Select__default = /*#__PURE__*/_interopDefaultLegacy(Select);
-var CreatableSelect__default = /*#__PURE__*/_interopDefaultLegacy(CreatableSelect);
-
-const fadeIn = styled.keyframes`
+const fadeIn = keyframes`
   from {
     background-color: ${props => props.theme.themeProp('rgba(48, 130, 106, 0)', 'rgba(191, 224, 213, 0)')};
   }
@@ -34,7 +25,7 @@ const fadeIn = styled.keyframes`
     background-color: ${props => props.theme.themeProp('rgba(48, 130, 106, 1)', 'rgba(191, 224, 213, 1)')};
   }
 `;
-const fadeOut = styled.keyframes`
+const fadeOut = keyframes`
   from {
     background-color: ${props => props.theme.themeProp('rgba(48, 130, 106, 1)', 'rgba(191, 224, 213, 1)')};
   }
@@ -42,7 +33,7 @@ const fadeOut = styled.keyframes`
     background-color: ${props => props.theme.themeProp('rgba(48, 130, 106, 0)', 'rgba(191, 224, 213, 0)')};
   }
 `;
-const fadeInCheck = styled.keyframes`
+const fadeInCheck = keyframes`
   from {
     opacity: 0
   }
@@ -50,7 +41,7 @@ const fadeInCheck = styled.keyframes`
     opacity: 1
   }
 `;
-const fadeOutCheck = styled.keyframes`
+const fadeOutCheck = keyframes`
   from {
     opacity: 1
   }
@@ -58,8 +49,8 @@ const fadeOutCheck = styled.keyframes`
     opacity: 0
   }
 `;
-const AsyncCreatableSelectPaginate = reactSelectAsyncPaginate.withAsyncPaginate(CreatableSelect__default["default"]);
-const sharedStyle = styled.css`
+const AsyncCreatableSelectPaginate = withAsyncPaginate(CreatableSelect);
+const sharedStyle = css`
   font-family: ${props => props.theme.primaryFontFamily};
   font-size: 0.875rem;
   line-height: 1rem;
@@ -68,17 +59,17 @@ const sharedStyle = styled.css`
   box-shadow: 'none';
   flex-basis: ${props => props.$hasLabel ? '66.66%' : '100%'};
 `;
-const CompactAutocompleteSelect$1 = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)`
+const CompactAutocompleteSelect$1 = styled.div.attrs(applyDefaultTheme)`
   display: flex;
   align-items: center;
   height: 24px;
   font-family: ${props => props.theme.primaryFontFamily};
-  ${props => props.disabled && styled.css`
+  ${props => props.disabled && css`
       opacity: 0.5;
       cursor: not-allowed;
     `}
 `;
-const Label = styled__default["default"].label.attrs(defaultTheme.applyDefaultTheme)`
+const Label = styled.label.attrs(applyDefaultTheme)`
   ${props => props.theme.themeProp('color', props.theme.getColor('white'), props.theme.getColor('gray-700'))};
   flex-basis: 33.33%;
   font-size: 0.875rem;
@@ -88,16 +79,16 @@ const Label = styled__default["default"].label.attrs(defaultTheme.applyDefaultTh
   justify-content: space-between;
   align-items: center;
   padding-top: 2px;
-  ${props => props.disabled && styled.css`
+  ${props => props.disabled && css`
       cursor: not-allowed;
     `}
 `;
-const InputContainer = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)`
+const InputContainer = styled.div.attrs(applyDefaultTheme)`
   display: flex;
   width: 100%;
   height: 19px;
 `;
-const SuccessContainer = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)`
+const SuccessContainer = styled.div.attrs(applyDefaultTheme)`
   opacity: 1;
   pointer-events: none;
   display: flex;
@@ -110,50 +101,50 @@ const SuccessContainer = styled__default["default"].div.attrs(defaultTheme.apply
     width: 13px;
   }
 `;
-const AsyncCreatableAutocompleteSelect = styled__default["default"](AsyncCreatableSelectPaginate).attrs(defaultTheme.applyDefaultTheme)`
+const AsyncCreatableAutocompleteSelect = styled(AsyncCreatableSelectPaginate).attrs(applyDefaultTheme)`
   ${sharedStyle}
-  ${props => props.disabled && styled.css`
+  ${props => props.disabled && css`
       opacity: 0.5;
       cursor: not-allowed;
     `}
     &&:hover:not(:focus) {
-    ${props => props.disabled && styled.css`
+    ${props => props.disabled && css`
         background: none !important;
         cursor: not-allowed;
       `}
   }
 `;
-const AsyncAutocompleteSelect = styled__default["default"](reactSelectAsyncPaginate.AsyncPaginate).attrs(defaultTheme.applyDefaultTheme)`
+const AsyncAutocompleteSelect = styled(AsyncPaginate).attrs(applyDefaultTheme)`
   ${sharedStyle}
-  ${props => props.disabled && styled.css`
+  ${props => props.disabled && css`
       opacity: 0.5;
     `}
     &&:hover:not(:focus) {
-    ${props => props.disabled && styled.css`
+    ${props => props.disabled && css`
         background: none !important;
         cursor: not-allowed;
       `}
   }
 `;
-const AutocompletSelect = styled__default["default"](Select__default["default"]).attrs(defaultTheme.applyDefaultTheme)`
+const AutocompletSelect = styled(Select).attrs(applyDefaultTheme)`
   ${sharedStyle}
-  ${props => props.disabled && styled.css`
+  ${props => props.disabled && css`
       opacity: 0.5;
     `}
     &&:hover:not(:focus) {
-    ${props => props.disabled && styled.css`
+    ${props => props.disabled && css`
         background: none !important;
         cursor: not-allowed;
       `}
   }
 `;
-const AutocompletCreatableSelect = styled__default["default"](CreatableSelect__default["default"]).attrs(defaultTheme.applyDefaultTheme)`
+const AutocompletCreatableSelect = styled(CreatableSelect).attrs(applyDefaultTheme)`
   ${sharedStyle}
-  ${props => props.disabled && styled.css`
+  ${props => props.disabled && css`
       opacity: 0.5;
     `}
 `;
-const Control = styled__default["default"](Select.components.Control).attrs(defaultTheme.applyDefaultTheme)`
+const Control = styled(components.Control).attrs(applyDefaultTheme)`
   && {
     ${props => props.edit && props.theme.themeProp('background', 'rgba(39,39,42, 0.7)', 'rgba(244,244,245, 0.3)')};
     ${props => props.edit && props.theme.themeProp('border-color', 'rgba(39,39,42, 0.7)', 'rgba(228,228,231, 0.3)')};
@@ -166,7 +157,7 @@ const Control = styled__default["default"](Select.components.Control).attrs(defa
     cursor: pointer;
     border: 1px solid transparent;
     background-color: transparent;
-    ${props => props.type && styled.css`
+    ${props => props.type && css`
         animation: ${props => props.type === 'success' ? fadeIn : fadeOut} 0.5s ease-in-out;
       `}
 
@@ -202,7 +193,7 @@ const Control = styled__default["default"](Select.components.Control).attrs(defa
     ${props => props.type === 'error' && !props.isFocused && props.theme.themeProp('background', '#901d1d', '#f7d5d0')};
   }
 `;
-const Option = styled__default["default"](Select.components.Option).attrs(defaultTheme.applyDefaultTheme)`
+const Option = styled(components.Option).attrs(applyDefaultTheme)`
   && {
     min-height: 22px;
     height: 22px;
@@ -212,15 +203,15 @@ const Option = styled__default["default"](Select.components.Option).attrs(defaul
     cursor: pointer;
     padding: 1px 13px;
     ${props => props.theme.themeProp('color', props.theme.getColor('gray-200'), props.theme.getColor('gray-700'))}
-    ${props => props.isFocused && styled.css`
+    ${props => props.isFocused && css`
         ${props.theme.themeProp('background-color', props.theme.getColor('gray-500'), props.theme.getColor('gray-200'))}
       `}
-    ${props => props.isSelected && styled.css`
+    ${props => props.isSelected && css`
         ${props.theme.themeProp('background-color', 'transparent', 'transparent')}
 
         ${props.theme.themeProp('color', props.theme.getColor('gray-200'), props.theme.getColor('gray-700'))}
       `}
-      ${props => props.isFocused && props.isSelected && styled.css`
+      ${props => props.isFocused && props.isSelected && css`
         ${props.theme.themeProp('background-color', props.theme.getColor('gray-500'), props.theme.getColor('gray-200'))}
       `}
   }
@@ -234,20 +225,20 @@ const Option = styled__default["default"](Select.components.Option).attrs(defaul
     color: inherit;
   }
 `;
-const Placeholder = styled__default["default"](Select.components.Placeholder).attrs(defaultTheme.applyDefaultTheme)`
+const Placeholder = styled(components.Placeholder).attrs(applyDefaultTheme)`
   && {
-    ${props => (props.type === 'error' || props.type === 'warning') && styled.css`
+    ${props => (props.type === 'error' || props.type === 'warning') && css`
         ${props.theme.themeProp('color', props.theme.getColor('gray-200'), props.theme.getColor('gray-700'))}
       `}
     ${props => (props.type === 'error' || props.type === 'warning') && props.theme.themeProp('opacity', '0.6', '0.6')};
   }
 `;
-const SingleValue = styled__default["default"](Select.components.SingleValue).attrs(defaultTheme.applyDefaultTheme)`
+const SingleValue = styled(components.SingleValue).attrs(applyDefaultTheme)`
   && {
     ${props => props.theme.themeProp('color', props.theme.getColor('gray-200'), props.theme.getColor('gray-700'))};
   }
 `;
-const Input = styled__default["default"](Select.components.Input).attrs(defaultTheme.applyDefaultTheme)`
+const Input = styled(components.Input).attrs(applyDefaultTheme)`
   && {
     margin: 0;
     padding: 0;
@@ -255,17 +246,17 @@ const Input = styled__default["default"](Select.components.Input).attrs(defaultT
     ${props => props.theme.themeProp('color', props.theme.getColor('gray-200'), props.theme.getColor('gray-700'))}
   }
 `;
-const Menu = styled__default["default"](Select.components.Menu).attrs(defaultTheme.applyDefaultTheme)`
+const Menu = styled(components.Menu).attrs(applyDefaultTheme)`
   && {
     ${props => props.theme.themeProp('background', props.theme.getColor('gray-700'), props.theme.getColor('white'))};
   }
 `;
-const ValueContainer = styled__default["default"](Select.components.ValueContainer).attrs(defaultTheme.applyDefaultTheme)`
+const ValueContainer = styled(components.ValueContainer).attrs(applyDefaultTheme)`
   && {
     padding: 0;
   }
 `;
-const ClearIndicator = styled__default["default"](Select.components.ClearIndicator).attrs(defaultTheme.applyDefaultTheme)`
+const ClearIndicator = styled(components.ClearIndicator).attrs(applyDefaultTheme)`
   && {
     display: ${props => props.isFocused ? 'flex' : 'none'};
     padding: 0;
@@ -273,7 +264,7 @@ const ClearIndicator = styled__default["default"](Select.components.ClearIndicat
     ${props => props.theme.themeProp('color', props.theme.getColor('gray-400'), props.theme.getColor('gray-500'))};
   }
 `;
-const DropdownIndicator = styled__default["default"](Select.components.DropdownIndicator).attrs(defaultTheme.applyDefaultTheme)`
+const DropdownIndicator = styled(components.DropdownIndicator).attrs(applyDefaultTheme)`
   && {
     display: ${props => props.isFocused ? 'flex' : 'none'};
     padding: 0;
@@ -284,16 +275,16 @@ const DropdownIndicator = styled__default["default"](Select.components.DropdownI
     ${props => props.theme.themeProp('color', props.theme.getColor('gray-400'), props.theme.getColor('gray-500'))};
   }
 `;
-const DropdownIndicatorIcon = styled__default["default"](expandMore.SvgExpandMore).attrs(defaultTheme.applyDefaultTheme)`
+const DropdownIndicatorIcon = styled(SvgExpandMore).attrs(applyDefaultTheme)`
   width: 12px;
 `;
-const ClearIndicatorIcon = styled__default["default"](close.SvgClose).attrs(defaultTheme.applyDefaultTheme)`
+const ClearIndicatorIcon = styled(SvgClose).attrs(applyDefaultTheme)`
   width: 8px;
   margin-right: 4px;
   ${props => props.theme.themeProp('stroke', props.theme.getColor('gray-400'), props.theme.getColor('gray-500'))};
   stroke-width: 2px;
 `;
-const IndicatorSeparator = styled__default["default"](Select.components.IndicatorSeparator).attrs(defaultTheme.applyDefaultTheme)`
+const IndicatorSeparator = styled(components.IndicatorSeparator).attrs(applyDefaultTheme)`
   && {
     display: ${props => props.isFocused ? 'flex' : 'none'};
     margin: 4px;
@@ -301,7 +292,7 @@ const IndicatorSeparator = styled__default["default"](Select.components.Indicato
   }
 `;
 
-const CompactAutocompleteSelect = React__default["default"].forwardRef(function CompactAutocompleteSelect({
+const CompactAutocompleteSelect = React__default.forwardRef(function CompactAutocompleteSelect({
   label,
   availableOptions,
   placeholder,
@@ -322,41 +313,41 @@ const CompactAutocompleteSelect = React__default["default"].forwardRef(function
   successIcon,
   ...props
 }, forwardedRef) {
-  const [uniqueId] = React.useState(nanoid.nanoid());
-  const [selected, setSelected] = React.useState(selectedOption);
-  const [focused, setFocused] = React.useState(false);
-  const [cacheUnique, setCacheUnique] = React.useState(0);
-  const memoizedDescriptionToolTip = React.useMemo(() => {
+  const [uniqueId] = useState(nanoid());
+  const [selected, setSelected] = useState(selectedOption);
+  const [focused, setFocused] = useState(false);
+  const [cacheUnique, setCacheUnique] = useState(0);
+  const memoizedDescriptionToolTip = useMemo(() => {
     return descriptionToolTip;
   }, [descriptionToolTip]);
   const Control$1 = props => {
-    return React__default["default"].createElement(Control, _rollupPluginBabelHelpers._extends({
+    return React__default.createElement(Control, _extends({
       className: "select-control",
       edit: edit,
       type: type
     }, props));
   };
-  const ValueContainer$1 = React.useMemo(() => {
+  const ValueContainer$1 = useMemo(() => {
     const valueContainer = props => {
-      return React__default["default"].createElement(React__default["default"].Fragment, null, React__default["default"].createElement(ValueContainer, _rollupPluginBabelHelpers._extends({
+      return React__default.createElement(React__default.Fragment, null, React__default.createElement(ValueContainer, _extends({
         type: type
       }, props)));
     };
     valueContainer.displayName = 'ValueContainerWrapper';
     return valueContainer;
   }, [type]);
-  const Input$1 = React.useMemo(() => {
+  const Input$1 = useMemo(() => {
     const selectInput = props => {
-      return React__default["default"].createElement(Input, _rollupPluginBabelHelpers._extends({
+      return React__default.createElement(Input, _extends({
         className: "select-input"
       }, props));
     };
     selectInput.displayName = 'InputWrapper';
     return selectInput;
   }, []);
-  const Menu$1 = React.useMemo(() => {
+  const Menu$1 = useMemo(() => {
     const menu = props => {
-      return React__default["default"].createElement(Menu, _rollupPluginBabelHelpers._extends({
+      return React__default.createElement(Menu, _extends({
         className: "select-menu"
       }, props));
     };
@@ -364,42 +355,42 @@ const CompactAutocompleteSelect = React__default["default"].forwardRef(function
     return menu;
   }, []);
   const Placeholder$1 = props => {
-    return React__default["default"].createElement(Placeholder, _rollupPluginBabelHelpers._extends({
+    return React__default.createElement(Placeholder, _extends({
       className: "select-placeholder",
       type: type
     }, props));
   };
   const Option$1 = props => {
-    return !props.data.link ? React__default["default"].createElement(Option, _rollupPluginBabelHelpers._extends({
+    return !props.data.link ? React__default.createElement(Option, _extends({
       className: "menu-item"
-    }, props)) : React__default["default"].createElement(Option, props, React__default["default"].createElement("a", {
+    }, props)) : React__default.createElement(Option, props, React__default.createElement("a", {
       href: props.data.link
     }, props.data.icon, props.label));
   };
   const SingleValue$1 = props => {
-    return React__default["default"].createElement(SingleValue, _rollupPluginBabelHelpers._extends({
+    return React__default.createElement(SingleValue, _extends({
       className: "menu-value"
     }, props));
   };
   Option$1.propTypes = process.env.NODE_ENV !== "production" ? {
-    data: defaultTheme.PropTypes.shape({
-      icon: defaultTheme.PropTypes.node,
-      link: defaultTheme.PropTypes.string
+    data: PropTypes.shape({
+      icon: PropTypes.node,
+      link: PropTypes.string
     }),
-    label: defaultTheme.PropTypes.string
+    label: PropTypes.string
   } : {};
   const DropdownIndicator$1 = props => {
-    return React__default["default"].createElement(DropdownIndicator, _rollupPluginBabelHelpers._extends({
+    return React__default.createElement(DropdownIndicator, _extends({
       className: "dropdown-indicator"
-    }, props), React__default["default"].createElement(DropdownIndicatorIcon, null));
+    }, props), React__default.createElement(DropdownIndicatorIcon, null));
   };
   const ClearIndicator$1 = props => {
-    return React__default["default"].createElement(ClearIndicator, _rollupPluginBabelHelpers._extends({
+    return React__default.createElement(ClearIndicator, _extends({
       className: "clear-indicator"
-    }, props), React__default["default"].createElement(ClearIndicatorIcon, null));
+    }, props), React__default.createElement(ClearIndicatorIcon, null));
   };
   const IndicatorSeparator$1 = props => {
-    return React__default["default"].createElement(IndicatorSeparator, _rollupPluginBabelHelpers._extends({
+    return React__default.createElement(IndicatorSeparator, _extends({
       className: "indicator-separator"
     }, props));
   };
@@ -488,22 +479,22 @@ const CompactAutocompleteSelect = React__default["default"].forwardRef(function
   };
   if (hidden) return null;
   const input = () => {
-    return React__default["default"].createElement(CompactAutocompleteSelect$1, {
+    return React__default.createElement(CompactAutocompleteSelect$1, {
       disabled: disabled
-    }, React__default["default"].createElement(InputContainer, null, label && React__default["default"].createElement(Label, {
+    }, React__default.createElement(InputContainer, null, label && React__default.createElement(Label, {
       htmlFor: uniqueId,
       disabled: disabled
-    }, label, React__default["default"].createElement(SuccessContainer, null, type === 'loading' && loadingIcon, type === 'success' && successIcon)), loadOptions ? creatable ? React__default["default"].createElement(AsyncCreatableAutocompleteSelect, _rollupPluginBabelHelpers._extends({
-      $hasLabel: !lodash.isEmpty(label)
-    }, sharedSelectProps, props)) : React__default["default"].createElement(AsyncAutocompleteSelect, _rollupPluginBabelHelpers._extends({
-      $hasLabel: !lodash.isEmpty(label)
-    }, sharedSelectProps, props)) : creatable ? React__default["default"].createElement(AutocompletCreatableSelect, _rollupPluginBabelHelpers._extends({
-      $hasLabel: !lodash.isEmpty(label)
-    }, sharedSelectProps, props)) : React__default["default"].createElement(AutocompletSelect, _rollupPluginBabelHelpers._extends({
-      $hasLabel: !lodash.isEmpty(label)
+    }, label, React__default.createElement(SuccessContainer, null, type === 'loading' && loadingIcon, type === 'success' && successIcon)), loadOptions ? creatable ? React__default.createElement(AsyncCreatableAutocompleteSelect, _extends({
+      $hasLabel: !isEmpty(label)
+    }, sharedSelectProps, props)) : React__default.createElement(AsyncAutocompleteSelect, _extends({
+      $hasLabel: !isEmpty(label)
+    }, sharedSelectProps, props)) : creatable ? React__default.createElement(AutocompletCreatableSelect, _extends({
+      $hasLabel: !isEmpty(label)
+    }, sharedSelectProps, props)) : React__default.createElement(AutocompletSelect, _extends({
+      $hasLabel: !isEmpty(label)
     }, sharedSelectProps, props))));
   };
-  return React__default["default"].createElement(React__default["default"].Fragment, null, !memoizedDescriptionToolTip && input(), memoizedDescriptionToolTip && React__default["default"].createElement("div", null, React__default["default"].createElement(Tooltip.Tooltip, {
+  return React__default.createElement(React__default.Fragment, null, !memoizedDescriptionToolTip && input(), memoizedDescriptionToolTip && React__default.createElement("div", null, React__default.createElement(Tooltip, {
     content: memoizedDescriptionToolTip,
     key: "tooltipTextArea1",
     placement: "bottom-end",
@@ -512,26 +503,26 @@ const CompactAutocompleteSelect = React__default["default"].forwardRef(function
   }, input())));
 });
 CompactAutocompleteSelect.propTypes = process.env.NODE_ENV !== "production" ? {
-  label: defaultTheme.PropTypes.string,
-  placeholder: defaultTheme.PropTypes.string,
-  availableOptions: defaultTheme.PropTypes.arrayOf(defaultTheme.PropTypes.object),
-  selectedOption: defaultTheme.PropTypes.object,
-  loadOptions: defaultTheme.PropTypes.func,
-  loadingMessageFunc: defaultTheme.PropTypes.func,
-  createNewOptionMessageFunc: defaultTheme.PropTypes.func,
-  noOptionsMessageFunc: defaultTheme.PropTypes.func,
-  readOnly: defaultTheme.PropTypes.bool,
-  edit: defaultTheme.PropTypes.bool,
-  hidden: defaultTheme.PropTypes.bool,
-  error: defaultTheme.PropTypes.oneOfType([defaultTheme.PropTypes.bool, defaultTheme.PropTypes.string]),
-  warning: defaultTheme.PropTypes.oneOfType([defaultTheme.PropTypes.bool, defaultTheme.PropTypes.string]),
-  onUpdateCallback: defaultTheme.PropTypes.func,
-  creatable: defaultTheme.PropTypes.bool,
-  disabled: defaultTheme.PropTypes.bool,
-  type: defaultTheme.PropTypes.oneOf(['', 'error', 'warning', 'instructions-warning', 'loading', 'success']),
-  descriptionToolTip: defaultTheme.PropTypes.string,
-  loadingIcon: defaultTheme.PropTypes.element,
-  successIcon: defaultTheme.PropTypes.element
+  label: PropTypes.string,
+  placeholder: PropTypes.string,
+  availableOptions: PropTypes.arrayOf(PropTypes.object),
+  selectedOption: PropTypes.object,
+  loadOptions: PropTypes.func,
+  loadingMessageFunc: PropTypes.func,
+  createNewOptionMessageFunc: PropTypes.func,
+  noOptionsMessageFunc: PropTypes.func,
+  readOnly: PropTypes.bool,
+  edit: PropTypes.bool,
+  hidden: PropTypes.bool,
+  error: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),
+  warning: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),
+  onUpdateCallback: PropTypes.func,
+  creatable: PropTypes.bool,
+  disabled: PropTypes.bool,
+  type: PropTypes.oneOf(['', 'error', 'warning', 'instructions-warning', 'loading', 'success']),
+  descriptionToolTip: PropTypes.string,
+  loadingIcon: PropTypes.element,
+  successIcon: PropTypes.element
 } : {};
 CompactAutocompleteSelect.defaultProps = {
   noOptionsMessageFunc: inputValue => {
@@ -552,4 +543,4 @@ CompactAutocompleteSelect.defaultProps = {
   descriptionToolTip: ''
 };
 
-exports.CompactAutocompleteSelect = CompactAutocompleteSelect;
+export { CompactAutocompleteSelect as C };