box-ui-elements
Version:
Box UI Elements
72 lines • 3.21 kB
JavaScript
const _excluded = ["children", "className", "error", "infoTooltip", "infoIconProps", "isDisabled", "label", "name", "labelTooltip", "onChange", "showErrorOutline", "showLabel"];
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
import * as React from 'react';
import classNames from 'classnames';
import { FormattedMessage } from 'react-intl';
import IconInfo from '../../icons/general/IconInfo';
import Tooltip from '../tooltip';
import Label from '../label';
import PlainButton from '../plain-button';
import messages from './messages';
import './Select.scss';
const Select = _ref => {
let {
children,
className = '',
error,
infoTooltip,
infoIconProps,
isDisabled,
label,
name,
labelTooltip,
onChange,
showErrorOutline = false,
showLabel = true
} = _ref,
rest = _objectWithoutProperties(_ref, _excluded);
const classes = classNames(className, 'select-input-container', {
'show-error': !!error || showErrorOutline,
'is-disabled': isDisabled,
'bdl-is-disabled': isDisabled
});
const [infoTooltipIsOpen, setInfoTooltipIsOpen] = React.useState(false);
return /*#__PURE__*/React.createElement("div", {
className: classes
}, /*#__PURE__*/React.createElement(Label, {
hideLabel: !showLabel,
text: label,
tooltip: labelTooltip
}, /*#__PURE__*/React.createElement(Tooltip, {
isShown: !!error,
position: "middle-right",
text: error || '',
theme: "error"
}, /*#__PURE__*/React.createElement("span", {
className: "select-container"
}, /*#__PURE__*/React.createElement("span", {
className: "select-container-inner"
}, /*#__PURE__*/React.createElement("select", _extends({
disabled: isDisabled,
name: name,
onChange: onChange
}, rest), children), /*#__PURE__*/React.createElement("span", {
className: "select-overlay"
})), infoTooltip && /*#__PURE__*/React.createElement(Tooltip, {
isShown: infoTooltipIsOpen,
position: "middle-right",
text: infoTooltip
}, /*#__PURE__*/React.createElement(PlainButton, {
type: "button",
className: "tooltip-icon-container",
onClick: () => setInfoTooltipIsOpen(!infoTooltipIsOpen)
}, /*#__PURE__*/React.createElement(IconInfo, _extends({
height: 16,
width: 16,
title: /*#__PURE__*/React.createElement(FormattedMessage, messages.moreInfo)
}, infoIconProps))))))));
};
export default Select;
//# sourceMappingURL=Select.js.map