@wulperstudio/cms/node/components/AutocompleteSimplev2/AutocompleteSimplev2.js

Wulper Studio Library Components CMS

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = void 0;
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
var _react = _interopRequireDefault(require("react"));
var _material = require("@mui/material");
var _base = require("../../base");
var _jsxRuntime = require("react/jsx-runtime");
var _excluded = ["variant", "size", "error", "errorMessage", "label", "backgroundColor", "textFieldProps", "onChange", "boxProps", "wrapperInputProps", "helperNode", "renderOption", "errorVariant"];
var RenderOption = function RenderOption(_props, option) {
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Typography, Object.assign({}, _props, {
    sx: {
      pl: 8
    },
    noWrap: true,
    children: [(0, _typeof2["default"])(option) === 'object' && option !== null && (option.id !== '' ? option.name : ''), typeof option === 'string' && option]
  }));
};
var AutocompleteSimpleV2 = function AutocompleteSimpleV2(_ref) {
  var _ref$variant = _ref.variant,
    variant = _ref$variant === void 0 ? 'divider' : _ref$variant,
    size = _ref.size,
    error = _ref.error,
    errorMessage = _ref.errorMessage,
    label = _ref.label,
    backgroundColor = _ref.backgroundColor,
    textFieldProps = _ref.textFieldProps,
    _onChange = _ref.onChange,
    boxProps = _ref.boxProps,
    wrapperInputProps = _ref.wrapperInputProps,
    helperNode = _ref.helperNode,
    renderOption = _ref.renderOption,
    errorVariant = _ref.errorVariant,
    props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
  var _React$useState = _react["default"].useState(false),
    _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
    onFocusInput = _React$useState2[0],
    setOnFocusInput = _React$useState2[1];
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, Object.assign({}, boxProps, {
    children: [label && variant === 'labelOut' && /*#__PURE__*/(0, _jsxRuntime.jsx)(_base.InputLabel, {
      variant: variant,
      htmlFor: props.id,
      focused: onFocusInput,
      children: label
    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_base.WrapperInputVariant, Object.assign({
      variant: variant,
      error: error,
      size: size,
      backgroundColor: backgroundColor
    }, wrapperInputProps, {
      children: [label && variant !== 'labelOut' && /*#__PURE__*/(0, _jsxRuntime.jsx)(_base.InputLabel, {
        variant: variant,
        htmlFor: props.id,
        focused: onFocusInput,
        children: label
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Autocomplete, Object.assign({
        disableListWrap: true,
        fullWidth: true,
        renderInput: function renderInput(params) {
          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_base.BaseInputVariant, Object.assign({}, params, textFieldProps, {
            variant: variant,
            onFocus: function onFocus(e) {
              var _textFieldProps$onFoc;
              setOnFocusInput(true);
              textFieldProps == null || (_textFieldProps$onFoc = textFieldProps.onFocus) == null || _textFieldProps$onFoc.call(textFieldProps, e);
            },
            onBlur: function onBlur(e) {
              var _textFieldProps$onBlu;
              setOnFocusInput(false);
              textFieldProps == null || (_textFieldProps$onBlu = textFieldProps.onBlur) == null || _textFieldProps$onBlu.call(textFieldProps, e);
            },
            placeholder: (textFieldProps == null ? void 0 : textFieldProps.placeholder) || 'Select option'
          }));
        },
        getOptionLabel: function getOptionLabel(option) {
          if ((0, _typeof2["default"])(option) === 'object' && option !== null) {
            return option.id !== '' ? option.name : '';
          }
          return option;
        },
        isOptionEqualToValue: function isOptionEqualToValue(option, value) {
          if ((0, _typeof2["default"])(option) === 'object' && option !== null) {
            return option.id === value.id;
          }
          return option === value;
        },
        onChange: function onChange(event, val) {
          if (_onChange) _onChange(event, val);
        }
      }, props, {
        renderOption: renderOption || RenderOption
      }))]
    })), helperNode, error && /*#__PURE__*/(0, _jsxRuntime.jsx)(_base.ErrorAlert, {
      variant: errorVariant,
      children: errorMessage
    })]
  }));
};
var _default = exports["default"] = AutocompleteSimpleV2;