@selfcommunity/react-theme-default 0.2.1-alpha.4 → 0.3.0-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.
@@ -68,6 +68,14 @@ declare const Component: {
68
68
  '& .SCEventForm-active': {
69
69
  color: any;
70
70
  };
71
+ '& .SCEventForm-actions': {
72
+ marginTop: any;
73
+ display: string;
74
+ justifyContent: string;
75
+ '& button': {
76
+ width: string;
77
+ };
78
+ };
71
79
  '& .SCEventForm-privacy-section': {
72
80
  marginTop: any;
73
81
  justifyContent: string;
@@ -71,6 +71,14 @@ const Component = {
71
71
  '& .SCEventForm-active': {
72
72
  color: theme.palette.secondary.main
73
73
  },
74
+ '& .SCEventForm-actions': {
75
+ marginTop: theme.spacing(2),
76
+ display: 'flex',
77
+ justifyContent: 'flex-end',
78
+ '& button': {
79
+ width: 'fit-content'
80
+ }
81
+ },
74
82
  '& .SCEventForm-privacy-section': {
75
83
  marginTop: theme.spacing(2),
76
84
  justifyContent: 'center',
@@ -0,0 +1,13 @@
1
+ declare const Component: {
2
+ styleOverrides: {
3
+ root: ({ theme }: any) => {
4
+ '& .MuiDialogTitle-root': {
5
+ '& span': {
6
+ flexGrow: number;
7
+ textAlign: string;
8
+ };
9
+ };
10
+ };
11
+ };
12
+ };
13
+ export default Component;
@@ -0,0 +1,15 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ const Component = {
4
+ styleOverrides: {
5
+ root: ({ theme }) => ({
6
+ '& .MuiDialogTitle-root': {
7
+ '& span': {
8
+ flexGrow: 1,
9
+ textAlign: 'center'
10
+ }
11
+ }
12
+ })
13
+ }
14
+ };
15
+ exports.default = Component;
@@ -0,0 +1,120 @@
1
+ declare const Component: {
2
+ styleOverrides: {
3
+ root: ({ theme, showPadding }: {
4
+ theme: any;
5
+ showPadding: any;
6
+ }) => {
7
+ '& .SCEventMediaWidget-header': {
8
+ padding: any;
9
+ };
10
+ '& .SCEventMediaWidget-content': {
11
+ padding: any;
12
+ '& .SCEventMediaWidget-grid': {
13
+ display: string;
14
+ gap: string;
15
+ gridTemplateColumns: string;
16
+ '& > .SCEventMediaWidget-media': {
17
+ position: string;
18
+ width: string;
19
+ paddingBottom: string;
20
+ backgroundSize: string;
21
+ cursor: string;
22
+ '& > .SCEventMediaWidget-media-layer': {
23
+ position: string;
24
+ inset: number;
25
+ backgroundColor: string;
26
+ opacity: number;
27
+ };
28
+ '& > .SCEventMediaWidget-count-hidden-media-wrapper': {
29
+ position: string;
30
+ top: string;
31
+ left: string;
32
+ transform: string;
33
+ color: any;
34
+ '& > .SCEventMediaWidget-count-hidden-media': {
35
+ fontSize: string;
36
+ };
37
+ };
38
+ };
39
+ };
40
+ };
41
+ '& .SCEventMediaWidget-actions': {
42
+ padding: any;
43
+ justifyContent: string;
44
+ };
45
+ };
46
+ skeletonRoot: ({}: {}) => {
47
+ '& .SCEventMediaWidget-grid': {
48
+ display: string;
49
+ gap: string;
50
+ gridTemplateColumns: string;
51
+ '& > .SCEventMediaWidget-media': {
52
+ paddingBottom: string;
53
+ };
54
+ };
55
+ };
56
+ dialogRoot: ({ theme }: {
57
+ theme: any;
58
+ }) => {
59
+ '& .SCEventMediaWidget-grid': {
60
+ display: string;
61
+ gap: string;
62
+ gridTemplateColumns: string;
63
+ '& > .SCEventMediaWidget-media': {
64
+ paddingBottom: string;
65
+ };
66
+ '& > .SCEventMediaWidget-dialog-media-wrapper': {
67
+ position: string;
68
+ width: string;
69
+ paddingBottom: string;
70
+ backgroundSize: string;
71
+ '& > .SCEventMediaWidget-dialog-button-wrapper': {
72
+ position: string;
73
+ top: number;
74
+ width: string;
75
+ height: string;
76
+ backgroundColor: any;
77
+ opacity: number;
78
+ flexDirection: string;
79
+ justifyContent: string;
80
+ alignItems: string;
81
+ '& > .SCEventMediaWidget-dialog-loading-button': {
82
+ padding: number;
83
+ minWidth: string;
84
+ '& > .MuiLoadingButton-loadingIndicatorCenter': {
85
+ color: any;
86
+ };
87
+ };
88
+ };
89
+ };
90
+ };
91
+ };
92
+ triggerRoot: ({ isSquare }: {
93
+ isSquare: any;
94
+ }) => {
95
+ padding: 0;
96
+ borderRadius: 0;
97
+ backgroundColor: string;
98
+ '&:hover': {
99
+ backgroundColor: string;
100
+ };
101
+ '& > .SCEventMediaWidget-trigger-content': {
102
+ position: string;
103
+ width: string;
104
+ padding: string;
105
+ paddingBottom: string;
106
+ flexDirection: string;
107
+ gap: string;
108
+ alignItems: string;
109
+ justifyContent: string;
110
+ '& > .SCEventMediaWidget-trigger-icon': {
111
+ position: string;
112
+ top: string;
113
+ transform: string;
114
+ fontSize: string;
115
+ };
116
+ };
117
+ };
118
+ };
119
+ };
120
+ export default Component;
@@ -0,0 +1,115 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ const Component = {
4
+ styleOverrides: {
5
+ root: ({ theme, showPadding }) => ({
6
+ '& .SCEventMediaWidget-header': {
7
+ padding: showPadding ? theme.spacing('10px', 2) : theme.spacing(2)
8
+ },
9
+ '& .SCEventMediaWidget-content': {
10
+ padding: theme.spacing(2),
11
+ '& .SCEventMediaWidget-grid': {
12
+ display: 'grid',
13
+ gap: '5px',
14
+ gridTemplateColumns: 'repeat(3, 1fr)',
15
+ '& > .SCEventMediaWidget-media': {
16
+ position: 'relative',
17
+ width: '100%',
18
+ paddingBottom: '100%',
19
+ backgroundSize: 'cover',
20
+ cursor: 'pointer',
21
+ '& > .SCEventMediaWidget-media-layer': {
22
+ position: 'absolute',
23
+ inset: 0,
24
+ backgroundColor: 'rgba(102, 102, 102, 0.2)',
25
+ opacity: 0.8
26
+ },
27
+ '& > .SCEventMediaWidget-count-hidden-media-wrapper': {
28
+ position: 'absolute',
29
+ top: '50%',
30
+ left: '50%',
31
+ transform: 'translate(-50%, -50%)',
32
+ color: theme.palette.common.white,
33
+ '& > .SCEventMediaWidget-count-hidden-media': {
34
+ fontSize: '200%'
35
+ }
36
+ }
37
+ }
38
+ }
39
+ },
40
+ '& .SCEventMediaWidget-actions': {
41
+ padding: theme.spacing(0, 2, '10px'),
42
+ justifyContent: 'center'
43
+ }
44
+ }),
45
+ skeletonRoot: ({}) => ({
46
+ '& .SCEventMediaWidget-grid': {
47
+ display: 'grid',
48
+ gap: '5px',
49
+ gridTemplateColumns: 'repeat(3, 1fr)',
50
+ '& > .SCEventMediaWidget-media': {
51
+ paddingBottom: '100%'
52
+ }
53
+ }
54
+ }),
55
+ dialogRoot: ({ theme }) => ({
56
+ '& .SCEventMediaWidget-grid': {
57
+ display: 'grid',
58
+ gap: '5px',
59
+ gridTemplateColumns: 'repeat(3, 1fr)',
60
+ '& > .SCEventMediaWidget-media': {
61
+ paddingBottom: '100%'
62
+ },
63
+ '& > .SCEventMediaWidget-dialog-media-wrapper': {
64
+ position: 'relative',
65
+ width: '100%',
66
+ paddingBottom: '100%',
67
+ backgroundSize: 'cover',
68
+ '& > .SCEventMediaWidget-dialog-button-wrapper': {
69
+ position: 'absolute',
70
+ top: 0,
71
+ width: '100%',
72
+ height: '30px',
73
+ backgroundColor: theme.palette.common.black,
74
+ opacity: 0.6,
75
+ flexDirection: 'row',
76
+ justifyContent: 'flex-end',
77
+ alignItems: 'center',
78
+ '& > .SCEventMediaWidget-dialog-loading-button': {
79
+ padding: 0,
80
+ minWidth: '50px',
81
+ '& > .MuiLoadingButton-loadingIndicatorCenter': {
82
+ color: theme.palette.common.white
83
+ }
84
+ }
85
+ }
86
+ }
87
+ }
88
+ }),
89
+ triggerRoot: ({ isSquare }) => ({
90
+ padding: isSquare && 0,
91
+ borderRadius: isSquare && 0,
92
+ backgroundColor: isSquare && 'rgba(112, 112, 112, 0.04)',
93
+ '&:hover': {
94
+ backgroundColor: isSquare && 'rgba(0, 0, 0, 0.04)'
95
+ },
96
+ '& > .SCEventMediaWidget-trigger-content': {
97
+ position: isSquare && 'relative',
98
+ width: isSquare && '100%',
99
+ padding: isSquare && '10px 60px',
100
+ paddingBottom: isSquare && '100%',
101
+ flexDirection: 'row',
102
+ gap: '5px',
103
+ alignItems: 'center',
104
+ justifyContent: isSquare ? 'center' : 'flex-end',
105
+ '& > .SCEventMediaWidget-trigger-icon': {
106
+ position: isSquare && 'absolute',
107
+ top: isSquare && '50%',
108
+ transform: isSquare && 'translateY(-50%)',
109
+ fontSize: 'inherit'
110
+ }
111
+ }
112
+ })
113
+ }
114
+ };
115
+ exports.default = Component;
@@ -4905,9 +4905,6 @@ declare const theme: {
4905
4905
  width: string;
4906
4906
  '& .SCNotification-username': {
4907
4907
  fontWeight: number;
4908
- /**
4909
- * Export default theme
4910
- */
4911
4908
  '&:hover': {
4912
4909
  textDecoration: string;
4913
4910
  };
@@ -5352,6 +5349,9 @@ declare const theme: {
5352
5349
  border: string;
5353
5350
  objectFit: string;
5354
5351
  };
5352
+ /**
5353
+ * Export default theme
5354
+ */
5355
5355
  '& .MuiBadge-badge': {
5356
5356
  right: any;
5357
5357
  top: any;
@@ -6881,6 +6881,14 @@ declare const theme: {
6881
6881
  '& .SCEventForm-active': {
6882
6882
  color: any;
6883
6883
  };
6884
+ '& .SCEventForm-actions': {
6885
+ marginTop: any;
6886
+ display: string;
6887
+ justifyContent: string;
6888
+ '& button': {
6889
+ width: string;
6890
+ };
6891
+ };
6884
6892
  '& .SCEventForm-privacy-section': {
6885
6893
  marginTop: any;
6886
6894
  justifyContent: string;
@@ -6921,6 +6929,18 @@ declare const theme: {
6921
6929
  };
6922
6930
  };
6923
6931
  };
6932
+ SCEventFormDialog: {
6933
+ styleOverrides: {
6934
+ root: ({ theme }: any) => {
6935
+ '& .MuiDialogTitle-root': {
6936
+ '& span': {
6937
+ flexGrow: number;
6938
+ textAlign: string;
6939
+ };
6940
+ };
6941
+ };
6942
+ };
6943
+ };
6924
6944
  SCCreateEventButton: {
6925
6945
  styleOverrides: {
6926
6946
  root: ({ theme }: any) => {
@@ -8206,6 +8226,125 @@ declare const theme: {
8206
8226
  };
8207
8227
  };
8208
8228
  };
8229
+ SCEventMediaWidget: {
8230
+ styleOverrides: {
8231
+ root: ({ theme, showPadding }: {
8232
+ theme: any;
8233
+ showPadding: any;
8234
+ }) => {
8235
+ '& .SCEventMediaWidget-header': {
8236
+ padding: any;
8237
+ };
8238
+ '& .SCEventMediaWidget-content': {
8239
+ padding: any;
8240
+ '& .SCEventMediaWidget-grid': {
8241
+ display: string;
8242
+ gap: string;
8243
+ gridTemplateColumns: string;
8244
+ '& > .SCEventMediaWidget-media': {
8245
+ position: string;
8246
+ width: string;
8247
+ paddingBottom: string;
8248
+ backgroundSize: string;
8249
+ cursor: string;
8250
+ '& > .SCEventMediaWidget-media-layer': {
8251
+ position: string;
8252
+ inset: number;
8253
+ backgroundColor: string;
8254
+ opacity: number;
8255
+ };
8256
+ '& > .SCEventMediaWidget-count-hidden-media-wrapper': {
8257
+ position: string;
8258
+ top: string;
8259
+ left: string;
8260
+ transform: string;
8261
+ color: any;
8262
+ '& > .SCEventMediaWidget-count-hidden-media': {
8263
+ fontSize: string;
8264
+ };
8265
+ };
8266
+ };
8267
+ };
8268
+ };
8269
+ '& .SCEventMediaWidget-actions': {
8270
+ padding: any;
8271
+ justifyContent: string;
8272
+ };
8273
+ };
8274
+ skeletonRoot: ({}: {}) => {
8275
+ '& .SCEventMediaWidget-grid': {
8276
+ display: string;
8277
+ gap: string;
8278
+ gridTemplateColumns: string;
8279
+ '& > .SCEventMediaWidget-media': {
8280
+ paddingBottom: string;
8281
+ };
8282
+ };
8283
+ };
8284
+ dialogRoot: ({ theme }: {
8285
+ theme: any;
8286
+ }) => {
8287
+ '& .SCEventMediaWidget-grid': {
8288
+ display: string;
8289
+ gap: string;
8290
+ gridTemplateColumns: string;
8291
+ '& > .SCEventMediaWidget-media': {
8292
+ paddingBottom: string;
8293
+ };
8294
+ '& > .SCEventMediaWidget-dialog-media-wrapper': {
8295
+ position: string;
8296
+ width: string;
8297
+ paddingBottom: string;
8298
+ backgroundSize: string;
8299
+ '& > .SCEventMediaWidget-dialog-button-wrapper': {
8300
+ position: string;
8301
+ top: number;
8302
+ width: string;
8303
+ height: string;
8304
+ backgroundColor: any;
8305
+ opacity: number;
8306
+ flexDirection: string;
8307
+ justifyContent: string;
8308
+ alignItems: string;
8309
+ '& > .SCEventMediaWidget-dialog-loading-button': {
8310
+ padding: number;
8311
+ minWidth: string;
8312
+ '& > .MuiLoadingButton-loadingIndicatorCenter': {
8313
+ color: any;
8314
+ };
8315
+ };
8316
+ };
8317
+ };
8318
+ };
8319
+ };
8320
+ triggerRoot: ({ isSquare }: {
8321
+ isSquare: any;
8322
+ }) => {
8323
+ padding: 0;
8324
+ borderRadius: 0;
8325
+ backgroundColor: string;
8326
+ '&:hover': {
8327
+ backgroundColor: string;
8328
+ };
8329
+ '& > .SCEventMediaWidget-trigger-content': {
8330
+ position: string;
8331
+ width: string;
8332
+ padding: string;
8333
+ paddingBottom: string;
8334
+ flexDirection: string;
8335
+ gap: string;
8336
+ alignItems: string;
8337
+ justifyContent: string;
8338
+ '& > .SCEventMediaWidget-trigger-icon': {
8339
+ position: string;
8340
+ top: string;
8341
+ transform: string;
8342
+ fontSize: string;
8343
+ };
8344
+ };
8345
+ };
8346
+ };
8347
+ };
8209
8348
  };
8210
8349
  selfcommunity: {
8211
8350
  user: {
package/lib/cjs/index.js CHANGED
@@ -67,11 +67,13 @@ const SCEmojiPicker_1 = tslib_1.__importDefault(require("./components/SCEmojiPic
67
67
  const SCEvent_1 = tslib_1.__importDefault(require("./components/SCEvent"));
68
68
  const SCEventActionsMenu_1 = tslib_1.__importDefault(require("./components/SCEventActionsMenu"));
69
69
  const SCEventForm_1 = tslib_1.__importDefault(require("./components/SCEventForm"));
70
+ const SCEventFormDialog_1 = tslib_1.__importDefault(require("./components/SCEventFormDialog"));
70
71
  const SCEventHeader_1 = tslib_1.__importDefault(require("./components/SCEventHeader"));
71
72
  const SCEventInfoDetails_1 = tslib_1.__importDefault(require("./components/SCEventInfoDetails"));
72
73
  const SCEventInfoWidget_1 = tslib_1.__importDefault(require("./components/SCEventInfoWidget"));
73
74
  const SCEventInviteButton_1 = tslib_1.__importDefault(require("./components/SCEventInviteButton"));
74
75
  const SCEventLocationWidget_1 = tslib_1.__importDefault(require("./components/SCEventLocationWidget"));
76
+ const SCEventMediaWidget_1 = tslib_1.__importDefault(require("./components/SCEventMediaWidget"));
75
77
  const SCEventMembersWidget_1 = tslib_1.__importDefault(require("./components/SCEventMembersWidget"));
76
78
  const SCEventParticipantsButton_1 = tslib_1.__importDefault(require("./components/SCEventParticipantsButton"));
77
79
  const SCEvents_1 = tslib_1.__importDefault(require("./components/SCEvents"));
@@ -368,6 +370,7 @@ const theme = {
368
370
  SCUserSubscribedGroupsWidget: SCUserSubscribedGroupsWidget_1.default,
369
371
  SCUserSuggestionWidget: SCUserSuggestionWidget_1.default,
370
372
  SCEventForm: SCEventForm_1.default,
373
+ SCEventFormDialog: SCEventFormDialog_1.default,
371
374
  SCCreateEventButton: SCCreateEventButton_1.default,
372
375
  SCEventLocationWidget: SCEventLocationWidget_1.default,
373
376
  SCEvent: SCEvent_1.default,
@@ -387,7 +390,8 @@ const theme = {
387
390
  SCRelatedEventsWidget: SCRelatedEventsWidget_1.default,
388
391
  SCVoteAudienceButton: SCVoteAudienceButton_1.default,
389
392
  SCVoteButton: SCVoteButton_1.default,
390
- SCWidget: SCWidget_1.default
393
+ SCWidget: SCWidget_1.default,
394
+ SCEventMediaWidget: SCEventMediaWidget_1.default
391
395
  },
392
396
  selfcommunity: {
393
397
  user: {
@@ -68,6 +68,14 @@ declare const Component: {
68
68
  '& .SCEventForm-active': {
69
69
  color: any;
70
70
  };
71
+ '& .SCEventForm-actions': {
72
+ marginTop: any;
73
+ display: string;
74
+ justifyContent: string;
75
+ '& button': {
76
+ width: string;
77
+ };
78
+ };
71
79
  '& .SCEventForm-privacy-section': {
72
80
  marginTop: any;
73
81
  justifyContent: string;
@@ -69,6 +69,14 @@ const Component = {
69
69
  '& .SCEventForm-active': {
70
70
  color: theme.palette.secondary.main
71
71
  },
72
+ '& .SCEventForm-actions': {
73
+ marginTop: theme.spacing(2),
74
+ display: 'flex',
75
+ justifyContent: 'flex-end',
76
+ '& button': {
77
+ width: 'fit-content'
78
+ }
79
+ },
72
80
  '& .SCEventForm-privacy-section': {
73
81
  marginTop: theme.spacing(2),
74
82
  justifyContent: 'center',
@@ -0,0 +1,13 @@
1
+ declare const Component: {
2
+ styleOverrides: {
3
+ root: ({ theme }: any) => {
4
+ '& .MuiDialogTitle-root': {
5
+ '& span': {
6
+ flexGrow: number;
7
+ textAlign: string;
8
+ };
9
+ };
10
+ };
11
+ };
12
+ };
13
+ export default Component;
@@ -0,0 +1,13 @@
1
+ const Component = {
2
+ styleOverrides: {
3
+ root: ({ theme }) => ({
4
+ '& .MuiDialogTitle-root': {
5
+ '& span': {
6
+ flexGrow: 1,
7
+ textAlign: 'center'
8
+ }
9
+ }
10
+ })
11
+ }
12
+ };
13
+ export default Component;