Update dependency mui to v9.x
This commit is contained in:
@@ -35,19 +35,15 @@ export const SelectionFAB: React.FC<SelectionFABProps> = ({ children, title }) =
|
||||
{(popupState) => (
|
||||
<>
|
||||
<FabContainer {...bindTrigger(popupState)}>
|
||||
<Fab variant="extended" color="primary" id="selectionMenuButton">
|
||||
<Fab variant="extended" color="primary">
|
||||
{title}
|
||||
<MoreHoriz sx={{ ml: 1 }} />
|
||||
</Fab>
|
||||
</FabContainer>
|
||||
<Menu
|
||||
{...bindMenu(popupState)}
|
||||
id="selectionMenu"
|
||||
anchorOrigin={{ horizontal: 'right', vertical: 'top' }}
|
||||
transformOrigin={{ horizontal: 'right', vertical: 'bottom' }}
|
||||
MenuListProps={{
|
||||
'aria-labelledby': 'selectionMenuButton',
|
||||
}}
|
||||
>
|
||||
{(onClose, setHideMenu) => children(onClose, setHideMenu)}
|
||||
</Menu>
|
||||
|
||||
@@ -59,7 +59,9 @@ export function GridLayouts({
|
||||
anchorEl={anchorEl}
|
||||
open={open}
|
||||
onClose={handleClose}
|
||||
MenuListProps={{ 'aria-labelledby': 'basic-button' }}
|
||||
slotProps={{
|
||||
list: { 'aria-labelledby': 'basic-button' }
|
||||
}}
|
||||
>
|
||||
<MenuItem onClick={handleClose}>
|
||||
<FormControlLabel
|
||||
|
||||
@@ -22,11 +22,12 @@ export const SearchTextField = ({
|
||||
{...textFieldProps}
|
||||
slotProps={{
|
||||
input: {
|
||||
...textFieldProps.InputProps,
|
||||
...textFieldProps.slotProps?.input,
|
||||
sx: {
|
||||
color: 'inherit',
|
||||
},
|
||||
endAdornment: textFieldProps.InputProps?.endAdornment ?? (
|
||||
// @ts-expect-error - "endAdornment" does not exist mimimi - fuck off
|
||||
endAdornment: textFieldProps.slotProps?.input?.endAdornment ?? (
|
||||
<InputAdornment position="end">
|
||||
<IconButton {...cancelButtonProps} onClick={() => onCancel()}>
|
||||
<CancelIcon />
|
||||
|
||||
@@ -13,7 +13,7 @@ export const Select = <Value,>({
|
||||
maxSelectionHeightPx = 250,
|
||||
...props
|
||||
}: React.ComponentProps<typeof MuiSelect<Value>> & { maxSelectionHeightPx?: number }) => (
|
||||
<MuiSelect<Value> MenuProps={{ PaperProps: { style: { maxHeight: maxSelectionHeightPx } } }} {...props}>
|
||||
<MuiSelect<Value> MenuProps={{ slotProps: { paper: { sx: { maxHeight: maxSelectionHeightPx } } } }} {...props}>
|
||||
{children}
|
||||
</MuiSelect>
|
||||
);
|
||||
|
||||
@@ -22,12 +22,14 @@ export const OptionsPanel: React.FC<IProps> = ({ open, onClose, children, minHei
|
||||
anchor="bottom"
|
||||
open={open}
|
||||
onClose={onClose}
|
||||
PaperProps={{
|
||||
style: {
|
||||
maxWidth: 600,
|
||||
marginLeft: 'auto',
|
||||
marginRight: 'auto',
|
||||
minHeight,
|
||||
slotProps={{
|
||||
paper: {
|
||||
sx: {
|
||||
maxWidth: 600,
|
||||
marginLeft: 'auto',
|
||||
marginRight: 'auto',
|
||||
minHeight,
|
||||
},
|
||||
},
|
||||
}}
|
||||
>
|
||||
|
||||
@@ -82,7 +82,9 @@ export const DateSetting = ({
|
||||
<ListItemText
|
||||
primary={settingName}
|
||||
secondary={value ? dayjs(Number(value)).format('L') : '-'}
|
||||
secondaryTypographyProps={{ style: { display: 'flex', flexDirection: 'column' } }}
|
||||
slotProps={{
|
||||
secondary: { sx: { display: 'flex', flexDirection: 'column' } },
|
||||
}}
|
||||
/>
|
||||
</ListItemButton>
|
||||
<Dialog open={isDialogOpen} onClose={closeDialog}>
|
||||
|
||||
@@ -152,8 +152,10 @@ export const MutableListSetting = ({
|
||||
<ListItemText
|
||||
primary={settingName}
|
||||
secondary={values?.length ? values?.join(', ') : description}
|
||||
secondaryTypographyProps={{
|
||||
style: { display: 'flex', flexDirection: 'column', wordBreak: 'break-word' },
|
||||
slotProps={{
|
||||
secondary: {
|
||||
sx: { display: 'flex', flexDirection: 'column', wordBreak: 'break-word' },
|
||||
},
|
||||
}}
|
||||
/>
|
||||
</ListItemButton>
|
||||
|
||||
@@ -122,7 +122,9 @@ export const NumberSetting = ({
|
||||
primary={settingTitle}
|
||||
secondary={settingValue}
|
||||
sx={sx}
|
||||
secondaryTypographyProps={{ style: { display: 'flex', flexDirection: 'column' } }}
|
||||
slotProps={{
|
||||
secondary: { sx: { display: 'flex', flexDirection: 'column' } },
|
||||
}}
|
||||
/>
|
||||
</ListItemButton>
|
||||
<Dialog open={isDialogOpen} onClose={cancel}>
|
||||
|
||||
@@ -82,7 +82,9 @@ export const SelectSetting = <SettingValue extends string | number>({
|
||||
<ListItemText
|
||||
primary={settingName}
|
||||
secondary={valueDisplayText ? t(valueDisplayText as MessageDescriptor) : t`Loading…`}
|
||||
secondaryTypographyProps={{ style: { display: 'flex', flexDirection: 'column' } }}
|
||||
slotProps={{
|
||||
secondary: { sx: { display: 'flex', flexDirection: 'column' } },
|
||||
}}
|
||||
/>
|
||||
</ListItemButton>
|
||||
<Dialog open={isDialogOpen} onClose={() => closeDialog()} fullWidth>
|
||||
|
||||
@@ -79,7 +79,9 @@ export const TimeSetting = ({
|
||||
<ListItemText
|
||||
primary={settingName}
|
||||
secondary={dayjs(value, 'HH:mm').format('LT')}
|
||||
secondaryTypographyProps={{ style: { display: 'flex', flexDirection: 'column' } }}
|
||||
slotProps={{
|
||||
secondary: { sx: { display: 'flex', flexDirection: 'column' } },
|
||||
}}
|
||||
/>
|
||||
</ListItemButton>
|
||||
<Dialog open={isDialogOpen} onClose={closeDialog}>
|
||||
|
||||
@@ -29,12 +29,13 @@ export const TextSetting = (props: TextSettingProps) => {
|
||||
<ListItemText
|
||||
primary={settingName}
|
||||
secondary={settingDescription ?? (isPassword ? value.replaceAll(/./g, '*') : value)}
|
||||
secondaryTypographyProps={{
|
||||
sx: { display: 'flex', flexDirection: 'column', wordWrap: 'break-word' },
|
||||
slotProps={{
|
||||
secondary: {
|
||||
sx: { display: 'flex', flexDirection: 'column', wordWrap: 'break-word' },
|
||||
}
|
||||
}}
|
||||
/>
|
||||
</ListItemButton>
|
||||
|
||||
<TextSettingDialog {...props} isDialogOpen={isDialogOpen} setIsDialogOpen={setIsDialogOpen} />
|
||||
</>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user