@bytebrand/fe-ui-core 4.1.117 → 4.1.119

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bytebrand/fe-ui-core",
-  "version": "4.1.117",
+  "version": "4.1.119",
   "description": "UI components for the auto.de project",
   "main": "index.ts",
   "module": "dist/common.js",

package/source/components/VehicleSmallCard/VehicleData/VehiclePrice/VehiclePrice.tsx

@@ -78,9 +78,10 @@ class VehiclePrice extends React.Component<IVehiclePriceSectionProps> {
   };
 
   onDetailsClick = (event: React.MouseEvent<HTMLButtonElement>) => {
+    const { id, url, onDetailsClick } = this.props;
     event.preventDefault();
     event.stopPropagation();
-    this.props.onDetailsClick(this.props.url);
+    onDetailsClick(url, id);
   };
 
   render(): React.ReactNode {

package/source/components/_common/MaterialSelect/MaterialSelect.styled.tsx

@@ -26,13 +26,6 @@ export const Theme = createTheme({
         })
       }
     },
-    MuiMenuItem: {
-      styleOverrides: {
-        root: {
-          padding: '6px'
-        }
-      }
-    },
     MuiPaper: {
       styleOverrides: {
         root: {

package/source/components/_common/MaterialSelect/MaterialSelect.tsx

@@ -34,6 +34,7 @@ export interface IVehicleModalProps {
   onChange: (value: any) => void;
   items: IItems[];
   selectClassName?: string;
+  amountOfItems?: number;
 }
 
 const ITEM_HEIGHT = isMobileOnly ? 56 : 48;
@@ -59,7 +60,8 @@ const MaterialSelect: React.FC<IVehicleModalProps> = ({
   selectClassName,
   required,
   items,
-  icon
+  icon,
+  amountOfItems = MENU_ITEMS
 }: IVehicleModalProps) => {
   const [newValue, setValue] = useState('');
   const [multipleValue, setMultipleValue] = React.useState([]);
@@ -116,11 +118,14 @@ const MaterialSelect: React.FC<IVehicleModalProps> = ({
           key={`${value}_${index}`}
           value={value}
           disabled={setDisabled}
-          sx={setDisabled ? {
-            backgroundColor: '#e8e8e8',
-            color: '#333',
-            opacity: '1 !important'
-          } : null}
+          // sx={setDisabled ? {
+          //   backgroundColor: '#e8e8e8',
+          //   color: '#333',
+          //   opacity: '1 !important'
+          // } : null}
+          sx={{
+            height: ITEM_HEIGHT
+          }}
         >
           {!!t ? t(`${namespace}${cbd ? ':' : '.'}${label}`) : getLabel(label, setDisabled)}
         </MenuItem>
@@ -179,8 +184,8 @@ const MaterialSelect: React.FC<IVehicleModalProps> = ({
             PaperProps: {
               sx: {
                 maxHeight: {
-                  xs: MOBILE_ITEM_HEIGHT * MENU_ITEMS + ITEM_PADDING_TOP,
-                  sm: ITEM_HEIGHT * MENU_ITEMS + ITEM_PADDING_TOP
+                  xs: MOBILE_ITEM_HEIGHT * amountOfItems + ITEM_PADDING_TOP,
+                  sm: ITEM_HEIGHT * amountOfItems + ITEM_PADDING_TOP
                 }
               }
             },

package/source/components/_common/TimePicker/TimePicker.tsx

@@ -123,6 +123,7 @@ const TimePicker = ({
         className={styles.dayForm}
         classNameIcon={styles.selectIcon}
         items={nextWeekDays}
+        amountOfItems={6}
       />
       <MaterialSelect
         onChange={(value: any) => timeChange(value)}
@@ -134,6 +135,7 @@ const TimePicker = ({
         selectClassName={styles.select}
         classNameIcon={styles.selectIcon}
         items={getTimeRanges()}
+        amountOfItems={6}
       />
     </div>
   );