@am92/react-design-system 2.10.2 → 3.0.1-beta.1

package/dist/Components/DsTag/DsTag.Component.js

@@ -17,11 +17,13 @@ export const DsTag = inProps => {
             onDelete(value);
         }
     };
-    const { selected, onClick, onDelete, ...chipProps } = props;
+    const { selected, onClick, onDelete, sx, ...chipProps } = props;
     const color = (selected && 'secondary') || 'default';
     return (_jsx(Chip, { deleteIcon: _jsx(DsRemixIcon, { className: "ri-close-circle-fill" }), skipFocusWhenDisabled: true, sx: {
             paddingTop: 'var(--ds-spacing-quickFreeze)',
             paddingBottom: 'var(--ds-spacing-quickFreeze)',
+            paddingLeft: 'var(--ds-spacing-frostbite)',
+            paddingRight: 'var(--ds-spacing-frostbite)',
             fontWeight: 'var(--ds-typo-bodyRegularMedium-fontWeight)',
             fontSize: 'var(--ds-typo-bodyRegularMedium-fontSize)',
             lineHeight: 'var(--ds-typo-bodyRegularMedium-lineHeight)',
@@ -40,22 +42,40 @@ export const DsTag = inProps => {
                 },
                 ...STATE_STYLES.ACTION_SECONDARY_STATE_SECONDARY
             },
+            '&.Mui-disabled': {
+                opacity: 1,
+                border: '1px solid var(--ds-colour-strokeDisabled)',
+                backgroundColor: 'var(--ds-colour-stateDisabledSurface)',
+            },
             '> .MuiChip-label': {
+                color: 'var(--ds-colour-typoPrimary)',
                 paddingTop: 'var(--ds-spacing-deepFreeze)',
                 paddingBottom: 'var(--ds-spacing-deepFreeze)',
-                paddingLeft: 'var(--ds-spacing-frostbite)',
-                paddingRight: 'var(--ds-spacing-frostbite)'
+                paddingLeft: 'var(--ds-spacing-zero)',
+                paddingRight: 'var(--ds-spacing-zero)'
             },
             '> .MuiChip-icon': {
-                color: 'var(--ds-colour-iconDefault)',
+                color: 'var(--ds-colour-typoPrimary)',
                 fontSize: 'var(--ds-typo-fontSizeBitterCold)',
-                marginLeft: 'var(--ds-spacing-frostbite)',
-                marginRight: 'calc(var(--ds-spacing-quickFreeze) * -1)'
+                marginLeft: 'var(--ds-spacing-zero)',
+                marginRight: 'var(--ds-spacing-glacial)',
             },
             '> .MuiChip-deleteIcon': {
                 fontSize: 'var(--ds-typo-fontSizeBitterCold)',
-                marginRight: 'var(--ds-spacing-frostbite)',
-                marginLeft: 'calc(var(--ds-spacing-quickFreeze) * -1)'
-            }
+                marginRight: 'var(--ds-spacing-zero)',
+                marginLeft: 'var(--ds-spacing-glacial)',
+                color: 'var(--ds-colour-typoPrimary)',
+            },
+            '&.MuiChip-colorSecondary .MuiChip-label, &.MuiChip-colorSecondary .MuiChip-deleteIcon': {
+                color: 'var(--ds-colour-typoOnSurface)'
+            },
+            '&.Mui-disabled .MuiChip-icon, &.Mui-disabled .MuiChip-deleteIcon': {
+                color: 'var(--ds-colour-iconDisabled)'
+            },
+            '&.Mui-disabled .MuiChip-label': {
+                color: 'var(--ds-colour-typoDisabled)',
+                fontWeight: 'var(--ds-typo-bodyRegularMedium-fontWeight)',
+            },
+            ...sx
         }, ...chipProps, variant: "tag", clickable: true, color: color, onDelete: (onDelete && handleDelete) || undefined, onClick: handleClick }));
 };

package/dist/Components/DsToggleButtonGroup/DsToggleButtonGroup.Overrides.d.ts

@@ -1,10 +1,14 @@
-import { CSSInterpolation } from '@mui/system';
+import { CSSObject } from '@mui/system';
 import { DsToggleButtonGroupProps } from './DsToggleButtonGroup.Types';
 export declare const DsToggleButtonGroupOverrides: {
     MuiToggleButtonGroup: {
-        variants: {
-            props: Partial<DsToggleButtonGroupProps>;
-            style: CSSInterpolation;
-        }[];
+        styleOverrides: {
+            root: {
+                variants: {
+                    props: Partial<DsToggleButtonGroupProps>;
+                    style: CSSObject;
+                }[];
+            };
+        };
     };
 };

package/dist/Components/DsToggleButtonGroup/DsToggleButtonGroup.Overrides.js

@@ -1,53 +1,57 @@
 export const DsToggleButtonGroupOverrides = {
     MuiToggleButtonGroup: {
-        variants: [
-            {
-                props: { 'ds-variant': 'switch' },
-                style: {
-                    border: '1px solid var(--ds-colour-strokeDefault)',
-                    borderRadius: 'var(--ds-radius-glacial)',
-                    padding: 'var(--ds-spacing-deepFreeze)',
-                    backgroundColor: 'var(--ds-colour-surfaceBackground)',
-                    '> .MuiToggleButtonGroup-grouped': {
-                        border: 'none',
-                        width: '32px',
-                        height: '24px',
-                        '&:not(:first-of-type)': {
-                            borderRadius: 'var(--ds-radius-quickFreeze)',
-                            marginLeft: 'var(--ds-spacing-zero)',
-                            border: 'none'
-                        },
-                        '&:first-of-type': {
-                            borderRadius: 'var(--ds-radius-quickFreeze)'
-                        },
-                        '&:hover': {
-                            backgroundColor: 'var(--ds-colour-surfaceBackground)'
-                        },
-                        '&:not(.Mui-disabled)': {
-                            color: 'var(--ds-colour-actionSecondary)',
-                            '&.Mui-selected': {
-                                backgroundColor: 'var(--ds-colour-actionSecondary)',
-                                color: 'var(--ds-colour-typoOnSurface)',
+        styleOverrides: {
+            root: {
+                variants: [
+                    {
+                        props: { 'ds-variant': 'switch' },
+                        style: {
+                            border: '1px solid var(--ds-colour-strokeDefault)',
+                            borderRadius: 'var(--ds-radius-glacial)',
+                            padding: 'var(--ds-spacing-deepFreeze)',
+                            backgroundColor: 'var(--ds-colour-surfaceBackground)',
+                            '> .MuiToggleButtonGroup-grouped': {
+                                border: 'none',
+                                width: '32px',
+                                height: '24px',
+                                '&:not(:first-of-type)': {
+                                    borderRadius: 'var(--ds-radius-quickFreeze)',
+                                    marginLeft: 'var(--ds-spacing-zero)',
+                                    border: 'none'
+                                },
+                                '&:first-of-type': {
+                                    borderRadius: 'var(--ds-radius-quickFreeze)'
+                                },
                                 '&:hover': {
-                                    backgroundColor: 'var(--ds-colour-actionSecondary)'
-                                }
-                            }
-                        },
-                        '&.Mui-disabled': {
-                            color: 'var(--ds-colour-typoDisabled)',
-                            border: 'none',
-                            cursor: 'not-allowed',
-                            pointerEvents: 'all',
-                            '&.Mui-selected': {
-                                backgroundColor: 'var(--ds-colour-stateDisabledSurface)',
-                                '&:hover': {
-                                    backgroundColor: 'var(--ds-colour-stateDisabledSurface)'
+                                    backgroundColor: 'var(--ds-colour-surfaceBackground)'
+                                },
+                                '&:not(.Mui-disabled)': {
+                                    color: 'var(--ds-colour-actionSecondary)',
+                                    '&.Mui-selected': {
+                                        backgroundColor: 'var(--ds-colour-actionSecondary)',
+                                        color: 'var(--ds-colour-typoOnSurface)',
+                                        '&:hover': {
+                                            backgroundColor: 'var(--ds-colour-actionSecondary)'
+                                        }
+                                    }
+                                },
+                                '&.Mui-disabled': {
+                                    color: 'var(--ds-colour-typoDisabled)',
+                                    border: 'none',
+                                    cursor: 'not-allowed',
+                                    pointerEvents: 'all',
+                                    '&.Mui-selected': {
+                                        backgroundColor: 'var(--ds-colour-stateDisabledSurface)',
+                                        '&:hover': {
+                                            backgroundColor: 'var(--ds-colour-stateDisabledSurface)'
+                                        }
+                                    }
                                 }
                             }
                         }
                     }
-                }
+                ]
             }
-        ]
+        }
     }
 };

package/dist/Components/index.d.ts

@@ -2,6 +2,7 @@ export * from './DsAccordion';
 export * from './DsAccordionActions';
 export * from './DsAccordionDetails';
 export * from './DsAccordionSummary';
+export * from './DsAddItem';
 export * from './DsAppBar';
 export * from './DsAutocomplete';
 export * from './DsAvatar';

package/dist/Components/index.js

@@ -2,6 +2,7 @@ export * from './DsAccordion';
 export * from './DsAccordionActions';
 export * from './DsAccordionDetails';
 export * from './DsAccordionSummary';
+export * from './DsAddItem';
 export * from './DsAppBar';
 export * from './DsAutocomplete';
 export * from './DsAvatar';

package/dist/Theme/componentOverrides.d.ts

@@ -1,10 +1,10 @@
 declare const componentOverrides: {
     MuiDatePicker: {
-        defaultProps: import("..").DsDatePickerProps<Date>;
+        defaultProps: import("..").DsDatePickerProps;
     };
     MuiLocalizationProvider: {
         defaultProps: {
-            adapterLocale: Locale;
+            adapterLocale: import("date-fns").Locale;
             localeText: {
                 okButtonLabel: string;
                 previousMonth?: string | undefined;
@@ -15,19 +15,25 @@ declare const componentOverrides: {
                 calendarWeekNumberText?: ((weekNumber: number) => string) | undefined;
                 openPreviousView?: string | undefined;
                 openNextView?: string | undefined;
-                calendarViewSwitchingButtonAriaLabel?: ((currentView: import("@mui/x-date-pickers").DateView) => string) | undefined;
+                calendarViewSwitchingButtonAriaLabel?: ((currentView: import("@mui/x-date-pickers/models").DateView) => string) | undefined;
                 start?: string | undefined;
                 end?: string | undefined;
+                startDate?: string | undefined;
+                startTime?: string | undefined;
+                endDate?: string | undefined;
+                endTime?: string | undefined;
                 cancelButtonLabel?: string | undefined;
                 clearButtonLabel?: string | undefined;
                 todayButtonLabel?: string | undefined;
-                clockLabelText?: ((view: import("@mui/x-date-pickers").TimeView, time: any, adapter: import("@mui/x-date-pickers").MuiPickersAdapter<any, any>) => string) | undefined;
+                nextStepButtonLabel?: string | undefined;
+                clockLabelText?: ((view: import("@mui/x-date-pickers/models").TimeView, formattedTime: string | null) => string) | undefined;
                 hoursClockNumberText?: ((hours: string) => string) | undefined;
                 minutesClockNumberText?: ((minutes: string) => string) | undefined;
                 secondsClockNumberText?: ((seconds: string) => string) | undefined;
-                selectViewText?: ((view: import("@mui/x-date-pickers/internals/models").TimeViewWithMeridiem) => string) | undefined;
-                openDatePickerDialogue?: ((date: any, utils: import("@mui/x-date-pickers").MuiPickersAdapter<any, any>) => string) | undefined;
-                openTimePickerDialogue?: ((date: any, utils: import("@mui/x-date-pickers").MuiPickersAdapter<any, any>) => string) | undefined;
+                selectViewText?: ((view: import("@mui/x-date-pickers/internals").TimeViewWithMeridiem) => string) | undefined;
+                openDatePickerDialogue?: ((formattedDate: string | null) => string) | undefined;
+                openTimePickerDialogue?: ((formattedTime: string | null) => string) | undefined;
+                openRangePickerDialogue?: ((formattedRange: string | null) => string) | undefined;
                 fieldClearLabel?: string | undefined;
                 timeTableLabel?: string | undefined;
                 dateTableLabel?: string | undefined;
@@ -36,14 +42,14 @@ declare const componentOverrides: {
                     format: string;
                 }) => string) | undefined;
                 fieldMonthPlaceholder?: ((params: {
-                    contentType: import("@mui/x-date-pickers").FieldSectionContentType;
+                    contentType: import("@mui/x-date-pickers/models").FieldSectionContentType;
                     format: string;
                 }) => string) | undefined;
                 fieldDayPlaceholder?: ((params: {
                     format: string;
                 }) => string) | undefined;
                 fieldWeekDayPlaceholder?: ((params: {
-                    contentType: import("@mui/x-date-pickers").FieldSectionContentType;
+                    contentType: import("@mui/x-date-pickers/models").FieldSectionContentType;
                     format: string;
                 }) => string) | undefined;
                 fieldHoursPlaceholder?: ((params: {
@@ -58,14 +64,24 @@ declare const componentOverrides: {
                 fieldMeridiemPlaceholder?: ((params: {
                     format: string;
                 }) => string) | undefined;
+                year?: string | undefined;
+                month?: string | undefined;
+                day?: string | undefined;
+                weekDay?: string | undefined;
+                hours?: string | undefined;
+                minutes?: string | undefined;
+                seconds?: string | undefined;
+                meridiem?: string | undefined;
+                empty?: string | undefined;
                 datePickerToolbarTitle?: string | undefined;
                 timePickerToolbarTitle?: string | undefined;
                 dateTimePickerToolbarTitle?: string | undefined;
                 dateRangePickerToolbarTitle?: string | undefined;
+                timeRangePickerToolbarTitle?: string | undefined;
             };
         };
     };
-    MuiPickersPopper: {
+    MuiPickerPopper: {
         styleOverrides: {
             root: {
                 ' &[data-popper-placement^="right"]': {
@@ -162,9 +178,16 @@ declare const componentOverrides: {
             };
         };
     };
-    MuiPickersMonth: {
+    MuiMonthCalendar: {
         styleOverrides: {
-            monthButton: {
+            root: {
+                rowGap: string;
+                paddingTop: string;
+                paddingBottom: string;
+                paddingLeft: string;
+                paddingRight: string;
+            };
+            button: {
                 fontWeight: string;
                 fontSize: string;
                 lineHeight: string;
@@ -230,25 +253,7 @@ declare const componentOverrides: {
                 marginBottom: string;
                 backgroundColor: string;
             };
-        };
-    };
-    MuiMonthCalendar: {
-        styleOverrides: {
-            root: {
-                rowGap: string;
-                paddingTop: string;
-                paddingBottom: string;
-                paddingLeft: string;
-                paddingRight: string;
-            };
-        };
-    };
-    MuiPickersYear: {
-        styleOverrides: {
-            root: {
-                flexBasis: string;
-            };
-            yearButton: {
+            button: {
                 width: string;
                 paddingTop: string;
                 paddingBottom: string;
@@ -348,10 +353,14 @@ declare const componentOverrides: {
         };
     };
     MuiToggleButtonGroup: {
-        variants: {
-            props: Partial<import("@mui/material/ToggleButtonGroup/ToggleButtonGroup").ToggleButtonGroupProps>;
-            style: import("@mui/system").CSSInterpolation;
-        }[];
+        styleOverrides: {
+            root: {
+                variants: {
+                    props: Partial<import("@mui/material/ToggleButtonGroup/ToggleButtonGroup").ToggleButtonGroupProps>;
+                    style: import("@mui/system").CSSObject;
+                }[];
+            };
+        };
     };
     MuiSwitch: {
         styleOverrides: {
@@ -485,12 +494,8 @@ declare const componentOverrides: {
     };
     MuiTabs: {
         defaultProps: import("../Components").DsTabsProps;
-        variants: {
-            props: Partial<import("../Components").DsTabsProps>;
-            style: import("@mui/system").CSSInterpolation;
-        }[];
         styleOverrides: {
-            root: import("@mui/system").CSSInterpolation;
+            root: import("@mui/system").CSSObject;
             indicator: {
                 height: string;
                 borderRadius: string;
@@ -610,19 +615,6 @@ declare const componentOverrides: {
     };
     MuiSlider: {
         defaultProps: import("../Components").DsSliderProps;
-        variants: {
-            props: Partial<import("../Components").DsSliderProps>;
-            style: {
-                '&:not(.Mui-disabled, :has(.MuiSlider-thumb:hover), :has(.Mui-focusVisible))': {
-                    '> .MuiSlider-thumb, > .MuiSlider-mark, > .MuiSlider-track': {
-                        backgroundColor: string;
-                    };
-                    '> .MuiSlider-markActive': {
-                        backgroundColor: string;
-                    };
-                };
-            };
-        }[];
         styleOverrides: {
             root: {
                 '&.Mui-disabled': {
@@ -630,6 +622,19 @@ declare const componentOverrides: {
                         color: string;
                     };
                 };
+                variants: {
+                    props: Partial<import("../Components").DsSliderProps>;
+                    style: {
+                        '&:not(.Mui-disabled, :has(.MuiSlider-thumb:hover), :has(.Mui-focusVisible))': {
+                            '> .MuiSlider-thumb, > .MuiSlider-mark, > .MuiSlider-track': {
+                                backgroundColor: string;
+                            };
+                            '> .MuiSlider-markActive': {
+                                backgroundColor: string;
+                            };
+                        };
+                    };
+                }[];
             };
             track: {
                 border: string;
@@ -805,13 +810,9 @@ declare const componentOverrides: {
     };
     MuiInputBase: {
         defaultProps: import("../Components").DsInputBaseProps;
-        variants: {
-            props: Partial<import("../Components").DsInputBaseProps>;
-            style: import("@mui/system").CSSInterpolation;
-        }[];
         styleOverrides: {
-            root: import("@mui/system").CSSInterpolation;
-            input: import("@mui/system").CSSInterpolation;
+            root: import("@mui/system").CSSObject;
+            input: import("@mui/system").CSSObject;
         };
     };
     MuiInputAdornment: {
@@ -1064,15 +1065,15 @@ declare const componentOverrides: {
         styleOverrides: {
             root: {
                 borderColor: string;
+                variants: {
+                    props: Partial<import("../Components").DsDividerProps>;
+                    style: import("@mui/system").CSSObject;
+                }[];
             };
             light: {
                 borderColor: string;
             };
         };
-        variants: {
-            props: Partial<import("../Components").DsDividerProps>;
-            style: import("@mui/system").CSSInterpolation;
-        }[];
     };
     MuiDialogTitle: {
         styleOverrides: {
@@ -1120,11 +1121,14 @@ declare const componentOverrides: {
     };
     MuiChip: {
         defaultProps: import("../Components").DsChipProps;
-        variants: {
-            props: Partial<import("../Components").DsChipProps>;
-            style: import("@mui/system").CSSInterpolation;
-        }[];
-        styleOverrides: {};
+        styleOverrides: {
+            root: {
+                variants: {
+                    props: Partial<import("../Components").DsChipProps>;
+                    style: import("@mui/system").CSSObject;
+                }[];
+            };
+        };
     };
     MuiCheckbox: {
         defaultProps: import("../Components").DsCheckboxProps;
@@ -1185,26 +1189,30 @@ declare const componentOverrides: {
             };
         };
     };
+    MuiButtonBase: {
+        defaultProps: import("../Components").DsButtonBaseProps;
+        styleOverrides: {
+            root: {
+                fontFamily: string;
+            };
+        };
+    };
     MuiButton: {
         defaultProps: import("../Components").DsButtonProps;
-        variants: {
-            props: Partial<import("../Components").DsButtonProps>;
-            style: import("@mui/system").CSSInterpolation;
-        }[];
         styleOverrides: {
-            root: import("@mui/system").CSSInterpolation;
-            contained: import("@mui/system").CSSInterpolation;
-            sizeLarge: import("@mui/system").CSSInterpolation;
-            sizeMedium: import("@mui/system").CSSInterpolation;
-            sizeSmall: import("@mui/system").CSSInterpolation;
-            icon: import("@mui/system").CSSInterpolation;
+            root: import("@mui/system").CSSObject;
+            contained: import("@mui/system").CSSObject;
+            sizeLarge: import("@mui/system").CSSObject;
+            sizeMedium: import("@mui/system").CSSObject;
+            sizeSmall: import("@mui/system").CSSObject;
+            icon: import("@mui/system").CSSObject;
             startIcon: {
                 marginRight: string;
             };
             endIcon: {
                 marginLeft: string;
             };
-            text: import("@mui/system").CSSInterpolation;
+            text: import("@mui/system").CSSObject;
         };
     };
     MuiBreadcrumbs: {
@@ -1260,6 +1268,27 @@ declare const componentOverrides: {
     MuiBadge: {
         defaultProps: import("../Components").DsBadgeProps;
         styleOverrides: {
+            root: {
+                variants: ({
+                    props: Partial<import("../Components").DsBadgeProps>;
+                    style: {
+                        '& .MuiBadge-badge': {
+                            backgroundColor: string;
+                            color: string;
+                            pointerEvents?: undefined;
+                        };
+                    };
+                } | {
+                    props: Partial<import("../Components").DsBadgeProps>;
+                    style: {
+                        '& .MuiBadge-badge': {
+                            backgroundColor: string;
+                            color: string;
+                            pointerEvents: string;
+                        };
+                    };
+                })[];
+            };
             standard: {
                 fontWeight: string;
                 fontSize: string;
@@ -1284,57 +1313,61 @@ declare const componentOverrides: {
     };
     MuiAvatar: {
         defaultProps: import("../Components").DsAvatarProps;
-        variants: ({
-            props: Partial<import("../Components").DsAvatarProps>;
-            style: {
-                borderWidth: string;
-                borderStyle: string;
-                borderColor: string;
-                color: string;
-                backgroundColor: string;
-                fontWeight?: undefined;
-                fontSize?: undefined;
-                lineHeight?: undefined;
-                letterSpacing?: undefined;
-                width?: undefined;
-                height?: undefined;
-                '> .MuiIcon-root'?: undefined;
-            };
-        } | {
-            props: Partial<import("../Components").DsAvatarProps>;
-            style: {
-                color: string;
-                backgroundColor: string;
-                borderWidth?: undefined;
-                borderStyle?: undefined;
-                borderColor?: undefined;
-                fontWeight?: undefined;
-                fontSize?: undefined;
-                lineHeight?: undefined;
-                letterSpacing?: undefined;
-                width?: undefined;
-                height?: undefined;
-                '> .MuiIcon-root'?: undefined;
-            };
-        } | {
-            props: Partial<import("../Components").DsAvatarProps>;
-            style: {
-                fontWeight: string;
-                fontSize: string;
-                lineHeight: string;
-                letterSpacing: string;
-                width: string;
-                height: string;
-                '> .MuiIcon-root': {
-                    fontSize: string;
-                };
-                borderWidth?: undefined;
-                borderStyle?: undefined;
-                borderColor?: undefined;
-                color?: undefined;
-                backgroundColor?: undefined;
+        styleOverrides: {
+            root: {
+                variants: ({
+                    props: Partial<import("../Components").DsAvatarProps>;
+                    style: {
+                        borderWidth: string;
+                        borderStyle: string;
+                        borderColor: string;
+                        color: string;
+                        backgroundColor: string;
+                        fontWeight?: undefined;
+                        fontSize?: undefined;
+                        lineHeight?: undefined;
+                        letterSpacing?: undefined;
+                        width?: undefined;
+                        height?: undefined;
+                        '> .MuiIcon-root'?: undefined;
+                    };
+                } | {
+                    props: Partial<import("../Components").DsAvatarProps>;
+                    style: {
+                        color: string;
+                        backgroundColor: string;
+                        borderWidth?: undefined;
+                        borderStyle?: undefined;
+                        borderColor?: undefined;
+                        fontWeight?: undefined;
+                        fontSize?: undefined;
+                        lineHeight?: undefined;
+                        letterSpacing?: undefined;
+                        width?: undefined;
+                        height?: undefined;
+                        '> .MuiIcon-root'?: undefined;
+                    };
+                } | {
+                    props: Partial<import("../Components").DsAvatarProps>;
+                    style: {
+                        fontWeight: string;
+                        fontSize: string;
+                        lineHeight: string;
+                        letterSpacing: string;
+                        width: string;
+                        height: string;
+                        '> .MuiIcon-root': {
+                            fontSize: string;
+                        };
+                        borderWidth?: undefined;
+                        borderStyle?: undefined;
+                        borderColor?: undefined;
+                        color?: undefined;
+                        backgroundColor?: undefined;
+                    };
+                })[];
             };
-        })[];
+        };
     };
     MuiAutocomplete: {
         defaultProps: import("../Components").DsAutocompleteProps<any, boolean, boolean, boolean>;
@@ -1420,6 +1453,9 @@ declare const componentOverrides: {
             };
         };
     };
+    DsAddItem: {
+        defaultProps: Partial<import("../Components").DsAddItemProps>;
+    };
     MuiAccordionDetails: {
         styleOverrides: {
             root: {