@zohodesk/components 1.4.16 → 1.4.18

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 (78) hide show
  1. package/README.md +35 -2
  2. package/es/Card/__tests__/Card.spec.js +48 -0
  3. package/es/Card/__tests__/CardContent.spec.js +61 -0
  4. package/es/Card/__tests__/CardHeader.spec.js +33 -0
  5. package/es/Card/__tests__/__snapshots__/Card.spec.js.snap +125 -0
  6. package/es/Card/__tests__/__snapshots__/CardContent.spec.js.snap +177 -0
  7. package/es/Card/__tests__/__snapshots__/CardHeader.spec.js.snap +51 -0
  8. package/es/ListItem/ListItem.js +10 -3
  9. package/es/ListItem/ListItemWithAvatar.js +15 -6
  10. package/es/ListItem/ListItemWithCheckBox.js +13 -6
  11. package/es/ListItem/ListItemWithIcon.js +14 -5
  12. package/es/ListItem/ListItemWithRadio.js +13 -6
  13. package/es/ListItem/__tests__/ListItem.spec.js +19 -0
  14. package/es/ListItem/__tests__/ListItemWithAvatar.spec.js +19 -0
  15. package/es/ListItem/__tests__/ListItemWithCheckBox.spec.js +19 -0
  16. package/es/ListItem/__tests__/ListItemWithIcon.spec.js +17 -0
  17. package/es/ListItem/__tests__/ListItemWithRadio.spec.js +19 -0
  18. package/es/ListItem/__tests__/__snapshots__/ListItem.spec.js.snap +78 -0
  19. package/es/ListItem/__tests__/__snapshots__/ListItemWithAvatar.spec.js.snap +140 -46
  20. package/es/ListItem/__tests__/__snapshots__/ListItemWithCheckBox.spec.js.snap +251 -49
  21. package/es/ListItem/__tests__/__snapshots__/ListItemWithIcon.spec.js.snap +144 -50
  22. package/es/ListItem/__tests__/__snapshots__/ListItemWithRadio.spec.js.snap +252 -52
  23. package/es/ListItem/props/propTypes.js +15 -5
  24. package/es/MultiSelect/MultiSelect.js +55 -23
  25. package/es/MultiSelect/Suggestions.js +2 -1
  26. package/es/MultiSelect/__tests__/__snapshots__/MultiSelectHeader.spec.js.snap +6 -6
  27. package/es/MultiSelect/props/propTypes.js +2 -3
  28. package/es/Select/GroupSelect.js +4 -2
  29. package/es/Select/Select.js +50 -22
  30. package/es/Select/SelectWithAvatar.js +17 -4
  31. package/es/Select/SelectWithIcon.js +15 -5
  32. package/es/Select/props/defaultProps.js +3 -0
  33. package/es/Select/props/propTypes.js +6 -0
  34. package/es/Typography/__tests__/Typography.spec.js +225 -0
  35. package/es/Typography/__tests__/__snapshots__/Typography.spec.js.snap +1226 -0
  36. package/es/utils/dropDownUtils.js +13 -4
  37. package/es/v1/Switch/__tests__/Switch.spec.js +41 -6
  38. package/es/v1/Switch/__tests__/__snapshots__/Switch.spec.js.snap +176 -5
  39. package/es/v1/Switch/css/Switch_v1.module.css +7 -1
  40. package/lib/Card/__tests__/Card.spec.js +54 -6
  41. package/lib/Card/__tests__/CardContent.spec.js +68 -0
  42. package/lib/Card/__tests__/CardHeader.spec.js +40 -0
  43. package/lib/Card/__tests__/__snapshots__/Card.spec.js.snap +125 -0
  44. package/lib/Card/__tests__/__snapshots__/CardContent.spec.js.snap +177 -0
  45. package/lib/Card/__tests__/__snapshots__/CardHeader.spec.js.snap +51 -0
  46. package/lib/ListItem/ListItem.js +10 -3
  47. package/lib/ListItem/ListItemWithAvatar.js +15 -6
  48. package/lib/ListItem/ListItemWithCheckBox.js +15 -6
  49. package/lib/ListItem/ListItemWithIcon.js +13 -5
  50. package/lib/ListItem/ListItemWithRadio.js +15 -6
  51. package/lib/ListItem/__tests__/ListItem.spec.js +23 -0
  52. package/lib/ListItem/__tests__/ListItemWithAvatar.spec.js +23 -0
  53. package/lib/ListItem/__tests__/ListItemWithCheckBox.spec.js +23 -0
  54. package/lib/ListItem/__tests__/ListItemWithIcon.spec.js +21 -0
  55. package/lib/ListItem/__tests__/ListItemWithRadio.spec.js +23 -0
  56. package/lib/ListItem/__tests__/__snapshots__/ListItem.spec.js.snap +78 -0
  57. package/lib/ListItem/__tests__/__snapshots__/ListItemWithAvatar.spec.js.snap +140 -46
  58. package/lib/ListItem/__tests__/__snapshots__/ListItemWithCheckBox.spec.js.snap +251 -49
  59. package/lib/ListItem/__tests__/__snapshots__/ListItemWithIcon.spec.js.snap +144 -50
  60. package/lib/ListItem/__tests__/__snapshots__/ListItemWithRadio.spec.js.snap +252 -52
  61. package/lib/ListItem/props/propTypes.js +15 -6
  62. package/lib/MultiSelect/MultiSelect.js +50 -24
  63. package/lib/MultiSelect/Suggestions.js +2 -1
  64. package/lib/MultiSelect/__tests__/__snapshots__/MultiSelectHeader.spec.js.snap +6 -6
  65. package/lib/MultiSelect/props/propTypes.js +3 -4
  66. package/lib/Select/GroupSelect.js +4 -3
  67. package/lib/Select/Select.js +45 -20
  68. package/lib/Select/SelectWithAvatar.js +17 -7
  69. package/lib/Select/SelectWithIcon.js +15 -5
  70. package/lib/Select/props/defaultProps.js +3 -1
  71. package/lib/Select/props/propTypes.js +6 -0
  72. package/lib/Typography/__tests__/Typography.spec.js +232 -0
  73. package/lib/Typography/__tests__/__snapshots__/Typography.spec.js.snap +1226 -0
  74. package/lib/utils/dropDownUtils.js +17 -4
  75. package/lib/v1/Switch/__tests__/Switch.spec.js +41 -6
  76. package/lib/v1/Switch/__tests__/__snapshots__/Switch.spec.js.snap +176 -5
  77. package/lib/v1/Switch/css/Switch_v1.module.css +7 -1
  78. package/package.json +5 -5
package/es/ListItem/__tests__/__snapshots__/ListItemWithRadio.spec.js.snap CHANGED
@@ -1,6 +1,6 @@
1
1
  // Jest Snapshot v1, https://goo.gl/fbAQLP
2
2
 
3
- exports[`ListItemWithRadio ListItemWithRadio with secondaryValue text and LHS align center 1`] = `
3
+ exports[`ListItemWithRadio ListItemWithRadio with renderValueRightPlaceholderNode & it's custom class 1`] = `
4
4
  <DocumentFragment>
5
5
  <li
6
6
  class="list medium default withBorder flex rowdir vCenter"
@@ -12,13 +12,13 @@ exports[`ListItemWithRadio ListItemWithRadio with secondaryValue text and LHS a
12
12
  tabindex="0"
13
13
  >
14
14
  <div
15
- class="iconBox lhsBox lhsJustifyContent_center shrinkOff selfCenter"
15
+ class="iconBox lhsBox lhsJustifyContent_center shrinkOff selfStart"
16
16
  data-id="listItemWithRadioComp_radio"
17
17
  data-selector-id="box"
18
18
  data-test-id="listItemWithRadioComp_radio"
19
19
  >
20
20
  <div
21
- class="shrinkOff selfCenter"
21
+ class="lhsBox_medium shrinkOff selfStart"
22
22
  data-id="boxComponent"
23
23
  data-selector-id="box"
24
24
  data-test-id="boxComponent"
@@ -65,19 +65,19 @@ exports[`ListItemWithRadio ListItemWithRadio with secondaryValue text and LHS a
65
65
  </div>
66
66
  </div>
67
67
  <div
68
- class="grow basis shrinkOn"
68
+ class="leftBox grow basis shrinkOff"
69
69
  data-id="boxComponent"
70
70
  data-selector-id="box"
71
71
  data-test-id="boxComponent"
72
72
  >
73
73
  <div
74
- class="flex cover coldir"
75
- data-id="containerComponent"
76
- data-selector-id="container"
77
- data-test-id="containerComponent"
74
+ class="titleBox shrinkOff"
75
+ data-id="boxComponent"
76
+ data-selector-id="box"
77
+ data-test-id="boxComponent"
78
78
  >
79
79
  <div
80
- class="value shrinkOff"
80
+ class="value basisAuto shrinkOn"
81
81
  data-id="boxComponent"
82
82
  data-selector-id="box"
83
83
  data-test-id="boxComponent"
@@ -85,13 +85,14 @@ exports[`ListItemWithRadio ListItemWithRadio with secondaryValue text and LHS a
85
85
  List
86
86
  </div>
87
87
  <div
88
- class="secondaryField secondaryValue shrinkOff"
88
+ class="customValueRightPlaceholderClass shrinkOff"
89
89
  data-id="boxComponent"
90
90
  data-selector-id="box"
91
91
  data-test-id="boxComponent"
92
- data-title="secondaryValue"
93
92
  >
94
- secondaryValue
93
+ <div>
94
+ Custom Placeholder
95
+ </div>
95
96
  </div>
96
97
  </div>
97
98
  </div>
@@ -99,7 +100,7 @@ exports[`ListItemWithRadio ListItemWithRadio with secondaryValue text and LHS a
99
100
  </DocumentFragment>
100
101
  `;
101
102
 
102
- exports[`ListItemWithRadio ListItemWithRadio with secondaryValue text and LHS align end 1`] = `
103
+ exports[`ListItemWithRadio ListItemWithRadio with renderValueRightPlaceholderNode 1`] = `
103
104
  <DocumentFragment>
104
105
  <li
105
106
  class="list medium default withBorder flex rowdir vCenter"
@@ -111,13 +112,13 @@ exports[`ListItemWithRadio ListItemWithRadio with secondaryValue text and LHS a
111
112
  tabindex="0"
112
113
  >
113
114
  <div
114
- class="iconBox lhsBox lhsJustifyContent_center shrinkOff selfEnd"
115
+ class="iconBox lhsBox lhsJustifyContent_center shrinkOff selfStart"
115
116
  data-id="listItemWithRadioComp_radio"
116
117
  data-selector-id="box"
117
118
  data-test-id="listItemWithRadioComp_radio"
118
119
  >
119
120
  <div
120
- class="lhsBox_medium shrinkOff selfEnd"
121
+ class="lhsBox_medium shrinkOff selfStart"
121
122
  data-id="boxComponent"
122
123
  data-selector-id="box"
123
124
  data-test-id="boxComponent"
@@ -164,19 +165,19 @@ exports[`ListItemWithRadio ListItemWithRadio with secondaryValue text and LHS a
164
165
  </div>
165
166
  </div>
166
167
  <div
167
- class="grow basis shrinkOn"
168
+ class="leftBox grow basis shrinkOff"
168
169
  data-id="boxComponent"
169
170
  data-selector-id="box"
170
171
  data-test-id="boxComponent"
171
172
  >
172
173
  <div
173
- class="flex cover coldir"
174
- data-id="containerComponent"
175
- data-selector-id="container"
176
- data-test-id="containerComponent"
174
+ class="titleBox shrinkOff"
175
+ data-id="boxComponent"
176
+ data-selector-id="box"
177
+ data-test-id="boxComponent"
177
178
  >
178
179
  <div
179
- class="value shrinkOff"
180
+ class="value basisAuto shrinkOn"
180
181
  data-id="boxComponent"
181
182
  data-selector-id="box"
182
183
  data-test-id="boxComponent"
@@ -184,13 +185,14 @@ exports[`ListItemWithRadio ListItemWithRadio with secondaryValue text and LHS a
184
185
  List
185
186
  </div>
186
187
  <div
187
- class="secondaryField secondaryValue shrinkOff"
188
+ class="shrinkOff"
188
189
  data-id="boxComponent"
189
190
  data-selector-id="box"
190
191
  data-test-id="boxComponent"
191
- data-title="secondaryValue"
192
192
  >
193
- secondaryValue
193
+ <div>
194
+ Custom Placeholder
195
+ </div>
194
196
  </div>
195
197
  </div>
196
198
  </div>
@@ -198,7 +200,7 @@ exports[`ListItemWithRadio ListItemWithRadio with secondaryValue text and LHS a
198
200
  </DocumentFragment>
199
201
  `;
200
202
 
201
- exports[`ListItemWithRadio ListItemWithRadio with secondaryValue 1`] = `
203
+ exports[`ListItemWithRadio ListItemWithRadio with secondaryValue text and LHS align center 1`] = `
202
204
  <DocumentFragment>
203
205
  <li
204
206
  class="list medium default withBorder flex rowdir vCenter"
@@ -210,13 +212,13 @@ exports[`ListItemWithRadio ListItemWithRadio with secondaryValue 1`] = `
210
212
  tabindex="0"
211
213
  >
212
214
  <div
213
- class="iconBox lhsBox lhsJustifyContent_center shrinkOff selfStart"
215
+ class="iconBox lhsBox lhsJustifyContent_center shrinkOff selfCenter"
214
216
  data-id="listItemWithRadioComp_radio"
215
217
  data-selector-id="box"
216
218
  data-test-id="listItemWithRadioComp_radio"
217
219
  >
218
220
  <div
219
- class="lhsBox_medium shrinkOff selfStart"
221
+ class="shrinkOff selfCenter"
220
222
  data-id="boxComponent"
221
223
  data-selector-id="box"
222
224
  data-test-id="boxComponent"
@@ -263,41 +265,140 @@ exports[`ListItemWithRadio ListItemWithRadio with secondaryValue 1`] = `
263
265
  </div>
264
266
  </div>
265
267
  <div
266
- class="grow basis shrinkOn"
268
+ class="leftBox grow basis shrinkOff"
267
269
  data-id="boxComponent"
268
270
  data-selector-id="box"
269
271
  data-test-id="boxComponent"
270
272
  >
271
273
  <div
272
- class="flex cover coldir"
273
- data-id="containerComponent"
274
- data-selector-id="container"
275
- data-test-id="containerComponent"
274
+ class="titleBox shrinkOff"
275
+ data-id="boxComponent"
276
+ data-selector-id="box"
277
+ data-test-id="boxComponent"
276
278
  >
277
279
  <div
278
- class="value shrinkOff"
280
+ class="value basisAuto shrinkOn"
279
281
  data-id="boxComponent"
280
282
  data-selector-id="box"
281
283
  data-test-id="boxComponent"
282
284
  >
283
285
  List
284
286
  </div>
287
+ </div>
288
+ <div
289
+ class="secondaryField secondaryValue shrinkOff"
290
+ data-id="boxComponent"
291
+ data-selector-id="box"
292
+ data-test-id="boxComponent"
293
+ data-title="secondaryValue"
294
+ >
295
+ secondaryValue
296
+ </div>
297
+ </div>
298
+ </li>
299
+ </DocumentFragment>
300
+ `;
301
+
302
+ exports[`ListItemWithRadio ListItemWithRadio with secondaryValue text and LHS align end 1`] = `
303
+ <DocumentFragment>
304
+ <li
305
+ class="list medium default withBorder flex rowdir vCenter"
306
+ data-a11y-inset-focus="true"
307
+ data-id="listItemWithRadioComp"
308
+ data-selector-id="listItemWithRadio"
309
+ data-test-id="listItemWithRadioComp"
310
+ role="option"
311
+ tabindex="0"
312
+ >
313
+ <div
314
+ class="iconBox lhsBox lhsJustifyContent_center shrinkOff selfEnd"
315
+ data-id="listItemWithRadioComp_radio"
316
+ data-selector-id="box"
317
+ data-test-id="listItemWithRadioComp_radio"
318
+ >
319
+ <div
320
+ class="lhsBox_medium shrinkOff selfEnd"
321
+ data-id="boxComponent"
322
+ data-selector-id="box"
323
+ data-test-id="boxComponent"
324
+ >
285
325
  <div
286
- class="secondaryField secondaryValue shrinkOff"
326
+ aria-checked="false"
327
+ aria-hidden="true"
328
+ aria-readonly="false"
329
+ class="container pointer hoverEfffect inflex rowdir both"
330
+ data-id="RadioComp"
331
+ data-selector-id="container"
332
+ data-test-id="RadioComp"
333
+ role="radio"
334
+ tabindex="-1"
335
+ >
336
+ <div
337
+ class="radio
338
+ hoverprimary medium filled centerPathprimary shrinkOff"
339
+ data-id="boxComponent"
340
+ data-selector-id="box"
341
+ data-test-id="boxComponent"
342
+ >
343
+ <input
344
+ type="hidden"
345
+ value=""
346
+ />
347
+ <label
348
+ class="radioLabel pointer"
349
+ >
350
+ <svg
351
+ viewBox="0 0 40 40"
352
+ xmlns="http://www.w3.org/2000/svg"
353
+ >
354
+ <circle
355
+ class="rdBox"
356
+ cx="20"
357
+ cy="20"
358
+ r="19"
359
+ />
360
+ </svg>
361
+ </label>
362
+ </div>
363
+ </div>
364
+ </div>
365
+ </div>
366
+ <div
367
+ class="leftBox grow basis shrinkOff"
368
+ data-id="boxComponent"
369
+ data-selector-id="box"
370
+ data-test-id="boxComponent"
371
+ >
372
+ <div
373
+ class="titleBox shrinkOff"
374
+ data-id="boxComponent"
375
+ data-selector-id="box"
376
+ data-test-id="boxComponent"
377
+ >
378
+ <div
379
+ class="value basisAuto shrinkOn"
287
380
  data-id="boxComponent"
288
381
  data-selector-id="box"
289
382
  data-test-id="boxComponent"
290
- data-title="secondaryValue"
291
383
  >
292
- secondaryValue
384
+ List
293
385
  </div>
294
386
  </div>
387
+ <div
388
+ class="secondaryField secondaryValue shrinkOff"
389
+ data-id="boxComponent"
390
+ data-selector-id="box"
391
+ data-test-id="boxComponent"
392
+ data-title="secondaryValue"
393
+ >
394
+ secondaryValue
395
+ </div>
295
396
  </div>
296
397
  </li>
297
398
  </DocumentFragment>
298
399
  `;
299
400
 
300
- exports[`ListItemWithRadio ListItemWithRadio with secondaryValue text and LHS align start 1`] = `
401
+ exports[`ListItemWithRadio ListItemWithRadio with secondaryValue 1`] = `
301
402
  <DocumentFragment>
302
403
  <li
303
404
  class="list medium default withBorder flex rowdir vCenter"
@@ -362,35 +463,134 @@ exports[`ListItemWithRadio ListItemWithRadio with secondaryValue text and LHS al
362
463
  </div>
363
464
  </div>
364
465
  <div
365
- class="grow basis shrinkOn"
466
+ class="leftBox grow basis shrinkOff"
366
467
  data-id="boxComponent"
367
468
  data-selector-id="box"
368
469
  data-test-id="boxComponent"
369
470
  >
370
471
  <div
371
- class="flex cover coldir"
372
- data-id="containerComponent"
373
- data-selector-id="container"
374
- data-test-id="containerComponent"
472
+ class="titleBox shrinkOff"
473
+ data-id="boxComponent"
474
+ data-selector-id="box"
475
+ data-test-id="boxComponent"
375
476
  >
376
477
  <div
377
- class="value shrinkOff"
478
+ class="value basisAuto shrinkOn"
378
479
  data-id="boxComponent"
379
480
  data-selector-id="box"
380
481
  data-test-id="boxComponent"
381
482
  >
382
483
  List
383
484
  </div>
485
+ </div>
486
+ <div
487
+ class="secondaryField secondaryValue shrinkOff"
488
+ data-id="boxComponent"
489
+ data-selector-id="box"
490
+ data-test-id="boxComponent"
491
+ data-title="secondaryValue"
492
+ >
493
+ secondaryValue
494
+ </div>
495
+ </div>
496
+ </li>
497
+ </DocumentFragment>
498
+ `;
499
+
500
+ exports[`ListItemWithRadio ListItemWithRadio with secondaryValue text and LHS align start 1`] = `
501
+ <DocumentFragment>
502
+ <li
503
+ class="list medium default withBorder flex rowdir vCenter"
504
+ data-a11y-inset-focus="true"
505
+ data-id="listItemWithRadioComp"
506
+ data-selector-id="listItemWithRadio"
507
+ data-test-id="listItemWithRadioComp"
508
+ role="option"
509
+ tabindex="0"
510
+ >
511
+ <div
512
+ class="iconBox lhsBox lhsJustifyContent_center shrinkOff selfStart"
513
+ data-id="listItemWithRadioComp_radio"
514
+ data-selector-id="box"
515
+ data-test-id="listItemWithRadioComp_radio"
516
+ >
517
+ <div
518
+ class="lhsBox_medium shrinkOff selfStart"
519
+ data-id="boxComponent"
520
+ data-selector-id="box"
521
+ data-test-id="boxComponent"
522
+ >
523
+ <div
524
+ aria-checked="false"
525
+ aria-hidden="true"
526
+ aria-readonly="false"
527
+ class="container pointer hoverEfffect inflex rowdir both"
528
+ data-id="RadioComp"
529
+ data-selector-id="container"
530
+ data-test-id="RadioComp"
531
+ role="radio"
532
+ tabindex="-1"
533
+ >
534
+ <div
535
+ class="radio
536
+ hoverprimary medium filled centerPathprimary shrinkOff"
537
+ data-id="boxComponent"
538
+ data-selector-id="box"
539
+ data-test-id="boxComponent"
540
+ >
541
+ <input
542
+ type="hidden"
543
+ value=""
544
+ />
545
+ <label
546
+ class="radioLabel pointer"
547
+ >
548
+ <svg
549
+ viewBox="0 0 40 40"
550
+ xmlns="http://www.w3.org/2000/svg"
551
+ >
552
+ <circle
553
+ class="rdBox"
554
+ cx="20"
555
+ cy="20"
556
+ r="19"
557
+ />
558
+ </svg>
559
+ </label>
560
+ </div>
561
+ </div>
562
+ </div>
563
+ </div>
564
+ <div
565
+ class="leftBox grow basis shrinkOff"
566
+ data-id="boxComponent"
567
+ data-selector-id="box"
568
+ data-test-id="boxComponent"
569
+ >
570
+ <div
571
+ class="titleBox shrinkOff"
572
+ data-id="boxComponent"
573
+ data-selector-id="box"
574
+ data-test-id="boxComponent"
575
+ >
384
576
  <div
385
- class="secondaryField secondaryValue shrinkOff"
577
+ class="value basisAuto shrinkOn"
386
578
  data-id="boxComponent"
387
579
  data-selector-id="box"
388
580
  data-test-id="boxComponent"
389
- data-title="secondaryValue"
390
581
  >
391
- secondaryValue
582
+ List
392
583
  </div>
393
584
  </div>
585
+ <div
586
+ class="secondaryField secondaryValue shrinkOff"
587
+ data-id="boxComponent"
588
+ data-selector-id="box"
589
+ data-test-id="boxComponent"
590
+ data-title="secondaryValue"
591
+ >
592
+ secondaryValue
593
+ </div>
394
594
  </div>
395
595
  </li>
396
596
  </DocumentFragment>
@@ -461,19 +661,19 @@ exports[`ListItemWithRadio rendering the defult props 1`] = `
461
661
  </div>
462
662
  </div>
463
663
  <div
464
- class="grow basis shrinkOn"
664
+ class="leftBox grow basis shrinkOff"
465
665
  data-id="boxComponent"
466
666
  data-selector-id="box"
467
667
  data-test-id="boxComponent"
468
668
  >
469
669
  <div
470
- class="flex cover coldir"
471
- data-id="containerComponent"
472
- data-selector-id="container"
473
- data-test-id="containerComponent"
670
+ class="titleBox shrinkOff"
671
+ data-id="boxComponent"
672
+ data-selector-id="box"
673
+ data-test-id="boxComponent"
474
674
  >
475
675
  <div
476
- class="value shrinkOff"
676
+ class="value basisAuto shrinkOn"
477
677
  data-id="boxComponent"
478
678
  data-selector-id="box"
479
679
  data-test-id="boxComponent"
package/es/ListItem/props/propTypes.js CHANGED
@@ -60,12 +60,14 @@ export const ListItem_Props = {
60
60
  needMultiLineText: PropTypes.bool,
61
61
  customClass: PropTypes.shape({
62
62
  customListItem: PropTypes.string,
63
- customTickIcon: PropTypes.string
63
+ customTickIcon: PropTypes.string,
64
+ customValueRightPlaceholder: PropTypes.string
64
65
  }),
65
66
  customProps: PropTypes.shape({
66
67
  ListItemProps: PropTypes.object
67
68
  }),
68
- secondaryValue: PropTypes.string
69
+ secondaryValue: PropTypes.string,
70
+ renderValueRightPlaceholderNode: PropTypes.oneOfType([PropTypes.node, PropTypes.func])
69
71
  };
70
72
  export const ListItemWithAvatar_Props = {
71
73
  active: PropTypes.bool,
@@ -94,6 +96,7 @@ export const ListItemWithAvatar_Props = {
94
96
  title: PropTypes.string,
95
97
  value: PropTypes.string,
96
98
  secondaryValue: PropTypes.string,
99
+ renderValueRightPlaceholderNode: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
97
100
  lhsAlignContent: PropTypes.oneOf(['start', 'center', 'end']),
98
101
  a11y: PropTypes.shape({
99
102
  role: PropTypes.string,
@@ -103,7 +106,8 @@ export const ListItemWithAvatar_Props = {
103
106
  customClass: PropTypes.shape({
104
107
  customListItem: PropTypes.string,
105
108
  customAvatar: PropTypes.string,
106
- customAvatarTeam: PropTypes.string
109
+ customAvatarTeam: PropTypes.string,
110
+ customValueRightPlaceholder: PropTypes.string
107
111
  }),
108
112
  needMultiLineText: PropTypes.bool,
109
113
  customProps: PropTypes.shape({
@@ -132,6 +136,7 @@ export const ListItemWithCheckBox_Props = {
132
136
  title: PropTypes.string,
133
137
  value: PropTypes.string,
134
138
  secondaryValue: PropTypes.string,
139
+ renderValueRightPlaceholderNode: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
135
140
  lhsAlignContent: PropTypes.oneOf(['start', 'center', 'end']),
136
141
  lhsJustifyContent: PropTypes.oneOf(['start', 'center', 'end']),
137
142
  a11y: PropTypes.shape({
@@ -142,7 +147,8 @@ export const ListItemWithCheckBox_Props = {
142
147
  customClass: PropTypes.shape({
143
148
  customListItem: PropTypes.string,
144
149
  customCheckBox: PropTypes.string,
145
- customLabel: PropTypes.string
150
+ customLabel: PropTypes.string,
151
+ customValueRightPlaceholder: PropTypes.string
146
152
  }),
147
153
  customProps: PropTypes.object
148
154
  };
@@ -169,6 +175,7 @@ export const ListItemWithIcon_Props = {
169
175
  title: PropTypes.string,
170
176
  value: PropTypes.string,
171
177
  secondaryValue: PropTypes.string,
178
+ renderValueRightPlaceholderNode: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
172
179
  lhsAlignContent: PropTypes.oneOf(['start', 'center', 'end']),
173
180
  lhsJustifyContent: PropTypes.oneOf(['start', 'center', 'end']),
174
181
  a11y: PropTypes.shape({
@@ -178,6 +185,7 @@ export const ListItemWithIcon_Props = {
178
185
  }),
179
186
  needMultiLineText: PropTypes.bool,
180
187
  customClass: PropTypes.string,
188
+ customValueRightPlaceholderClass: PropTypes.string,
181
189
  customProps: PropTypes.shape({
182
190
  ListItemProps: PropTypes.object
183
191
  }),
@@ -204,6 +212,7 @@ export const ListItemWithRadio_Props = {
204
212
  title: PropTypes.string,
205
213
  value: PropTypes.string,
206
214
  secondaryValue: PropTypes.string,
215
+ renderValueRightPlaceholderNode: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
207
216
  lhsAlignContent: PropTypes.oneOf(['start', 'center', 'end']),
208
217
  lhsJustifyContent: PropTypes.oneOf(['start', 'center', 'end']),
209
218
  a11y: PropTypes.shape({
@@ -214,7 +223,8 @@ export const ListItemWithRadio_Props = {
214
223
  customClass: PropTypes.shape({
215
224
  customListItem: PropTypes.string,
216
225
  customRadio: PropTypes.string,
217
- customRadioWrap: PropTypes.string
226
+ customRadioWrap: PropTypes.string,
227
+ customValueRightPlaceholder: PropTypes.string
218
228
  }),
219
229
  customProps: PropTypes.object
220
230
  };