feat: sx prop for custom dropdown

This commit is contained in:
karishmas6
2024-09-12 22:44:59 +05:30
parent 182307b679
commit 61f93ade46

View File

@@ -1,6 +1,7 @@
import React from 'react'; import React from 'react';
import { FormControl, InputLabel, Select } from "@mui/material"; import { FormControl, InputLabel, Select } from "@mui/material";
import { SelectChangeEvent } from "@mui/material/Select/Select"; import { SelectChangeEvent } from "@mui/material/Select/Select";
import { SxProps } from '@mui/system';
interface DropdownProps { interface DropdownProps {
id: string; id: string;
@@ -8,9 +9,10 @@ interface DropdownProps {
value: string | undefined; value: string | undefined;
handleSelect: (event: SelectChangeEvent) => void; handleSelect: (event: SelectChangeEvent) => void;
children?: React.ReactNode; children?: React.ReactNode;
sx?: SxProps;
}; };
export const Dropdown = ({ id, label, value, handleSelect, children }: DropdownProps) => { export const Dropdown = ({ id, label, value, handleSelect, children, sx }: DropdownProps) => {
return ( return (
<FormControl sx={{ minWidth: 120 }} size="small"> <FormControl sx={{ minWidth: 120 }} size="small">
<InputLabel id={id}>{label}</InputLabel> <InputLabel id={id}>{label}</InputLabel>
@@ -21,6 +23,7 @@ export const Dropdown = ({ id, label, value, handleSelect, children }: DropdownP
label={label} label={label}
onChange={handleSelect} onChange={handleSelect}
size='small' size='small'
sx={sx}
> >
{children} {children}
</Select> </Select>