@wulperstudio/cms
Version:
Wulper Studio Library Components CMS
98 lines • 4.27 kB
JavaScript
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
import _typeof from "@babel/runtime/helpers/esm/typeof";
var _excluded = ["variant", "size", "error", "errorMessage", "label", "backgroundColor", "textFieldProps", "onChange", "boxProps", "wrapperInputProps", "helperNode", "renderOption", "errorVariant"];
import React from 'react';
import { Autocomplete, Box, Typography } from '@mui/material';
import { BaseInputVariant, ErrorAlert, InputLabel, WrapperInputVariant } from '../../base';
import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
var RenderOption = function RenderOption(_props, option) {
return /*#__PURE__*/_jsxs(Typography, Object.assign({}, _props, {
sx: {
pl: 8
},
noWrap: true,
children: [_typeof(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 = _objectWithoutProperties(_ref, _excluded);
var _React$useState = React.useState(false),
_React$useState2 = _slicedToArray(_React$useState, 2),
onFocusInput = _React$useState2[0],
setOnFocusInput = _React$useState2[1];
return /*#__PURE__*/_jsxs(Box, Object.assign({}, boxProps, {
children: [label && variant === 'labelOut' && /*#__PURE__*/_jsx(InputLabel, {
variant: variant,
htmlFor: props.id,
focused: onFocusInput,
children: label
}), /*#__PURE__*/_jsxs(WrapperInputVariant, Object.assign({
variant: variant,
error: error,
size: size,
backgroundColor: backgroundColor
}, wrapperInputProps, {
children: [label && variant !== 'labelOut' && /*#__PURE__*/_jsx(InputLabel, {
variant: variant,
htmlFor: props.id,
focused: onFocusInput,
children: label
}), /*#__PURE__*/_jsx(Autocomplete, Object.assign({
disableListWrap: true,
fullWidth: true,
renderInput: function renderInput(params) {
return /*#__PURE__*/_jsx(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 (_typeof(option) === 'object' && option !== null) {
return option.id !== '' ? option.name : '';
}
return option;
},
isOptionEqualToValue: function isOptionEqualToValue(option, value) {
if (_typeof(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__*/_jsx(ErrorAlert, {
variant: errorVariant,
children: errorMessage
})]
}));
};
export default AutocompleteSimpleV2;