@selfcommunity/react-theme-default 0.1.0-alpha.30 → 0.1.0-alpha.301

package/lib/cjs/components/SCPrivateMessageSnippets.d.ts

@@ -1,20 +1,45 @@
 declare const Component: {
     styleOverrides: {
         root: ({ theme }: any) => {
-            height: any;
-            maxHeight: string;
+            height: string;
+            width: string;
             '& .MuiCardContent-root': {
                 display: string;
                 flexDirection: string;
-                maxHeight: any;
-                overflow: string;
+                height: string;
+                padding: any;
+                '& .SCPrivateMessageSnippets-search-bar': {
+                    padding: any;
+                    '& .SCPrivateMessageSnippets-input': {
+                        borderRadius: any;
+                        '& .MuiInputBase-input, MuiFilledInput-input': {
+                            padding: any;
+                        };
+                        '& .SCPrivateMessageSnippets-icon': {
+                            marginRight: any;
+                        };
+                    };
+                };
+                '& .SCPrivateMessageSnippets-new-message-button': {
+                    color: string;
+                    alignSelf: string;
+                    backgroundColor: string;
+                    '&:hover': {
+                        borderWidth: string;
+                        backgroundColor: any;
+                    };
+                };
                 '& .MuiList-root': {
-                    '&:last-child': {
-                        marginBottom: any;
+                    flexGrow: number;
+                    overflowY: string;
+                    padding: any;
+                    '& .Mui-selected': {
+                        backgroundColor: any;
                     };
                     '& .MuiButtonBase-root, MuiListItemButton-root': {
                         '&:hover': {
                             borderRadius: string;
+                            backgroundColor: any;
                         };
                     };
                 };
@@ -22,27 +47,7 @@ declare const Component: {
             '& .MuiPaper-root, MuiCard-root, SCWidget-root, SCPrivateMessageSnippets-root, MuiCardContent-root': {
                 padding: any;
             };
-            '& .Mui-selected': {
-                background: any;
-            };
-            '& .SCPrivateMessageSnippets-input': {
-                borderRadius: any;
-                height: any;
-                '& .SCPrivateMessageSnippets-icon': {
-                    marginRight: any;
-                };
-            };
-            '& .SCPrivateMessageSnippets-new-message-button': {
-                color: string;
-                alignSelf: string;
-                backgroundColor: string;
-                '&:hover': {
-                    borderWidth: string;
-                    backgroundColor: string;
-                };
-            };
         };
     };
 };
 export default Component;
-//# sourceMappingURL=SCPrivateMessageSnippets.d.ts.map

package/lib/cjs/components/SCPrivateMessageSnippets.js

@@ -3,46 +3,50 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const Component = {
     styleOverrides: {
         root: ({ theme }) => ({
-            height: theme.spacing(103.5),
-            maxHeight: 'inherit',
+            height: '100%',
+            width: '100%',
             '& .MuiCardContent-root': {
                 display: 'flex',
                 flexDirection: 'column',
-                maxHeight: theme.spacing(103.5),
-                overflow: 'auto',
+                height: `calc(100% - ${theme.spacing(4)})`,
+                padding: theme.spacing(2),
+                '& .SCPrivateMessageSnippets-search-bar': {
+                    padding: theme.spacing(1),
+                    '& .SCPrivateMessageSnippets-input': {
+                        borderRadius: theme.shape.borderRadius,
+                        '& .MuiInputBase-input, MuiFilledInput-input': {
+                            padding: theme.spacing(0.5, 1)
+                        },
+                        '& .SCPrivateMessageSnippets-icon': {
+                            marginRight: theme.spacing(1)
+                        }
+                    }
+                },
+                '& .SCPrivateMessageSnippets-new-message-button': {
+                    color: `${theme.palette.primary.main} !important`,
+                    alignSelf: 'center',
+                    backgroundColor: 'transparent',
+                    '&:hover': {
+                        borderWidth: '2px !important',
+                        backgroundColor: theme.palette.grey['A200']
+                    }
+                },
                 '& .MuiList-root': {
-                    '&:last-child': {
-                        marginBottom: theme.spacing(2)
+                    flexGrow: 1,
+                    overflowY: 'auto',
+                    padding: theme.spacing(1),
+                    '& .Mui-selected': {
+                        backgroundColor: theme.palette.grey['A200']
                     },
                     '& .MuiButtonBase-root, MuiListItemButton-root': {
-                        '&:hover': { borderRadius: 'inherit' }
+                        '&:hover': { borderRadius: 'inherit', backgroundColor: theme.palette.grey['A200'] }
                     }
                 }
             },
             '& .MuiPaper-root, MuiCard-root, SCWidget-root, SCPrivateMessageSnippets-root, MuiCardContent-root': {
                 padding: theme.spacing(2)
-            },
-            '& .Mui-selected': {
-                background: theme.palette.action.selected
-            },
-            '& .SCPrivateMessageSnippets-input': {
-                borderRadius: theme.shape.borderRadius,
-                height: theme.spacing(3.75),
-                '& .SCPrivateMessageSnippets-icon': {
-                    marginRight: theme.spacing(1)
-                }
-            },
-            '& .SCPrivateMessageSnippets-new-message-button': {
-                color: `${theme.palette.primary.main} !important`,
-                alignSelf: 'center',
-                backgroundColor: 'transparent',
-                '&:hover': {
-                    borderWidth: '2px !important',
-                    backgroundColor: `${theme.palette.action.hover} !important`
-                }
             }
         })
     }
 };
 exports.default = Component;
-//# sourceMappingURL=SCPrivateMessageSnippets.js.map

package/lib/cjs/components/SCPrivateMessageThread.d.ts

@@ -1,78 +1,121 @@
 declare const Component: {
     styleOverrides: {
         root: ({ theme }: any) => {
-            backgroundColor: any;
-            position: string;
-            height: any;
-            maxHeight: string;
+            height: string;
+            width: string;
+            backgroundColor: string;
+            borderRadius: number;
             '& .MuiCardContent-root': {
+                display: string;
+                flexDirection: string;
                 height: string;
-                maxHeight: string;
-                overflow: string;
-                '& .MuiList-root': {
-                    [x: number]: {
-                        marginTop: any;
-                    };
-                    '& .MuiListItem-root': {
-                        '&.SCPrivateMessageThread-receiver': {
-                            backgroundColor: any;
-                            marginLeft: any;
-                            filter: string;
-                            '&:after': {
-                                marginRight: any;
-                                content: string;
+                padding: number;
+                position: string;
+                '& .MuiAlert-root': {
+                    position: string;
+                    bottom: number;
+                    left: number;
+                    right: number;
+                    display: string;
+                    justifyContent: string;
+                    borderRadius: number;
+                };
+                '& .infinite-scroll-component__outerdiv': {
+                    flexGrow: number;
+                    overflowY: string;
+                    '& .infinite-scroll-component': {
+                        display: string;
+                        flexDirection: string;
+                        '& .MuiList-root': {
+                            margin: number;
+                            padding: any;
+                            '& .MuiListItem-root': {
+                                padding: any;
+                                minWidth: string;
+                                maxWidth: string;
+                                textAlign: string;
+                                width: string;
                                 position: string;
-                                border: string;
-                                borderTop: string;
-                                top: number;
-                                left: any;
+                                marginBottom: any;
+                                '&.SCPrivateMessageThread-receiver': {
+                                    backgroundColor: any;
+                                    marginLeft: any;
+                                    filter: string;
+                                    '&:after': {
+                                        marginRight: any;
+                                        content: string;
+                                        position: string;
+                                        border: string;
+                                        borderTop: string;
+                                        top: any;
+                                        left: any;
+                                    };
+                                };
+                                '&.SCPrivateMessageThread-sender': {
+                                    backgroundColor: any;
+                                    position: string;
+                                    marginLeft: string;
+                                    marginRight: any;
+                                    '&:after': {
+                                        content: string;
+                                        position: string;
+                                        border: string;
+                                        borderTop: string;
+                                        top: any;
+                                        right: any;
+                                    };
+                                };
                             };
                         };
-                        '&.SCPrivateMessageThread-sender': {
-                            backgroundColor: any;
-                        };
                     };
                 };
             };
             '& .SCPrivateMessageThread-empty-message': {
-                position: string;
-                top: string;
+                height: string;
                 display: string;
                 justifyContent: string;
+                alignItems: string;
                 fontSize: string;
             };
             '& .SCPrivateMessageThread-new-message-header': {
-                position: string;
-                top: number;
-                right: number;
                 display: string;
                 width: string;
                 height: any;
                 alignItems: string;
                 justifyContent: string;
-                backgroundColor: any;
+                backgroundColor: string;
                 '& .SCPrivateMessageThread-new-message-header-content': {
                     display: string;
                     alignItems: string;
                     width: string;
-                    maxHeight: any;
-                    overflow: string;
                     backgroundColor: any;
                     borderRadius: any;
                     marginRight: any;
                     '& .SCPrivateMessageThread-new-message-header-icon': {
                         fontSize: string;
+                        marginLeft: any;
                     };
                     '& .MuiIcon-root': {
                         color: any;
-                        padding: any;
                     };
                     '& .MuiTypography-root': {
                         color: any;
+                        marginLeft: any;
                     };
                     '& .SCPrivateMessageThread-autocomplete': {
-                        minWidth: any;
+                        [x: number]: {
+                            maxHeight: any;
+                        };
+                        width: string;
                         marginLeft: any;
+                        maxHeight: any;
+                        overflow: string;
+                        '& .MuiAutocomplete-tag': {
+                            height: any;
+                            '& .MuiChip-deleteIcon': {
+                                fontSize: string;
+                            };
+                        };
                         '& .MuiAutocomplete-endAdornment': {
                             position: string;
                             '& .MuiAutocomplete-clearIndicator': {
@@ -89,6 +132,7 @@ declare const Component: {
                 marginBottom: any;
                 '& .SCPrivateMessageThread-subheader': {
                     width: string;
+                    minWidth: number;
                     padding: any;
                     backgroundColor: string;
                     fontWeight: any;
@@ -96,47 +140,10 @@ declare const Component: {
                     boxShadow: string;
                 };
             };
-            '& .SCPrivateMessageThreadItem-root': {
-                borderRadius: any;
-                paddingTop: string;
-                paddingBottom: string;
-                paddingRight: string;
-                paddingLeft: string;
-                '& .MuiListItemSecondaryAction-root': {
-                    right: any;
-                    top: any;
-                };
-                '& .SCPrivateMessageThreadItem-message-time': {
-                    position: string;
-                    bottom: any;
-                    right: any;
-                };
-                '& .SCPrivateMessageThreadItem-text': {
-                    minHeight: any;
-                    display: string;
-                    alignItems: string;
-                    '& .MuiTypography-root': {
-                        fontSize: string;
-                    };
-                };
-                '& .SCPrivateMessageThreadItem-img': {
-                    display: string;
-                    alignItems: string;
-                    '& img': {
-                        [x: number]: {
-                            minHeight: number;
-                        };
-                        width: string;
-                        minHeight: number;
-                    };
-                };
-                '& .SCPrivateMessageThreadItem-document': {
-                    display: string;
-                    alignItems: string;
-                };
+            '& .MuiList-root, .SCPrivateMessageThread-new-message-content': {
+                flexGrow: number;
             };
         };
     };
 };
 export default Component;
-//# sourceMappingURL=SCPrivateMessageThread.d.ts.map

package/lib/cjs/components/SCPrivateMessageThread.js

@@ -1,80 +1,124 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+const system_1 = require("@mui/system");
 const Component = {
     styleOverrides: {
         root: ({ theme }) => ({
-            backgroundColor: theme.palette.action.hover,
-            position: 'relative',
-            height: theme.spacing(103.5),
-            maxHeight: 'inherit',
+            height: '100%',
+            width: '100%',
+            backgroundColor: (0, system_1.alpha)(theme.palette.common.white, theme.palette.action.selectedOpacity),
+            borderRadius: 0,
             '& .MuiCardContent-root': {
+                display: 'flex',
+                flexDirection: 'column',
                 height: '100%',
-                maxHeight: `calc(100% - ${theme.spacing(10)})`,
-                overflow: 'auto',
-                '& .MuiList-root': {
-                    [theme.breakpoints.down('md')]: {
-                        marginTop: theme.spacing(2)
-                    },
-                    '& .MuiListItem-root': {
-                        '&.SCPrivateMessageThread-receiver': {
-                            backgroundColor: theme.palette.common.white,
-                            marginLeft: theme.spacing(-2),
-                            filter: 'drop-shadow(0px 0px 10px rgba(0, 0, 0, 0.1))',
-                            '&:after': {
-                                marginRight: theme.spacing(3),
-                                content: `""`,
-                                position: 'absolute',
-                                border: `${theme.spacing(3)} solid transparent`,
-                                borderTop: `${theme.spacing(3)} solid ${theme.palette.common.white}`,
-                                top: 0,
-                                left: theme.spacing(-3)
+                padding: 0,
+                position: 'relative',
+                '& .MuiAlert-root': {
+                    position: 'absolute',
+                    bottom: 0,
+                    left: 0,
+                    right: 0,
+                    display: 'flex',
+                    justifyContent: 'center',
+                    borderRadius: 0
+                },
+                '& .infinite-scroll-component__outerdiv': {
+                    flexGrow: 1,
+                    overflowY: 'auto',
+                    '& .infinite-scroll-component': {
+                        display: 'flex',
+                        flexDirection: 'column-reverse',
+                        '& .MuiList-root': {
+                            margin: 0,
+                            padding: theme.spacing(2, 2, 0, 2),
+                            '& .MuiListItem-root': {
+                                padding: theme.spacing(1, 1, 4, 2),
+                                minWidth: '35%',
+                                maxWidth: '80%',
+                                textAlign: 'left',
+                                width: 'fit-content',
+                                position: 'relative',
+                                marginBottom: theme.spacing(1),
+                                '&.SCPrivateMessageThread-receiver': {
+                                    backgroundColor: theme.palette.common.white,
+                                    marginLeft: theme.spacing(-4),
+                                    filter: 'drop-shadow(0px 0px 10px rgba(0, 0, 0, 0.1))',
+                                    '&:after': {
+                                        marginRight: theme.spacing(3),
+                                        content: `""`,
+                                        position: 'absolute',
+                                        border: `${theme.spacing(3)} solid transparent`,
+                                        borderTop: `${theme.spacing(3)} solid ${theme.palette.common.white}`,
+                                        top: theme.spacing(1),
+                                        left: theme.spacing(-2)
+                                    }
+                                },
+                                '&.SCPrivateMessageThread-sender': {
+                                    backgroundColor: theme.palette.grey[300],
+                                    position: 'relative',
+                                    marginLeft: 'auto',
+                                    marginRight: theme.spacing(1),
+                                    '&:after': {
+                                        content: `""`,
+                                        position: 'absolute',
+                                        border: `${theme.spacing(3)} solid transparent`,
+                                        borderTop: `${theme.spacing(3)} solid ${theme.palette.grey[300]}`,
+                                        top: theme.spacing(1),
+                                        right: theme.spacing(-2)
+                                    }
+                                }
                             }
-                        },
-                        '&.SCPrivateMessageThread-sender': {
-                            backgroundColor: theme.palette.primary.main
                         }
                     }
                 }
             },
             '& .SCPrivateMessageThread-empty-message': {
-                position: 'relative',
-                top: '50%',
+                height: '100%',
                 display: 'flex',
                 justifyContent: 'center',
+                alignItems: 'center',
                 fontSize: '1.5rem'
             },
             '& .SCPrivateMessageThread-new-message-header': {
-                position: 'absolute',
-                top: 0,
-                right: 0,
                 display: 'flex',
                 width: '100%',
-                height: theme.spacing(6.25),
+                height: theme.mixins.toolbar.minHeight,
                 alignItems: 'center',
                 justifyContent: 'center',
-                backgroundColor: theme.palette.primary.main,
+                backgroundColor: (0, system_1.alpha)(theme.palette.secondary.main, theme.palette.action.activatedOpacity),
                 '& .SCPrivateMessageThread-new-message-header-content': {
                     display: 'flex',
                     alignItems: 'center',
                     width: '80%',
-                    maxHeight: theme.spacing(5),
-                    overflow: 'auto',
                     backgroundColor: theme.palette.common.white,
                     borderRadius: theme.shape.borderRadius,
                     marginRight: theme.spacing(2),
                     '& .SCPrivateMessageThread-new-message-header-icon': {
-                        fontSize: '1.714rem'
+                        fontSize: '1.714rem',
+                        marginLeft: theme.spacing(1)
                     },
                     '& .MuiIcon-root': {
-                        color: theme.palette.secondary.main,
-                        padding: theme.spacing(1)
+                        color: theme.palette.secondary.main
                     },
                     '& .MuiTypography-root': {
-                        color: theme.palette.secondary.main
+                        color: theme.palette.secondary.main,
+                        marginLeft: theme.spacing(1)
                     },
                     '& .SCPrivateMessageThread-autocomplete': {
-                        minWidth: theme.spacing(27),
+                        [theme.breakpoints.down('md')]: {
+                            maxHeight: theme.spacing(3.75)
+                        },
+                        width: '100%',
                         marginLeft: theme.spacing(1),
+                        maxHeight: theme.mixins.toolbar.minHeight,
+                        overflow: 'auto',
+                        '& .MuiAutocomplete-tag': {
+                            height: theme.spacing(3),
+                            '& .MuiChip-deleteIcon': {
+                                fontSize: '18px'
+                            }
+                        },
                         '& .MuiAutocomplete-endAdornment': {
                             position: 'relative',
                             '& .MuiAutocomplete-clearIndicator': {
@@ -91,56 +135,16 @@ const Component = {
                 marginBottom: theme.spacing(1),
                 '& .SCPrivateMessageThread-subheader': {
                     width: 'fit-content',
-                    padding: theme.spacing(1),
+                    minWidth: 100,
+                    padding: theme.spacing(0.25, 1),
                     backgroundColor: 'white',
                     fontWeight: theme.typography.fontWeightRegular,
                     borderRadius: theme.shape.borderRadius,
                     boxShadow: '0px 0px 10px rgba(0, 0, 0, 0.1)'
                 }
             },
-            '& .SCPrivateMessageThreadItem-root': {
-                borderRadius: theme.shape.borderRadius,
-                paddingTop: `${theme.spacing(2)} !important`,
-                paddingBottom: `${theme.spacing(4)} !important`,
-                paddingRight: `${theme.spacing(2)} !important`,
-                paddingLeft: `${theme.spacing(2)} !important`,
-                '& .MuiListItemSecondaryAction-root': {
-                    right: theme.spacing(0),
-                    top: theme.spacing(2)
-                },
-                '& .SCPrivateMessageThreadItem-message-time': {
-                    position: 'absolute',
-                    bottom: theme.spacing(0),
-                    right: theme.spacing(1)
-                },
-                '& .SCPrivateMessageThreadItem-text': {
-                    minHeight: theme.spacing(6),
-                    display: 'flex',
-                    alignItems: 'center',
-                    '& .MuiTypography-root': {
-                        fontSize: '1.143rem'
-                    }
-                },
-                '& .SCPrivateMessageThreadItem-img': {
-                    display: 'flex',
-                    alignItems: 'center',
-                    // maxWidth: 'max-content',
-                    // maxHeight: 'max-content',
-                    '& img': {
-                        width: '100%',
-                        minHeight: 400,
-                        [theme.breakpoints.down('md')]: {
-                            minHeight: 170
-                        }
-                    }
-                },
-                '& .SCPrivateMessageThreadItem-document': {
-                    display: 'flex',
-                    alignItems: 'center'
-                }
-            }
+            '& .MuiList-root, .SCPrivateMessageThread-new-message-content': { flexGrow: 1 }
         })
     }
 };
 exports.default = Component;
-//# sourceMappingURL=SCPrivateMessageThread.js.map