@elastic/eui 88.3.0 → 88.4.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (114) hide show
  1. package/dist/eui_theme_dark.css +7 -142
  2. package/dist/eui_theme_dark.min.css +1 -1
  3. package/dist/eui_theme_light.css +7 -142
  4. package/dist/eui_theme_light.min.css +1 -1
  5. package/es/components/basic_table/in_memory_table.js +85 -34
  6. package/es/components/card/card.js +3 -3
  7. package/es/components/combo_box/combo_box.js +16 -4
  8. package/es/components/combo_box/combo_box_input/combo_box_input.js +4 -1
  9. package/es/components/combo_box/combo_box_input/combo_box_pill.js +5 -1
  10. package/es/components/combo_box/combo_box_options_list/combo_box_option.js +2 -0
  11. package/es/components/combo_box/combo_box_options_list/combo_box_options_list.js +62 -13
  12. package/es/components/datagrid/controls/column_selector.js +5 -3
  13. package/es/components/datagrid/controls/column_sorting_draggable.js +4 -1
  14. package/es/components/description_list/description_list_title.js +0 -1
  15. package/es/components/description_list/description_list_title.styles.js +1 -1
  16. package/es/components/drag_and_drop/draggable.js +18 -23
  17. package/es/components/drag_and_drop/draggable.styles.js +56 -0
  18. package/es/components/drag_and_drop/droppable.js +24 -21
  19. package/es/components/drag_and_drop/droppable.styles.js +51 -0
  20. package/es/components/search_bar/search_box.js +54 -88
  21. package/es/components/table/table_pagination/table_pagination.js +1 -0
  22. package/es/components/text_truncate/text_truncate.js +12 -6
  23. package/es/components/text_truncate/text_truncate.styles.js +10 -10
  24. package/es/test/rtl/custom_render.js +1 -1
  25. package/eui.d.ts +480 -420
  26. package/i18ntokens.json +142 -88
  27. package/lib/components/basic_table/in_memory_table.js +85 -34
  28. package/lib/components/card/card.js +3 -3
  29. package/lib/components/combo_box/combo_box.js +16 -4
  30. package/lib/components/combo_box/combo_box_input/combo_box_input.js +4 -1
  31. package/lib/components/combo_box/combo_box_input/combo_box_pill.js +5 -1
  32. package/lib/components/combo_box/combo_box_options_list/combo_box_option.js +2 -0
  33. package/lib/components/combo_box/combo_box_options_list/combo_box_options_list.js +62 -13
  34. package/lib/components/datagrid/controls/column_selector.js +4 -2
  35. package/lib/components/datagrid/controls/column_sorting_draggable.js +4 -1
  36. package/lib/components/description_list/description_list_title.js +0 -1
  37. package/lib/components/description_list/description_list_title.styles.js +1 -1
  38. package/lib/components/drag_and_drop/draggable.js +17 -22
  39. package/lib/components/drag_and_drop/draggable.styles.js +62 -0
  40. package/lib/components/drag_and_drop/droppable.js +26 -22
  41. package/lib/components/drag_and_drop/droppable.styles.js +57 -0
  42. package/lib/components/search_bar/search_box.js +61 -93
  43. package/lib/components/table/table_pagination/table_pagination.js +1 -0
  44. package/lib/components/text_truncate/text_truncate.js +10 -4
  45. package/lib/components/text_truncate/text_truncate.styles.js +10 -10
  46. package/lib/test/rtl/custom_render.js +2 -2
  47. package/optimize/es/components/basic_table/in_memory_table.js +62 -34
  48. package/optimize/es/components/card/card.js +3 -3
  49. package/optimize/es/components/combo_box/combo_box.js +6 -4
  50. package/optimize/es/components/combo_box/combo_box_input/combo_box_input.js +2 -1
  51. package/optimize/es/components/combo_box/combo_box_input/combo_box_pill.js +3 -1
  52. package/optimize/es/components/combo_box/combo_box_options_list/combo_box_options_list.js +52 -10
  53. package/optimize/es/components/datagrid/controls/column_selector.js +5 -3
  54. package/optimize/es/components/datagrid/controls/column_sorting_draggable.js +4 -1
  55. package/optimize/es/components/description_list/description_list_title.js +0 -1
  56. package/optimize/es/components/description_list/description_list_title.styles.js +1 -1
  57. package/optimize/es/components/drag_and_drop/draggable.js +17 -22
  58. package/optimize/es/components/drag_and_drop/draggable.styles.js +56 -0
  59. package/optimize/es/components/drag_and_drop/droppable.js +23 -20
  60. package/optimize/es/components/drag_and_drop/droppable.styles.js +51 -0
  61. package/optimize/es/components/search_bar/search_box.js +50 -83
  62. package/optimize/es/components/table/table_pagination/table_pagination.js +1 -0
  63. package/optimize/es/components/text_truncate/text_truncate.js +12 -6
  64. package/optimize/es/components/text_truncate/text_truncate.styles.js +10 -10
  65. package/optimize/es/test/rtl/custom_render.js +1 -1
  66. package/optimize/lib/components/basic_table/in_memory_table.js +62 -34
  67. package/optimize/lib/components/card/card.js +3 -3
  68. package/optimize/lib/components/combo_box/combo_box.js +6 -4
  69. package/optimize/lib/components/combo_box/combo_box_input/combo_box_input.js +2 -1
  70. package/optimize/lib/components/combo_box/combo_box_input/combo_box_pill.js +3 -1
  71. package/optimize/lib/components/combo_box/combo_box_options_list/combo_box_options_list.js +52 -10
  72. package/optimize/lib/components/datagrid/controls/column_selector.js +4 -2
  73. package/optimize/lib/components/datagrid/controls/column_sorting_draggable.js +4 -1
  74. package/optimize/lib/components/description_list/description_list_title.js +0 -1
  75. package/optimize/lib/components/description_list/description_list_title.styles.js +1 -1
  76. package/optimize/lib/components/drag_and_drop/draggable.js +16 -21
  77. package/optimize/lib/components/drag_and_drop/draggable.styles.js +62 -0
  78. package/optimize/lib/components/drag_and_drop/droppable.js +25 -21
  79. package/optimize/lib/components/drag_and_drop/droppable.styles.js +57 -0
  80. package/optimize/lib/components/search_bar/search_box.js +57 -89
  81. package/optimize/lib/components/table/table_pagination/table_pagination.js +1 -0
  82. package/optimize/lib/components/text_truncate/text_truncate.js +10 -4
  83. package/optimize/lib/components/text_truncate/text_truncate.styles.js +10 -10
  84. package/optimize/lib/test/rtl/custom_render.js +2 -2
  85. package/package.json +4 -4
  86. package/src/components/combo_box/combo_box_input/_combo_box_pill.scss +0 -1
  87. package/src/components/combo_box/combo_box_options_list/_combo_box_options_list.scss +8 -0
  88. package/src/components/index.scss +0 -1
  89. package/src/themes/amsterdam/overrides/_index.scss +0 -1
  90. package/test-env/components/basic_table/in_memory_table.js +85 -34
  91. package/test-env/components/card/card.js +3 -3
  92. package/test-env/components/combo_box/combo_box.js +16 -4
  93. package/test-env/components/combo_box/combo_box_input/combo_box_input.js +4 -1
  94. package/test-env/components/combo_box/combo_box_input/combo_box_pill.js +5 -1
  95. package/test-env/components/combo_box/combo_box_options_list/combo_box_option.js +2 -0
  96. package/test-env/components/combo_box/combo_box_options_list/combo_box_options_list.js +61 -12
  97. package/test-env/components/datagrid/controls/column_selector.js +4 -2
  98. package/test-env/components/datagrid/controls/column_sorting_draggable.js +4 -1
  99. package/test-env/components/description_list/description_list_title.js +0 -1
  100. package/test-env/components/description_list/description_list_title.styles.js +1 -1
  101. package/test-env/components/drag_and_drop/draggable.js +17 -22
  102. package/test-env/components/drag_and_drop/draggable.styles.js +62 -0
  103. package/test-env/components/drag_and_drop/droppable.js +26 -22
  104. package/test-env/components/drag_and_drop/droppable.styles.js +57 -0
  105. package/test-env/components/search_bar/search_box.js +60 -88
  106. package/test-env/components/table/table_pagination/table_pagination.js +1 -0
  107. package/test-env/components/text_truncate/text_truncate.js +10 -4
  108. package/test-env/components/text_truncate/text_truncate.styles.js +10 -10
  109. package/test-env/test/rtl/custom_render.js +2 -2
  110. package/src/components/drag_and_drop/_draggable.scss +0 -41
  111. package/src/components/drag_and_drop/_droppable.scss +0 -40
  112. package/src/components/drag_and_drop/_index.scss +0 -3
  113. package/src/components/drag_and_drop/_variables.scss +0 -5
  114. package/src/themes/amsterdam/overrides/_description_list.scss +0 -7
@@ -1427,10 +1427,6 @@ The following files still use the Sass version:
1427
1427
  -ms-text-size-adjust: 100%;
1428
1428
  -webkit-font-kerning: normal;
1429
1429
  font-kerning: normal;
1430
- max-width: 100%;
1431
- overflow: hidden !important;
1432
- text-overflow: ellipsis !important;
1433
- white-space: nowrap !important;
1434
1430
  line-height: 24px;
1435
1431
  font-size: 14px;
1436
1432
  padding: 0;
@@ -1481,10 +1477,17 @@ The following files still use the Sass version:
1481
1477
  -webkit-transform: none !important;
1482
1478
  transform: none !important;
1483
1479
  top: 0;
1480
+ /* Kibana FTR affordance - without this, Selenium complains about the overlaid
1481
+ text intercepting the button click. Since `title` is always present, and
1482
+ users can't highlight or copy combobox options anyway, we might as well
1483
+ disable clicks on text */
1484
1484
  }
1485
1485
  .euiComboBoxOptionsList .euiFilterSelectItem__content {
1486
1486
  margin-block: 0 !important;
1487
1487
  }
1488
+ .euiComboBoxOptionsList .euiTextTruncate {
1489
+ pointer-events: none;
1490
+ }
1488
1491
 
1489
1492
  .euiComboBoxOptionsList__empty {
1490
1493
  overflow-wrap: break-word !important;
@@ -3397,140 +3400,6 @@ The following files still use the Sass version:
3397
3400
  row-gap: 0;
3398
3401
  }
3399
3402
 
3400
- .euiDraggable.euiDraggable--isDragging {
3401
- z-index: 9000 !important;
3402
- }
3403
- .euiDraggable.euiDraggable--hasClone:not(.euiDraggable--isDragging) {
3404
- -webkit-transform: none !important;
3405
- transform: none !important;
3406
- }
3407
- .euiDraggable.euiDraggable--withoutDropAnimation {
3408
- transition-duration: 0.001s !important;
3409
- }
3410
- .euiDraggable:focus > .euiDraggable__item, .euiDraggable.euiDraggable--hasCustomDragHandle > .euiDraggable__item [data-react-beautiful-dnd-drag-handle]:focus {
3411
- outline: 2px solid currentColor;
3412
- }
3413
- .euiDraggable:focus > .euiDraggable__item:focus-visible, .euiDraggable.euiDraggable--hasCustomDragHandle > .euiDraggable__item [data-react-beautiful-dnd-drag-handle]:focus:focus-visible {
3414
- outline-style: auto;
3415
- }
3416
- .euiDraggable:focus > .euiDraggable__item:not(:focus-visible), .euiDraggable.euiDraggable--hasCustomDragHandle > .euiDraggable__item [data-react-beautiful-dnd-drag-handle]:focus:not(:focus-visible) {
3417
- outline: none;
3418
- }
3419
- .euiDraggable .euiDraggable__item.euiDraggable__item--isDisabled {
3420
- cursor: not-allowed;
3421
- }
3422
- .euiDraggable--s {
3423
- padding: 2px;
3424
- }
3425
-
3426
- .euiDraggable--m {
3427
- padding: 4px;
3428
- }
3429
-
3430
- .euiDraggable--l {
3431
- padding: 8px;
3432
- }
3433
-
3434
- .euiDroppable {
3435
- transition: background-color 500ms ease;
3436
- }
3437
- .euiDroppable.euiDroppable--isDraggingType:not(.euiDroppable--isDisabled) {
3438
- background-color: rgba(125, 222, 216, 0.1);
3439
- }
3440
- .euiDroppable.euiDroppable--isDraggingType:not(.euiDroppable--isDisabled).euiDroppable--isDraggingOver {
3441
- background-color: rgba(125, 222, 216, 0.25);
3442
- }
3443
- .euiDroppable .euiDroppable__placeholder.euiDroppable__placeholder--isHidden {
3444
- display: none !important;
3445
- }
3446
-
3447
- .euiDroppable--withPanel {
3448
- -webkit-flex-grow: 1;
3449
- flex-grow: 1;
3450
- }
3451
- .euiDroppable--withPanel.euiDroppable--withPanel--flexGrowZero {
3452
- -webkit-flex-grow: 0;
3453
- flex-grow: 0;
3454
- }
3455
- .euiDroppable--withPanel.euiDroppable--withPanel--hasShadow {
3456
- box-shadow: 0 0.9px 4px -1px rgba(0, 0, 0, 0.2), 0 2.6px 8px -1px rgba(0, 0, 0, 0.15), 0 5.7px 12px -1px rgba(0, 0, 0, 0.125), 0 15px 15px -1px rgba(0, 0, 0, 0.1);
3457
- }
3458
- .euiDroppable--withPanel.euiDroppable--withPanel--hasBorder {
3459
- border: 1px solid #343741;
3460
- box-shadow: none;
3461
- }
3462
- .euiDroppable--withPanel.euiDroppable--withPanel--isClickable {
3463
- transition: all 150ms cubic-bezier(0.694, 0.0482, 0.335, 1);
3464
- }
3465
- .euiDroppable--withPanel.euiDroppable--withPanel--isClickable:enabled {
3466
- display: block;
3467
- width: 100%;
3468
- text-align: left;
3469
- }
3470
- .euiDroppable--withPanel.euiDroppable--withPanel--isClickable:hover, .euiDroppable--withPanel.euiDroppable--withPanel--isClickable:focus {
3471
- box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25), 0 3.6px 13px rgba(0, 0, 0, 0.175), 0 8.4px 23px rgba(0, 0, 0, 0.15), 0 23px 35px rgba(0, 0, 0, 0.125);
3472
- -webkit-transform: translateY(-2px);
3473
- transform: translateY(-2px);
3474
- cursor: pointer;
3475
- }
3476
- .euiDroppable--withPanel.euiDroppable--withPanel--borderRadiusNone {
3477
- border-radius: 0;
3478
- }
3479
- .euiDroppable--withPanel.euiDroppable--withPanel--borderRadiusMedium {
3480
- border-radius: 6px;
3481
- }
3482
- .euiDroppable--withPanel.euiDroppable--withPanel--transparent {
3483
- background-color: transparent;
3484
- }
3485
- .euiDroppable--withPanel.euiDroppable--withPanel--plain {
3486
- background-color: #1D1E24;
3487
- }
3488
- .euiDroppable--withPanel.euiDroppable--withPanel--subdued {
3489
- background-color: #141519;
3490
- }
3491
- .euiDroppable--withPanel.euiDroppable--withPanel--accent {
3492
- background-color: #4a2b39;
3493
- }
3494
- .euiDroppable--withPanel.euiDroppable--withPanel--primary {
3495
- background-color: #103148;
3496
- }
3497
- .euiDroppable--withPanel.euiDroppable--withPanel--success {
3498
- background-color: #264341;
3499
- }
3500
- .euiDroppable--withPanel.euiDroppable--withPanel--warning {
3501
- background-color: #493f22;
3502
- }
3503
- .euiDroppable--withPanel.euiDroppable--withPanel--danger {
3504
- background-color: #4a201e;
3505
- }
3506
-
3507
- .euiDroppable--withPanel {
3508
- box-shadow: 0 0.9px 4px -1px rgba(0, 0, 0, 0.2), 0 2.6px 8px -1px rgba(0, 0, 0, 0.15), 0 5.7px 12px -1px rgba(0, 0, 0, 0.125), 0 15px 15px -1px rgba(0, 0, 0, 0.1);
3509
- border-radius: 6px;
3510
- }
3511
-
3512
- .euiDroppable--noGrow {
3513
- -webkit-flex-grow: 0;
3514
- flex-grow: 0;
3515
- }
3516
-
3517
- .euiDroppable--grow {
3518
- -webkit-flex-grow: 1;
3519
- flex-grow: 1;
3520
- }
3521
-
3522
- .euiDroppable--s {
3523
- padding: 2px;
3524
- }
3525
-
3526
- .euiDroppable--m {
3527
- padding: 4px;
3528
- }
3529
-
3530
- .euiDroppable--l {
3531
- padding: 8px;
3532
- }
3533
-
3534
3403
  .euiEmptyPrompt {
3535
3404
  text-align: center;
3536
3405
  margin: auto;
@@ -8858,10 +8727,6 @@ button.euiSuggestItem:hover .euiSuggestItem__label, button.euiSuggestItem:focus
8858
8727
  line-height: 1.7142857143rem;
8859
8728
  }
8860
8729
 
8861
- .euiDescriptionList.euiDescriptionList--inline.euiDescriptionList--compressed .euiDescriptionList__title {
8862
- line-height: 1.5;
8863
- }
8864
-
8865
8730
  .euiFormControlLayout--group {
8866
8731
  border-radius: 6px;
8867
8732
  background-color: #2c2f37;