@bigbinary/neetoui/dist/formik/Select.js

neetoUI drives the experience at all neeto products

import _extends from '@babel/runtime/helpers/extends';
import _typeof from '@babel/runtime/helpers/typeof';
import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
import React__default, { forwardRef, useRef, startTransition } from 'react';
import { useField, useFormikContext, getIn } from 'formik';
import { existsBy } from '@bigbinary/neeto-cist';
import { prop, either, isNil, isEmpty, dissoc, flatten, pluck } from 'ramda';
import Select from '../Select.js';
import '@babel/runtime/helpers/defineProperty';
import 'classnames';
import '@bigbinary/neeto-icons';
import '../react-select-creatable.esm-Dx_vEnyD.js';
import '@babel/runtime/helpers/esm/extends';
import '@babel/runtime/helpers/esm/objectSpread2';
import '@babel/runtime/helpers/esm/classCallCheck';
import '@babel/runtime/helpers/esm/createClass';
import '@babel/runtime/helpers/esm/inherits';
import '@babel/runtime/helpers/esm/createSuper';
import '@babel/runtime/helpers/esm/toConsumableArray';
import '@babel/runtime/helpers/esm/taggedTemplateLiteral';
import '@babel/runtime/helpers/esm/objectWithoutProperties';
import '@babel/runtime/helpers/esm/slicedToArray';
import '@babel/runtime/helpers/esm/typeof';
import '@babel/runtime/helpers/esm/defineProperty';
import 'react-dom';
import '@babel/runtime/helpers/objectSpread2';
import '@babel/runtime/helpers/classCallCheck';
import '@babel/runtime/helpers/createClass';
import '@babel/runtime/helpers/inherits';
import '@babel/runtime/helpers/createSuper';
import '@babel/runtime/helpers/toConsumableArray';
import '@babel/runtime/helpers/taggedTemplateLiteral';
import '../useId-Jj9hXm-g.js';
import 'react-router-dom';
import '@bigbinary/neeto-hotkeys';
import '../overlayManager.js';
import '../index-Dxaw6gl9.js';
import 'qs';
import '../en-CIkXIYyl.js';
import 'dayjs';
import 'dayjs/plugin/localeData';
import 'dayjs/plugin/utc';
import 'dayjs/plugin/weekday';
import 'dayjs/plugin/weekOfYear';
import '../Label.js';
import '../Button.js';
import '../Spinner.js';
import '../Tooltip.js';
import '@tippyjs/react';
import 'tippy.js';
import '../Popover.js';
import '../Typography.js';

var _excluded = ["name", "options", "getOptionValue", "isMulti"];
var SelectField = /*#__PURE__*/forwardRef(function (props, ref) {
  var _props$name = props.name,
    name = _props$name === void 0 ? "" : _props$name,
    _props$options = props.options,
    options = _props$options === void 0 ? [] : _props$options,
    _props$getOptionValue = props.getOptionValue,
    getOptionValue = _props$getOptionValue === void 0 ? null : _props$getOptionValue,
    _props$isMulti = props.isMulti,
    isMulti = _props$isMulti === void 0 ? false : _props$isMulti,
    otherProps = _objectWithoutProperties(props, _excluded);
  var _useField = useField(name),
    _useField2 = _slicedToArray(_useField, 3),
    field = _useField2[0],
    meta = _useField2[1],
    _useField2$ = _useField2[2],
    setValue = _useField2$.setValue,
    setTouched = _useField2$.setTouched;
  var _useFormikContext = useFormikContext(),
    _useFormikContext$sta = _useFormikContext.status,
    status = _useFormikContext$sta === void 0 ? {} : _useFormikContext$sta,
    setStatus = _useFormikContext.setStatus;
  var fieldStatus = getIn(status, name);
  var isMenuOpen = useRef(otherProps.defaultMenuIsOpen);
  var getRealOptionValue = function getRealOptionValue(option) {
    if (typeof getOptionValue !== "function") {
      return option.value;
    }
    return getOptionValue(option);
  };
  var buildValueObj = function buildValueObj(value, options) {
    if (_typeof(value) === "object") return value;
    var isGrouped = existsBy({
      options: Array.isArray
    }, options);
    var searchOptions = options;
    if (isGrouped) {
      searchOptions = flatten(pluck("options", options));
    }
    return searchOptions.filter(function (option) {
      return getRealOptionValue(option) === value;
    })[0];
  };
  return /*#__PURE__*/React__default.createElement(Select, _extends({
    options: options,
    error: meta.touched ? meta.error || fieldStatus : "",
    getOptionValue: getOptionValue || prop("value"),
    innerRef: ref,
    isMulti: !!isMulti,
    name: field.name,
    value: either(isNil, isEmpty)(field.value) ? null : buildValueObj(field.value, options),
    onBlur: function onBlur() {
      return startTransition(function () {
        setTouched(true);
      });
    },
    onChange: function onChange(value) {
      setStatus(dissoc(name, status));
      setValue(value);
    }
  }, otherProps, {
    onKeyDown: function onKeyDown(event) {
      var _otherProps$onKeyDown;
      if (event.key === "Enter" && isMenuOpen.current) {
        event.stopPropagation();
      }
      (_otherProps$onKeyDown = otherProps.onKeyDown) === null || _otherProps$onKeyDown === void 0 || _otherProps$onKeyDown.call(otherProps, event);
    },
    onMenuClose: function onMenuClose() {
      var _otherProps$onMenuClo;
      isMenuOpen.current = false;
      (_otherProps$onMenuClo = otherProps.onMenuClose) === null || _otherProps$onMenuClo === void 0 || _otherProps$onMenuClo.call(otherProps);
    },
    onMenuOpen: function onMenuOpen() {
      var _otherProps$onMenuOpe;
      isMenuOpen.current = true;
      (_otherProps$onMenuOpe = otherProps.onMenuOpen) === null || _otherProps$onMenuOpe === void 0 || _otherProps$onMenuOpe.call(otherProps);
    }
  }));
});
SelectField.displayName = "SelectField";

export { SelectField as default };
//# sourceMappingURL=Select.js.map