@selfcommunity/react-theme-default 1.2.0-alpha.0 → 1.2.0-alpha.2

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 (70) hide show
  1. package/lib/cjs/components/SCAccordionLessons.d.ts +3 -0
  2. package/lib/cjs/components/SCAccordionLessons.js +27 -9
  3. package/lib/cjs/components/SCCategoryAutocomplete.d.ts +5 -1
  4. package/lib/cjs/components/SCCategoryAutocomplete.js +8 -1
  5. package/lib/cjs/components/SCCommentObject.js +5 -3
  6. package/lib/cjs/components/SCCourseCompletedDialog.d.ts +6 -1
  7. package/lib/cjs/components/SCCourseCompletedDialog.js +7 -1
  8. package/lib/cjs/components/SCCourseDashboard.d.ts +3 -2
  9. package/lib/cjs/components/SCCourseDashboard.js +59 -20
  10. package/lib/cjs/components/SCCourseForm.d.ts +1 -1
  11. package/lib/cjs/components/SCCourseForm.js +34 -12
  12. package/lib/cjs/components/SCCourseParticipantsButton.d.ts +4 -2
  13. package/lib/cjs/components/SCCourseParticipantsButton.js +9 -2
  14. package/lib/cjs/components/SCCourseUsersTable.d.ts +12 -0
  15. package/lib/cjs/components/SCCourseUsersTable.js +29 -4
  16. package/lib/cjs/components/SCEditCourse.d.ts +2 -3
  17. package/lib/cjs/components/SCEditCourse.js +67 -24
  18. package/lib/cjs/components/SCEmptyStatus.d.ts +3 -0
  19. package/lib/cjs/components/SCEmptyStatus.js +12 -2
  20. package/lib/cjs/components/SCEventForm.js +7 -3
  21. package/lib/cjs/components/SCEventMembersWidget.js +7 -2
  22. package/lib/cjs/components/SCFeedObject.d.ts +3 -2
  23. package/lib/cjs/components/SCFeedObject.js +22 -11
  24. package/lib/cjs/components/SCLessonDrawer.d.ts +3 -0
  25. package/lib/cjs/components/SCLessonDrawer.js +9 -1
  26. package/lib/cjs/components/SCLessonEditForm.d.ts +3 -0
  27. package/lib/cjs/components/SCLessonEditForm.js +6 -0
  28. package/lib/cjs/components/SCLessonReleaseMenu.d.ts +3 -0
  29. package/lib/cjs/components/SCLessonReleaseMenu.js +6 -0
  30. package/lib/cjs/components/SCLessonTemplate.d.ts +3 -0
  31. package/lib/cjs/components/SCLessonTemplate.js +6 -1
  32. package/lib/cjs/components/SCMediaFile.d.ts +3 -1
  33. package/lib/cjs/components/SCMediaFile.js +11 -4
  34. package/lib/cjs/index.d.ts +60 -14
  35. package/lib/esm/components/SCAccordionLessons.d.ts +3 -0
  36. package/lib/esm/components/SCAccordionLessons.js +27 -9
  37. package/lib/esm/components/SCCategoryAutocomplete.d.ts +5 -1
  38. package/lib/esm/components/SCCategoryAutocomplete.js +8 -1
  39. package/lib/esm/components/SCCommentObject.js +4 -2
  40. package/lib/esm/components/SCCourseCompletedDialog.d.ts +6 -1
  41. package/lib/esm/components/SCCourseCompletedDialog.js +7 -1
  42. package/lib/esm/components/SCCourseDashboard.d.ts +3 -2
  43. package/lib/esm/components/SCCourseDashboard.js +60 -21
  44. package/lib/esm/components/SCCourseForm.d.ts +1 -1
  45. package/lib/esm/components/SCCourseForm.js +35 -13
  46. package/lib/esm/components/SCCourseParticipantsButton.d.ts +4 -2
  47. package/lib/esm/components/SCCourseParticipantsButton.js +9 -2
  48. package/lib/esm/components/SCCourseUsersTable.d.ts +12 -0
  49. package/lib/esm/components/SCCourseUsersTable.js +29 -4
  50. package/lib/esm/components/SCEditCourse.d.ts +2 -3
  51. package/lib/esm/components/SCEditCourse.js +68 -25
  52. package/lib/esm/components/SCEmptyStatus.d.ts +3 -0
  53. package/lib/esm/components/SCEmptyStatus.js +12 -2
  54. package/lib/esm/components/SCEventForm.js +7 -3
  55. package/lib/esm/components/SCEventMembersWidget.js +7 -2
  56. package/lib/esm/components/SCFeedObject.d.ts +3 -2
  57. package/lib/esm/components/SCFeedObject.js +17 -6
  58. package/lib/esm/components/SCLessonDrawer.d.ts +3 -0
  59. package/lib/esm/components/SCLessonDrawer.js +9 -1
  60. package/lib/esm/components/SCLessonEditForm.d.ts +3 -0
  61. package/lib/esm/components/SCLessonEditForm.js +6 -0
  62. package/lib/esm/components/SCLessonReleaseMenu.d.ts +3 -0
  63. package/lib/esm/components/SCLessonReleaseMenu.js +6 -0
  64. package/lib/esm/components/SCLessonTemplate.d.ts +3 -0
  65. package/lib/esm/components/SCLessonTemplate.js +6 -1
  66. package/lib/esm/components/SCMediaFile.d.ts +3 -1
  67. package/lib/esm/components/SCMediaFile.js +11 -4
  68. package/lib/esm/index.d.ts +60 -14
  69. package/lib/umd/react-theme-default.js +1 -1
  70. package/package.json +2 -2
package/lib/cjs/components/SCCourseUsersTable.js CHANGED
@@ -1,19 +1,34 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
+ const material_1 = require("@mui/material");
3
4
  const Component = {
4
5
  styleOverrides: {
5
6
  root: ({ theme }) => ({
6
- border: `1px solid ${theme.palette.grey['300']}`,
7
+ border: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
8
+ ? `1px solid ${theme.palette.grey[800]}`
9
+ : `1px solid ${theme.palette.grey[300]}`,
7
10
  borderRadius: '5px',
8
11
  padding: theme.spacing(1),
9
- backgroundColor: theme.palette.common.white,
12
+ backgroundColor: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
13
+ ? theme.palette.background.paper
14
+ : theme.palette.common.white,
10
15
  [theme.breakpoints.up('sm')]: {
11
16
  padding: theme.spacing(2)
12
17
  },
18
+ '& .SCCourseUsersTable-contrast-color': {
19
+ color: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
20
+ ? (0, material_1.lighten)(theme.palette.common.white, 0.5)
21
+ : (0, material_1.darken)(theme.palette.common.white, 0.5)
22
+ },
13
23
  '& .SCCourseUsersTable-search': {
14
24
  '& > .MuiInputBase-root': {
15
25
  borderBottomLeftRadius: 'unset',
16
- borderBottomRightRadius: 'unset'
26
+ borderBottomRightRadius: 'unset',
27
+ '& > input': {
28
+ color: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
29
+ ? (0, material_1.lighten)(theme.palette.common.white, 0.5)
30
+ : (0, material_1.darken)(theme.palette.common.white, 0.5)
31
+ }
17
32
  },
18
33
  '& .SCCourseUsersTable-end-adornment-wrapper': {
19
34
  flexDirection: 'row',
@@ -41,7 +56,7 @@ const Component = {
41
56
  '& .SCCourseUsersTable-progress': {
42
57
  width: '100%',
43
58
  borderRadius: '28px',
44
- backgroundColor: theme.palette.grey['300'],
59
+ backgroundColor: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5 ? theme.palette.grey[800] : theme.palette.grey[300],
45
60
  [theme.breakpoints.down('sm')]: {
46
61
  display: 'none'
47
62
  }
@@ -60,10 +75,20 @@ const Component = {
60
75
  paddingTop: theme.spacing(3)
61
76
  }),
62
77
  dialogRoot: ({ theme }) => ({
78
+ '& .MuiDialogTitle-root': {
79
+ color: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
80
+ ? (0, material_1.lighten)(theme.palette.common.white, 0.5)
81
+ : (0, material_1.darken)(theme.palette.common.white, 0.5)
82
+ },
63
83
  '& .MuiDialogContent-root': {
64
84
  [theme.breakpoints.down('md')]: {
65
85
  paddingBottom: '20px'
66
86
  },
87
+ '& .SCCourseUsersTable-contrast-color': {
88
+ color: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
89
+ ? (0, material_1.lighten)(theme.palette.common.white, 0.5)
90
+ : (0, material_1.darken)(theme.palette.common.white, 0.5)
91
+ },
67
92
  '& .SCCourseUsersTable-content-wrapper': {
68
93
  gap: theme.spacing(1),
69
94
  [theme.breakpoints.down('md')]: {
package/lib/cjs/components/SCEditCourse.d.ts CHANGED
@@ -7,7 +7,7 @@ declare const Component: {
7
7
  marginBottom: string;
8
8
  };
9
9
  '& .SCEditCourse-contrast-color': {
10
- color: any;
10
+ color: string;
11
11
  };
12
12
  '& .SCEditCourse-header': {
13
13
  [x: number]: {
@@ -167,10 +167,9 @@ declare const Component: {
167
167
  alignItems: string;
168
168
  gap: string;
169
169
  '& .SCEditCourse-change-lesson-status-published-wrapper': {
170
- color: any;
171
170
  backgroundColor: any;
172
171
  '& .MuiIcon-root': {
173
- color: any;
172
+ color: string;
174
173
  };
175
174
  };
176
175
  '& .SCEditCourse-change-lesson-status-icon-draft': {
package/lib/cjs/components/SCEditCourse.js CHANGED
@@ -8,7 +8,9 @@ const Component = {
8
8
  marginBottom: '56px'
9
9
  },
10
10
  '& .SCEditCourse-contrast-color': {
11
- color: (0, material_1.getContrastRatio)(theme.palette.background.default, theme.palette.common.white) > 4.5 ? theme.palette.common.white : undefined
11
+ color: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
12
+ ? (0, material_1.lighten)(theme.palette.common.white, 0.5)
13
+ : (0, material_1.darken)(theme.palette.common.white, 0.5)
12
14
  },
13
15
  '& .SCEditCourse-header': {
14
16
  flexDirection: 'row',
@@ -19,7 +21,9 @@ const Component = {
19
21
  }
20
22
  },
21
23
  '& .SCEditCourse-tab-list': {
22
- borderBottom: `1px solid ${theme.palette.grey['300']}`,
24
+ borderBottom: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
25
+ ? `1px solid ${theme.palette.grey[800]}`
26
+ : `1px solid ${theme.palette.grey[300]}`,
23
27
  '& .SCEditCourse-tab': {
24
28
  textTransform: 'inherit'
25
29
  },
@@ -65,16 +69,22 @@ const Component = {
65
69
  }
66
70
  },
67
71
  '& .SCEditCourse-lesson-empty-status': {
68
- border: `1px solid ${theme.palette.grey[300]}`,
72
+ border: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
73
+ ? `1px solid ${theme.palette.grey[800]}`
74
+ : `1px solid ${theme.palette.grey[300]}`,
69
75
  borderRadius: '5px'
70
76
  },
71
77
  '& .SCEditCourse-empty-status-button': {
72
78
  marginTop: '7px'
73
79
  },
74
80
  '& .SCEditCourse-lessons-inner-wrapper': {
75
- border: `1px solid ${theme.palette.grey[300]}`,
81
+ border: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
82
+ ? `1px solid ${theme.palette.grey[800]}`
83
+ : `1px solid ${theme.palette.grey[300]}`,
76
84
  borderRadius: '5px',
77
- backgroundColor: theme.palette.common.white,
85
+ backgroundColor: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
86
+ ? theme.palette.background.paper
87
+ : theme.palette.common.white,
78
88
  marginTop: '9px',
79
89
  padding: theme.spacing(1),
80
90
  [theme.breakpoints.up('sm')]: {
@@ -85,11 +95,15 @@ const Component = {
85
95
  alignItems: 'center',
86
96
  justifyContent: 'space-between',
87
97
  padding: theme.spacing(2),
88
- border: `1px solid ${theme.palette.grey[300]}`,
98
+ border: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
99
+ ? `1px solid ${theme.palette.grey[800]}`
100
+ : `1px solid ${theme.palette.grey[300]}`,
89
101
  borderBottom: 'unset',
90
102
  borderTopLeftRadius: '5px',
91
103
  borderTopRightRadius: '5px',
92
- backgroundColor: theme.palette.common.white,
104
+ backgroundColor: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
105
+ ? theme.palette.background.paper
106
+ : theme.palette.common.white,
93
107
  '& .SCEditCourse-lessons-sections': {
94
108
  flexDirection: 'row',
95
109
  alignItems: 'center',
@@ -98,7 +112,9 @@ const Component = {
98
112
  width: '6px',
99
113
  height: '6px',
100
114
  borderRadius: 9999,
101
- backgroundColor: theme.palette.common.black
115
+ backgroundColor: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
116
+ ? theme.palette.common.white
117
+ : theme.palette.common.black
102
118
  }
103
119
  },
104
120
  '& .SCEditCourse-section-button': {
@@ -110,10 +126,14 @@ const Component = {
110
126
  },
111
127
  '& .SCEditCourse-table-container': {
112
128
  width: 'auto',
113
- border: `1px solid ${theme.palette.grey[300]}`,
129
+ border: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
130
+ ? `1px solid ${theme.palette.grey[800]}`
131
+ : `1px solid ${theme.palette.grey[300]}`,
114
132
  borderBottomLeftRadius: '5px',
115
133
  borderBottomRightRadius: '5px',
116
- backgroundColor: theme.palette.common.white,
134
+ backgroundColor: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
135
+ ? theme.palette.background.paper
136
+ : theme.palette.common.white,
117
137
  '& .SCEditCourse-table': {
118
138
  '& .SCEditCourse-cell-width': {
119
139
  width: '3%'
@@ -142,7 +162,9 @@ const Component = {
142
162
  gap: '10px'
143
163
  },
144
164
  '& .SCEditCourse-table-body-accordion': {
145
- backgroundColor: theme.palette.grey[200]
165
+ backgroundColor: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
166
+ ? theme.palette.grey[800]
167
+ : theme.palette.grey[200]
146
168
  },
147
169
  '& .SCEditCourse-edit-mode-wrapper': {
148
170
  flexDirection: 'row',
@@ -168,17 +190,20 @@ const Component = {
168
190
  gap: '22px'
169
191
  },
170
192
  '& .SCEditCourse-change-lesson-status-published-wrapper': {
171
- color: theme.palette.common.white,
172
- backgroundColor: theme.palette.primary.main,
193
+ backgroundColor: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
194
+ ? theme.palette.primary.dark
195
+ : theme.palette.primary.main,
173
196
  '& .MuiIcon-root': {
174
- color: theme.palette.common.white
197
+ color: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
198
+ ? (0, material_1.lighten)(theme.palette.common.white, 0.5)
199
+ : (0, material_1.darken)(theme.palette.common.white, 0.5)
175
200
  }
176
201
  },
177
202
  '& .SCEditCourse-change-lesson-status-icon-draft': {
178
203
  width: '20px',
179
204
  height: '20px',
180
205
  borderRadius: 9999,
181
- backgroundColor: theme.palette.grey['600']
206
+ backgroundColor: theme.palette.grey[600]
182
207
  }
183
208
  },
184
209
  '& .SCEditCourse-table-body-collapse-wrapper': {
@@ -198,10 +223,14 @@ const Component = {
198
223
  marginBottom: theme.spacing(2)
199
224
  },
200
225
  '& .SCEditCourse-options-container': {
201
- border: `1px solid ${theme.palette.grey['300']}`,
226
+ border: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
227
+ ? `1px solid ${theme.palette.grey[800]}`
228
+ : `1px solid ${theme.palette.grey[300]}`,
202
229
  borderRadius: '5px',
203
230
  padding: theme.spacing(1),
204
- backgroundColor: theme.palette.common.white,
231
+ backgroundColor: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
232
+ ? theme.palette.background.paper
233
+ : theme.palette.common.white,
205
234
  [theme.breakpoints.up('sm')]: {
206
235
  padding: theme.spacing(2)
207
236
  },
@@ -243,7 +272,9 @@ const Component = {
243
272
  alignItems: 'center',
244
273
  justifyContent: 'center',
245
274
  gap: theme.spacing(4),
246
- borderBottom: `1px solid ${theme.palette.grey['300']}`,
275
+ borderBottom: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
276
+ ? `1px solid ${theme.palette.grey[800]}`
277
+ : `1px solid ${theme.palette.grey[300]}`,
247
278
  padding: theme.spacing('12px 0'),
248
279
  marginBottom: '13px'
249
280
  },
@@ -265,9 +296,13 @@ const Component = {
265
296
  }
266
297
  },
267
298
  '& .SCEditCourse-lessons-inner-wrapper': {
268
- border: `1px solid ${theme.palette.grey[300]}`,
299
+ border: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
300
+ ? `1px solid ${theme.palette.grey[800]}`
301
+ : `1px solid ${theme.palette.grey[300]}`,
269
302
  borderRadius: '5px',
270
- backgroundColor: theme.palette.common.white,
303
+ backgroundColor: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
304
+ ? theme.palette.background.paper
305
+ : theme.palette.common.white,
271
306
  marginTop: '9px',
272
307
  padding: theme.spacing(1),
273
308
  [theme.breakpoints.up('sm')]: {
@@ -278,12 +313,16 @@ const Component = {
278
313
  alignItems: 'center',
279
314
  justifyContent: 'space-between',
280
315
  padding: theme.spacing(2),
281
- border: `1px solid ${theme.palette.grey[300]}`,
316
+ border: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
317
+ ? `1px solid ${theme.palette.grey[800]}`
318
+ : `1px solid ${theme.palette.grey[300]}`,
282
319
  borderRadius: '5px'
283
320
  },
284
321
  '& .SCEditCourse-table-container': {
285
322
  width: 'auto',
286
- border: `1px solid ${theme.palette.grey[300]}`,
323
+ border: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
324
+ ? `1px solid ${theme.palette.grey[800]}`
325
+ : `1px solid ${theme.palette.grey[300]}`,
287
326
  borderBottomLeftRadius: '5px',
288
327
  borderBottomRightRadius: '5px',
289
328
  '& .SCEditCourse-margin': {
@@ -306,10 +345,14 @@ const Component = {
306
345
  marginBottom: theme.spacing(2)
307
346
  },
308
347
  '& .SCEditCourse-options-container': {
309
- border: `1px solid ${theme.palette.grey['300']}`,
348
+ border: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
349
+ ? `1px solid ${theme.palette.grey[800]}`
350
+ : `1px solid ${theme.palette.grey[300]}`,
310
351
  borderRadius: '5px',
311
352
  paddingBottom: '10px',
312
- backgroundColor: theme.palette.common.white,
353
+ backgroundColor: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
354
+ ? theme.palette.background.paper
355
+ : theme.palette.common.white,
313
356
  '& .SCEditCourse-options-wrapper': {
314
357
  gap: theme.spacing(5),
315
358
  maxWidth: '600px',
package/lib/cjs/components/SCEmptyStatus.d.ts CHANGED
@@ -9,6 +9,9 @@ declare const Component: {
9
9
  padding: any;
10
10
  marginTop: string;
11
11
  backgroundColor: any;
12
+ '& .SCEmptyStatus-contrast-color': {
13
+ color: string;
14
+ };
12
15
  '& .SCEmptyStatus-box': {
13
16
  width: string;
14
17
  height: string;
package/lib/cjs/components/SCEmptyStatus.js CHANGED
@@ -1,5 +1,6 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
+ const material_1 = require("@mui/material");
3
4
  const Component = {
4
5
  styleOverrides: {
5
6
  root: ({ theme }) => ({
@@ -8,11 +9,20 @@ const Component = {
8
9
  gap: '10px',
9
10
  padding: theme.spacing(3),
10
11
  marginTop: '9px',
11
- backgroundColor: theme.palette.common.white,
12
+ backgroundColor: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
13
+ ? theme.palette.background.paper
14
+ : theme.palette.common.white,
15
+ '& .SCEmptyStatus-contrast-color': {
16
+ color: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
17
+ ? (0, material_1.lighten)(theme.palette.common.white, 0.5)
18
+ : (0, material_1.darken)(theme.palette.common.white, 0.5)
19
+ },
12
20
  '& .SCEmptyStatus-box': {
13
21
  width: '130px',
14
22
  height: '130px',
15
- border: `2px solid ${theme.palette.grey[300]}`,
23
+ border: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
24
+ ? `2px solid ${theme.palette.grey[800]}`
25
+ : `2px solid ${theme.palette.grey[300]}`,
16
26
  borderRadius: '20px',
17
27
  marginBottom: '10px',
18
28
  '& .SCEmptyStatus-rotated-box': {
package/lib/cjs/components/SCEventForm.js CHANGED
@@ -1,6 +1,6 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- const system_1 = require("@mui/system");
3
+ const material_1 = require("@mui/material");
4
4
  const Component = {
5
5
  styleOverrides: {
6
6
  root: ({ theme }) => ({
@@ -91,7 +91,9 @@ const Component = {
91
91
  },
92
92
  '& .MuiDivider-root': {
93
93
  marginTop: theme.spacing(2),
94
- border: `1px solid ${(0, system_1.alpha)(theme.palette.primary.main, theme.palette.action.activatedOpacity)}`
94
+ border: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
95
+ ? `1px solid ${(0, material_1.alpha)(theme.palette.primary.dark, 0.5)}`
96
+ : `1px solid ${(0, material_1.alpha)(theme.palette.primary.main, theme.palette.action.activatedOpacity)}`
95
97
  },
96
98
  '& .MuiDialogTitle-root': {
97
99
  '& span': {
@@ -101,7 +103,9 @@ const Component = {
101
103
  },
102
104
  '& .SCEventForm-event-address-root': {
103
105
  marginTop: theme.spacing(2),
104
- backgroundColor: theme.palette.grey['A200'],
106
+ backgroundColor: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
107
+ ? theme.palette.background.paper
108
+ : theme.palette.grey['A200'],
105
109
  borderRadius: 5,
106
110
  '& .SCEventForm-event-address-tabs': {
107
111
  padding: theme.spacing(0, 2, 0, 2),
package/lib/cjs/components/SCEventMembersWidget.js CHANGED
@@ -1,5 +1,6 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
+ const material_1 = require("@mui/material");
3
4
  const Component = {
4
5
  styleOverrides: {
5
6
  root: ({ theme }) => ({
@@ -9,7 +10,9 @@ const Component = {
9
10
  marginBottom: '18px'
10
11
  },
11
12
  '& .SCEventMembersWidget-tabs-wrapper': {
12
- borderBottom: `1px solid ${theme.palette.grey['300']}`,
13
+ borderBottom: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
14
+ ? `1px solid ${theme.palette.grey[800]}`
15
+ : `1px solid ${theme.palette.grey[300]}`,
13
16
  '& .SCEventMembersWidget-tab-label-wrapper': {
14
17
  gap: '2px',
15
18
  alignItems: 'center'
@@ -36,7 +39,9 @@ const Component = {
36
39
  marginBottom: '18px'
37
40
  },
38
41
  '& .SCEventMembersWidget-tabs-wrapper': {
39
- borderBottom: `1px solid ${theme.palette.grey['300']}`,
42
+ borderBottom: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
43
+ ? `1px solid ${theme.palette.grey[800]}`
44
+ : `1px solid ${theme.palette.grey[300]}`,
40
45
  '& .SCEventMembersWidget-tab-label-wrapper': {
41
46
  gap: '2px',
42
47
  alignItems: 'center'
package/lib/cjs/components/SCFeedObject.d.ts CHANGED
@@ -231,6 +231,7 @@ declare const Component: {
231
231
  };
232
232
  '& hr': {
233
233
  margin: string;
234
+ borderColor: string;
234
235
  };
235
236
  '& a': {
236
237
  color: any;
@@ -377,7 +378,7 @@ declare const Component: {
377
378
  fontWeight: any;
378
379
  marginTop: any;
379
380
  marginBottom: number;
380
- color: any;
381
+ color: string;
381
382
  '&:hover': {
382
383
  color: string;
383
384
  };
@@ -386,7 +387,7 @@ declare const Component: {
386
387
  borderColor: any;
387
388
  };
388
389
  '& .SCFeedObject-action-vote-button, & .SCFeedObject-action-comment-button, & .SCFeedObject-action-share-button, & .SCReactionAction-button': {
389
- color: any;
390
+ color: string;
390
391
  marginTop: any;
391
392
  marginBottom: any;
392
393
  borderRadius: string;
package/lib/cjs/components/SCFeedObject.js CHANGED
@@ -1,6 +1,6 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- const system_1 = require("@mui/system");
3
+ const material_1 = require("@mui/material");
4
4
  const Component = {
5
5
  styleOverrides: {
6
6
  root: ({ theme }) => ({
@@ -86,7 +86,9 @@ const Component = {
86
86
  textTransform: 'initial'
87
87
  }
88
88
  },
89
- borderBottom: '1px solid rgba(221, 221, 221, 1)',
89
+ borderBottom: (0, material_1.getContrastRatio)(theme.palette.background.default, theme.palette.common.white) > 4.5
90
+ ? '1px solid rgba(255, 255, 255, 0.12)'
91
+ : '1px solid rgba(221, 221, 221, 1)',
90
92
  margin: theme.spacing(0.5, 2, 0, 2)
91
93
  },
92
94
  '& .SCFeedObject-content': {
@@ -163,7 +165,9 @@ const Component = {
163
165
  borderRadius: theme.shape.borderRadius
164
166
  },
165
167
  '& .SCFeedObject-category': {
166
- borderBottom: '1px solid rgba(221, 221, 221, 1)',
168
+ borderBottom: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
169
+ ? '1px solid rgba(255, 255, 255, 0.12)'
170
+ : '1px solid rgba(221, 221, 221, 1)',
167
171
  margin: theme.spacing(0, 2),
168
172
  '& .SCFeedObject-group, & .SCFeedObject-event': {
169
173
  borderBottom: 'none',
@@ -233,7 +237,10 @@ const Component = {
233
237
  display: 'block'
234
238
  },
235
239
  '& hr': {
236
- margin: '1em 0'
240
+ margin: '1em 0',
241
+ borderColor: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
242
+ ? 'rgba(255, 255, 255, 0.12)'
243
+ : 'rgba(221, 221, 221, 1)'
237
244
  },
238
245
  '& a': {
239
246
  color: theme.palette.text.secondary,
@@ -378,7 +385,9 @@ const Component = {
378
385
  fontWeight: theme.typography.fontWeightRegular,
379
386
  marginTop: theme.spacing(0),
380
387
  marginBottom: 0,
381
- color: theme.palette.primary.main,
388
+ color: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
389
+ ? (0, material_1.lighten)(theme.palette.text.primary, 0.5)
390
+ : (0, material_1.darken)(theme.palette.text.primary, 0.5),
382
391
  '&:hover': {
383
392
  color: 'inherit'
384
393
  }
@@ -387,7 +396,9 @@ const Component = {
387
396
  borderColor: theme.palette.grey[300]
388
397
  },
389
398
  '& .SCFeedObject-action-vote-button, & .SCFeedObject-action-comment-button, & .SCFeedObject-action-share-button, & .SCReactionAction-button': {
390
- color: theme.palette.primary.main,
399
+ color: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
400
+ ? (0, material_1.lighten)(theme.palette.text.primary, 0.5)
401
+ : (0, material_1.darken)(theme.palette.text.primary, 0.5),
391
402
  marginTop: theme.spacing(-0.5),
392
403
  marginBottom: theme.spacing(0.5),
393
404
  borderRadius: '50%',
@@ -405,7 +416,7 @@ const Component = {
405
416
  },
406
417
  '& .SCFeedObject-reply-content': {
407
418
  marginLeft: 0,
408
- background: (0, system_1.alpha)(theme.palette.primary.main, theme.palette.action.hoverOpacity),
419
+ background: (0, material_1.alpha)(theme.palette.primary.main, theme.palette.action.hoverOpacity),
409
420
  '& .SCCommentObjectReply-root': {
410
421
  background: 'transparent',
411
422
  marginBottom: 0,
@@ -636,13 +647,13 @@ const Component = {
636
647
  pollObjectRoot: ({ theme }) => ({
637
648
  marginTop: theme.spacing(1),
638
649
  marginBottom: theme.spacing(1),
639
- borderTop: `1px solid ${(0, system_1.alpha)(theme.palette.primary.main, theme.palette.action.activatedOpacity)}`,
640
- borderBottom: `1px solid ${(0, system_1.alpha)(theme.palette.primary.main, theme.palette.action.activatedOpacity)}`,
650
+ borderTop: `1px solid ${(0, material_1.alpha)(theme.palette.primary.main, theme.palette.action.activatedOpacity)}`,
651
+ borderBottom: `1px solid ${(0, material_1.alpha)(theme.palette.primary.main, theme.palette.action.activatedOpacity)}`,
641
652
  boxShadow: 'none',
642
653
  borderRadius: 0,
643
654
  '& .MuiButton-root': {
644
655
  '&:focus:not(:focus-visible)': {
645
- borderColor: (0, system_1.alpha)(theme.palette.primary.main, theme.palette.action.activatedOpacity)
656
+ borderColor: (0, material_1.alpha)(theme.palette.primary.main, theme.palette.action.activatedOpacity)
646
657
  }
647
658
  },
648
659
  '& .MuiCardHeader-root': {
@@ -697,7 +708,7 @@ const Component = {
697
708
  '& ul': {
698
709
  padding: theme.spacing(2.5),
699
710
  marginBottom: theme.spacing(2.5),
700
- backgroundColor: (0, system_1.alpha)(theme.palette.primary.main, theme.palette.action.activatedOpacity),
711
+ backgroundColor: (0, material_1.alpha)(theme.palette.primary.main, theme.palette.action.activatedOpacity),
701
712
  borderRadius: theme.shape.borderRadius,
702
713
  '& li': {
703
714
  padding: 0
package/lib/cjs/components/SCLessonDrawer.d.ts CHANGED
@@ -8,6 +8,9 @@ declare const Component: {
8
8
  width: string;
9
9
  flexShrink?: undefined;
10
10
  };
11
+ '& .SCLessonDrawer-contrast-color': {
12
+ color: string;
13
+ };
11
14
  '& h4': {
12
15
  fontWeight: any;
13
16
  };
package/lib/cjs/components/SCLessonDrawer.js CHANGED
@@ -1,5 +1,6 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
+ const material_1 = require("@mui/material");
3
4
  const Component = {
4
5
  styleOverrides: {
5
6
  root: ({ theme }) => ({
@@ -10,6 +11,11 @@ const Component = {
10
11
  [theme.breakpoints.up('sm')]: {
11
12
  width: '300px'
12
13
  },
14
+ '& .SCLessonDrawer-contrast-color': {
15
+ color: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
16
+ ? (0, material_1.lighten)(theme.palette.common.white, 0.5)
17
+ : (0, material_1.darken)(theme.palette.common.white, 0.5)
18
+ },
13
19
  '& h4': {
14
20
  fontWeight: theme.typography.fontWeightMedium
15
21
  },
@@ -18,7 +24,9 @@ const Component = {
18
24
  [theme.breakpoints.up('sm')]: {
19
25
  width: '300px'
20
26
  },
21
- backgroundColor: theme.palette.grey[200]
27
+ backgroundColor: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
28
+ ? theme.palette.background.paper
29
+ : theme.palette.grey[200]
22
30
  },
23
31
  '& .SCLessonDrawer-header': {
24
32
  [theme.breakpoints.up('sm')]: {
package/lib/cjs/components/SCLessonEditForm.d.ts CHANGED
@@ -9,6 +9,9 @@ declare const Component: {
9
9
  display: string;
10
10
  flexDirection: string;
11
11
  justifyContent: string;
12
+ '& .SCLessonEditForm-contrast-color': {
13
+ color: string;
14
+ };
12
15
  '& .SCLessonEditForm-form': {
13
16
  display: string;
14
17
  flexDirection: string;
package/lib/cjs/components/SCLessonEditForm.js CHANGED
@@ -1,5 +1,6 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
+ const material_1 = require("@mui/material");
3
4
  const Component = {
4
5
  styleOverrides: {
5
6
  root: ({ theme }) => ({
@@ -11,6 +12,11 @@ const Component = {
11
12
  display: 'flex',
12
13
  flexDirection: 'column',
13
14
  justifyContent: 'space-between',
15
+ '& .SCLessonEditForm-contrast-color': {
16
+ color: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
17
+ ? (0, material_1.lighten)(theme.palette.common.white, 0.5)
18
+ : (0, material_1.darken)(theme.palette.common.white, 0.5)
19
+ },
14
20
  '& .SCLessonEditForm-form': {
15
21
  display: 'flex',
16
22
  flexDirection: 'column'
package/lib/cjs/components/SCLessonReleaseMenu.d.ts CHANGED
@@ -4,6 +4,9 @@ declare const Component: {
4
4
  popoverRoot: ({ theme }: any) => {
5
5
  width: string;
6
6
  borderRadius: string;
7
+ '& .SCLessonReleaseMenu-popover-contrast-color': {
8
+ color: string;
9
+ };
7
10
  '& .MuiPaper-root': {
8
11
  padding: any;
9
12
  };
package/lib/cjs/components/SCLessonReleaseMenu.js CHANGED
@@ -1,11 +1,17 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
+ const material_1 = require("@mui/material");
3
4
  const Component = {
4
5
  styleOverrides: {
5
6
  root: ({ theme }) => ({}),
6
7
  popoverRoot: ({ theme }) => ({
7
8
  width: '260px',
8
9
  borderRadius: '4px',
10
+ '& .SCLessonReleaseMenu-popover-contrast-color': {
11
+ color: (0, material_1.getContrastRatio)(theme.palette.background.paper, theme.palette.common.white) > 4.5
12
+ ? (0, material_1.lighten)(theme.palette.common.white, 0.5)
13
+ : (0, material_1.darken)(theme.palette.common.white, 0.5)
14
+ },
9
15
  '& .MuiPaper-root': {
10
16
  padding: theme.spacing(2)
11
17
  },
package/lib/cjs/components/SCLessonTemplate.d.ts CHANGED
@@ -2,6 +2,9 @@ declare const Component: {
2
2
  styleOverrides: {
3
3
  root: () => {};
4
4
  containerRoot: ({ theme, open }: any) => {
5
+ '& .SCLessonTemplate-contrast-color': {
6
+ color: string;
7
+ };
5
8
  '& .SCLessonTemplate-navigation-title': {
6
9
  display: string;
7
10
  alignItems: string;