@bytebrand/fe-ui-core 4.3.0 → 4.4.0

package/source/components/SearchFilters/filters/AlternativeID.tsx

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import React, { useState, KeyboardEvent } from 'react';
 import TextField from '../../_common/TextField/TextField';
 import Button from '../../_common/Button/Button';
 import classNames from 'classnames';
@@ -11,69 +11,58 @@ interface IAlternativeIDProps {
   error: boolean;
   successTransition: boolean;
   autoDeId?: string;
-  onChange: (value: any) => void;
+  onChange: (value: string) => void;
   onKeyPress?: (event: React.KeyboardEvent<HTMLInputElement>) => void;
 }
 
-interface IAlternativeIDState {
-  value: string;
-}
+const AlternativeID: React.FC<IAlternativeIDProps> = ({
+  t,
+  name,
+  successTransition,
+  autoDeId,
+  onChange,
+  error = false
+}) => {
+  const [value, setValue] = useState<string>(autoDeId || '');
 
-class AlternativeID extends React.Component<IAlternativeIDProps, IAlternativeIDState> {
-  static defaultProps = {
-    error: false
+  const onFilterChange = (value: string) => {
+    setValue(value);
   };
 
-  state = {
-    value: ''
+  const handleSearchClick = () => {
+    onChange(value);
   };
 
-  componentDidMount() { this.setState({ value: this.props.autoDeId }); }
-
-  onFilterChange = (value: string) => {
-    this.setState({ value });
-  };
-
-  handleSearchClick = () => {
-    const { value } = this.state;
-
-    this.props.onChange(value);
-  }
-
-  onKeyAlternativeRedirect = (event: React.KeyboardEvent<HTMLInputElement>) => {
-    const { value } = this.state;
+  const onKeyAlternativeRedirect = (event: React.KeyboardEvent<HTMLInputElement>) => {
     if (event.key === 'Enter') {
-      this.props.onChange(value);
+      onChange(value);
     }
-  }
+  };
 
-  render(): JSX.Element {
-    const { t, name, error, successTransition } = this.props;
-    const inputProps = {
-      name,
-      placeholder: 'z.B: FCEE67',
-      value: this.state.value,
-      onChange: this.onFilterChange,
-      onKeyPress: (event: React.KeyboardEvent<HTMLInputElement>) => this.onKeyAlternativeRedirect(event)
-    };
+  const inputProps = {
+    name,
+    placeholder: 'z.B: FCEE67',
+    value,
+    onChange: onFilterChange,
+    onKeyPress: (event: KeyboardEvent<HTMLInputElement>) => onKeyAlternativeRedirect(event)
+  };
 
-    const buttonProps = {
-      onClick: this.handleSearchClick,
-      className: classNames(
-        styles.button,
-        { [styles.buttonWithError]: error },
-        { [styles.buttonIsFetching]: successTransition }
-        )
-    };
+  const buttonProps = {
+    onClick: handleSearchClick,
+    className: classNames(
+      styles.button,
+      { [styles.buttonWithError]: error },
+      { [styles.buttonIsFetching]: successTransition }
+      )
+  };
 
-    return (
-      <div>
-        <TextField {...inputProps} />
-        {error && <span className={styles.errorText}>{t('filters.alternativeErrorText')}</span>}
-        <Button {...buttonProps}>{t('filters.alternativeBtn')}</Button>
-      </div>
-    );
-  }
-}
+  return (
+    <div>
+      <TextField {...inputProps} />
+      {error && <span className={styles.errorText}>{t('filters.alternativeErrorText')}</span>}
+      <Button {...buttonProps}>{t('filters.alternativeBtn')}</Button>
+    </div>
+  );
+};
 
-export default AlternativeID;
+export default AlternativeID;

package/source/components/SearchFilters/filters/DriveType.tsx

@@ -14,7 +14,7 @@ export interface IDriveTypeProps {
 }
 
 class DriveType extends React.Component<IDriveTypeProps, {}> {
-  onDriveTypeChange = (event: React.ChangeEvent<HTMLInputElement>, checked: boolean, value: any): void => {
+  onDriveTypeChange = (event?: React.ChangeEvent<HTMLInputElement>, checked?: boolean | string,  value?: any): void => {
     const { values } = this.props;
     event.stopPropagation();
     event.nativeEvent.stopImmediatePropagation();

package/source/components/SearchFilters/filters/EmissionSticker.tsx

@@ -11,7 +11,7 @@ export interface IEmissionStickerProps {
 }
 
 class EmissionSticker extends React.Component<IEmissionStickerProps, {}> {
-  onFilterChange = (_event: any, value: string[]) => {
+  onFilterChange = (_event?: React.ChangeEvent<HTMLInputElement>, value?: any) => {
     this.props.onChange('OWNERS_OPTIONS', value);
   };
 

package/source/components/SearchFilters/filters/FirstRegistration.tsx

@@ -1,7 +1,6 @@
 import React, { memo } from 'react';
 import Slider from '../../_common/Slider/Slider';
 import _get from 'lodash/get';
-import { RANGE_FILTERS_DEFAULT_CONTROLS } from '../../../framework/constants/Search';
 import { sliceLessThan, sliceMoreThan } from '../../../framework/utils/CommonUtils';
 import { getSearchYears } from '../../../framework/utils/DateUtils';
 import MaterialAutocomplete from '../../_common/MaterialAutocomplete/MaterialAutocomplete';

package/source/components/SearchFilters/filters/InteriorColor.tsx

@@ -16,7 +16,7 @@ export interface IInteriorColorProps {
 }
 
 const InteriorColor = ({ onChange, values, options, aggregation, t, className }: IInteriorColorProps) => {
-  const onColorChange = (event: React.ChangeEvent<HTMLInputElement>, checked: boolean, value: any): void => {
+  const onColorChange = (event?: React.ChangeEvent<HTMLInputElement>, checked?: boolean | string,  value?: any): void => {
     event.stopPropagation();
     event.nativeEvent.stopImmediatePropagation();
     let _value = value;

package/source/components/SearchFilters/filters/InteriorMaterial.tsx

@@ -11,12 +11,13 @@ interface IInteriorMaterialProps {
   values: any[];
   aggregation?: any;
   t: (key: string) => string;
+  isHorizontal?: boolean;
 
   onChange?: (event: any, value: string[]) => void;
 }
 
 const InteriorMaterial = ({ options, values, aggregation, t, onChange }: IInteriorMaterialProps) => {
-  const onTypeChange = (event: React.ChangeEvent<HTMLInputElement>, checked: boolean, value: any): void => {
+  const onTypeChange = (event?: React.ChangeEvent<HTMLInputElement>, checked?: boolean | string,  value?: any): void => {
     event.stopPropagation();
     event.nativeEvent.stopImmediatePropagation();
     let _value = value;

package/source/components/SearchFilters/filters/Mileage.tsx

@@ -2,7 +2,7 @@ import React, { memo } from 'react';
 import _get from 'lodash/get';
 import { isEqual } from 'lodash';
 import Slider from '../../_common/Slider/Slider';
-import { MILLAGE_FIX, RANGE_FILTERS_DEFAULT_CONTROLS } from '../../../framework/constants/Search';
+import { MILLAGE_FIX } from '../../../framework/constants/Search';
 import { sliceLessThan, sliceMoreThan, numberWithDot } from '../../../framework/utils/CommonUtils';
 import styles from './commonFilters.styl';
 import MaterialAutocomplete from '../../_common/MaterialAutocomplete/MaterialAutocomplete';

package/source/components/SearchFilters/filters/Power.tsx

@@ -2,10 +2,10 @@ import React, { memo } from 'react';
 import Slider from '../../_common/Slider/Slider';
 import MaterialAutocomplete from '../../_common/MaterialAutocomplete/MaterialAutocomplete';
 import styles from './commonFilters.styl';
-import { isEqual } from 'lodash';
+import { isEqual, isNil } from 'lodash';
 import { RadioGroup } from '@mui/material';
 import CheckboxMaterial from '../../_common/CheckboxMaterial/CheckboxMaterial';
-import { POWER_FIX, RANGE_FILTERS_DEFAULT_CONTROLS } from '../../../framework/constants/Search';
+import { POWER_FIX } from '../../../framework/constants/Search';
 import { sliceLessThan, sliceMoreThan } from '../../../framework/utils/CommonUtils';
 
 interface IPowerProps {
@@ -17,12 +17,18 @@ interface IPowerProps {
   onChangeControls?: (name: string, value: any) => void;
   t?: any;
 }
+interface ITypeState {
+  type: string;
+}
 
-class Power extends React.Component<IPowerProps, {}> {
+class Power extends React.Component<IPowerProps, ITypeState> {
   constructor(props: IPowerProps) {
     super(props);
 
     this.name = 'POWER';
+    this.state = {
+      type: props.controls.type
+    };
   }
 
   private readonly name: string;
@@ -30,10 +36,13 @@ class Power extends React.Component<IPowerProps, {}> {
 
   onDropDownChange = (name: string, value: any) => {
     const { controls, onChange, onChangeControls } = this.props;
-    const { from, to, type }: any = { ...controls, [name]: value };
+    const { type } = this.state;
+    const { from, to }: any = { ...controls, [name]: value };
     const controlsObj = { from, to, type };
     this.tempValues = { from, to };
-
+    if ((controlsObj.from === '' && controlsObj.to === '') || (!controlsObj.to && !controlsObj.from)) {
+      controlsObj.type = null;
+    }
     onChangeControls(this.name, controlsObj);
     onChange(this.name, controlsObj);
   };
@@ -41,9 +50,16 @@ class Power extends React.Component<IPowerProps, {}> {
   onTypeChange = (_event: React.SyntheticEvent, value: any) => {
     const { controls, onChange, onChangeControls } = this.props;
     const values = this.tempValues ? this.tempValues : controls;
-
-    onChangeControls(this.name, { ...values, type: value });
-    onChange(this.name, { ...values, type: value });
+    // this.type=value;
+    this.setState(() => ({
+      type: value
+    }));
+    if (!isNil(values.from) && !isNil(values.to)) {
+      if (values.from !== '' || values.to !== '') {
+        onChangeControls(this.name, { ...values, type: value });
+        onChange(this.name, { ...values, type: value });
+      }
+    }
   };
 
   getOptions = (options: any) => options.map((option: string) => ({
@@ -62,7 +78,9 @@ class Power extends React.Component<IPowerProps, {}> {
   };
 
   renderSlider = () => {
-    const { values, options, onChange, onChangeControls, controls: { type } } = this.props;
+    const { type } = this.state;
+
+    const { values, options, onChange, onChangeControls } = this.props;
     const sliderProps = {
       options,
       name: this.name,
@@ -70,7 +88,6 @@ class Power extends React.Component<IPowerProps, {}> {
       values: this.transformValues(values),
       onChange: (value: any, name: string) => {
         this.tempValues = value;
-
         onChange(name, { ...value, type });
         onChangeControls(this.name, { ...value, type });
         // onChangeControls(this.name, { ...RANGE_FILTERS_DEFAULT_CONTROLS, type });
@@ -81,8 +98,8 @@ class Power extends React.Component<IPowerProps, {}> {
   };
 
   renderRadioGroup = () => {
-    const { typeOptions, controls } = this.props;
-    const { type } = controls;
+    const { typeOptions } = this.props;
+    const { type } = this.state;
     const radioGroupProps = {
       value: type,
       name: 'POWER_TYPE',
@@ -106,15 +123,16 @@ class Power extends React.Component<IPowerProps, {}> {
 
   render(): JSX.Element {
     const { t, controls } = this.props;
-    const { from = 0, to = 0, type } = controls;
+    const { type } = this.state;
+    const { from = 0, to = 0 } = controls;
     const commonProps = {
       size: 'custom'
     };
 
     const fromProps = {
       ...commonProps,
-      value: from || null,
-      label: this.getLabel('filters.from', controls.type),
+      value: (from !== 0 ? `${from}` :0) || null,
+      label: this.getLabel('filters.from', type),
       type: 'number',
       onChange: (value: any) => this.onDropDownChange('from', value),
       items: this.getOptions(sliceLessThan(POWER_FIX, to))
@@ -122,9 +140,9 @@ class Power extends React.Component<IPowerProps, {}> {
 
     const toProps = {
       ...commonProps,
-      value: to || null,
+      value: (to !== 0 ? `${to}` :0) || null,
       type: 'number',
-      label: this.getLabel('filters.to', controls.type),
+      label: this.getLabel('filters.to', type),
       onChange: (value: any) => this.onDropDownChange('to', value),
       items: this.getOptions(sliceMoreThan(POWER_FIX, from))
     };
@@ -150,6 +168,7 @@ class Power extends React.Component<IPowerProps, {}> {
 export default memo(Power, (prevProps: any, nextProps: any) => {
   return prevProps.controls.from === nextProps.controls.from &&
          prevProps.controls.to === nextProps.controls.to &&
+         prevProps.t === nextProps.t &&
          prevProps.controls.type === nextProps.controls.type &&
          prevProps.values.from === nextProps.values.from &&
          prevProps.values.to === nextProps.values.to &&

package/source/components/SearchFilters/filters/StateOptions.tsx

@@ -1,6 +1,5 @@
 import * as React from 'react';
 
-import Checkbox from '../../_common/Checkbox/Checkbox';
 import styles from './StateOptions.styl';
 import FilterLabel from '../../_common/FilterLabel/FilterLabel';
 import CheckboxMaterial from '../../_common/CheckboxMaterial/CheckboxMaterial';

package/source/components/SearchFilters/filters/Transmission.tsx

@@ -14,7 +14,7 @@ export interface ITransmissionProps {
 }
 
 class Transmission extends React.Component<ITransmissionProps, {}> {
-  onTransmissionChange = (event: React.ChangeEvent<HTMLInputElement>, checked: boolean, value: any): void => {
+  onTransmissionChange = (event?: React.ChangeEvent<HTMLInputElement>, checked?: boolean | string,  value?: any): void => {
     const { values } = this.props;
     event.stopPropagation();
     event.nativeEvent.stopImmediatePropagation();

package/source/components/SearchPage/SearchChips/SearchChips.tsx

@@ -5,7 +5,7 @@ import ChipFilter from '../ChipFilter/ChipFilter';
 import { SearchPage as SearchPageTranslate } from '../../../locales/data';
 import Chip from '@mui/material/Chip';
 
-import { getChipFilterValue, getFormattedPrice } from '../../../framework/utils/CommonUtils';
+import { getChipFilterValue } from '../../../framework/utils/CommonUtils';
 
 export interface ISearchChipsProps {
   chips: any[];

package/source/components/SearchPageMobile/FiltersDetailed/BodyType.tsx

@@ -21,9 +21,9 @@ class BodyType extends React.Component<IBodyTypeBlock> {
       || !_isEqual(aggregation, nextProps.aggregation)
       || t !== nextProps.t;
   }
-  onBodyTypeCheckboxChange = (option: any) => (_: React.ChangeEvent<HTMLInputElement>, checked: boolean) => this.onFilterChange(checked, option);
+  onBodyTypeCheckboxChange = (option: any) => (_event?: React.ChangeEvent<HTMLInputElement>, checked?: boolean | string) => this.onFilterChange(checked, option);
 
-  onFilterChange = (_: boolean, fieldName: string): void => {
+  onFilterChange = (_: boolean | string, fieldName: string): void => {
     const { BODY_TYPE, onChange } = this.props;
     const bodyTypeField = 'BODY_TYPE';
     const values = [...BODY_TYPE.values];
@@ -37,7 +37,7 @@ class BodyType extends React.Component<IBodyTypeBlock> {
     onChange(bodyTypeField, values);
   };
 
-  renderLabel = (option: string, isChecked: boolean): React.ReactNode => {
+  renderLabel = (option: string, isChecked: boolean): JSX.Element => {
     const { t, aggregation } = this.props;
     // const agg = aggregation && aggregation[option] || 0;
     const agg = aggregation && aggregation[option] ? aggregation[option] : 0;

package/source/components/SearchPageMobile/FiltersDetailed/Consumption.tsx

@@ -1,4 +1,4 @@
-import React, { memo } from 'react';
+import React from 'react';
 import _get from 'lodash/get';
 
 import styles from './Consumption.styl';
@@ -8,7 +8,7 @@ import { CONSUMPTION_FIX } from '../../../framework/constants/Search';
 export interface IConsumptionProps {
   values: any;
   options: any;
-  controls: any;
+  controls?: any;
   shortTitle?: boolean;
   onChange: (fieldName: string, fieldValue: any) => void;
   t?: (phrase: string) => string;

package/source/components/SearchPageMobile/FiltersDetailed/Doors.tsx

@@ -25,7 +25,7 @@ class Doors extends React.Component<IDoorsProps, IDoorsState> {
     };
   }
 
-  onFilterChange = (_: boolean, checked?: boolean, fieldName?: string): void => {
+  onFilterChange = (_:React.ChangeEvent<HTMLInputElement> | boolean, _checked?: string | boolean, fieldName?: any): void => {
     const { fieldValues } = this.props;
     let newValue: string[] = [...fieldValues];
 

package/source/components/SearchPageMobile/FiltersDetailed/MakeModel.tsx

@@ -1,4 +1,4 @@
-import React, { memo } from 'react';
+import React from 'react';
 import _get from 'lodash/get';
 import styles from './MakeModel.styl';
 import MaterialSelect from '../../_common/MaterialSelect/MaterialSelect';

package/source/components/SearchWidget/ColorWidget/BodyColorWidget.tsx

@@ -39,7 +39,7 @@ const BodyColorWidget = ({
 
 }: IBodyColorWidgetProps) => {
 
-  const onColorChange = (event: React.ChangeEvent<HTMLInputElement>, checked: boolean, value: any): void => {
+  const onColorChange = (event?: React.ChangeEvent<HTMLInputElement>, checked?: string | boolean, value?: any): void => {
     event.stopPropagation();
     event.nativeEvent.stopImmediatePropagation();
     let _value = value;
@@ -55,7 +55,7 @@ const BodyColorWidget = ({
     onFilterChange('BODY_COLOR', _value);
   };
 
-  const onCheckboxClick = (_: React.ChangeEvent<HTMLInputElement>, value: boolean): void => {
+  const onCheckboxClick = (_event?: React.ChangeEvent<HTMLInputElement>, value?: string | boolean): void => {
     onFilterChange('METALLIC', value ? 'exterior_metallic' : '');
   };
 
@@ -72,7 +72,7 @@ const BodyColorWidget = ({
         content: option,
         value: option,
         className: styles.color,
-        labelPlacement: 'bottom',
+        labelPlacement: 'bottom' as 'bottom',
         checked: isChecked,
         label: <FilterLabel text={t(`cbd:${option}`)} agg={agg} isVertical={true}/>,
         onChange: onColorChange

package/source/components/SearchWidget/EnvironmentWidget/EnvironmentWidget.tsx

@@ -50,7 +50,7 @@ const EnvironmentWidget: React.FC<IEnvironmentWidgetProps> = ({
   const getConsumption = _get(CONSUMPTION, 'values.to');
   const getEmissionClass = _get(EMISSION_CLASS, 'values');
 
-  const onEmissionStickersChange = (event: React.ChangeEvent<HTMLInputElement>, checked: boolean, value: any) => {
+  const onEmissionStickersChange = (event?: React.ChangeEvent<HTMLInputElement>, _checked?: string | boolean, value?: any) => {
     event.stopPropagation();
     event.nativeEvent.stopImmediatePropagation();
     const { values } = EMISSION_STICKER;
@@ -63,7 +63,7 @@ const EnvironmentWidget: React.FC<IEnvironmentWidgetProps> = ({
     onFilterChange(EMISSION_STICKER_KEY, value);
   };
 
-  const onCheckboxClick = (_: React.ChangeEvent<HTMLElement>, value: boolean): void => {
+  const onCheckboxClick = (_: React.ChangeEvent<HTMLElement>, value?: boolean | string): void => {
     onFilterChange(PARTICULATE_FILTER_KEY, value ? 'engineData_particulateFilterDiesel' : '');
   };
 
@@ -132,7 +132,7 @@ const EnvironmentWidget: React.FC<IEnvironmentWidgetProps> = ({
           <MaterialAutocomplete
             size='custom'
             value={getConsumption ? getValue(getConsumption) : null}
-            onChange={(value: string) => onFilterChange(CONSUMPTION_KEY, { from: void 0, to: value })}
+            onChange={(value: string) => onFilterChange(CONSUMPTION_KEY, { from: void 0, to: value } as any)}
             label={t('filters.consumption')}
             unit='l/100 km'
             items={getOptions(CONSUMPTION_FIX)}

package/source/components/SearchWidget/HighlightsWidget/HighlightsWidget.tsx

@@ -29,7 +29,7 @@ export interface IHighlightsWidgetProps {
 
 class HighlightsWidget extends React.Component<IHighlightsWidgetProps, {}> {
 
-  onFilterChange = (event: React.ChangeEvent<HTMLInputElement>, checked: boolean, value: any) => {
+  onFilterChange = (event: React.ChangeEvent<HTMLInputElement>, checked?: boolean | string, value?: any) => {
     event.stopPropagation();
     event.nativeEvent.stopImmediatePropagation();
 
@@ -75,7 +75,7 @@ class HighlightsWidget extends React.Component<IHighlightsWidgetProps, {}> {
   };
 
   render(): JSX.Element {
-    const { t, HIGHLIGHTS, Link } = this.props;
+    const { t, Link } = this.props;
 
     return (
       <div className={styles.highlights}>

package/source/components/SearchWidget/StateWidget/StateWidget.tsx

@@ -1,7 +1,6 @@
 import React, { useState, useEffect } from 'react';
 import Owners from '../../SearchFilters/filters/Owners';
 import MaterialSelect from '../../_common/MaterialSelect/MaterialSelect';
-import StateOptions from '../../SearchFilters/filters/StateOptions';
 import StateOptionsNew from '../../SearchFilters/filters/StateOptionsNew';
 import { VEHICLE_CONDITION_KEY, STATE_OPTIONS_KEY } from '../../../framework/constants/Search';
 import FilterLabel from '../../_common/FilterLabel/FilterLabel';
@@ -48,7 +47,7 @@ const StateWidget = (props: IStateWidgetProps) => {
     labelContainerClassName: styles.labelWrapper
   };
 
-  const getCheckboxClickHandler = (name: string) => (_: React.ChangeEvent<HTMLInputElement>, value: boolean): void => {
+  const getCheckboxClickHandler = (name: string) => (_: React.ChangeEvent<HTMLInputElement>, value?: boolean | string): void => {
     const { VEHICLE_CONDITION: { values, options } } = props;
     const currentValues: any = {};
     options.forEach((key: string) => { currentValues[key] = values.includes(key); });

package/source/components/SearchWidgetsMobile/BasicDataWidgetMobile/BasicDataWidgetMobile.tsx

@@ -12,7 +12,7 @@ import Mileage from '../../SearchPageMobile/FiltersDetailed/Mileage';
 import Consumption from '../../SearchPageMobile/FiltersDetailed/Consumption';
 import FirstRegistration from '../../SearchPageMobile/FiltersDetailed/FirstRegistration';
 import MakeModel, { IMakeModelProps } from '../../SearchPageMobile/FiltersDetailed/MakeModel';
-import MakeModelExclude, { IMakeModelExcludeProps } from '../../SearchPageMobile/FiltersDetailed/MakeModelExclude';
+import { IMakeModelExcludeProps } from '../../SearchPageMobile/FiltersDetailed/MakeModelExclude';
 import { COST_TYPE_DEFAULT, COST_TYPE_OPTIONS, RANGE_FILTERS, RANGE_FILTERS_DEFAULT_CONTROLS } from '../../../framework/constants/Search';
 import { OBJECT_FILTERS, RATE_DEFAULT_CONTROLS } from '../../../framework/constants/SearchWidget';
 
@@ -32,7 +32,7 @@ class BasicDataWidgetMobile extends React.Component<IMakeModelProps & IMakeModel
   };
 
   shouldComponentUpdate(nextProps: any, nextState: any) {
-    const { MMS_GROUPS, BODY_TYPE, FIRST_REGISTRATION, MILEAGE, POWER, RATE, PRICE, CONSUMPTION, SEATS, DOORS, FUEL, t, isNotDetailed } = this.props;
+    const { MMS_GROUPS, BODY_TYPE, FIRST_REGISTRATION, MILEAGE, POWER, RATE, PRICE, CONSUMPTION, SEATS, DOORS, FUEL, t } = this.props;
 
     const dataBlocks = {
       MMS_GROUPS, BODY_TYPE, FIRST_REGISTRATION, MILEAGE, POWER, RATE, PRICE, CONSUMPTION, SEATS, DOORS, FUEL
@@ -66,8 +66,8 @@ class BasicDataWidgetMobile extends React.Component<IMakeModelProps & IMakeModel
   render(): React.ReactNode {
     const {
       MMS_GROUPS, BODY_TYPE, FIRST_REGISTRATION, MILEAGE, POWER, RATE, PRICE, CONSUMPTION, SEATS, DOORS, FUEL,
-      onFilterChange, onChangeFilterControls, onAddMmsGroup, onRemoveMmsGroup, onDropDownFocus,
-      MM_GROUPS_EXCLUDE, onAddMmExcludeGroup, onRemoveMmExcludeGroup, t, showModal, hideModal, onAddMmsGroupClick, isNotDetailed
+      onFilterChange, onChangeFilterControls, onRemoveMmsGroup, onDropDownFocus,
+      t, showModal, hideModal, onAddMmsGroupClick, isNotDetailed
     } = this.props;
     const commonProps = { t, onChange: onFilterChange };
 

package/source/components/SearchWidgetsMobile/EquipmentsWidget/EquipmentsWidget.tsx

@@ -39,7 +39,7 @@ const EquipmentsWidget = (props: IEquipmentsWidget) => {
     CLIMATISATION, HEATER, MULTIMEDIA, SEATS_OPTIONS, WHEEL, LIGHTS, DOORS_OPTIONS, WINDOW_OPTIONS,
     MIRRORS_OPTIONS, LANDING_GEAR, EXTRAS_OPTIONS, DRIVER_SEATS, CO_DRIVER_SEATS, BACK_SEATS, HIGHLIGHTS,
     onFilterChange,
-    onDropDownFocus,
+    // onDropDownFocus,
     onCategoryFocus,
     t } = props;
   const onCheckboxClick = (fieldName: string, categoryName: string, values: string[]): void => {
@@ -116,11 +116,11 @@ const EquipmentsWidget = (props: IEquipmentsWidget) => {
     return onFilterChange(categoryName, values);
   };
 
-  const onDropdownFocus = (fieldName: string) => {
-    if (onDropDownFocus) {
-      onDropDownFocus(fieldName);
-    }
-  };
+  // const onDropdownFocus = (fieldName: string) => {
+  //   if (onDropDownFocus) {
+  //     onDropDownFocus(fieldName);
+  //   }
+  // };
 
   const getOptions = (options: any, categoryName?: string) => {
     const { [categoryName]: { aggregation } } = props;
@@ -134,16 +134,16 @@ const EquipmentsWidget = (props: IEquipmentsWidget) => {
     });
   };
 
-  const isDropDown = (name: string) => {
-    switch (name) {
-      case 'DRIVER_SEATS':
-      case 'CO_DRIVER_SEATS':
-      case 'BACK_SEATS':
-        return true;
-      default:
-        return false;
-    }
-  };
+  // const isDropDown = (name: string) => {
+  //   switch (name) {
+  //     case 'DRIVER_SEATS':
+  //     case 'CO_DRIVER_SEATS':
+  //     case 'BACK_SEATS':
+  //       return true;
+  //     default:
+  //       return false;
+  //   }
+  // };
 
   const renderDropDown = (index: number, categoryName?: string, data?: any, isMobile?: boolean): React.ReactNode => {
     const { options, values } = data;

package/source/components/SearchWidgetsMobile/HighlightsWidgetMobile/HighlightsWidgetMobile.tsx

@@ -36,7 +36,7 @@ const HighlightsWidgetMobile = ({ onFilterChange, HIGHLIGHTS, t }: IHighlightsWi
     onFilterChange(HIGHLIGHTS_KEY, value);
   };
 
-  const onHighlightsChange = (event: React.ChangeEvent<HTMLInputElement>, checked: boolean, value: any): void => {
+  const onHighlightsChange = (event: React.ChangeEvent<HTMLInputElement>, checked?: boolean | string, value?: any): void => {
     const { values } = HIGHLIGHTS;
     event.stopPropagation();
     event.nativeEvent.stopImmediatePropagation();

package/source/components/SearchWidgetsMobile/InteriorWidget/InteriorWidget.tsx

@@ -1,4 +1,4 @@
-import React, { memo } from 'react';
+import React from 'react';
 import InteriorColor from '../../SearchFilters/filters/InteriorColor';
 import InteriorMaterial from '../../SearchFilters/filters/InteriorMaterial';
 

package/source/components/SearchWidgetsMobile/SafetyWidget/SafetyWidget.tsx

@@ -22,7 +22,7 @@ export interface ISafetyWidget {
 const AIRBAG_KEY = 'AIRBAG';
 
 const SafetyWidget = (props: ISafetyWidget) => {
-  const { ASSISTANTS, AIRBAG, PARKING_ASSISTANTS, THEFT_PROTECTION, HIGHLIGHTS, onFilterChange, onDropDownFocus, t } = props;
+  const { ASSISTANTS, AIRBAG, PARKING_ASSISTANTS, THEFT_PROTECTION, HIGHLIGHTS, onFilterChange, t } = props;
   const onCheckboxClick = (fieldName: string, categoryName: string, values: string[]) => {
     const index = values.indexOf(fieldName);
 
@@ -40,11 +40,11 @@ const SafetyWidget = (props: ISafetyWidget) => {
     return onFilterChange(AIRBAG_KEY, values);
   };
 
-  const onDropdownFocus = () => {
-    if (onDropDownFocus) {
-      onDropDownFocus(AIRBAG_KEY);
-    }
-  };
+  // const onDropdownFocus = () => {
+  //   if (onDropDownFocus) {
+  //     onDropDownFocus(AIRBAG_KEY);
+  //   }
+  // };
 
   const getOptions = (_: string, options: any) => {
     const { aggregation } = AIRBAG;

package/source/components/Stepper/Stepper.tsx

@@ -12,14 +12,15 @@ export interface IProps {
   children: React.ReactElement<IStepProps>[];
   onStepChange?: (nextStep: number) => void;
   className?: string;
+  completed?: boolean;
 }
 
 const defaultStepsDivider: React.ReactElement<IStepsDividerProps> = <StepsDivider/>;
 
 const Stepper: React.FunctionComponent<IProps> = ({ currentStep, nonLinear, stepsDivider = defaultStepsDivider, onStepChange, children, className }) => {
-  const childrenArray: React.ReactElement<IStepProps>[] = React.Children.toArray<React.ReactElement<IStepProps>>(children);
-  const steps = childrenArray.map((child, index) => {
-    if (!React.isValidElement(child)) {
+  const childrenArray: any | { props: IStepProps }[] = React.Children.toArray(children);
+  const steps = childrenArray.map((child: { props: IStepProps }, index: number) => {
+    if (!React.isValidElement<IStepProps>(child)) {
       throw new Error('Stepper component has invalid child');
     }