@selfcommunity/react-theme-default 1.2.13 → 1.2.14-alpha.1

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 (18) hide show
  1. package/lib/cjs/components/SCLeaderboardInfoWidget.d.ts +25 -0
  2. package/lib/cjs/components/SCLeaderboardInfoWidget.js +27 -0
  3. package/lib/cjs/components/SCLeaderboardPositionWidget.d.ts +49 -0
  4. package/lib/cjs/components/SCLeaderboardPositionWidget.js +52 -0
  5. package/lib/cjs/components/SCLeaderboardWidget.d.ts +148 -0
  6. package/lib/cjs/components/SCLeaderboardWidget.js +151 -0
  7. package/lib/cjs/index.d.ts +219 -3
  8. package/lib/cjs/index.js +6 -0
  9. package/lib/esm/components/SCLeaderboardInfoWidget.d.ts +25 -0
  10. package/lib/esm/components/SCLeaderboardInfoWidget.js +25 -0
  11. package/lib/esm/components/SCLeaderboardPositionWidget.d.ts +49 -0
  12. package/lib/esm/components/SCLeaderboardPositionWidget.js +50 -0
  13. package/lib/esm/components/SCLeaderboardWidget.d.ts +148 -0
  14. package/lib/esm/components/SCLeaderboardWidget.js +149 -0
  15. package/lib/esm/index.d.ts +219 -3
  16. package/lib/esm/index.js +6 -0
  17. package/lib/umd/react-theme-default.js +1 -1
  18. package/package.json +2 -2
package/lib/cjs/index.js CHANGED
@@ -131,6 +131,9 @@ const SCLessonCommentActionsMenu_1 = tslib_1.__importDefault(require("./componen
131
131
  const SCLessonCommentObject_1 = tslib_1.__importDefault(require("./components/SCLessonCommentObject"));
132
132
  const SCLessonCommentObjects_1 = tslib_1.__importDefault(require("./components/SCLessonCommentObjects"));
133
133
  const SCCourseCompletedDialog_1 = tslib_1.__importDefault(require("./components/SCCourseCompletedDialog"));
134
+ const SCLeaderboardInfoWidget_1 = tslib_1.__importDefault(require("./components/SCLeaderboardInfoWidget"));
135
+ const SCLeaderboardPositionWidget_1 = tslib_1.__importDefault(require("./components/SCLeaderboardPositionWidget"));
136
+ const SCLeaderboardWidget_1 = tslib_1.__importDefault(require("./components/SCLeaderboardWidget"));
134
137
  const SCLessonEditForm_1 = tslib_1.__importDefault(require("./components/SCLessonEditForm"));
135
138
  const SCLessonFilePreview_1 = tslib_1.__importDefault(require("./components/SCLessonFilePreview"));
136
139
  const SCLessonTemplate_1 = tslib_1.__importDefault(require("./components/SCLessonTemplate"));
@@ -426,6 +429,9 @@ const theme = {
426
429
  SCLessonCommentObject: SCLessonCommentObject_1.default,
427
430
  SCLessonCommentObjects: SCLessonCommentObjects_1.default,
428
431
  SCCourseCompletedDialog: SCCourseCompletedDialog_1.default,
432
+ SCLeaderboardInfoWidget: SCLeaderboardInfoWidget_1.default,
433
+ SCLeaderboardPositionWidget: SCLeaderboardPositionWidget_1.default,
434
+ SCLeaderboardWidget: SCLeaderboardWidget_1.default,
429
435
  SCLessonEditForm: SCLessonEditForm_1.default,
430
436
  SCLessonFilePreview: SCLessonFilePreview_1.default,
431
437
  SCLessonTemplate: SCLessonTemplate_1.default,
package/lib/esm/components/SCLeaderboardInfoWidget.d.ts ADDED
@@ -0,0 +1,25 @@
1
+ declare const Component: {
2
+ styleOverrides: {
3
+ root: ({ theme }: any) => {
4
+ '& .SCLeaderboardInfoWidget-item-icon': {
5
+ backgroundColor: any;
6
+ };
7
+ '& .SCLeaderboardInfoWidget-item-icon-glyph': {
8
+ display: string;
9
+ width: number;
10
+ height: number;
11
+ backgroundColor: any;
12
+ maskRepeat: string;
13
+ maskPosition: string;
14
+ maskSize: string;
15
+ WebkitMaskRepeat: string;
16
+ WebkitMaskPosition: string;
17
+ WebkitMaskSize: string;
18
+ };
19
+ '& .SCLeaderboardInfoWidget-item-description': {
20
+ color: any;
21
+ };
22
+ };
23
+ };
24
+ };
25
+ export default Component;
package/lib/esm/components/SCLeaderboardInfoWidget.js ADDED
@@ -0,0 +1,25 @@
1
+ const Component = {
2
+ styleOverrides: {
3
+ root: ({ theme }) => ({
4
+ '& .SCLeaderboardInfoWidget-item-icon': {
5
+ backgroundColor: theme.palette.action.hover
6
+ },
7
+ '& .SCLeaderboardInfoWidget-item-icon-glyph': {
8
+ display: 'inline-block',
9
+ width: 18,
10
+ height: 18,
11
+ backgroundColor: theme.palette.primary.main,
12
+ maskRepeat: 'no-repeat',
13
+ maskPosition: 'center',
14
+ maskSize: 'contain',
15
+ WebkitMaskRepeat: 'no-repeat',
16
+ WebkitMaskPosition: 'center',
17
+ WebkitMaskSize: 'contain'
18
+ },
19
+ '& .SCLeaderboardInfoWidget-item-description': {
20
+ color: theme.palette.text.secondary
21
+ }
22
+ })
23
+ }
24
+ };
25
+ export default Component;
package/lib/esm/components/SCLeaderboardPositionWidget.d.ts ADDED
@@ -0,0 +1,49 @@
1
+ declare const Component: {
2
+ styleOverrides: {
3
+ root: ({ theme }: any) => {
4
+ borderRadius: number;
5
+ overflow: string;
6
+ '& .SCLeaderboardPositionWidget-title': {
7
+ fontWeight: any;
8
+ marginBottom: any;
9
+ };
10
+ '& .SCLeaderboardPositionWidget-user': {
11
+ padding: any;
12
+ marginBottom: any;
13
+ textDecoration: string;
14
+ cursor: string;
15
+ };
16
+ '& .SCLeaderboardPositionWidget-user-name': {
17
+ color: any;
18
+ };
19
+ '& .SCLeaderboardPositionWidget-footer': {
20
+ margin: any;
21
+ padding: any;
22
+ backgroundColor: string;
23
+ };
24
+ '& .SCLeaderboardPositionWidget-position': {
25
+ fontWeight: any;
26
+ };
27
+ '& .SCLeaderboardPositionWidget-score': {
28
+ color: any;
29
+ };
30
+ };
31
+ skeletonRoot: ({ theme }: any) => {
32
+ borderRadius: number;
33
+ overflow: string;
34
+ '& .SCLeaderboardPositionWidget-header': {
35
+ marginBottom: any;
36
+ };
37
+ '& .SCLeaderboardPositionWidget-user': {
38
+ padding: any;
39
+ marginBottom: any;
40
+ };
41
+ '& .SCLeaderboardPositionWidget-footer': {
42
+ margin: any;
43
+ padding: any;
44
+ backgroundColor: string;
45
+ };
46
+ };
47
+ };
48
+ };
49
+ export default Component;
package/lib/esm/components/SCLeaderboardPositionWidget.js ADDED
@@ -0,0 +1,50 @@
1
+ import { alpha } from '@mui/material';
2
+ const Component = {
3
+ styleOverrides: {
4
+ root: ({ theme }) => ({
5
+ borderRadius: theme.shape.borderRadius * 2,
6
+ overflow: 'hidden',
7
+ '& .SCLeaderboardPositionWidget-title': {
8
+ fontWeight: theme.typography.fontWeightBold,
9
+ marginBottom: theme.spacing(2)
10
+ },
11
+ '& .SCLeaderboardPositionWidget-user': {
12
+ padding: theme.spacing(1.5),
13
+ marginBottom: theme.spacing(2),
14
+ textDecoration: 'none',
15
+ cursor: 'pointer'
16
+ },
17
+ '& .SCLeaderboardPositionWidget-user-name': {
18
+ color: theme.palette.text.primary
19
+ },
20
+ '& .SCLeaderboardPositionWidget-footer': {
21
+ margin: theme.spacing(0, -2.2, -3, -2.2),
22
+ padding: theme.spacing(2, 2.2),
23
+ backgroundColor: alpha(theme.palette.primary.main, 0.3)
24
+ },
25
+ '& .SCLeaderboardPositionWidget-position': {
26
+ fontWeight: theme.typography.fontWeightBold
27
+ },
28
+ '& .SCLeaderboardPositionWidget-score': {
29
+ color: theme.palette.text.secondary
30
+ }
31
+ }),
32
+ skeletonRoot: ({ theme }) => ({
33
+ borderRadius: theme.shape.borderRadius * 2,
34
+ overflow: 'hidden',
35
+ '& .SCLeaderboardPositionWidget-header': {
36
+ marginBottom: theme.spacing(2)
37
+ },
38
+ '& .SCLeaderboardPositionWidget-user': {
39
+ padding: theme.spacing(1.5),
40
+ marginBottom: theme.spacing(2)
41
+ },
42
+ '& .SCLeaderboardPositionWidget-footer': {
43
+ margin: theme.spacing(0, -2.2, -3, -2.2),
44
+ padding: theme.spacing(2, 2.2),
45
+ backgroundColor: alpha(theme.palette.primary.main, theme.palette.action.hoverOpacity)
46
+ }
47
+ })
48
+ }
49
+ };
50
+ export default Component;
package/lib/esm/components/SCLeaderboardWidget.d.ts ADDED
@@ -0,0 +1,148 @@
1
+ declare const Component: {
2
+ styleOverrides: {
3
+ root: ({ theme }: any) => {
4
+ borderRadius: number;
5
+ '& .SCLeaderboardWidget-podium-header': {
6
+ marginBottom: any;
7
+ };
8
+ '& .SCLeaderboardWidget-podium-title': {
9
+ fontWeight: any;
10
+ };
11
+ '& .SCLeaderboardWidget-podium': {
12
+ gap: any;
13
+ marginBottom: any;
14
+ };
15
+ '& .SCLeaderboardWidget-podium-item': {
16
+ flex: string;
17
+ width: number;
18
+ };
19
+ '& .SCLeaderboardWidget-podium-item-1': {
20
+ order: number;
21
+ };
22
+ '& .SCLeaderboardWidget-podium-item-2': {
23
+ order: number;
24
+ };
25
+ '& .SCLeaderboardWidget-podium-item-3': {
26
+ order: number;
27
+ };
28
+ '& .SCLeaderboardWidget-podium-crown': {
29
+ position: string;
30
+ top: number;
31
+ left: string;
32
+ transform: string;
33
+ zIndex: number;
34
+ display: string;
35
+ width: number;
36
+ height: number;
37
+ backgroundColor: any;
38
+ maskRepeat: string;
39
+ maskPosition: string;
40
+ maskSize: string;
41
+ WebkitMaskRepeat: string;
42
+ WebkitMaskPosition: string;
43
+ WebkitMaskSize: string;
44
+ };
45
+ '& .SCLeaderboardWidget-podium-avatar-wrap': {
46
+ position: string;
47
+ marginBottom: any;
48
+ };
49
+ '& .SCLeaderboardWidget-podium-item-1 .SCLeaderboardWidget-podium-avatar': {
50
+ width: number;
51
+ height: number;
52
+ border: string;
53
+ };
54
+ '& .SCLeaderboardWidget-podium-item-2 .SCLeaderboardWidget-podium-avatar, & .SCLeaderboardWidget-podium-item-3 .SCLeaderboardWidget-podium-avatar': {
55
+ width: number;
56
+ height: number;
57
+ border: string;
58
+ };
59
+ '& .SCLeaderboardWidget-podium-badge': {
60
+ position: string;
61
+ bottom: number;
62
+ left: string;
63
+ transform: string;
64
+ display: string;
65
+ alignItems: string;
66
+ justifyContent: string;
67
+ width: number;
68
+ height: number;
69
+ borderRadius: string;
70
+ backgroundColor: any;
71
+ color: any;
72
+ fontSize: number;
73
+ lineHeight: number;
74
+ fontWeight: any;
75
+ border: string;
76
+ };
77
+ '& .SCLeaderboardWidget-podium-name': {
78
+ width: string;
79
+ textAlign: string;
80
+ overflow: string;
81
+ textOverflow: string;
82
+ whiteSpace: string;
83
+ };
84
+ '& .SCLeaderboardWidget-podium-score': {
85
+ color: any;
86
+ };
87
+ '& .SCLeaderboardWidget-ranking-header': {
88
+ marginBottom: any;
89
+ };
90
+ '& .SCLeaderboardWidget-ranking-title': {
91
+ fontWeight: any;
92
+ };
93
+ '& .SCLeaderboardWidget-ranking-item': {
94
+ padding: any;
95
+ borderRadius: number;
96
+ backgroundColor: any;
97
+ boxShadow: string;
98
+ };
99
+ '& .SCLeaderboardWidget-ranking-item-active': {
100
+ backgroundColor: any;
101
+ boxShadow: string;
102
+ '& .SCLeaderboardWidget-ranking-position, & .SCLeaderboardWidget-ranking-name, & .SCLeaderboardWidget-ranking-score': {
103
+ color: any;
104
+ };
105
+ };
106
+ '& .SCLeaderboardWidget-ranking-position': {
107
+ width: number;
108
+ color: any;
109
+ };
110
+ '& .SCLeaderboardWidget-ranking-avatar': {
111
+ width: number;
112
+ height: number;
113
+ };
114
+ '& .SCLeaderboardWidget-ranking-name': {
115
+ flex: number;
116
+ overflow: string;
117
+ textOverflow: string;
118
+ whiteSpace: string;
119
+ };
120
+ '& .SCLeaderboardWidget-ranking-score': {
121
+ color: any;
122
+ };
123
+ '& .SCLeaderboardWidget-see-more': {
124
+ display: string;
125
+ marginTop: any;
126
+ color: any;
127
+ cursor: string;
128
+ fontWeight: any;
129
+ };
130
+ };
131
+ skeletonRoot: ({ theme }: any) => {
132
+ borderRadius: number;
133
+ '& .SCLeaderboardWidget-podium-header': {
134
+ marginBottom: any;
135
+ };
136
+ '& .SCLeaderboardWidget-podium': {
137
+ marginBottom: any;
138
+ };
139
+ '& .SCLeaderboardWidget-ranking-header': {
140
+ marginBottom: any;
141
+ };
142
+ '& .SCLeaderboardWidget-ranking-item': {
143
+ padding: any;
144
+ };
145
+ };
146
+ };
147
+ };
148
+ export default Component;
package/lib/esm/components/SCLeaderboardWidget.js ADDED
@@ -0,0 +1,149 @@
1
+ import { alpha } from '@mui/material';
2
+ const Component = {
3
+ styleOverrides: {
4
+ root: ({ theme }) => ({
5
+ borderRadius: theme.shape.borderRadius * 2,
6
+ '& .SCLeaderboardWidget-podium-header': {
7
+ marginBottom: theme.spacing(2)
8
+ },
9
+ '& .SCLeaderboardWidget-podium-title': {
10
+ fontWeight: theme.typography.fontWeightBold
11
+ },
12
+ '& .SCLeaderboardWidget-podium': {
13
+ gap: theme.spacing(2),
14
+ marginBottom: theme.spacing(3)
15
+ },
16
+ '& .SCLeaderboardWidget-podium-item': {
17
+ flex: '0 0 auto',
18
+ width: 90
19
+ },
20
+ '& .SCLeaderboardWidget-podium-item-1': {
21
+ order: 2
22
+ },
23
+ '& .SCLeaderboardWidget-podium-item-2': {
24
+ order: 1
25
+ },
26
+ '& .SCLeaderboardWidget-podium-item-3': {
27
+ order: 3
28
+ },
29
+ '& .SCLeaderboardWidget-podium-crown': {
30
+ position: 'absolute',
31
+ top: -28,
32
+ left: '50%',
33
+ transform: 'translateX(-50%)',
34
+ zIndex: 1,
35
+ display: 'inline-block',
36
+ width: 38,
37
+ height: 38,
38
+ backgroundColor: theme.palette.primary.main,
39
+ maskRepeat: 'no-repeat',
40
+ maskPosition: 'center',
41
+ maskSize: 'contain',
42
+ WebkitMaskRepeat: 'no-repeat',
43
+ WebkitMaskPosition: 'center',
44
+ WebkitMaskSize: 'contain'
45
+ },
46
+ '& .SCLeaderboardWidget-podium-avatar-wrap': {
47
+ position: 'relative',
48
+ marginBottom: theme.spacing(1)
49
+ },
50
+ '& .SCLeaderboardWidget-podium-item-1 .SCLeaderboardWidget-podium-avatar': {
51
+ width: 72,
52
+ height: 72,
53
+ border: `3px solid ${theme.palette.primary.main}`
54
+ },
55
+ '& .SCLeaderboardWidget-podium-item-2 .SCLeaderboardWidget-podium-avatar, & .SCLeaderboardWidget-podium-item-3 .SCLeaderboardWidget-podium-avatar': {
56
+ width: 56,
57
+ height: 56,
58
+ border: `2px solid ${theme.palette.primary.light}`
59
+ },
60
+ '& .SCLeaderboardWidget-podium-badge': {
61
+ position: 'absolute',
62
+ bottom: -6,
63
+ left: '50%',
64
+ transform: 'translateX(-50%)',
65
+ display: 'flex',
66
+ alignItems: 'center',
67
+ justifyContent: 'center',
68
+ width: 22,
69
+ height: 22,
70
+ borderRadius: '50%',
71
+ backgroundColor: theme.palette.primary.main,
72
+ color: theme.palette.primary.contrastText,
73
+ fontSize: 12,
74
+ lineHeight: 1,
75
+ fontWeight: theme.typography.fontWeightBold,
76
+ border: `2px solid ${theme.palette.background.paper}`
77
+ },
78
+ '& .SCLeaderboardWidget-podium-name': {
79
+ width: '100%',
80
+ textAlign: 'center',
81
+ overflow: 'hidden',
82
+ textOverflow: 'ellipsis',
83
+ whiteSpace: 'nowrap'
84
+ },
85
+ '& .SCLeaderboardWidget-podium-score': {
86
+ color: theme.palette.text.secondary
87
+ },
88
+ '& .SCLeaderboardWidget-ranking-header': {
89
+ marginBottom: theme.spacing(1.5)
90
+ },
91
+ '& .SCLeaderboardWidget-ranking-title': {
92
+ fontWeight: theme.typography.fontWeightBold
93
+ },
94
+ '& .SCLeaderboardWidget-ranking-item': {
95
+ padding: theme.spacing(1, 1.5),
96
+ borderRadius: 12,
97
+ backgroundColor: theme.palette.background.paper,
98
+ boxShadow: `0px 2px 8px ${alpha(theme.palette.common.black, 0.08)}`
99
+ },
100
+ '& .SCLeaderboardWidget-ranking-item-active': {
101
+ backgroundColor: theme.palette.primary.main,
102
+ boxShadow: `0px 4px 12px ${alpha(theme.palette.primary.main, 0.35)}`,
103
+ '& .SCLeaderboardWidget-ranking-position, & .SCLeaderboardWidget-ranking-name, & .SCLeaderboardWidget-ranking-score': {
104
+ color: theme.palette.primary.contrastText
105
+ }
106
+ },
107
+ '& .SCLeaderboardWidget-ranking-position': {
108
+ width: 16,
109
+ color: theme.palette.text.secondary
110
+ },
111
+ '& .SCLeaderboardWidget-ranking-avatar': {
112
+ width: 36,
113
+ height: 36
114
+ },
115
+ '& .SCLeaderboardWidget-ranking-name': {
116
+ flex: 1,
117
+ overflow: 'hidden',
118
+ textOverflow: 'ellipsis',
119
+ whiteSpace: 'nowrap'
120
+ },
121
+ '& .SCLeaderboardWidget-ranking-score': {
122
+ color: theme.palette.text.secondary
123
+ },
124
+ '& .SCLeaderboardWidget-see-more': {
125
+ display: 'inline-block',
126
+ marginTop: theme.spacing(1.5),
127
+ color: theme.palette.primary.main,
128
+ cursor: 'pointer',
129
+ fontWeight: theme.typography.fontWeightMedium
130
+ }
131
+ }),
132
+ skeletonRoot: ({ theme }) => ({
133
+ borderRadius: theme.shape.borderRadius * 2,
134
+ '& .SCLeaderboardWidget-podium-header': {
135
+ marginBottom: theme.spacing(2)
136
+ },
137
+ '& .SCLeaderboardWidget-podium': {
138
+ marginBottom: theme.spacing(3)
139
+ },
140
+ '& .SCLeaderboardWidget-ranking-header': {
141
+ marginBottom: theme.spacing(1.5)
142
+ },
143
+ '& .SCLeaderboardWidget-ranking-item': {
144
+ padding: theme.spacing(1, 1.5)
145
+ }
146
+ })
147
+ }
148
+ };
149
+ export default Component;