@zohodesk/dot 1.9.9 → 1.9.10

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 (10) hide show
  1. package/README.md +9 -0
  2. package/es/ActionButton/ActionButton.js +18 -8
  3. package/es/ActionButton/__tests__/__snapshots__/ActionButton.spec.js.snap +47 -60
  4. package/es/ActionButton/props/defaultProps.js +2 -1
  5. package/es/ActionButton/props/propTypes.js +4 -1
  6. package/lib/ActionButton/ActionButton.js +17 -8
  7. package/lib/ActionButton/__tests__/__snapshots__/ActionButton.spec.js.snap +47 -60
  8. package/lib/ActionButton/props/defaultProps.js +2 -1
  9. package/lib/ActionButton/props/propTypes.js +4 -1
  10. package/package.json +11 -11
package/lib/ActionButton/__tests__/__snapshots__/ActionButton.spec.js.snap CHANGED
@@ -53,7 +53,6 @@ exports[`ActionButton renders with arrowBoxSize medium and children 1`] = `
53
53
  data-id="actionButton"
54
54
  data-selector-id="box"
55
55
  data-test-id="actionButton"
56
- tabindex="0"
57
56
  >
58
57
  <div
59
58
  class="flex cover coldir both"
@@ -77,11 +76,12 @@ exports[`ActionButton renders with arrowBoxSize medium and children 1`] = `
77
76
  </div>
78
77
  </button>
79
78
  <button
79
+ aria-controls="1"
80
+ aria-expanded="false"
80
81
  class="buttonReset medium_arrowBox primaryFilledArw arrowWrapper shrinkOff"
81
82
  data-id="actionButton_arrowButton"
82
83
  data-selector-id="actionButton_arrowButton"
83
84
  data-test-id="actionButton_arrowButton"
84
- tabindex="0"
85
85
  >
86
86
  <div
87
87
  class="flex cover coldir both"
@@ -116,7 +116,6 @@ exports[`ActionButton renders with arrowBoxSize medium and isPopupOpen false 1`]
116
116
  data-id="actionButton"
117
117
  data-selector-id="box"
118
118
  data-test-id="actionButton"
119
- tabindex="0"
120
119
  >
121
120
  <div
122
121
  class="flex cover coldir both"
@@ -156,7 +155,6 @@ exports[`ActionButton renders with arrowBoxSize small and children 1`] = `
156
155
  data-id="actionButton"
157
156
  data-selector-id="box"
158
157
  data-test-id="actionButton"
159
- tabindex="0"
160
158
  >
161
159
  <div
162
160
  class="flex cover coldir both"
@@ -180,11 +178,12 @@ exports[`ActionButton renders with arrowBoxSize small and children 1`] = `
180
178
  </div>
181
179
  </button>
182
180
  <button
181
+ aria-controls="1"
182
+ aria-expanded="false"
183
183
  class="buttonReset small_arrowBox primaryFilledArw arrowWrapper shrinkOff"
184
184
  data-id="actionButton_arrowButton"
185
185
  data-selector-id="actionButton_arrowButton"
186
186
  data-test-id="actionButton_arrowButton"
187
- tabindex="0"
188
187
  >
189
188
  <div
190
189
  class="flex cover coldir both"
@@ -219,7 +218,6 @@ exports[`ActionButton renders with arrowBoxSize small and isPopupOpen true 1`] =
219
218
  data-id="actionButton"
220
219
  data-selector-id="box"
221
220
  data-test-id="actionButton"
222
- tabindex="0"
223
221
  >
224
222
  <div
225
223
  class="flex cover coldir both"
@@ -259,7 +257,6 @@ exports[`ActionButton renders with children and tooltip disabled 1`] = `
259
257
  data-id="actionButton"
260
258
  data-selector-id="box"
261
259
  data-test-id="actionButton"
262
- tabindex="0"
263
260
  >
264
261
  <div
265
262
  class="flex cover coldir both"
@@ -283,11 +280,12 @@ exports[`ActionButton renders with children and tooltip disabled 1`] = `
283
280
  </div>
284
281
  </button>
285
282
  <button
283
+ aria-controls="1"
284
+ aria-expanded="false"
286
285
  class="buttonReset medium_arrowBox primaryFilledArw arrowWrapper shrinkOff"
287
286
  data-id="actionButton_arrowButton"
288
287
  data-selector-id="actionButton_arrowButton"
289
288
  data-test-id="actionButton_arrowButton"
290
- tabindex="0"
291
289
  >
292
290
  <div
293
291
  class="flex cover coldir both"
@@ -322,7 +320,6 @@ exports[`ActionButton renders with children and tooltip enabled 1`] = `
322
320
  data-id="actionButton"
323
321
  data-selector-id="box"
324
322
  data-test-id="actionButton"
325
- tabindex="0"
326
323
  >
327
324
  <div
328
325
  class="flex cover coldir both"
@@ -346,11 +343,12 @@ exports[`ActionButton renders with children and tooltip enabled 1`] = `
346
343
  </div>
347
344
  </button>
348
345
  <button
346
+ aria-controls="1"
347
+ aria-expanded="false"
349
348
  class="buttonReset medium_arrowBox primaryFilledArw arrowWrapper shrinkOff"
350
349
  data-id="actionButton_arrowButton"
351
350
  data-selector-id="actionButton_arrowButton"
352
351
  data-test-id="actionButton_arrowButton"
353
- tabindex="0"
354
352
  >
355
353
  <div
356
354
  class="flex cover coldir both"
@@ -385,7 +383,6 @@ exports[`ActionButton renders with children prop 1`] = `
385
383
  data-id="actionButton"
386
384
  data-selector-id="box"
387
385
  data-test-id="actionButton"
388
- tabindex="0"
389
386
  >
390
387
  <div
391
388
  class="flex cover coldir both"
@@ -409,11 +406,12 @@ exports[`ActionButton renders with children prop 1`] = `
409
406
  </div>
410
407
  </button>
411
408
  <button
409
+ aria-controls="1"
410
+ aria-expanded="false"
412
411
  class="buttonReset medium_arrowBox primaryFilledArw arrowWrapper shrinkOff"
413
412
  data-id="actionButton_arrowButton"
414
413
  data-selector-id="actionButton_arrowButton"
415
414
  data-test-id="actionButton_arrowButton"
416
- tabindex="0"
417
415
  >
418
416
  <div
419
417
  class="flex cover coldir both"
@@ -448,7 +446,6 @@ exports[`ActionButton renders with custom className 1`] = `
448
446
  data-id="actionButton"
449
447
  data-selector-id="box"
450
448
  data-test-id="actionButton"
451
- tabindex="0"
452
449
  >
453
450
  <div
454
451
  class="flex cover coldir both"
@@ -488,7 +485,6 @@ exports[`ActionButton renders with dataId prop 1`] = `
488
485
  data-id="testDataId"
489
486
  data-selector-id="box"
490
487
  data-test-id="testDataId"
491
- tabindex="0"
492
488
  >
493
489
  <div
494
490
  class="flex cover coldir both"
@@ -528,7 +524,6 @@ exports[`ActionButton renders with dataId, children, and popup open 1`] = `
528
524
  data-id="testDataId"
529
525
  data-selector-id="box"
530
526
  data-test-id="testDataId"
531
- tabindex="0"
532
527
  >
533
528
  <div
534
529
  class="flex cover coldir both"
@@ -552,11 +547,12 @@ exports[`ActionButton renders with dataId, children, and popup open 1`] = `
552
547
  </div>
553
548
  </button>
554
549
  <button
550
+ aria-controls="1"
551
+ aria-expanded="true"
555
552
  class="buttonReset medium_arrowBox primaryFilledArw arrowWrapper arrowActive shrinkOff"
556
553
  data-id="testDataId_arrowButton"
557
554
  data-selector-id="actionButton_arrowButton"
558
555
  data-test-id="testDataId_arrowButton"
559
- tabindex="0"
560
556
  >
561
557
  <div
562
558
  class="flex cover coldir both"
@@ -583,6 +579,7 @@ exports[`ActionButton renders with dataId, children, and popup open 1`] = `
583
579
  data-selector-id="dropBox"
584
580
  data-test-id="testDataId_dropbox"
585
581
  dot-ui-element="dropbox"
582
+ id="1"
586
583
  style="z-index: 4;"
587
584
  >
588
585
  <div
@@ -630,7 +627,6 @@ exports[`ActionButton renders with dataSelectorId and children props 1`] = `
630
627
  data-id="actionButton"
631
628
  data-selector-id="box"
632
629
  data-test-id="actionButton"
633
- tabindex="0"
634
630
  >
635
631
  <div
636
632
  class="flex cover coldir both"
@@ -654,11 +650,12 @@ exports[`ActionButton renders with dataSelectorId and children props 1`] = `
654
650
  </div>
655
651
  </button>
656
652
  <button
653
+ aria-controls="1"
654
+ aria-expanded="false"
657
655
  class="buttonReset medium_arrowBox primaryFilledArw arrowWrapper shrinkOff"
658
656
  data-id="actionButton_arrowButton"
659
657
  data-selector-id="testSelectorId_arrowButton"
660
658
  data-test-id="actionButton_arrowButton"
661
- tabindex="0"
662
659
  >
663
660
  <div
664
661
  class="flex cover coldir both"
@@ -694,7 +691,6 @@ exports[`ActionButton renders with dataTitle 1`] = `
694
691
  data-selector-id="box"
695
692
  data-test-id="actionButton"
696
693
  data-title="Test Data Title"
697
- tabindex="0"
698
694
  >
699
695
  <div
700
696
  class="flex cover coldir both"
@@ -734,7 +730,6 @@ exports[`ActionButton renders with default props 1`] = `
734
730
  data-id="actionButton"
735
731
  data-selector-id="box"
736
732
  data-test-id="actionButton"
737
- tabindex="0"
738
733
  >
739
734
  <div
740
735
  class="flex cover coldir both"
@@ -774,7 +769,6 @@ exports[`ActionButton renders with disabled state true 1`] = `
774
769
  data-id="actionButton"
775
770
  data-selector-id="box"
776
771
  data-test-id="actionButton"
777
- tabindex="0"
778
772
  >
779
773
  <div
780
774
  class="flex cover coldir both"
@@ -814,7 +808,6 @@ exports[`ActionButton renders with dropBoxClassProps - case 1 1`] = `
814
808
  data-id="actionButton"
815
809
  data-selector-id="box"
816
810
  data-test-id="actionButton"
817
- tabindex="0"
818
811
  >
819
812
  <div
820
813
  class="flex cover coldir both"
@@ -838,11 +831,12 @@ exports[`ActionButton renders with dropBoxClassProps - case 1 1`] = `
838
831
  </div>
839
832
  </button>
840
833
  <button
834
+ aria-controls="1"
835
+ aria-expanded="true"
841
836
  class="buttonReset medium_arrowBox primaryFilledArw arrowWrapper arrowActive shrinkOff"
842
837
  data-id="actionButton_arrowButton"
843
838
  data-selector-id="actionButton_arrowButton"
844
839
  data-test-id="actionButton_arrowButton"
845
- tabindex="0"
846
840
  >
847
841
  <div
848
842
  class="flex cover coldir both"
@@ -869,6 +863,7 @@ exports[`ActionButton renders with dropBoxClassProps - case 1 1`] = `
869
863
  data-selector-id="dropBox"
870
864
  data-test-id="actionButton_dropbox"
871
865
  dot-ui-element="dropbox"
866
+ id="1"
872
867
  style="z-index: 4;"
873
868
  >
874
869
  <div
@@ -916,7 +911,6 @@ exports[`ActionButton renders with dropBoxClassProps - case 2 1`] = `
916
911
  data-id="actionButton"
917
912
  data-selector-id="box"
918
913
  data-test-id="actionButton"
919
- tabindex="0"
920
914
  >
921
915
  <div
922
916
  class="flex cover coldir both"
@@ -940,11 +934,12 @@ exports[`ActionButton renders with dropBoxClassProps - case 2 1`] = `
940
934
  </div>
941
935
  </button>
942
936
  <button
937
+ aria-controls="1"
938
+ aria-expanded="false"
943
939
  class="buttonReset medium_arrowBox primaryFilledArw arrowWrapper shrinkOff"
944
940
  data-id="actionButton_arrowButton"
945
941
  data-selector-id="actionButton_arrowButton"
946
942
  data-test-id="actionButton_arrowButton"
947
- tabindex="0"
948
943
  >
949
944
  <div
950
945
  class="flex cover coldir both"
@@ -979,7 +974,6 @@ exports[`ActionButton renders with dropBoxClassProps - case 3 1`] = `
979
974
  data-id="actionButton"
980
975
  data-selector-id="box"
981
976
  data-test-id="actionButton"
982
- tabindex="0"
983
977
  >
984
978
  <div
985
979
  class="flex cover coldir both"
@@ -1003,11 +997,12 @@ exports[`ActionButton renders with dropBoxClassProps - case 3 1`] = `
1003
997
  </div>
1004
998
  </button>
1005
999
  <button
1000
+ aria-controls="1"
1001
+ aria-expanded="true"
1006
1002
  class="buttonReset medium_arrowBox primaryFilledArw arrowWrapper arrowActive shrinkOff"
1007
1003
  data-id="actionButton_arrowButton"
1008
1004
  data-selector-id="actionButton_arrowButton"
1009
1005
  data-test-id="actionButton_arrowButton"
1010
- tabindex="0"
1011
1006
  >
1012
1007
  <div
1013
1008
  class="flex cover coldir both"
@@ -1034,6 +1029,7 @@ exports[`ActionButton renders with dropBoxClassProps - case 3 1`] = `
1034
1029
  data-selector-id="dropBox"
1035
1030
  data-test-id="actionButton_dropbox"
1036
1031
  dot-ui-element="dropbox"
1032
+ id="1"
1037
1033
  style="z-index: 4;"
1038
1034
  >
1039
1035
  <div
@@ -1081,7 +1077,6 @@ exports[`ActionButton renders with dropBoxClassProps - case 4 1`] = `
1081
1077
  data-id="actionButton"
1082
1078
  data-selector-id="box"
1083
1079
  data-test-id="actionButton"
1084
- tabindex="0"
1085
1080
  >
1086
1081
  <div
1087
1082
  class="flex cover coldir both"
@@ -1105,11 +1100,12 @@ exports[`ActionButton renders with dropBoxClassProps - case 4 1`] = `
1105
1100
  </div>
1106
1101
  </button>
1107
1102
  <button
1103
+ aria-controls="1"
1104
+ aria-expanded="true"
1108
1105
  class="buttonReset medium_arrowBox primaryFilledArw arrowWrapper arrowActive shrinkOff"
1109
1106
  data-id="actionButton_arrowButton"
1110
1107
  data-selector-id="actionButton_arrowButton"
1111
1108
  data-test-id="actionButton_arrowButton"
1112
- tabindex="0"
1113
1109
  >
1114
1110
  <div
1115
1111
  class="flex cover coldir both"
@@ -1136,6 +1132,7 @@ exports[`ActionButton renders with dropBoxClassProps - case 4 1`] = `
1136
1132
  data-selector-id="dropBox"
1137
1133
  data-test-id="actionButton_dropbox"
1138
1134
  dot-ui-element="dropbox"
1135
+ id="1"
1139
1136
  style="z-index: 4;"
1140
1137
  >
1141
1138
  <div
@@ -1183,7 +1180,6 @@ exports[`ActionButton renders with iconName: { iconName: 'ZD-replyall', iconSize
1183
1180
  data-id="actionButton"
1184
1181
  data-selector-id="box"
1185
1182
  data-test-id="actionButton"
1186
- tabindex="0"
1187
1183
  >
1188
1184
  <div
1189
1185
  class="flex cover coldir both"
@@ -1250,7 +1246,6 @@ exports[`ActionButton renders with innerClassName set to custom-class 1`] = `
1250
1246
  data-id="actionButton"
1251
1247
  data-selector-id="box"
1252
1248
  data-test-id="actionButton"
1253
- tabindex="0"
1254
1249
  >
1255
1250
  <div
1256
1251
  class="flex cover coldir both"
@@ -1290,7 +1285,6 @@ exports[`ActionButton renders with innerClassName set to empty string 1`] = `
1290
1285
  data-id="actionButton"
1291
1286
  data-selector-id="box"
1292
1287
  data-test-id="actionButton"
1293
- tabindex="0"
1294
1288
  >
1295
1289
  <div
1296
1290
  class="flex cover coldir both"
@@ -1330,7 +1324,6 @@ exports[`ActionButton renders with innerClassName set to undefined 1`] = `
1330
1324
  data-id="actionButton"
1331
1325
  data-selector-id="box"
1332
1326
  data-test-id="actionButton"
1333
- tabindex="0"
1334
1327
  >
1335
1328
  <div
1336
1329
  class="flex cover coldir both"
@@ -1370,7 +1363,6 @@ exports[`ActionButton renders with isAbsolutePositioningNeeded set to true 1`] =
1370
1363
  data-id="actionButton"
1371
1364
  data-selector-id="box"
1372
1365
  data-test-id="actionButton"
1373
- tabindex="0"
1374
1366
  >
1375
1367
  <div
1376
1368
  class="flex cover coldir both"
@@ -1410,7 +1402,6 @@ exports[`ActionButton renders with isAbsolutePositioningNeeded set to true and i
1410
1402
  data-id="actionButton"
1411
1403
  data-selector-id="box"
1412
1404
  data-test-id="actionButton"
1413
- tabindex="0"
1414
1405
  >
1415
1406
  <div
1416
1407
  class="flex cover coldir both"
@@ -1434,11 +1425,12 @@ exports[`ActionButton renders with isAbsolutePositioningNeeded set to true and i
1434
1425
  </div>
1435
1426
  </button>
1436
1427
  <button
1428
+ aria-controls="1"
1429
+ aria-expanded="true"
1437
1430
  class="buttonReset medium_arrowBox primaryFilledArw arrowWrapper arrowActive shrinkOff"
1438
1431
  data-id="actionButton_arrowButton"
1439
1432
  data-selector-id="actionButton_arrowButton"
1440
1433
  data-test-id="actionButton_arrowButton"
1441
- tabindex="0"
1442
1434
  >
1443
1435
  <div
1444
1436
  class="flex cover coldir both"
@@ -1465,6 +1457,7 @@ exports[`ActionButton renders with isAbsolutePositioningNeeded set to true and i
1465
1457
  data-selector-id="dropBox"
1466
1458
  data-test-id="actionButton_dropbox"
1467
1459
  dot-ui-element="dropbox"
1460
+ id="1"
1468
1461
  style="z-index: 4;"
1469
1462
  >
1470
1463
  <div
@@ -1512,7 +1505,6 @@ exports[`ActionButton renders with isArrow false and popup open 1`] = `
1512
1505
  data-id="actionButton"
1513
1506
  data-selector-id="box"
1514
1507
  data-test-id="actionButton"
1515
- tabindex="0"
1516
1508
  >
1517
1509
  <div
1518
1510
  class="flex cover coldir both"
@@ -1536,11 +1528,12 @@ exports[`ActionButton renders with isArrow false and popup open 1`] = `
1536
1528
  </div>
1537
1529
  </button>
1538
1530
  <button
1531
+ aria-controls="1"
1532
+ aria-expanded="true"
1539
1533
  class="buttonReset medium_arrowBox primaryFilledArw arrowWrapper arrowActive shrinkOff"
1540
1534
  data-id="actionButton_arrowButton"
1541
1535
  data-selector-id="actionButton_arrowButton"
1542
1536
  data-test-id="actionButton_arrowButton"
1543
- tabindex="0"
1544
1537
  >
1545
1538
  <div
1546
1539
  class="flex cover coldir both"
@@ -1567,6 +1560,7 @@ exports[`ActionButton renders with isArrow false and popup open 1`] = `
1567
1560
  data-selector-id="dropBox"
1568
1561
  data-test-id="actionButton_dropbox"
1569
1562
  dot-ui-element="dropbox"
1563
+ id="1"
1570
1564
  style="z-index: 4;"
1571
1565
  >
1572
1566
  <div
@@ -1614,7 +1608,6 @@ exports[`ActionButton renders with isArrow true and popup open 1`] = `
1614
1608
  data-id="actionButton"
1615
1609
  data-selector-id="box"
1616
1610
  data-test-id="actionButton"
1617
- tabindex="0"
1618
1611
  >
1619
1612
  <div
1620
1613
  class="flex cover coldir both"
@@ -1638,11 +1631,12 @@ exports[`ActionButton renders with isArrow true and popup open 1`] = `
1638
1631
  </div>
1639
1632
  </button>
1640
1633
  <button
1634
+ aria-controls="1"
1635
+ aria-expanded="true"
1641
1636
  class="buttonReset medium_arrowBox primaryFilledArw arrowWrapper arrowActive shrinkOff"
1642
1637
  data-id="actionButton_arrowButton"
1643
1638
  data-selector-id="actionButton_arrowButton"
1644
1639
  data-test-id="actionButton_arrowButton"
1645
- tabindex="0"
1646
1640
  >
1647
1641
  <div
1648
1642
  class="flex cover coldir both"
@@ -1669,6 +1663,7 @@ exports[`ActionButton renders with isArrow true and popup open 1`] = `
1669
1663
  data-selector-id="dropBox"
1670
1664
  data-test-id="actionButton_dropbox"
1671
1665
  dot-ui-element="dropbox"
1666
+ id="1"
1672
1667
  style="z-index: 4;"
1673
1668
  >
1674
1669
  <div
@@ -1766,7 +1761,6 @@ exports[`ActionButton renders with isPopupOpen false and children 1`] = `
1766
1761
  data-id="actionButton"
1767
1762
  data-selector-id="box"
1768
1763
  data-test-id="actionButton"
1769
- tabindex="0"
1770
1764
  >
1771
1765
  <div
1772
1766
  class="flex cover coldir both"
@@ -1790,11 +1784,12 @@ exports[`ActionButton renders with isPopupOpen false and children 1`] = `
1790
1784
  </div>
1791
1785
  </button>
1792
1786
  <button
1787
+ aria-controls="1"
1788
+ aria-expanded="false"
1793
1789
  class="buttonReset medium_arrowBox primaryFilledArw arrowWrapper shrinkOff"
1794
1790
  data-id="actionButton_arrowButton"
1795
1791
  data-selector-id="actionButton_arrowButton"
1796
1792
  data-test-id="actionButton_arrowButton"
1797
- tabindex="0"
1798
1793
  >
1799
1794
  <div
1800
1795
  class="flex cover coldir both"
@@ -1829,7 +1824,6 @@ exports[`ActionButton renders with isPopupOpen true and children 1`] = `
1829
1824
  data-id="actionButton"
1830
1825
  data-selector-id="box"
1831
1826
  data-test-id="actionButton"
1832
- tabindex="0"
1833
1827
  >
1834
1828
  <div
1835
1829
  class="flex cover coldir both"
@@ -1853,11 +1847,12 @@ exports[`ActionButton renders with isPopupOpen true and children 1`] = `
1853
1847
  </div>
1854
1848
  </button>
1855
1849
  <button
1850
+ aria-controls="1"
1851
+ aria-expanded="true"
1856
1852
  class="buttonReset medium_arrowBox primaryFilledArw arrowWrapper arrowActive shrinkOff"
1857
1853
  data-id="actionButton_arrowButton"
1858
1854
  data-selector-id="actionButton_arrowButton"
1859
1855
  data-test-id="actionButton_arrowButton"
1860
- tabindex="0"
1861
1856
  >
1862
1857
  <div
1863
1858
  class="flex cover coldir both"
@@ -1884,6 +1879,7 @@ exports[`ActionButton renders with isPopupOpen true and children 1`] = `
1884
1879
  data-selector-id="dropBox"
1885
1880
  data-test-id="actionButton_dropbox"
1886
1881
  dot-ui-element="dropbox"
1882
+ id="1"
1887
1883
  style="z-index: 4;"
1888
1884
  >
1889
1885
  <div
@@ -1931,7 +1927,6 @@ exports[`ActionButton renders with isRestrictScroll set to true 1`] = `
1931
1927
  data-id="actionButton"
1932
1928
  data-selector-id="box"
1933
1929
  data-test-id="actionButton"
1934
- tabindex="0"
1935
1930
  >
1936
1931
  <div
1937
1932
  class="flex cover coldir both"
@@ -1971,7 +1966,6 @@ exports[`ActionButton renders with isRestrictScroll set to true and isPopupOpen
1971
1966
  data-id="actionButton"
1972
1967
  data-selector-id="box"
1973
1968
  data-test-id="actionButton"
1974
- tabindex="0"
1975
1969
  >
1976
1970
  <div
1977
1971
  class="flex cover coldir both"
@@ -1995,11 +1989,12 @@ exports[`ActionButton renders with isRestrictScroll set to true and isPopupOpen
1995
1989
  </div>
1996
1990
  </button>
1997
1991
  <button
1992
+ aria-controls="1"
1993
+ aria-expanded="true"
1998
1994
  class="buttonReset medium_arrowBox primaryFilledArw arrowWrapper arrowActive shrinkOff"
1999
1995
  data-id="actionButton_arrowButton"
2000
1996
  data-selector-id="actionButton_arrowButton"
2001
1997
  data-test-id="actionButton_arrowButton"
2002
- tabindex="0"
2003
1998
  >
2004
1999
  <div
2005
2000
  class="flex cover coldir both"
@@ -2026,6 +2021,7 @@ exports[`ActionButton renders with isRestrictScroll set to true and isPopupOpen
2026
2021
  data-selector-id="dropBox"
2027
2022
  data-test-id="actionButton_dropbox"
2028
2023
  dot-ui-element="dropbox"
2024
+ id="1"
2029
2025
  style="z-index: 4;"
2030
2026
  >
2031
2027
  <div
@@ -2073,7 +2069,6 @@ exports[`ActionButton renders with onClick prop and validates class 1`] = `
2073
2069
  data-id="actionButton"
2074
2070
  data-selector-id="box"
2075
2071
  data-test-id="actionButton"
2076
- tabindex="0"
2077
2072
  >
2078
2073
  <div
2079
2074
  class="flex cover coldir both"
@@ -2140,7 +2135,6 @@ exports[`ActionButton renders with palette - primary 1`] = `
2140
2135
  data-id="actionButton"
2141
2136
  data-selector-id="box"
2142
2137
  data-test-id="actionButton"
2143
- tabindex="0"
2144
2138
  >
2145
2139
  <div
2146
2140
  class="flex cover coldir both"
@@ -2180,7 +2174,6 @@ exports[`ActionButton renders with palette - primary and children 1`] = `
2180
2174
  data-id="actionButton"
2181
2175
  data-selector-id="box"
2182
2176
  data-test-id="actionButton"
2183
- tabindex="0"
2184
2177
  >
2185
2178
  <div
2186
2179
  class="flex cover coldir both"
@@ -2204,11 +2197,12 @@ exports[`ActionButton renders with palette - primary and children 1`] = `
2204
2197
  </div>
2205
2198
  </button>
2206
2199
  <button
2200
+ aria-controls="1"
2201
+ aria-expanded="false"
2207
2202
  class="buttonReset medium_arrowBox primaryArw arrowWrapper shrinkOff"
2208
2203
  data-id="actionButton_arrowButton"
2209
2204
  data-selector-id="actionButton_arrowButton"
2210
2205
  data-test-id="actionButton_arrowButton"
2211
- tabindex="0"
2212
2206
  >
2213
2207
  <div
2214
2208
  class="flex cover coldir both"
@@ -2283,7 +2277,6 @@ exports[`ActionButton renders with palette - primaryFilled 1`] = `
2283
2277
  data-id="actionButton"
2284
2278
  data-selector-id="box"
2285
2279
  data-test-id="actionButton"
2286
- tabindex="0"
2287
2280
  >
2288
2281
  <div
2289
2282
  class="flex cover coldir both"
@@ -2323,7 +2316,6 @@ exports[`ActionButton renders with palette - primaryFilled and children 1`] = `
2323
2316
  data-id="actionButton"
2324
2317
  data-selector-id="box"
2325
2318
  data-test-id="actionButton"
2326
- tabindex="0"
2327
2319
  >
2328
2320
  <div
2329
2321
  class="flex cover coldir both"
@@ -2347,11 +2339,12 @@ exports[`ActionButton renders with palette - primaryFilled and children 1`] = `
2347
2339
  </div>
2348
2340
  </button>
2349
2341
  <button
2342
+ aria-controls="1"
2343
+ aria-expanded="false"
2350
2344
  class="buttonReset medium_arrowBox primaryFilledArw arrowWrapper shrinkOff"
2351
2345
  data-id="actionButton_arrowButton"
2352
2346
  data-selector-id="actionButton_arrowButton"
2353
2347
  data-test-id="actionButton_arrowButton"
2354
- tabindex="0"
2355
2348
  >
2356
2349
  <div
2357
2350
  class="flex cover coldir both"
@@ -2426,7 +2419,6 @@ exports[`ActionButton renders with removeClose set to a function 1`] = `
2426
2419
  data-id="actionButton"
2427
2420
  data-selector-id="box"
2428
2421
  data-test-id="actionButton"
2429
- tabindex="0"
2430
2422
  >
2431
2423
  <div
2432
2424
  class="flex cover coldir both"
@@ -2466,7 +2458,6 @@ exports[`ActionButton renders with size - large 1`] = `
2466
2458
  data-id="actionButton"
2467
2459
  data-selector-id="box"
2468
2460
  data-test-id="actionButton"
2469
- tabindex="0"
2470
2461
  >
2471
2462
  <div
2472
2463
  class="flex cover coldir both"
@@ -2506,7 +2497,6 @@ exports[`ActionButton renders with size - medium 1`] = `
2506
2497
  data-id="actionButton"
2507
2498
  data-selector-id="box"
2508
2499
  data-test-id="actionButton"
2509
- tabindex="0"
2510
2500
  >
2511
2501
  <div
2512
2502
  class="flex cover coldir both"
@@ -2546,7 +2536,6 @@ exports[`ActionButton renders with size - small 1`] = `
2546
2536
  data-id="actionButton"
2547
2537
  data-selector-id="box"
2548
2538
  data-test-id="actionButton"
2549
- tabindex="0"
2550
2539
  >
2551
2540
  <div
2552
2541
  class="flex cover coldir both"
@@ -2586,7 +2575,6 @@ exports[`ActionButton renders with subText 1`] = `
2586
2575
  data-id="actionButton"
2587
2576
  data-selector-id="box"
2588
2577
  data-test-id="actionButton"
2589
- tabindex="0"
2590
2578
  >
2591
2579
  <div
2592
2580
  class="flex cover coldir both"
@@ -2635,7 +2623,6 @@ exports[`ActionButton renders with text 1`] = `
2635
2623
  data-id="actionButton"
2636
2624
  data-selector-id="box"
2637
2625
  data-test-id="actionButton"
2638
- tabindex="0"
2639
2626
  >
2640
2627
  <div
2641
2628
  class="flex cover coldir both"
package/lib/ActionButton/props/defaultProps.js CHANGED
@@ -21,6 +21,7 @@ var defaultProps = {
21
21
  removeChildrenTooltip: false,
22
22
  innerClassName: '',
23
23
  isAbsolutePositioningNeeded: true,
24
- isRestrictScroll: false
24
+ isRestrictScroll: false,
25
+ a11yAttributes: {}
25
26
  };
26
27
  exports.defaultProps = defaultProps;
package/lib/ActionButton/props/propTypes.js CHANGED
@@ -43,6 +43,9 @@ var propTypes = {
43
43
  isAbsolutePositioningNeeded: _propTypes["default"].bool,
44
44
  isRestrictScroll: _propTypes["default"].bool,
45
45
  positionsOffset: _propTypes["default"].object,
46
- targetOffset: _propTypes["default"].object
46
+ targetOffset: _propTypes["default"].object,
47
+ a11yAttributes: _propTypes["default"].shape({
48
+ splitButton: _propTypes["default"].object
49
+ })
47
50
  };
48
51
  exports.propTypes = propTypes;