"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.EuiSelect = void 0; var _react = _interopRequireDefault(require("react")); var _propTypes = _interopRequireDefault(require("prop-types")); var _classnames = _interopRequireDefault(require("classnames")); var _form_control_layout = require("../form_control_layout"); var _validatable_control = require("../validatable_control"); var _eui_form_context = require("../eui_form_context"); var _num_icons = require("../form_control_layout/_num_icons"); var _react2 = require("@emotion/react"); var _excluded = ["className", "options", "id", "name", "inputRef", "isInvalid", "fullWidth", "isLoading", "hasNoInitialSelection", "defaultValue", "compressed", "value", "prepend", "append", "onMouseUp", "disabled"], _excluded2 = ["text"]; /* * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one * or more contributor license agreements. Licensed under the Elastic License * 2.0 and the Server Side Public License, v 1; you may not use this file except * in compliance with, at your election, the Elastic License 2.0 or the Server * Side Public License, v 1. */ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); } function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; } function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; } var EuiSelect = function EuiSelect(props) { var _useFormContext = (0, _eui_form_context.useFormContext)(), defaultFullWidth = _useFormContext.defaultFullWidth; var className = props.className, _props$options = props.options, options = _props$options === void 0 ? [] : _props$options, id = props.id, name = props.name, inputRef = props.inputRef, isInvalid = props.isInvalid, _props$fullWidth = props.fullWidth, fullWidth = _props$fullWidth === void 0 ? defaultFullWidth : _props$fullWidth, _props$isLoading = props.isLoading, isLoading = _props$isLoading === void 0 ? false : _props$isLoading, _props$hasNoInitialSe = props.hasNoInitialSelection, hasNoInitialSelection = _props$hasNoInitialSe === void 0 ? false : _props$hasNoInitialSe, defaultValue = props.defaultValue, _props$compressed = props.compressed, compressed = _props$compressed === void 0 ? false : _props$compressed, _value = props.value, prepend = props.prepend, append = props.append, onMouseUp = props.onMouseUp, disabled = props.disabled, rest = _objectWithoutProperties(props, _excluded); // if this is injecting an empty option for `hasNoInitialSelection` then // value needs to fallback to an empty string to interact properly with `defaultValue` var value = hasNoInitialSelection ? _value !== null && _value !== void 0 ? _value : '' : _value; var handleMouseUp = function handleMouseUp(e) { // Normalizes cross-browser mouse eventing by preventing propagation, // notably for use in conjunction with EuiOutsideClickDetector. // See https://github.com/elastic/eui/pull/1926 for full discussion on // rationale and alternatives should this intervention become problematic. e.nativeEvent.stopImmediatePropagation(); if (onMouseUp) onMouseUp(e); }; var numIconsClass = (0, _num_icons.getFormControlClassNameForIconCount)({ isInvalid: isInvalid, isLoading: isLoading, isDropdown: true }); var classes = (0, _classnames.default)('euiSelect', numIconsClass, { 'euiSelect--fullWidth': fullWidth, 'euiSelect--compressed': compressed, 'euiSelect--inGroup': prepend || append, 'euiSelect-isLoading': isLoading }, className); var emptyOptionNode; if (hasNoInitialSelection) { emptyOptionNode = (0, _react2.jsx)("option", { value: "", disabled: true, hidden: true, style: { display: 'none' } }, "\xA0"); } // React HTML input can not have both value and defaultValue properties. // https://reactjs.org/docs/uncontrolled-components.html#default-values var selectDefaultValue; if (value == null) { selectDefaultValue = defaultValue || ''; } return (0, _react2.jsx)(_form_control_layout.EuiFormControlLayout, { isDropdown: true, fullWidth: fullWidth, isLoading: isLoading, isInvalid: isInvalid, isDisabled: disabled, compressed: compressed, prepend: prepend, append: append, inputId: id }, (0, _react2.jsx)(_validatable_control.EuiValidatableControl, { isInvalid: isInvalid }, (0, _react2.jsx)("select", _extends({ id: id, name: name, className: classes, ref: inputRef, defaultValue: selectDefaultValue, value: value, onMouseUp: handleMouseUp, disabled: disabled }, rest), emptyOptionNode, options.map(function (option, index) { var text = option.text, rest = _objectWithoutProperties(option, _excluded2); return (0, _react2.jsx)("option", _extends({}, rest, { key: index }), text); })))); }; exports.EuiSelect = EuiSelect; EuiSelect.propTypes = { className: _propTypes.default.string, "aria-label": _propTypes.default.string, "data-test-subj": _propTypes.default.string, css: _propTypes.default.any, /** * @default [] */ options: _propTypes.default.arrayOf(_propTypes.default.shape({ text: _propTypes.default.node.isRequired }).isRequired), isInvalid: _propTypes.default.bool, /** * Expand to fill 100% of the parent. * Defaults to `fullWidth` prop of ``. * @default false */ fullWidth: _propTypes.default.bool, isLoading: _propTypes.default.bool, /** * Simulates no selection by creating an empty, selected, hidden first option * @default false */ hasNoInitialSelection: _propTypes.default.bool, inputRef: _propTypes.default.any, value: _propTypes.default.oneOfType([_propTypes.default.string.isRequired, _propTypes.default.number.isRequired]), /** * when `true` creates a shorter height input * @default false */ compressed: _propTypes.default.bool, /** * Creates an input group with element(s) coming before select. * `string` | `ReactElement` or an array of these */ prepend: _propTypes.default.oneOfType([_propTypes.default.oneOfType([_propTypes.default.string.isRequired, _propTypes.default.element.isRequired]).isRequired, _propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.string.isRequired, _propTypes.default.element.isRequired]).isRequired).isRequired]), /** * Creates an input group with element(s) coming after select. * `string` | `ReactElement` or an array of these */ append: _propTypes.default.oneOfType([_propTypes.default.oneOfType([_propTypes.default.string.isRequired, _propTypes.default.element.isRequired]).isRequired, _propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.string.isRequired, _propTypes.default.element.isRequired]).isRequired).isRequired]) };