@selfcommunity/react-theme-default 0.4.5-payments.213 → 0.4.5-payments.214

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (40) hide show
  1. package/lib/cjs/components/SCCheckout.d.ts +4 -2
  2. package/lib/cjs/components/SCCheckout.js +7 -4
  3. package/lib/cjs/components/SCCheckoutHeaderInfoWidget.d.ts +34 -0
  4. package/lib/cjs/components/SCCheckoutHeaderInfoWidget.js +34 -0
  5. package/lib/cjs/components/SCCourseDashboard.d.ts +22 -0
  6. package/lib/cjs/components/SCCourseDashboard.js +22 -0
  7. package/lib/cjs/components/SCEventSubscribeButton.d.ts +12 -0
  8. package/lib/cjs/components/SCEventSubscribeButton.js +10 -0
  9. package/lib/cjs/components/SCGroupHeader.d.ts +12 -0
  10. package/lib/cjs/components/SCGroupHeader.js +12 -0
  11. package/lib/cjs/components/SCGroupSubscribeButton.d.ts +18 -0
  12. package/lib/cjs/components/SCGroupSubscribeButton.js +18 -0
  13. package/lib/cjs/components/SCPaymentProduct.d.ts +20 -22
  14. package/lib/cjs/components/SCPaymentProduct.js +24 -26
  15. package/lib/cjs/components/SCPaymentProductPrice.d.ts +19 -2
  16. package/lib/cjs/components/SCPaymentProductPrice.js +19 -2
  17. package/lib/cjs/components/SCPaymentProducts.js +1 -1
  18. package/lib/cjs/index.d.ts +142 -26
  19. package/lib/cjs/index.js +5 -1
  20. package/lib/esm/components/SCCheckout.d.ts +4 -2
  21. package/lib/esm/components/SCCheckout.js +7 -4
  22. package/lib/esm/components/SCCheckoutHeaderInfoWidget.d.ts +34 -0
  23. package/lib/esm/components/SCCheckoutHeaderInfoWidget.js +32 -0
  24. package/lib/esm/components/SCCourseDashboard.d.ts +22 -0
  25. package/lib/esm/components/SCCourseDashboard.js +22 -0
  26. package/lib/esm/components/SCEventSubscribeButton.d.ts +12 -0
  27. package/lib/esm/components/SCEventSubscribeButton.js +10 -0
  28. package/lib/esm/components/SCGroupHeader.d.ts +12 -0
  29. package/lib/esm/components/SCGroupHeader.js +12 -0
  30. package/lib/esm/components/SCGroupSubscribeButton.d.ts +18 -0
  31. package/lib/esm/components/SCGroupSubscribeButton.js +16 -0
  32. package/lib/esm/components/SCPaymentProduct.d.ts +20 -22
  33. package/lib/esm/components/SCPaymentProduct.js +24 -26
  34. package/lib/esm/components/SCPaymentProductPrice.d.ts +19 -2
  35. package/lib/esm/components/SCPaymentProductPrice.js +19 -2
  36. package/lib/esm/components/SCPaymentProducts.js +1 -1
  37. package/lib/esm/index.d.ts +142 -26
  38. package/lib/esm/index.js +5 -1
  39. package/lib/umd/react-theme-default.js +1 -1
  40. package/package.json +2 -2
@@ -21,6 +21,7 @@ declare const Component: {
21
21
  maxWidth: number;
22
22
  display: string;
23
23
  gridTemplateColumns: string;
24
+ padding: any;
24
25
  gap: number;
25
26
  "& .SCCheckout-content-object": {
26
27
  [x: number]: {
@@ -33,6 +34,9 @@ declare const Component: {
33
34
  alignItems: string;
34
35
  '& .SCWidget-root': {
35
36
  width: string;
37
+ '& .SCEvent-preview-content': {
38
+ padding: string;
39
+ };
36
40
  };
37
41
  };
38
42
  "& .SCCheckout-content-coverage": {
@@ -50,7 +54,6 @@ declare const Component: {
50
54
  justifyContent: string;
51
55
  alignItems: string;
52
56
  maxWidth: number;
53
- padding: any;
54
57
  };
55
58
  };
56
59
  "& .SCCheckout-checkout": {
@@ -62,7 +65,6 @@ declare const Component: {
62
65
  minWidth: number;
63
66
  width: string;
64
67
  };
65
- margin: any;
66
68
  width: string;
67
69
  };
68
70
  "& .SCCheckout-payment-order": {
@@ -15,6 +15,7 @@ const Component = {
15
15
  maxWidth: 860,
16
16
  display: 'grid',
17
17
  gridTemplateColumns: '1fr 1fr',
18
+ padding: theme.spacing(2),
18
19
  gap: 0,
19
20
  [theme.breakpoints.down(1034)]: {
20
21
  display: 'flex',
@@ -32,7 +33,10 @@ const Component = {
32
33
  width: '90%'
33
34
  },
34
35
  '& .SCWidget-root': {
35
- width: '93%'
36
+ width: '93%',
37
+ '& .SCEvent-preview-content': {
38
+ padding: `${theme.spacing(2)} !important`
39
+ }
36
40
  }
37
41
  },
38
42
  ['& .SCCheckout-content-coverage']: {
@@ -49,8 +53,7 @@ const Component = {
49
53
  [theme.breakpoints.down(1034)]: {
50
54
  display: 'none'
51
55
  },
52
- maxWidth: 600,
53
- padding: theme.spacing(4)
56
+ maxWidth: 600
54
57
  }
55
58
  },
56
59
  ['& .SCCheckout-checkout']: {
@@ -58,7 +61,7 @@ const Component = {
58
61
  bottom: theme.spacing(2)
59
62
  },
60
63
  ['& .SCCheckout-object']: {
61
- margin: theme.spacing(2, 2, 0.5, 0),
64
+ // margin: theme.spacing(2, 2, 0.5, 0),
62
65
  width: '100%',
63
66
  [theme.breakpoints.up('sm')]: {
64
67
  minWidth: 395,
@@ -0,0 +1,34 @@
1
+ declare const Component: {
2
+ styleOverrides: {
3
+ root: ({ theme }: {
4
+ theme: any;
5
+ }) => {
6
+ '& .SCCheckoutHeaderInfoWidget-header': {
7
+ height: any;
8
+ position: string;
9
+ backgroundColor: any;
10
+ color: string;
11
+ textAlign: string;
12
+ '& img': {
13
+ position: string;
14
+ left: string;
15
+ top: any;
16
+ transform: string;
17
+ };
18
+ '& .MuiIcon-root': {
19
+ top: any;
20
+ position: string;
21
+ };
22
+ };
23
+ '& .SCCheckoutHeaderInfoWidget-content': {
24
+ padding: any;
25
+ justifyContent: string;
26
+ '& .MuiTypography-body2': {
27
+ paddingTop: any;
28
+ whiteSpace: string;
29
+ };
30
+ };
31
+ };
32
+ };
33
+ };
34
+ export default Component;
@@ -0,0 +1,34 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ const Component = {
4
+ styleOverrides: {
5
+ root: ({ theme }) => ({
6
+ '& .SCCheckoutHeaderInfoWidget-header': {
7
+ height: theme.spacing(10),
8
+ position: 'relative',
9
+ backgroundColor: theme.palette.primary.main,
10
+ color: 'white',
11
+ textAlign: 'center',
12
+ '& img': {
13
+ position: 'absolute',
14
+ left: '50%',
15
+ top: theme.spacing(1),
16
+ transform: 'translateX(-50%)'
17
+ },
18
+ '& .MuiIcon-root': {
19
+ top: theme.spacing(5),
20
+ position: 'relative'
21
+ }
22
+ },
23
+ '& .SCCheckoutHeaderInfoWidget-content': {
24
+ padding: theme.spacing(1.5),
25
+ justifyContent: 'center',
26
+ '& .MuiTypography-body2': {
27
+ paddingTop: theme.spacing(1),
28
+ whiteSpace: 'pre-line'
29
+ }
30
+ }
31
+ })
32
+ }
33
+ };
34
+ exports.default = Component;
@@ -52,6 +52,18 @@ declare const Component: {
52
52
  alignItems: string;
53
53
  gap: any;
54
54
  };
55
+ '& .SCBuyButton-request-root': {
56
+ fontWeight: any;
57
+ '& .MuiButton-startIcon': {
58
+ marginRight: any;
59
+ '& .MuiIcon-root': {
60
+ fontSize: string;
61
+ };
62
+ };
63
+ '&.Mui-selected, &:hover': {
64
+ backgroundColor: string;
65
+ };
66
+ };
55
67
  };
56
68
  };
57
69
  };
@@ -178,6 +190,16 @@ declare const Component: {
178
190
  };
179
191
  margin: string;
180
192
  gap: string;
193
+ '& .SCBuyButton-request-root': {
194
+ '&:hover, &:active': {
195
+ backgroundColor: any;
196
+ color: any;
197
+ border: string;
198
+ '& .MuiIcon-root': {
199
+ color: any;
200
+ };
201
+ };
202
+ };
181
203
  };
182
204
  };
183
205
  '& .SCCourseDashboard-lessons-sections': {
@@ -52,6 +52,18 @@ const Component = {
52
52
  flexDirection: 'row',
53
53
  alignItems: 'center',
54
54
  gap: theme.spacing(1)
55
+ },
56
+ '& .SCBuyButton-request-root': {
57
+ fontWeight: theme.typography.fontWeightBold,
58
+ '& .MuiButton-startIcon': {
59
+ marginRight: theme.spacing(0.5),
60
+ '& .MuiIcon-root': {
61
+ fontSize: '1.5rem'
62
+ }
63
+ },
64
+ '&.Mui-selected, &:hover': {
65
+ backgroundColor: 'transparent'
66
+ }
55
67
  }
56
68
  }
57
69
  }
@@ -175,6 +187,16 @@ const Component = {
175
187
  [theme.breakpoints.up('sm')]: {
176
188
  flexDirection: 'row',
177
189
  margin: 0
190
+ },
191
+ '& .SCBuyButton-request-root': {
192
+ '&:hover, &:active': {
193
+ backgroundColor: theme.palette.common.white,
194
+ color: theme.palette.primary.main,
195
+ border: `1px solid ${theme.palette.primary.main}`,
196
+ '& .MuiIcon-root': {
197
+ color: theme.palette.primary.main
198
+ }
199
+ }
178
200
  }
179
201
  }
180
202
  },
@@ -49,6 +49,18 @@ declare const Component: {
49
49
  requestRoot: ({ theme }: {
50
50
  theme: any;
51
51
  }) => {};
52
+ buyButtonRoot: ({ theme }: {
53
+ theme: any;
54
+ }) => {
55
+ '&:hover, &:active': {
56
+ backgroundColor: any;
57
+ color: any;
58
+ border: string;
59
+ '& .MuiIcon-root': {
60
+ color: any;
61
+ };
62
+ };
63
+ };
52
64
  menuRoot: ({ theme }: {
53
65
  theme: any;
54
66
  }) => {
@@ -47,6 +47,16 @@ const Component = {
47
47
  }
48
48
  }),
49
49
  requestRoot: ({ theme }) => ({}),
50
+ buyButtonRoot: ({ theme }) => ({
51
+ '&:hover, &:active': {
52
+ backgroundColor: theme.palette.common.white,
53
+ color: theme.palette.primary.main,
54
+ border: `1px solid ${theme.palette.primary.main}`,
55
+ '& .MuiIcon-root': {
56
+ color: theme.palette.primary.main
57
+ }
58
+ }
59
+ }),
50
60
  menuRoot: ({ theme }) => ({
51
61
  '& .MuiPaper-root': {
52
62
  width: 195,
@@ -39,6 +39,18 @@ declare const Component: {
39
39
  alignItems: string;
40
40
  gap: any;
41
41
  };
42
+ '& .SCBuyButton-request-root': {
43
+ fontWeight: any;
44
+ '& .MuiButton-startIcon': {
45
+ marginRight: any;
46
+ '& .MuiIcon-root': {
47
+ fontSize: string;
48
+ };
49
+ };
50
+ '&.Mui-selected, &:hover': {
51
+ backgroundColor: string;
52
+ };
53
+ };
42
54
  };
43
55
  '& .SCGroupHeader-multi-actions': {
44
56
  display: string;
@@ -40,6 +40,18 @@ const Component = {
40
40
  justifyContent: 'center',
41
41
  alignItems: 'center',
42
42
  gap: theme.spacing(0.5)
43
+ },
44
+ '& .SCBuyButton-request-root': {
45
+ fontWeight: theme.typography.fontWeightBold,
46
+ '& .MuiButton-startIcon': {
47
+ marginRight: theme.spacing(0.5),
48
+ '& .MuiIcon-root': {
49
+ fontSize: '1.5rem'
50
+ }
51
+ },
52
+ '&.Mui-selected, &:hover': {
53
+ backgroundColor: 'transparent'
54
+ }
43
55
  }
44
56
  },
45
57
  '& .SCGroupHeader-multi-actions': {
@@ -0,0 +1,18 @@
1
+ declare const Component: {
2
+ styleOverrides: {
3
+ buyButtonRoot: ({ theme }: {
4
+ theme: any;
5
+ }) => {
6
+ border: string;
7
+ '&:hover, &:active': {
8
+ backgroundColor: any;
9
+ color: any;
10
+ border: string;
11
+ '& .MuiIcon-root': {
12
+ color: any;
13
+ };
14
+ };
15
+ };
16
+ };
17
+ };
18
+ export default Component;
@@ -0,0 +1,18 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ const Component = {
4
+ styleOverrides: {
5
+ buyButtonRoot: ({ theme }) => ({
6
+ border: `1px solid transparent`,
7
+ '&:hover, &:active': {
8
+ backgroundColor: theme.palette.common.white,
9
+ color: theme.palette.primary.main,
10
+ border: `1px solid ${theme.palette.primary.main}`,
11
+ '& .MuiIcon-root': {
12
+ color: theme.palette.primary.main
13
+ }
14
+ }
15
+ })
16
+ }
17
+ };
18
+ exports.default = Component;
@@ -3,47 +3,45 @@ declare const Component: {
3
3
  root: ({ theme }: {
4
4
  theme: any;
5
5
  }) => {
6
+ marginBottom: any;
6
7
  borderRadius: string;
7
- '& .MuiAccordionSummary-root': {
8
- backgroundColor: any;
9
- '& .MuiAccordionSummary-content': {
10
- display: string;
11
- flexDirection: string;
12
- '& .SCBaseItem-root': {
13
- backgroundColor: string;
14
- };
15
- '& .MuiTypography-body1': {
16
- [x: number]: {
17
- fontSize: any;
18
- };
19
- fontWeight: number;
20
- color: any;
21
- };
8
+ boxShadow: string;
9
+ backgroundColor: any;
10
+ '& .MuiCardContent-root': {
11
+ '& .SCBaseItem-root': {
12
+ backgroundColor: string;
22
13
  };
23
- '& .MuiAccordionDetails-root': {
24
- marginTop: any;
14
+ '& .MuiTypography-body1': {
15
+ [x: number]: {
16
+ fontSize: any;
17
+ };
18
+ fontWeight: number;
19
+ color: any;
25
20
  };
26
21
  };
27
22
  '& .SCPaymentProductPrice-root': {
28
- marginBottom: any;
29
23
  width: string;
30
- borderRadius: string;
24
+ paddingLeft: string;
31
25
  };
32
26
  };
33
27
  skeletonRoot: ({ theme }: {
34
28
  theme: any;
35
29
  }) => {
30
+ marginBottom: any;
36
31
  borderRadius: string;
37
- '& .MuiAccordionSummary-root': {
38
- backgroundColor: any;
32
+ boxShadow: string;
33
+ backgroundColor: any;
34
+ '& .MuiCardContent-root': {
39
35
  marginBottom: any;
40
36
  '& .SCBaseItem-root': {
41
37
  backgroundColor: string;
38
+ boxShadow: string;
42
39
  };
43
40
  };
44
41
  '& .SCPaymentProductPrice-skeleton-root': {
45
- marginBottom: any;
42
+ marginTop: any;
46
43
  width: string;
44
+ paddingLeft: string;
47
45
  };
48
46
  };
49
47
  };
@@ -3,45 +3,43 @@ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  const Component = {
4
4
  styleOverrides: {
5
5
  root: ({ theme }) => ({
6
- borderRadius: '3px !important',
7
- '& .MuiAccordionSummary-root': {
8
- backgroundColor: theme.palette.grey[50],
9
- '& .MuiAccordionSummary-content': {
10
- display: 'block',
11
- flexDirection: 'row',
12
- '& .SCBaseItem-root': {
13
- backgroundColor: 'transparent'
14
- },
15
- '& .MuiTypography-body1': {
16
- fontWeight: 200,
17
- color: theme.palette.grey[600],
18
- [theme.breakpoints.down('sm')]: {
19
- fontSize: theme.typography.pxToRem(12)
20
- }
21
- }
6
+ marginBottom: theme.spacing(2),
7
+ borderRadius: '10px',
8
+ boxShadow: 'none',
9
+ backgroundColor: theme.palette.grey['A200'],
10
+ '& .MuiCardContent-root': {
11
+ '& .SCBaseItem-root': {
12
+ backgroundColor: 'transparent'
22
13
  },
23
- '& .MuiAccordionDetails-root': {
24
- marginTop: theme.spacing()
14
+ '& .MuiTypography-body1': {
15
+ fontWeight: 200,
16
+ color: theme.palette.grey[600],
17
+ [theme.breakpoints.down('sm')]: {
18
+ fontSize: theme.typography.pxToRem(12)
19
+ }
25
20
  }
26
21
  },
27
22
  '& .SCPaymentProductPrice-root': {
28
- marginBottom: theme.spacing(),
29
23
  width: 'auto',
30
- borderRadius: '3px'
24
+ paddingLeft: `${theme.spacing(0)} !important`
31
25
  }
32
26
  }),
33
27
  skeletonRoot: ({ theme }) => ({
34
- borderRadius: '3px !important',
35
- '& .MuiAccordionSummary-root': {
36
- backgroundColor: theme.palette.grey[50],
28
+ marginBottom: theme.spacing(2),
29
+ borderRadius: '10px',
30
+ boxShadow: 'none',
31
+ backgroundColor: theme.palette.grey['A200'],
32
+ '& .MuiCardContent-root': {
37
33
  marginBottom: theme.spacing(1),
38
34
  '& .SCBaseItem-root': {
39
- backgroundColor: 'transparent'
35
+ backgroundColor: 'transparent',
36
+ boxShadow: 'none'
40
37
  }
41
38
  },
42
39
  '& .SCPaymentProductPrice-skeleton-root': {
43
- marginBottom: theme.spacing(),
44
- width: 'auto'
40
+ marginTop: theme.spacing(1),
41
+ width: 'auto',
42
+ paddingLeft: `${theme.spacing(0)} !important`
45
43
  }
46
44
  })
47
45
  }
@@ -3,7 +3,24 @@ declare const Component: {
3
3
  root: ({ theme }: {
4
4
  theme: any;
5
5
  }) => {
6
- borderRadius: string;
6
+ borderRadius: number;
7
+ boxShadow: string;
8
+ '& .SCPaymentProductPrice-primary': {
9
+ fontSize: string;
10
+ fontWeight: string;
11
+ color: string;
12
+ };
13
+ '& .SCPaymentProductPrice-button': {
14
+ textTransform: string;
15
+ '&:hover, &:active': {
16
+ backgroundColor: any;
17
+ color: any;
18
+ border: string;
19
+ '& .MuiIcon-root': {
20
+ color: any;
21
+ };
22
+ };
23
+ };
7
24
  '& .SCPaymentProductPrice-button-purchased': {
8
25
  backgroundColor: string;
9
26
  color: string;
@@ -15,7 +32,7 @@ declare const Component: {
15
32
  skeletonRoot: ({ theme }: {
16
33
  theme: any;
17
34
  }) => {
18
- borderRadius: string;
35
+ borderRadius: number;
19
36
  };
20
37
  };
21
38
  };
@@ -3,7 +3,24 @@ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  const Component = {
4
4
  styleOverrides: {
5
5
  root: ({ theme }) => ({
6
- borderRadius: '3px',
6
+ borderRadius: 0,
7
+ boxShadow: 'none',
8
+ '& .SCPaymentProductPrice-primary': {
9
+ fontSize: '18px',
10
+ fontWeight: '600 !important',
11
+ color: `${theme.palette.primary.main} !important`
12
+ },
13
+ '& .SCPaymentProductPrice-button': {
14
+ textTransform: 'uppercase',
15
+ '&:hover, &:active': {
16
+ backgroundColor: theme.palette.common.white,
17
+ color: theme.palette.primary.main,
18
+ border: `1px solid ${theme.palette.primary.main}`,
19
+ '& .MuiIcon-root': {
20
+ color: theme.palette.primary.main
21
+ }
22
+ }
23
+ },
7
24
  '& .SCPaymentProductPrice-button-purchased': {
8
25
  backgroundColor: `${theme.palette.secondary.main} !important`,
9
26
  color: `${theme.palette.secondary.contrastText} !important`
@@ -13,7 +30,7 @@ const Component = {
13
30
  }
14
31
  }),
15
32
  skeletonRoot: ({ theme }) => ({
16
- borderRadius: '3px'
33
+ borderRadius: 0
17
34
  })
18
35
  }
19
36
  };
@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
3
3
  const Component = {
4
4
  styleOverrides: {
5
5
  root: ({ theme }) => ({
6
- padding: theme.spacing(0.5),
6
+ padding: theme.spacing(0.5)
7
7
  }),
8
8
  skeletonRoot: ({ theme }) => ({
9
9
  padding: theme.spacing(0.5)