@mdtl/uikit 0.0.6 → 0.0.7

package/dist/theme/controls/pickersTextField.d.ts

@@ -0,0 +1,446 @@
+export declare const pickersTextFieldConfig: {
+    variants: ({
+        style: {
+            overflow: string;
+            '& .MuiPickersSectionList-root': {
+                paddingLeft: number;
+                paddingRight: number;
+                paddingTop: number;
+                paddingBottom: number;
+                '& .MuiPickersSectionList-section': {
+                    fontFamily: string;
+                    fontSize: string;
+                    lineHeight: string;
+                    height: string;
+                };
+                fontSize?: undefined;
+                lineHeight?: undefined;
+            };
+            '& .MuiPickersInputBase-root .MuiPickersSectionList-root .MuiPickersSectionList-section .MuiPickersSectionList-sectionContent': {
+                lineHeight: string;
+                fontSize: string;
+                fontFamily: string;
+            };
+            '& .MuiInputAdornment-root': {
+                alignSelf: string;
+                '.MuiIconButton-root': {
+                    '&.clearButton': {
+                        padding: number;
+                        opacity: number;
+                        '& .MuiSvgIcon-root': {
+                            color: string;
+                        };
+                    };
+                    '& .MuiSvgIcon-root': {
+                        fontSize: number;
+                    };
+                };
+            };
+            '& .MuiInputAdornment-positionEnd': {
+                position: string;
+                right: number;
+            };
+            '& .MuiPickersInputBase-root': {
+                padding: number;
+                height: string;
+                border: string;
+                borderRadius: number;
+                '&.Mui-error': {
+                    borderColor: string;
+                };
+                '&.Mui-focused': {
+                    borderColor: string;
+                    '&.Mui-error': {
+                        borderColor: string;
+                    };
+                };
+                '&:before, &:hover:not(.Mui-disabled):before': {
+                    borderBottom: string;
+                };
+            };
+            '& .MuiPickersInputBase-root.Mui-focused': {
+                borderColor: string;
+            };
+            '& .MuiPickersInputBase-root:hover': {
+                borderColor: string;
+            };
+            '& .MuiInputAdornment-positionStart': {
+                marginLeft: number;
+            };
+            height?: undefined;
+            '& .Mui-focused .MuiPickersSectionList-root, & .MuiPickersSectionList-root:not([value=""])'?: undefined;
+            '& .MuiInputAdornment-root .MuiIconButton-root .MuiSvgIcon-root'?: undefined;
+            '.MuiInputAdornment-root .MuiIconButton-root .MuiSvgIcon-root'?: undefined;
+            '&.Mui-focused'?: undefined;
+            '&.MuiPickersTextField-root.Mui-focused'?: undefined;
+            variants?: undefined;
+            fontSize?: undefined;
+            lineHeight?: undefined;
+            '& .MuiInputBase-root'?: undefined;
+            '& .MuiPickersFilledInput-root'?: undefined;
+            '& .MuiPickersInputBase-input:not(:focus):placeholder-shown'?: undefined;
+        };
+        props?: undefined;
+    } | {
+        props: {
+            size: string;
+            variant?: undefined;
+            disabled?: undefined;
+            error?: undefined;
+        };
+        style: {
+            height: number;
+            '& .MuiPickersSectionList-root': {
+                paddingLeft: number;
+                fontSize: string;
+                lineHeight: string;
+                paddingRight?: undefined;
+                paddingTop?: undefined;
+                paddingBottom?: undefined;
+                '& .MuiPickersSectionList-section'?: undefined;
+            };
+            '& .Mui-focused .MuiPickersSectionList-root, & .MuiPickersSectionList-root:not([value=""])': {
+                paddingTop: number;
+            };
+            '& .MuiInputAdornment-root .MuiIconButton-root .MuiSvgIcon-root': {
+                fontSize: number;
+            };
+            overflow?: undefined;
+            '& .MuiPickersInputBase-root .MuiPickersSectionList-root .MuiPickersSectionList-section .MuiPickersSectionList-sectionContent'?: undefined;
+            '& .MuiInputAdornment-root'?: undefined;
+            '& .MuiInputAdornment-positionEnd'?: undefined;
+            '& .MuiPickersInputBase-root'?: undefined;
+            '& .MuiPickersInputBase-root.Mui-focused'?: undefined;
+            '& .MuiPickersInputBase-root:hover'?: undefined;
+            '& .MuiInputAdornment-positionStart'?: undefined;
+            '.MuiInputAdornment-root .MuiIconButton-root .MuiSvgIcon-root'?: undefined;
+            '&.Mui-focused'?: undefined;
+            '&.MuiPickersTextField-root.Mui-focused'?: undefined;
+            variants?: undefined;
+            fontSize?: undefined;
+            lineHeight?: undefined;
+            '& .MuiInputBase-root'?: undefined;
+            '& .MuiPickersFilledInput-root'?: undefined;
+            '& .MuiPickersInputBase-input:not(:focus):placeholder-shown'?: undefined;
+        };
+    } | {
+        props: {
+            size: string;
+            variant?: undefined;
+            disabled?: undefined;
+            error?: undefined;
+        };
+        style: {
+            height: number;
+            '& .MuiPickersSectionList-root': {
+                paddingLeft: number;
+                paddingRight?: undefined;
+                paddingTop?: undefined;
+                paddingBottom?: undefined;
+                '& .MuiPickersSectionList-section'?: undefined;
+                fontSize?: undefined;
+                lineHeight?: undefined;
+            };
+            '& .Mui-focused .MuiPickersSectionList-root, & .MuiPickersSectionList-root:not([value=""])': {
+                paddingTop: number;
+            };
+            '& .MuiInputAdornment-root .MuiIconButton-root .MuiSvgIcon-root': {
+                fontSize: number;
+            };
+            overflow?: undefined;
+            '& .MuiPickersInputBase-root .MuiPickersSectionList-root .MuiPickersSectionList-section .MuiPickersSectionList-sectionContent'?: undefined;
+            '& .MuiInputAdornment-root'?: undefined;
+            '& .MuiInputAdornment-positionEnd'?: undefined;
+            '& .MuiPickersInputBase-root'?: undefined;
+            '& .MuiPickersInputBase-root.Mui-focused'?: undefined;
+            '& .MuiPickersInputBase-root:hover'?: undefined;
+            '& .MuiInputAdornment-positionStart'?: undefined;
+            '.MuiInputAdornment-root .MuiIconButton-root .MuiSvgIcon-root'?: undefined;
+            '&.Mui-focused'?: undefined;
+            '&.MuiPickersTextField-root.Mui-focused'?: undefined;
+            variants?: undefined;
+            fontSize?: undefined;
+            lineHeight?: undefined;
+            '& .MuiInputBase-root'?: undefined;
+            '& .MuiPickersFilledInput-root'?: undefined;
+            '& .MuiPickersInputBase-input:not(:focus):placeholder-shown'?: undefined;
+        };
+    } | {
+        props: {
+            size: string;
+            variant?: undefined;
+            disabled?: undefined;
+            error?: undefined;
+        };
+        style: {
+            height: number;
+            '& .MuiPickersSectionList-root': {
+                paddingLeft: number;
+                paddingRight?: undefined;
+                paddingTop?: undefined;
+                paddingBottom?: undefined;
+                '& .MuiPickersSectionList-section'?: undefined;
+                fontSize?: undefined;
+                lineHeight?: undefined;
+            };
+            '& .Mui-focused .MuiPickersSectionList-root, & .MuiPickersSectionList-root:not([value=""])': {
+                paddingTop: number;
+            };
+            overflow?: undefined;
+            '& .MuiPickersInputBase-root .MuiPickersSectionList-root .MuiPickersSectionList-section .MuiPickersSectionList-sectionContent'?: undefined;
+            '& .MuiInputAdornment-root'?: undefined;
+            '& .MuiInputAdornment-positionEnd'?: undefined;
+            '& .MuiPickersInputBase-root'?: undefined;
+            '& .MuiPickersInputBase-root.Mui-focused'?: undefined;
+            '& .MuiPickersInputBase-root:hover'?: undefined;
+            '& .MuiInputAdornment-positionStart'?: undefined;
+            '& .MuiInputAdornment-root .MuiIconButton-root .MuiSvgIcon-root'?: undefined;
+            '.MuiInputAdornment-root .MuiIconButton-root .MuiSvgIcon-root'?: undefined;
+            '&.Mui-focused'?: undefined;
+            '&.MuiPickersTextField-root.Mui-focused'?: undefined;
+            variants?: undefined;
+            fontSize?: undefined;
+            lineHeight?: undefined;
+            '& .MuiInputBase-root'?: undefined;
+            '& .MuiPickersFilledInput-root'?: undefined;
+            '& .MuiPickersInputBase-input:not(:focus):placeholder-shown'?: undefined;
+        };
+    } | {
+        props: {
+            size: string;
+            variant?: undefined;
+            disabled?: undefined;
+            error?: undefined;
+        };
+        style: {
+            height: number;
+            '& .MuiPickersSectionList-root': {
+                paddingLeft: number;
+                paddingRight?: undefined;
+                paddingTop?: undefined;
+                paddingBottom?: undefined;
+                '& .MuiPickersSectionList-section'?: undefined;
+                fontSize?: undefined;
+                lineHeight?: undefined;
+            };
+            '.MuiInputAdornment-root .MuiIconButton-root .MuiSvgIcon-root': {
+                fontSize: number;
+            };
+            '&.Mui-focused': {
+                '.MuiFormLabel-root': {
+                    visibility: string;
+                };
+            };
+            '&.MuiPickersTextField-root.Mui-focused': {
+                '& .MuiFormLabel-root, & .MuiInputLabel-root': {
+                    visibility: string;
+                };
+            };
+            overflow?: undefined;
+            '& .MuiPickersInputBase-root .MuiPickersSectionList-root .MuiPickersSectionList-section .MuiPickersSectionList-sectionContent'?: undefined;
+            '& .MuiInputAdornment-root'?: undefined;
+            '& .MuiInputAdornment-positionEnd'?: undefined;
+            '& .MuiPickersInputBase-root'?: undefined;
+            '& .MuiPickersInputBase-root.Mui-focused'?: undefined;
+            '& .MuiPickersInputBase-root:hover'?: undefined;
+            '& .MuiInputAdornment-positionStart'?: undefined;
+            '& .Mui-focused .MuiPickersSectionList-root, & .MuiPickersSectionList-root:not([value=""])'?: undefined;
+            '& .MuiInputAdornment-root .MuiIconButton-root .MuiSvgIcon-root'?: undefined;
+            variants?: undefined;
+            fontSize?: undefined;
+            lineHeight?: undefined;
+            '& .MuiInputBase-root'?: undefined;
+            '& .MuiPickersFilledInput-root'?: undefined;
+            '& .MuiPickersInputBase-input:not(:focus):placeholder-shown'?: undefined;
+        };
+    } | {
+        props: {
+            size: string;
+            variant?: undefined;
+            disabled?: undefined;
+            error?: undefined;
+        };
+        style: {
+            height: number;
+            variants: {
+                fontWeight: number;
+                fontSize: string;
+                lineHeight: string;
+            };
+            fontSize: string;
+            lineHeight: string;
+            '& .MuiPickersSectionList-root': {
+                fontSize: string;
+                lineHeight: string;
+                paddingLeft: number;
+                paddingRight?: undefined;
+                paddingTop?: undefined;
+                paddingBottom?: undefined;
+                '& .MuiPickersSectionList-section'?: undefined;
+            };
+            '& .MuiInputBase-root': {
+                borderRadius: number;
+            };
+            '&.MuiPickersTextField-root.Mui-focused': {
+                '& .MuiFormLabel-root, & .MuiInputLabel-root': {
+                    visibility: string;
+                };
+            };
+            overflow?: undefined;
+            '& .MuiPickersInputBase-root .MuiPickersSectionList-root .MuiPickersSectionList-section .MuiPickersSectionList-sectionContent'?: undefined;
+            '& .MuiInputAdornment-root'?: undefined;
+            '& .MuiInputAdornment-positionEnd'?: undefined;
+            '& .MuiPickersInputBase-root'?: undefined;
+            '& .MuiPickersInputBase-root.Mui-focused'?: undefined;
+            '& .MuiPickersInputBase-root:hover'?: undefined;
+            '& .MuiInputAdornment-positionStart'?: undefined;
+            '& .Mui-focused .MuiPickersSectionList-root, & .MuiPickersSectionList-root:not([value=""])'?: undefined;
+            '& .MuiInputAdornment-root .MuiIconButton-root .MuiSvgIcon-root'?: undefined;
+            '.MuiInputAdornment-root .MuiIconButton-root .MuiSvgIcon-root'?: undefined;
+            '&.Mui-focused'?: undefined;
+            '& .MuiPickersFilledInput-root'?: undefined;
+            '& .MuiPickersInputBase-input:not(:focus):placeholder-shown'?: undefined;
+        };
+    } | {
+        props: {
+            variant: string;
+            disabled: boolean;
+            size?: undefined;
+            error?: undefined;
+        };
+        style: {
+            '& .MuiPickersFilledInput-root': {
+                backgroundColor: string;
+                '&:hover': {
+                    borderColor: string;
+                    backgroundColor: string;
+                };
+                '&:before, &:after, &:hover:before': {
+                    borderBottom: string;
+                    borderBottomStyle: string;
+                };
+                '&.Mui-focused': {
+                    backgroundColor: string;
+                };
+                color?: undefined;
+                '&.Mui-focused, &:hover'?: undefined;
+            };
+            '& .MuiPickersInputBase-input:not(:focus):placeholder-shown': {
+                color: string;
+            };
+            overflow?: undefined;
+            '& .MuiPickersSectionList-root'?: undefined;
+            '& .MuiPickersInputBase-root .MuiPickersSectionList-root .MuiPickersSectionList-section .MuiPickersSectionList-sectionContent'?: undefined;
+            '& .MuiInputAdornment-root'?: undefined;
+            '& .MuiInputAdornment-positionEnd'?: undefined;
+            '& .MuiPickersInputBase-root'?: undefined;
+            '& .MuiPickersInputBase-root.Mui-focused'?: undefined;
+            '& .MuiPickersInputBase-root:hover'?: undefined;
+            '& .MuiInputAdornment-positionStart'?: undefined;
+            height?: undefined;
+            '& .Mui-focused .MuiPickersSectionList-root, & .MuiPickersSectionList-root:not([value=""])'?: undefined;
+            '& .MuiInputAdornment-root .MuiIconButton-root .MuiSvgIcon-root'?: undefined;
+            '.MuiInputAdornment-root .MuiIconButton-root .MuiSvgIcon-root'?: undefined;
+            '&.Mui-focused'?: undefined;
+            '&.MuiPickersTextField-root.Mui-focused'?: undefined;
+            variants?: undefined;
+            fontSize?: undefined;
+            lineHeight?: undefined;
+            '& .MuiInputBase-root'?: undefined;
+        };
+    } | {
+        props: {
+            disabled: boolean;
+            size?: undefined;
+            variant?: undefined;
+            error?: undefined;
+        };
+        style: {
+            '& .MuiPickersFilledInput-root': {
+                color: string;
+                '&:before, &:after, &:hover:before': {
+                    borderBottom: string;
+                    borderBottomStyle: string;
+                };
+                backgroundColor?: undefined;
+                '&:hover'?: undefined;
+                '&.Mui-focused'?: undefined;
+                '&.Mui-focused, &:hover'?: undefined;
+            };
+            overflow?: undefined;
+            '& .MuiPickersSectionList-root'?: undefined;
+            '& .MuiPickersInputBase-root .MuiPickersSectionList-root .MuiPickersSectionList-section .MuiPickersSectionList-sectionContent'?: undefined;
+            '& .MuiInputAdornment-root'?: undefined;
+            '& .MuiInputAdornment-positionEnd'?: undefined;
+            '& .MuiPickersInputBase-root'?: undefined;
+            '& .MuiPickersInputBase-root.Mui-focused'?: undefined;
+            '& .MuiPickersInputBase-root:hover'?: undefined;
+            '& .MuiInputAdornment-positionStart'?: undefined;
+            height?: undefined;
+            '& .Mui-focused .MuiPickersSectionList-root, & .MuiPickersSectionList-root:not([value=""])'?: undefined;
+            '& .MuiInputAdornment-root .MuiIconButton-root .MuiSvgIcon-root'?: undefined;
+            '.MuiInputAdornment-root .MuiIconButton-root .MuiSvgIcon-root'?: undefined;
+            '&.Mui-focused'?: undefined;
+            '&.MuiPickersTextField-root.Mui-focused'?: undefined;
+            variants?: undefined;
+            fontSize?: undefined;
+            lineHeight?: undefined;
+            '& .MuiInputBase-root'?: undefined;
+            '& .MuiPickersInputBase-input:not(:focus):placeholder-shown'?: undefined;
+        };
+    } | {
+        props: {
+            error: boolean;
+            size?: undefined;
+            variant?: undefined;
+            disabled?: undefined;
+        };
+        style: {
+            '& .MuiPickersFilledInput-root': {
+                backgroundColor: string;
+                '&.Mui-focused, &:hover': {
+                    backgroundColor: string;
+                };
+                '&:hover'?: undefined;
+                '&:before, &:after, &:hover:before'?: undefined;
+                '&.Mui-focused'?: undefined;
+                color?: undefined;
+            };
+            '& .MuiPickersInputBase-root': {
+                '&.Mui-error': {
+                    borderColor: string;
+                };
+                '&.Mui-focused': {
+                    '&.Mui-error': {
+                        borderColor: string;
+                    };
+                    borderColor?: undefined;
+                };
+                padding?: undefined;
+                height?: undefined;
+                border?: undefined;
+                borderRadius?: undefined;
+                '&:before, &:hover:not(.Mui-disabled):before'?: undefined;
+            };
+            overflow?: undefined;
+            '& .MuiPickersSectionList-root'?: undefined;
+            '& .MuiPickersInputBase-root .MuiPickersSectionList-root .MuiPickersSectionList-section .MuiPickersSectionList-sectionContent'?: undefined;
+            '& .MuiInputAdornment-root'?: undefined;
+            '& .MuiInputAdornment-positionEnd'?: undefined;
+            '& .MuiPickersInputBase-root.Mui-focused'?: undefined;
+            '& .MuiPickersInputBase-root:hover'?: undefined;
+            '& .MuiInputAdornment-positionStart'?: undefined;
+            height?: undefined;
+            '& .Mui-focused .MuiPickersSectionList-root, & .MuiPickersSectionList-root:not([value=""])'?: undefined;
+            '& .MuiInputAdornment-root .MuiIconButton-root .MuiSvgIcon-root'?: undefined;
+            '.MuiInputAdornment-root .MuiIconButton-root .MuiSvgIcon-root'?: undefined;
+            '&.Mui-focused'?: undefined;
+            '&.MuiPickersTextField-root.Mui-focused'?: undefined;
+            variants?: undefined;
+            fontSize?: undefined;
+            lineHeight?: undefined;
+            '& .MuiInputBase-root'?: undefined;
+            '& .MuiPickersInputBase-input:not(:focus):placeholder-shown'?: undefined;
+        };
+    })[];
+};

package/dist/theme/controls/shared/controlConfigs.d.ts

@@ -0,0 +1,100 @@
+type CheckConfig = {
+    icon: React.ReactNode;
+    checkedIcon: React.ReactNode;
+    indeterminateIcon?: React.ReactNode;
+};
+export declare const createCheckConfig: ({ icon, checkedIcon, indeterminateIcon }: CheckConfig) => {
+    defaultProps: {
+        indeterminateIcon: string | number | bigint | true | import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>> | Iterable<import('react').ReactNode> | import('react').ReactPortal | Promise<string | number | bigint | boolean | import('react').ReactPortal | import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>> | Iterable<import('react').ReactNode>>;
+        disableRipple: boolean;
+        disableFocusRipple: boolean;
+        disableTouchRipple: boolean;
+        icon: import('react').ReactNode;
+        checkedIcon: import('react').ReactNode;
+    };
+    variants: ({
+        props: {
+            color: string;
+            size?: undefined;
+        };
+        style: {
+            color: string;
+            '&:hover': {
+                color: string;
+            };
+            '&.Mui-checked': {
+                color: string;
+                '&:hover': {
+                    color: string;
+                };
+            };
+            '&.MuiCheckbox-indeterminate': {
+                color: string;
+                '&:hover': {
+                    color: string;
+                };
+            };
+            '&.Mui-disabled': {
+                color: string;
+            };
+            padding?: undefined;
+            '& .MuiSvgIcon-root'?: undefined;
+        };
+    } | {
+        props: {
+            color: string;
+            size?: undefined;
+        };
+        style: {
+            color: string;
+            '&:hover': {
+                color: string;
+            };
+            '&.Mui-checked': {
+                color: string;
+                '&:hover': {
+                    color: string;
+                };
+            };
+            '&.Mui-disabled': {
+                color: string;
+            };
+            '&.MuiCheckbox-indeterminate'?: undefined;
+            padding?: undefined;
+            '& .MuiSvgIcon-root'?: undefined;
+        };
+    } | {
+        props: {
+            size: string;
+            color?: undefined;
+        };
+        style: {
+            padding: string;
+            '& .MuiSvgIcon-root': {
+                fontSize: number;
+            };
+            color?: undefined;
+            '&:hover'?: undefined;
+            '&.Mui-checked'?: undefined;
+            '&.MuiCheckbox-indeterminate'?: undefined;
+            '&.Mui-disabled'?: undefined;
+        };
+    } | {
+        props: {
+            size: string;
+            color?: undefined;
+        };
+        style: {
+            '& .MuiSvgIcon-root': {
+                fontSize: number;
+            };
+            color?: undefined;
+            '&:hover'?: undefined;
+            '&.Mui-checked'?: undefined;
+            '&.MuiCheckbox-indeterminate'?: undefined;
+            '&.Mui-disabled'?: undefined;
+            padding?: undefined;
+        };
+    })[];
+};
+export {};

package/dist/theme/controls/stepIcon.d.ts

@@ -0,0 +1,10 @@
+export declare const stepIconConfig: {
+    styleOverrides: {
+        root: {
+            color: string;
+        };
+        text: {
+            fontSize: string;
+        };
+    };
+};

package/dist/theme/controls/stepLabel.d.ts

@@ -0,0 +1,11 @@
+export declare const stepLabelConfig: {
+    styleOverrides: {
+        label: {
+            fontWeight: number;
+            color: string;
+            '&.Mui-active': {
+                fontWeight: number;
+            };
+        };
+    };
+};

package/dist/theme/controls/svgIcon.d.ts

@@ -0,0 +1,13 @@
+export declare const iconsConfig: {
+    defaultProps: {
+        fontSize: string;
+    };
+    variants: {
+        props: {
+            fontSize: string;
+        };
+        style: {
+            fontSize: number;
+        };
+    }[];
+};

package/dist/theme/controls/tab.d.ts

@@ -0,0 +1,25 @@
+export declare const tabConfig: {
+    defaultProps: {
+        disableRipple: boolean;
+        disableFocusRipple: boolean;
+        disableTouchRipple: boolean;
+    };
+    styleOverrides: {
+        root: {
+            textTransform: string;
+            minHeight: number;
+            fontFamily: string;
+            fontSize: string;
+            fontWeight: number;
+            lineHeight: string;
+            color: string;
+            maxWidth: string;
+            '&.Mui-selected': {
+                color: string;
+                fontSize: string;
+                fontWeight: number;
+                lineHeight: string;
+            };
+        };
+    };
+};

package/dist/theme/controls/table.d.ts

@@ -0,0 +1,7 @@
+export declare const tableConfig: {
+    styleOverrides: {
+        root: {
+            borderCollapse: string;
+        };
+    };
+};

package/dist/theme/controls/tableCell.d.ts

@@ -0,0 +1,24 @@
+export declare const tableCellConfig: {
+    styleOverrides: {
+        root: {
+            height: number;
+            padding: string;
+            borderBottom: string;
+            '& .MuiInputBase-input': {
+                height: string;
+                boxSizing: string;
+            };
+            '&[data-pinned="true"]': {
+                background: string;
+            };
+            '&[data-grouped="true"]': {
+                background: string;
+                fontWeight: number;
+            };
+        };
+        paddingCheckbox: {
+            paddingTop: string;
+            paddingBottom: string;
+        };
+    };
+};

package/dist/theme/controls/tableRow.d.ts

@@ -0,0 +1,42 @@
+export declare const tableRowConfig: {
+    styleOverrides: {
+        root: {
+            height: number;
+            position: string;
+            background: string;
+            '&:hover': {
+                background: string;
+                '& [data-pinned="true"]': {
+                    background: string;
+                };
+                '[data-grouped="true"]': {
+                    background: string;
+                };
+                '[data-dragover="true"]': {
+                    background: string;
+                };
+            };
+            '[data-dragover="true"]': {
+                background: string;
+            };
+            '[data-grouped="true"]': {
+                background: string;
+            };
+            '&.Mui-selected': {
+                background: string;
+                '&:hover': {
+                    background: string;
+                };
+                '& [data-pinned="true"]': {
+                    background: string;
+                };
+                '[data-grouped="true"]': {
+                    background: string;
+                };
+                '[data-dragover="true"]': {
+                    background: string;
+                };
+            };
+        };
+    };
+};