GoScrobble/web/node_modules/react-select/dist/index-fe3694ff.cjs.dev.js

1567 lines
64 KiB
JavaScript

'use strict';
var _extends = require('@babel/runtime/helpers/extends');
var react = require('@emotion/react');
var _taggedTemplateLiteral = require('@babel/runtime/helpers/taggedTemplateLiteral');
var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
var _typeof = require('@babel/runtime/helpers/typeof');
var AutosizeInput = require('react-input-autosize');
var _classCallCheck = require('@babel/runtime/helpers/classCallCheck');
var _createClass = require('@babel/runtime/helpers/createClass');
var _inherits = require('@babel/runtime/helpers/inherits');
var _defineProperty$1 = require('@babel/runtime/helpers/defineProperty');
var React = require('react');
var reactDom = require('react-dom');
function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
var _extends__default = /*#__PURE__*/_interopDefault(_extends);
var _taggedTemplateLiteral__default = /*#__PURE__*/_interopDefault(_taggedTemplateLiteral);
var _objectWithoutProperties__default = /*#__PURE__*/_interopDefault(_objectWithoutProperties);
var _typeof__default = /*#__PURE__*/_interopDefault(_typeof);
var AutosizeInput__default = /*#__PURE__*/_interopDefault(AutosizeInput);
var _classCallCheck__default = /*#__PURE__*/_interopDefault(_classCallCheck);
var _createClass__default = /*#__PURE__*/_interopDefault(_createClass);
var _inherits__default = /*#__PURE__*/_interopDefault(_inherits);
var _defineProperty__default = /*#__PURE__*/_interopDefault(_defineProperty$1);
function _defineProperty(obj, key, value) {
if (key in obj) {
Object.defineProperty(obj, key, {
value: value,
enumerable: true,
configurable: true,
writable: true
});
} else {
obj[key] = value;
}
return obj;
}
function ownKeys(object, enumerableOnly) {
var keys = Object.keys(object);
if (Object.getOwnPropertySymbols) {
var symbols = Object.getOwnPropertySymbols(object);
if (enumerableOnly) symbols = symbols.filter(function (sym) {
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
});
keys.push.apply(keys, symbols);
}
return keys;
}
function _objectSpread2(target) {
for (var i = 1; i < arguments.length; i++) {
var source = arguments[i] != null ? arguments[i] : {};
if (i % 2) {
ownKeys(Object(source), true).forEach(function (key) {
_defineProperty(target, key, source[key]);
});
} else if (Object.getOwnPropertyDescriptors) {
Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
} else {
ownKeys(Object(source)).forEach(function (key) {
Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
});
}
}
return target;
}
function _getPrototypeOf(o) {
_getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) {
return o.__proto__ || Object.getPrototypeOf(o);
};
return _getPrototypeOf(o);
}
function _isNativeReflectConstruct() {
if (typeof Reflect === "undefined" || !Reflect.construct) return false;
if (Reflect.construct.sham) return false;
if (typeof Proxy === "function") return true;
try {
Date.prototype.toString.call(Reflect.construct(Date, [], function () {}));
return true;
} catch (e) {
return false;
}
}
function _assertThisInitialized(self) {
if (self === void 0) {
throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
}
return self;
}
function _possibleConstructorReturn(self, call) {
if (call && (typeof call === "object" || typeof call === "function")) {
return call;
}
return _assertThisInitialized(self);
}
function _createSuper(Derived) {
var hasNativeReflectConstruct = _isNativeReflectConstruct();
return function _createSuperInternal() {
var Super = _getPrototypeOf(Derived),
result;
if (hasNativeReflectConstruct) {
var NewTarget = _getPrototypeOf(this).constructor;
result = Reflect.construct(Super, arguments, NewTarget);
} else {
result = Super.apply(this, arguments);
}
return _possibleConstructorReturn(this, result);
};
}
// ==============================
// NO OP
// ==============================
var noop = function noop() {};
// Class Name Prefixer
// ==============================
/**
String representation of component state for styling with class names.
Expects an array of strings OR a string/object pair:
- className(['comp', 'comp-arg', 'comp-arg-2'])
@returns 'react-select__comp react-select__comp-arg react-select__comp-arg-2'
- className('comp', { some: true, state: false })
@returns 'react-select__comp react-select__comp--some'
*/
function applyPrefixToName(prefix, name) {
if (!name) {
return prefix;
} else if (name[0] === '-') {
return prefix + name;
} else {
return prefix + '__' + name;
}
}
function classNames(prefix, state, className) {
var arr = [className];
if (state && prefix) {
for (var key in state) {
if (state.hasOwnProperty(key) && state[key]) {
arr.push("".concat(applyPrefixToName(prefix, key)));
}
}
}
return arr.filter(function (i) {
return i;
}).map(function (i) {
return String(i).trim();
}).join(' ');
} // ==============================
// Clean Value
// ==============================
var cleanValue = function cleanValue(value) {
if (Array.isArray(value)) return value.filter(Boolean);
if (_typeof__default['default'](value) === 'object' && value !== null) return [value];
return [];
}; // ==============================
// Clean Common Props
// ==============================
var cleanCommonProps = function cleanCommonProps(props) {
//className
props.className;
props.clearValue;
props.cx;
props.getStyles;
props.getValue;
props.hasValue;
props.isMulti;
props.isRtl;
props.options;
props.selectOption;
props.selectProps;
props.setValue;
props.theme;
var innerProps = _objectWithoutProperties__default['default'](props, ["className", "clearValue", "cx", "getStyles", "getValue", "hasValue", "isMulti", "isRtl", "options", "selectOption", "selectProps", "setValue", "theme"]);
return _objectSpread2({}, innerProps);
}; // ==============================
// Handle Input Change
// ==============================
function handleInputChange(inputValue, actionMeta, onInputChange) {
if (onInputChange) {
var newValue = onInputChange(inputValue, actionMeta);
if (typeof newValue === 'string') return newValue;
}
return inputValue;
} // ==============================
// Scroll Helpers
// ==============================
function isDocumentElement(el) {
return [document.documentElement, document.body, window].indexOf(el) > -1;
} // Normalized Scroll Top
// ------------------------------
function getScrollTop(el) {
if (isDocumentElement(el)) {
return window.pageYOffset;
}
return el.scrollTop;
}
function scrollTo(el, top) {
// with a scroll distance, we perform scroll on the element
if (isDocumentElement(el)) {
window.scrollTo(0, top);
return;
}
el.scrollTop = top;
} // Get Scroll Parent
// ------------------------------
function getScrollParent(element) {
var style = getComputedStyle(element);
var excludeStaticParent = style.position === 'absolute';
var overflowRx = /(auto|scroll)/;
var docEl = document.documentElement; // suck it, flow...
if (style.position === 'fixed') return docEl;
for (var parent = element; parent = parent.parentElement;) {
style = getComputedStyle(parent);
if (excludeStaticParent && style.position === 'static') {
continue;
}
if (overflowRx.test(style.overflow + style.overflowY + style.overflowX)) {
return parent;
}
}
return docEl;
} // Animated Scroll To
// ------------------------------
/**
@param t: time (elapsed)
@param b: initial value
@param c: amount of change
@param d: duration
*/
function easeOutCubic(t, b, c, d) {
return c * ((t = t / d - 1) * t * t + 1) + b;
}
function animatedScrollTo(element, to) {
var duration = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 200;
var callback = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : noop;
var start = getScrollTop(element);
var change = to - start;
var increment = 10;
var currentTime = 0;
function animateScroll() {
currentTime += increment;
var val = easeOutCubic(currentTime, start, change, duration);
scrollTo(element, val);
if (currentTime < duration) {
window.requestAnimationFrame(animateScroll);
} else {
callback(element);
}
}
animateScroll();
} // Scroll Into View
// ------------------------------
function scrollIntoView(menuEl, focusedEl) {
var menuRect = menuEl.getBoundingClientRect();
var focusedRect = focusedEl.getBoundingClientRect();
var overScroll = focusedEl.offsetHeight / 3;
if (focusedRect.bottom + overScroll > menuRect.bottom) {
scrollTo(menuEl, Math.min(focusedEl.offsetTop + focusedEl.clientHeight - menuEl.offsetHeight + overScroll, menuEl.scrollHeight));
} else if (focusedRect.top - overScroll < menuRect.top) {
scrollTo(menuEl, Math.max(focusedEl.offsetTop - overScroll, 0));
}
} // ==============================
// Get bounding client object
// ==============================
// cannot get keys using array notation with DOMRect
function getBoundingClientObj(element) {
var rect = element.getBoundingClientRect();
return {
bottom: rect.bottom,
height: rect.height,
left: rect.left,
right: rect.right,
top: rect.top,
width: rect.width
};
}
// Touch Capability Detector
// ==============================
function isTouchCapable() {
try {
document.createEvent('TouchEvent');
return true;
} catch (e) {
return false;
}
} // ==============================
// Mobile Device Detector
// ==============================
function isMobileDevice() {
try {
return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
} catch (e) {
return false;
}
} // ==============================
// Passive Event Detector
// ==============================
// https://github.com/rafgraph/detect-it/blob/main/src/index.ts#L19-L36
var passiveOptionAccessed = false;
var options = {
get passive() {
return passiveOptionAccessed = true;
}
}; // check for SSR
var w = typeof window !== 'undefined' ? window : {};
if (w.addEventListener && w.removeEventListener) {
w.addEventListener('p', noop, options);
w.removeEventListener('p', noop, false);
}
var supportsPassiveEvents = passiveOptionAccessed;
function getMenuPlacement(_ref) {
var maxHeight = _ref.maxHeight,
menuEl = _ref.menuEl,
minHeight = _ref.minHeight,
placement = _ref.placement,
shouldScroll = _ref.shouldScroll,
isFixedPosition = _ref.isFixedPosition,
theme = _ref.theme;
var spacing = theme.spacing;
var scrollParent = getScrollParent(menuEl);
var defaultState = {
placement: 'bottom',
maxHeight: maxHeight
}; // something went wrong, return default state
if (!menuEl || !menuEl.offsetParent) return defaultState; // we can't trust `scrollParent.scrollHeight` --> it may increase when
// the menu is rendered
var _scrollParent$getBoun = scrollParent.getBoundingClientRect(),
scrollHeight = _scrollParent$getBoun.height;
var _menuEl$getBoundingCl = menuEl.getBoundingClientRect(),
menuBottom = _menuEl$getBoundingCl.bottom,
menuHeight = _menuEl$getBoundingCl.height,
menuTop = _menuEl$getBoundingCl.top;
var _menuEl$offsetParent$ = menuEl.offsetParent.getBoundingClientRect(),
containerTop = _menuEl$offsetParent$.top;
var viewHeight = window.innerHeight;
var scrollTop = getScrollTop(scrollParent);
var marginBottom = parseInt(getComputedStyle(menuEl).marginBottom, 10);
var marginTop = parseInt(getComputedStyle(menuEl).marginTop, 10);
var viewSpaceAbove = containerTop - marginTop;
var viewSpaceBelow = viewHeight - menuTop;
var scrollSpaceAbove = viewSpaceAbove + scrollTop;
var scrollSpaceBelow = scrollHeight - scrollTop - menuTop;
var scrollDown = menuBottom - viewHeight + scrollTop + marginBottom;
var scrollUp = scrollTop + menuTop - marginTop;
var scrollDuration = 160;
switch (placement) {
case 'auto':
case 'bottom':
// 1: the menu will fit, do nothing
if (viewSpaceBelow >= menuHeight) {
return {
placement: 'bottom',
maxHeight: maxHeight
};
} // 2: the menu will fit, if scrolled
if (scrollSpaceBelow >= menuHeight && !isFixedPosition) {
if (shouldScroll) {
animatedScrollTo(scrollParent, scrollDown, scrollDuration);
}
return {
placement: 'bottom',
maxHeight: maxHeight
};
} // 3: the menu will fit, if constrained
if (!isFixedPosition && scrollSpaceBelow >= minHeight || isFixedPosition && viewSpaceBelow >= minHeight) {
if (shouldScroll) {
animatedScrollTo(scrollParent, scrollDown, scrollDuration);
} // we want to provide as much of the menu as possible to the user,
// so give them whatever is available below rather than the minHeight.
var constrainedHeight = isFixedPosition ? viewSpaceBelow - marginBottom : scrollSpaceBelow - marginBottom;
return {
placement: 'bottom',
maxHeight: constrainedHeight
};
} // 4. Forked beviour when there isn't enough space below
// AUTO: flip the menu, render above
if (placement === 'auto' || isFixedPosition) {
// may need to be constrained after flipping
var _constrainedHeight = maxHeight;
var spaceAbove = isFixedPosition ? viewSpaceAbove : scrollSpaceAbove;
if (spaceAbove >= minHeight) {
_constrainedHeight = Math.min(spaceAbove - marginBottom - spacing.controlHeight, maxHeight);
}
return {
placement: 'top',
maxHeight: _constrainedHeight
};
} // BOTTOM: allow browser to increase scrollable area and immediately set scroll
if (placement === 'bottom') {
if (shouldScroll) {
scrollTo(scrollParent, scrollDown);
}
return {
placement: 'bottom',
maxHeight: maxHeight
};
}
break;
case 'top':
// 1: the menu will fit, do nothing
if (viewSpaceAbove >= menuHeight) {
return {
placement: 'top',
maxHeight: maxHeight
};
} // 2: the menu will fit, if scrolled
if (scrollSpaceAbove >= menuHeight && !isFixedPosition) {
if (shouldScroll) {
animatedScrollTo(scrollParent, scrollUp, scrollDuration);
}
return {
placement: 'top',
maxHeight: maxHeight
};
} // 3: the menu will fit, if constrained
if (!isFixedPosition && scrollSpaceAbove >= minHeight || isFixedPosition && viewSpaceAbove >= minHeight) {
var _constrainedHeight2 = maxHeight; // we want to provide as much of the menu as possible to the user,
// so give them whatever is available below rather than the minHeight.
if (!isFixedPosition && scrollSpaceAbove >= minHeight || isFixedPosition && viewSpaceAbove >= minHeight) {
_constrainedHeight2 = isFixedPosition ? viewSpaceAbove - marginTop : scrollSpaceAbove - marginTop;
}
if (shouldScroll) {
animatedScrollTo(scrollParent, scrollUp, scrollDuration);
}
return {
placement: 'top',
maxHeight: _constrainedHeight2
};
} // 4. not enough space, the browser WILL NOT increase scrollable area when
// absolutely positioned element rendered above the viewport (only below).
// Flip the menu, render below
return {
placement: 'bottom',
maxHeight: maxHeight
};
default:
throw new Error("Invalid placement provided \"".concat(placement, "\"."));
} // fulfil contract with flow: implicit return value of undefined
return defaultState;
} // Menu Component
// ------------------------------
function alignToControl(placement) {
var placementToCSSProp = {
bottom: 'top',
top: 'bottom'
};
return placement ? placementToCSSProp[placement] : 'bottom';
}
var coercePlacement = function coercePlacement(p) {
return p === 'auto' ? 'bottom' : p;
};
var menuCSS = function menuCSS(_ref2) {
var _ref3;
var placement = _ref2.placement,
_ref2$theme = _ref2.theme,
borderRadius = _ref2$theme.borderRadius,
spacing = _ref2$theme.spacing,
colors = _ref2$theme.colors;
return _ref3 = {
label: 'menu'
}, _defineProperty__default['default'](_ref3, alignToControl(placement), '100%'), _defineProperty__default['default'](_ref3, "backgroundColor", colors.neutral0), _defineProperty__default['default'](_ref3, "borderRadius", borderRadius), _defineProperty__default['default'](_ref3, "boxShadow", '0 0 0 1px hsla(0, 0%, 0%, 0.1), 0 4px 11px hsla(0, 0%, 0%, 0.1)'), _defineProperty__default['default'](_ref3, "marginBottom", spacing.menuGutter), _defineProperty__default['default'](_ref3, "marginTop", spacing.menuGutter), _defineProperty__default['default'](_ref3, "position", 'absolute'), _defineProperty__default['default'](_ref3, "width", '100%'), _defineProperty__default['default'](_ref3, "zIndex", 1), _ref3;
};
var PortalPlacementContext = /*#__PURE__*/React.createContext({
getPortalPlacement: null
}); // NOTE: internal only
var MenuPlacer = /*#__PURE__*/function (_Component) {
_inherits__default['default'](MenuPlacer, _Component);
var _super = _createSuper(MenuPlacer);
function MenuPlacer() {
var _this;
_classCallCheck__default['default'](this, MenuPlacer);
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));
_this.state = {
maxHeight: _this.props.maxMenuHeight,
placement: null
};
_this.getPlacement = function (ref) {
var _this$props = _this.props,
minMenuHeight = _this$props.minMenuHeight,
maxMenuHeight = _this$props.maxMenuHeight,
menuPlacement = _this$props.menuPlacement,
menuPosition = _this$props.menuPosition,
menuShouldScrollIntoView = _this$props.menuShouldScrollIntoView,
theme = _this$props.theme;
if (!ref) return; // DO NOT scroll if position is fixed
var isFixedPosition = menuPosition === 'fixed';
var shouldScroll = menuShouldScrollIntoView && !isFixedPosition;
var state = getMenuPlacement({
maxHeight: maxMenuHeight,
menuEl: ref,
minHeight: minMenuHeight,
placement: menuPlacement,
shouldScroll: shouldScroll,
isFixedPosition: isFixedPosition,
theme: theme
});
var getPortalPlacement = _this.context.getPortalPlacement;
if (getPortalPlacement) getPortalPlacement(state);
_this.setState(state);
};
_this.getUpdatedProps = function () {
var menuPlacement = _this.props.menuPlacement;
var placement = _this.state.placement || coercePlacement(menuPlacement);
return _objectSpread2(_objectSpread2({}, _this.props), {}, {
placement: placement,
maxHeight: _this.state.maxHeight
});
};
return _this;
}
_createClass__default['default'](MenuPlacer, [{
key: "render",
value: function render() {
var children = this.props.children;
return children({
ref: this.getPlacement,
placerProps: this.getUpdatedProps()
});
}
}]);
return MenuPlacer;
}(React.Component);
MenuPlacer.contextType = PortalPlacementContext;
var Menu = function Menu(props) {
var children = props.children,
className = props.className,
cx = props.cx,
getStyles = props.getStyles,
innerRef = props.innerRef,
innerProps = props.innerProps;
return react.jsx("div", _extends__default['default']({
css: getStyles('menu', props),
className: cx({
menu: true
}, className),
ref: innerRef
}, innerProps), children);
};
// Menu List
// ==============================
var menuListCSS = function menuListCSS(_ref4) {
var maxHeight = _ref4.maxHeight,
baseUnit = _ref4.theme.spacing.baseUnit;
return {
maxHeight: maxHeight,
overflowY: 'auto',
paddingBottom: baseUnit,
paddingTop: baseUnit,
position: 'relative',
// required for offset[Height, Top] > keyboard scroll
WebkitOverflowScrolling: 'touch'
};
};
var MenuList = function MenuList(props) {
var children = props.children,
className = props.className,
cx = props.cx,
getStyles = props.getStyles,
innerProps = props.innerProps,
innerRef = props.innerRef,
isMulti = props.isMulti;
return react.jsx("div", _extends__default['default']({
css: getStyles('menuList', props),
className: cx({
'menu-list': true,
'menu-list--is-multi': isMulti
}, className),
ref: innerRef
}, innerProps), children);
}; // ==============================
// Menu Notices
// ==============================
var noticeCSS = function noticeCSS(_ref5) {
var _ref5$theme = _ref5.theme,
baseUnit = _ref5$theme.spacing.baseUnit,
colors = _ref5$theme.colors;
return {
color: colors.neutral40,
padding: "".concat(baseUnit * 2, "px ").concat(baseUnit * 3, "px"),
textAlign: 'center'
};
};
var noOptionsMessageCSS = noticeCSS;
var loadingMessageCSS = noticeCSS;
var NoOptionsMessage = function NoOptionsMessage(props) {
var children = props.children,
className = props.className,
cx = props.cx,
getStyles = props.getStyles,
innerProps = props.innerProps;
return react.jsx("div", _extends__default['default']({
css: getStyles('noOptionsMessage', props),
className: cx({
'menu-notice': true,
'menu-notice--no-options': true
}, className)
}, innerProps), children);
};
NoOptionsMessage.defaultProps = {
children: 'No options'
};
var LoadingMessage = function LoadingMessage(props) {
var children = props.children,
className = props.className,
cx = props.cx,
getStyles = props.getStyles,
innerProps = props.innerProps;
return react.jsx("div", _extends__default['default']({
css: getStyles('loadingMessage', props),
className: cx({
'menu-notice': true,
'menu-notice--loading': true
}, className)
}, innerProps), children);
};
LoadingMessage.defaultProps = {
children: 'Loading...'
}; // ==============================
// Menu Portal
// ==============================
var menuPortalCSS = function menuPortalCSS(_ref6) {
var rect = _ref6.rect,
offset = _ref6.offset,
position = _ref6.position;
return {
left: rect.left,
position: position,
top: offset,
width: rect.width,
zIndex: 1
};
};
var MenuPortal = /*#__PURE__*/function (_Component2) {
_inherits__default['default'](MenuPortal, _Component2);
var _super2 = _createSuper(MenuPortal);
function MenuPortal() {
var _this2;
_classCallCheck__default['default'](this, MenuPortal);
for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
args[_key2] = arguments[_key2];
}
_this2 = _super2.call.apply(_super2, [this].concat(args));
_this2.state = {
placement: null
};
_this2.getPortalPlacement = function (_ref7) {
var placement = _ref7.placement;
var initialPlacement = coercePlacement(_this2.props.menuPlacement); // avoid re-renders if the placement has not changed
if (placement !== initialPlacement) {
_this2.setState({
placement: placement
});
}
};
return _this2;
}
_createClass__default['default'](MenuPortal, [{
key: "render",
value: function render() {
var _this$props2 = this.props,
appendTo = _this$props2.appendTo,
children = _this$props2.children,
className = _this$props2.className,
controlElement = _this$props2.controlElement,
cx = _this$props2.cx,
innerProps = _this$props2.innerProps,
menuPlacement = _this$props2.menuPlacement,
position = _this$props2.menuPosition,
getStyles = _this$props2.getStyles;
var isFixed = position === 'fixed'; // bail early if required elements aren't present
if (!appendTo && !isFixed || !controlElement) {
return null;
}
var placement = this.state.placement || coercePlacement(menuPlacement);
var rect = getBoundingClientObj(controlElement);
var scrollDistance = isFixed ? 0 : window.pageYOffset;
var offset = rect[placement] + scrollDistance;
var state = {
offset: offset,
position: position,
rect: rect
}; // same wrapper element whether fixed or portalled
var menuWrapper = react.jsx("div", _extends__default['default']({
css: getStyles('menuPortal', state),
className: cx({
'menu-portal': true
}, className)
}, innerProps), children);
return react.jsx(PortalPlacementContext.Provider, {
value: {
getPortalPlacement: this.getPortalPlacement
}
}, appendTo ? /*#__PURE__*/reactDom.createPortal(menuWrapper, appendTo) : menuWrapper);
}
}]);
return MenuPortal;
}(React.Component);
var containerCSS = function containerCSS(_ref) {
var isDisabled = _ref.isDisabled,
isRtl = _ref.isRtl;
return {
label: 'container',
direction: isRtl ? 'rtl' : null,
pointerEvents: isDisabled ? 'none' : null,
// cancel mouse events when disabled
position: 'relative'
};
};
var SelectContainer = function SelectContainer(props) {
var children = props.children,
className = props.className,
cx = props.cx,
getStyles = props.getStyles,
innerProps = props.innerProps,
isDisabled = props.isDisabled,
isRtl = props.isRtl;
return react.jsx("div", _extends__default['default']({
css: getStyles('container', props),
className: cx({
'--is-disabled': isDisabled,
'--is-rtl': isRtl
}, className)
}, innerProps), children);
}; // ==============================
// Value Container
// ==============================
var valueContainerCSS = function valueContainerCSS(_ref2) {
var spacing = _ref2.theme.spacing;
return {
alignItems: 'center',
display: 'flex',
flex: 1,
flexWrap: 'wrap',
padding: "".concat(spacing.baseUnit / 2, "px ").concat(spacing.baseUnit * 2, "px"),
WebkitOverflowScrolling: 'touch',
position: 'relative',
overflow: 'hidden'
};
};
var ValueContainer = function ValueContainer(props) {
var children = props.children,
className = props.className,
cx = props.cx,
innerProps = props.innerProps,
isMulti = props.isMulti,
getStyles = props.getStyles,
hasValue = props.hasValue;
return react.jsx("div", _extends__default['default']({
css: getStyles('valueContainer', props),
className: cx({
'value-container': true,
'value-container--is-multi': isMulti,
'value-container--has-value': hasValue
}, className)
}, innerProps), children);
}; // ==============================
// Indicator Container
// ==============================
var indicatorsContainerCSS = function indicatorsContainerCSS() {
return {
alignItems: 'center',
alignSelf: 'stretch',
display: 'flex',
flexShrink: 0
};
};
var IndicatorsContainer = function IndicatorsContainer(props) {
var children = props.children,
className = props.className,
cx = props.cx,
innerProps = props.innerProps,
getStyles = props.getStyles;
return react.jsx("div", _extends__default['default']({
css: getStyles('indicatorsContainer', props),
className: cx({
indicators: true
}, className)
}, innerProps), children);
};
var _templateObject;
function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
var _ref2 = process.env.NODE_ENV === "production" ? {
name: "8mmkcg",
styles: "display:inline-block;fill:currentColor;line-height:1;stroke:currentColor;stroke-width:0"
} : {
name: "tj5bde-Svg",
styles: "display:inline-block;fill:currentColor;line-height:1;stroke:currentColor;stroke-width:0;label:Svg;",
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImluZGljYXRvcnMuanMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBa0JJIiwiZmlsZSI6ImluZGljYXRvcnMuanMiLCJzb3VyY2VzQ29udGVudCI6WyIvLyBAZmxvd1xuLyoqIEBqc3gganN4ICovXG5pbXBvcnQgeyB0eXBlIE5vZGUgfSBmcm9tICdyZWFjdCc7XG5pbXBvcnQgeyBqc3gsIGtleWZyYW1lcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcblxuaW1wb3J0IHR5cGUgeyBDb21tb25Qcm9wcywgVGhlbWUgfSBmcm9tICcuLi90eXBlcyc7XG5cbi8vID09PT09PT09PT09PT09PT09PT09PT09PT09PT09PVxuLy8gRHJvcGRvd24gJiBDbGVhciBJY29uc1xuLy8gPT09PT09PT09PT09PT09PT09PT09PT09PT09PT09XG5cbmNvbnN0IFN2ZyA9ICh7IHNpemUsIC4uLnByb3BzIH06IHsgc2l6ZTogbnVtYmVyIH0pID0+IChcbiAgPHN2Z1xuICAgIGhlaWdodD17c2l6ZX1cbiAgICB3aWR0aD17c2l6ZX1cbiAgICB2aWV3Qm94PVwiMCAwIDIwIDIwXCJcbiAgICBhcmlhLWhpZGRlbj1cInRydWVcIlxuICAgIGZvY3VzYWJsZT1cImZhbHNlXCJcbiAgICBjc3M9e3tcbiAgICAgIGRpc3BsYXk6ICdpbmxpbmUtYmxvY2snLFxuICAgICAgZmlsbDogJ2N1cnJlbnRDb2xvcicsXG4gICAgICBsaW5lSGVpZ2h0OiAxLFxuICAgICAgc3Ryb2tlOiAnY3VycmVudENvbG9yJyxcbiAgICAgIHN0cm9rZVdpZHRoOiAwLFxuICAgIH19XG4gICAgey4uLnByb3BzfVxuICAvPlxuKTtcblxuZXhwb3J0IGNvbnN0IENyb3NzSWNvbiA9IChwcm9wczogYW55KSA9PiAoXG4gIDxTdmcgc2l6ZT17MjB9IHsuLi5wcm9wc30+XG4gICAgPHBhdGggZD1cIk0xNC4zNDggMTQuODQ5Yy0wLjQ2OSAwLjQ2OS0xLjIyOSAwLjQ2OS0xLjY5NyAwbC0yLjY1MS0zLjAzMC0yLjY1MSAzLjAyOWMtMC40NjkgMC40NjktMS4yMjkgMC40NjktMS42OTcgMC0wLjQ2OS0wLjQ2OS0wLjQ2OS0xLjIyOSAwLTEuNjk3bDIuNzU4LTMuMTUtMi43NTktMy4xNTJjLTAuNDY5LTAuNDY5LTAuNDY5LTEuMjI4IDAtMS42OTdzMS4yMjgtMC40NjkgMS42OTcgMGwyLjY1MiAzLjAzMSAyLjY1MS0zLjAzMWMwLjQ2OS0wLjQ2OSAxLjIyOC0wLjQ2OSAxLjY5NyAwczAuNDY5IDEuMjI5IDAgMS42OTdsLTIuNzU4IDMuMTUyIDIuNzU4IDMuMTVjMC40NjkgMC40NjkgMC40NjkgMS4yMjkgMCAxLjY5OHpcIiAvPlxuICA8L1N2Zz5cbik7XG5leHBvcnQgY29uc3QgRG93bkNoZXZyb24gPSAocHJvcHM6IGFueSkgPT4gKFxuICA8U3ZnIHNpemU9ezIwfSB7Li4ucHJvcHN9PlxuICAgIDxwYXRoIGQ9XCJNNC41MTYgNy41NDhjMC40MzYtMC40NDYgMS4wNDMtMC40ODEgMS41NzYgMGwzLjkwOCAzLjc0NyAzLjkwOC0zLjc0N2MwLjUzMy0wLjQ4MSAxLjE0MS0wLjQ0NiAxLjU3NCAwIDAuNDM2IDAuNDQ1IDAuNDA4IDEuMTk3IDAgMS42MTUtMC40MDYgMC40MTgtNC42OTUgNC41MDItNC42OTUgNC41MDItMC4yMTcgMC4yMjMtMC41MDIgMC4zMzUtMC43ODcgMC4zMzVzLTAuNTctMC4xMTItMC43ODktMC4zMzVjMCAwLTQuMjg3LTQuMDg0LTQuNjk1LTQuNTAycy0wLjQzNi0xLjE3IDAtMS42MTV6XCIgLz5cbiAgPC9Tdmc+XG4pO1xuXG4vLyA9PT09PT09PT09PT09PT09PT09PT09PT09PT09PT1cbi8vIERyb3Bkb3duICYgQ2xlYXIgQnV0dG9uc1xuLy8gPT09PT09PT09PT09PT09PT09PT09PT09PT09PT09XG5cbmV4cG9ydCB0eXBlIEluZGljYXRvclByb3BzID0gQ29tbW9uUHJvcHMgJiB7XG4gIC8qKiBUaGUgY2hpbGRyZW4gdG8gYmUgcmVuZGVyZWQgaW5zaWRlIHRoZSBpbmRpY2F0b3IuICovXG4gIGNoaWxkcmVuOiBOb2RlLFxuICAvKiogUHJvcHMgdGhhdCB3aWxsIGJlIHBhc3NlZCBvbiB0byB0aGUgY2hpbGRyZW4uICovXG4gIGlubmVyUHJvcHM6IGFueSxcbiAgLyoqIFRoZSBmb2N1c2VkIHN0YXRlIG9mIHRoZSBzZWxlY3QuICovXG4gIGlzRm9jdXNlZDogYm9vbGVhbixcbiAgLyoqIFdoZXRoZXIgdGhlIHRleHQgaXMgcmlnaHQgdG8gbGVmdCAqL1xuICBpc1J0bDogYm9vbGVhbixcbn07XG5cbmNvbnN0IGJhc2VDU1MgPSAoe1xuICBpc0ZvY3VzZWQsXG4gIHRoZW1lOiB7XG4gICAgc3BhY2luZzogeyBiYXNlVW5pdCB9LFxuICAgIGNvbG9ycyxcbiAgfSxcbn06IEluZGljYXRvclByb3BzKSA9PiAoe1xuICBsYWJlbDogJ2luZGljYXRvckNvbnRhaW5lcicsXG4gIGNvbG9yOiBpc0ZvY3VzZWQgPyBjb2xvcnMubmV1dHJhbDYwIDogY29sb3JzLm5ldXRyYWwyMCxcbiAgZGlzcGxheTogJ2ZsZXgnLFxuICBwYWRkaW5nOiBiYXNlVW5pdCAqIDIsXG4gIHRyYW5zaXRpb246ICdjb2xvciAxNTBtcycsXG5cbiAgJzpob3Zlcic6IHtcbiAgICBjb2xvcjogaXNGb2N1c2VkID8gY29sb3JzLm5ldXRyYWw4MCA6IGNvbG9ycy5uZXV0cmFsNDAsXG4gIH0sXG59KTtcblxuZXhwb3J0IGNvbnN0IGRyb3Bkb3duSW5kaWNhdG9yQ1NTID0gYmFzZUNTUztcbmV4cG9ydCBjb25zdCBEcm9wZG93bkluZGljYXRvciA9IChwcm9wczogSW5kaWNhdG9yUHJvcHMpID0+IHtcbiAgY29uc3QgeyBjaGlsZHJlbiwgY2xhc3NOYW1lLCBjeCwgZ2V0U3R5bGVzLCBpbm5lclByb3BzIH0gPSBwcm9wcztcbiAgcmV0dXJuIChcbiAgICA8ZGl2XG4gICAgICBjc3M9e2dldFN0eWxlcygnZHJvcGRvd25JbmRpY2F0b3InLCBwcm9wcyl9XG4gICAgICBjbGFzc05hbWU9e2N4KFxuICAgICAgICB7XG4gICAgICAgICAgaW5kaWNhdG9yOiB0cnVlLFxuICAgICAgICAgICdkcm9wZG93bi1pbmRpY2F0b3InOiB0cnVlLFxuICAgICAgICB9LFxuICAgICAgICBjbGFzc05hbWVcbiAgICAgICl9XG4gICAgICB7Li4uaW5uZXJQcm9wc31cbiAgICA+XG4gICAgICB7Y2hpbGRyZW4gfHwgPERvd25DaGV2cm9uIC8+fVxuICAgIDwvZGl2PlxuICApO1xufTtcblxuZXhwb3J0IGNvbnN0IGNsZWFySW5kaWNhdG9yQ1NTID0gYmFzZUNTUztcbmV4cG9ydCBjb25zdCBDbGVhckluZGljYXRvciA9IChwcm9wczogSW5kaWNhdG9yUHJvcHMpID0+IHtcbiAgY29uc3QgeyBjaGlsZHJlbiwgY2xhc3NOYW1lLCBjeCwgZ2V0U3R5bGVzLCBpbm5lclByb3BzIH0gPSBwcm9wcztcbiAgcmV0dXJuIChcbiAgICA8ZGl2XG4gICAgICBjc3M9e2dldFN0eWxlcygnY2xlYXJJbmRpY2F0b3InLCBwcm9wcyl9XG4gICAgICBjbGFzc05hbWU9e2N4KFxuICAgICAgICB7XG4gICAgICAgICAgaW5kaWNhdG9yOiB0cnVlLFxuICAgICAgICAgICdjbGVhci1pbmRpY2F0b3InOiB0cnVlLFxuICAgICAgICB9LFxuICAgICAgICBjbGFzc05hbWVcbiAgICAgICl9XG4gICAgICB7Li4uaW5uZXJQcm9wc31cbiAgICA+XG4gICAgICB7Y2hpbGRyZW4gfHwgPENyb3NzSWNvbiAvPn1cbiAgICA8L2Rpdj5cbiAgKTtcbn07XG5cbi8vID09PT09PT09PT09PT09PT09PT09PT09PT09PT09PVxuLy8gU2VwYXJhdG9yXG4vLyA9PT09PT09PT09PT09PT09PT09PT09PT09PT09PT1cblxudHlwZSBTZXBhcmF0b3JTdGF0ZSA9IHsgaXNEaXNhYmxlZDogYm9vbGVhbiB9O1xuXG5leHBvcnQgY29uc3QgaW5kaWNhdG9yU2VwYXJhdG9yQ1NTID0gKHtcbiAgaXNEaXNhYmxlZCxcbiAgdGhlbWU6IHtcbiAgICBzcGFjaW5nOiB7IGJhc2VVbml0IH0sXG4gICAgY29sb3JzLFxuICB9LFxufTogQ29tbW9uUHJvcHMgJiBTZXBhcmF0b3JTdGF0ZSkgPT4gKHtcbiAgbGFiZWw6ICdpbmRpY2F0b3JTZXBhcmF0b3InLFxuICBhbGlnblNlbGY6ICdzdHJldGNoJyxcbiAgYmFja2dyb3VuZENvbG9yOiBpc0Rpc2FibGVkID8gY29sb3JzLm5ldXRyYWwxMCA6IGNvbG9ycy5uZXV0cmFsMjAsXG4gIG1hcmdpbkJvdHRvbTogYmFzZVVuaXQgKiAyLFxuICBtYXJnaW5Ub3A6IGJhc2VVbml0ICogMixcbiAgd2lkdGg6IDEsXG59KTtcblxuZXhwb3J0IGNvbnN0IEluZGljYXRvclNlcGFyYXRvciA9IChwcm9wczogSW5kaWNhdG9yUHJvcHMpID0+IHtcbiAgY29uc3QgeyBjbGFzc05hbWUsIGN4LCBnZXRTdHlsZXMsIGlubmVyUHJvcHMgfSA9IHByb3BzO1xuICByZXR1cm4gKFxuICAgIDxzcGFuXG4gICAgICB7Li4uaW5uZXJQcm9wc31cbiAgICAgIGNzcz17Z2V0U3R5bGVzKCdpbmRpY2F0b3JTZXBhcmF0b3InLCBwcm9wcyl9XG4gICAgICBjbGFzc05hbWU9e2N4KHsgJ2luZGljYXRvci1zZXBhcmF0b3InOiB0cnVlIH0sIGNsYXNzTmFtZSl9XG4gICAgLz5cbiAgKTtcbn07XG5cbi8vID09PT09PT09PT09PT09PT09PT09PT09PT09PT09PVxuLy8gTG9hZGluZ1xuLy8gPT09PT09PT09PT09PT09PT09PT09PT09PT09PT09XG5cbmNvbnN0IGxvYWRpbmdEb3RBbmltYXRpb25zID0ga2V5ZnJhbWVzYFxuICAwJSwgODAlLCAxMDAlIHsgb3BhY2l0eTogMDsgfVxuICA0MCUgeyBvcGFjaXR5OiAxOyB9XG5gO1xuXG5leHBvcnQgY29uc3QgbG9hZGluZ0luZGljYXRvckNTUyA9ICh7XG4gIGlzRm9jdXNlZCxcbiAgc2l6ZSxcbiAgdGhlbWU6IHtcbiAgICBjb2xvcnMsXG4gICAgc3BhY2luZzogeyBiYXNlVW5pdCB9LFxuICB9LFxufToge1xuICBpc0ZvY3VzZWQ6IGJvb2xlYW4sXG4gIHNpemU6IG51bWJlcixcbiAgdGhlbWU6IFRoZW1lLFxufSkgPT4gKHtcbiAgbGFiZWw6ICdsb2FkaW5nSW5kaWNhdG9yJyxcbiAgY29sb3I6IGlzRm9jdXNlZCA/IGNvbG9ycy5uZXV0cmFsNjAgOiBjb2xvcnMubmV1dHJhbDIwLFxuICBkaXNwbGF5OiAnZmxleCcsXG4gIHBhZGRpbmc6IGJhc2VVbml0ICogMixcbiAgdHJhbnNpdGlvbjogJ2NvbG9yIDE1MG1zJyxcbiAgYWxpZ25TZWxmOiAnY2VudGVyJyxcbiAgZm9udFNpemU6IHNpemUsXG4gIGxpbmVIZWlnaHQ6IDEsXG4gIG1hcmdpblJpZ2h0OiBzaXplLFxuICB0ZXh0QWxpZ246ICdjZW50ZXInLFxuICB2ZXJ0aWNhbEFsaWduOiAnbWlkZGxlJyxcbn0pO1xuXG50eXBlIERvdFByb3BzID0geyBkZWxheTogbnVtYmVyLCBvZmZzZXQ6IGJvb2xlYW4gfTtcbmNvbnN0IExvYWRpbmdEb3QgPSAoeyBkZWxheSwgb2Zmc2V0IH06IERvdFByb3BzKSA9PiAoXG4gIDxzcGFuXG4gICAgY3NzPXt7XG4gICAgICBhbmltYXRpb246IGAke2xvYWRpbmdEb3RBbmltYXRpb25zfSAxcyBlYXNlLWluLW91dCAke2RlbGF5fW1zIGluZmluaXRlO2AsXG4gICAgICBiYWNrZ3JvdW5kQ29sb3I6ICdjdXJyZW50Q29sb3InLFxuICAgICAgYm9yZGVyUmFkaXVzOiAnMWVtJyxcbiAgICAgIGRpc3BsYXk6ICdpbmxpbmUtYmxvY2snLFxuICAgICAgbWFyZ2luTGVmdDogb2Zmc2V0ID8gJzFlbScgOiBudWxsLFxuICAgICAgaGVpZ2h0OiAnMWVtJyxcbiAgICAgIHZlcnRpY2FsQWxpZ246ICd0b3AnLFxuICAgICAgd2lkdGg6ICcxZW0nLFxuICAgIH19XG4gIC8+XG4pO1xuXG5leHBvcnQgdHlwZSBMb2FkaW5nSWNvblByb3BzID0ge1xuICAvKiogUHJvcHMgdGhhdCB3aWxsIGJlIHBhc3NlZCBvbiB0byB0aGUgY2hpbGRyZW4uICovXG4gIGlubmVyUHJvcHM6IGFueSxcbiAgLyoqIFRoZSBmb2N1c2VkIHN0YXRlIG9mIHRoZSBzZWxlY3QuICovXG4gIGlzRm9jdXNlZDogYm9vbGVhbixcbiAgLyoqIFdoZXRoZXIgdGhlIHRleHQgaXMgcmlnaHQgdG8gbGVmdCAqL1xuICBpc1J0bDogYm9vbGVhbixcbn0gJiBDb21tb25Qcm9wcyAmIHtcbiAgICAvKiogU2V0IHNpemUgb2YgdGhlIGNvbnRhaW5lci4gKi9cbiAgICBzaXplOiBudW1iZXIsXG4gIH07XG5leHBvcnQgY29uc3QgTG9hZGluZ0luZGljYXRvciA9IChwcm9wczogTG9hZGluZ0ljb25Qcm9wcykgPT4ge1xuICBjb25zdCB7IGNsYXNzTmFtZSwgY3gsIGdldFN0eWxlcywgaW5uZXJQcm9wcywgaXNSdGwgfSA9IHByb3BzO1xuXG4gIHJldHVybiAoXG4gICAgPGRpdlxuICAgICAgY3NzPXtnZXRTdHlsZXMoJ2xvYWRpbmdJbmRpY2F0b3InLCBwcm9wcyl9XG4gICAgICBjbGFzc05hbWU9e2N4KFxuICAgICAgICB7XG4gICAgICAgICAgaW5kaWNhdG9yOiB0cnVlLFxuICAgICAgICAgICdsb2FkaW5nLWluZGljYXRvcic6IHRydWUsXG4gICAgICAgIH0sXG4gICAgICAgIGNsYXNzTmFtZVxuICAgICAgKX1cbiAgICAgIHsuLi5pbm5lclByb3BzfVxuICAgID5cbiAgICAgIDxMb2FkaW5nRG90IGRlbGF5PXswfSBvZmZzZXQ9e2lzUnRsfSAvPlxuICAgICAgPExvYWRpbmdEb3QgZGVsYXk9ezE2MH0gb2Zmc2V0IC8+XG4gICAgICA8TG9hZGluZ0RvdCBkZWxheT17MzIwfSBvZmZzZXQ9eyFpc1J0bH0gLz5cbiAgICA8L2Rpdj5cbiAgKTtcbn07XG5Mb2FkaW5nSW5kaWNhdG9yLmRlZmF1bHRQcm9wcyA9IHsgc2l6ZTogNCB9O1xuIl19 */",
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
};
// ==============================
// Dropdown & Clear Icons
// ==============================
var Svg = function Svg(_ref) {
var size = _ref.size,
props = _objectWithoutProperties__default['default'](_ref, ["size"]);
return react.jsx("svg", _extends__default['default']({
height: size,
width: size,
viewBox: "0 0 20 20",
"aria-hidden": "true",
focusable: "false",
css: _ref2
}, props));
};
var CrossIcon = function CrossIcon(props) {
return react.jsx(Svg, _extends__default['default']({
size: 20
}, props), react.jsx("path", {
d: "M14.348 14.849c-0.469 0.469-1.229 0.469-1.697 0l-2.651-3.030-2.651 3.029c-0.469 0.469-1.229 0.469-1.697 0-0.469-0.469-0.469-1.229 0-1.697l2.758-3.15-2.759-3.152c-0.469-0.469-0.469-1.228 0-1.697s1.228-0.469 1.697 0l2.652 3.031 2.651-3.031c0.469-0.469 1.228-0.469 1.697 0s0.469 1.229 0 1.697l-2.758 3.152 2.758 3.15c0.469 0.469 0.469 1.229 0 1.698z"
}));
};
var DownChevron = function DownChevron(props) {
return react.jsx(Svg, _extends__default['default']({
size: 20
}, props), react.jsx("path", {
d: "M4.516 7.548c0.436-0.446 1.043-0.481 1.576 0l3.908 3.747 3.908-3.747c0.533-0.481 1.141-0.446 1.574 0 0.436 0.445 0.408 1.197 0 1.615-0.406 0.418-4.695 4.502-4.695 4.502-0.217 0.223-0.502 0.335-0.787 0.335s-0.57-0.112-0.789-0.335c0 0-4.287-4.084-4.695-4.502s-0.436-1.17 0-1.615z"
}));
}; // ==============================
// Dropdown & Clear Buttons
// ==============================
var baseCSS = function baseCSS(_ref3) {
var isFocused = _ref3.isFocused,
_ref3$theme = _ref3.theme,
baseUnit = _ref3$theme.spacing.baseUnit,
colors = _ref3$theme.colors;
return {
label: 'indicatorContainer',
color: isFocused ? colors.neutral60 : colors.neutral20,
display: 'flex',
padding: baseUnit * 2,
transition: 'color 150ms',
':hover': {
color: isFocused ? colors.neutral80 : colors.neutral40
}
};
};
var dropdownIndicatorCSS = baseCSS;
var DropdownIndicator = function DropdownIndicator(props) {
var children = props.children,
className = props.className,
cx = props.cx,
getStyles = props.getStyles,
innerProps = props.innerProps;
return react.jsx("div", _extends__default['default']({
css: getStyles('dropdownIndicator', props),
className: cx({
indicator: true,
'dropdown-indicator': true
}, className)
}, innerProps), children || react.jsx(DownChevron, null));
};
var clearIndicatorCSS = baseCSS;
var ClearIndicator = function ClearIndicator(props) {
var children = props.children,
className = props.className,
cx = props.cx,
getStyles = props.getStyles,
innerProps = props.innerProps;
return react.jsx("div", _extends__default['default']({
css: getStyles('clearIndicator', props),
className: cx({
indicator: true,
'clear-indicator': true
}, className)
}, innerProps), children || react.jsx(CrossIcon, null));
}; // ==============================
// Separator
// ==============================
var indicatorSeparatorCSS = function indicatorSeparatorCSS(_ref4) {
var isDisabled = _ref4.isDisabled,
_ref4$theme = _ref4.theme,
baseUnit = _ref4$theme.spacing.baseUnit,
colors = _ref4$theme.colors;
return {
label: 'indicatorSeparator',
alignSelf: 'stretch',
backgroundColor: isDisabled ? colors.neutral10 : colors.neutral20,
marginBottom: baseUnit * 2,
marginTop: baseUnit * 2,
width: 1
};
};
var IndicatorSeparator = function IndicatorSeparator(props) {
var className = props.className,
cx = props.cx,
getStyles = props.getStyles,
innerProps = props.innerProps;
return react.jsx("span", _extends__default['default']({}, innerProps, {
css: getStyles('indicatorSeparator', props),
className: cx({
'indicator-separator': true
}, className)
}));
}; // ==============================
// Loading
// ==============================
var loadingDotAnimations = react.keyframes(_templateObject || (_templateObject = _taggedTemplateLiteral__default['default'](["\n 0%, 80%, 100% { opacity: 0; }\n 40% { opacity: 1; }\n"])));
var loadingIndicatorCSS = function loadingIndicatorCSS(_ref5) {
var isFocused = _ref5.isFocused,
size = _ref5.size,
_ref5$theme = _ref5.theme,
colors = _ref5$theme.colors,
baseUnit = _ref5$theme.spacing.baseUnit;
return {
label: 'loadingIndicator',
color: isFocused ? colors.neutral60 : colors.neutral20,
display: 'flex',
padding: baseUnit * 2,
transition: 'color 150ms',
alignSelf: 'center',
fontSize: size,
lineHeight: 1,
marginRight: size,
textAlign: 'center',
verticalAlign: 'middle'
};
};
var LoadingDot = function LoadingDot(_ref6) {
var delay = _ref6.delay,
offset = _ref6.offset;
return react.jsx("span", {
css: /*#__PURE__*/react.css({
animation: "".concat(loadingDotAnimations, " 1s ease-in-out ").concat(delay, "ms infinite;"),
backgroundColor: 'currentColor',
borderRadius: '1em',
display: 'inline-block',
marginLeft: offset ? '1em' : null,
height: '1em',
verticalAlign: 'top',
width: '1em'
}, process.env.NODE_ENV === "production" ? "" : ";label:LoadingDot;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImluZGljYXRvcnMuanMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBc0xJIiwiZmlsZSI6ImluZGljYXRvcnMuanMiLCJzb3VyY2VzQ29udGVudCI6WyIvLyBAZmxvd1xuLyoqIEBqc3gganN4ICovXG5pbXBvcnQgeyB0eXBlIE5vZGUgfSBmcm9tICdyZWFjdCc7XG5pbXBvcnQgeyBqc3gsIGtleWZyYW1lcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcblxuaW1wb3J0IHR5cGUgeyBDb21tb25Qcm9wcywgVGhlbWUgfSBmcm9tICcuLi90eXBlcyc7XG5cbi8vID09PT09PT09PT09PT09PT09PT09PT09PT09PT09PVxuLy8gRHJvcGRvd24gJiBDbGVhciBJY29uc1xuLy8gPT09PT09PT09PT09PT09PT09PT09PT09PT09PT09XG5cbmNvbnN0IFN2ZyA9ICh7IHNpemUsIC4uLnByb3BzIH06IHsgc2l6ZTogbnVtYmVyIH0pID0+IChcbiAgPHN2Z1xuICAgIGhlaWdodD17c2l6ZX1cbiAgICB3aWR0aD17c2l6ZX1cbiAgICB2aWV3Qm94PVwiMCAwIDIwIDIwXCJcbiAgICBhcmlhLWhpZGRlbj1cInRydWVcIlxuICAgIGZvY3VzYWJsZT1cImZhbHNlXCJcbiAgICBjc3M9e3tcbiAgICAgIGRpc3BsYXk6ICdpbmxpbmUtYmxvY2snLFxuICAgICAgZmlsbDogJ2N1cnJlbnRDb2xvcicsXG4gICAgICBsaW5lSGVpZ2h0OiAxLFxuICAgICAgc3Ryb2tlOiAnY3VycmVudENvbG9yJyxcbiAgICAgIHN0cm9rZVdpZHRoOiAwLFxuICAgIH19XG4gICAgey4uLnByb3BzfVxuICAvPlxuKTtcblxuZXhwb3J0IGNvbnN0IENyb3NzSWNvbiA9IChwcm9wczogYW55KSA9PiAoXG4gIDxTdmcgc2l6ZT17MjB9IHsuLi5wcm9wc30+XG4gICAgPHBhdGggZD1cIk0xNC4zNDggMTQuODQ5Yy0wLjQ2OSAwLjQ2OS0xLjIyOSAwLjQ2OS0xLjY5NyAwbC0yLjY1MS0zLjAzMC0yLjY1MSAzLjAyOWMtMC40NjkgMC40NjktMS4yMjkgMC40NjktMS42OTcgMC0wLjQ2OS0wLjQ2OS0wLjQ2OS0xLjIyOSAwLTEuNjk3bDIuNzU4LTMuMTUtMi43NTktMy4xNTJjLTAuNDY5LTAuNDY5LTAuNDY5LTEuMjI4IDAtMS42OTdzMS4yMjgtMC40NjkgMS42OTcgMGwyLjY1MiAzLjAzMSAyLjY1MS0zLjAzMWMwLjQ2OS0wLjQ2OSAxLjIyOC0wLjQ2OSAxLjY5NyAwczAuNDY5IDEuMjI5IDAgMS42OTdsLTIuNzU4IDMuMTUyIDIuNzU4IDMuMTVjMC40NjkgMC40NjkgMC40NjkgMS4yMjkgMCAxLjY5OHpcIiAvPlxuICA8L1N2Zz5cbik7XG5leHBvcnQgY29uc3QgRG93bkNoZXZyb24gPSAocHJvcHM6IGFueSkgPT4gKFxuICA8U3ZnIHNpemU9ezIwfSB7Li4ucHJvcHN9PlxuICAgIDxwYXRoIGQ9XCJNNC41MTYgNy41NDhjMC40MzYtMC40NDYgMS4wNDMtMC40ODEgMS41NzYgMGwzLjkwOCAzLjc0NyAzLjkwOC0zLjc0N2MwLjUzMy0wLjQ4MSAxLjE0MS0wLjQ0NiAxLjU3NCAwIDAuNDM2IDAuNDQ1IDAuNDA4IDEuMTk3IDAgMS42MTUtMC40MDYgMC40MTgtNC42OTUgNC41MDItNC42OTUgNC41MDItMC4yMTcgMC4yMjMtMC41MDIgMC4zMzUtMC43ODcgMC4zMzVzLTAuNTctMC4xMTItMC43ODktMC4zMzVjMCAwLTQuMjg3LTQuMDg0LTQuNjk1LTQuNTAycy0wLjQzNi0xLjE3IDAtMS42MTV6XCIgLz5cbiAgPC9Tdmc+XG4pO1xuXG4vLyA9PT09PT09PT09PT09PT09PT09PT09PT09PT09PT1cbi8vIERyb3Bkb3duICYgQ2xlYXIgQnV0dG9uc1xuLy8gPT09PT09PT09PT09PT09PT09PT09PT09PT09PT09XG5cbmV4cG9ydCB0eXBlIEluZGljYXRvclByb3BzID0gQ29tbW9uUHJvcHMgJiB7XG4gIC8qKiBUaGUgY2hpbGRyZW4gdG8gYmUgcmVuZGVyZWQgaW5zaWRlIHRoZSBpbmRpY2F0b3IuICovXG4gIGNoaWxkcmVuOiBOb2RlLFxuICAvKiogUHJvcHMgdGhhdCB3aWxsIGJlIHBhc3NlZCBvbiB0byB0aGUgY2hpbGRyZW4uICovXG4gIGlubmVyUHJvcHM6IGFueSxcbiAgLyoqIFRoZSBmb2N1c2VkIHN0YXRlIG9mIHRoZSBzZWxlY3QuICovXG4gIGlzRm9jdXNlZDogYm9vbGVhbixcbiAgLyoqIFdoZXRoZXIgdGhlIHRleHQgaXMgcmlnaHQgdG8gbGVmdCAqL1xuICBpc1J0bDogYm9vbGVhbixcbn07XG5cbmNvbnN0IGJhc2VDU1MgPSAoe1xuICBpc0ZvY3VzZWQsXG4gIHRoZW1lOiB7XG4gICAgc3BhY2luZzogeyBiYXNlVW5pdCB9LFxuICAgIGNvbG9ycyxcbiAgfSxcbn06IEluZGljYXRvclByb3BzKSA9PiAoe1xuICBsYWJlbDogJ2luZGljYXRvckNvbnRhaW5lcicsXG4gIGNvbG9yOiBpc0ZvY3VzZWQgPyBjb2xvcnMubmV1dHJhbDYwIDogY29sb3JzLm5ldXRyYWwyMCxcbiAgZGlzcGxheTogJ2ZsZXgnLFxuICBwYWRkaW5nOiBiYXNlVW5pdCAqIDIsXG4gIHRyYW5zaXRpb246ICdjb2xvciAxNTBtcycsXG5cbiAgJzpob3Zlcic6IHtcbiAgICBjb2xvcjogaXNGb2N1c2VkID8gY29sb3JzLm5ldXRyYWw4MCA6IGNvbG9ycy5uZXV0cmFsNDAsXG4gIH0sXG59KTtcblxuZXhwb3J0IGNvbnN0IGRyb3Bkb3duSW5kaWNhdG9yQ1NTID0gYmFzZUNTUztcbmV4cG9ydCBjb25zdCBEcm9wZG93bkluZGljYXRvciA9IChwcm9wczogSW5kaWNhdG9yUHJvcHMpID0+IHtcbiAgY29uc3QgeyBjaGlsZHJlbiwgY2xhc3NOYW1lLCBjeCwgZ2V0U3R5bGVzLCBpbm5lclByb3BzIH0gPSBwcm9wcztcbiAgcmV0dXJuIChcbiAgICA8ZGl2XG4gICAgICBjc3M9e2dldFN0eWxlcygnZHJvcGRvd25JbmRpY2F0b3InLCBwcm9wcyl9XG4gICAgICBjbGFzc05hbWU9e2N4KFxuICAgICAgICB7XG4gICAgICAgICAgaW5kaWNhdG9yOiB0cnVlLFxuICAgICAgICAgICdkcm9wZG93bi1pbmRpY2F0b3InOiB0cnVlLFxuICAgICAgICB9LFxuICAgICAgICBjbGFzc05hbWVcbiAgICAgICl9XG4gICAgICB7Li4uaW5uZXJQcm9wc31cbiAgICA+XG4gICAgICB7Y2hpbGRyZW4gfHwgPERvd25DaGV2cm9uIC8+fVxuICAgIDwvZGl2PlxuICApO1xufTtcblxuZXhwb3J0IGNvbnN0IGNsZWFySW5kaWNhdG9yQ1NTID0gYmFzZUNTUztcbmV4cG9ydCBjb25zdCBDbGVhckluZGljYXRvciA9IChwcm9wczogSW5kaWNhdG9yUHJvcHMpID0+IHtcbiAgY29uc3QgeyBjaGlsZHJlbiwgY2xhc3NOYW1lLCBjeCwgZ2V0U3R5bGVzLCBpbm5lclByb3BzIH0gPSBwcm9wcztcbiAgcmV0dXJuIChcbiAgICA8ZGl2XG4gICAgICBjc3M9e2dldFN0eWxlcygnY2xlYXJJbmRpY2F0b3InLCBwcm9wcyl9XG4gICAgICBjbGFzc05hbWU9e2N4KFxuICAgICAgICB7XG4gICAgICAgICAgaW5kaWNhdG9yOiB0cnVlLFxuICAgICAgICAgICdjbGVhci1pbmRpY2F0b3InOiB0cnVlLFxuICAgICAgICB9LFxuICAgICAgICBjbGFzc05hbWVcbiAgICAgICl9XG4gICAgICB7Li4uaW5uZXJQcm9wc31cbiAgICA+XG4gICAgICB7Y2hpbGRyZW4gfHwgPENyb3NzSWNvbiAvPn1cbiAgICA8L2Rpdj5cbiAgKTtcbn07XG5cbi8vID09PT09PT09PT09PT09PT09PT09PT09PT09PT09PVxuLy8gU2VwYXJhdG9yXG4vLyA9PT09PT09PT09PT09PT09PT09PT09PT09PT09PT1cblxudHlwZSBTZXBhcmF0b3JTdGF0ZSA9IHsgaXNEaXNhYmxlZDogYm9vbGVhbiB9O1xuXG5leHBvcnQgY29uc3QgaW5kaWNhdG9yU2VwYXJhdG9yQ1NTID0gKHtcbiAgaXNEaXNhYmxlZCxcbiAgdGhlbWU6IHtcbiAgICBzcGFjaW5nOiB7IGJhc2VVbml0IH0sXG4gICAgY29sb3JzLFxuICB9LFxufTogQ29tbW9uUHJvcHMgJiBTZXBhcmF0b3JTdGF0ZSkgPT4gKHtcbiAgbGFiZWw6ICdpbmRpY2F0b3JTZXBhcmF0b3InLFxuICBhbGlnblNlbGY6ICdzdHJldGNoJyxcbiAgYmFja2dyb3VuZENvbG9yOiBpc0Rpc2FibGVkID8gY29sb3JzLm5ldXRyYWwxMCA6IGNvbG9ycy5uZXV0cmFsMjAsXG4gIG1hcmdpbkJvdHRvbTogYmFzZVVuaXQgKiAyLFxuICBtYXJnaW5Ub3A6IGJhc2VVbml0ICogMixcbiAgd2lkdGg6IDEsXG59KTtcblxuZXhwb3J0IGNvbnN0IEluZGljYXRvclNlcGFyYXRvciA9IChwcm9wczogSW5kaWNhdG9yUHJvcHMpID0+IHtcbiAgY29uc3QgeyBjbGFzc05hbWUsIGN4LCBnZXRTdHlsZXMsIGlubmVyUHJvcHMgfSA9IHByb3BzO1xuICByZXR1cm4gKFxuICAgIDxzcGFuXG4gICAgICB7Li4uaW5uZXJQcm9wc31cbiAgICAgIGNzcz17Z2V0U3R5bGVzKCdpbmRpY2F0b3JTZXBhcmF0b3InLCBwcm9wcyl9XG4gICAgICBjbGFzc05hbWU9e2N4KHsgJ2luZGljYXRvci1zZXBhcmF0b3InOiB0cnVlIH0sIGNsYXNzTmFtZSl9XG4gICAgLz5cbiAgKTtcbn07XG5cbi8vID09PT09PT09PT09PT09PT09PT09PT09PT09PT09PVxuLy8gTG9hZGluZ1xuLy8gPT09PT09PT09PT09PT09PT09PT09PT09PT09PT09XG5cbmNvbnN0IGxvYWRpbmdEb3RBbmltYXRpb25zID0ga2V5ZnJhbWVzYFxuICAwJSwgODAlLCAxMDAlIHsgb3BhY2l0eTogMDsgfVxuICA0MCUgeyBvcGFjaXR5OiAxOyB9XG5gO1xuXG5leHBvcnQgY29uc3QgbG9hZGluZ0luZGljYXRvckNTUyA9ICh7XG4gIGlzRm9jdXNlZCxcbiAgc2l6ZSxcbiAgdGhlbWU6IHtcbiAgICBjb2xvcnMsXG4gICAgc3BhY2luZzogeyBiYXNlVW5pdCB9LFxuICB9LFxufToge1xuICBpc0ZvY3VzZWQ6IGJvb2xlYW4sXG4gIHNpemU6IG51bWJlcixcbiAgdGhlbWU6IFRoZW1lLFxufSkgPT4gKHtcbiAgbGFiZWw6ICdsb2FkaW5nSW5kaWNhdG9yJyxcbiAgY29sb3I6IGlzRm9jdXNlZCA/IGNvbG9ycy5uZXV0cmFsNjAgOiBjb2xvcnMubmV1dHJhbDIwLFxuICBkaXNwbGF5OiAnZmxleCcsXG4gIHBhZGRpbmc6IGJhc2VVbml0ICogMixcbiAgdHJhbnNpdGlvbjogJ2NvbG9yIDE1MG1zJyxcbiAgYWxpZ25TZWxmOiAnY2VudGVyJyxcbiAgZm9udFNpemU6IHNpemUsXG4gIGxpbmVIZWlnaHQ6IDEsXG4gIG1hcmdpblJpZ2h0OiBzaXplLFxuICB0ZXh0QWxpZ246ICdjZW50ZXInLFxuICB2ZXJ0aWNhbEFsaWduOiAnbWlkZGxlJyxcbn0pO1xuXG50eXBlIERvdFByb3BzID0geyBkZWxheTogbnVtYmVyLCBvZmZzZXQ6IGJvb2xlYW4gfTtcbmNvbnN0IExvYWRpbmdEb3QgPSAoeyBkZWxheSwgb2Zmc2V0IH06IERvdFByb3BzKSA9PiAoXG4gIDxzcGFuXG4gICAgY3NzPXt7XG4gICAgICBhbmltYXRpb246IGAke2xvYWRpbmdEb3RBbmltYXRpb25zfSAxcyBlYXNlLWluLW91dCAke2RlbGF5fW1zIGluZmluaXRlO2AsXG4gICAgICBiYWNrZ3JvdW5kQ29sb3I6ICdjdXJyZW50Q29sb3InLFxuICAgICAgYm9yZGVyUmFkaXVzOiAnMWVtJyxcbiAgICAgIGRpc3BsYXk6ICdpbmxpbmUtYmxvY2snLFxuICAgICAgbWFyZ2luTGVmdDogb2Zmc2V0ID8gJzFlbScgOiBudWxsLFxuICAgICAgaGVpZ2h0OiAnMWVtJyxcbiAgICAgIHZlcnRpY2FsQWxpZ246ICd0b3AnLFxuICAgICAgd2lkdGg6ICcxZW0nLFxuICAgIH19XG4gIC8+XG4pO1xuXG5leHBvcnQgdHlwZSBMb2FkaW5nSWNvblByb3BzID0ge1xuICAvKiogUHJvcHMgdGhhdCB3aWxsIGJlIHBhc3NlZCBvbiB0byB0aGUgY2hpbGRyZW4uICovXG4gIGlubmVyUHJvcHM6IGFueSxcbiAgLyoqIFRoZSBmb2N1c2VkIHN0YXRlIG9mIHRoZSBzZWxlY3QuICovXG4gIGlzRm9jdXNlZDogYm9vbGVhbixcbiAgLyoqIFdoZXRoZXIgdGhlIHRleHQgaXMgcmlnaHQgdG8gbGVmdCAqL1xuICBpc1J0bDogYm9vbGVhbixcbn0gJiBDb21tb25Qcm9wcyAmIHtcbiAgICAvKiogU2V0IHNpemUgb2YgdGhlIGNvbnRhaW5lci4gKi9cbiAgICBzaXplOiBudW1iZXIsXG4gIH07XG5leHBvcnQgY29uc3QgTG9hZGluZ0luZGljYXRvciA9IChwcm9wczogTG9hZGluZ0ljb25Qcm9wcykgPT4ge1xuICBjb25zdCB7IGNsYXNzTmFtZSwgY3gsIGdldFN0eWxlcywgaW5uZXJQcm9wcywgaXNSdGwgfSA9IHByb3BzO1xuXG4gIHJldHVybiAoXG4gICAgPGRpdlxuICAgICAgY3NzPXtnZXRTdHlsZXMoJ2xvYWRpbmdJbmRpY2F0b3InLCBwcm9wcyl9XG4gICAgICBjbGFzc05hbWU9e2N4KFxuICAgICAgICB7XG4gICAgICAgICAgaW5kaWNhdG9yOiB0cnVlLFxuICAgICAgICAgICdsb2FkaW5nLWluZGljYXRvcic6IHRydWUsXG4gICAgICAgIH0sXG4gICAgICAgIGNsYXNzTmFtZVxuICAgICAgKX1cbiAgICAgIHsuLi5pbm5lclByb3BzfVxuICAgID5cbiAgICAgIDxMb2FkaW5nRG90IGRlbGF5PXswfSBvZmZzZXQ9e2lzUnRsfSAvPlxuICAgICAgPExvYWRpbmdEb3QgZGVsYXk9ezE2MH0gb2Zmc2V0IC8+XG4gICAgICA8TG9hZGluZ0RvdCBkZWxheT17MzIwfSBvZmZzZXQ9eyFpc1J0bH0gLz5cbiAgICA8L2Rpdj5cbiAgKTtcbn07XG5Mb2FkaW5nSW5kaWNhdG9yLmRlZmF1bHRQcm9wcyA9IHsgc2l6ZTogNCB9O1xuIl19 */")
});
};
var LoadingIndicator = function LoadingIndicator(props) {
var className = props.className,
cx = props.cx,
getStyles = props.getStyles,
innerProps = props.innerProps,
isRtl = props.isRtl;
return react.jsx("div", _extends__default['default']({
css: getStyles('loadingIndicator', props),
className: cx({
indicator: true,
'loading-indicator': true
}, className)
}, innerProps), react.jsx(LoadingDot, {
delay: 0,
offset: isRtl
}), react.jsx(LoadingDot, {
delay: 160,
offset: true
}), react.jsx(LoadingDot, {
delay: 320,
offset: !isRtl
}));
};
LoadingIndicator.defaultProps = {
size: 4
};
var css = function css(_ref) {
var isDisabled = _ref.isDisabled,
isFocused = _ref.isFocused,
_ref$theme = _ref.theme,
colors = _ref$theme.colors,
borderRadius = _ref$theme.borderRadius,
spacing = _ref$theme.spacing;
return {
label: 'control',
alignItems: 'center',
backgroundColor: isDisabled ? colors.neutral5 : colors.neutral0,
borderColor: isDisabled ? colors.neutral10 : isFocused ? colors.primary : colors.neutral20,
borderRadius: borderRadius,
borderStyle: 'solid',
borderWidth: 1,
boxShadow: isFocused ? "0 0 0 1px ".concat(colors.primary) : null,
cursor: 'default',
display: 'flex',
flexWrap: 'wrap',
justifyContent: 'space-between',
minHeight: spacing.controlHeight,
outline: '0 !important',
position: 'relative',
transition: 'all 100ms',
'&:hover': {
borderColor: isFocused ? colors.primary : colors.neutral30
}
};
};
var Control = function Control(props) {
var children = props.children,
cx = props.cx,
getStyles = props.getStyles,
className = props.className,
isDisabled = props.isDisabled,
isFocused = props.isFocused,
innerRef = props.innerRef,
innerProps = props.innerProps,
menuIsOpen = props.menuIsOpen;
return react.jsx("div", _extends__default['default']({
ref: innerRef,
css: getStyles('control', props),
className: cx({
control: true,
'control--is-disabled': isDisabled,
'control--is-focused': isFocused,
'control--menu-is-open': menuIsOpen
}, className)
}, innerProps), children);
};
var groupCSS = function groupCSS(_ref) {
var spacing = _ref.theme.spacing;
return {
paddingBottom: spacing.baseUnit * 2,
paddingTop: spacing.baseUnit * 2
};
};
var Group = function Group(props) {
var children = props.children,
className = props.className,
cx = props.cx,
getStyles = props.getStyles,
Heading = props.Heading,
headingProps = props.headingProps,
innerProps = props.innerProps,
label = props.label,
theme = props.theme,
selectProps = props.selectProps;
return react.jsx("div", _extends__default['default']({
css: getStyles('group', props),
className: cx({
group: true
}, className)
}, innerProps), react.jsx(Heading, _extends__default['default']({}, headingProps, {
selectProps: selectProps,
theme: theme,
getStyles: getStyles,
cx: cx
}), label), react.jsx("div", null, children));
};
var groupHeadingCSS = function groupHeadingCSS(_ref2) {
var spacing = _ref2.theme.spacing;
return {
label: 'group',
color: '#999',
cursor: 'default',
display: 'block',
fontSize: '75%',
fontWeight: '500',
marginBottom: '0.25em',
paddingLeft: spacing.baseUnit * 3,
paddingRight: spacing.baseUnit * 3,
textTransform: 'uppercase'
};
};
var GroupHeading = function GroupHeading(props) {
var getStyles = props.getStyles,
cx = props.cx,
className = props.className;
var _cleanCommonProps = cleanCommonProps(props);
_cleanCommonProps.data;
var innerProps = _objectWithoutProperties__default['default'](_cleanCommonProps, ["data"]);
return react.jsx("div", _extends__default['default']({
css: getStyles('groupHeading', props),
className: cx({
'group-heading': true
}, className)
}, innerProps));
};
var inputCSS = function inputCSS(_ref) {
var isDisabled = _ref.isDisabled,
_ref$theme = _ref.theme,
spacing = _ref$theme.spacing,
colors = _ref$theme.colors;
return {
margin: spacing.baseUnit / 2,
paddingBottom: spacing.baseUnit / 2,
paddingTop: spacing.baseUnit / 2,
visibility: isDisabled ? 'hidden' : 'visible',
color: colors.neutral80
};
};
var inputStyle = function inputStyle(isHidden) {
return {
label: 'input',
background: 0,
border: 0,
fontSize: 'inherit',
opacity: isHidden ? 0 : 1,
outline: 0,
padding: 0,
color: 'inherit'
};
};
var Input = function Input(props) {
var className = props.className,
cx = props.cx,
getStyles = props.getStyles;
var _cleanCommonProps = cleanCommonProps(props),
innerRef = _cleanCommonProps.innerRef,
isDisabled = _cleanCommonProps.isDisabled,
isHidden = _cleanCommonProps.isHidden,
innerProps = _objectWithoutProperties__default['default'](_cleanCommonProps, ["innerRef", "isDisabled", "isHidden"]);
return react.jsx("div", {
css: getStyles('input', props)
}, react.jsx(AutosizeInput__default['default'], _extends__default['default']({
className: cx({
input: true
}, className),
inputRef: innerRef,
inputStyle: inputStyle(isHidden),
disabled: isDisabled
}, innerProps)));
};
var multiValueCSS = function multiValueCSS(_ref) {
var _ref$theme = _ref.theme,
spacing = _ref$theme.spacing,
borderRadius = _ref$theme.borderRadius,
colors = _ref$theme.colors;
return {
label: 'multiValue',
backgroundColor: colors.neutral10,
borderRadius: borderRadius / 2,
display: 'flex',
margin: spacing.baseUnit / 2,
minWidth: 0 // resolves flex/text-overflow bug
};
};
var multiValueLabelCSS = function multiValueLabelCSS(_ref2) {
var _ref2$theme = _ref2.theme,
borderRadius = _ref2$theme.borderRadius,
colors = _ref2$theme.colors,
cropWithEllipsis = _ref2.cropWithEllipsis;
return {
borderRadius: borderRadius / 2,
color: colors.neutral80,
fontSize: '85%',
overflow: 'hidden',
padding: 3,
paddingLeft: 6,
textOverflow: cropWithEllipsis ? 'ellipsis' : null,
whiteSpace: 'nowrap'
};
};
var multiValueRemoveCSS = function multiValueRemoveCSS(_ref3) {
var _ref3$theme = _ref3.theme,
spacing = _ref3$theme.spacing,
borderRadius = _ref3$theme.borderRadius,
colors = _ref3$theme.colors,
isFocused = _ref3.isFocused;
return {
alignItems: 'center',
borderRadius: borderRadius / 2,
backgroundColor: isFocused && colors.dangerLight,
display: 'flex',
paddingLeft: spacing.baseUnit,
paddingRight: spacing.baseUnit,
':hover': {
backgroundColor: colors.dangerLight,
color: colors.danger
}
};
};
var MultiValueGeneric = function MultiValueGeneric(_ref4) {
var children = _ref4.children,
innerProps = _ref4.innerProps;
return react.jsx("div", innerProps, children);
};
var MultiValueContainer = MultiValueGeneric;
var MultiValueLabel = MultiValueGeneric;
function MultiValueRemove(_ref5) {
var children = _ref5.children,
innerProps = _ref5.innerProps;
return react.jsx("div", innerProps, children || react.jsx(CrossIcon, {
size: 14
}));
}
var MultiValue = function MultiValue(props) {
var children = props.children,
className = props.className,
components = props.components,
cx = props.cx,
data = props.data,
getStyles = props.getStyles,
innerProps = props.innerProps,
isDisabled = props.isDisabled,
removeProps = props.removeProps,
selectProps = props.selectProps;
var Container = components.Container,
Label = components.Label,
Remove = components.Remove;
return react.jsx(react.ClassNames, null, function (_ref6) {
var css = _ref6.css,
emotionCx = _ref6.cx;
return react.jsx(Container, {
data: data,
innerProps: _objectSpread2({
className: emotionCx(css(getStyles('multiValue', props)), cx({
'multi-value': true,
'multi-value--is-disabled': isDisabled
}, className))
}, innerProps),
selectProps: selectProps
}, react.jsx(Label, {
data: data,
innerProps: {
className: emotionCx(css(getStyles('multiValueLabel', props)), cx({
'multi-value__label': true
}, className))
},
selectProps: selectProps
}, children), react.jsx(Remove, {
data: data,
innerProps: _objectSpread2({
className: emotionCx(css(getStyles('multiValueRemove', props)), cx({
'multi-value__remove': true
}, className))
}, removeProps),
selectProps: selectProps
}));
});
};
MultiValue.defaultProps = {
cropWithEllipsis: true
};
var optionCSS = function optionCSS(_ref) {
var isDisabled = _ref.isDisabled,
isFocused = _ref.isFocused,
isSelected = _ref.isSelected,
_ref$theme = _ref.theme,
spacing = _ref$theme.spacing,
colors = _ref$theme.colors;
return {
label: 'option',
backgroundColor: isSelected ? colors.primary : isFocused ? colors.primary25 : 'transparent',
color: isDisabled ? colors.neutral20 : isSelected ? colors.neutral0 : 'inherit',
cursor: 'default',
display: 'block',
fontSize: 'inherit',
padding: "".concat(spacing.baseUnit * 2, "px ").concat(spacing.baseUnit * 3, "px"),
width: '100%',
userSelect: 'none',
WebkitTapHighlightColor: 'rgba(0, 0, 0, 0)',
// provide some affordance on touch devices
':active': {
backgroundColor: !isDisabled && (isSelected ? colors.primary : colors.primary50)
}
};
};
var Option = function Option(props) {
var children = props.children,
className = props.className,
cx = props.cx,
getStyles = props.getStyles,
isDisabled = props.isDisabled,
isFocused = props.isFocused,
isSelected = props.isSelected,
innerRef = props.innerRef,
innerProps = props.innerProps;
return react.jsx("div", _extends__default['default']({
css: getStyles('option', props),
className: cx({
option: true,
'option--is-disabled': isDisabled,
'option--is-focused': isFocused,
'option--is-selected': isSelected
}, className),
ref: innerRef
}, innerProps), children);
};
var placeholderCSS = function placeholderCSS(_ref) {
var _ref$theme = _ref.theme,
spacing = _ref$theme.spacing,
colors = _ref$theme.colors;
return {
label: 'placeholder',
color: colors.neutral50,
marginLeft: spacing.baseUnit / 2,
marginRight: spacing.baseUnit / 2,
position: 'absolute',
top: '50%',
transform: 'translateY(-50%)'
};
};
var Placeholder = function Placeholder(props) {
var children = props.children,
className = props.className,
cx = props.cx,
getStyles = props.getStyles,
innerProps = props.innerProps;
return react.jsx("div", _extends__default['default']({
css: getStyles('placeholder', props),
className: cx({
placeholder: true
}, className)
}, innerProps), children);
};
var css$1 = function css(_ref) {
var isDisabled = _ref.isDisabled,
_ref$theme = _ref.theme,
spacing = _ref$theme.spacing,
colors = _ref$theme.colors;
return {
label: 'singleValue',
color: isDisabled ? colors.neutral40 : colors.neutral80,
marginLeft: spacing.baseUnit / 2,
marginRight: spacing.baseUnit / 2,
maxWidth: "calc(100% - ".concat(spacing.baseUnit * 2, "px)"),
overflow: 'hidden',
position: 'absolute',
textOverflow: 'ellipsis',
whiteSpace: 'nowrap',
top: '50%',
transform: 'translateY(-50%)'
};
};
var SingleValue = function SingleValue(props) {
var children = props.children,
className = props.className,
cx = props.cx,
getStyles = props.getStyles,
isDisabled = props.isDisabled,
innerProps = props.innerProps;
return react.jsx("div", _extends__default['default']({
css: getStyles('singleValue', props),
className: cx({
'single-value': true,
'single-value--is-disabled': isDisabled
}, className)
}, innerProps), children);
};
var components = {
ClearIndicator: ClearIndicator,
Control: Control,
DropdownIndicator: DropdownIndicator,
DownChevron: DownChevron,
CrossIcon: CrossIcon,
Group: Group,
GroupHeading: GroupHeading,
IndicatorsContainer: IndicatorsContainer,
IndicatorSeparator: IndicatorSeparator,
Input: Input,
LoadingIndicator: LoadingIndicator,
Menu: Menu,
MenuList: MenuList,
MenuPortal: MenuPortal,
LoadingMessage: LoadingMessage,
NoOptionsMessage: NoOptionsMessage,
MultiValue: MultiValue,
MultiValueContainer: MultiValueContainer,
MultiValueLabel: MultiValueLabel,
MultiValueRemove: MultiValueRemove,
Option: Option,
Placeholder: Placeholder,
SelectContainer: SelectContainer,
SingleValue: SingleValue,
ValueContainer: ValueContainer
};
var defaultComponents = function defaultComponents(props) {
return _objectSpread2(_objectSpread2({}, components), props.components);
};
exports.MenuPlacer = MenuPlacer;
exports._createSuper = _createSuper;
exports._objectSpread2 = _objectSpread2;
exports.classNames = classNames;
exports.cleanValue = cleanValue;
exports.clearIndicatorCSS = clearIndicatorCSS;
exports.components = components;
exports.containerCSS = containerCSS;
exports.css = css;
exports.css$1 = css$1;
exports.defaultComponents = defaultComponents;
exports.dropdownIndicatorCSS = dropdownIndicatorCSS;
exports.groupCSS = groupCSS;
exports.groupHeadingCSS = groupHeadingCSS;
exports.handleInputChange = handleInputChange;
exports.indicatorSeparatorCSS = indicatorSeparatorCSS;
exports.indicatorsContainerCSS = indicatorsContainerCSS;
exports.inputCSS = inputCSS;
exports.isDocumentElement = isDocumentElement;
exports.isMobileDevice = isMobileDevice;
exports.isTouchCapable = isTouchCapable;
exports.loadingIndicatorCSS = loadingIndicatorCSS;
exports.loadingMessageCSS = loadingMessageCSS;
exports.menuCSS = menuCSS;
exports.menuListCSS = menuListCSS;
exports.menuPortalCSS = menuPortalCSS;
exports.multiValueCSS = multiValueCSS;
exports.multiValueLabelCSS = multiValueLabelCSS;
exports.multiValueRemoveCSS = multiValueRemoveCSS;
exports.noOptionsMessageCSS = noOptionsMessageCSS;
exports.noop = noop;
exports.optionCSS = optionCSS;
exports.placeholderCSS = placeholderCSS;
exports.scrollIntoView = scrollIntoView;
exports.supportsPassiveEvents = supportsPassiveEvents;
exports.valueContainerCSS = valueContainerCSS;