@elastic/eui 108.0.0 → 109.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 (59) hide show
  1. package/es/components/basic_table/collapsed_item_actions.js +3 -1
  2. package/es/components/basic_table/default_item_action.js +7 -4
  3. package/es/components/button/button_group/button_group_button.js +2 -3
  4. package/es/components/datagrid/body/header/column_actions.js +5 -21
  5. package/es/components/datagrid/body/header/data_grid_header_cell.js +6 -4
  6. package/es/components/datagrid/body/header/data_grid_header_cell.styles.js +8 -2
  7. package/es/components/datagrid/body/header/data_grid_header_cell_wrapper.js +5 -2
  8. package/es/components/form/file_picker/file_picker.styles.js +3 -3
  9. package/es/components/icon/assets/paper_clip.js +1 -1
  10. package/es/components/icon/assets/streams_wired.js +3 -2
  11. package/es/services/theme/high_contrast_overrides.js +5 -1
  12. package/eui.d.ts +16 -3
  13. package/lib/components/basic_table/collapsed_item_actions.js +3 -1
  14. package/lib/components/basic_table/default_item_action.js +7 -4
  15. package/lib/components/button/button_group/button_group_button.js +2 -3
  16. package/lib/components/datagrid/body/header/column_actions.js +5 -21
  17. package/lib/components/datagrid/body/header/data_grid_header_cell.js +6 -4
  18. package/lib/components/datagrid/body/header/data_grid_header_cell.styles.js +8 -1
  19. package/lib/components/datagrid/body/header/data_grid_header_cell_wrapper.js +5 -2
  20. package/lib/components/form/file_picker/file_picker.styles.js +3 -3
  21. package/lib/components/icon/assets/paper_clip.js +1 -1
  22. package/lib/components/icon/assets/streams_wired.js +3 -2
  23. package/lib/components/icon/svgs/paper_clip.svg +3 -3
  24. package/lib/services/theme/high_contrast_overrides.js +5 -1
  25. package/optimize/es/components/basic_table/collapsed_item_actions.js +3 -1
  26. package/optimize/es/components/basic_table/default_item_action.js +7 -4
  27. package/optimize/es/components/button/button_group/button_group_button.js +1 -2
  28. package/optimize/es/components/datagrid/body/header/column_actions.js +5 -21
  29. package/optimize/es/components/datagrid/body/header/data_grid_header_cell.js +6 -4
  30. package/optimize/es/components/datagrid/body/header/data_grid_header_cell.styles.js +8 -2
  31. package/optimize/es/components/datagrid/body/header/data_grid_header_cell_wrapper.js +4 -2
  32. package/optimize/es/components/form/file_picker/file_picker.styles.js +3 -3
  33. package/optimize/es/components/icon/assets/paper_clip.js +1 -1
  34. package/optimize/es/components/icon/assets/streams_wired.js +3 -2
  35. package/optimize/es/services/theme/high_contrast_overrides.js +5 -1
  36. package/optimize/lib/components/basic_table/collapsed_item_actions.js +3 -1
  37. package/optimize/lib/components/basic_table/default_item_action.js +7 -4
  38. package/optimize/lib/components/button/button_group/button_group_button.js +1 -2
  39. package/optimize/lib/components/datagrid/body/header/column_actions.js +5 -21
  40. package/optimize/lib/components/datagrid/body/header/data_grid_header_cell.js +6 -4
  41. package/optimize/lib/components/datagrid/body/header/data_grid_header_cell.styles.js +8 -1
  42. package/optimize/lib/components/datagrid/body/header/data_grid_header_cell_wrapper.js +4 -2
  43. package/optimize/lib/components/form/file_picker/file_picker.styles.js +3 -3
  44. package/optimize/lib/components/icon/assets/paper_clip.js +1 -1
  45. package/optimize/lib/components/icon/assets/streams_wired.js +3 -2
  46. package/optimize/lib/components/icon/svgs/paper_clip.svg +3 -3
  47. package/optimize/lib/services/theme/high_contrast_overrides.js +5 -1
  48. package/package.json +4 -4
  49. package/test-env/components/basic_table/collapsed_item_actions.js +3 -1
  50. package/test-env/components/basic_table/default_item_action.js +7 -4
  51. package/test-env/components/button/button_group/button_group_button.js +2 -3
  52. package/test-env/components/datagrid/body/header/column_actions.js +5 -21
  53. package/test-env/components/datagrid/body/header/data_grid_header_cell.js +6 -4
  54. package/test-env/components/datagrid/body/header/data_grid_header_cell.styles.js +8 -1
  55. package/test-env/components/datagrid/body/header/data_grid_header_cell_wrapper.js +5 -2
  56. package/test-env/components/form/file_picker/file_picker.styles.js +3 -3
  57. package/test-env/components/icon/assets/paper_clip.js +1 -1
  58. package/test-env/components/icon/assets/streams_wired.js +3 -2
  59. package/test-env/services/theme/high_contrast_overrides.js +5 -1
@@ -29,17 +29,18 @@ var EuiIconStreamsWired = function EuiIconStreamsWired(_ref) {
29
29
  xmlns: "http://www.w3.org/2000/svg",
30
30
  width: 16,
31
31
  height: 16,
32
+ fill: "none",
32
33
  viewBox: "0 0 16 16",
33
34
  "aria-labelledby": titleId
34
35
  }, props), title ? (0, _react2.jsx)("title", {
35
36
  id: titleId
36
37
  }, title) : null, (0, _react2.jsx)("path", {
37
38
  fillRule: "evenodd",
38
- d: "M13.5 1a1.5 1.5 0 1 1-1.413 2H11.5A1.5 1.5 0 0 0 10 4.5v1c0 .564-.19 1.082-.504 1.5H9.5l-.048.06a2.58 2.58 0 0 1-.352.36c-.01.01-.021.017-.032.025a2.501 2.501 0 0 1-.142.108l-.043.03c-.055.036-.11.07-.168.103l-.047.024c-.057.03-.115.06-.175.085-.018.008-.036.014-.055.021A2.475 2.475 0 0 1 7.5 8h-.504c.315.418.504.936.504 1.5v1A1.5 1.5 0 0 0 9 12h3.087a1.5 1.5 0 1 1 0 1H9a2.5 2.5 0 0 1-2.5-2.5v-1A1.5 1.5 0 0 0 5 8H3.913a1.5 1.5 0 1 1 0-1H7.5A1.5 1.5 0 0 0 9 5.5v-1A2.5 2.5 0 0 1 11.5 2h.587A1.5 1.5 0 0 1 13.5 1Zm0 11a.5.5 0 1 0 0 1 .5.5 0 0 0 0-1Zm-11-5a.5.5 0 1 0 0 1 .5.5 0 0 0 0-1Zm11-5a.5.5 0 1 0 0 1 .5.5 0 0 0 0-1Z",
39
+ d: "M13.5 1a1.5 1.5 0 1 1-1.413 2H11.5A1.5 1.5 0 0 0 10 4.5V6a2.49 2.49 0 0 1-.504 1.5H9.5l-.048.06a2.58 2.58 0 0 1-.352.36c-.01.01-.021.017-.032.025a2.496 2.496 0 0 1-.142.108l-.043.03c-.055.036-.11.07-.168.103l-.047.024c-.057.03-.115.06-.175.085-.018.008-.036.014-.055.021A2.475 2.475 0 0 1 7.5 8.5h-.504c.315.418.504.936.504 1.5v1.5A1.5 1.5 0 0 0 9 13h3.087a1.5 1.5 0 1 1 0 1H9a2.5 2.5 0 0 1-2.5-2.5V10A1.5 1.5 0 0 0 5 8.5H3.913a1.5 1.5 0 1 1 0-1H7.5A1.5 1.5 0 0 0 9 6V4.5A2.5 2.5 0 0 1 11.5 2h.587A1.5 1.5 0 0 1 13.5 1Zm0 12a.5.5 0 1 0 0 1 .5.5 0 0 0 0-1Zm-11-5.5a.5.5 0 1 0 0 1 .5.5 0 0 0 0-1Zm11-5.5a.5.5 0 1 0 0 1 .5.5 0 0 0 0-1Z",
39
40
  clipRule: "evenodd"
40
41
  }), (0, _react2.jsx)("path", {
41
42
  fillRule: "evenodd",
42
- d: "M13.5 6a1.5 1.5 0 1 1-1.413 2H9.948c.293-.287.536-.625.714-1h1.425A1.5 1.5 0 0 1 13.5 6Zm0 1a.5.5 0 1 0 0 1 .5.5 0 0 0 0-1Z",
43
+ d: "M13.5 6.5a1.5 1.5 0 1 1-1.413 2H9.948c.293-.287.536-.625.714-1h1.425a1.5 1.5 0 0 1 1.413-1Zm0 1a.5.5 0 1 0 0 1 .5.5 0 0 0 0-1Z",
43
44
  clipRule: "evenodd"
44
45
  }));
45
46
  };
@@ -1,3 +1,3 @@
1
- <svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
2
- <path d="M9.84 2.019L3.046 8.57c-.987.952-1.133 2.517-.199 3.516.951 1.021 2.58 1.106 3.64.19.034-.03.068-.061.1-.092l5.655-5.452a.484.484 0 000-.703.53.53 0 00-.729 0L5.92 11.421c-.572.551-1.505.657-2.131.163a1.455 1.455 0 01-.118-2.211l6.899-6.651a2.646 2.646 0 013.644 0 2.422 2.422 0 010 3.513L7.3 12.901c-1.333 1.285-3.497 1.493-4.95.336-1.54-1.22-1.764-3.411-.5-4.897.075-.088.154-.172.238-.252l5.78-5.572a.484.484 0 000-.703.53.53 0 00-.73 0l-5.78 5.572a4.36 4.36 0 000 6.324c2.188 2.109 5.202 1.31 6.66-.095l6.925-6.676a3.39 3.39 0 000-4.92C13.534.66 11.25.66 9.841 2.019z"/>
3
- </svg>
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16">
2
+ <path d="M7 11C7 11.4229 7.10536 11.6483 7.22852 11.7715C7.35168 11.8946 7.57707 12 8 12C8.42293 12 8.64832 11.8946 8.77148 11.7715C8.89464 11.6483 9 11.4229 9 11V5H10V11C10 11.5771 9.85536 12.1017 9.47852 12.4785C9.10168 12.8554 8.57707 13 8 13C7.42293 13 6.89832 12.8554 6.52148 12.4785C6.14464 12.1017 6 11.5771 6 11V4C6 3.28108 6.21527 2.53178 6.71582 1.9541C7.22667 1.3647 7.99544 1 9 1C10.0046 1 10.7733 1.3647 11.2842 1.9541C11.7847 2.53178 12 3.28108 12 4V11C12 12.103 11.6546 13.1101 10.957 13.8447C10.2555 14.5834 9.24184 15 8 15C6.75816 15 5.74451 14.5834 5.04297 13.8447C4.34537 13.1101 4 12.103 4 11V4H5V11C5 11.8967 5.2785 12.64 5.76758 13.1553C6.25296 13.6664 6.98973 14 8 14C9.01027 14 9.74704 13.6664 10.2324 13.1553C10.7215 12.64 11 11.8967 11 11V4C11 3.46903 10.8402 2.96818 10.5283 2.6084C10.2266 2.26039 9.74507 2 9 2C8.25493 2 7.7734 2.26039 7.47168 2.6084C7.15985 2.96818 7 3.46903 7 4V11Z" />
3
+ </svg>
@@ -39,19 +39,23 @@ var useHighContrastModifications = exports.useHighContrastModifications = functi
39
39
  borderBasePrimary: systemTheme.colors.textPrimary,
40
40
  borderBaseAccent: systemTheme.colors.textAccent,
41
41
  borderBaseAccentSecondary: systemTheme.colors.textAccentSecondary,
42
+ borderBaseNeutral: systemTheme.colors.textNeutral,
42
43
  borderBaseSuccess: systemTheme.colors.textSuccess,
43
44
  borderBaseWarning: systemTheme.colors.textWarning,
45
+ borderBaseRisk: systemTheme.colors.textRisk,
44
46
  borderBaseDanger: systemTheme.colors.textDanger,
45
47
  borderBasePlain: borderColor,
46
48
  borderBaseSubdued: borderColor,
49
+ borderBaseProminent: borderColor,
47
50
  borderBaseDisabled: systemTheme.colors.textDisabled,
48
51
  borderBaseFloating: borderColor,
49
- borderBaseFormsControl: borderColor,
50
52
  borderStrongPrimary: systemTheme.colors.textPrimary,
51
53
  borderStrongAccent: systemTheme.colors.textAccent,
52
54
  borderStrongAccentSecondary: systemTheme.colors.textAccentSecondary,
55
+ borderStrongNeutral: systemTheme.colors.textNeutral,
53
56
  borderStrongSuccess: systemTheme.colors.textSuccess,
54
57
  borderStrongWarning: systemTheme.colors.textWarning,
58
+ borderStrongRisk: systemTheme.colors.textRisk,
55
59
  borderStrongDanger: systemTheme.colors.textDanger
56
60
  };
57
61
  return {
@@ -77,7 +77,9 @@ export var CollapsedItemActions = function CollapsedItemActions(_ref) {
77
77
  },
78
78
  toolTipContent: toolTipContent,
79
79
  toolTipProps: {
80
- delay: 'long'
80
+ delay: 'long',
81
+ // Avoid screen-readers announcing the same text twice
82
+ disableScreenReaderOutput: typeof buttonContent === 'string' && buttonContent === toolTipContent
81
83
  }
82
84
  }, buttonContent));
83
85
  }
@@ -30,6 +30,12 @@ export var DefaultItemAction = function DefaultItemAction(_ref) {
30
30
  var icon = action.icon ? callWithItemIfFunction(item)(action.icon) : undefined;
31
31
  var actionContent = callWithItemIfFunction(item)(action.name);
32
32
  var tooltipContent = callWithItemIfFunction(item)(action.description);
33
+ var tooltipProps = {
34
+ content: tooltipContent,
35
+ delay: 'long',
36
+ // Avoid screen-readers announcing the same text twice
37
+ disableScreenReaderOutput: typeof actionContent === 'string' && actionContent === tooltipContent
38
+ };
33
39
  var href = callWithItemIfFunction(item)(action.href);
34
40
  var dataTestSubj = callWithItemIfFunction(item)(action['data-test-subj']);
35
41
  var ariaLabelId = useGeneratedHtmlId();
@@ -73,8 +79,5 @@ export var DefaultItemAction = function DefaultItemAction(_ref) {
73
79
  flush: "right"
74
80
  }, actionContent);
75
81
  }
76
- return enabled ? ___EmotionJSX(React.Fragment, null, ___EmotionJSX(EuiToolTip, {
77
- content: tooltipContent,
78
- delay: "long"
79
- }, button), ariaLabelledBy) : ___EmotionJSX(React.Fragment, null, button, ariaLabelledBy);
82
+ return enabled ? ___EmotionJSX(React.Fragment, null, ___EmotionJSX(EuiToolTip, tooltipProps, button), ariaLabelledBy) : ___EmotionJSX(React.Fragment, null, button, ariaLabelledBy);
80
83
  };
@@ -27,8 +27,7 @@ export var EuiButtonGroupButton = function EuiButtonGroupButton(_ref) {
27
27
  id = _ref.id,
28
28
  isDisabled = _ref.isDisabled,
29
29
  isIconOnly = _ref.isIconOnly,
30
- _ref$isSelected = _ref.isSelected,
31
- isSelected = _ref$isSelected === void 0 ? false : _ref$isSelected,
30
+ isSelected = _ref.isSelected,
32
31
  label = _ref.label,
33
32
  value = _ref.value,
34
33
  size = _ref.size,
@@ -72,16 +72,6 @@ export var ColumnActions = /*#__PURE__*/memo(function (_ref) {
72
72
  var closePopover = useCallback(function () {
73
73
  setIsPopoverOpen(false);
74
74
  }, []);
75
- var _useState3 = useState(false),
76
- _useState4 = _slicedToArray(_useState3, 2),
77
- isActionsButtonFocused = _useState4[0],
78
- setIsActionsButtonFocused = _useState4[1];
79
- var onFocus = useCallback(function () {
80
- return setIsActionsButtonFocused(true);
81
- }, []);
82
- var onBlur = useCallback(function () {
83
- return setIsActionsButtonFocused(false);
84
- }, []);
85
75
  var actionsButtonAriaLabel = useEuiI18n('euiDataGridHeaderCell.actionsButtonAriaLabel', '{title}. Click to view column header actions.', {
86
76
  title: title
87
77
  });
@@ -96,10 +86,10 @@ export var ColumnActions = /*#__PURE__*/memo(function (_ref) {
96
86
  /**
97
87
  * Props to set on parent EuiDataGridHeaderCell
98
88
  */
99
- var _useState5 = useState(false),
100
- _useState6 = _slicedToArray(_useState5, 2),
101
- isColumnMoving = _useState6[0],
102
- setIsColumnMoving = _useState6[1];
89
+ var _useState3 = useState(false),
90
+ _useState4 = _slicedToArray(_useState3, 2),
91
+ isColumnMoving = _useState4[0],
92
+ setIsColumnMoving = _useState4[1];
103
93
  useEffect(function () {
104
94
  setPropsFromColumnActions({
105
95
  className: isPopoverOpen ? 'euiDataGridHeaderCell--isActionsPopoverOpen' : '',
@@ -145,17 +135,11 @@ export var ColumnActions = /*#__PURE__*/memo(function (_ref) {
145
135
  iconType: "boxesVertical",
146
136
  iconSize: "s",
147
137
  color: "text",
148
- css: styles.euiDataGridHeaderCell__actions,
149
138
  className: "euiDataGridHeaderCell__button",
150
139
  onClick: togglePopover,
151
140
  buttonRef: actionsButtonRef,
152
- onFocus: onFocus,
153
- onBlur: onBlur,
154
- tabIndex: 0 // Override EuiButtonIcon's conditional tabindex based on aria-hidden
155
- ,
156
- "aria-hidden": hasFocusTrap && !isActionsButtonFocused ? 'true' // prevent the actions button from being read on cell focus
157
- : undefined,
158
141
  "aria-label": hasFocusTrap ? actionsButtonAriaLabel : actionsEnterKeyInstructions,
142
+ css: [styles.euiDataGridHeaderCell__actions.action, styles.euiDataGridHeaderCell__actions.end, ";label:ColumnActions;"],
159
143
  "data-test-subj": "dataGridHeaderCellActionButton-".concat(id)
160
144
  }),
161
145
  isOpen: isPopoverOpen,
@@ -45,6 +45,7 @@ export var EuiDataGridHeaderCell = /*#__PURE__*/memo(function (_ref) {
45
45
  var width = columnWidths[id] || defaultColumnWidth;
46
46
  var columnType = schema[id] ? schema[id].columnType : null;
47
47
  var hasColumnActions = useHasColumnActions(actions);
48
+ var cellContentId = "dataGridHeaderCellContent-".concat(id);
48
49
  var classes = classnames(_defineProperty(_defineProperty({}, "euiDataGridHeaderCell--".concat(columnType), columnType), 'euiDataGridHeaderCell--hasColumnActions', hasColumnActions), displayHeaderCellProps === null || displayHeaderCellProps === void 0 ? void 0 : displayHeaderCellProps.className);
49
50
  var styles = useEuiMemoizedStyles(euiDataGridHeaderCellStyles);
50
51
  var contentStyles = [styles.euiDataGridHeaderCell__content, (columnType === 'numeric' || columnType === 'currency') && styles.right];
@@ -88,8 +89,7 @@ export var EuiDataGridHeaderCell = /*#__PURE__*/memo(function (_ref) {
88
89
  isLastColumn: isLastColumn,
89
90
  width: width,
90
91
  "aria-sort": ariaSort,
91
- "aria-label": displayAsText && "".concat(displayAsText, ", ") // ensure cell text content is read first, if available
92
- ,
92
+ "aria-labelledby": cellContentId,
93
93
  "aria-describedby": classnames(sortingAriaId, dragProps === null || dragProps === void 0 ? void 0 : dragProps['aria-describedby']),
94
94
  "data-column-moving": propsFromColumnActions['data-column-moving'] || (dragProps === null || dragProps === void 0 ? void 0 : dragProps['data-column-moving']) || undefined
95
95
  }), function (hasFocusTrap) {
@@ -98,11 +98,13 @@ export var EuiDataGridHeaderCell = /*#__PURE__*/memo(function (_ref) {
98
98
  }, ___EmotionJSX(EuiIcon, {
99
99
  type: "grabOmnidirectional",
100
100
  size: "s",
101
- css: styles.euiDataGridHeaderCell__actions
101
+ css: [styles.euiDataGridHeaderCell__actions.action, styles.euiDataGridHeaderCell__actions.start, ";label:EuiDataGridHeaderCell;"]
102
102
  })), ___EmotionJSX("div", {
103
103
  css: contentStyles,
104
104
  className: "euiDataGridHeaderCell__content",
105
- title: title
105
+ title: title,
106
+ id: cellContentId,
107
+ "aria-label": displayAsText ? displayAsText : typeof children === 'string' ? children : undefined
106
108
  }, children), sortingArrow, sortingScreenReaderText, hasColumnActions && ___EmotionJSX(ColumnActions, {
107
109
  index: index,
108
110
  id: id,
@@ -9,7 +9,6 @@
9
9
  import { css } from '@emotion/react';
10
10
  import { euiCanAnimate, euiTextTruncate, logicalCSS, logicalTextAlignCSS } from '../../../../global_styling';
11
11
  import { euiDataGridCellOutlineSelectors } from '../cell/data_grid_cell.styles';
12
-
13
12
  /**
14
13
  * Styles only applied to data header cell content, not control header cells
15
14
  */
@@ -17,11 +16,18 @@ export var euiDataGridHeaderCellStyles = function euiDataGridHeaderCellStyles(eu
17
16
  var euiTheme = euiThemeContext.euiTheme;
18
17
  var _euiDataGridCellOutli = euiDataGridCellOutlineSelectors('.euiDataGridHeaderCell'),
19
18
  header = _euiDataGridCellOutli.header;
19
+ var hideAnimation = function hideAnimation(margin, translateX) {
20
+ return "\n ".concat(header.hideActions, " & {\n ").concat(logicalCSS('margin-left', margin), "\n transform: translateX(").concat(translateX, ") scale(0.01);\n opacity: 0;\n }\n ");
21
+ };
20
22
  return {
21
23
  euiDataGridHeaderCell__content: /*#__PURE__*/css("flex-grow:1;", euiTextTruncate(), ";;label:euiDataGridHeaderCell__content;"),
22
24
  // Numeric and currency schemas are aligned to the right
23
25
  right: /*#__PURE__*/css(logicalTextAlignCSS('right'), ";;label:right;"),
24
26
  euiDataGridHeaderCell__popover: /*#__PURE__*/css(logicalCSS('margin-left', 'auto'), "line-height:0;;label:euiDataGridHeaderCell__popover;"),
25
- euiDataGridHeaderCell__actions: /*#__PURE__*/css("overflow:hidden;display:flex;", header.hideActions, " &{", logicalCSS('width', 0), " opacity:0;}", euiCanAnimate, "{transition:inline-size ", euiTheme.animation.fast, " ease-in,opacity ", euiTheme.animation.slow, " ease-in;transform:none!important;animation:none!important;};label:euiDataGridHeaderCell__actions;")
27
+ euiDataGridHeaderCell__actions: {
28
+ action: /*#__PURE__*/css("overflow:hidden;display:flex;max-inline-size:24px;", euiCanAnimate, "{transition:transform ", euiTheme.animation.fast, " ease-in,opacity ", euiTheme.animation.slow, " ease-in,margin-left ", euiTheme.animation.fast, " ease-in;animation:none!important;};label:action;"),
29
+ start: /*#__PURE__*/css(hideAnimation("-".concat(euiTheme.size.m), '0%'), ";;label:start;"),
30
+ end: /*#__PURE__*/css(hideAnimation("-".concat(euiTheme.size.l), '50%'), ";;label:end;")
31
+ }
26
32
  };
27
33
  };
@@ -1,7 +1,7 @@
1
1
  import _extends from "@babel/runtime/helpers/extends";
2
2
  import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
3
3
  import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
4
- var _excluded = ["id", "index", "isLastColumn", "width", "className", "children", "hasColumnActions", "isDragging", "onKeyDown", "aria-label"];
4
+ var _excluded = ["id", "index", "isLastColumn", "width", "className", "children", "hasColumnActions", "isDragging", "onKeyDown", "aria-label", "aria-labelledby"];
5
5
  /*
6
6
  * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
7
7
  * or more contributor license agreements. Licensed under the Elastic License
@@ -34,6 +34,7 @@ export var EuiDataGridHeaderCellWrapper = function EuiDataGridHeaderCellWrapper(
34
34
  isDragging = _ref.isDragging,
35
35
  _onKeyDown = _ref.onKeyDown,
36
36
  ariaLabel = _ref['aria-label'],
37
+ ariaLabelledby = _ref['aria-labelledby'],
37
38
  rest = _objectWithoutProperties(_ref, _excluded);
38
39
  var classes = classnames('euiDataGridHeaderCell', className);
39
40
  var styles = useEuiMemoizedStyles(euiDataGridHeaderCellWrapperStyles);
@@ -99,7 +100,8 @@ export var EuiDataGridHeaderCellWrapper = function EuiDataGridHeaderCellWrapper(
99
100
  style: width != null ? {
100
101
  width: "".concat(width, "px")
101
102
  } : {},
102
- "aria-label": renderFocusTrap ? ariaLabel : undefined
103
+ "aria-label": renderFocusTrap ? ariaLabel : undefined,
104
+ "aria-labelledby": renderFocusTrap ? ariaLabelledby : undefined
103
105
  }, rest), ___EmotionJSX(HandleInteractiveChildren, {
104
106
  cellEl: isDragging ? null : headerEl,
105
107
  renderFocusTrap: isDragging ? false : renderFocusTrap,
@@ -43,7 +43,7 @@ export var euiFilePickerStyles = function euiFilePickerStyles(euiThemeContext) {
43
43
  fontSize = _euiFontSize.fontSize,
44
44
  lineHeight = _euiFontSize.lineHeight;
45
45
  return {
46
- euiFilePicker: /*#__PURE__*/css("--euiFormControlLeftIconsCount:1;position:relative;border-radius:", formVariables.controlBorderRadius, ";&:has(input:focus){--euiFormControlStateColor:", formVariables.borderFocused, ";}&:hover{--euiFormControlStateColor:", highContrastMode ? euiTheme.border.color : formVariables.borderHovered, ";--euiFormControlStateStyle:solid;}&:focus-within{", highContrastModeStyles(euiThemeContext, {
46
+ euiFilePicker: /*#__PURE__*/css("--euiFormControlLeftIconsCount:1;position:relative;border-radius:", formVariables.controlBorderRadius, ";&:has(input:focus){--euiFormControlStateColor:", formVariables.borderFocused, ";}&:hover{--euiFormControlStateColor:", highContrastMode ? euiTheme.border.color : euiTheme.colors.borderInteractiveFormsHoverProminent, ";--euiFormControlStateStyle:", highContrastMode ? 'solid' : 'dashed', ";}&:focus-within{", highContrastModeStyles(euiThemeContext, {
47
47
  forced: "\n ".concat(euiFormControlShowBackgroundLine(euiThemeContext, formVariables.borderFocused), "\n ")
48
48
  }), ";};label:euiFilePicker;"),
49
49
  isDroppingFile: /*#__PURE__*/css("--euiFormControlStateColor:", euiTheme.colors.borderStrongSuccess, ";--euiFormControlStateStyle:", highContrastMode === 'forced' ? 'solid' : 'dashed', ";background-color:", euiTheme.components.forms.backgroundDropping, ";;label:isDroppingFile;"),
@@ -62,8 +62,8 @@ export var euiFilePickerStyles = function euiFilePickerStyles(euiThemeContext) {
62
62
  forced: "\n text-decoration: underline;\n "
63
63
  }), ";}.euiFilePicker__icon{transform:scale(1.05);}}};label:largeInteractive;")
64
64
  },
65
- euiFilePicker__prompt: /*#__PURE__*/css("pointer-events:none;font-size:", fontSize, ";line-height:1;", euiTextTruncate(), " color:", euiTheme.colors.textParagraph, ";border:", euiTheme.border.width.thin, " var(--euiFormControlStateStyle, dashed) var(--euiFormControlStateColor, ", formVariables.borderColor, ");", euiCanAnimate, "{transition:border-color ", euiTheme.animation.fast, " ease-in,background-color ", euiTheme.animation.fast, " ease-in;};label:euiFilePicker__prompt;"),
66
- disabled: /*#__PURE__*/css(formStyles.disabled, ";label:disabled;"),
65
+ euiFilePicker__prompt: /*#__PURE__*/css("pointer-events:none;font-size:", fontSize, ";line-height:1;", euiTextTruncate(), " color:", euiTheme.colors.textParagraph, ";border:", euiTheme.border.width.thin, " var(--euiFormControlStateStyle, dashed) var(--euiFormControlStateColor, ", euiTheme.colors.borderBaseProminent, ");", euiCanAnimate, "{transition:border-color ", euiTheme.animation.fast, " ease-in,background-color ", euiTheme.animation.fast, " ease-in;};label:euiFilePicker__prompt;"),
66
+ disabled: /*#__PURE__*/css(formStyles.disabled, "--euiFormControlStateColor:transparent;;label:disabled;"),
67
67
  // Skip the css() on the default height to avoid generating a className
68
68
  uncompressed: formStyles.uncompressed,
69
69
  compressed: /*#__PURE__*/css(formStyles.compressed, ";label:compressed;"),
@@ -26,7 +26,7 @@ var EuiIconPaperClip = function EuiIconPaperClip(_ref) {
26
26
  }, props), title ? ___EmotionJSX("title", {
27
27
  id: titleId
28
28
  }, title) : null, ___EmotionJSX("path", {
29
- d: "M9.84 2.019 3.046 8.57c-.987.952-1.133 2.517-.199 3.516.951 1.021 2.58 1.106 3.64.19.034-.03.068-.061.1-.092l5.655-5.452a.484.484 0 0 0 0-.703.53.53 0 0 0-.729 0L5.92 11.421c-.572.551-1.505.657-2.131.163a1.455 1.455 0 0 1-.118-2.211l6.899-6.651a2.646 2.646 0 0 1 3.644 0 2.422 2.422 0 0 1 0 3.513L7.3 12.901c-1.333 1.285-3.497 1.493-4.95.336-1.54-1.22-1.764-3.411-.5-4.897a3.33 3.33 0 0 1 .238-.252l5.78-5.572a.484.484 0 0 0 0-.703.53.53 0 0 0-.73 0l-5.78 5.572a4.36 4.36 0 0 0 0 6.324c2.188 2.109 5.202 1.31 6.66-.095l6.925-6.676a3.39 3.39 0 0 0 0-4.92C13.534.66 11.25.66 9.841 2.019z"
29
+ d: "M7 11c0 .423.105.648.229.771.123.124.348.229.771.229.423 0 .648-.105.771-.229.124-.123.229-.348.229-.771V5h1v6c0 .577-.145 1.102-.521 1.479C9.102 12.854 8.577 13 8 13c-.577 0-1.102-.145-1.479-.521C6.145 12.101 6 11.577 6 11V4c0-.719.215-1.468.716-2.046C7.226 1.364 7.996 1 9 1c1.005 0 1.773.365 2.284.954.5.578.716 1.327.716 2.046v7c0 1.103-.345 2.11-1.043 2.845C10.255 14.583 9.242 15 8 15c-1.242 0-2.255-.417-2.957-1.155C4.345 13.11 4 12.103 4 11V4h1v7c0 .897.279 1.64.768 2.155C6.253 13.666 6.99 14 8 14c1.01 0 1.747-.334 2.232-.845.49-.515.768-1.258.768-2.155V4c0-.531-.16-1.032-.472-1.392C10.227 2.26 9.745 2 9 2s-1.227.26-1.528.608C7.16 2.968 7 3.47 7 4v7Z"
30
30
  }));
31
31
  };
32
32
  export var icon = EuiIconPaperClip;
@@ -21,17 +21,18 @@ var EuiIconStreamsWired = function EuiIconStreamsWired(_ref) {
21
21
  xmlns: "http://www.w3.org/2000/svg",
22
22
  width: 16,
23
23
  height: 16,
24
+ fill: "none",
24
25
  viewBox: "0 0 16 16",
25
26
  "aria-labelledby": titleId
26
27
  }, props), title ? ___EmotionJSX("title", {
27
28
  id: titleId
28
29
  }, title) : null, ___EmotionJSX("path", {
29
30
  fillRule: "evenodd",
30
- d: "M13.5 1a1.5 1.5 0 1 1-1.413 2H11.5A1.5 1.5 0 0 0 10 4.5v1c0 .564-.19 1.082-.504 1.5H9.5l-.048.06a2.58 2.58 0 0 1-.352.36c-.01.01-.021.017-.032.025a2.501 2.501 0 0 1-.142.108l-.043.03c-.055.036-.11.07-.168.103l-.047.024c-.057.03-.115.06-.175.085-.018.008-.036.014-.055.021A2.475 2.475 0 0 1 7.5 8h-.504c.315.418.504.936.504 1.5v1A1.5 1.5 0 0 0 9 12h3.087a1.5 1.5 0 1 1 0 1H9a2.5 2.5 0 0 1-2.5-2.5v-1A1.5 1.5 0 0 0 5 8H3.913a1.5 1.5 0 1 1 0-1H7.5A1.5 1.5 0 0 0 9 5.5v-1A2.5 2.5 0 0 1 11.5 2h.587A1.5 1.5 0 0 1 13.5 1Zm0 11a.5.5 0 1 0 0 1 .5.5 0 0 0 0-1Zm-11-5a.5.5 0 1 0 0 1 .5.5 0 0 0 0-1Zm11-5a.5.5 0 1 0 0 1 .5.5 0 0 0 0-1Z",
31
+ d: "M13.5 1a1.5 1.5 0 1 1-1.413 2H11.5A1.5 1.5 0 0 0 10 4.5V6a2.49 2.49 0 0 1-.504 1.5H9.5l-.048.06a2.58 2.58 0 0 1-.352.36c-.01.01-.021.017-.032.025a2.496 2.496 0 0 1-.142.108l-.043.03c-.055.036-.11.07-.168.103l-.047.024c-.057.03-.115.06-.175.085-.018.008-.036.014-.055.021A2.475 2.475 0 0 1 7.5 8.5h-.504c.315.418.504.936.504 1.5v1.5A1.5 1.5 0 0 0 9 13h3.087a1.5 1.5 0 1 1 0 1H9a2.5 2.5 0 0 1-2.5-2.5V10A1.5 1.5 0 0 0 5 8.5H3.913a1.5 1.5 0 1 1 0-1H7.5A1.5 1.5 0 0 0 9 6V4.5A2.5 2.5 0 0 1 11.5 2h.587A1.5 1.5 0 0 1 13.5 1Zm0 12a.5.5 0 1 0 0 1 .5.5 0 0 0 0-1Zm-11-5.5a.5.5 0 1 0 0 1 .5.5 0 0 0 0-1Zm11-5.5a.5.5 0 1 0 0 1 .5.5 0 0 0 0-1Z",
31
32
  clipRule: "evenodd"
32
33
  }), ___EmotionJSX("path", {
33
34
  fillRule: "evenodd",
34
- d: "M13.5 6a1.5 1.5 0 1 1-1.413 2H9.948c.293-.287.536-.625.714-1h1.425A1.5 1.5 0 0 1 13.5 6Zm0 1a.5.5 0 1 0 0 1 .5.5 0 0 0 0-1Z",
35
+ d: "M13.5 6.5a1.5 1.5 0 1 1-1.413 2H9.948c.293-.287.536-.625.714-1h1.425a1.5 1.5 0 0 1 1.413-1Zm0 1a.5.5 0 1 0 0 1 .5.5 0 0 0 0-1Z",
35
36
  clipRule: "evenodd"
36
37
  }));
37
38
  };
@@ -33,19 +33,23 @@ export var useHighContrastModifications = function useHighContrastModifications(
33
33
  borderBasePrimary: systemTheme.colors.textPrimary,
34
34
  borderBaseAccent: systemTheme.colors.textAccent,
35
35
  borderBaseAccentSecondary: systemTheme.colors.textAccentSecondary,
36
+ borderBaseNeutral: systemTheme.colors.textNeutral,
36
37
  borderBaseSuccess: systemTheme.colors.textSuccess,
37
38
  borderBaseWarning: systemTheme.colors.textWarning,
39
+ borderBaseRisk: systemTheme.colors.textRisk,
38
40
  borderBaseDanger: systemTheme.colors.textDanger,
39
41
  borderBasePlain: borderColor,
40
42
  borderBaseSubdued: borderColor,
43
+ borderBaseProminent: borderColor,
41
44
  borderBaseDisabled: systemTheme.colors.textDisabled,
42
45
  borderBaseFloating: borderColor,
43
- borderBaseFormsControl: borderColor,
44
46
  borderStrongPrimary: systemTheme.colors.textPrimary,
45
47
  borderStrongAccent: systemTheme.colors.textAccent,
46
48
  borderStrongAccentSecondary: systemTheme.colors.textAccentSecondary,
49
+ borderStrongNeutral: systemTheme.colors.textNeutral,
47
50
  borderStrongSuccess: systemTheme.colors.textSuccess,
48
51
  borderStrongWarning: systemTheme.colors.textWarning,
52
+ borderStrongRisk: systemTheme.colors.textRisk,
49
53
  borderStrongDanger: systemTheme.colors.textDanger
50
54
  };
51
55
  return {
@@ -87,7 +87,9 @@ var CollapsedItemActions = exports.CollapsedItemActions = function CollapsedItem
87
87
  },
88
88
  toolTipContent: toolTipContent,
89
89
  toolTipProps: {
90
- delay: 'long'
90
+ delay: 'long',
91
+ // Avoid screen-readers announcing the same text twice
92
+ disableScreenReaderOutput: typeof buttonContent === 'string' && buttonContent === toolTipContent
91
93
  }
92
94
  }, buttonContent));
93
95
  }
@@ -39,6 +39,12 @@ var DefaultItemAction = exports.DefaultItemAction = function DefaultItemAction(_
39
39
  var icon = action.icon ? (0, _action_types.callWithItemIfFunction)(item)(action.icon) : undefined;
40
40
  var actionContent = (0, _action_types.callWithItemIfFunction)(item)(action.name);
41
41
  var tooltipContent = (0, _action_types.callWithItemIfFunction)(item)(action.description);
42
+ var tooltipProps = {
43
+ content: tooltipContent,
44
+ delay: 'long',
45
+ // Avoid screen-readers announcing the same text twice
46
+ disableScreenReaderOutput: typeof actionContent === 'string' && actionContent === tooltipContent
47
+ };
42
48
  var href = (0, _action_types.callWithItemIfFunction)(item)(action.href);
43
49
  var dataTestSubj = (0, _action_types.callWithItemIfFunction)(item)(action['data-test-subj']);
44
50
  var ariaLabelId = (0, _accessibility.useGeneratedHtmlId)();
@@ -82,8 +88,5 @@ var DefaultItemAction = exports.DefaultItemAction = function DefaultItemAction(_
82
88
  flush: "right"
83
89
  }, actionContent);
84
90
  }
85
- return enabled ? (0, _react2.jsx)(_react.default.Fragment, null, (0, _react2.jsx)(_tool_tip.EuiToolTip, {
86
- content: tooltipContent,
87
- delay: "long"
88
- }, button), ariaLabelledBy) : (0, _react2.jsx)(_react.default.Fragment, null, button, ariaLabelledBy);
91
+ return enabled ? (0, _react2.jsx)(_react.default.Fragment, null, (0, _react2.jsx)(_tool_tip.EuiToolTip, tooltipProps, button), ariaLabelledBy) : (0, _react2.jsx)(_react.default.Fragment, null, button, ariaLabelledBy);
89
92
  };
@@ -33,8 +33,7 @@ var EuiButtonGroupButton = exports.EuiButtonGroupButton = function EuiButtonGrou
33
33
  id = _ref.id,
34
34
  isDisabled = _ref.isDisabled,
35
35
  isIconOnly = _ref.isIconOnly,
36
- _ref$isSelected = _ref.isSelected,
37
- isSelected = _ref$isSelected === void 0 ? false : _ref$isSelected,
36
+ isSelected = _ref.isSelected,
38
37
  label = _ref.label,
39
38
  value = _ref.value,
40
39
  size = _ref.size,
@@ -79,16 +79,6 @@ var ColumnActions = exports.ColumnActions = /*#__PURE__*/(0, _react.memo)(functi
79
79
  var closePopover = (0, _react.useCallback)(function () {
80
80
  setIsPopoverOpen(false);
81
81
  }, []);
82
- var _useState3 = (0, _react.useState)(false),
83
- _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
84
- isActionsButtonFocused = _useState4[0],
85
- setIsActionsButtonFocused = _useState4[1];
86
- var onFocus = (0, _react.useCallback)(function () {
87
- return setIsActionsButtonFocused(true);
88
- }, []);
89
- var onBlur = (0, _react.useCallback)(function () {
90
- return setIsActionsButtonFocused(false);
91
- }, []);
92
82
  var actionsButtonAriaLabel = (0, _i18n.useEuiI18n)('euiDataGridHeaderCell.actionsButtonAriaLabel', '{title}. Click to view column header actions.', {
93
83
  title: title
94
84
  });
@@ -103,10 +93,10 @@ var ColumnActions = exports.ColumnActions = /*#__PURE__*/(0, _react.memo)(functi
103
93
  /**
104
94
  * Props to set on parent EuiDataGridHeaderCell
105
95
  */
106
- var _useState5 = (0, _react.useState)(false),
107
- _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
108
- isColumnMoving = _useState6[0],
109
- setIsColumnMoving = _useState6[1];
96
+ var _useState3 = (0, _react.useState)(false),
97
+ _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
98
+ isColumnMoving = _useState4[0],
99
+ setIsColumnMoving = _useState4[1];
110
100
  (0, _react.useEffect)(function () {
111
101
  setPropsFromColumnActions({
112
102
  className: isPopoverOpen ? 'euiDataGridHeaderCell--isActionsPopoverOpen' : '',
@@ -152,17 +142,11 @@ var ColumnActions = exports.ColumnActions = /*#__PURE__*/(0, _react.memo)(functi
152
142
  iconType: "boxesVertical",
153
143
  iconSize: "s",
154
144
  color: "text",
155
- css: styles.euiDataGridHeaderCell__actions,
156
145
  className: "euiDataGridHeaderCell__button",
157
146
  onClick: togglePopover,
158
147
  buttonRef: actionsButtonRef,
159
- onFocus: onFocus,
160
- onBlur: onBlur,
161
- tabIndex: 0 // Override EuiButtonIcon's conditional tabindex based on aria-hidden
162
- ,
163
- "aria-hidden": hasFocusTrap && !isActionsButtonFocused ? 'true' // prevent the actions button from being read on cell focus
164
- : undefined,
165
148
  "aria-label": hasFocusTrap ? actionsButtonAriaLabel : actionsEnterKeyInstructions,
149
+ css: [styles.euiDataGridHeaderCell__actions.action, styles.euiDataGridHeaderCell__actions.end, ";label:ColumnActions;"],
166
150
  "data-test-subj": "dataGridHeaderCellActionButton-".concat(id)
167
151
  }),
168
152
  isOpen: isPopoverOpen,
@@ -55,6 +55,7 @@ var EuiDataGridHeaderCell = exports.EuiDataGridHeaderCell = /*#__PURE__*/(0, _re
55
55
  var width = columnWidths[id] || defaultColumnWidth;
56
56
  var columnType = schema[id] ? schema[id].columnType : null;
57
57
  var hasColumnActions = (0, _column_actions.useHasColumnActions)(actions);
58
+ var cellContentId = "dataGridHeaderCellContent-".concat(id);
58
59
  var classes = (0, _classnames2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, "euiDataGridHeaderCell--".concat(columnType), columnType), 'euiDataGridHeaderCell--hasColumnActions', hasColumnActions), displayHeaderCellProps === null || displayHeaderCellProps === void 0 ? void 0 : displayHeaderCellProps.className);
59
60
  var styles = (0, _services.useEuiMemoizedStyles)(_data_grid_header_cell.euiDataGridHeaderCellStyles);
60
61
  var contentStyles = [styles.euiDataGridHeaderCell__content, (columnType === 'numeric' || columnType === 'currency') && styles.right];
@@ -98,8 +99,7 @@ var EuiDataGridHeaderCell = exports.EuiDataGridHeaderCell = /*#__PURE__*/(0, _re
98
99
  isLastColumn: isLastColumn,
99
100
  width: width,
100
101
  "aria-sort": ariaSort,
101
- "aria-label": displayAsText && "".concat(displayAsText, ", ") // ensure cell text content is read first, if available
102
- ,
102
+ "aria-labelledby": cellContentId,
103
103
  "aria-describedby": (0, _classnames2.default)(sortingAriaId, dragProps === null || dragProps === void 0 ? void 0 : dragProps['aria-describedby']),
104
104
  "data-column-moving": propsFromColumnActions['data-column-moving'] || (dragProps === null || dragProps === void 0 ? void 0 : dragProps['data-column-moving']) || undefined
105
105
  }), function (hasFocusTrap) {
@@ -108,11 +108,13 @@ var EuiDataGridHeaderCell = exports.EuiDataGridHeaderCell = /*#__PURE__*/(0, _re
108
108
  }, (0, _react2.jsx)(_icon.EuiIcon, {
109
109
  type: "grabOmnidirectional",
110
110
  size: "s",
111
- css: styles.euiDataGridHeaderCell__actions
111
+ css: [styles.euiDataGridHeaderCell__actions.action, styles.euiDataGridHeaderCell__actions.start, ";label:EuiDataGridHeaderCell;"]
112
112
  })), (0, _react2.jsx)("div", {
113
113
  css: contentStyles,
114
114
  className: "euiDataGridHeaderCell__content",
115
- title: title
115
+ title: title,
116
+ id: cellContentId,
117
+ "aria-label": displayAsText ? displayAsText : typeof children === 'string' ? children : undefined
116
118
  }, children), sortingArrow, sortingScreenReaderText, hasColumnActions && (0, _react2.jsx)(_column_actions.ColumnActions, {
117
119
  index: index,
118
120
  id: id,
@@ -22,11 +22,18 @@ var euiDataGridHeaderCellStyles = exports.euiDataGridHeaderCellStyles = function
22
22
  var euiTheme = euiThemeContext.euiTheme;
23
23
  var _euiDataGridCellOutli = (0, _data_grid_cell.euiDataGridCellOutlineSelectors)('.euiDataGridHeaderCell'),
24
24
  header = _euiDataGridCellOutli.header;
25
+ var hideAnimation = function hideAnimation(margin, translateX) {
26
+ return "\n ".concat(header.hideActions, " & {\n ").concat((0, _global_styling.logicalCSS)('margin-left', margin), "\n transform: translateX(").concat(translateX, ") scale(0.01);\n opacity: 0;\n }\n ");
27
+ };
25
28
  return {
26
29
  euiDataGridHeaderCell__content: /*#__PURE__*/(0, _react.css)("flex-grow:1;", (0, _global_styling.euiTextTruncate)(), ";;label:euiDataGridHeaderCell__content;"),
27
30
  // Numeric and currency schemas are aligned to the right
28
31
  right: /*#__PURE__*/(0, _react.css)((0, _global_styling.logicalTextAlignCSS)('right'), ";;label:right;"),
29
32
  euiDataGridHeaderCell__popover: /*#__PURE__*/(0, _react.css)((0, _global_styling.logicalCSS)('margin-left', 'auto'), "line-height:0;;label:euiDataGridHeaderCell__popover;"),
30
- euiDataGridHeaderCell__actions: /*#__PURE__*/(0, _react.css)("overflow:hidden;display:flex;", header.hideActions, " &{", (0, _global_styling.logicalCSS)('width', 0), " opacity:0;}", _global_styling.euiCanAnimate, "{transition:inline-size ", euiTheme.animation.fast, " ease-in,opacity ", euiTheme.animation.slow, " ease-in;transform:none!important;animation:none!important;};label:euiDataGridHeaderCell__actions;")
33
+ euiDataGridHeaderCell__actions: {
34
+ action: /*#__PURE__*/(0, _react.css)("overflow:hidden;display:flex;max-inline-size:24px;", _global_styling.euiCanAnimate, "{transition:transform ", euiTheme.animation.fast, " ease-in,opacity ", euiTheme.animation.slow, " ease-in,margin-left ", euiTheme.animation.fast, " ease-in;animation:none!important;};label:action;"),
35
+ start: /*#__PURE__*/(0, _react.css)(hideAnimation("-".concat(euiTheme.size.m), '0%'), ";;label:start;"),
36
+ end: /*#__PURE__*/(0, _react.css)(hideAnimation("-".concat(euiTheme.size.l), '50%'), ";;label:end;")
37
+ }
31
38
  };
32
39
  };
@@ -16,7 +16,7 @@ var _focus = require("../../utils/focus");
16
16
  var _focus_utils = require("../cell/focus_utils");
17
17
  var _data_grid_header_cell_wrapper = require("./data_grid_header_cell_wrapper.styles");
18
18
  var _react2 = require("@emotion/react");
19
- var _excluded = ["id", "index", "isLastColumn", "width", "className", "children", "hasColumnActions", "isDragging", "onKeyDown", "aria-label"];
19
+ var _excluded = ["id", "index", "isLastColumn", "width", "className", "children", "hasColumnActions", "isDragging", "onKeyDown", "aria-label", "aria-labelledby"];
20
20
  /*
21
21
  * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
22
22
  * or more contributor license agreements. Licensed under the Elastic License
@@ -42,6 +42,7 @@ var EuiDataGridHeaderCellWrapper = exports.EuiDataGridHeaderCellWrapper = functi
42
42
  isDragging = _ref.isDragging,
43
43
  _onKeyDown = _ref.onKeyDown,
44
44
  ariaLabel = _ref['aria-label'],
45
+ ariaLabelledby = _ref['aria-labelledby'],
45
46
  rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
46
47
  var classes = (0, _classnames.default)('euiDataGridHeaderCell', className);
47
48
  var styles = (0, _services.useEuiMemoizedStyles)(_data_grid_header_cell_wrapper.euiDataGridHeaderCellWrapperStyles);
@@ -107,7 +108,8 @@ var EuiDataGridHeaderCellWrapper = exports.EuiDataGridHeaderCellWrapper = functi
107
108
  style: width != null ? {
108
109
  width: "".concat(width, "px")
109
110
  } : {},
110
- "aria-label": renderFocusTrap ? ariaLabel : undefined
111
+ "aria-label": renderFocusTrap ? ariaLabel : undefined,
112
+ "aria-labelledby": renderFocusTrap ? ariaLabelledby : undefined
111
113
  }, rest), (0, _react2.jsx)(_focus_utils.HandleInteractiveChildren, {
112
114
  cellEl: isDragging ? null : headerEl,
113
115
  renderFocusTrap: isDragging ? false : renderFocusTrap,
@@ -47,7 +47,7 @@ var euiFilePickerStyles = exports.euiFilePickerStyles = function euiFilePickerSt
47
47
  fontSize = _euiFontSize.fontSize,
48
48
  lineHeight = _euiFontSize.lineHeight;
49
49
  return {
50
- euiFilePicker: /*#__PURE__*/(0, _react.css)("--euiFormControlLeftIconsCount:1;position:relative;border-radius:", formVariables.controlBorderRadius, ";&:has(input:focus){--euiFormControlStateColor:", formVariables.borderFocused, ";}&:hover{--euiFormControlStateColor:", highContrastMode ? euiTheme.border.color : formVariables.borderHovered, ";--euiFormControlStateStyle:solid;}&:focus-within{", (0, _global_styling.highContrastModeStyles)(euiThemeContext, {
50
+ euiFilePicker: /*#__PURE__*/(0, _react.css)("--euiFormControlLeftIconsCount:1;position:relative;border-radius:", formVariables.controlBorderRadius, ";&:has(input:focus){--euiFormControlStateColor:", formVariables.borderFocused, ";}&:hover{--euiFormControlStateColor:", highContrastMode ? euiTheme.border.color : euiTheme.colors.borderInteractiveFormsHoverProminent, ";--euiFormControlStateStyle:", highContrastMode ? 'solid' : 'dashed', ";}&:focus-within{", (0, _global_styling.highContrastModeStyles)(euiThemeContext, {
51
51
  forced: "\n ".concat((0, _form.euiFormControlShowBackgroundLine)(euiThemeContext, formVariables.borderFocused), "\n ")
52
52
  }), ";};label:euiFilePicker;"),
53
53
  isDroppingFile: /*#__PURE__*/(0, _react.css)("--euiFormControlStateColor:", euiTheme.colors.borderStrongSuccess, ";--euiFormControlStateStyle:", highContrastMode === 'forced' ? 'solid' : 'dashed', ";background-color:", euiTheme.components.forms.backgroundDropping, ";;label:isDroppingFile;"),
@@ -66,8 +66,8 @@ var euiFilePickerStyles = exports.euiFilePickerStyles = function euiFilePickerSt
66
66
  forced: "\n text-decoration: underline;\n "
67
67
  }), ";}.euiFilePicker__icon{transform:scale(1.05);}}};label:largeInteractive;")
68
68
  },
69
- euiFilePicker__prompt: /*#__PURE__*/(0, _react.css)("pointer-events:none;font-size:", fontSize, ";line-height:1;", (0, _global_styling.euiTextTruncate)(), " color:", euiTheme.colors.textParagraph, ";border:", euiTheme.border.width.thin, " var(--euiFormControlStateStyle, dashed) var(--euiFormControlStateColor, ", formVariables.borderColor, ");", _global_styling.euiCanAnimate, "{transition:border-color ", euiTheme.animation.fast, " ease-in,background-color ", euiTheme.animation.fast, " ease-in;};label:euiFilePicker__prompt;"),
70
- disabled: /*#__PURE__*/(0, _react.css)(formStyles.disabled, ";label:disabled;"),
69
+ euiFilePicker__prompt: /*#__PURE__*/(0, _react.css)("pointer-events:none;font-size:", fontSize, ";line-height:1;", (0, _global_styling.euiTextTruncate)(), " color:", euiTheme.colors.textParagraph, ";border:", euiTheme.border.width.thin, " var(--euiFormControlStateStyle, dashed) var(--euiFormControlStateColor, ", euiTheme.colors.borderBaseProminent, ");", _global_styling.euiCanAnimate, "{transition:border-color ", euiTheme.animation.fast, " ease-in,background-color ", euiTheme.animation.fast, " ease-in;};label:euiFilePicker__prompt;"),
70
+ disabled: /*#__PURE__*/(0, _react.css)(formStyles.disabled, "--euiFormControlStateColor:transparent;;label:disabled;"),
71
71
  // Skip the css() on the default height to avoid generating a className
72
72
  uncompressed: formStyles.uncompressed,
73
73
  compressed: /*#__PURE__*/(0, _react.css)(formStyles.compressed, ";label:compressed;"),
@@ -34,7 +34,7 @@ var EuiIconPaperClip = function EuiIconPaperClip(_ref) {
34
34
  }, props), title ? (0, _react2.jsx)("title", {
35
35
  id: titleId
36
36
  }, title) : null, (0, _react2.jsx)("path", {
37
- d: "M9.84 2.019 3.046 8.57c-.987.952-1.133 2.517-.199 3.516.951 1.021 2.58 1.106 3.64.19.034-.03.068-.061.1-.092l5.655-5.452a.484.484 0 0 0 0-.703.53.53 0 0 0-.729 0L5.92 11.421c-.572.551-1.505.657-2.131.163a1.455 1.455 0 0 1-.118-2.211l6.899-6.651a2.646 2.646 0 0 1 3.644 0 2.422 2.422 0 0 1 0 3.513L7.3 12.901c-1.333 1.285-3.497 1.493-4.95.336-1.54-1.22-1.764-3.411-.5-4.897a3.33 3.33 0 0 1 .238-.252l5.78-5.572a.484.484 0 0 0 0-.703.53.53 0 0 0-.73 0l-5.78 5.572a4.36 4.36 0 0 0 0 6.324c2.188 2.109 5.202 1.31 6.66-.095l6.925-6.676a3.39 3.39 0 0 0 0-4.92C13.534.66 11.25.66 9.841 2.019z"
37
+ d: "M7 11c0 .423.105.648.229.771.123.124.348.229.771.229.423 0 .648-.105.771-.229.124-.123.229-.348.229-.771V5h1v6c0 .577-.145 1.102-.521 1.479C9.102 12.854 8.577 13 8 13c-.577 0-1.102-.145-1.479-.521C6.145 12.101 6 11.577 6 11V4c0-.719.215-1.468.716-2.046C7.226 1.364 7.996 1 9 1c1.005 0 1.773.365 2.284.954.5.578.716 1.327.716 2.046v7c0 1.103-.345 2.11-1.043 2.845C10.255 14.583 9.242 15 8 15c-1.242 0-2.255-.417-2.957-1.155C4.345 13.11 4 12.103 4 11V4h1v7c0 .897.279 1.64.768 2.155C6.253 13.666 6.99 14 8 14c1.01 0 1.747-.334 2.232-.845.49-.515.768-1.258.768-2.155V4c0-.531-.16-1.032-.472-1.392C10.227 2.26 9.745 2 9 2s-1.227.26-1.528.608C7.16 2.968 7 3.47 7 4v7Z"
38
38
  }));
39
39
  };
40
40
  var icon = exports.icon = EuiIconPaperClip;
@@ -29,17 +29,18 @@ var EuiIconStreamsWired = function EuiIconStreamsWired(_ref) {
29
29
  xmlns: "http://www.w3.org/2000/svg",
30
30
  width: 16,
31
31
  height: 16,
32
+ fill: "none",
32
33
  viewBox: "0 0 16 16",
33
34
  "aria-labelledby": titleId
34
35
  }, props), title ? (0, _react2.jsx)("title", {
35
36
  id: titleId
36
37
  }, title) : null, (0, _react2.jsx)("path", {
37
38
  fillRule: "evenodd",
38
- d: "M13.5 1a1.5 1.5 0 1 1-1.413 2H11.5A1.5 1.5 0 0 0 10 4.5v1c0 .564-.19 1.082-.504 1.5H9.5l-.048.06a2.58 2.58 0 0 1-.352.36c-.01.01-.021.017-.032.025a2.501 2.501 0 0 1-.142.108l-.043.03c-.055.036-.11.07-.168.103l-.047.024c-.057.03-.115.06-.175.085-.018.008-.036.014-.055.021A2.475 2.475 0 0 1 7.5 8h-.504c.315.418.504.936.504 1.5v1A1.5 1.5 0 0 0 9 12h3.087a1.5 1.5 0 1 1 0 1H9a2.5 2.5 0 0 1-2.5-2.5v-1A1.5 1.5 0 0 0 5 8H3.913a1.5 1.5 0 1 1 0-1H7.5A1.5 1.5 0 0 0 9 5.5v-1A2.5 2.5 0 0 1 11.5 2h.587A1.5 1.5 0 0 1 13.5 1Zm0 11a.5.5 0 1 0 0 1 .5.5 0 0 0 0-1Zm-11-5a.5.5 0 1 0 0 1 .5.5 0 0 0 0-1Zm11-5a.5.5 0 1 0 0 1 .5.5 0 0 0 0-1Z",
39
+ d: "M13.5 1a1.5 1.5 0 1 1-1.413 2H11.5A1.5 1.5 0 0 0 10 4.5V6a2.49 2.49 0 0 1-.504 1.5H9.5l-.048.06a2.58 2.58 0 0 1-.352.36c-.01.01-.021.017-.032.025a2.496 2.496 0 0 1-.142.108l-.043.03c-.055.036-.11.07-.168.103l-.047.024c-.057.03-.115.06-.175.085-.018.008-.036.014-.055.021A2.475 2.475 0 0 1 7.5 8.5h-.504c.315.418.504.936.504 1.5v1.5A1.5 1.5 0 0 0 9 13h3.087a1.5 1.5 0 1 1 0 1H9a2.5 2.5 0 0 1-2.5-2.5V10A1.5 1.5 0 0 0 5 8.5H3.913a1.5 1.5 0 1 1 0-1H7.5A1.5 1.5 0 0 0 9 6V4.5A2.5 2.5 0 0 1 11.5 2h.587A1.5 1.5 0 0 1 13.5 1Zm0 12a.5.5 0 1 0 0 1 .5.5 0 0 0 0-1Zm-11-5.5a.5.5 0 1 0 0 1 .5.5 0 0 0 0-1Zm11-5.5a.5.5 0 1 0 0 1 .5.5 0 0 0 0-1Z",
39
40
  clipRule: "evenodd"
40
41
  }), (0, _react2.jsx)("path", {
41
42
  fillRule: "evenodd",
42
- d: "M13.5 6a1.5 1.5 0 1 1-1.413 2H9.948c.293-.287.536-.625.714-1h1.425A1.5 1.5 0 0 1 13.5 6Zm0 1a.5.5 0 1 0 0 1 .5.5 0 0 0 0-1Z",
43
+ d: "M13.5 6.5a1.5 1.5 0 1 1-1.413 2H9.948c.293-.287.536-.625.714-1h1.425a1.5 1.5 0 0 1 1.413-1Zm0 1a.5.5 0 1 0 0 1 .5.5 0 0 0 0-1Z",
43
44
  clipRule: "evenodd"
44
45
  }));
45
46
  };
@@ -1,3 +1,3 @@
1
- <svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
2
- <path d="M9.84 2.019L3.046 8.57c-.987.952-1.133 2.517-.199 3.516.951 1.021 2.58 1.106 3.64.19.034-.03.068-.061.1-.092l5.655-5.452a.484.484 0 000-.703.53.53 0 00-.729 0L5.92 11.421c-.572.551-1.505.657-2.131.163a1.455 1.455 0 01-.118-2.211l6.899-6.651a2.646 2.646 0 013.644 0 2.422 2.422 0 010 3.513L7.3 12.901c-1.333 1.285-3.497 1.493-4.95.336-1.54-1.22-1.764-3.411-.5-4.897.075-.088.154-.172.238-.252l5.78-5.572a.484.484 0 000-.703.53.53 0 00-.73 0l-5.78 5.572a4.36 4.36 0 000 6.324c2.188 2.109 5.202 1.31 6.66-.095l6.925-6.676a3.39 3.39 0 000-4.92C13.534.66 11.25.66 9.841 2.019z"/>
3
- </svg>
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16">
2
+ <path d="M7 11C7 11.4229 7.10536 11.6483 7.22852 11.7715C7.35168 11.8946 7.57707 12 8 12C8.42293 12 8.64832 11.8946 8.77148 11.7715C8.89464 11.6483 9 11.4229 9 11V5H10V11C10 11.5771 9.85536 12.1017 9.47852 12.4785C9.10168 12.8554 8.57707 13 8 13C7.42293 13 6.89832 12.8554 6.52148 12.4785C6.14464 12.1017 6 11.5771 6 11V4C6 3.28108 6.21527 2.53178 6.71582 1.9541C7.22667 1.3647 7.99544 1 9 1C10.0046 1 10.7733 1.3647 11.2842 1.9541C11.7847 2.53178 12 3.28108 12 4V11C12 12.103 11.6546 13.1101 10.957 13.8447C10.2555 14.5834 9.24184 15 8 15C6.75816 15 5.74451 14.5834 5.04297 13.8447C4.34537 13.1101 4 12.103 4 11V4H5V11C5 11.8967 5.2785 12.64 5.76758 13.1553C6.25296 13.6664 6.98973 14 8 14C9.01027 14 9.74704 13.6664 10.2324 13.1553C10.7215 12.64 11 11.8967 11 11V4C11 3.46903 10.8402 2.96818 10.5283 2.6084C10.2266 2.26039 9.74507 2 9 2C8.25493 2 7.7734 2.26039 7.47168 2.6084C7.15985 2.96818 7 3.46903 7 4V11Z" />
3
+ </svg>