@widergy/energy-ui 3.172.3 → 3.173.0

package/dist/esm/deprecated/UTAutocomplete/index.js

@@ -1 +1,128 @@
-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)}import React,{useState,useMemo,useEffect}from"react";import{object,bool,elementType,objectOf,string,arrayOf}from"prop-types";import{isEmpty}from"@widergy/web-utils/lib/array";import TextField from"@material-ui/core/TextField";import Autocomplete from"@material-ui/lab/Autocomplete";import KeyboardArrowDownIcon from"@material-ui/icons/KeyboardArrowDown";import CircularProgress from"@material-ui/core/CircularProgress";import{shouldShowErrors}from"@widergy/web-utils/lib/form";import{inputPropTypes,metaPropTypes,fieldType}from"../../types/formTypes";import UTLabel from"../../components/UTLabel";import WithTheme from"../../components/WithTheme";import{retrieveStyle,retrieveMuiTheme}from"./theme";import Listbox from"./components/ListBox";import{INVALID_OPTION,ERROR_EMPTY_OPTIONS,CLEAR_TEXT,CLOSE_TEXT,OPEN_TEXT,DEFAULT_VALUE_KEY,DEFAULT_LABEL_KEY}from"./constants";const UTAutocomplete=_ref=>{let{ArrowIcon:ArrowIcon,autocompleteProps:autocompleteProps,classes:classes={},dataTestId:dataTestId,disabled:disabled,field:field,fixedSizeListProps:fixedSizeListProps,input:input,label:label,loading:loading,meta:meta,options:options,placeholder:placeholder,textFieldProps:textFieldProps,variant:variant}=_ref;const{field_options_value_key:valueKey=DEFAULT_VALUE_KEY,field_options_label_key:labelKey=DEFAULT_LABEL_KEY,field_options_no_results_message:noOptionsMessage=INVALID_OPTION,field_options_empty_message:emptyOptionsLabel=ERROR_EMPTY_OPTIONS,multiple:multiple=!1}=field.configuration||{},initialValue=useMemo(()=>multiple?[]:"",[multiple]),[componentValue,setComponentValue]=useState(initialValue),textInputLabel=isEmpty(options)?emptyOptionsLabel:label,fieldDisabled=disabled||loading||isEmpty(options);useEffect(()=>{setComponentValue(input.value&&!isEmpty(options)?multiple?options.filter(option=>input.value.some(inputValue=>inputValue===option[valueKey])):options.find(option=>option[valueKey]===input.value):multiple?[]:"")},[input.value]),useEffect(()=>{if(isEmpty(options)||(multiple?isEmpty(input.value):!input.value))(multiple&&!isEmpty(componentValue)||componentValue)&&(input.onChange(initialValue),setComponentValue(initialValue));else{const newInputValue=multiple?input.value.filter(inputValue=>options.some(option=>inputValue===option[valueKey])):options.some(option=>option[valueKey]===input.value)?input.value:"";input.onChange(newInputValue);const updatedValue=multiple?options.filter(option=>newInputValue.some(inputValue=>inputValue===option[valueKey])):options.find(option=>option[valueKey]===newInputValue);setComponentValue(updatedValue)}},[options]);const textInputEndAdornment=loading?React.createElement(CircularProgress,{className:classes.loadingIcon}):ArrowIcon||React.createElement(KeyboardArrowDownIcon,{className:"".concat(disabled?classes.arrowIconDisabled:classes.arrowIcon)}),errorMessage=shouldShowErrors(meta)&&meta.error||"";return React.createElement(Autocomplete,_extends({clearText:CLEAR_TEXT,closeText:CLOSE_TEXT,disabled:fieldDisabled,getOptionLabel:option=>option[labelKey]||"",id:field.key,ListboxComponent:Listbox,ListboxProps:{fixedSizeListProps:fixedSizeListProps},multiple:multiple,noOptionsText:noOptionsMessage,onChange:(_,values)=>{input.onChange(multiple?null==values?void 0:values.map(val=>val[valueKey]):null==values?void 0:values[valueKey]),values||setComponentValue(initialValue),field.onChange&&field.onChange(values)},openText:OPEN_TEXT,options:options,popupIcon:textInputEndAdornment,value:componentValue,renderInput:params=>React.createElement(TextField,_extends({},params,{label:textInputLabel,fullWidth:!0,error:shouldShowErrors(meta),InputProps:{...params.InputProps,inputProps:{...params.inputProps,"data-keyboard":null!=input&&input.name?"autocomplete-".concat(input.name):null,"data-testid":dataTestId}},helperText:errorMessage?React.createElement(UTLabel,{className:classes.errorLabel,colorTheme:"error",variant:"small"},errorMessage):void 0,placeholder:placeholder,variant:variant},textFieldProps))},autocompleteProps))};UTAutocomplete.propTypes={ArrowIcon:elementType,autocompleteProps:object,classes:objectOf(string),dataTestId:string,disabled:bool,input:inputPropTypes.isRequired,field:fieldType,fixedSizeListProps:object,label:string,loading:bool,meta:metaPropTypes.isRequired,options:arrayOf(object),placeholder:string,textFieldProps:object,variant:string};export default WithTheme(retrieveStyle,retrieveMuiTheme)(UTAutocomplete);
+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); }
+import React, { useState, useMemo, useEffect } from 'react';
+import { object, bool, elementType, objectOf, string, arrayOf } from 'prop-types';
+import { isEmpty } from '@widergy/web-utils/lib/array';
+import TextField from '@material-ui/core/TextField';
+import Autocomplete from '@material-ui/lab/Autocomplete';
+import KeyboardArrowDownIcon from '@material-ui/icons/KeyboardArrowDown';
+import CircularProgress from '@material-ui/core/CircularProgress';
+import { shouldShowErrors } from '@widergy/web-utils/lib/form';
+import { inputPropTypes, metaPropTypes, fieldType } from '../../types/formTypes';
+import UTLabel from '../../components/UTLabel';
+import WithTheme from '../../components/WithTheme';
+import { retrieveStyle, retrieveMuiTheme } from './theme';
+import Listbox from './components/ListBox';
+import { INVALID_OPTION, ERROR_EMPTY_OPTIONS, CLEAR_TEXT, CLOSE_TEXT, OPEN_TEXT, DEFAULT_VALUE_KEY, DEFAULT_LABEL_KEY } from './constants';
+const UTAutocomplete = _ref => {
+  let {
+    ArrowIcon,
+    autocompleteProps,
+    classes = {},
+    dataTestId,
+    disabled,
+    field,
+    fixedSizeListProps,
+    input,
+    label,
+    loading,
+    meta,
+    options,
+    placeholder,
+    textFieldProps,
+    variant
+  } = _ref;
+  const {
+    field_options_value_key: valueKey = DEFAULT_VALUE_KEY,
+    field_options_label_key: labelKey = DEFAULT_LABEL_KEY,
+    field_options_no_results_message: noOptionsMessage = INVALID_OPTION,
+    field_options_empty_message: emptyOptionsLabel = ERROR_EMPTY_OPTIONS,
+    multiple = false
+  } = field.configuration || {};
+  const initialValue = useMemo(() => multiple ? [] : '', [multiple]);
+  const [componentValue, setComponentValue] = useState(initialValue);
+  const textInputLabel = isEmpty(options) ? emptyOptionsLabel : label;
+  const fieldDisabled = disabled || loading || isEmpty(options);
+  const onChange = (_, values) => {
+    input.onChange(multiple ? values === null || values === void 0 ? void 0 : values.map(val => val[valueKey]) : values === null || values === void 0 ? void 0 : values[valueKey]);
+    if (!values) setComponentValue(initialValue);
+    if (field.onChange) field.onChange(values);
+  };
+  useEffect(() => {
+    setComponentValue(input.value && !isEmpty(options) ? multiple ? options.filter(option => input.value.some(inputValue => inputValue === option[valueKey])) : options.find(option => option[valueKey] === input.value) : multiple ? [] : '');
+  }, [input.value]);
+  useEffect(() => {
+    if (isEmpty(options) || (multiple ? isEmpty(input.value) : !input.value)) {
+      if (multiple && !isEmpty(componentValue) || componentValue) {
+        input.onChange(initialValue);
+        setComponentValue(initialValue);
+      }
+    } else {
+      const newInputValue = multiple ? input.value.filter(inputValue => options.some(option => inputValue === option[valueKey])) : options.some(option => option[valueKey] === input.value) ? input.value : '';
+      input.onChange(newInputValue);
+      const updatedValue = multiple ? options.filter(option => newInputValue.some(inputValue => inputValue === option[valueKey])) : options.find(option => option[valueKey] === newInputValue);
+      setComponentValue(updatedValue);
+    }
+  }, [options]);
+  const textInputEndAdornment = loading ? /*#__PURE__*/React.createElement(CircularProgress, {
+    className: classes.loadingIcon
+  }) : ArrowIcon || /*#__PURE__*/React.createElement(KeyboardArrowDownIcon, {
+    className: "".concat(disabled ? classes.arrowIconDisabled : classes.arrowIcon)
+  });
+  const errorMessage = shouldShowErrors(meta) && meta.error || '';
+  return /*#__PURE__*/React.createElement(Autocomplete, _extends({
+    clearText: CLEAR_TEXT,
+    closeText: CLOSE_TEXT,
+    disabled: fieldDisabled,
+    getOptionLabel: option => option[labelKey] || '',
+    id: field.key,
+    ListboxComponent: Listbox,
+    ListboxProps: {
+      fixedSizeListProps
+    },
+    multiple: multiple,
+    noOptionsText: noOptionsMessage,
+    onChange: onChange,
+    openText: OPEN_TEXT,
+    options: options,
+    popupIcon: textInputEndAdornment,
+    value: componentValue,
+    renderInput: params => /*#__PURE__*/React.createElement(TextField, _extends({}, params, {
+      label: textInputLabel,
+      fullWidth: true,
+      error: shouldShowErrors(meta),
+      InputProps: {
+        ...params.InputProps,
+        inputProps: {
+          ...params.inputProps,
+          'data-keyboard': input !== null && input !== void 0 && input.name ? "autocomplete-".concat(input.name) : null,
+          'data-testid': dataTestId
+        }
+      },
+      helperText: errorMessage ? /*#__PURE__*/React.createElement(UTLabel, {
+        className: classes.errorLabel,
+        colorTheme: "error",
+        variant: "small"
+      }, errorMessage) : undefined,
+      placeholder: placeholder,
+      variant: variant
+    }, textFieldProps))
+  }, autocompleteProps));
+};
+UTAutocomplete.propTypes = {
+  ArrowIcon: elementType,
+  autocompleteProps: object,
+  classes: objectOf(string),
+  dataTestId: string,
+  disabled: bool,
+  input: inputPropTypes.isRequired,
+  field: fieldType,
+  fixedSizeListProps: object,
+  label: string,
+  loading: bool,
+  meta: metaPropTypes.isRequired,
+  options: arrayOf(object),
+  placeholder: string,
+  textFieldProps: object,
+  variant: string
+};
+export default WithTheme(retrieveStyle, retrieveMuiTheme)(UTAutocomplete);

package/dist/esm/deprecated/UTAutocomplete/theme.js

@@ -1 +1,151 @@
-import{createTheme}from"@material-ui/core/styles";import merge from"lodash/merge";import Colors from"../../scss/variables/colors.module.scss";import{withImportant}from"../../utils/classesUtils";export const retrieveStyle=_ref=>{var _theme$UTAutocomplete,_theme$UTTextInput,_theme$UTAutocomplete2,_theme$UTTextInput2,_theme$UTAutocomplete3,_theme$UTTextInput3,_theme$UTAutocomplete4,_theme$UTAutocomplete5,_theme$UTAutocomplete6;let{theme:theme}=_ref;return{arrowIcon:{color:(null===(_theme$UTAutocomplete=theme.UTAutocomplete)||void 0===_theme$UTAutocomplete||null===(_theme$UTAutocomplete=_theme$UTAutocomplete.arrowIcon)||void 0===_theme$UTAutocomplete?void 0:_theme$UTAutocomplete.color)||(null===(_theme$UTTextInput=theme.UTTextInput)||void 0===_theme$UTTextInput?void 0:_theme$UTTextInput.color)},arrowIconDisabled:{color:(null===(_theme$UTAutocomplete2=theme.UTAutocomplete)||void 0===_theme$UTAutocomplete2||null===(_theme$UTAutocomplete2=_theme$UTAutocomplete2.arrowIconDisabled)||void 0===_theme$UTAutocomplete2?void 0:_theme$UTAutocomplete2.color)||(null===(_theme$UTTextInput2=theme.UTTextInput)||void 0===_theme$UTTextInput2?void 0:_theme$UTTextInput2.color)},loadingIcon:{color:(null===(_theme$UTAutocomplete3=theme.UTAutocomplete)||void 0===_theme$UTAutocomplete3||null===(_theme$UTAutocomplete3=_theme$UTAutocomplete3.loadingIcon)||void 0===_theme$UTAutocomplete3?void 0:_theme$UTAutocomplete3.color)||(null===(_theme$UTTextInput3=theme.UTTextInput)||void 0===_theme$UTTextInput3?void 0:_theme$UTTextInput3.color),height:withImportant((null===(_theme$UTAutocomplete4=theme.UTAutocomplete)||void 0===_theme$UTAutocomplete4||null===(_theme$UTAutocomplete4=_theme$UTAutocomplete4.loadingIcon)||void 0===_theme$UTAutocomplete4?void 0:_theme$UTAutocomplete4.height)||"20px"),margin:(null===(_theme$UTAutocomplete5=theme.UTAutocomplete)||void 0===_theme$UTAutocomplete5||null===(_theme$UTAutocomplete5=_theme$UTAutocomplete5.loadingIcon)||void 0===_theme$UTAutocomplete5?void 0:_theme$UTAutocomplete5.margin)||"0 10px 0 0",width:withImportant((null===(_theme$UTAutocomplete6=theme.UTAutocomplete)||void 0===_theme$UTAutocomplete6||null===(_theme$UTAutocomplete6=_theme$UTAutocomplete6.loadingIcon)||void 0===_theme$UTAutocomplete6?void 0:_theme$UTAutocomplete6.width)||"20px")}}};export const retrieveMuiTheme=(theme,muiTheme)=>{var _theme$Fonts,_theme$UTTextInput4,_theme$UTTextInput5,_theme$UTTextInput6,_theme$Fonts2,_theme$UTTextInput7,_theme$UTTextInput8,_theme$UTTextInput9,_theme$UTTextInput0,_theme$UTTextInput1,_theme$UTTextInput10,_theme$UTTextInput11,_theme$UTTextInput12,_theme$UTTextInput13,_theme$Fonts3,_theme$UTTextInput14,_theme$UTTextInput15,_theme$UTTextInput16,_theme$UTTextInput17,_theme$UTTextInput18,_theme$UTTextInput19,_theme$UTTextInput20,_theme$UTTextInput21,_theme$UTTextInput22,_theme$UTTextInput23,_theme$UTTextInput24,_theme$UTAutocomplete7,_theme$UTAutocomplete8,_theme$UTAutocomplete9,_theme$UTTextInput25,_theme$UTTextInput26,_theme$UTTextInput27,_theme$UTTextInput28,_theme$Fonts4,_theme$UTTextInput29,_theme$UTTextInput30,_theme$UTAutocomplete0,_theme$UTAutocomplete1,_theme$UTAutocomplete10,_theme$UTAutocomplete11,_theme$UTAutocomplete12,_theme$UTAutocomplete13,_theme$UTAutocomplete14,_theme$UTAutocomplete15,_theme$UTAutocomplete16,_theme$UTAutocomplete17;const mui={typography:{fontFamily:null===(_theme$Fonts=theme.Fonts)||void 0===_theme$Fonts?void 0:_theme$Fonts.fontFamily},overrides:{MuiInput:{input:{border:null===(_theme$UTTextInput4=theme.UTTextInput)||void 0===_theme$UTTextInput4?void 0:_theme$UTTextInput4.border,borderRadius:null===(_theme$UTTextInput5=theme.UTTextInput)||void 0===_theme$UTTextInput5?void 0:_theme$UTTextInput5.borderRadius,fontSize:(null===(_theme$UTTextInput6=theme.UTTextInput)||void 0===_theme$UTTextInput6?void 0:_theme$UTTextInput6.fontSize)||(null===(_theme$Fonts2=theme.Fonts)||void 0===_theme$Fonts2?void 0:_theme$Fonts2.medium)||14,color:null===(_theme$UTTextInput7=theme.UTTextInput)||void 0===_theme$UTTextInput7?void 0:_theme$UTTextInput7.color,padding:null===(_theme$UTTextInput8=theme.UTTextInput)||void 0===_theme$UTTextInput8?void 0:_theme$UTTextInput8.padding},underline:{"&:hover:not($disabled):not($focused):not($error):before":{borderBottom:(null===(_theme$UTTextInput9=theme.UTTextInput)||void 0===_theme$UTTextInput9||null===(_theme$UTTextInput9=_theme$UTTextInput9.underline)||void 0===_theme$UTTextInput9||null===(_theme$UTTextInput9=_theme$UTTextInput9.hover)||void 0===_theme$UTTextInput9?void 0:_theme$UTTextInput9.borderBottom)||"1px solid ".concat(Colors.gray)},"&:hover:not($disabled):before":{borderBottom:(null===(_theme$UTTextInput0=theme.UTTextInput)||void 0===_theme$UTTextInput0||null===(_theme$UTTextInput0=_theme$UTTextInput0.underline)||void 0===_theme$UTTextInput0||null===(_theme$UTTextInput0=_theme$UTTextInput0.hover)||void 0===_theme$UTTextInput0?void 0:_theme$UTTextInput0.borderBottom)||"1px solid ".concat(Colors.gray)},"&$disabled:before":{borderBottom:(null===(_theme$UTTextInput1=theme.UTTextInput)||void 0===_theme$UTTextInput1||null===(_theme$UTTextInput1=_theme$UTTextInput1.underline)||void 0===_theme$UTTextInput1||null===(_theme$UTTextInput1=_theme$UTTextInput1.disabled)||void 0===_theme$UTTextInput1?void 0:_theme$UTTextInput1.borderBottom)||"1px solid ".concat(Colors.gray)},"&:before":{borderBottom:(null===(_theme$UTTextInput10=theme.UTTextInput)||void 0===_theme$UTTextInput10||null===(_theme$UTTextInput10=_theme$UTTextInput10.underline)||void 0===_theme$UTTextInput10||null===(_theme$UTTextInput10=_theme$UTTextInput10.unfocused)||void 0===_theme$UTTextInput10?void 0:_theme$UTTextInput10.borderBottom)||"1px solid ".concat(Colors.gray)},"&$focused:after":{borderBottom:(null===(_theme$UTTextInput11=theme.UTTextInput)||void 0===_theme$UTTextInput11||null===(_theme$UTTextInput11=_theme$UTTextInput11.underline)||void 0===_theme$UTTextInput11||null===(_theme$UTTextInput11=_theme$UTTextInput11.focused)||void 0===_theme$UTTextInput11?void 0:_theme$UTTextInput11.borderBottom)||"2px solid ".concat(Colors.primary)},"&:after":{borderBottom:(null===(_theme$UTTextInput12=theme.UTTextInput)||void 0===_theme$UTTextInput12||null===(_theme$UTTextInput12=_theme$UTTextInput12.underline)||void 0===_theme$UTTextInput12||null===(_theme$UTTextInput12=_theme$UTTextInput12.base)||void 0===_theme$UTTextInput12?void 0:_theme$UTTextInput12.borderBottom)||"2px solid ".concat(Colors.primary)},"&$error:after":{borderBottom:"2px solid ".concat(theme.Palette.error["05"]),borderBottomColor:theme.Palette.error["05"]}}},MuiOutlinedInput:{input:{fontSize:(null===(_theme$UTTextInput13=theme.UTTextInput)||void 0===_theme$UTTextInput13?void 0:_theme$UTTextInput13.fontSize)||(null===(_theme$Fonts3=theme.Fonts)||void 0===_theme$Fonts3?void 0:_theme$Fonts3.medium)||14,color:null===(_theme$UTTextInput14=theme.UTTextInput)||void 0===_theme$UTTextInput14?void 0:_theme$UTTextInput14.color},root:{"&:hover:not($disabled):not($focused):not($error) $notchedOutline":{border:(null===(_theme$UTTextInput15=theme.UTTextInput)||void 0===_theme$UTTextInput15||null===(_theme$UTTextInput15=_theme$UTTextInput15.notchedOutline)||void 0===_theme$UTTextInput15||null===(_theme$UTTextInput15=_theme$UTTextInput15.hover)||void 0===_theme$UTTextInput15?void 0:_theme$UTTextInput15.border)||"1px solid ".concat(Colors.gray),borderColor:null===(_theme$UTTextInput16=theme.UTTextInput)||void 0===_theme$UTTextInput16||null===(_theme$UTTextInput16=_theme$UTTextInput16.notchedOutline)||void 0===_theme$UTTextInput16||null===(_theme$UTTextInput16=_theme$UTTextInput16.hover)||void 0===_theme$UTTextInput16?void 0:_theme$UTTextInput16.borderColor},"&$focused $notchedOutline":{border:(null===(_theme$UTTextInput17=theme.UTTextInput)||void 0===_theme$UTTextInput17||null===(_theme$UTTextInput17=_theme$UTTextInput17.notchedOutline)||void 0===_theme$UTTextInput17||null===(_theme$UTTextInput17=_theme$UTTextInput17.focused)||void 0===_theme$UTTextInput17?void 0:_theme$UTTextInput17.border)||"2px solid ".concat(Colors.primary),borderColor:null===(_theme$UTTextInput18=theme.UTTextInput)||void 0===_theme$UTTextInput18||null===(_theme$UTTextInput18=_theme$UTTextInput18.notchedOutline)||void 0===_theme$UTTextInput18||null===(_theme$UTTextInput18=_theme$UTTextInput18.hover)||void 0===_theme$UTTextInput18?void 0:_theme$UTTextInput18.borderColor},"&$disabled $notchedOutline":{border:(null===(_theme$UTTextInput19=theme.UTTextInput)||void 0===_theme$UTTextInput19||null===(_theme$UTTextInput19=_theme$UTTextInput19.notchedOutline)||void 0===_theme$UTTextInput19||null===(_theme$UTTextInput19=_theme$UTTextInput19.disabled)||void 0===_theme$UTTextInput19?void 0:_theme$UTTextInput19.border)||"1px solid ".concat(Colors.gray),borderColor:null===(_theme$UTTextInput20=theme.UTTextInput)||void 0===_theme$UTTextInput20||null===(_theme$UTTextInput20=_theme$UTTextInput20.notchedOutline)||void 0===_theme$UTTextInput20||null===(_theme$UTTextInput20=_theme$UTTextInput20.hover)||void 0===_theme$UTTextInput20?void 0:_theme$UTTextInput20.borderColor},padding:null===(_theme$UTTextInput21=theme.UTTextInput)||void 0===_theme$UTTextInput21||null===(_theme$UTTextInput21=_theme$UTTextInput21.notchedOutline)||void 0===_theme$UTTextInput21?void 0:_theme$UTTextInput21.padding},notchedOutline:{border:(null===(_theme$UTTextInput22=theme.UTTextInput)||void 0===_theme$UTTextInput22||null===(_theme$UTTextInput22=_theme$UTTextInput22.notchedOutline)||void 0===_theme$UTTextInput22||null===(_theme$UTTextInput22=_theme$UTTextInput22.unfocused)||void 0===_theme$UTTextInput22?void 0:_theme$UTTextInput22.border)||"1px solid ".concat(theme.Palette.error["05"]),borderColor:null===(_theme$UTTextInput23=theme.UTTextInput)||void 0===_theme$UTTextInput23||null===(_theme$UTTextInput23=_theme$UTTextInput23.notchedOutline)||void 0===_theme$UTTextInput23||null===(_theme$UTTextInput23=_theme$UTTextInput23.hover)||void 0===_theme$UTTextInput23?void 0:_theme$UTTextInput23.borderColor,borderRadius:null===(_theme$UTTextInput24=theme.UTTextInput)||void 0===_theme$UTTextInput24||null===(_theme$UTTextInput24=_theme$UTTextInput24.notchedOutline)||void 0===_theme$UTTextInput24?void 0:_theme$UTTextInput24.borderRadius}},MuiPaper:{root:{marginTop:(null===(_theme$UTAutocomplete7=theme.UTAutocomplete)||void 0===_theme$UTAutocomplete7||null===(_theme$UTAutocomplete7=_theme$UTAutocomplete7.paper)||void 0===_theme$UTAutocomplete7?void 0:_theme$UTAutocomplete7.marginTop)||8,maxHeight:(null===(_theme$UTAutocomplete8=theme.UTAutocomplete)||void 0===_theme$UTAutocomplete8||null===(_theme$UTAutocomplete8=_theme$UTAutocomplete8.paper)||void 0===_theme$UTAutocomplete8?void 0:_theme$UTAutocomplete8.maxHeight)||300,overflowX:(null===(_theme$UTAutocomplete9=theme.UTAutocomplete)||void 0===_theme$UTAutocomplete9||null===(_theme$UTAutocomplete9=_theme$UTAutocomplete9.paper)||void 0===_theme$UTAutocomplete9?void 0:_theme$UTAutocomplete9.overflowX)||"hidden"}},MuiFormLabel:{root:{color:null===(_theme$UTTextInput25=theme.UTTextInput)||void 0===_theme$UTTextInput25||null===(_theme$UTTextInput25=_theme$UTTextInput25.formLabel)||void 0===_theme$UTTextInput25?void 0:_theme$UTTextInput25.color,"&$error":{color:(null===(_theme$UTTextInput26=theme.UTTextInput)||void 0===_theme$UTTextInput26||null===(_theme$UTTextInput26=_theme$UTTextInput26.formLabel)||void 0===_theme$UTTextInput26?void 0:_theme$UTTextInput26.errorColor)||Colors.gray},"&$focused":{color:(null===(_theme$UTTextInput27=theme.UTTextInput)||void 0===_theme$UTTextInput27||null===(_theme$UTTextInput27=_theme$UTTextInput27.formLabel)||void 0===_theme$UTTextInput27?void 0:_theme$UTTextInput27.focusedColor)||Colors.primary,"&$error":{color:theme.Palette.error["05"]}},fontSize:(null===(_theme$UTTextInput28=theme.UTTextInput)||void 0===_theme$UTTextInput28?void 0:_theme$UTTextInput28.fontSize)||(null===(_theme$Fonts4=theme.Fonts)||void 0===_theme$Fonts4?void 0:_theme$Fonts4.medium)||14}},MuiFormHelperText:{root:{fontSize:(null===(_theme$UTTextInput29=theme.UTTextInput)||void 0===_theme$UTTextInput29||null===(_theme$UTTextInput29=_theme$UTTextInput29.helperText)||void 0===_theme$UTTextInput29?void 0:_theme$UTTextInput29.fontSize)||12,color:theme.Palette.error["05"],letterSpacing:(null===(_theme$UTTextInput30=theme.UTTextInput)||void 0===_theme$UTTextInput30||null===(_theme$UTTextInput30=_theme$UTTextInput30.helperText)||void 0===_theme$UTTextInput30?void 0:_theme$UTTextInput30.letterSpacing)||"normal"}},MuiInputLabel:{outlined:{transform:null===(_theme$UTAutocomplete0=theme.UTAutocomplete)||void 0===_theme$UTAutocomplete0||null===(_theme$UTAutocomplete0=_theme$UTAutocomplete0.inputLabel)||void 0===_theme$UTAutocomplete0||null===(_theme$UTAutocomplete0=_theme$UTAutocomplete0.outlined)||void 0===_theme$UTAutocomplete0?void 0:_theme$UTAutocomplete0.transform}},MuiAutocomplete:{root:{display:(null===(_theme$UTAutocomplete1=theme.UTAutocomplete)||void 0===_theme$UTAutocomplete1?void 0:_theme$UTAutocomplete1.display)||"flex",flexShrink:(null===(_theme$UTAutocomplete10=theme.UTAutocomplete)||void 0===_theme$UTAutocomplete10?void 0:_theme$UTAutocomplete10.flexShrink)||"0",margin:(null===(_theme$UTAutocomplete11=theme.UTAutocomplete)||void 0===_theme$UTAutocomplete11?void 0:_theme$UTAutocomplete11.margin)||"16px 0 8px 0",width:withImportant((null===(_theme$UTAutocomplete12=theme.UTAutocomplete)||void 0===_theme$UTAutocomplete12?void 0:_theme$UTAutocomplete12.width)||"100%")},popper:{overflowX:(null===(_theme$UTAutocomplete13=theme.UTAutocomplete)||void 0===_theme$UTAutocomplete13||null===(_theme$UTAutocomplete13=_theme$UTAutocomplete13.popper)||void 0===_theme$UTAutocomplete13?void 0:_theme$UTAutocomplete13.overflowX)||"hidden"},option:{boxSizing:(null===(_theme$UTAutocomplete14=theme.UTAutocomplete)||void 0===_theme$UTAutocomplete14||null===(_theme$UTAutocomplete14=_theme$UTAutocomplete14.option)||void 0===_theme$UTAutocomplete14?void 0:_theme$UTAutocomplete14.boxSizing)||"border-box"},listbox:{"& ul":{padding:(null===(_theme$UTAutocomplete15=theme.UTAutocomplete)||void 0===_theme$UTAutocomplete15||null===(_theme$UTAutocomplete15=_theme$UTAutocomplete15.listbox)||void 0===_theme$UTAutocomplete15?void 0:_theme$UTAutocomplete15.padding)||0,margin:(null===(_theme$UTAutocomplete16=theme.UTAutocomplete)||void 0===_theme$UTAutocomplete16||null===(_theme$UTAutocomplete16=_theme$UTAutocomplete16.listbox)||void 0===_theme$UTAutocomplete16?void 0:_theme$UTAutocomplete16.margin)||0}},paper:{boxShadow:null===(_theme$UTAutocomplete17=theme.UTAutocomplete)||void 0===_theme$UTAutocomplete17||null===(_theme$UTAutocomplete17=_theme$UTAutocomplete17.paper)||void 0===_theme$UTAutocomplete17?void 0:_theme$UTAutocomplete17.boxShadow}}}};return createTheme(merge(muiTheme,mui))};
+import { createTheme } from '@material-ui/core/styles';
+import merge from 'lodash/merge';
+import Colors from '../../scss/variables/colors.module.scss';
+import { withImportant } from '../../utils/classesUtils';
+export const retrieveStyle = _ref => {
+  var _theme$UTAutocomplete, _theme$UTTextInput, _theme$UTAutocomplete2, _theme$UTTextInput2, _theme$UTAutocomplete3, _theme$UTTextInput3, _theme$UTAutocomplete4, _theme$UTAutocomplete5, _theme$UTAutocomplete6;
+  let {
+    theme
+  } = _ref;
+  return {
+    arrowIcon: {
+      color: ((_theme$UTAutocomplete = theme.UTAutocomplete) === null || _theme$UTAutocomplete === void 0 || (_theme$UTAutocomplete = _theme$UTAutocomplete.arrowIcon) === null || _theme$UTAutocomplete === void 0 ? void 0 : _theme$UTAutocomplete.color) || ((_theme$UTTextInput = theme.UTTextInput) === null || _theme$UTTextInput === void 0 ? void 0 : _theme$UTTextInput.color)
+    },
+    arrowIconDisabled: {
+      color: ((_theme$UTAutocomplete2 = theme.UTAutocomplete) === null || _theme$UTAutocomplete2 === void 0 || (_theme$UTAutocomplete2 = _theme$UTAutocomplete2.arrowIconDisabled) === null || _theme$UTAutocomplete2 === void 0 ? void 0 : _theme$UTAutocomplete2.color) || ((_theme$UTTextInput2 = theme.UTTextInput) === null || _theme$UTTextInput2 === void 0 ? void 0 : _theme$UTTextInput2.color)
+    },
+    loadingIcon: {
+      color: ((_theme$UTAutocomplete3 = theme.UTAutocomplete) === null || _theme$UTAutocomplete3 === void 0 || (_theme$UTAutocomplete3 = _theme$UTAutocomplete3.loadingIcon) === null || _theme$UTAutocomplete3 === void 0 ? void 0 : _theme$UTAutocomplete3.color) || ((_theme$UTTextInput3 = theme.UTTextInput) === null || _theme$UTTextInput3 === void 0 ? void 0 : _theme$UTTextInput3.color),
+      height: withImportant(((_theme$UTAutocomplete4 = theme.UTAutocomplete) === null || _theme$UTAutocomplete4 === void 0 || (_theme$UTAutocomplete4 = _theme$UTAutocomplete4.loadingIcon) === null || _theme$UTAutocomplete4 === void 0 ? void 0 : _theme$UTAutocomplete4.height) || "20px"),
+      margin: ((_theme$UTAutocomplete5 = theme.UTAutocomplete) === null || _theme$UTAutocomplete5 === void 0 || (_theme$UTAutocomplete5 = _theme$UTAutocomplete5.loadingIcon) === null || _theme$UTAutocomplete5 === void 0 ? void 0 : _theme$UTAutocomplete5.margin) || '0 10px 0 0',
+      width: withImportant(((_theme$UTAutocomplete6 = theme.UTAutocomplete) === null || _theme$UTAutocomplete6 === void 0 || (_theme$UTAutocomplete6 = _theme$UTAutocomplete6.loadingIcon) === null || _theme$UTAutocomplete6 === void 0 ? void 0 : _theme$UTAutocomplete6.width) || "20px")
+    }
+  };
+};
+export const retrieveMuiTheme = (theme, muiTheme) => {
+  var _theme$Fonts, _theme$UTTextInput4, _theme$UTTextInput5, _theme$UTTextInput6, _theme$Fonts2, _theme$UTTextInput7, _theme$UTTextInput8, _theme$UTTextInput9, _theme$UTTextInput0, _theme$UTTextInput1, _theme$UTTextInput10, _theme$UTTextInput11, _theme$UTTextInput12, _theme$UTTextInput13, _theme$Fonts3, _theme$UTTextInput14, _theme$UTTextInput15, _theme$UTTextInput16, _theme$UTTextInput17, _theme$UTTextInput18, _theme$UTTextInput19, _theme$UTTextInput20, _theme$UTTextInput21, _theme$UTTextInput22, _theme$UTTextInput23, _theme$UTTextInput24, _theme$UTAutocomplete7, _theme$UTAutocomplete8, _theme$UTAutocomplete9, _theme$UTTextInput25, _theme$UTTextInput26, _theme$UTTextInput27, _theme$UTTextInput28, _theme$Fonts4, _theme$UTTextInput29, _theme$UTTextInput30, _theme$UTAutocomplete0, _theme$UTAutocomplete1, _theme$UTAutocomplete10, _theme$UTAutocomplete11, _theme$UTAutocomplete12, _theme$UTAutocomplete13, _theme$UTAutocomplete14, _theme$UTAutocomplete15, _theme$UTAutocomplete16, _theme$UTAutocomplete17;
+  const mui = {
+    typography: {
+      fontFamily: (_theme$Fonts = theme.Fonts) === null || _theme$Fonts === void 0 ? void 0 : _theme$Fonts.fontFamily
+    },
+    overrides: {
+      MuiInput: {
+        input: {
+          border: (_theme$UTTextInput4 = theme.UTTextInput) === null || _theme$UTTextInput4 === void 0 ? void 0 : _theme$UTTextInput4.border,
+          borderRadius: (_theme$UTTextInput5 = theme.UTTextInput) === null || _theme$UTTextInput5 === void 0 ? void 0 : _theme$UTTextInput5.borderRadius,
+          fontSize: ((_theme$UTTextInput6 = theme.UTTextInput) === null || _theme$UTTextInput6 === void 0 ? void 0 : _theme$UTTextInput6.fontSize) || ((_theme$Fonts2 = theme.Fonts) === null || _theme$Fonts2 === void 0 ? void 0 : _theme$Fonts2.medium) || 14,
+          color: (_theme$UTTextInput7 = theme.UTTextInput) === null || _theme$UTTextInput7 === void 0 ? void 0 : _theme$UTTextInput7.color,
+          padding: (_theme$UTTextInput8 = theme.UTTextInput) === null || _theme$UTTextInput8 === void 0 ? void 0 : _theme$UTTextInput8.padding
+        },
+        underline: {
+          '&:hover:not($disabled):not($focused):not($error):before': {
+            borderBottom: ((_theme$UTTextInput9 = theme.UTTextInput) === null || _theme$UTTextInput9 === void 0 || (_theme$UTTextInput9 = _theme$UTTextInput9.underline) === null || _theme$UTTextInput9 === void 0 || (_theme$UTTextInput9 = _theme$UTTextInput9.hover) === null || _theme$UTTextInput9 === void 0 ? void 0 : _theme$UTTextInput9.borderBottom) || "1px solid ".concat(Colors.gray)
+          },
+          '&:hover:not($disabled):before': {
+            borderBottom: ((_theme$UTTextInput0 = theme.UTTextInput) === null || _theme$UTTextInput0 === void 0 || (_theme$UTTextInput0 = _theme$UTTextInput0.underline) === null || _theme$UTTextInput0 === void 0 || (_theme$UTTextInput0 = _theme$UTTextInput0.hover) === null || _theme$UTTextInput0 === void 0 ? void 0 : _theme$UTTextInput0.borderBottom) || "1px solid ".concat(Colors.gray)
+          },
+          '&$disabled:before': {
+            borderBottom: ((_theme$UTTextInput1 = theme.UTTextInput) === null || _theme$UTTextInput1 === void 0 || (_theme$UTTextInput1 = _theme$UTTextInput1.underline) === null || _theme$UTTextInput1 === void 0 || (_theme$UTTextInput1 = _theme$UTTextInput1.disabled) === null || _theme$UTTextInput1 === void 0 ? void 0 : _theme$UTTextInput1.borderBottom) || "1px solid ".concat(Colors.gray)
+          },
+          '&:before': {
+            borderBottom: ((_theme$UTTextInput10 = theme.UTTextInput) === null || _theme$UTTextInput10 === void 0 || (_theme$UTTextInput10 = _theme$UTTextInput10.underline) === null || _theme$UTTextInput10 === void 0 || (_theme$UTTextInput10 = _theme$UTTextInput10.unfocused) === null || _theme$UTTextInput10 === void 0 ? void 0 : _theme$UTTextInput10.borderBottom) || "1px solid ".concat(Colors.gray)
+          },
+          '&$focused:after': {
+            borderBottom: ((_theme$UTTextInput11 = theme.UTTextInput) === null || _theme$UTTextInput11 === void 0 || (_theme$UTTextInput11 = _theme$UTTextInput11.underline) === null || _theme$UTTextInput11 === void 0 || (_theme$UTTextInput11 = _theme$UTTextInput11.focused) === null || _theme$UTTextInput11 === void 0 ? void 0 : _theme$UTTextInput11.borderBottom) || "2px solid ".concat(Colors.primary)
+          },
+          '&:after': {
+            borderBottom: ((_theme$UTTextInput12 = theme.UTTextInput) === null || _theme$UTTextInput12 === void 0 || (_theme$UTTextInput12 = _theme$UTTextInput12.underline) === null || _theme$UTTextInput12 === void 0 || (_theme$UTTextInput12 = _theme$UTTextInput12.base) === null || _theme$UTTextInput12 === void 0 ? void 0 : _theme$UTTextInput12.borderBottom) || "2px solid ".concat(Colors.primary)
+          },
+          '&$error:after': {
+            borderBottom: "2px solid ".concat(theme.Palette.error['05']),
+            borderBottomColor: theme.Palette.error['05']
+          }
+        }
+      },
+      MuiOutlinedInput: {
+        input: {
+          fontSize: ((_theme$UTTextInput13 = theme.UTTextInput) === null || _theme$UTTextInput13 === void 0 ? void 0 : _theme$UTTextInput13.fontSize) || ((_theme$Fonts3 = theme.Fonts) === null || _theme$Fonts3 === void 0 ? void 0 : _theme$Fonts3.medium) || 14,
+          color: (_theme$UTTextInput14 = theme.UTTextInput) === null || _theme$UTTextInput14 === void 0 ? void 0 : _theme$UTTextInput14.color
+        },
+        root: {
+          '&:hover:not($disabled):not($focused):not($error) $notchedOutline': {
+            border: ((_theme$UTTextInput15 = theme.UTTextInput) === null || _theme$UTTextInput15 === void 0 || (_theme$UTTextInput15 = _theme$UTTextInput15.notchedOutline) === null || _theme$UTTextInput15 === void 0 || (_theme$UTTextInput15 = _theme$UTTextInput15.hover) === null || _theme$UTTextInput15 === void 0 ? void 0 : _theme$UTTextInput15.border) || "1px solid ".concat(Colors.gray),
+            borderColor: (_theme$UTTextInput16 = theme.UTTextInput) === null || _theme$UTTextInput16 === void 0 || (_theme$UTTextInput16 = _theme$UTTextInput16.notchedOutline) === null || _theme$UTTextInput16 === void 0 || (_theme$UTTextInput16 = _theme$UTTextInput16.hover) === null || _theme$UTTextInput16 === void 0 ? void 0 : _theme$UTTextInput16.borderColor
+          },
+          '&$focused $notchedOutline': {
+            border: ((_theme$UTTextInput17 = theme.UTTextInput) === null || _theme$UTTextInput17 === void 0 || (_theme$UTTextInput17 = _theme$UTTextInput17.notchedOutline) === null || _theme$UTTextInput17 === void 0 || (_theme$UTTextInput17 = _theme$UTTextInput17.focused) === null || _theme$UTTextInput17 === void 0 ? void 0 : _theme$UTTextInput17.border) || "2px solid ".concat(Colors.primary),
+            borderColor: (_theme$UTTextInput18 = theme.UTTextInput) === null || _theme$UTTextInput18 === void 0 || (_theme$UTTextInput18 = _theme$UTTextInput18.notchedOutline) === null || _theme$UTTextInput18 === void 0 || (_theme$UTTextInput18 = _theme$UTTextInput18.hover) === null || _theme$UTTextInput18 === void 0 ? void 0 : _theme$UTTextInput18.borderColor
+          },
+          '&$disabled $notchedOutline': {
+            border: ((_theme$UTTextInput19 = theme.UTTextInput) === null || _theme$UTTextInput19 === void 0 || (_theme$UTTextInput19 = _theme$UTTextInput19.notchedOutline) === null || _theme$UTTextInput19 === void 0 || (_theme$UTTextInput19 = _theme$UTTextInput19.disabled) === null || _theme$UTTextInput19 === void 0 ? void 0 : _theme$UTTextInput19.border) || "1px solid ".concat(Colors.gray),
+            borderColor: (_theme$UTTextInput20 = theme.UTTextInput) === null || _theme$UTTextInput20 === void 0 || (_theme$UTTextInput20 = _theme$UTTextInput20.notchedOutline) === null || _theme$UTTextInput20 === void 0 || (_theme$UTTextInput20 = _theme$UTTextInput20.hover) === null || _theme$UTTextInput20 === void 0 ? void 0 : _theme$UTTextInput20.borderColor
+          },
+          padding: (_theme$UTTextInput21 = theme.UTTextInput) === null || _theme$UTTextInput21 === void 0 || (_theme$UTTextInput21 = _theme$UTTextInput21.notchedOutline) === null || _theme$UTTextInput21 === void 0 ? void 0 : _theme$UTTextInput21.padding
+        },
+        notchedOutline: {
+          border: ((_theme$UTTextInput22 = theme.UTTextInput) === null || _theme$UTTextInput22 === void 0 || (_theme$UTTextInput22 = _theme$UTTextInput22.notchedOutline) === null || _theme$UTTextInput22 === void 0 || (_theme$UTTextInput22 = _theme$UTTextInput22.unfocused) === null || _theme$UTTextInput22 === void 0 ? void 0 : _theme$UTTextInput22.border) || "1px solid ".concat(theme.Palette.error['05']),
+          borderColor: (_theme$UTTextInput23 = theme.UTTextInput) === null || _theme$UTTextInput23 === void 0 || (_theme$UTTextInput23 = _theme$UTTextInput23.notchedOutline) === null || _theme$UTTextInput23 === void 0 || (_theme$UTTextInput23 = _theme$UTTextInput23.hover) === null || _theme$UTTextInput23 === void 0 ? void 0 : _theme$UTTextInput23.borderColor,
+          borderRadius: (_theme$UTTextInput24 = theme.UTTextInput) === null || _theme$UTTextInput24 === void 0 || (_theme$UTTextInput24 = _theme$UTTextInput24.notchedOutline) === null || _theme$UTTextInput24 === void 0 ? void 0 : _theme$UTTextInput24.borderRadius
+        }
+      },
+      MuiPaper: {
+        root: {
+          marginTop: ((_theme$UTAutocomplete7 = theme.UTAutocomplete) === null || _theme$UTAutocomplete7 === void 0 || (_theme$UTAutocomplete7 = _theme$UTAutocomplete7.paper) === null || _theme$UTAutocomplete7 === void 0 ? void 0 : _theme$UTAutocomplete7.marginTop) || 8,
+          maxHeight: ((_theme$UTAutocomplete8 = theme.UTAutocomplete) === null || _theme$UTAutocomplete8 === void 0 || (_theme$UTAutocomplete8 = _theme$UTAutocomplete8.paper) === null || _theme$UTAutocomplete8 === void 0 ? void 0 : _theme$UTAutocomplete8.maxHeight) || 300,
+          overflowX: ((_theme$UTAutocomplete9 = theme.UTAutocomplete) === null || _theme$UTAutocomplete9 === void 0 || (_theme$UTAutocomplete9 = _theme$UTAutocomplete9.paper) === null || _theme$UTAutocomplete9 === void 0 ? void 0 : _theme$UTAutocomplete9.overflowX) || 'hidden'
+        }
+      },
+      MuiFormLabel: {
+        root: {
+          color: (_theme$UTTextInput25 = theme.UTTextInput) === null || _theme$UTTextInput25 === void 0 || (_theme$UTTextInput25 = _theme$UTTextInput25.formLabel) === null || _theme$UTTextInput25 === void 0 ? void 0 : _theme$UTTextInput25.color,
+          '&$error': {
+            color: ((_theme$UTTextInput26 = theme.UTTextInput) === null || _theme$UTTextInput26 === void 0 || (_theme$UTTextInput26 = _theme$UTTextInput26.formLabel) === null || _theme$UTTextInput26 === void 0 ? void 0 : _theme$UTTextInput26.errorColor) || Colors.gray
+          },
+          '&$focused': {
+            color: ((_theme$UTTextInput27 = theme.UTTextInput) === null || _theme$UTTextInput27 === void 0 || (_theme$UTTextInput27 = _theme$UTTextInput27.formLabel) === null || _theme$UTTextInput27 === void 0 ? void 0 : _theme$UTTextInput27.focusedColor) || Colors.primary,
+            '&$error': {
+              color: theme.Palette.error['05']
+            }
+          },
+          fontSize: ((_theme$UTTextInput28 = theme.UTTextInput) === null || _theme$UTTextInput28 === void 0 ? void 0 : _theme$UTTextInput28.fontSize) || ((_theme$Fonts4 = theme.Fonts) === null || _theme$Fonts4 === void 0 ? void 0 : _theme$Fonts4.medium) || 14
+        }
+      },
+      MuiFormHelperText: {
+        root: {
+          fontSize: ((_theme$UTTextInput29 = theme.UTTextInput) === null || _theme$UTTextInput29 === void 0 || (_theme$UTTextInput29 = _theme$UTTextInput29.helperText) === null || _theme$UTTextInput29 === void 0 ? void 0 : _theme$UTTextInput29.fontSize) || 12,
+          color: theme.Palette.error['05'],
+          letterSpacing: ((_theme$UTTextInput30 = theme.UTTextInput) === null || _theme$UTTextInput30 === void 0 || (_theme$UTTextInput30 = _theme$UTTextInput30.helperText) === null || _theme$UTTextInput30 === void 0 ? void 0 : _theme$UTTextInput30.letterSpacing) || 'normal'
+        }
+      },
+      MuiInputLabel: {
+        outlined: {
+          transform: (_theme$UTAutocomplete0 = theme.UTAutocomplete) === null || _theme$UTAutocomplete0 === void 0 || (_theme$UTAutocomplete0 = _theme$UTAutocomplete0.inputLabel) === null || _theme$UTAutocomplete0 === void 0 || (_theme$UTAutocomplete0 = _theme$UTAutocomplete0.outlined) === null || _theme$UTAutocomplete0 === void 0 ? void 0 : _theme$UTAutocomplete0.transform
+        }
+      },
+      MuiAutocomplete: {
+        root: {
+          display: ((_theme$UTAutocomplete1 = theme.UTAutocomplete) === null || _theme$UTAutocomplete1 === void 0 ? void 0 : _theme$UTAutocomplete1.display) || 'flex',
+          flexShrink: ((_theme$UTAutocomplete10 = theme.UTAutocomplete) === null || _theme$UTAutocomplete10 === void 0 ? void 0 : _theme$UTAutocomplete10.flexShrink) || '0',
+          margin: ((_theme$UTAutocomplete11 = theme.UTAutocomplete) === null || _theme$UTAutocomplete11 === void 0 ? void 0 : _theme$UTAutocomplete11.margin) || '16px 0 8px 0',
+          width: withImportant(((_theme$UTAutocomplete12 = theme.UTAutocomplete) === null || _theme$UTAutocomplete12 === void 0 ? void 0 : _theme$UTAutocomplete12.width) || '100%')
+        },
+        popper: {
+          overflowX: ((_theme$UTAutocomplete13 = theme.UTAutocomplete) === null || _theme$UTAutocomplete13 === void 0 || (_theme$UTAutocomplete13 = _theme$UTAutocomplete13.popper) === null || _theme$UTAutocomplete13 === void 0 ? void 0 : _theme$UTAutocomplete13.overflowX) || 'hidden'
+        },
+        option: {
+          boxSizing: ((_theme$UTAutocomplete14 = theme.UTAutocomplete) === null || _theme$UTAutocomplete14 === void 0 || (_theme$UTAutocomplete14 = _theme$UTAutocomplete14.option) === null || _theme$UTAutocomplete14 === void 0 ? void 0 : _theme$UTAutocomplete14.boxSizing) || 'border-box'
+        },
+        listbox: {
+          '& ul': {
+            padding: ((_theme$UTAutocomplete15 = theme.UTAutocomplete) === null || _theme$UTAutocomplete15 === void 0 || (_theme$UTAutocomplete15 = _theme$UTAutocomplete15.listbox) === null || _theme$UTAutocomplete15 === void 0 ? void 0 : _theme$UTAutocomplete15.padding) || 0,
+            margin: ((_theme$UTAutocomplete16 = theme.UTAutocomplete) === null || _theme$UTAutocomplete16 === void 0 || (_theme$UTAutocomplete16 = _theme$UTAutocomplete16.listbox) === null || _theme$UTAutocomplete16 === void 0 ? void 0 : _theme$UTAutocomplete16.margin) || 0
+          }
+        },
+        paper: {
+          boxShadow: (_theme$UTAutocomplete17 = theme.UTAutocomplete) === null || _theme$UTAutocomplete17 === void 0 || (_theme$UTAutocomplete17 = _theme$UTAutocomplete17.paper) === null || _theme$UTAutocomplete17 === void 0 ? void 0 : _theme$UTAutocomplete17.boxShadow
+        }
+      }
+    }
+  };
+  return createTheme(merge(muiTheme, mui));
+};

package/dist/esm/deprecated/UTBarChart/README.md

@@ -0,0 +1,55 @@
+# UTBarChart
+
+### Description
+
+Component that aims to provide an easy and dynamic solution for creating bar charts in React.
+
+### Props
+
+- `barData`: expects an `array` of `arrays` of `objects` representing the information to show as bars in the chart. There are a couple of ways you can pass this information to achieve different looking charts.
+  1. Each element of the main array is an array of objects with a `value` attribute. This will render `n` subsets of bars, being `n` the numbers of arrays in the main array.
+  2. Each element of the main array is an array of objects with a `values` attribute. This will render `n` "stacked" bar values, inside the values attribute, as one bar instead of several.
+- `linearData`: expects an `array` of `objects` which should have a `data` attribute representing all the points conforming the lines in the linear plot, along with the `type`: `dashed`, `solid`, and the `color`.
+- `minBarWidth`: expects a `number`, indicates a minimum width for the bars to take when rendered.
+- `pagination`: expects a `number`, defines the number of elements per page, no pagination as default. If no pagination is specified, scroll will be added if bars need to be smaller than the `minBarWidth` prop to fit.
+- `yAxisTicks`: expects a `number`, defines the y-axis definition.
+- `className`: expects a `string`, represents the style to be applied to the chart container. This prop should be used to give dimensions to the chart! If not style is passed, then nothing will be showed.
+- `xAxisDefinition`: expects and `array` of objects with `mainLabel`, `secondaryLabel` attributes. This will be used to create the x-axis.
+- `barPadding`: expects a `number`, defines the bar padding, relative to the bar width.
+- `barBorderRadius`: expects a `number`, defines the bar top border radius.
+- `onBarClick`: expects a `func`, determines what to do when certain bar is selected. It will receive one argument, the bar data.
+- `gradientGenerator`: expects a `func`, used to render `linearGradients`, if needed, inside the `SVG` tag.
+- `decoratorRenderer`: expects a `func`, used to create an `array` of decorations to be applied to the x-axis. Each decoration could have the following shape:
+  - x: `number` that indicates the index to decorate.
+  - label: `string` that defines the text to be shown as decoration.
+  - position: `string`, defines if the text should be centered relative to its bar.
+  - textAnchor: `string`, defines the text anchor for the text tag.
+  - textProps: `object`, extra props for the text tag.
+  - withLine: `bool`, indicates whether the decoration should have a corresponding vertical line for further indication of its origin.
+- `levels`: expects an `array` of `objects` that should have the following shape:
+  - `value`: `number`, value to set the horizontal line.
+  - `color`: `string`, color for the level line.
+  - `type`: `string`, could be `dashed`, `solid`
+- `title`: `string` indicating the chart title.
+- `labelFormatters`: expects an `object` of `functions` that is used to format both possible y-axis labels. It receives a `number` and should return a `string`. The object should have the following shape: `{ bar: func, linear: func }`, where `bar` is the function applied to the bar y-axis, and `linear` to the linear y-axis.
+- `units`: expects an `object` of `string` of the shape `{ bar: string, linear: string }`, where `bar` is the unit of the bar y-axis, and `linear` of the linear y-axis.
+- `showGrid`: expects a `bool`, flag that indicates whether to show or hide the chart grid.
+- `center`: expects a `bool`, flag that indicates whether right and left margins should have the same dimensions, thus centering the chart.
+- `hideYAxis`: expects a `bool`, flag that indicates whether to show or hide the y-axis.
+- `references`: expects an `object` of `arrays` with the following shape: `{ bar: array, linear: array, levels: array }`. Where every the bar and linear array should have the shape:
+  - `check`: `func` that checks if reference should be displayed.
+  - `id`: `string`, reference identifier.
+  - `className`: styles to be applied to the reference indicator.
+  - `label`: `string`, reference label.
+    The levels reference will always be present, thus, no need for the `check` method.
+- `displayLegendAs`: `string` that indicates whether to show the legend as either `modal` or `block`.
+- `labels`: expects an `object` of `string` to define the texts to be used in the Legend component:
+  - referencesModalButton
+  - referencesModalTitle
+  - showReferencesLabel
+- `selectable`: expects a `bool` that indicates whether bars are selectable.
+- `highlightWidth`: expects a `number` that indicates, relative to the bars width, the size of the highlight outline.
+- `spacingOptions`: expects an `object` of the shape `{ onTopLabelPadding: number, lateralMargin: number, verticalMargin: number, axisPadding: number, marginTop: number, scrollPadding: number }`.
+- `valuesOnTop`: expects a `bool` that indicates that values must be rendered on top of each bar.
+- `NoDataComponent`: expects a `func` that renders a component to show when no bar data is available.
+- `markers`: expects a shape for markers configuration and styling

package/dist/esm/deprecated/UTBarChart/components/Bars/components/Bar/components/Rect/index.js

@@ -1 +1,57 @@
-import React,{useEffect}from"react";import{number,string}from"prop-types";import*as d3 from"d3";const Rect=_ref=>{let{borderRadius:borderRadius,className:className,color:color,gradient:gradient,height:height,id:id,index:index,stroke:stroke,strokeWidth:strokeWidth,transitionDuration:transitionDuration,width:width,x:x,y:y}=_ref;const verticalStroke=-height+borderRadius||0,horizontalStroke=width-2*borderRadius||0,positiveHeight=height>=0?height:0,positiveY=y>=0?y:0;return useEffect(()=>{d3.select("#bar-".concat(id)).attr("height",0).attr("y",positiveY).transition().duration(transitionDuration).attr("height",positiveHeight).attr("y",positiveY-positiveHeight)},[positiveHeight,positiveY]),React.createElement(React.Fragment,null,gradient&&React.createElement("defs",null,gradient),React.createElement("clipPath",{id:"clip-bar-".concat(id)},React.createElement("path",{d:"M".concat(x,",").concat(y," v").concat(verticalStroke," q",0,",").concat(-borderRadius," ").concat(borderRadius,",").concat(-borderRadius," h").concat(horizontalStroke," q").concat(borderRadius,",",0," ").concat(borderRadius,",").concat(borderRadius," v").concat(-verticalStroke," z")})),React.createElement("rect",{id:"bar-".concat(id),className:className,clipPath:"url(#clip-bar-".concat(id,")"),x:x,width:width,fill:gradient?"url(#gradient-".concat(index,")"):color,stroke:stroke,strokeWidth:strokeWidth}))};Rect.propTypes={borderRadius:number,className:string,color:string,gradient:string,height:number,id:string,index:number,stroke:string,strokeWidth:number,transitionDuration:number,width:number,x:number,y:number};export default Rect;
+import React, { useEffect } from 'react';
+import { number, string } from 'prop-types';
+import * as d3 from 'd3';
+const Rect = _ref => {
+  let {
+    borderRadius,
+    className,
+    color,
+    gradient,
+    height,
+    id,
+    index,
+    stroke,
+    strokeWidth,
+    transitionDuration,
+    width,
+    x,
+    y
+  } = _ref;
+  const verticalStroke = -height + borderRadius || 0;
+  const horizontalStroke = width - 2 * borderRadius || 0;
+  const positiveHeight = height >= 0 ? height : 0;
+  const positiveY = y >= 0 ? y : 0;
+  useEffect(() => {
+    d3.select("#bar-".concat(id)).attr('height', 0).attr('y', positiveY).transition().duration(transitionDuration).attr('height', positiveHeight).attr('y', positiveY - positiveHeight);
+  }, [positiveHeight, positiveY]);
+  return /*#__PURE__*/React.createElement(React.Fragment, null, gradient && /*#__PURE__*/React.createElement("defs", null, gradient), /*#__PURE__*/React.createElement("clipPath", {
+    id: "clip-bar-".concat(id)
+  }, /*#__PURE__*/React.createElement("path", {
+    d: "M".concat(x, ",").concat(y, " v").concat(verticalStroke, " q", 0, ",").concat(-borderRadius, " ").concat(borderRadius, ",").concat(-borderRadius, " h").concat(horizontalStroke, " q").concat(borderRadius, ",", 0, " ").concat(borderRadius, ",").concat(borderRadius, " v").concat(-verticalStroke, " z")
+  })), /*#__PURE__*/React.createElement("rect", {
+    id: "bar-".concat(id),
+    className: className,
+    clipPath: "url(#clip-bar-".concat(id, ")"),
+    x: x,
+    width: width,
+    fill: gradient ? "url(#gradient-".concat(index, ")") : color,
+    stroke: stroke,
+    strokeWidth: strokeWidth
+  }));
+};
+Rect.propTypes = {
+  borderRadius: number,
+  className: string,
+  color: string,
+  gradient: string,
+  height: number,
+  id: string,
+  index: number,
+  stroke: string,
+  strokeWidth: number,
+  transitionDuration: number,
+  width: number,
+  x: number,
+  y: number
+};
+export default Rect;

package/dist/esm/deprecated/UTBarChart/components/Bars/components/Bar/constants.js

@@ -1 +1 @@
-export const NO_OP=()=>{};
+export const NO_OP = () => {};

package/dist/esm/deprecated/UTBarChart/components/Bars/components/Bar/index.js

@@ -1 +1,79 @@
-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)}import React from"react";import{number,string,func,bool,object}from"prop-types";import UTTooltip from"../../../../../../components/UTTooltip";import{barType}from"../../../../types";import{TEST_IDS}from"../../../../../../constants/testIds";import Rect from"./components/Rect";import styles from"./styles.module.scss";import{NO_OP}from"./constants";const{barChart:barChart}=TEST_IDS,Bar=_ref=>{let{width:width,height:height,color:color,gradient:gradient,x:x,y:y,borderRadius:borderRadius,tooltipContent:tooltipContent,onClick:onClick,clickable:clickable,data:data,id:id,index:index,stroke:stroke,strokeWidth:strokeWidth,tooltipClassName:tooltipClassName,transitionDuration:transitionDuration,tooltipProps:tooltipProps}=_ref;return React.createElement(UTTooltip,_extends({className:tooltipClassName,content:tooltipContent,dataTestId:"".concat(barChart.bar.tooltip).concat(id),interactive:!1,stringContentClassName:styles.tooltip},tooltipProps),React.createElement("g",{className:"".concat(clickable&&styles.clickable," ").concat(styles.rect),onClick:clickable?()=>onClick(index,data):NO_OP},React.createElement(Rect,{index:index,className:"".concat(clickable&&styles.clickable," ").concat(styles.rect),width:width,height:height,color:color,gradient:gradient,x:x,y:y,borderRadius:height>borderRadius?borderRadius:height,id:id,stroke:stroke,strokeWidth:strokeWidth,transitionDuration:transitionDuration})))};Bar.propTypes={width:number,height:number,color:string,x:number,y:number,borderRadius:number,tooltipContent:string,onClick:func,clickable:bool,data:barType,id:string,index:number,stroke:string,strokeWidth:number,tooltipClassName:string,transitionDuration:number,gradient:string,tooltipProps:object};export default Bar;
+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); }
+import React from 'react';
+import { number, string, func, bool, object } from 'prop-types';
+import UTTooltip from '../../../../../../components/UTTooltip';
+import { barType } from '../../../../types';
+import { TEST_IDS } from '../../../../../../constants/testIds';
+import Rect from './components/Rect';
+import styles from './styles.module.scss';
+import { NO_OP } from './constants';
+const {
+  barChart
+} = TEST_IDS;
+const Bar = _ref => {
+  let {
+    width,
+    height,
+    color,
+    gradient,
+    x,
+    y,
+    borderRadius,
+    tooltipContent,
+    onClick,
+    clickable,
+    data,
+    id,
+    index,
+    stroke,
+    strokeWidth,
+    tooltipClassName,
+    transitionDuration,
+    tooltipProps
+  } = _ref;
+  return /*#__PURE__*/React.createElement(UTTooltip, _extends({
+    className: tooltipClassName,
+    content: tooltipContent,
+    dataTestId: "".concat(barChart.bar.tooltip).concat(id),
+    interactive: false,
+    stringContentClassName: styles.tooltip
+  }, tooltipProps), /*#__PURE__*/React.createElement("g", {
+    className: "".concat(clickable && styles.clickable, " ").concat(styles.rect),
+    onClick: clickable ? () => onClick(index, data) : NO_OP
+  }, /*#__PURE__*/React.createElement(Rect, {
+    index: index,
+    className: "".concat(clickable && styles.clickable, " ").concat(styles.rect),
+    width: width,
+    height: height,
+    color: color,
+    gradient: gradient,
+    x: x,
+    y: y,
+    borderRadius: height > borderRadius ? borderRadius : height,
+    id: id,
+    stroke: stroke,
+    strokeWidth: strokeWidth,
+    transitionDuration: transitionDuration
+  })));
+};
+Bar.propTypes = {
+  width: number,
+  height: number,
+  color: string,
+  x: number,
+  y: number,
+  borderRadius: number,
+  tooltipContent: string,
+  onClick: func,
+  clickable: bool,
+  data: barType,
+  id: string,
+  index: number,
+  stroke: string,
+  strokeWidth: number,
+  tooltipClassName: string,
+  transitionDuration: number,
+  gradient: string,
+  tooltipProps: object
+};
+export default Bar;

package/dist/esm/deprecated/UTBarChart/components/Bars/constants.js

@@ -1 +1,3 @@
-export const HIGHLIGHT_KEY="HIGHLIGHT";export const BAR_KEY="BAR";export const DEFAULT_TOP_LABEL_PADDING="8";
+export const HIGHLIGHT_KEY = 'HIGHLIGHT';
+export const BAR_KEY = 'BAR';
+export const DEFAULT_TOP_LABEL_PADDING = '8';