@selfcommunity/react-theme-default 0.4.5-alpha.0 → 0.4.5-alpha.10

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

@@ -0,0 +1,71 @@
+declare const Component: {
+    styleOverrides: {
+        root: ({ theme }: any) => {
+            '& .SCLiveStreamSelector-warning': {
+                margin: any;
+                "& a": {
+                    color: any;
+                    fontWeight: string;
+                };
+            };
+            '& .SCLiveStreamSelector-options': {
+                [x: number]: {
+                    display: string;
+                };
+                display: string;
+                justifyContent: string;
+                alignItems: string;
+                '& > div': {
+                    [x: number]: {
+                        margin: string;
+                        marginBottom: any;
+                    };
+                    width: string;
+                };
+            };
+            '& .SCLiveStreamSelector-actions': {
+                display: string;
+                justifyContent: string;
+                alignItems: string;
+                marginTop: any;
+            };
+        };
+        optionCardRoot: ({ theme, selected }: any) => {
+            maxWidth: number;
+            height: string;
+            minHeight: number;
+            padding: any;
+            margin: any;
+            cursor: string;
+            transition: any;
+            backgroundColor: any;
+            '&:hover': {
+                backgroundColor: any;
+                boxShadow: any;
+            };
+            border: string;
+            "& > div": {
+                display: string;
+                justifyContent: string;
+                alignItems: string;
+                marginBottom: number;
+                maxWidth: string;
+            };
+            "& ul": {
+                marginTop: any;
+                padding: number;
+                listStyle: string;
+            };
+        };
+        featureItemRoot: ({ theme, selected }: any) => {
+            display: string;
+            alignItems: string;
+            gap: any;
+            marginBottom: any;
+            '&:last-child': {
+                marginBottom: number;
+            };
+        };
+    };
+};
+export default Component;

package/lib/cjs/components/SCLiveStreamSelector.js

@@ -0,0 +1,75 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const Component = {
+    styleOverrides: {
+        root: ({ theme }) => ({
+            '& .SCLiveStreamSelector-warning': {
+                margin: theme.spacing(2, 5, 2, 5),
+                [`& a`]: {
+                    color: theme.palette.common.white,
+                    fontWeight: 'bold'
+                }
+            },
+            '& .SCLiveStreamSelector-options': {
+                display: 'flex',
+                justifyContent: 'center',
+                alignItems: 'center',
+                [theme.breakpoints.down('sm')]: {
+                    display: 'block'
+                },
+                '& > div': {
+                    width: '290px',
+                    [theme.breakpoints.down('sm')]: {
+                        margin: '0px auto',
+                        marginBottom: theme.spacing(2)
+                    }
+                }
+            },
+            '& .SCLiveStreamSelector-actions': {
+                display: 'flex',
+                justifyContent: 'flex-end',
+                alignItems: 'flex-end',
+                marginTop: theme.spacing(4)
+            }
+        }),
+        optionCardRoot: ({ theme, selected }) => ({
+            maxWidth: 300,
+            height: 'auto',
+            minHeight: 440,
+            padding: theme.spacing(3),
+            margin: theme.spacing(0, 3),
+            cursor: 'pointer',
+            transition: theme.transitions.create(['background-color', 'box-shadow'], {
+                duration: theme.transitions.duration.short
+            }),
+            backgroundColor: selected ? theme.palette.grey[100] : theme.palette.background.paper,
+            '&:hover': {
+                backgroundColor: theme.palette.grey[50],
+                boxShadow: theme.shadows[2]
+            },
+            border: `1px solid ${theme.palette.divider}`,
+            [`& > div`]: {
+                display: 'flex',
+                justifyContent: 'space-between',
+                alignItems: 'center',
+                marginBottom: 2,
+                maxWidth: '300px'
+            },
+            [`& ul`]: {
+                marginTop: theme.spacing(2),
+                padding: 0,
+                listStyle: 'none'
+            }
+        }),
+        featureItemRoot: ({ theme, selected }) => ({
+            display: 'flex',
+            alignItems: 'flex-start',
+            gap: theme.spacing(1.5),
+            marginBottom: theme.spacing(2),
+            '&:last-child': {
+                marginBottom: 0
+            }
+        })
+    }
+};
+exports.default = Component;

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

@@ -0,0 +1,29 @@
+declare const Component: {
+    styleOverrides: {
+        root: ({ theme }: any) => {
+            height: string;
+            width: string;
+            overflowY: string;
+        };
+        dialogRoot: ({ theme }: any) => {
+            "& .SCLiveStreamVideoConference-end-conference-wrap": {
+                display: string;
+                justifyContent: string;
+                alignItems: string;
+                alignContent: string;
+                flexDirection: string;
+                textAlign: string;
+                "& .SCLiveStreamVideoConference-logo": {
+                    img: {
+                        maxHeight: string;
+                    };
+                    marginBottom: any;
+                };
+                "& .SCLiveStreamVideoConference-btn-back-home": {
+                    marginTop: any;
+                };
+            };
+        };
+    };
+};
+export default Component;

package/lib/cjs/components/SCLiveStreamVideoConference.js

@@ -0,0 +1,31 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const Component = {
+    styleOverrides: {
+        root: ({ theme }) => ({
+            height: '100vh',
+            width: '100%',
+            overflowY: 'hidden'
+        }),
+        dialogRoot: ({ theme }) => ({
+            [`& .SCLiveStreamVideoConference-end-conference-wrap`]: {
+                display: 'flex',
+                justifyContent: 'center',
+                alignItems: 'center',
+                alignContent: 'center',
+                flexDirection: 'column',
+                textAlign: 'center',
+                [`& .SCLiveStreamVideoConference-logo`]: {
+                    img: {
+                        maxHeight: '100px'
+                    },
+                    marginBottom: theme.spacing(2)
+                },
+                [`& .SCLiveStreamVideoConference-btn-back-home`]: {
+                    marginTop: theme.spacing(2)
+                }
+            }
+        })
+    }
+};
+exports.default = Component;

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

@@ -100,11 +100,7 @@ declare const Component: {
                 flexWrap: string;
                 maxWidth: string;
                 overflow: string;
-                MsOverflowStyle: string;
                 scrollbarWidth: string;
-                '&::-webkit-scrollbar': {
-                    display: string;
-                };
                 '& .SCMediaFile-media': {
                     backgroundSize: string;
                     backgroundPosition: string;

package/lib/cjs/components/SCMediaFile.js

@@ -102,11 +102,7 @@ const Component = {
                 flexWrap: 'nowrap',
                 maxWidth: '100%',
                 overflow: 'auto',
-                'MsOverflowStyle': 'none',
-                scrollbarWidth: 'none',
-                '&::-webkit-scrollbar': {
-                    display: 'none'
-                },
+                scrollbarWidth: 'thin',
                 '& .SCMediaFile-media': {
                     backgroundSize: 'cover',
                     backgroundPosition: 'center',

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

@@ -39,6 +39,10 @@ declare const Component: {
             '& .SCBaseItemButton-text ': {
                 maxWidth: string;
             };
+            '& .SCNavigationMenuDrawer-drawer-footer-live-button': {
+                margin: any;
+                maxWidth: number;
+            };
         };
     };
 };

package/lib/cjs/components/SCNavigationMenuDrawer.js

@@ -41,6 +41,10 @@ const Component = {
             },
             '& .SCBaseItemButton-text ': {
                 maxWidth: '80%'
+            },
+            '& .SCNavigationMenuDrawer-drawer-footer-live-button': {
+                margin: theme.spacing(3),
+                maxWidth: 270
             }
         })
     }

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

@@ -305,6 +305,33 @@ declare const Component: {
                 backgroundColor: string;
             };
         };
+        liveStreamRoot: ({ theme }: any) => {
+            '& .SCNotification-username, & a': {
+                fontWeight: any;
+            };
+            '& .SCNotificationItem-primary': {
+                '& .MuiIcon-root': {
+                    float: string;
+                    fontSize: string;
+                    marginLeft: any;
+                };
+                '& .SCEvent-root': {
+                    width: string;
+                    '& .SCEvent-snippet-root': {
+                        paddingLeft: string;
+                    };
+                };
+            };
+            '& .SCNotificationItem-secondary': {
+                textTransform: string;
+            };
+            '& .SCNotification-snippet-time': {
+                paddingLeft: any;
+            };
+            '& .SCEvent-snippet-root': {
+                backgroundColor: string;
+            };
+        };
         groupRoot: ({ theme }: any) => {};
         undeletedForRoot: ({ theme }: any) => {
             '& .SCNotification-undeleted-icon': {

package/lib/cjs/components/SCNotification.js

@@ -309,6 +309,33 @@ const Component = {
                 backgroundColor: 'transparent !important'
             }
         }),
+        liveStreamRoot: ({ theme }) => ({
+            '& .SCNotification-username, & a': {
+                fontWeight: theme.typography.fontWeightBold
+            },
+            '& .SCNotificationItem-primary': {
+                '& .MuiIcon-root': {
+                    float: 'right',
+                    fontSize: '20px',
+                    marginLeft: theme.spacing(0.5)
+                },
+                '& .SCEvent-root': {
+                    width: '100%',
+                    '& .SCEvent-snippet-root': {
+                        paddingLeft: '0 !important'
+                    }
+                }
+            },
+            '& .SCNotificationItem-secondary': {
+                textTransform: 'capitalize'
+            },
+            '& .SCNotification-snippet-time': {
+                paddingLeft: theme.spacing(5)
+            },
+            '& .SCEvent-snippet-root': {
+                backgroundColor: 'transparent !important'
+            }
+        }),
         groupRoot: ({ theme }) => ({}),
         undeletedForRoot: ({ theme }) => ({
             '& .SCNotification-undeleted-icon': {

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

@@ -82,12 +82,14 @@ declare const Component: {
                 [x: number]: {
                     width: any;
                 };
+                position: string;
                 '& img': {
                     height: string;
                     width: string;
                 };
                 '& .MuiButtonBase-root': {
                     flexWrap: string;
+                    width: string;
                     position: string;
                     bottom: any;
                     backgroundColor: string;

package/lib/cjs/components/SCPrivateMessageThreadItem.js

@@ -81,6 +81,7 @@ const Component = {
                 }
             },
             '& .SCPrivateMessageThreadItem-document': {
+                position: 'relative',
                 [theme.breakpoints.up('sm')]: {
                     width: theme.spacing(32.5)
                 },
@@ -90,7 +91,7 @@ const Component = {
                 },
                 '& .MuiButtonBase-root': {
                     flexWrap: 'wrap',
-                    //width: 'calc(100% - 24px)',
+                    width: '100%',
                     position: 'absolute',
                     bottom: theme.spacing(4),
                     backgroundColor: 'rgba(0,0,0,0.5)',

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

@@ -0,0 +1,13 @@
+declare const Component: {
+    styleOverrides: {
+        root: ({ theme }: any) => {};
+        badgeRoot: ({ theme }: any) => {
+            background: string;
+            borderRadius: number;
+            padding: string;
+            height: string;
+            fontSize: number;
+        };
+    };
+};
+export default Component;

package/lib/cjs/components/SCUpScalingTierBadge.js

@@ -0,0 +1,15 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const Component = {
+    styleOverrides: {
+        root: ({ theme }) => ({}),
+        badgeRoot: ({ theme }) => ({
+            background: '#008080',
+            borderRadius: 3,
+            padding: '1px',
+            height: 'auto',
+            fontSize: 12
+        })
+    }
+};
+exports.default = Component;

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

@@ -0,0 +1,101 @@
+declare const Component: {
+    styleOverrides: {
+        root: ({ theme }: {
+            theme: any;
+        }) => {
+            '& .SCUserLiveStreamWidget-content': {
+                '& .SCUserLiveStreamWidget-header': {
+                    flexDirection: string;
+                    justifyContent: string;
+                    alignItems: string;
+                    marginBottom: any;
+                    '& .SCUserLiveStreamWidget-avatar-wrapper': {
+                        flexDirection: string;
+                        alignItems: string;
+                        color: string;
+                        padding: number;
+                        minWidth: string;
+                        '& .SCUserLiveStreamWidget-avatar': {
+                            width: any;
+                            height: any;
+                        };
+                    };
+                    '& h4': {
+                        marginLeft: number;
+                        lineHeight: string;
+                    };
+                };
+                '& .SCUserLiveStreamWidget-live-wrapper': {
+                    paddingTop: any;
+                    gap: any;
+                    '& .SCUserLiveStreamWidget-live': {
+                        '& > div': {
+                            padding: string;
+                            '& > .SCBaseItem-content': {
+                                '& > .SCBaseItem-text': {
+                                    margin: number;
+                                };
+                            };
+                        };
+                    };
+                };
+            };
+            '& .SCUserLiveStreamWidget-actions': {
+                padding: string;
+                justifyContent: string;
+                '& .SCSuggestedEventsWidget-actionButton': {
+                    color: any;
+                };
+            };
+        };
+        skeletonRoot: ({ theme }: {
+            theme: any;
+        }) => {
+            '& .SCUserLiveStreamWidget-content': {
+                padding: string;
+                '& .SCUserLiveStreamWidget-user': {
+                    marginBottom: any;
+                    '& > .SCBaseItem-content': {
+                        '& > .SCBaseItem-text': {
+                            margin: number;
+                        };
+                    };
+                    '& > .SCBaseItem-actions': {
+                        display: string;
+                    };
+                };
+                '& .SCUserLiveStreamWidget-live-wrapper': {
+                    gap: any;
+                    '& .SCUserLiveStreamWidget-live': {
+                        '& > div': {
+                            padding: string;
+                            '& > .SCBaseItem-content': {
+                                '& > .SCBaseItem-text': {
+                                    margin: number;
+                                };
+                            };
+                        };
+                    };
+                };
+            };
+            '& .SCUserLiveStreamWidget-actions': {
+                padding: string;
+                justifyContent: string;
+            };
+        };
+        dialogRoot: ({ theme }: {
+            theme: any;
+        }) => {
+            '& .SCUserLiveStreamWidget-infinite-scroll': {
+                [x: number]: {
+                    height: string;
+                };
+                height: string;
+                '& .SCEvent-root': {
+                    width: string;
+                };
+            };
+        };
+    };
+};
+export default Component;

package/lib/cjs/components/SCUserLiveStreamWidget.js

@@ -0,0 +1,97 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const Component = {
+    styleOverrides: {
+        root: ({ theme }) => ({
+            '& .SCUserLiveStreamWidget-content': {
+                '& .SCUserLiveStreamWidget-header': {
+                    flexDirection: 'row',
+                    justifyContent: 'flex-start',
+                    alignItems: 'flex-start',
+                    marginBottom: theme.spacing(2),
+                    '& .SCUserLiveStreamWidget-avatar-wrapper': {
+                        flexDirection: 'row',
+                        alignItems: 'center',
+                        color: 'inherit',
+                        padding: 0,
+                        minWidth: 'auto',
+                        '& .SCUserLiveStreamWidget-avatar': {
+                            width: theme.selfcommunity.user.avatar.sizeMedium,
+                            height: theme.selfcommunity.user.avatar.sizeMedium
+                        }
+                    },
+                    '& h4': {
+                        marginLeft: 7,
+                        lineHeight: '28px'
+                    }
+                },
+                '& .SCUserLiveStreamWidget-live-wrapper': {
+                    paddingTop: theme.spacing(2),
+                    gap: theme.spacing(2),
+                    '& .SCUserLiveStreamWidget-live': {
+                        '& > div': {
+                            padding: '0 !important',
+                            '& > .SCBaseItem-content': {
+                                '& > .SCBaseItem-text': {
+                                    margin: 0
+                                }
+                            }
+                        }
+                    }
+                }
+            },
+            '& .SCUserLiveStreamWidget-actions': {
+                padding: `0 ${theme.spacing(2)} 15px`,
+                justifyContent: 'center',
+                '& .SCSuggestedEventsWidget-actionButton': {
+                    color: theme.palette.primary.main
+                }
+            }
+        }),
+        skeletonRoot: ({ theme }) => ({
+            '& .SCUserLiveStreamWidget-content': {
+                padding: `10px ${theme.spacing(2)} 12px`,
+                '& .SCUserLiveStreamWidget-user': {
+                    marginBottom: theme.spacing(2),
+                    '& > .SCBaseItem-content': {
+                        '& > .SCBaseItem-text': {
+                            margin: 0
+                        }
+                    },
+                    '& > .SCBaseItem-actions': {
+                        display: 'none'
+                    }
+                },
+                '& .SCUserLiveStreamWidget-live-wrapper': {
+                    gap: theme.spacing(2),
+                    '& .SCUserLiveStreamWidget-live': {
+                        '& > div': {
+                            padding: '0 !important',
+                            '& > .SCBaseItem-content': {
+                                '& > .SCBaseItem-text': {
+                                    margin: 0
+                                }
+                            }
+                        }
+                    }
+                }
+            },
+            '& .SCUserLiveStreamWidget-actions': {
+                padding: `0 ${theme.spacing(2)} 15px`,
+                justifyContent: 'center'
+            }
+        }),
+        dialogRoot: ({ theme }) => ({
+            '& .SCUserLiveStreamWidget-infinite-scroll': {
+                height: '400px',
+                [theme.breakpoints.down('md')]: {
+                    height: '100%'
+                },
+                '& .SCEvent-root': {
+                    width: '100%'
+                }
+            }
+        })
+    }
+};
+exports.default = Component;