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

package/lib/esm/components/SCLiveStreamInfoDetails.d.ts

@@ -0,0 +1,43 @@
+declare const Component: {
+    styleOverrides: {
+        root: ({ theme }: {
+            theme: any;
+        }) => {
+            gap: any;
+            '& .SCLiveStreamInfoDetails-icon-text-wrapper': {
+                flexDirection: string;
+                alignItems: string;
+                gap: any;
+                '& > p': {
+                    textTransform: string;
+                };
+                '& .SCLiveStreamInfoDetails-link': {
+                    textDecoration: string;
+                    color: any;
+                    '&:hover': {
+                        textDecoration: string;
+                    };
+                    '& .SCLiveStreamInfoDetails-url': {
+                        overflow: string;
+                        textOverflow: string;
+                        display: string;
+                        '-webkit-line-clamp': string;
+                        '-webkit-box-orient': string;
+                    };
+                };
+                '& .SCLiveStreamInfoDetails-in-progress': {
+                    width: string;
+                    height: string;
+                    borderRadius: string;
+                    backgroundColor: any;
+                };
+            };
+            '& .SCLiveStreamInfoDetails-creation-wrapper': {
+                flexDirection: string;
+                alignItems: string;
+                gap: any;
+            };
+        };
+    };
+};
+export default Component;

package/lib/esm/components/SCLiveStreamInfoDetails.js

@@ -0,0 +1,41 @@
+const Component = {
+    styleOverrides: {
+        root: ({ theme }) => ({
+            gap: theme.spacing(0.5),
+            '& .SCLiveStreamInfoDetails-icon-text-wrapper': {
+                flexDirection: 'row',
+                alignItems: 'center',
+                gap: theme.spacing(0.75),
+                '& > p': {
+                    textTransform: 'capitalize'
+                },
+                '& .SCLiveStreamInfoDetails-link': {
+                    textDecoration: 'none',
+                    color: theme.palette.text.primary,
+                    '&:hover': {
+                        textDecoration: 'underlined'
+                    },
+                    '& .SCLiveStreamInfoDetails-url': {
+                        overflow: 'hidden',
+                        textOverflow: 'ellipsis',
+                        display: '-webkit-box',
+                        '-webkit-line-clamp': '1',
+                        '-webkit-box-orient': 'vertical'
+                    }
+                },
+                '& .SCLiveStreamInfoDetails-in-progress': {
+                    width: '6px',
+                    height: '6px',
+                    borderRadius: '9999px',
+                    backgroundColor: theme.palette.secondary.main
+                }
+            },
+            '& .SCLiveStreamInfoDetails-creation-wrapper': {
+                flexDirection: 'row',
+                alignItems: 'center',
+                gap: theme.spacing(1)
+            }
+        })
+    }
+};
+export default Component;

package/lib/esm/components/SCLiveStreamRoom.d.ts

@@ -0,0 +1,113 @@
+declare const Component: {
+    styleOverrides: {
+        root: ({ theme }: any) => {
+            width: string;
+            display: string;
+            justifyContent: string;
+            alignContent: string;
+            "& .SCLiveStreamRoom-title": {
+                margin: any;
+                textAlign: string;
+                color: any;
+            };
+            "& .SCLiveStreamRoom-description": {
+                backgroundColor: any;
+                color: any;
+                border: string;
+                borderRadius: string;
+                marginTop: any;
+                marginBottom: any;
+                padding: any;
+            };
+            "& .SCLiveStreamRoom-content": {
+                width: string;
+            };
+            "& .SCLiveStreamRoom-prejoin": {
+                margin: any;
+                padding: any;
+                display: string;
+                placeItems: string;
+                height: string;
+                position: string;
+                '& .lk-form-control': {
+                    display: string;
+                };
+            };
+            "& .SCLiveStreamRoom-prejoin-loading": {
+                '& .lk-prejoin': {
+                    opacity: number;
+                };
+            };
+            "& .SCLiveStreamRoom-prejoin-alert": {
+                backgroundColor: any;
+                color: any;
+                border: string;
+                borderRadius: string;
+            };
+            "& .SCLiveStreamRoom-share-link": {
+                marginTop: any;
+                backgroundColor: any;
+                '& textarea': {
+                    color: any;
+                    '-webkit-text-fill-color': any;
+                };
+            };
+            "& .SCLiveStreamRoom-conference": {
+                width: string;
+                display: string;
+                justifyContent: string;
+                alignItems: string;
+                backgroundColor: string;
+            };
+            "& .SCLiveStreamRoom-prejoin-loader": {
+                maxWidth: number;
+                width: string;
+                position: string;
+                textAlign: string;
+                '& .MuiTypography-root': {
+                    color: string;
+                };
+            };
+            "& .SCLiveStreamRoom-end-prejoin-content": {
+                color: any;
+                display: string;
+                justifyContent: string;
+                alignItems: string;
+                marginTop: any;
+                paddingBottom: any;
+                "& .SCLiveStreamRoom-end-prejoin-content-box": {
+                    [x: number]: {
+                        width: string;
+                    };
+                    width: string;
+                };
+            };
+            '& .lk-prejoin': {
+                maxWidth: number;
+                width: string;
+                backgroundColor: string;
+                borderRadius: any;
+            };
+            '& .lk-join-button': {
+                backgroundColor: any;
+                color: any;
+                '&:hover': {
+                    backgroundColor: any;
+                };
+            };
+        };
+        dialogRoot: ({ theme }: any) => {
+            "& .SCLiveStreamRoom-end-conference-wrap": {
+                display: string;
+                justifyContent: string;
+                alignItems: string;
+                alignContent: string;
+                flexDirection: string;
+                "& .SCLiveStreamVideoConference-btn-back-home": {
+                    marginTop: any;
+                };
+            };
+        };
+    };
+};
+export default Component;

package/lib/esm/components/SCLiveStreamRoom.js

@@ -0,0 +1,113 @@
+const Component = {
+    styleOverrides: {
+        root: ({ theme }) => ({
+            width: '100%',
+            display: 'flex',
+            justifyContent: 'center',
+            alignContent: 'center',
+            [`& .SCLiveStreamRoom-title`]: {
+                margin: theme.spacing(2),
+                textAlign: 'center',
+                color: theme.palette.text.primary
+            },
+            [`& .SCLiveStreamRoom-description`]: {
+                backgroundColor: theme.palette.background.paper,
+                color: theme.palette.text.primary,
+                border: '1px solid #555555',
+                borderRadius: '5px',
+                marginTop: theme.spacing(2),
+                marginBottom: theme.spacing(2),
+                padding: theme.spacing(0, 2)
+            },
+            [`& .SCLiveStreamRoom-content`]: {
+                width: '100%'
+            },
+            [`& .SCLiveStreamRoom-prejoin`]: {
+                margin: theme.spacing(),
+                padding: theme.spacing(),
+                display: 'grid',
+                placeItems: 'center',
+                height: 'auto',
+                position: 'relative',
+                '& .lk-form-control': {
+                    display: 'none'
+                }
+            },
+            [`& .SCLiveStreamRoom-prejoin-loading`]: {
+                '& .lk-prejoin': {
+                    opacity: 0.5
+                }
+            },
+            [`& .SCLiveStreamRoom-prejoin-alert`]: {
+                backgroundColor: theme.palette.background.paper,
+                color: theme.palette.text.primary,
+                border: '1px solid #555555',
+                borderRadius: '5px'
+            },
+            [`& .SCLiveStreamRoom-share-link`]: {
+                marginTop: theme.spacing(3),
+                backgroundColor: theme.palette.background.paper,
+                '& textarea': {
+                    color: theme.palette.text.primary,
+                    '-webkit-text-fill-color': theme.palette.text.primary
+                }
+            },
+            [`& .SCLiveStreamRoom-conference`]: {
+                width: '100%',
+                display: 'flex',
+                justifyContent: 'center',
+                alignItems: 'center',
+                backgroundColor: '#111111'
+            },
+            [`& .SCLiveStreamRoom-prejoin-loader`]: {
+                maxWidth: 620,
+                width: '100%',
+                position: 'absolute',
+                textAlign: 'center',
+                '& .MuiTypography-root': {
+                    color: '#111111'
+                }
+            },
+            [`& .SCLiveStreamRoom-end-prejoin-content`]: {
+                color: theme.palette.common.black,
+                display: 'flex',
+                justifyContent: 'center',
+                alignItems: 'center',
+                marginTop: theme.spacing(2),
+                paddingBottom: theme.spacing(3),
+                [`& .SCLiveStreamRoom-end-prejoin-content-box`]: {
+                    width: '47%',
+                    [theme.breakpoints.down('md')]: {
+                        width: '90%'
+                    }
+                }
+            },
+            '& .lk-prejoin': {
+                maxWidth: 620,
+                width: '100%',
+                backgroundColor: '#111111',
+                borderRadius: theme.shape.borderRadiusSm
+            },
+            '& .lk-join-button': {
+                backgroundColor: theme.palette.primary.main,
+                color: theme.palette.common.white,
+                '&:hover': {
+                    backgroundColor: theme.palette.primary.dark
+                }
+            }
+        }),
+        dialogRoot: ({ theme }) => ({
+            [`& .SCLiveStreamRoom-end-conference-wrap`]: {
+                display: 'flex',
+                justifyContent: 'center',
+                alignItems: 'center',
+                alignContent: 'center',
+                flexDirection: 'column',
+                [`& .SCLiveStreamVideoConference-btn-back-home`]: {
+                    marginTop: theme.spacing(2)
+                }
+            }
+        })
+    }
+};
+export default Component;

package/lib/esm/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/esm/components/SCLiveStreamSelector.js

@@ -0,0 +1,73 @@
+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: 425,
+            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
+            }
+        })
+    }
+};
+export default Component;

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

@@ -0,0 +1,27 @@
+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;
+                "& .SCLiveStreamVideoConference-logo": {
+                    img: {
+                        maxHeight: string;
+                    };
+                };
+                "& .SCLiveStreamVideoConference-btn-back-home": {
+                    marginTop: any;
+                };
+            };
+        };
+    };
+};
+export default Component;

package/lib/esm/components/SCLiveStreamVideoConference.js

@@ -0,0 +1,27 @@
+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',
+                [`& .SCLiveStreamVideoConference-logo`]: {
+                    img: {
+                        maxHeight: '100px'
+                    }
+                },
+                [`& .SCLiveStreamVideoConference-btn-back-home`]: {
+                    marginTop: theme.spacing(2)
+                }
+            }
+        })
+    }
+};
+export default Component;

package/lib/esm/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/esm/components/SCMediaFile.js

@@ -100,11 +100,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/esm/components/SCNavigationMenuDrawer.d.ts

@@ -39,6 +39,9 @@ declare const Component: {
             '& .SCBaseItemButton-text ': {
                 maxWidth: string;
             };
+            '& .SCNavigationMenuDrawer-drawer-footer': {
+                padding: any;
+            };
         };
     };
 };

package/lib/esm/components/SCNavigationMenuDrawer.js

@@ -39,6 +39,9 @@ const Component = {
             },
             '& .SCBaseItemButton-text ': {
                 maxWidth: '80%'
+            },
+            '& .SCNavigationMenuDrawer-drawer-footer': {
+                padding: theme.spacing(3)
             }
         })
     }

package/lib/esm/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/esm/components/SCNotification.js

@@ -307,6 +307,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/esm/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/esm/components/SCUpScalingTierBadge.js

@@ -0,0 +1,13 @@
+const Component = {
+    styleOverrides: {
+        root: ({ theme }) => ({}),
+        badgeRoot: ({ theme }) => ({
+            background: '#008080',
+            borderRadius: 3,
+            padding: '1px',
+            height: 'auto',
+            fontSize: 12
+        })
+    }
+};
+export default Component;