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

package/lib/esm/components/SCLiveStream.js

@@ -0,0 +1,218 @@
+const Component = {
+    styleOverrides: {
+        root: ({ theme }) => ({}),
+        detailRoot: ({ theme }) => ({
+            '& .SCLiveStream-detail-image-wrapper': {
+                position: 'relative',
+                '& .SCLiveStream-detail-image': {
+                    height: '170px'
+                },
+                '& .SCLiveStream-detail-in-progress': {
+                    backgroundColor: theme.palette.secondary.main,
+                    position: 'absolute',
+                    top: 10,
+                    right: 10,
+                    color: theme.palette.common.white,
+                    boxShadow: 'rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px'
+                }
+            },
+            '& .SCLiveStream-detail-content': {
+                padding: `52px ${theme.spacing(3)} 0 !important`,
+                '& .SCLiveStream-detail-user': {
+                    marginTop: '14px',
+                    '& .SCBaseItemButton-text': {
+                        margin: 0
+                    }
+                },
+                '& .SCLiveStream-detail-name-wrapper': {
+                    textDecoration: 'none',
+                    color: 'inherit',
+                    '& .SCLiveStream-detail-name': {
+                        marginBottom: '10px'
+                    }
+                },
+                '& .SCLiveStream-detail-first-divider': {
+                    marginTop: '18px',
+                    marginBottom: theme.spacing()
+                },
+                '& .SCLiveStream-detail-second-divider': {
+                    marginTop: theme.spacing(),
+                    marginBottom: '18px'
+                }
+            }
+        }),
+        previewRoot: ({ theme }) => ({
+            '& .SCLiveStream-preview-image-wrapper': {
+                position: 'relative',
+                '& .SCLiveStream-preview-image': {
+                    height: '80px'
+                },
+                '& .SCLiveStream-preview-in-progress': {
+                    height: 18,
+                    backgroundColor: theme.palette.secondary.main,
+                    position: 'absolute',
+                    top: 7,
+                    right: 7,
+                    color: theme.palette.common.white,
+                    boxShadow: 'rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px',
+                    '& span': {
+                        fontSize: '0.8rem',
+                        paddingLeft: theme.spacing(0.5),
+                        paddingRight: theme.spacing(0.5)
+                    }
+                }
+            },
+            '& .SCLiveStream-preview-content': {
+                padding: `${theme.spacing()} !important`,
+                '& .SCLiveStreamInfoDetails-icon-text-wrapper': {
+                    '& .MuiTypography-root': {
+                        fontSize: '0.8rem'
+                    }
+                },
+                '& .SCLiveStream-detail-user': {
+                    marginTop: '14px',
+                    '& .SCBaseItemButton-text': {
+                        margin: 0
+                    }
+                },
+                '& .SCLiveStream-preview-name-wrapper': {
+                    marginTop: 3,
+                    textDecoration: 'none',
+                    color: 'inherit',
+                    '& h5': {
+                        whiteSpace: 'nowrap',
+                        overflow: 'hidden',
+                        textOverflow: 'ellipsis'
+                    }
+                }
+            }
+        }),
+        snippetRoot: ({ theme }) => ({
+            overflow: 'visible',
+            boxSizing: 'border-box',
+            paddingLeft: `${theme.spacing()} !important`,
+            paddingRight: `${theme.spacing()} !important`,
+            '& .SCBaseItem-image': {
+                '& .MuiAvatar-root': {
+                    width: 100,
+                    height: 60,
+                    borderRadius: '5px',
+                    '& img': {
+                        borderRadius: '5px'
+                    }
+                }
+            },
+            '& .SCLiveStream-snippet-image': {
+                position: 'relative',
+                '& .SCLiveStream-snippet-in-progress': {
+                    height: 18,
+                    backgroundColor: theme.palette.secondary.main,
+                    position: 'absolute',
+                    top: 5,
+                    right: 3,
+                    color: theme.palette.common.white,
+                    boxShadow: 'rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px',
+                    '& span': {
+                        fontSize: '0.8rem',
+                        paddingLeft: theme.spacing(0.5),
+                        paddingRight: theme.spacing(0.5)
+                    }
+                }
+            },
+            '& .SCBaseItem-text': {
+                fontSize: theme.typography.fontSize,
+                '& .SCLiveStream-snippet-primary': {
+                    color: theme.palette.text.primary,
+                    textDecoration: 'none',
+                    '&:hover': {
+                        textDecoration: 'none'
+                    },
+                    '& p': {
+                        fontWeight: theme.typography.fontWeightBold
+                    }
+                },
+                '& .SCLiveStream-snippet-secondary': {
+                    color: theme.palette.text.secondary
+                }
+            }
+        }),
+        skeletonRoot: ({ theme }) => ({
+            '& .SCLiveStream-skeleton-detail-root': {
+                '& .SCLiveStream-skeleton-detail-calendar': {
+                    position: 'absolute',
+                    bottom: '-36px',
+                    left: '24px',
+                    boxShadow: '0px 3px 8px #00000040'
+                },
+                '& .SCLiveStream-skeleton-detail-content': {
+                    padding: `52px ${theme.spacing(3)} 0 !important`,
+                    '& .SCLiveStream-skeleton-detail-user': {
+                        marginTop: '14px',
+                        '& .SCBaseItemButton-text': {
+                            margin: 0
+                        }
+                    },
+                    '& .SCLiveStream-skeleton-detail-name-wrapper': {
+                        textDecoration: 'none',
+                        color: 'inherit',
+                        '& .SCLiveStream-skeleton-detail-name': {
+                            marginBottom: '10px'
+                        }
+                    },
+                    '& .SCLiveStream-skeleton-detail-first-divider': {
+                        marginTop: '18px',
+                        marginBottom: theme.spacing()
+                    },
+                    '& .SCLiveStream-skeleton-detail-second-divider': {
+                        marginTop: theme.spacing(),
+                        marginBottom: '18px'
+                    }
+                }
+            },
+            '& .SCLiveStream-skeleton-preview-root': {
+                '& .SCLiveStream-skeleton-preview-content': {
+                    padding: theme.spacing()
+                },
+                '& .SCLiveStream-skeleton-preview-image': {
+                    position: 'relative',
+                    '& .MuiSkeleton-root': {
+                        borderRadius: '5px'
+                    },
+                    '& .MuiIcon-root': {
+                        color: theme.palette.common.white,
+                        position: 'absolute',
+                        top: '50%',
+                        left: '50%',
+                        transform: 'translate(-50%, -50%)'
+                    }
+                },
+                '& .SCBaseItem-actions': {
+                    maxWidth: 'none !important'
+                }
+            },
+            '& .SCLiveStream-skeleton-snippet-root': {
+                overflow: 'visible',
+                boxSizing: 'border-box',
+                paddingLeft: `${theme.spacing()} !important`,
+                paddingRight: `${theme.spacing()} !important`,
+                '& .SCLiveStream-skeleton-snippet-image': {
+                    position: 'relative',
+                    '& .MuiSkeleton-root': {
+                        borderRadius: '5px'
+                    },
+                    '& .MuiIcon-root': {
+                        color: theme.palette.common.white,
+                        position: 'absolute',
+                        top: '50%',
+                        left: '50%',
+                        transform: 'translate(-50%, -50%)'
+                    }
+                },
+                '& .SCBaseItem-actions': {
+                    maxWidth: 'none !important'
+                }
+            }
+        })
+    }
+};
+export default Component;

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

@@ -0,0 +1,16 @@
+declare const Component: {
+    styleOverrides: {
+        root: ({ theme }: any) => {
+            '& .MuiDialogTitle-root': {
+                '& span': {
+                    flexGrow: number;
+                    textAlign: string;
+                };
+            };
+            '& .SCCreateLiveStreamDialog-root': {
+                padding: any;
+            };
+        };
+    };
+};
+export default Component;

package/lib/esm/components/SCLiveStreamDialog.js

@@ -0,0 +1,16 @@
+const Component = {
+    styleOverrides: {
+        root: ({ theme }) => ({
+            '& .MuiDialogTitle-root': {
+                '& span': {
+                    flexGrow: 1,
+                    textAlign: 'center'
+                }
+            },
+            '& .SCCreateLiveStreamDialog-root': {
+                padding: theme.spacing(2, 0, 0, 0)
+            }
+        })
+    }
+};
+export default Component;

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

@@ -0,0 +1,27 @@
+declare const Component: {
+    styleOverrides: {
+        root: ({ theme }: any) => {
+            '& .SCLiveStreamForm-cover': {
+                position: string;
+                height: number;
+                minHeight: number;
+                '& .SCEventForm-upload-event-cover-root': {
+                    position: string;
+                    right: any;
+                    bottom: any;
+                    padding: any;
+                    minWidth: string;
+                };
+            };
+            "& .SCLiveStreamForm-access-view": {
+                margin: any;
+            };
+            "& .SCLiveStreamForm-actions": {
+                display: string;
+                justifyContent: string;
+                marginTop: any;
+            };
+        };
+    };
+};
+export default Component;

package/lib/esm/components/SCLiveStreamForm.js

@@ -0,0 +1,27 @@
+const Component = {
+    styleOverrides: {
+        root: ({ theme }) => ({
+            '& .SCLiveStreamForm-cover': {
+                position: 'relative',
+                height: 120,
+                minHeight: 120,
+                '& .SCEventForm-upload-event-cover-root': {
+                    position: 'absolute',
+                    right: theme.spacing(2),
+                    bottom: theme.spacing(1),
+                    padding: theme.spacing(1),
+                    minWidth: 'auto'
+                }
+            },
+            [`& .SCLiveStreamForm-access-view`]: {
+                margin: theme.spacing(2, 0),
+            },
+            [`& .SCLiveStreamForm-actions`]: {
+                display: 'flex',
+                justifyContent: 'flex-end',
+                marginTop: theme.spacing(2)
+            }
+        })
+    }
+};
+export default Component;

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

@@ -0,0 +1,15 @@
+declare const Component: {
+    styleOverrides: {
+        root: ({ theme }: any) => {
+            margin: any;
+            '& .SCLiveStreamFormSettings-access-view': {
+                margin: any;
+                width: string;
+                '& .Mui-checked': {
+                    color: any;
+                };
+            };
+        };
+    };
+};
+export default Component;

package/lib/esm/components/SCLiveStreamFormSettings.js

@@ -0,0 +1,15 @@
+const Component = {
+    styleOverrides: {
+        root: ({ theme }) => ({
+            margin: theme.spacing(1, 0),
+            '& .SCLiveStreamFormSettings-access-view': {
+                margin: theme.spacing(2, 0),
+                width: '100%',
+                '& .Mui-checked': {
+                    color: theme.palette.primary.main
+                }
+            }
+        })
+    }
+};
+export default Component;

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;