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

package/lib/cjs/index.js

@@ -144,6 +144,16 @@ const SCScrollContainer_1 = tslib_1.__importDefault(require("./components/SCScro
 const SCSearchAutocomplete_1 = tslib_1.__importDefault(require("./components/SCSearchAutocomplete"));
 const SCSnippetNotifications_1 = tslib_1.__importDefault(require("./components/SCSnippetNotifications"));
 const SCSuggestedEventsWidget_1 = tslib_1.__importDefault(require("./components/SCSuggestedEventsWidget"));
+const SCLiveStream_1 = tslib_1.__importDefault(require("./components/SCLiveStream"));
+const SCLiveStreamDialog_1 = tslib_1.__importDefault(require("./components/SCLiveStreamDialog"));
+const SCLiveStreamSelector_1 = tslib_1.__importDefault(require("./components/SCLiveStreamSelector"));
+const SCLiveStreamForm_1 = tslib_1.__importDefault(require("./components/SCLiveStreamForm"));
+const SCLiveStreamFormSettings_1 = tslib_1.__importDefault(require("./components/SCLiveStreamFormSettings"));
+const SCLiveStreamRoom_1 = tslib_1.__importDefault(require("./components/SCLiveStreamRoom"));
+const SCLiveStreamVideoConference_1 = tslib_1.__importDefault(require("./components/SCLiveStreamVideoConference"));
+const SCLiveStreamInfoDetails_1 = tslib_1.__importDefault(require("./components/SCLiveStreamInfoDetails"));
+const SCUpScalingTierBadge_1 = tslib_1.__importDefault(require("./components/SCUpScalingTierBadge"));
+const SCUserLiveStreamWidget_1 = tslib_1.__importDefault(require("./components/SCUserLiveStreamWidget"));
 const SCToastNotifications_1 = tslib_1.__importDefault(require("./components/SCToastNotifications"));
 const SCUser_1 = tslib_1.__importDefault(require("./components/SCUser"));
 const SCUserActionIconButton_1 = tslib_1.__importDefault(require("./components/SCUserActionIconButton"));
@@ -408,6 +418,7 @@ const theme = {
         SCEventSubscribeButton: SCEventSubscribeButton_1.default,
         SCEventParticipantsButton: SCEventParticipantsButton_1.default,
         SCMyEventsWidget: SCMyEventsWidget_1.default,
+        SCEventMediaWidget: SCEventMediaWidget_1.default,
         SCCalendar: SCCalendar_1.default,
         SCCreateEventWidget: SCCreateEventWidget_1.default,
         SCSuggestedEventsWidget: SCSuggestedEventsWidget_1.default,
@@ -416,7 +427,16 @@ const theme = {
         SCVoteAudienceButton: SCVoteAudienceButton_1.default,
         SCVoteButton: SCVoteButton_1.default,
         SCWidget: SCWidget_1.default,
-        SCEventMediaWidget: SCEventMediaWidget_1.default
+        SCLiveStream: SCLiveStream_1.default,
+        SCLiveStreamInfoDetails: SCLiveStreamInfoDetails_1.default,
+        SCUpScalingTierBadge: SCUpScalingTierBadge_1.default,
+        SCUserLiveStreamWidget: SCUserLiveStreamWidget_1.default,
+        SCCreateLiveStreamDialog: SCLiveStreamDialog_1.default,
+        SCLiveStreamSelector: SCLiveStreamSelector_1.default,
+        SCLiveStreamForm: SCLiveStreamForm_1.default,
+        SCLiveStreamFormSettings: SCLiveStreamFormSettings_1.default,
+        SCLiveStreamRoom: SCLiveStreamRoom_1.default,
+        SCLiveStreamVideoConference: SCLiveStreamVideoConference_1.default
     },
     selfcommunity: {
         user: {

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

@@ -25,6 +25,9 @@ declare const Component: {
                         '-webkit-box-orient': string;
                     };
                 };
+                '& .SCEventInfoDetails-join-live': {
+                    height: number;
+                };
                 '& .SCEventInfoDetails-in-progress': {
                     width: string;
                     height: string;

package/lib/esm/components/SCEventInfoDetails.js

@@ -23,6 +23,9 @@ const Component = {
                         '-webkit-box-orient': 'vertical'
                     }
                 },
+                '& .SCEventInfoDetails-join-live': {
+                    height: 20
+                },
                 '& .SCEventInfoDetails-in-progress': {
                     width: '6px',
                     height: '6px',

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

@@ -0,0 +1,218 @@
+declare const Component: {
+    styleOverrides: {
+        root: ({ theme }: any) => {};
+        detailRoot: ({ theme }: any) => {
+            '& .SCLiveStream-detail-image-wrapper': {
+                position: string;
+                '& .SCLiveStream-detail-image': {
+                    height: string;
+                };
+                '& .SCLiveStream-detail-in-progress': {
+                    backgroundColor: any;
+                    position: string;
+                    top: number;
+                    right: number;
+                    color: any;
+                    boxShadow: string;
+                };
+            };
+            '& .SCLiveStream-detail-content': {
+                padding: string;
+                '& .SCLiveStream-detail-user': {
+                    marginTop: string;
+                    '& .SCBaseItemButton-text': {
+                        margin: number;
+                    };
+                };
+                '& .SCLiveStream-detail-name-wrapper': {
+                    textDecoration: string;
+                    color: string;
+                    '& .SCLiveStream-detail-name': {
+                        marginBottom: string;
+                    };
+                };
+                '& .SCLiveStream-detail-first-divider': {
+                    marginTop: string;
+                    marginBottom: any;
+                };
+                '& .SCLiveStream-detail-second-divider': {
+                    marginTop: any;
+                    marginBottom: string;
+                };
+            };
+        };
+        previewRoot: ({ theme }: any) => {
+            '& .SCLiveStream-preview-image-wrapper': {
+                position: string;
+                '& .SCLiveStream-preview-image': {
+                    height: string;
+                };
+                '& .SCLiveStream-preview-in-progress': {
+                    height: number;
+                    backgroundColor: any;
+                    position: string;
+                    top: number;
+                    right: number;
+                    color: any;
+                    boxShadow: string;
+                    '& span': {
+                        fontSize: string;
+                        paddingLeft: any;
+                        paddingRight: any;
+                    };
+                };
+            };
+            '& .SCLiveStream-preview-content': {
+                padding: string;
+                '& .SCLiveStreamInfoDetails-icon-text-wrapper': {
+                    '& .MuiTypography-root': {
+                        fontSize: string;
+                    };
+                };
+                '& .SCLiveStream-detail-user': {
+                    marginTop: string;
+                    '& .SCBaseItemButton-text': {
+                        margin: number;
+                    };
+                };
+                '& .SCLiveStream-preview-name-wrapper': {
+                    marginTop: number;
+                    textDecoration: string;
+                    color: string;
+                    '& h5': {
+                        whiteSpace: string;
+                        overflow: string;
+                        textOverflow: string;
+                    };
+                };
+            };
+        };
+        snippetRoot: ({ theme }: any) => {
+            overflow: string;
+            boxSizing: string;
+            paddingLeft: string;
+            paddingRight: string;
+            '& .SCBaseItem-image': {
+                '& .MuiAvatar-root': {
+                    width: number;
+                    height: number;
+                    borderRadius: string;
+                    '& img': {
+                        borderRadius: string;
+                    };
+                };
+            };
+            '& .SCLiveStream-snippet-image': {
+                position: string;
+                '& .SCLiveStream-snippet-in-progress': {
+                    height: number;
+                    backgroundColor: any;
+                    position: string;
+                    top: number;
+                    right: number;
+                    color: any;
+                    boxShadow: string;
+                    '& span': {
+                        fontSize: string;
+                        paddingLeft: any;
+                        paddingRight: any;
+                    };
+                };
+            };
+            '& .SCBaseItem-text': {
+                fontSize: any;
+                '& .SCLiveStream-snippet-primary': {
+                    color: any;
+                    textDecoration: string;
+                    '&:hover': {
+                        textDecoration: string;
+                    };
+                    '& p': {
+                        fontWeight: any;
+                    };
+                };
+                '& .SCLiveStream-snippet-secondary': {
+                    color: any;
+                };
+            };
+        };
+        skeletonRoot: ({ theme }: any) => {
+            '& .SCLiveStream-skeleton-detail-root': {
+                '& .SCLiveStream-skeleton-detail-calendar': {
+                    position: string;
+                    bottom: string;
+                    left: string;
+                    boxShadow: string;
+                };
+                '& .SCLiveStream-skeleton-detail-content': {
+                    padding: string;
+                    '& .SCLiveStream-skeleton-detail-user': {
+                        marginTop: string;
+                        '& .SCBaseItemButton-text': {
+                            margin: number;
+                        };
+                    };
+                    '& .SCLiveStream-skeleton-detail-name-wrapper': {
+                        textDecoration: string;
+                        color: string;
+                        '& .SCLiveStream-skeleton-detail-name': {
+                            marginBottom: string;
+                        };
+                    };
+                    '& .SCLiveStream-skeleton-detail-first-divider': {
+                        marginTop: string;
+                        marginBottom: any;
+                    };
+                    '& .SCLiveStream-skeleton-detail-second-divider': {
+                        marginTop: any;
+                        marginBottom: string;
+                    };
+                };
+            };
+            '& .SCLiveStream-skeleton-preview-root': {
+                '& .SCLiveStream-skeleton-preview-content': {
+                    padding: any;
+                };
+                '& .SCLiveStream-skeleton-preview-image': {
+                    position: string;
+                    '& .MuiSkeleton-root': {
+                        borderRadius: string;
+                    };
+                    '& .MuiIcon-root': {
+                        color: any;
+                        position: string;
+                        top: string;
+                        left: string;
+                        transform: string;
+                    };
+                };
+                '& .SCBaseItem-actions': {
+                    maxWidth: string;
+                };
+            };
+            '& .SCLiveStream-skeleton-snippet-root': {
+                overflow: string;
+                boxSizing: string;
+                paddingLeft: string;
+                paddingRight: string;
+                '& .SCLiveStream-skeleton-snippet-image': {
+                    position: string;
+                    '& .MuiSkeleton-root': {
+                        borderRadius: string;
+                    };
+                    '& .MuiIcon-root': {
+                        color: any;
+                        position: string;
+                        top: string;
+                        left: string;
+                        transform: string;
+                    };
+                };
+                '& .SCBaseItem-actions': {
+                    maxWidth: string;
+                };
+            };
+        };
+    };
+};
+export default Component;

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;