cozy-sharing 7.1.2 → 8.0.0

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 (35) hide show
  1. package/CHANGELOG.md +25 -0
  2. package/dist/ShareButtonWithRecipients.js +1 -1
  3. package/dist/SharingBanner/components/PublicBanner.js +1 -1
  4. package/dist/SharingDetailsModal.js +1 -1
  5. package/dist/SharingProvider.js +8 -0
  6. package/dist/components/ContactSuggestion.js +2 -2
  7. package/dist/components/Recipient/LinkRecipient.js +2 -2
  8. package/dist/components/Recipient/LinkRecipientPermissions.js +2 -2
  9. package/dist/components/Recipient/Recipient.js +2 -2
  10. package/dist/components/Recipient/RecipientConfirm.js +1 -1
  11. package/dist/components/Recipient/RecipientPermissions.js +1 -1
  12. package/dist/components/Recipient/RecipientStatus.js +1 -1
  13. package/dist/components/ShareButton.js +1 -1
  14. package/dist/components/ShareByEmail.js +1 -1
  15. package/dist/components/ShareDialogTwoStepsConfirmationContainer.js +1 -1
  16. package/dist/components/Sharesubmit.js +1 -1
  17. package/dist/components/WhoHasAccess.js +1 -1
  18. package/dist/stylesheet.css +102 -28
  19. package/package.json +5 -5
  20. package/src/ShareButtonWithRecipients.jsx +1 -1
  21. package/src/SharingBanner/components/PublicBanner.jsx +1 -1
  22. package/src/SharingDetailsModal.jsx +1 -1
  23. package/src/components/ContactSuggestion.jsx +2 -2
  24. package/src/components/Recipient/LinkRecipient.jsx +2 -2
  25. package/src/components/Recipient/LinkRecipientPermissions.jsx +5 -5
  26. package/src/components/Recipient/Recipient.jsx +2 -2
  27. package/src/components/Recipient/RecipientConfirm.jsx +1 -1
  28. package/src/components/Recipient/RecipientPermissions.jsx +3 -1
  29. package/src/components/Recipient/RecipientStatus.jsx +1 -1
  30. package/src/components/ShareButton.jsx +1 -1
  31. package/src/components/ShareByEmail.jsx +1 -1
  32. package/src/components/ShareDialogTwoStepsConfirmationContainer.jsx +1 -1
  33. package/src/components/Sharesubmit.jsx +1 -1
  34. package/src/components/WhoHasAccess.jsx +1 -1
  35. package/src/components/__snapshots__/ContactSuggestion.spec.jsx.snap +795 -732
package/src/components/__snapshots__/ContactSuggestion.spec.jsx.snap CHANGED
@@ -52,143 +52,134 @@ exports[`ContactSuggestion component should display contact suggestion for a con
52
52
  }
53
53
  t={[MockFunction]}
54
54
  >
55
- <WithStyles(ForwardRef(ListItem))
55
+ <ListItem
56
56
  button={true}
57
+ gutters="default"
58
+ size="medium"
57
59
  >
58
- <ForwardRef(ListItem)
60
+ <WithStyles(ForwardRef(ListItem))
59
61
  button={true}
62
+ className="medium"
60
63
  classes={
61
64
  Object {
62
- "alignItemsFlexStart": "MuiListItem-alignItemsFlexStart",
63
- "button": "MuiListItem-button",
64
- "container": "MuiListItem-container",
65
- "dense": "MuiListItem-dense",
66
- "disabled": "Mui-disabled",
67
- "divider": "MuiListItem-divider",
68
- "focusVisible": "Mui-focusVisible",
69
- "gutters": "MuiListItem-gutters",
70
- "root": "MuiListItem-root",
71
- "secondaryAction": "MuiListItem-secondaryAction",
72
- "selected": "Mui-selected",
65
+ "gutters": "makeStyles-gutters-1 makeStyles-gutters-3",
66
+ "secondaryAction": "makeStyles-secondaryAction-2 makeStyles-secondaryAction-4",
73
67
  }
74
68
  }
69
+ disableGutters={false}
70
+ size="medium"
75
71
  >
76
- <WithStyles(ForwardRef(ButtonBase))
77
- className="MuiListItem-root MuiListItem-gutters MuiListItem-button"
78
- component="div"
79
- disabled={false}
80
- focusVisibleClassName="Mui-focusVisible"
81
- >
82
- <ForwardRef(ButtonBase)
83
- className="MuiListItem-root MuiListItem-gutters MuiListItem-button"
84
- classes={
85
- Object {
86
- "disabled": "Mui-disabled",
87
- "focusVisible": "Mui-focusVisible",
88
- "root": "MuiButtonBase-root",
89
- }
72
+ <ForwardRef(ListItem)
73
+ button={true}
74
+ className="medium"
75
+ classes={
76
+ Object {
77
+ "alignItemsFlexStart": "MuiListItem-alignItemsFlexStart",
78
+ "button": "MuiListItem-button",
79
+ "container": "MuiListItem-container",
80
+ "dense": "MuiListItem-dense",
81
+ "disabled": "Mui-disabled",
82
+ "divider": "MuiListItem-divider",
83
+ "focusVisible": "Mui-focusVisible",
84
+ "gutters": "MuiListItem-gutters makeStyles-gutters-1 makeStyles-gutters-3",
85
+ "root": "MuiListItem-root",
86
+ "secondaryAction": "MuiListItem-secondaryAction makeStyles-secondaryAction-2 makeStyles-secondaryAction-4",
87
+ "selected": "Mui-selected",
90
88
  }
89
+ }
90
+ disableGutters={false}
91
+ size="medium"
92
+ >
93
+ <WithStyles(ForwardRef(ButtonBase))
94
+ className="MuiListItem-root medium MuiListItem-gutters makeStyles-gutters-1 makeStyles-gutters-3 MuiListItem-button"
91
95
  component="div"
92
96
  disabled={false}
93
97
  focusVisibleClassName="Mui-focusVisible"
98
+ size="medium"
94
99
  >
95
- <div
96
- aria-disabled={false}
97
- className="MuiButtonBase-root MuiListItem-root MuiListItem-gutters MuiListItem-button"
98
- onBlur={[Function]}
99
- onDragLeave={[Function]}
100
- onFocus={[Function]}
101
- onKeyDown={[Function]}
102
- onKeyUp={[Function]}
103
- onMouseDown={[Function]}
104
- onMouseLeave={[Function]}
105
- onMouseUp={[Function]}
106
- onTouchEnd={[Function]}
107
- onTouchMove={[Function]}
108
- onTouchStart={[Function]}
109
- role="button"
110
- tabIndex={0}
100
+ <ForwardRef(ButtonBase)
101
+ className="MuiListItem-root medium MuiListItem-gutters makeStyles-gutters-1 makeStyles-gutters-3 MuiListItem-button"
102
+ classes={
103
+ Object {
104
+ "disabled": "Mui-disabled",
105
+ "focusVisible": "Mui-focusVisible",
106
+ "root": "MuiButtonBase-root",
107
+ }
108
+ }
109
+ component="div"
110
+ disabled={false}
111
+ focusVisibleClassName="Mui-focusVisible"
112
+ size="medium"
111
113
  >
112
- <WithStyles(ForwardRef(ListItemIcon))
113
- key=".0"
114
+ <div
115
+ aria-disabled={false}
116
+ className="MuiButtonBase-root MuiListItem-root medium MuiListItem-gutters makeStyles-gutters-1 makeStyles-gutters-3 MuiListItem-button"
117
+ onBlur={[Function]}
118
+ onDragLeave={[Function]}
119
+ onFocus={[Function]}
120
+ onKeyDown={[Function]}
121
+ onKeyUp={[Function]}
122
+ onMouseDown={[Function]}
123
+ onMouseLeave={[Function]}
124
+ onMouseUp={[Function]}
125
+ onTouchEnd={[Function]}
126
+ onTouchMove={[Function]}
127
+ onTouchStart={[Function]}
128
+ role="button"
129
+ size="medium"
130
+ tabIndex={0}
114
131
  >
115
- <ForwardRef(ListItemIcon)
116
- classes={
117
- Object {
118
- "alignItemsFlexStart": "MuiListItemIcon-alignItemsFlexStart",
119
- "root": "MuiListItemIcon-root",
120
- }
121
- }
132
+ <ListItemIcon
133
+ key=".$.$.0"
122
134
  >
123
- <div
124
- className="MuiListItemIcon-root"
135
+ <ForwardRef(ListItemIcon)
136
+ classes={
137
+ Object {
138
+ "alignItemsFlexStart": "MuiListItemIcon-alignItemsFlexStart",
139
+ "root": "MuiListItemIcon-root",
140
+ }
141
+ }
125
142
  >
126
- <Avatar
127
- className=""
128
- disabled={false}
129
- ghost={false}
130
- icon={[Function]}
131
- image=""
132
- size="small"
133
- style={Object {}}
134
- text="JS"
143
+ <div
144
+ className="MuiListItemIcon-root"
135
145
  >
136
- <div
137
- className="styles__c-avatar___PpDI- styles__c-avatar--text___2dvna"
138
- data-testid="Avatar"
139
- style={
140
- Object {
141
- "--circleSize": "32px",
142
- "backgroundColor": "#C2ADF4",
143
- }
144
- }
146
+ <Avatar
147
+ className=""
148
+ disabled={false}
149
+ ghost={false}
150
+ icon={[Function]}
151
+ image=""
152
+ size="small"
153
+ style={Object {}}
154
+ text="JS"
145
155
  >
146
- <span
147
- className="styles__c-avatar-initials___310qC"
156
+ <div
157
+ className="styles__c-avatar___PpDI- styles__c-avatar--text___2dvna"
158
+ data-testid="Avatar"
159
+ style={
160
+ Object {
161
+ "--circleSize": "32px",
162
+ "backgroundColor": "#C2ADF4",
163
+ }
164
+ }
148
165
  >
149
- JS
150
- </span>
151
- </div>
152
- </Avatar>
153
- </div>
154
- </ForwardRef(ListItemIcon)>
155
- </WithStyles(ForwardRef(ListItemIcon))>
156
- <ListItemText
157
- ellipsis={true}
158
- key=".1"
159
- primary="Jon Snow"
160
- secondary="https://jonsnow.mycozy.cloud"
161
- >
162
- <WithStyles(ForwardRef(ListItemText))
166
+ <span
167
+ className="styles__c-avatar-initials___310qC"
168
+ >
169
+ JS
170
+ </span>
171
+ </div>
172
+ </Avatar>
173
+ </div>
174
+ </ForwardRef(ListItemIcon)>
175
+ </ListItemIcon>
176
+ <ListItemText
177
+ ellipsis={true}
178
+ key=".$.$.1"
163
179
  primary="Jon Snow"
164
- primaryTypographyProps={
165
- Object {
166
- "classes": Object {
167
- "root": "u-db u-ellipsis",
168
- },
169
- }
170
- }
171
180
  secondary="https://jonsnow.mycozy.cloud"
172
- secondaryTypographyProps={
173
- Object {
174
- "classes": Object {
175
- "root": "u-db u-ellipsis",
176
- },
177
- "variant": "caption",
178
- }
179
- }
180
181
  >
181
- <ForwardRef(ListItemText)
182
- classes={
183
- Object {
184
- "dense": "MuiListItemText-dense",
185
- "inset": "MuiListItemText-inset",
186
- "multiline": "MuiListItemText-multiline",
187
- "primary": "MuiListItemText-primary",
188
- "root": "MuiListItemText-root",
189
- "secondary": "MuiListItemText-secondary",
190
- }
191
- }
182
+ <WithStyles(ForwardRef(ListItemText))
192
183
  primary="Jon Snow"
193
184
  primaryTypographyProps={
194
185
  Object {
@@ -207,162 +198,192 @@ exports[`ContactSuggestion component should display contact suggestion for a con
207
198
  }
208
199
  }
209
200
  >
210
- <div
211
- className="MuiListItemText-root MuiListItemText-multiline"
212
- >
213
- <WithStyles(ForwardRef(Typography))
214
- className="MuiListItemText-primary"
215
- classes={
216
- Object {
201
+ <ForwardRef(ListItemText)
202
+ classes={
203
+ Object {
204
+ "dense": "MuiListItemText-dense",
205
+ "inset": "MuiListItemText-inset",
206
+ "multiline": "MuiListItemText-multiline",
207
+ "primary": "MuiListItemText-primary",
208
+ "root": "MuiListItemText-root",
209
+ "secondary": "MuiListItemText-secondary",
210
+ }
211
+ }
212
+ primary="Jon Snow"
213
+ primaryTypographyProps={
214
+ Object {
215
+ "classes": Object {
217
216
  "root": "u-db u-ellipsis",
218
- }
217
+ },
218
+ }
219
+ }
220
+ secondary="https://jonsnow.mycozy.cloud"
221
+ secondaryTypographyProps={
222
+ Object {
223
+ "classes": Object {
224
+ "root": "u-db u-ellipsis",
225
+ },
226
+ "variant": "caption",
219
227
  }
220
- component="span"
221
- display="block"
222
- variant="body1"
228
+ }
229
+ >
230
+ <div
231
+ className="MuiListItemText-root MuiListItemText-multiline"
223
232
  >
224
- <ForwardRef(Typography)
233
+ <WithStyles(ForwardRef(Typography))
225
234
  className="MuiListItemText-primary"
226
235
  classes={
227
236
  Object {
228
- "alignCenter": "MuiTypography-alignCenter",
229
- "alignJustify": "MuiTypography-alignJustify",
230
- "alignLeft": "MuiTypography-alignLeft",
231
- "alignRight": "MuiTypography-alignRight",
232
- "body1": "MuiTypography-body1",
233
- "body2": "MuiTypography-body2",
234
- "button": "MuiTypography-button",
235
- "caption": "MuiTypography-caption",
236
- "colorError": "MuiTypography-colorError",
237
- "colorInherit": "MuiTypography-colorInherit",
238
- "colorPrimary": "MuiTypography-colorPrimary",
239
- "colorSecondary": "MuiTypography-colorSecondary",
240
- "colorTextPrimary": "MuiTypography-colorTextPrimary",
241
- "colorTextSecondary": "MuiTypography-colorTextSecondary",
242
- "displayBlock": "MuiTypography-displayBlock",
243
- "displayInline": "MuiTypography-displayInline",
244
- "gutterBottom": "MuiTypography-gutterBottom",
245
- "h1": "MuiTypography-h1",
246
- "h2": "MuiTypography-h2",
247
- "h3": "MuiTypography-h3",
248
- "h4": "MuiTypography-h4",
249
- "h5": "MuiTypography-h5",
250
- "h6": "MuiTypography-h6",
251
- "noWrap": "MuiTypography-noWrap",
252
- "overline": "MuiTypography-overline",
253
- "paragraph": "MuiTypography-paragraph",
254
- "root": "MuiTypography-root u-db u-ellipsis",
255
- "srOnly": "MuiTypography-srOnly",
256
- "subtitle1": "MuiTypography-subtitle1",
257
- "subtitle2": "MuiTypography-subtitle2",
237
+ "root": "u-db u-ellipsis",
258
238
  }
259
239
  }
260
240
  component="span"
261
241
  display="block"
262
242
  variant="body1"
263
243
  >
264
- <span
265
- className="MuiTypography-root u-db u-ellipsis MuiListItemText-primary MuiTypography-body1 MuiTypography-displayBlock"
244
+ <ForwardRef(Typography)
245
+ className="MuiListItemText-primary"
246
+ classes={
247
+ Object {
248
+ "alignCenter": "MuiTypography-alignCenter",
249
+ "alignJustify": "MuiTypography-alignJustify",
250
+ "alignLeft": "MuiTypography-alignLeft",
251
+ "alignRight": "MuiTypography-alignRight",
252
+ "body1": "MuiTypography-body1",
253
+ "body2": "MuiTypography-body2",
254
+ "button": "MuiTypography-button",
255
+ "caption": "MuiTypography-caption",
256
+ "colorError": "MuiTypography-colorError",
257
+ "colorInherit": "MuiTypography-colorInherit",
258
+ "colorPrimary": "MuiTypography-colorPrimary",
259
+ "colorSecondary": "MuiTypography-colorSecondary",
260
+ "colorTextPrimary": "MuiTypography-colorTextPrimary",
261
+ "colorTextSecondary": "MuiTypography-colorTextSecondary",
262
+ "displayBlock": "MuiTypography-displayBlock",
263
+ "displayInline": "MuiTypography-displayInline",
264
+ "gutterBottom": "MuiTypography-gutterBottom",
265
+ "h1": "MuiTypography-h1",
266
+ "h2": "MuiTypography-h2",
267
+ "h3": "MuiTypography-h3",
268
+ "h4": "MuiTypography-h4",
269
+ "h5": "MuiTypography-h5",
270
+ "h6": "MuiTypography-h6",
271
+ "noWrap": "MuiTypography-noWrap",
272
+ "overline": "MuiTypography-overline",
273
+ "paragraph": "MuiTypography-paragraph",
274
+ "root": "MuiTypography-root u-db u-ellipsis",
275
+ "srOnly": "MuiTypography-srOnly",
276
+ "subtitle1": "MuiTypography-subtitle1",
277
+ "subtitle2": "MuiTypography-subtitle2",
278
+ }
279
+ }
280
+ component="span"
281
+ display="block"
282
+ variant="body1"
266
283
  >
267
- Jon Snow
268
- </span>
269
- </ForwardRef(Typography)>
270
- </WithStyles(ForwardRef(Typography))>
271
- <WithStyles(ForwardRef(Typography))
272
- className="MuiListItemText-secondary"
273
- classes={
274
- Object {
275
- "root": "u-db u-ellipsis",
276
- }
277
- }
278
- color="textSecondary"
279
- display="block"
280
- variant="caption"
281
- >
282
- <ForwardRef(Typography)
284
+ <span
285
+ className="MuiTypography-root u-db u-ellipsis MuiListItemText-primary MuiTypography-body1 MuiTypography-displayBlock"
286
+ >
287
+ Jon Snow
288
+ </span>
289
+ </ForwardRef(Typography)>
290
+ </WithStyles(ForwardRef(Typography))>
291
+ <WithStyles(ForwardRef(Typography))
283
292
  className="MuiListItemText-secondary"
284
293
  classes={
285
294
  Object {
286
- "alignCenter": "MuiTypography-alignCenter",
287
- "alignJustify": "MuiTypography-alignJustify",
288
- "alignLeft": "MuiTypography-alignLeft",
289
- "alignRight": "MuiTypography-alignRight",
290
- "body1": "MuiTypography-body1",
291
- "body2": "MuiTypography-body2",
292
- "button": "MuiTypography-button",
293
- "caption": "MuiTypography-caption",
294
- "colorError": "MuiTypography-colorError",
295
- "colorInherit": "MuiTypography-colorInherit",
296
- "colorPrimary": "MuiTypography-colorPrimary",
297
- "colorSecondary": "MuiTypography-colorSecondary",
298
- "colorTextPrimary": "MuiTypography-colorTextPrimary",
299
- "colorTextSecondary": "MuiTypography-colorTextSecondary",
300
- "displayBlock": "MuiTypography-displayBlock",
301
- "displayInline": "MuiTypography-displayInline",
302
- "gutterBottom": "MuiTypography-gutterBottom",
303
- "h1": "MuiTypography-h1",
304
- "h2": "MuiTypography-h2",
305
- "h3": "MuiTypography-h3",
306
- "h4": "MuiTypography-h4",
307
- "h5": "MuiTypography-h5",
308
- "h6": "MuiTypography-h6",
309
- "noWrap": "MuiTypography-noWrap",
310
- "overline": "MuiTypography-overline",
311
- "paragraph": "MuiTypography-paragraph",
312
- "root": "MuiTypography-root u-db u-ellipsis",
313
- "srOnly": "MuiTypography-srOnly",
314
- "subtitle1": "MuiTypography-subtitle1",
315
- "subtitle2": "MuiTypography-subtitle2",
295
+ "root": "u-db u-ellipsis",
316
296
  }
317
297
  }
318
298
  color="textSecondary"
319
299
  display="block"
320
300
  variant="caption"
321
301
  >
322
- <span
323
- className="MuiTypography-root u-db u-ellipsis MuiListItemText-secondary MuiTypography-caption MuiTypography-colorTextSecondary MuiTypography-displayBlock"
302
+ <ForwardRef(Typography)
303
+ className="MuiListItemText-secondary"
304
+ classes={
305
+ Object {
306
+ "alignCenter": "MuiTypography-alignCenter",
307
+ "alignJustify": "MuiTypography-alignJustify",
308
+ "alignLeft": "MuiTypography-alignLeft",
309
+ "alignRight": "MuiTypography-alignRight",
310
+ "body1": "MuiTypography-body1",
311
+ "body2": "MuiTypography-body2",
312
+ "button": "MuiTypography-button",
313
+ "caption": "MuiTypography-caption",
314
+ "colorError": "MuiTypography-colorError",
315
+ "colorInherit": "MuiTypography-colorInherit",
316
+ "colorPrimary": "MuiTypography-colorPrimary",
317
+ "colorSecondary": "MuiTypography-colorSecondary",
318
+ "colorTextPrimary": "MuiTypography-colorTextPrimary",
319
+ "colorTextSecondary": "MuiTypography-colorTextSecondary",
320
+ "displayBlock": "MuiTypography-displayBlock",
321
+ "displayInline": "MuiTypography-displayInline",
322
+ "gutterBottom": "MuiTypography-gutterBottom",
323
+ "h1": "MuiTypography-h1",
324
+ "h2": "MuiTypography-h2",
325
+ "h3": "MuiTypography-h3",
326
+ "h4": "MuiTypography-h4",
327
+ "h5": "MuiTypography-h5",
328
+ "h6": "MuiTypography-h6",
329
+ "noWrap": "MuiTypography-noWrap",
330
+ "overline": "MuiTypography-overline",
331
+ "paragraph": "MuiTypography-paragraph",
332
+ "root": "MuiTypography-root u-db u-ellipsis",
333
+ "srOnly": "MuiTypography-srOnly",
334
+ "subtitle1": "MuiTypography-subtitle1",
335
+ "subtitle2": "MuiTypography-subtitle2",
336
+ }
337
+ }
338
+ color="textSecondary"
339
+ display="block"
340
+ variant="caption"
324
341
  >
325
- https://jonsnow.mycozy.cloud
326
- </span>
327
- </ForwardRef(Typography)>
328
- </WithStyles(ForwardRef(Typography))>
329
- </div>
330
- </ForwardRef(ListItemText)>
331
- </WithStyles(ForwardRef(ListItemText))>
332
- </ListItemText>
333
- <WithStyles(memo)
334
- center={false}
335
- >
336
- <ForwardRef(TouchRipple)
342
+ <span
343
+ className="MuiTypography-root u-db u-ellipsis MuiListItemText-secondary MuiTypography-caption MuiTypography-colorTextSecondary MuiTypography-displayBlock"
344
+ >
345
+ https://jonsnow.mycozy.cloud
346
+ </span>
347
+ </ForwardRef(Typography)>
348
+ </WithStyles(ForwardRef(Typography))>
349
+ </div>
350
+ </ForwardRef(ListItemText)>
351
+ </WithStyles(ForwardRef(ListItemText))>
352
+ </ListItemText>
353
+ <WithStyles(memo)
337
354
  center={false}
338
- classes={
339
- Object {
340
- "child": "MuiTouchRipple-child",
341
- "childLeaving": "MuiTouchRipple-childLeaving",
342
- "childPulsate": "MuiTouchRipple-childPulsate",
343
- "ripple": "MuiTouchRipple-ripple",
344
- "ripplePulsate": "MuiTouchRipple-ripplePulsate",
345
- "rippleVisible": "MuiTouchRipple-rippleVisible",
346
- "root": "MuiTouchRipple-root",
347
- }
348
- }
349
355
  >
350
- <span
351
- className="MuiTouchRipple-root"
356
+ <ForwardRef(TouchRipple)
357
+ center={false}
358
+ classes={
359
+ Object {
360
+ "child": "MuiTouchRipple-child",
361
+ "childLeaving": "MuiTouchRipple-childLeaving",
362
+ "childPulsate": "MuiTouchRipple-childPulsate",
363
+ "ripple": "MuiTouchRipple-ripple",
364
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
365
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
366
+ "root": "MuiTouchRipple-root",
367
+ }
368
+ }
352
369
  >
353
- <TransitionGroup
354
- childFactory={[Function]}
355
- component={null}
356
- exit={true}
357
- />
358
- </span>
359
- </ForwardRef(TouchRipple)>
360
- </WithStyles(memo)>
361
- </div>
362
- </ForwardRef(ButtonBase)>
363
- </WithStyles(ForwardRef(ButtonBase))>
364
- </ForwardRef(ListItem)>
365
- </WithStyles(ForwardRef(ListItem))>
370
+ <span
371
+ className="MuiTouchRipple-root"
372
+ >
373
+ <TransitionGroup
374
+ childFactory={[Function]}
375
+ component={null}
376
+ exit={true}
377
+ />
378
+ </span>
379
+ </ForwardRef(TouchRipple)>
380
+ </WithStyles(memo)>
381
+ </div>
382
+ </ForwardRef(ButtonBase)>
383
+ </WithStyles(ForwardRef(ButtonBase))>
384
+ </ForwardRef(ListItem)>
385
+ </WithStyles(ForwardRef(ListItem))>
386
+ </ListItem>
366
387
  </ContactSuggestion>
367
388
  `;
368
389
 
@@ -400,143 +421,134 @@ exports[`ContactSuggestion component should display contact suggestion for a con
400
421
  }
401
422
  t={[MockFunction]}
402
423
  >
403
- <WithStyles(ForwardRef(ListItem))
424
+ <ListItem
404
425
  button={true}
426
+ gutters="default"
427
+ size="medium"
405
428
  >
406
- <ForwardRef(ListItem)
429
+ <WithStyles(ForwardRef(ListItem))
407
430
  button={true}
431
+ className="medium"
408
432
  classes={
409
433
  Object {
410
- "alignItemsFlexStart": "MuiListItem-alignItemsFlexStart",
411
- "button": "MuiListItem-button",
412
- "container": "MuiListItem-container",
413
- "dense": "MuiListItem-dense",
414
- "disabled": "Mui-disabled",
415
- "divider": "MuiListItem-divider",
416
- "focusVisible": "Mui-focusVisible",
417
- "gutters": "MuiListItem-gutters",
418
- "root": "MuiListItem-root",
419
- "secondaryAction": "MuiListItem-secondaryAction",
420
- "selected": "Mui-selected",
434
+ "gutters": "makeStyles-gutters-1 makeStyles-gutters-5",
435
+ "secondaryAction": "makeStyles-secondaryAction-2 makeStyles-secondaryAction-6",
421
436
  }
422
437
  }
438
+ disableGutters={false}
439
+ size="medium"
423
440
  >
424
- <WithStyles(ForwardRef(ButtonBase))
425
- className="MuiListItem-root MuiListItem-gutters MuiListItem-button"
426
- component="div"
427
- disabled={false}
428
- focusVisibleClassName="Mui-focusVisible"
429
- >
430
- <ForwardRef(ButtonBase)
431
- className="MuiListItem-root MuiListItem-gutters MuiListItem-button"
432
- classes={
433
- Object {
434
- "disabled": "Mui-disabled",
435
- "focusVisible": "Mui-focusVisible",
436
- "root": "MuiButtonBase-root",
437
- }
441
+ <ForwardRef(ListItem)
442
+ button={true}
443
+ className="medium"
444
+ classes={
445
+ Object {
446
+ "alignItemsFlexStart": "MuiListItem-alignItemsFlexStart",
447
+ "button": "MuiListItem-button",
448
+ "container": "MuiListItem-container",
449
+ "dense": "MuiListItem-dense",
450
+ "disabled": "Mui-disabled",
451
+ "divider": "MuiListItem-divider",
452
+ "focusVisible": "Mui-focusVisible",
453
+ "gutters": "MuiListItem-gutters makeStyles-gutters-1 makeStyles-gutters-5",
454
+ "root": "MuiListItem-root",
455
+ "secondaryAction": "MuiListItem-secondaryAction makeStyles-secondaryAction-2 makeStyles-secondaryAction-6",
456
+ "selected": "Mui-selected",
438
457
  }
458
+ }
459
+ disableGutters={false}
460
+ size="medium"
461
+ >
462
+ <WithStyles(ForwardRef(ButtonBase))
463
+ className="MuiListItem-root medium MuiListItem-gutters makeStyles-gutters-1 makeStyles-gutters-5 MuiListItem-button"
439
464
  component="div"
440
465
  disabled={false}
441
466
  focusVisibleClassName="Mui-focusVisible"
467
+ size="medium"
442
468
  >
443
- <div
444
- aria-disabled={false}
445
- className="MuiButtonBase-root MuiListItem-root MuiListItem-gutters MuiListItem-button"
446
- onBlur={[Function]}
447
- onDragLeave={[Function]}
448
- onFocus={[Function]}
449
- onKeyDown={[Function]}
450
- onKeyUp={[Function]}
451
- onMouseDown={[Function]}
452
- onMouseLeave={[Function]}
453
- onMouseUp={[Function]}
454
- onTouchEnd={[Function]}
455
- onTouchMove={[Function]}
456
- onTouchStart={[Function]}
457
- role="button"
458
- tabIndex={0}
469
+ <ForwardRef(ButtonBase)
470
+ className="MuiListItem-root medium MuiListItem-gutters makeStyles-gutters-1 makeStyles-gutters-5 MuiListItem-button"
471
+ classes={
472
+ Object {
473
+ "disabled": "Mui-disabled",
474
+ "focusVisible": "Mui-focusVisible",
475
+ "root": "MuiButtonBase-root",
476
+ }
477
+ }
478
+ component="div"
479
+ disabled={false}
480
+ focusVisibleClassName="Mui-focusVisible"
481
+ size="medium"
459
482
  >
460
- <WithStyles(ForwardRef(ListItemIcon))
461
- key=".0"
483
+ <div
484
+ aria-disabled={false}
485
+ className="MuiButtonBase-root MuiListItem-root medium MuiListItem-gutters makeStyles-gutters-1 makeStyles-gutters-5 MuiListItem-button"
486
+ onBlur={[Function]}
487
+ onDragLeave={[Function]}
488
+ onFocus={[Function]}
489
+ onKeyDown={[Function]}
490
+ onKeyUp={[Function]}
491
+ onMouseDown={[Function]}
492
+ onMouseLeave={[Function]}
493
+ onMouseUp={[Function]}
494
+ onTouchEnd={[Function]}
495
+ onTouchMove={[Function]}
496
+ onTouchStart={[Function]}
497
+ role="button"
498
+ size="medium"
499
+ tabIndex={0}
462
500
  >
463
- <ForwardRef(ListItemIcon)
464
- classes={
465
- Object {
466
- "alignItemsFlexStart": "MuiListItemIcon-alignItemsFlexStart",
467
- "root": "MuiListItemIcon-root",
468
- }
469
- }
501
+ <ListItemIcon
502
+ key=".$.$.0"
470
503
  >
471
- <div
472
- className="MuiListItemIcon-root"
504
+ <ForwardRef(ListItemIcon)
505
+ classes={
506
+ Object {
507
+ "alignItemsFlexStart": "MuiListItemIcon-alignItemsFlexStart",
508
+ "root": "MuiListItemIcon-root",
509
+ }
510
+ }
473
511
  >
474
- <Avatar
475
- className=""
476
- disabled={false}
477
- ghost={false}
478
- icon={[Function]}
479
- image=""
480
- size="small"
481
- style={Object {}}
482
- text="J"
512
+ <div
513
+ className="MuiListItemIcon-root"
483
514
  >
484
- <div
485
- className="styles__c-avatar___PpDI- styles__c-avatar--text___2dvna"
486
- data-testid="Avatar"
487
- style={
488
- Object {
489
- "--circleSize": "32px",
490
- "backgroundColor": "#0DCBCF",
491
- }
492
- }
515
+ <Avatar
516
+ className=""
517
+ disabled={false}
518
+ ghost={false}
519
+ icon={[Function]}
520
+ image=""
521
+ size="small"
522
+ style={Object {}}
523
+ text="J"
493
524
  >
494
- <span
495
- className="styles__c-avatar-initials___310qC"
525
+ <div
526
+ className="styles__c-avatar___PpDI- styles__c-avatar--text___2dvna"
527
+ data-testid="Avatar"
528
+ style={
529
+ Object {
530
+ "--circleSize": "32px",
531
+ "backgroundColor": "#0DCBCF",
532
+ }
533
+ }
496
534
  >
497
- J
498
- </span>
499
- </div>
500
- </Avatar>
501
- </div>
502
- </ForwardRef(ListItemIcon)>
503
- </WithStyles(ForwardRef(ListItemIcon))>
504
- <ListItemText
505
- ellipsis={true}
506
- key=".1"
507
- primary="jon.snow@email.com"
508
- secondary="-"
509
- >
510
- <WithStyles(ForwardRef(ListItemText))
535
+ <span
536
+ className="styles__c-avatar-initials___310qC"
537
+ >
538
+ J
539
+ </span>
540
+ </div>
541
+ </Avatar>
542
+ </div>
543
+ </ForwardRef(ListItemIcon)>
544
+ </ListItemIcon>
545
+ <ListItemText
546
+ ellipsis={true}
547
+ key=".$.$.1"
511
548
  primary="jon.snow@email.com"
512
- primaryTypographyProps={
513
- Object {
514
- "classes": Object {
515
- "root": "u-db u-ellipsis",
516
- },
517
- }
518
- }
519
549
  secondary="-"
520
- secondaryTypographyProps={
521
- Object {
522
- "classes": Object {
523
- "root": "u-db u-ellipsis",
524
- },
525
- "variant": "caption",
526
- }
527
- }
528
550
  >
529
- <ForwardRef(ListItemText)
530
- classes={
531
- Object {
532
- "dense": "MuiListItemText-dense",
533
- "inset": "MuiListItemText-inset",
534
- "multiline": "MuiListItemText-multiline",
535
- "primary": "MuiListItemText-primary",
536
- "root": "MuiListItemText-root",
537
- "secondary": "MuiListItemText-secondary",
538
- }
539
- }
551
+ <WithStyles(ForwardRef(ListItemText))
540
552
  primary="jon.snow@email.com"
541
553
  primaryTypographyProps={
542
554
  Object {
@@ -555,162 +567,192 @@ exports[`ContactSuggestion component should display contact suggestion for a con
555
567
  }
556
568
  }
557
569
  >
558
- <div
559
- className="MuiListItemText-root MuiListItemText-multiline"
560
- >
561
- <WithStyles(ForwardRef(Typography))
562
- className="MuiListItemText-primary"
563
- classes={
564
- Object {
570
+ <ForwardRef(ListItemText)
571
+ classes={
572
+ Object {
573
+ "dense": "MuiListItemText-dense",
574
+ "inset": "MuiListItemText-inset",
575
+ "multiline": "MuiListItemText-multiline",
576
+ "primary": "MuiListItemText-primary",
577
+ "root": "MuiListItemText-root",
578
+ "secondary": "MuiListItemText-secondary",
579
+ }
580
+ }
581
+ primary="jon.snow@email.com"
582
+ primaryTypographyProps={
583
+ Object {
584
+ "classes": Object {
565
585
  "root": "u-db u-ellipsis",
566
- }
586
+ },
587
+ }
588
+ }
589
+ secondary="-"
590
+ secondaryTypographyProps={
591
+ Object {
592
+ "classes": Object {
593
+ "root": "u-db u-ellipsis",
594
+ },
595
+ "variant": "caption",
567
596
  }
568
- component="span"
569
- display="block"
570
- variant="body1"
597
+ }
598
+ >
599
+ <div
600
+ className="MuiListItemText-root MuiListItemText-multiline"
571
601
  >
572
- <ForwardRef(Typography)
602
+ <WithStyles(ForwardRef(Typography))
573
603
  className="MuiListItemText-primary"
574
604
  classes={
575
605
  Object {
576
- "alignCenter": "MuiTypography-alignCenter",
577
- "alignJustify": "MuiTypography-alignJustify",
578
- "alignLeft": "MuiTypography-alignLeft",
579
- "alignRight": "MuiTypography-alignRight",
580
- "body1": "MuiTypography-body1",
581
- "body2": "MuiTypography-body2",
582
- "button": "MuiTypography-button",
583
- "caption": "MuiTypography-caption",
584
- "colorError": "MuiTypography-colorError",
585
- "colorInherit": "MuiTypography-colorInherit",
586
- "colorPrimary": "MuiTypography-colorPrimary",
587
- "colorSecondary": "MuiTypography-colorSecondary",
588
- "colorTextPrimary": "MuiTypography-colorTextPrimary",
589
- "colorTextSecondary": "MuiTypography-colorTextSecondary",
590
- "displayBlock": "MuiTypography-displayBlock",
591
- "displayInline": "MuiTypography-displayInline",
592
- "gutterBottom": "MuiTypography-gutterBottom",
593
- "h1": "MuiTypography-h1",
594
- "h2": "MuiTypography-h2",
595
- "h3": "MuiTypography-h3",
596
- "h4": "MuiTypography-h4",
597
- "h5": "MuiTypography-h5",
598
- "h6": "MuiTypography-h6",
599
- "noWrap": "MuiTypography-noWrap",
600
- "overline": "MuiTypography-overline",
601
- "paragraph": "MuiTypography-paragraph",
602
- "root": "MuiTypography-root u-db u-ellipsis",
603
- "srOnly": "MuiTypography-srOnly",
604
- "subtitle1": "MuiTypography-subtitle1",
605
- "subtitle2": "MuiTypography-subtitle2",
606
+ "root": "u-db u-ellipsis",
606
607
  }
607
608
  }
608
609
  component="span"
609
610
  display="block"
610
611
  variant="body1"
611
612
  >
612
- <span
613
- className="MuiTypography-root u-db u-ellipsis MuiListItemText-primary MuiTypography-body1 MuiTypography-displayBlock"
613
+ <ForwardRef(Typography)
614
+ className="MuiListItemText-primary"
615
+ classes={
616
+ Object {
617
+ "alignCenter": "MuiTypography-alignCenter",
618
+ "alignJustify": "MuiTypography-alignJustify",
619
+ "alignLeft": "MuiTypography-alignLeft",
620
+ "alignRight": "MuiTypography-alignRight",
621
+ "body1": "MuiTypography-body1",
622
+ "body2": "MuiTypography-body2",
623
+ "button": "MuiTypography-button",
624
+ "caption": "MuiTypography-caption",
625
+ "colorError": "MuiTypography-colorError",
626
+ "colorInherit": "MuiTypography-colorInherit",
627
+ "colorPrimary": "MuiTypography-colorPrimary",
628
+ "colorSecondary": "MuiTypography-colorSecondary",
629
+ "colorTextPrimary": "MuiTypography-colorTextPrimary",
630
+ "colorTextSecondary": "MuiTypography-colorTextSecondary",
631
+ "displayBlock": "MuiTypography-displayBlock",
632
+ "displayInline": "MuiTypography-displayInline",
633
+ "gutterBottom": "MuiTypography-gutterBottom",
634
+ "h1": "MuiTypography-h1",
635
+ "h2": "MuiTypography-h2",
636
+ "h3": "MuiTypography-h3",
637
+ "h4": "MuiTypography-h4",
638
+ "h5": "MuiTypography-h5",
639
+ "h6": "MuiTypography-h6",
640
+ "noWrap": "MuiTypography-noWrap",
641
+ "overline": "MuiTypography-overline",
642
+ "paragraph": "MuiTypography-paragraph",
643
+ "root": "MuiTypography-root u-db u-ellipsis",
644
+ "srOnly": "MuiTypography-srOnly",
645
+ "subtitle1": "MuiTypography-subtitle1",
646
+ "subtitle2": "MuiTypography-subtitle2",
647
+ }
648
+ }
649
+ component="span"
650
+ display="block"
651
+ variant="body1"
614
652
  >
615
- jon.snow@email.com
616
- </span>
617
- </ForwardRef(Typography)>
618
- </WithStyles(ForwardRef(Typography))>
619
- <WithStyles(ForwardRef(Typography))
620
- className="MuiListItemText-secondary"
621
- classes={
622
- Object {
623
- "root": "u-db u-ellipsis",
624
- }
625
- }
626
- color="textSecondary"
627
- display="block"
628
- variant="caption"
629
- >
630
- <ForwardRef(Typography)
653
+ <span
654
+ className="MuiTypography-root u-db u-ellipsis MuiListItemText-primary MuiTypography-body1 MuiTypography-displayBlock"
655
+ >
656
+ jon.snow@email.com
657
+ </span>
658
+ </ForwardRef(Typography)>
659
+ </WithStyles(ForwardRef(Typography))>
660
+ <WithStyles(ForwardRef(Typography))
631
661
  className="MuiListItemText-secondary"
632
662
  classes={
633
663
  Object {
634
- "alignCenter": "MuiTypography-alignCenter",
635
- "alignJustify": "MuiTypography-alignJustify",
636
- "alignLeft": "MuiTypography-alignLeft",
637
- "alignRight": "MuiTypography-alignRight",
638
- "body1": "MuiTypography-body1",
639
- "body2": "MuiTypography-body2",
640
- "button": "MuiTypography-button",
641
- "caption": "MuiTypography-caption",
642
- "colorError": "MuiTypography-colorError",
643
- "colorInherit": "MuiTypography-colorInherit",
644
- "colorPrimary": "MuiTypography-colorPrimary",
645
- "colorSecondary": "MuiTypography-colorSecondary",
646
- "colorTextPrimary": "MuiTypography-colorTextPrimary",
647
- "colorTextSecondary": "MuiTypography-colorTextSecondary",
648
- "displayBlock": "MuiTypography-displayBlock",
649
- "displayInline": "MuiTypography-displayInline",
650
- "gutterBottom": "MuiTypography-gutterBottom",
651
- "h1": "MuiTypography-h1",
652
- "h2": "MuiTypography-h2",
653
- "h3": "MuiTypography-h3",
654
- "h4": "MuiTypography-h4",
655
- "h5": "MuiTypography-h5",
656
- "h6": "MuiTypography-h6",
657
- "noWrap": "MuiTypography-noWrap",
658
- "overline": "MuiTypography-overline",
659
- "paragraph": "MuiTypography-paragraph",
660
- "root": "MuiTypography-root u-db u-ellipsis",
661
- "srOnly": "MuiTypography-srOnly",
662
- "subtitle1": "MuiTypography-subtitle1",
663
- "subtitle2": "MuiTypography-subtitle2",
664
+ "root": "u-db u-ellipsis",
664
665
  }
665
666
  }
666
667
  color="textSecondary"
667
668
  display="block"
668
669
  variant="caption"
669
670
  >
670
- <span
671
- className="MuiTypography-root u-db u-ellipsis MuiListItemText-secondary MuiTypography-caption MuiTypography-colorTextSecondary MuiTypography-displayBlock"
671
+ <ForwardRef(Typography)
672
+ className="MuiListItemText-secondary"
673
+ classes={
674
+ Object {
675
+ "alignCenter": "MuiTypography-alignCenter",
676
+ "alignJustify": "MuiTypography-alignJustify",
677
+ "alignLeft": "MuiTypography-alignLeft",
678
+ "alignRight": "MuiTypography-alignRight",
679
+ "body1": "MuiTypography-body1",
680
+ "body2": "MuiTypography-body2",
681
+ "button": "MuiTypography-button",
682
+ "caption": "MuiTypography-caption",
683
+ "colorError": "MuiTypography-colorError",
684
+ "colorInherit": "MuiTypography-colorInherit",
685
+ "colorPrimary": "MuiTypography-colorPrimary",
686
+ "colorSecondary": "MuiTypography-colorSecondary",
687
+ "colorTextPrimary": "MuiTypography-colorTextPrimary",
688
+ "colorTextSecondary": "MuiTypography-colorTextSecondary",
689
+ "displayBlock": "MuiTypography-displayBlock",
690
+ "displayInline": "MuiTypography-displayInline",
691
+ "gutterBottom": "MuiTypography-gutterBottom",
692
+ "h1": "MuiTypography-h1",
693
+ "h2": "MuiTypography-h2",
694
+ "h3": "MuiTypography-h3",
695
+ "h4": "MuiTypography-h4",
696
+ "h5": "MuiTypography-h5",
697
+ "h6": "MuiTypography-h6",
698
+ "noWrap": "MuiTypography-noWrap",
699
+ "overline": "MuiTypography-overline",
700
+ "paragraph": "MuiTypography-paragraph",
701
+ "root": "MuiTypography-root u-db u-ellipsis",
702
+ "srOnly": "MuiTypography-srOnly",
703
+ "subtitle1": "MuiTypography-subtitle1",
704
+ "subtitle2": "MuiTypography-subtitle2",
705
+ }
706
+ }
707
+ color="textSecondary"
708
+ display="block"
709
+ variant="caption"
672
710
  >
673
- -
674
- </span>
675
- </ForwardRef(Typography)>
676
- </WithStyles(ForwardRef(Typography))>
677
- </div>
678
- </ForwardRef(ListItemText)>
679
- </WithStyles(ForwardRef(ListItemText))>
680
- </ListItemText>
681
- <WithStyles(memo)
682
- center={false}
683
- >
684
- <ForwardRef(TouchRipple)
711
+ <span
712
+ className="MuiTypography-root u-db u-ellipsis MuiListItemText-secondary MuiTypography-caption MuiTypography-colorTextSecondary MuiTypography-displayBlock"
713
+ >
714
+ -
715
+ </span>
716
+ </ForwardRef(Typography)>
717
+ </WithStyles(ForwardRef(Typography))>
718
+ </div>
719
+ </ForwardRef(ListItemText)>
720
+ </WithStyles(ForwardRef(ListItemText))>
721
+ </ListItemText>
722
+ <WithStyles(memo)
685
723
  center={false}
686
- classes={
687
- Object {
688
- "child": "MuiTouchRipple-child",
689
- "childLeaving": "MuiTouchRipple-childLeaving",
690
- "childPulsate": "MuiTouchRipple-childPulsate",
691
- "ripple": "MuiTouchRipple-ripple",
692
- "ripplePulsate": "MuiTouchRipple-ripplePulsate",
693
- "rippleVisible": "MuiTouchRipple-rippleVisible",
694
- "root": "MuiTouchRipple-root",
695
- }
696
- }
697
724
  >
698
- <span
699
- className="MuiTouchRipple-root"
725
+ <ForwardRef(TouchRipple)
726
+ center={false}
727
+ classes={
728
+ Object {
729
+ "child": "MuiTouchRipple-child",
730
+ "childLeaving": "MuiTouchRipple-childLeaving",
731
+ "childPulsate": "MuiTouchRipple-childPulsate",
732
+ "ripple": "MuiTouchRipple-ripple",
733
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
734
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
735
+ "root": "MuiTouchRipple-root",
736
+ }
737
+ }
700
738
  >
701
- <TransitionGroup
702
- childFactory={[Function]}
703
- component={null}
704
- exit={true}
705
- />
706
- </span>
707
- </ForwardRef(TouchRipple)>
708
- </WithStyles(memo)>
709
- </div>
710
- </ForwardRef(ButtonBase)>
711
- </WithStyles(ForwardRef(ButtonBase))>
712
- </ForwardRef(ListItem)>
713
- </WithStyles(ForwardRef(ListItem))>
739
+ <span
740
+ className="MuiTouchRipple-root"
741
+ >
742
+ <TransitionGroup
743
+ childFactory={[Function]}
744
+ component={null}
745
+ exit={true}
746
+ />
747
+ </span>
748
+ </ForwardRef(TouchRipple)>
749
+ </WithStyles(memo)>
750
+ </div>
751
+ </ForwardRef(ButtonBase)>
752
+ </WithStyles(ForwardRef(ButtonBase))>
753
+ </ForwardRef(ListItem)>
754
+ </WithStyles(ForwardRef(ListItem))>
755
+ </ListItem>
714
756
  </ContactSuggestion>
715
757
  `;
716
758
 
@@ -799,143 +841,134 @@ exports[`ContactSuggestion component should display contact suggestion for a gro
799
841
  }
800
842
  t={[MockFunction]}
801
843
  >
802
- <WithStyles(ForwardRef(ListItem))
844
+ <ListItem
803
845
  button={true}
846
+ gutters="default"
847
+ size="medium"
804
848
  >
805
- <ForwardRef(ListItem)
849
+ <WithStyles(ForwardRef(ListItem))
806
850
  button={true}
851
+ className="medium"
807
852
  classes={
808
853
  Object {
809
- "alignItemsFlexStart": "MuiListItem-alignItemsFlexStart",
810
- "button": "MuiListItem-button",
811
- "container": "MuiListItem-container",
812
- "dense": "MuiListItem-dense",
813
- "disabled": "Mui-disabled",
814
- "divider": "MuiListItem-divider",
815
- "focusVisible": "Mui-focusVisible",
816
- "gutters": "MuiListItem-gutters",
817
- "root": "MuiListItem-root",
818
- "secondaryAction": "MuiListItem-secondaryAction",
819
- "selected": "Mui-selected",
854
+ "gutters": "makeStyles-gutters-1 makeStyles-gutters-7",
855
+ "secondaryAction": "makeStyles-secondaryAction-2 makeStyles-secondaryAction-8",
820
856
  }
821
857
  }
858
+ disableGutters={false}
859
+ size="medium"
822
860
  >
823
- <WithStyles(ForwardRef(ButtonBase))
824
- className="MuiListItem-root MuiListItem-gutters MuiListItem-button"
825
- component="div"
826
- disabled={false}
827
- focusVisibleClassName="Mui-focusVisible"
828
- >
829
- <ForwardRef(ButtonBase)
830
- className="MuiListItem-root MuiListItem-gutters MuiListItem-button"
831
- classes={
832
- Object {
833
- "disabled": "Mui-disabled",
834
- "focusVisible": "Mui-focusVisible",
835
- "root": "MuiButtonBase-root",
836
- }
861
+ <ForwardRef(ListItem)
862
+ button={true}
863
+ className="medium"
864
+ classes={
865
+ Object {
866
+ "alignItemsFlexStart": "MuiListItem-alignItemsFlexStart",
867
+ "button": "MuiListItem-button",
868
+ "container": "MuiListItem-container",
869
+ "dense": "MuiListItem-dense",
870
+ "disabled": "Mui-disabled",
871
+ "divider": "MuiListItem-divider",
872
+ "focusVisible": "Mui-focusVisible",
873
+ "gutters": "MuiListItem-gutters makeStyles-gutters-1 makeStyles-gutters-7",
874
+ "root": "MuiListItem-root",
875
+ "secondaryAction": "MuiListItem-secondaryAction makeStyles-secondaryAction-2 makeStyles-secondaryAction-8",
876
+ "selected": "Mui-selected",
837
877
  }
878
+ }
879
+ disableGutters={false}
880
+ size="medium"
881
+ >
882
+ <WithStyles(ForwardRef(ButtonBase))
883
+ className="MuiListItem-root medium MuiListItem-gutters makeStyles-gutters-1 makeStyles-gutters-7 MuiListItem-button"
838
884
  component="div"
839
885
  disabled={false}
840
886
  focusVisibleClassName="Mui-focusVisible"
887
+ size="medium"
841
888
  >
842
- <div
843
- aria-disabled={false}
844
- className="MuiButtonBase-root MuiListItem-root MuiListItem-gutters MuiListItem-button"
845
- onBlur={[Function]}
846
- onDragLeave={[Function]}
847
- onFocus={[Function]}
848
- onKeyDown={[Function]}
849
- onKeyUp={[Function]}
850
- onMouseDown={[Function]}
851
- onMouseLeave={[Function]}
852
- onMouseUp={[Function]}
853
- onTouchEnd={[Function]}
854
- onTouchMove={[Function]}
855
- onTouchStart={[Function]}
856
- role="button"
857
- tabIndex={0}
889
+ <ForwardRef(ButtonBase)
890
+ className="MuiListItem-root medium MuiListItem-gutters makeStyles-gutters-1 makeStyles-gutters-7 MuiListItem-button"
891
+ classes={
892
+ Object {
893
+ "disabled": "Mui-disabled",
894
+ "focusVisible": "Mui-focusVisible",
895
+ "root": "MuiButtonBase-root",
896
+ }
897
+ }
898
+ component="div"
899
+ disabled={false}
900
+ focusVisibleClassName="Mui-focusVisible"
901
+ size="medium"
858
902
  >
859
- <WithStyles(ForwardRef(ListItemIcon))
860
- key=".0"
903
+ <div
904
+ aria-disabled={false}
905
+ className="MuiButtonBase-root MuiListItem-root medium MuiListItem-gutters makeStyles-gutters-1 makeStyles-gutters-7 MuiListItem-button"
906
+ onBlur={[Function]}
907
+ onDragLeave={[Function]}
908
+ onFocus={[Function]}
909
+ onKeyDown={[Function]}
910
+ onKeyUp={[Function]}
911
+ onMouseDown={[Function]}
912
+ onMouseLeave={[Function]}
913
+ onMouseUp={[Function]}
914
+ onTouchEnd={[Function]}
915
+ onTouchMove={[Function]}
916
+ onTouchStart={[Function]}
917
+ role="button"
918
+ size="medium"
919
+ tabIndex={0}
861
920
  >
862
- <ForwardRef(ListItemIcon)
863
- classes={
864
- Object {
865
- "alignItemsFlexStart": "MuiListItemIcon-alignItemsFlexStart",
866
- "root": "MuiListItemIcon-root",
867
- }
868
- }
921
+ <ListItemIcon
922
+ key=".$.$.0"
869
923
  >
870
- <div
871
- className="MuiListItemIcon-root"
924
+ <ForwardRef(ListItemIcon)
925
+ classes={
926
+ Object {
927
+ "alignItemsFlexStart": "MuiListItemIcon-alignItemsFlexStart",
928
+ "root": "MuiListItemIcon-root",
929
+ }
930
+ }
872
931
  >
873
- <Avatar
874
- className=""
875
- disabled={false}
876
- ghost={false}
877
- icon={[Function]}
878
- image=""
879
- size="small"
880
- style={Object {}}
881
- text="G"
932
+ <div
933
+ className="MuiListItemIcon-root"
882
934
  >
883
- <div
884
- className="styles__c-avatar___PpDI- styles__c-avatar--text___2dvna"
885
- data-testid="Avatar"
886
- style={
887
- Object {
888
- "--circleSize": "32px",
889
- "backgroundColor": "#7F6BEE",
890
- }
891
- }
935
+ <Avatar
936
+ className=""
937
+ disabled={false}
938
+ ghost={false}
939
+ icon={[Function]}
940
+ image=""
941
+ size="small"
942
+ style={Object {}}
943
+ text="G"
892
944
  >
893
- <span
894
- className="styles__c-avatar-initials___310qC"
945
+ <div
946
+ className="styles__c-avatar___PpDI- styles__c-avatar--text___2dvna"
947
+ data-testid="Avatar"
948
+ style={
949
+ Object {
950
+ "--circleSize": "32px",
951
+ "backgroundColor": "#7F6BEE",
952
+ }
953
+ }
895
954
  >
896
- G
897
- </span>
898
- </div>
899
- </Avatar>
900
- </div>
901
- </ForwardRef(ListItemIcon)>
902
- </WithStyles(ForwardRef(ListItemIcon))>
903
- <ListItemText
904
- ellipsis={true}
905
- key=".1"
906
- primary="The Night's Watch"
907
- secondary="2 members"
908
- >
909
- <WithStyles(ForwardRef(ListItemText))
955
+ <span
956
+ className="styles__c-avatar-initials___310qC"
957
+ >
958
+ G
959
+ </span>
960
+ </div>
961
+ </Avatar>
962
+ </div>
963
+ </ForwardRef(ListItemIcon)>
964
+ </ListItemIcon>
965
+ <ListItemText
966
+ ellipsis={true}
967
+ key=".$.$.1"
910
968
  primary="The Night's Watch"
911
- primaryTypographyProps={
912
- Object {
913
- "classes": Object {
914
- "root": "u-db u-ellipsis",
915
- },
916
- }
917
- }
918
969
  secondary="2 members"
919
- secondaryTypographyProps={
920
- Object {
921
- "classes": Object {
922
- "root": "u-db u-ellipsis",
923
- },
924
- "variant": "caption",
925
- }
926
- }
927
970
  >
928
- <ForwardRef(ListItemText)
929
- classes={
930
- Object {
931
- "dense": "MuiListItemText-dense",
932
- "inset": "MuiListItemText-inset",
933
- "multiline": "MuiListItemText-multiline",
934
- "primary": "MuiListItemText-primary",
935
- "root": "MuiListItemText-root",
936
- "secondary": "MuiListItemText-secondary",
937
- }
938
- }
971
+ <WithStyles(ForwardRef(ListItemText))
939
972
  primary="The Night's Watch"
940
973
  primaryTypographyProps={
941
974
  Object {
@@ -954,161 +987,191 @@ exports[`ContactSuggestion component should display contact suggestion for a gro
954
987
  }
955
988
  }
956
989
  >
957
- <div
958
- className="MuiListItemText-root MuiListItemText-multiline"
959
- >
960
- <WithStyles(ForwardRef(Typography))
961
- className="MuiListItemText-primary"
962
- classes={
963
- Object {
990
+ <ForwardRef(ListItemText)
991
+ classes={
992
+ Object {
993
+ "dense": "MuiListItemText-dense",
994
+ "inset": "MuiListItemText-inset",
995
+ "multiline": "MuiListItemText-multiline",
996
+ "primary": "MuiListItemText-primary",
997
+ "root": "MuiListItemText-root",
998
+ "secondary": "MuiListItemText-secondary",
999
+ }
1000
+ }
1001
+ primary="The Night's Watch"
1002
+ primaryTypographyProps={
1003
+ Object {
1004
+ "classes": Object {
964
1005
  "root": "u-db u-ellipsis",
965
- }
1006
+ },
1007
+ }
1008
+ }
1009
+ secondary="2 members"
1010
+ secondaryTypographyProps={
1011
+ Object {
1012
+ "classes": Object {
1013
+ "root": "u-db u-ellipsis",
1014
+ },
1015
+ "variant": "caption",
966
1016
  }
967
- component="span"
968
- display="block"
969
- variant="body1"
1017
+ }
1018
+ >
1019
+ <div
1020
+ className="MuiListItemText-root MuiListItemText-multiline"
970
1021
  >
971
- <ForwardRef(Typography)
1022
+ <WithStyles(ForwardRef(Typography))
972
1023
  className="MuiListItemText-primary"
973
1024
  classes={
974
1025
  Object {
975
- "alignCenter": "MuiTypography-alignCenter",
976
- "alignJustify": "MuiTypography-alignJustify",
977
- "alignLeft": "MuiTypography-alignLeft",
978
- "alignRight": "MuiTypography-alignRight",
979
- "body1": "MuiTypography-body1",
980
- "body2": "MuiTypography-body2",
981
- "button": "MuiTypography-button",
982
- "caption": "MuiTypography-caption",
983
- "colorError": "MuiTypography-colorError",
984
- "colorInherit": "MuiTypography-colorInherit",
985
- "colorPrimary": "MuiTypography-colorPrimary",
986
- "colorSecondary": "MuiTypography-colorSecondary",
987
- "colorTextPrimary": "MuiTypography-colorTextPrimary",
988
- "colorTextSecondary": "MuiTypography-colorTextSecondary",
989
- "displayBlock": "MuiTypography-displayBlock",
990
- "displayInline": "MuiTypography-displayInline",
991
- "gutterBottom": "MuiTypography-gutterBottom",
992
- "h1": "MuiTypography-h1",
993
- "h2": "MuiTypography-h2",
994
- "h3": "MuiTypography-h3",
995
- "h4": "MuiTypography-h4",
996
- "h5": "MuiTypography-h5",
997
- "h6": "MuiTypography-h6",
998
- "noWrap": "MuiTypography-noWrap",
999
- "overline": "MuiTypography-overline",
1000
- "paragraph": "MuiTypography-paragraph",
1001
- "root": "MuiTypography-root u-db u-ellipsis",
1002
- "srOnly": "MuiTypography-srOnly",
1003
- "subtitle1": "MuiTypography-subtitle1",
1004
- "subtitle2": "MuiTypography-subtitle2",
1026
+ "root": "u-db u-ellipsis",
1005
1027
  }
1006
1028
  }
1007
1029
  component="span"
1008
1030
  display="block"
1009
1031
  variant="body1"
1010
1032
  >
1011
- <span
1012
- className="MuiTypography-root u-db u-ellipsis MuiListItemText-primary MuiTypography-body1 MuiTypography-displayBlock"
1033
+ <ForwardRef(Typography)
1034
+ className="MuiListItemText-primary"
1035
+ classes={
1036
+ Object {
1037
+ "alignCenter": "MuiTypography-alignCenter",
1038
+ "alignJustify": "MuiTypography-alignJustify",
1039
+ "alignLeft": "MuiTypography-alignLeft",
1040
+ "alignRight": "MuiTypography-alignRight",
1041
+ "body1": "MuiTypography-body1",
1042
+ "body2": "MuiTypography-body2",
1043
+ "button": "MuiTypography-button",
1044
+ "caption": "MuiTypography-caption",
1045
+ "colorError": "MuiTypography-colorError",
1046
+ "colorInherit": "MuiTypography-colorInherit",
1047
+ "colorPrimary": "MuiTypography-colorPrimary",
1048
+ "colorSecondary": "MuiTypography-colorSecondary",
1049
+ "colorTextPrimary": "MuiTypography-colorTextPrimary",
1050
+ "colorTextSecondary": "MuiTypography-colorTextSecondary",
1051
+ "displayBlock": "MuiTypography-displayBlock",
1052
+ "displayInline": "MuiTypography-displayInline",
1053
+ "gutterBottom": "MuiTypography-gutterBottom",
1054
+ "h1": "MuiTypography-h1",
1055
+ "h2": "MuiTypography-h2",
1056
+ "h3": "MuiTypography-h3",
1057
+ "h4": "MuiTypography-h4",
1058
+ "h5": "MuiTypography-h5",
1059
+ "h6": "MuiTypography-h6",
1060
+ "noWrap": "MuiTypography-noWrap",
1061
+ "overline": "MuiTypography-overline",
1062
+ "paragraph": "MuiTypography-paragraph",
1063
+ "root": "MuiTypography-root u-db u-ellipsis",
1064
+ "srOnly": "MuiTypography-srOnly",
1065
+ "subtitle1": "MuiTypography-subtitle1",
1066
+ "subtitle2": "MuiTypography-subtitle2",
1067
+ }
1068
+ }
1069
+ component="span"
1070
+ display="block"
1071
+ variant="body1"
1013
1072
  >
1014
- The Night's Watch
1015
- </span>
1016
- </ForwardRef(Typography)>
1017
- </WithStyles(ForwardRef(Typography))>
1018
- <WithStyles(ForwardRef(Typography))
1019
- className="MuiListItemText-secondary"
1020
- classes={
1021
- Object {
1022
- "root": "u-db u-ellipsis",
1023
- }
1024
- }
1025
- color="textSecondary"
1026
- display="block"
1027
- variant="caption"
1028
- >
1029
- <ForwardRef(Typography)
1073
+ <span
1074
+ className="MuiTypography-root u-db u-ellipsis MuiListItemText-primary MuiTypography-body1 MuiTypography-displayBlock"
1075
+ >
1076
+ The Night's Watch
1077
+ </span>
1078
+ </ForwardRef(Typography)>
1079
+ </WithStyles(ForwardRef(Typography))>
1080
+ <WithStyles(ForwardRef(Typography))
1030
1081
  className="MuiListItemText-secondary"
1031
1082
  classes={
1032
1083
  Object {
1033
- "alignCenter": "MuiTypography-alignCenter",
1034
- "alignJustify": "MuiTypography-alignJustify",
1035
- "alignLeft": "MuiTypography-alignLeft",
1036
- "alignRight": "MuiTypography-alignRight",
1037
- "body1": "MuiTypography-body1",
1038
- "body2": "MuiTypography-body2",
1039
- "button": "MuiTypography-button",
1040
- "caption": "MuiTypography-caption",
1041
- "colorError": "MuiTypography-colorError",
1042
- "colorInherit": "MuiTypography-colorInherit",
1043
- "colorPrimary": "MuiTypography-colorPrimary",
1044
- "colorSecondary": "MuiTypography-colorSecondary",
1045
- "colorTextPrimary": "MuiTypography-colorTextPrimary",
1046
- "colorTextSecondary": "MuiTypography-colorTextSecondary",
1047
- "displayBlock": "MuiTypography-displayBlock",
1048
- "displayInline": "MuiTypography-displayInline",
1049
- "gutterBottom": "MuiTypography-gutterBottom",
1050
- "h1": "MuiTypography-h1",
1051
- "h2": "MuiTypography-h2",
1052
- "h3": "MuiTypography-h3",
1053
- "h4": "MuiTypography-h4",
1054
- "h5": "MuiTypography-h5",
1055
- "h6": "MuiTypography-h6",
1056
- "noWrap": "MuiTypography-noWrap",
1057
- "overline": "MuiTypography-overline",
1058
- "paragraph": "MuiTypography-paragraph",
1059
- "root": "MuiTypography-root u-db u-ellipsis",
1060
- "srOnly": "MuiTypography-srOnly",
1061
- "subtitle1": "MuiTypography-subtitle1",
1062
- "subtitle2": "MuiTypography-subtitle2",
1084
+ "root": "u-db u-ellipsis",
1063
1085
  }
1064
1086
  }
1065
1087
  color="textSecondary"
1066
1088
  display="block"
1067
1089
  variant="caption"
1068
1090
  >
1069
- <span
1070
- className="MuiTypography-root u-db u-ellipsis MuiListItemText-secondary MuiTypography-caption MuiTypography-colorTextSecondary MuiTypography-displayBlock"
1091
+ <ForwardRef(Typography)
1092
+ className="MuiListItemText-secondary"
1093
+ classes={
1094
+ Object {
1095
+ "alignCenter": "MuiTypography-alignCenter",
1096
+ "alignJustify": "MuiTypography-alignJustify",
1097
+ "alignLeft": "MuiTypography-alignLeft",
1098
+ "alignRight": "MuiTypography-alignRight",
1099
+ "body1": "MuiTypography-body1",
1100
+ "body2": "MuiTypography-body2",
1101
+ "button": "MuiTypography-button",
1102
+ "caption": "MuiTypography-caption",
1103
+ "colorError": "MuiTypography-colorError",
1104
+ "colorInherit": "MuiTypography-colorInherit",
1105
+ "colorPrimary": "MuiTypography-colorPrimary",
1106
+ "colorSecondary": "MuiTypography-colorSecondary",
1107
+ "colorTextPrimary": "MuiTypography-colorTextPrimary",
1108
+ "colorTextSecondary": "MuiTypography-colorTextSecondary",
1109
+ "displayBlock": "MuiTypography-displayBlock",
1110
+ "displayInline": "MuiTypography-displayInline",
1111
+ "gutterBottom": "MuiTypography-gutterBottom",
1112
+ "h1": "MuiTypography-h1",
1113
+ "h2": "MuiTypography-h2",
1114
+ "h3": "MuiTypography-h3",
1115
+ "h4": "MuiTypography-h4",
1116
+ "h5": "MuiTypography-h5",
1117
+ "h6": "MuiTypography-h6",
1118
+ "noWrap": "MuiTypography-noWrap",
1119
+ "overline": "MuiTypography-overline",
1120
+ "paragraph": "MuiTypography-paragraph",
1121
+ "root": "MuiTypography-root u-db u-ellipsis",
1122
+ "srOnly": "MuiTypography-srOnly",
1123
+ "subtitle1": "MuiTypography-subtitle1",
1124
+ "subtitle2": "MuiTypography-subtitle2",
1125
+ }
1126
+ }
1127
+ color="textSecondary"
1128
+ display="block"
1129
+ variant="caption"
1071
1130
  >
1072
- 2 members
1073
- </span>
1074
- </ForwardRef(Typography)>
1075
- </WithStyles(ForwardRef(Typography))>
1076
- </div>
1077
- </ForwardRef(ListItemText)>
1078
- </WithStyles(ForwardRef(ListItemText))>
1079
- </ListItemText>
1080
- <WithStyles(memo)
1081
- center={false}
1082
- >
1083
- <ForwardRef(TouchRipple)
1131
+ <span
1132
+ className="MuiTypography-root u-db u-ellipsis MuiListItemText-secondary MuiTypography-caption MuiTypography-colorTextSecondary MuiTypography-displayBlock"
1133
+ >
1134
+ 2 members
1135
+ </span>
1136
+ </ForwardRef(Typography)>
1137
+ </WithStyles(ForwardRef(Typography))>
1138
+ </div>
1139
+ </ForwardRef(ListItemText)>
1140
+ </WithStyles(ForwardRef(ListItemText))>
1141
+ </ListItemText>
1142
+ <WithStyles(memo)
1084
1143
  center={false}
1085
- classes={
1086
- Object {
1087
- "child": "MuiTouchRipple-child",
1088
- "childLeaving": "MuiTouchRipple-childLeaving",
1089
- "childPulsate": "MuiTouchRipple-childPulsate",
1090
- "ripple": "MuiTouchRipple-ripple",
1091
- "ripplePulsate": "MuiTouchRipple-ripplePulsate",
1092
- "rippleVisible": "MuiTouchRipple-rippleVisible",
1093
- "root": "MuiTouchRipple-root",
1094
- }
1095
- }
1096
1144
  >
1097
- <span
1098
- className="MuiTouchRipple-root"
1145
+ <ForwardRef(TouchRipple)
1146
+ center={false}
1147
+ classes={
1148
+ Object {
1149
+ "child": "MuiTouchRipple-child",
1150
+ "childLeaving": "MuiTouchRipple-childLeaving",
1151
+ "childPulsate": "MuiTouchRipple-childPulsate",
1152
+ "ripple": "MuiTouchRipple-ripple",
1153
+ "ripplePulsate": "MuiTouchRipple-ripplePulsate",
1154
+ "rippleVisible": "MuiTouchRipple-rippleVisible",
1155
+ "root": "MuiTouchRipple-root",
1156
+ }
1157
+ }
1099
1158
  >
1100
- <TransitionGroup
1101
- childFactory={[Function]}
1102
- component={null}
1103
- exit={true}
1104
- />
1105
- </span>
1106
- </ForwardRef(TouchRipple)>
1107
- </WithStyles(memo)>
1108
- </div>
1109
- </ForwardRef(ButtonBase)>
1110
- </WithStyles(ForwardRef(ButtonBase))>
1111
- </ForwardRef(ListItem)>
1112
- </WithStyles(ForwardRef(ListItem))>
1159
+ <span
1160
+ className="MuiTouchRipple-root"
1161
+ >
1162
+ <TransitionGroup
1163
+ childFactory={[Function]}
1164
+ component={null}
1165
+ exit={true}
1166
+ />
1167
+ </span>
1168
+ </ForwardRef(TouchRipple)>
1169
+ </WithStyles(memo)>
1170
+ </div>
1171
+ </ForwardRef(ButtonBase)>
1172
+ </WithStyles(ForwardRef(ButtonBase))>
1173
+ </ForwardRef(ListItem)>
1174
+ </WithStyles(ForwardRef(ListItem))>
1175
+ </ListItem>
1113
1176
  </ContactSuggestion>
1114
1177
  `;