@selfcommunity/react-theme-default 0.5.0-alpha.1 → 0.5.0-alpha.3

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

@@ -0,0 +1,157 @@
+declare const Component: {
+    styleOverrides: {
+        root: ({ theme }: any) => {
+            "& .SCPaywallsConfigurator-new-product": {
+                background: string;
+                padding: any;
+                marginTop: any;
+                borderRadius: any;
+            };
+            "& .SCPaywallsConfigurator-no-product": {
+                textDecoration: string;
+                paddingLeft: number;
+                color: "#bdbdbd";
+            };
+            "& .SCPaywallsConfigurator-content-access-type": {
+                '& > p': {
+                    marginBottom: any;
+                };
+                '& .MuiPaper-root': {
+                    borderColor: string;
+                };
+                '& .MuiAccordion-root:first-of-type': {
+                    borderTopLeftRadius: number;
+                    borderTopRightRadius: number;
+                };
+                '& .MuiAccordion-root:last-of-type': {
+                    borderBottomLeftRadius: number;
+                    borderBottomRightRadius: number;
+                };
+                "& .SCPaywallsConfigurator-selected-payment-products-list": {
+                    borderTop: string;
+                    marginTop: number;
+                };
+                "& .SCPaywallsConfigurator-add-payment-product": {
+                    position: string;
+                    left: number;
+                    '& .MuiButton-startIcon': {
+                        fontSize: string;
+                    };
+                };
+            };
+        };
+        paymentProductsAutocompletePopperRoot: ({ theme }: any) => {
+            "& .MuiAutocomplete-paper": {
+                boxShadow: string;
+                margin: number;
+                color: string;
+                fontSize: number;
+            };
+            "& .MuiAutocomplete-listbox": {
+                backgroundColor: string;
+                padding: number;
+                "& .MuiAutocomplete-option": {
+                    minHeight: string;
+                    alignItems: string;
+                    padding: number;
+                    borderBottom: string;
+                    '&[aria-selected="true"]': {
+                        backgroundColor: string;
+                    };
+                    "&.MuiAutocomplete-focused, &.MuiAutocomplete-focused[aria-selected=\"true\"]": {
+                        backgroundColor: any;
+                    };
+                };
+            };
+            "&.MuiAutocomplete-popperDisablePortal": {
+                position: string;
+            };
+            "& .SCPaywallsConfigurator-product-check-icon": {
+                width: number;
+                height: number;
+                margin: string;
+            };
+            "& .SCPaywallsConfigurator-product-card-icon": {
+                width: number;
+                height: number;
+                flexShrink: number;
+                borderRadius: string;
+                marginRight: any;
+                marginTop: string;
+                padding: string;
+                backgroundColor: string;
+                color: string;
+            };
+            "& .SCPaywallsConfigurator-product-content": {
+                flexGrow: number;
+                '& span': {
+                    color: string;
+                };
+            };
+            "& .SCPaywallsConfigurator-product-remove-icon": {
+                opacity: number;
+                width: number;
+                height: number;
+            };
+            "& .SCPaywallsConfigurator-autocomplete-footer": {
+                backgroundColor: "#bdbdbd";
+            };
+            "& .SCPaywallsConfigurator-autocomplete-products-loading": {
+                width: string;
+                minHeight: number;
+                display: string;
+                alignItems: string;
+                justifyContent: string;
+            };
+        };
+        paymentProductsPopperRoot: ({ theme }: any) => {
+            border: string;
+            boxShadow: string;
+            borderRadius: number;
+            width: number;
+            zIndex: any;
+            fontSize: number;
+            color: string;
+            backgroundColor: string;
+            '& .MuiPaper-root': {
+                borderRadius: number;
+            };
+            "& .SCPaywallsConfigurator-payment-products-popper-title": {
+                borderBottom: string;
+                padding: string;
+                fontWeight: number;
+            };
+            "& .SCPaywallsConfigurator-payment-products-popper-footer": {
+                borderTop: string;
+                padding: string;
+                display: string;
+                alignItems: string;
+                justifyContent: string;
+                '& button': {
+                    padding: string;
+                    '& .MuiIcon-root': {
+                        fontSize: number;
+                    };
+                };
+            };
+        };
+        filterInputRoot: ({ theme }: any) => {
+            padding: number;
+            width: string;
+            borderBottom: string;
+            '& input': {
+                borderRadius: number;
+                backgroundColor: string;
+                padding: number;
+                transition: any;
+                border: string;
+                fontSize: number;
+                '&:focus': {
+                    boxShadow: string;
+                    borderColor: string;
+                };
+            };
+        };
+    };
+};
+export default Component;

package/lib/esm/components/SCPaywallsConfigurator.js

@@ -0,0 +1,158 @@
+import { grey } from '@mui/material/colors';
+const Component = {
+    styleOverrides: {
+        root: ({ theme }) => ({
+            [`& .SCPaywallsConfigurator-new-product`]: {
+                background: '#eeeeee',
+                padding: theme.spacing(2),
+                marginTop: theme.spacing(),
+                borderRadius: theme.spacing(1)
+            },
+            [`& .SCPaywallsConfigurator-no-product`]: {
+                textDecoration: 'italic',
+                paddingLeft: 0,
+                color: grey[400]
+            },
+            [`& .SCPaywallsConfigurator-content-access-type`]: {
+                '& > p': {
+                    marginBottom: theme.spacing(2)
+                },
+                '& .MuiPaper-root': {
+                    borderColor: '#c6c6c6'
+                },
+                '& .MuiAccordion-root:first-of-type': {
+                    borderTopLeftRadius: 5,
+                    borderTopRightRadius: 5
+                },
+                '& .MuiAccordion-root:last-of-type': {
+                    borderBottomLeftRadius: 5,
+                    borderBottomRightRadius: 5
+                },
+                [`& .SCPaywallsConfigurator-selected-payment-products-list`]: {
+                    borderTop: '1px solid',
+                    marginTop: 10
+                },
+                [`& .SCPaywallsConfigurator-add-payment-product`]: {
+                    position: 'relative',
+                    left: -23,
+                    '& .MuiButton-startIcon': {
+                        fontSize: '15px'
+                    }
+                }
+            }
+        }),
+        paymentProductsAutocompletePopperRoot: ({ theme }) => ({
+            [`& .MuiAutocomplete-paper`]: {
+                boxShadow: 'none',
+                margin: 0,
+                color: 'inherit',
+                fontSize: 13
+            },
+            [`& .MuiAutocomplete-listbox`]: {
+                backgroundColor: theme.palette.mode === 'light' ? '#fff' : '#1c2128',
+                padding: 0,
+                [`& .MuiAutocomplete-option`]: {
+                    minHeight: 'auto',
+                    alignItems: 'flex-start',
+                    padding: 8,
+                    borderBottom: `1px solid  ${theme.palette.mode === 'light' ? ' #eaecef' : '#30363d'}`,
+                    '&[aria-selected="true"]': {
+                        backgroundColor: 'transparent'
+                    },
+                    [`&.MuiAutocomplete-focused, &.MuiAutocomplete-focused[aria-selected="true"]`]: {
+                        backgroundColor: theme.palette.action.hover
+                    }
+                }
+            },
+            [`&.MuiAutocomplete-popperDisablePortal`]: {
+                position: 'relative'
+            },
+            [`& .SCPaywallsConfigurator-product-check-icon`]: {
+                width: 17,
+                height: 17,
+                margin: '3px 5px 0px -1px'
+            },
+            [`& .SCPaywallsConfigurator-product-card-icon`]: {
+                width: 14,
+                height: 14,
+                flexShrink: 0,
+                borderRadius: '3px',
+                marginRight: theme.spacing(),
+                marginTop: '2px',
+                padding: '3px',
+                backgroundColor: 'red',
+                color: 'white'
+            },
+            [`& .SCPaywallsConfigurator-product-content`]: {
+                flexGrow: 1,
+                '& span': {
+                    color: '#8b949e'
+                }
+            },
+            [`& .SCPaywallsConfigurator-product-remove-icon`]: {
+                opacity: 0.6,
+                width: 18,
+                height: 18
+            },
+            [`& .SCPaywallsConfigurator-autocomplete-footer`]: {
+                backgroundColor: grey[400]
+            },
+            [`& .SCPaywallsConfigurator-autocomplete-products-loading`]: {
+                width: '100%',
+                minHeight: 300,
+                display: 'flex',
+                alignItems: 'center',
+                justifyContent: 'center'
+            }
+        }),
+        paymentProductsPopperRoot: ({ theme }) => ({
+            border: `1px solid ${theme.palette.mode === 'light' ? '#e1e4e8' : '#30363d'}`,
+            boxShadow: `0 8px 24px ${theme.palette.mode === 'light' ? 'rgba(149, 157, 165, 0.2)' : 'rgb(1, 4, 9)'}`,
+            borderRadius: 6,
+            width: 300,
+            zIndex: theme.zIndex.modal,
+            fontSize: 13,
+            color: theme.palette.mode === 'light' ? '#24292e' : '#c9d1d9',
+            backgroundColor: theme.palette.mode === 'light' ? '#fff' : '#1c2128',
+            '& .MuiPaper-root': {
+                borderRadius: 0
+            },
+            [`& .SCPaywallsConfigurator-payment-products-popper-title`]: {
+                borderBottom: `1px solid ${theme.palette.mode === 'light' ? '#eaecef' : '#30363d'}`,
+                padding: '8px 10px',
+                fontWeight: 600
+            },
+            [`& .SCPaywallsConfigurator-payment-products-popper-footer`]: {
+                borderTop: '1px solid #eaecef',
+                padding: '8px',
+                display: 'flex',
+                alignItems: 'flex-end',
+                justifyContent: 'center',
+                '& button': {
+                    padding: '2px 8px',
+                    '& .MuiIcon-root': {
+                        fontSize: 12
+                    }
+                }
+            }
+        }),
+        filterInputRoot: ({ theme }) => ({
+            padding: 10,
+            width: '100%',
+            borderBottom: `1px solid ${theme.palette.mode === 'light' ? '#eaecef' : '#30363d'}`,
+            '& input': {
+                borderRadius: 4,
+                backgroundColor: theme.palette.mode === 'light' ? '#fff' : '#0d1117',
+                padding: 8,
+                transition: theme.transitions.create(['border-color', 'box-shadow']),
+                border: `1px solid ${theme.palette.mode === 'light' ? '#eaecef' : '#30363d'}`,
+                fontSize: 14,
+                '&:focus': {
+                    boxShadow: `0px 0px 0px 3px ${theme.palette.mode === 'light' ? 'rgba(3, 102, 214, 0.3)' : 'rgb(12, 45, 107)'}`,
+                    borderColor: theme.palette.mode === 'light' ? '#0366d6' : '#388bfd'
+                }
+            }
+        })
+    }
+};
+export default Component;

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

@@ -0,0 +1,33 @@
+declare const Component: {
+    styleOverrides: {
+        root: ({ theme }: any) => {
+            display: string;
+            flexDirection: string;
+            marginTop: string;
+            "& .SCPdfPreview-document-pdf-wrapper": {
+                filter: string;
+            };
+            "& .SCPdfPreview-document-pdf-link": {
+                padding: number;
+                '&:hover': {
+                    opacity: number;
+                };
+            };
+            "& .SCPdfPreview-document-pdf-page": {
+                display: string;
+                flexDirection: string;
+                justifyContent: string;
+                marginBottom: any;
+                pageBreakAfter: string;
+                '& .react-pdf__Page__textContent': {
+                    mixBlendMode: string;
+                    opacity: number;
+                };
+                '& .react-pdf__Page__canvas': {
+                    margin: string;
+                };
+            };
+        };
+    };
+};
+export default Component;

package/lib/esm/components/SCPdfPreview.js

@@ -0,0 +1,33 @@
+const Component = {
+    styleOverrides: {
+        root: ({ theme }) => ({
+            display: 'flex',
+            flexDirection: 'column',
+            marginTop: '12px',
+            [`& .SCPdfPreview-document-pdf-wrapper`]: {
+                filter: 'drop-shadow(0 0 5px #00000040)'
+            },
+            [`& .SCPdfPreview-document-pdf-link`]: {
+                padding: 10,
+                '&:hover': {
+                    opacity: 0.5
+                }
+            },
+            [`& .SCPdfPreview-document-pdf-page`]: {
+                display: 'flex',
+                flexDirection: 'column',
+                justifyContent: 'center',
+                marginBottom: theme.spacing(3),
+                pageBreakAfter: 'always',
+                '& .react-pdf__Page__textContent': {
+                    mixBlendMode: 'multiply',
+                    opacity: 0.6
+                },
+                '& .react-pdf__Page__canvas': {
+                    margin: 'auto'
+                }
+            }
+        })
+    }
+};
+export default Component;