@elastic/eui 109.2.0 → 110.0.0-snapshot.1764684698664

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 (95) hide show
  1. package/es/components/basic_table/in_memory_table.js +86 -233
  2. package/es/components/date_picker/super_date_picker/date_popover/absolute_tab.js +5 -1
  3. package/es/components/date_picker/super_date_picker/date_popover/relative_tab.js +5 -1
  4. package/es/components/date_picker/super_date_picker/date_popover/timezone_display.js +3 -1
  5. package/es/components/date_picker/super_date_picker/quick_select_popover/index.js +1 -0
  6. package/es/components/date_picker/super_date_picker/time_window_buttons.js +1 -1
  7. package/es/components/filter_group/filter_group.a11y.js +1 -1
  8. package/es/components/header/header_logo/header_logo.js +6 -1
  9. package/es/components/header/header_logo/header_logo.styles.js +1 -1
  10. package/es/components/icon/icon.styles.js +4 -4
  11. package/es/components/page/page.js +11 -3
  12. package/es/components/page/page.styles.js +1 -2
  13. package/es/components/page/page_header/page_header.js +11 -3
  14. package/es/components/page_template/outer/page_outer.js +2 -3
  15. package/es/components/page_template/outer/page_outer.styles.js +29 -35
  16. package/es/components/page_template/page_template.js +8 -2
  17. package/es/components/search_bar/search_bar.js +4 -4
  18. package/es/components/selectable/selectable.js +7 -2
  19. package/es/services/string/to_initials.js +26 -4
  20. package/eui.d.ts +38 -21
  21. package/lib/components/basic_table/in_memory_table.js +85 -234
  22. package/lib/components/date_picker/super_date_picker/date_popover/absolute_tab.js +5 -1
  23. package/lib/components/date_picker/super_date_picker/date_popover/relative_tab.js +5 -1
  24. package/lib/components/date_picker/super_date_picker/date_popover/timezone_display.js +3 -1
  25. package/lib/components/date_picker/super_date_picker/quick_select_popover/index.js +7 -0
  26. package/lib/components/date_picker/super_date_picker/time_window_buttons.js +1 -1
  27. package/lib/components/filter_group/filter_group.a11y.js +1 -1
  28. package/lib/components/header/header_logo/header_logo.js +6 -1
  29. package/lib/components/header/header_logo/header_logo.styles.js +1 -1
  30. package/lib/components/icon/icon.styles.js +4 -4
  31. package/lib/components/page/page.js +10 -2
  32. package/lib/components/page/page.styles.js +1 -2
  33. package/lib/components/page/page_header/page_header.js +10 -2
  34. package/lib/components/page_template/outer/page_outer.js +1 -2
  35. package/lib/components/page_template/outer/page_outer.styles.js +29 -35
  36. package/lib/components/page_template/page_template.js +8 -2
  37. package/lib/components/search_bar/search_bar.js +4 -4
  38. package/lib/components/selectable/selectable.js +7 -2
  39. package/lib/services/string/to_initials.js +26 -4
  40. package/optimize/es/components/basic_table/in_memory_table.js +73 -46
  41. package/optimize/es/components/date_picker/super_date_picker/date_popover/absolute_tab.js +5 -1
  42. package/optimize/es/components/date_picker/super_date_picker/date_popover/relative_tab.js +5 -1
  43. package/optimize/es/components/date_picker/super_date_picker/date_popover/timezone_display.js +3 -1
  44. package/optimize/es/components/date_picker/super_date_picker/quick_select_popover/index.js +1 -0
  45. package/optimize/es/components/date_picker/super_date_picker/time_window_buttons.js +1 -1
  46. package/optimize/es/components/filter_group/filter_group.a11y.js +1 -1
  47. package/optimize/es/components/header/header_logo/header_logo.js +6 -1
  48. package/optimize/es/components/header/header_logo/header_logo.styles.js +1 -1
  49. package/optimize/es/components/icon/icon.styles.js +4 -4
  50. package/optimize/es/components/page/page.js +6 -3
  51. package/optimize/es/components/page/page.styles.js +1 -2
  52. package/optimize/es/components/page/page_header/page_header.js +6 -3
  53. package/optimize/es/components/page_template/outer/page_outer.js +2 -3
  54. package/optimize/es/components/page_template/outer/page_outer.styles.js +29 -35
  55. package/optimize/es/components/page_template/page_template.js +2 -1
  56. package/optimize/es/components/selectable/selectable.js +7 -2
  57. package/optimize/es/services/string/to_initials.js +26 -4
  58. package/optimize/lib/components/basic_table/in_memory_table.js +72 -47
  59. package/optimize/lib/components/date_picker/super_date_picker/date_popover/absolute_tab.js +5 -1
  60. package/optimize/lib/components/date_picker/super_date_picker/date_popover/relative_tab.js +5 -1
  61. package/optimize/lib/components/date_picker/super_date_picker/date_popover/timezone_display.js +3 -1
  62. package/optimize/lib/components/date_picker/super_date_picker/quick_select_popover/index.js +7 -0
  63. package/optimize/lib/components/date_picker/super_date_picker/time_window_buttons.js +1 -1
  64. package/optimize/lib/components/filter_group/filter_group.a11y.js +1 -1
  65. package/optimize/lib/components/header/header_logo/header_logo.js +6 -1
  66. package/optimize/lib/components/header/header_logo/header_logo.styles.js +1 -1
  67. package/optimize/lib/components/icon/icon.styles.js +4 -4
  68. package/optimize/lib/components/page/page.js +5 -2
  69. package/optimize/lib/components/page/page.styles.js +1 -2
  70. package/optimize/lib/components/page/page_header/page_header.js +5 -2
  71. package/optimize/lib/components/page_template/outer/page_outer.js +1 -2
  72. package/optimize/lib/components/page_template/outer/page_outer.styles.js +29 -35
  73. package/optimize/lib/components/page_template/page_template.js +2 -1
  74. package/optimize/lib/components/selectable/selectable.js +7 -2
  75. package/optimize/lib/services/string/to_initials.js +26 -4
  76. package/package.json +3 -2
  77. package/test-env/components/basic_table/in_memory_table.js +85 -234
  78. package/test-env/components/date_picker/super_date_picker/date_popover/absolute_tab.js +5 -1
  79. package/test-env/components/date_picker/super_date_picker/date_popover/relative_tab.js +5 -1
  80. package/test-env/components/date_picker/super_date_picker/date_popover/timezone_display.js +3 -1
  81. package/test-env/components/date_picker/super_date_picker/quick_select_popover/index.js +7 -0
  82. package/test-env/components/date_picker/super_date_picker/time_window_buttons.js +1 -1
  83. package/test-env/components/filter_group/filter_group.a11y.js +1 -1
  84. package/test-env/components/header/header_logo/header_logo.js +6 -1
  85. package/test-env/components/header/header_logo/header_logo.styles.js +1 -1
  86. package/test-env/components/icon/icon.styles.js +4 -4
  87. package/test-env/components/page/page.js +10 -2
  88. package/test-env/components/page/page.styles.js +1 -2
  89. package/test-env/components/page/page_header/page_header.js +10 -2
  90. package/test-env/components/page_template/outer/page_outer.js +1 -2
  91. package/test-env/components/page_template/outer/page_outer.styles.js +29 -35
  92. package/test-env/components/page_template/page_template.js +8 -2
  93. package/test-env/components/search_bar/search_bar.js +4 -4
  94. package/test-env/components/selectable/selectable.js +7 -2
  95. package/test-env/services/string/to_initials.js +26 -4
@@ -1,6 +1,6 @@
1
1
  var _excluded = ["schema"],
2
2
  _excluded2 = ["onChange"],
3
- _excluded3 = ["columns", "loading", "message", "noItemsMessage", "error", "selection", "compressed", "pagination", "sorting", "itemIdToExpandedRowMap", "itemId", "rowProps", "cellProps", "tableLayout", "items", "search", "searchFormat", "onTableChange", "executeQueryOptions", "allowNeutralSort", "childrenBetween"];
3
+ _excluded3 = ["columns", "loading", "noItemsMessage", "error", "selection", "compressed", "pagination", "sorting", "itemIdToExpandedRowMap", "itemId", "rowProps", "cellProps", "tableLayout", "items", "search", "searchFormat", "onTableChange", "executeQueryOptions", "allowNeutralSort", "childrenBetween"];
4
4
  function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
5
5
  function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
6
6
  function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], t.indexOf(o) >= 0 || {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
@@ -38,21 +38,33 @@ import { EuiSearchBox } from '../search_bar/search_box';
38
38
  import { EuiSpacer } from '../spacer';
39
39
  import { euiTablePaginationDefaults } from '../table/table_pagination';
40
40
  import { EuiComponentDefaultsContext } from '../provider/component_defaults';
41
+
42
+ // allows `query: null` in the onChange callback when using `searchFormat="text"`
41
43
  import { jsx as ___EmotionJSX } from "@emotion/react";
42
44
  function isEuiSearchBarProps(x) {
43
45
  return typeof x !== 'boolean';
44
46
  }
45
- var getQueryFromSearch = function getQueryFromSearch(search, defaultQuery) {
46
- var query;
47
+ /**
48
+ * Extracts and formats a query from search props based on the search format
49
+ * @param search - The search configuration
50
+ * @param defaultQuery - Whether to use the defaultQuery property as fallback
51
+ * @param searchFormat - The search format: 'eql' for parsed queries, 'text' for plain text
52
+ * @returns Formatted query string or Query object
53
+ */
54
+ var getQueryFromSearch = function getQueryFromSearch(search, defaultQuery, searchFormat) {
55
+ var _ref, _searchProps$defaultQ, _searchProps$query;
47
56
  if (!search) {
48
- query = '';
49
- } else {
50
- query = (defaultQuery ? search.defaultQuery || search.query || '' : search.query) || '';
57
+ return searchFormat === 'text' ? '""' : '';
51
58
  }
52
- return isString(query) ? EuiSearchBar.Query.parse(query) : query;
59
+ var searchProps = search;
60
+ var queryString = defaultQuery ? (_ref = (_searchProps$defaultQ = searchProps.defaultQuery) !== null && _searchProps$defaultQ !== void 0 ? _searchProps$defaultQ : searchProps.query) !== null && _ref !== void 0 ? _ref : '' : (_searchProps$query = searchProps.query) !== null && _searchProps$query !== void 0 ? _searchProps$query : '';
61
+ if (searchFormat === 'text') {
62
+ return "\"".concat(queryString, "\"");
63
+ }
64
+ return isString(queryString) ? EuiSearchBar.Query.parse(queryString) : queryString;
53
65
  };
54
66
  var getInitialPagination = function getInitialPagination(pagination, consumerDefaults) {
55
- var _ref2, _pagination$pageIndex, _ref3, _pagination$pageSize;
67
+ var _ref3, _pagination$pageIndex, _ref4, _pagination$pageSize;
56
68
  if (!pagination) {
57
69
  return {
58
70
  pageIndex: undefined,
@@ -60,14 +72,14 @@ var getInitialPagination = function getInitialPagination(pagination, consumerDef
60
72
  };
61
73
  }
62
74
  var defaults = _objectSpread(_objectSpread({}, euiTablePaginationDefaults), consumerDefaults);
63
- var _ref = pagination,
64
- _ref$pageSizeOptions = _ref.pageSizeOptions,
65
- pageSizeOptions = _ref$pageSizeOptions === void 0 ? defaults.itemsPerPageOptions : _ref$pageSizeOptions,
66
- _ref$showPerPageOptio = _ref.showPerPageOptions,
67
- showPerPageOptions = _ref$showPerPageOptio === void 0 ? defaults.showPerPageOptions : _ref$showPerPageOptio;
75
+ var _ref2 = pagination,
76
+ _ref2$pageSizeOptions = _ref2.pageSizeOptions,
77
+ pageSizeOptions = _ref2$pageSizeOptions === void 0 ? defaults.itemsPerPageOptions : _ref2$pageSizeOptions,
78
+ _ref2$showPerPageOpti = _ref2.showPerPageOptions,
79
+ showPerPageOptions = _ref2$showPerPageOpti === void 0 ? defaults.showPerPageOptions : _ref2$showPerPageOpti;
68
80
  var defaultPageSize = pageSizeOptions !== null && pageSizeOptions !== void 0 && pageSizeOptions.includes(defaults.itemsPerPage) ? defaults.itemsPerPage : pageSizeOptions[0];
69
- var initialPageIndex = pagination === true ? 0 : (_ref2 = (_pagination$pageIndex = pagination.pageIndex) !== null && _pagination$pageIndex !== void 0 ? _pagination$pageIndex : pagination.initialPageIndex) !== null && _ref2 !== void 0 ? _ref2 : 0;
70
- var initialPageSize = pagination === true ? defaultPageSize : (_ref3 = (_pagination$pageSize = pagination.pageSize) !== null && _pagination$pageSize !== void 0 ? _pagination$pageSize : pagination.initialPageSize) !== null && _ref3 !== void 0 ? _ref3 : defaultPageSize;
81
+ var initialPageIndex = pagination === true ? 0 : (_ref3 = (_pagination$pageIndex = pagination.pageIndex) !== null && _pagination$pageIndex !== void 0 ? _pagination$pageIndex : pagination.initialPageIndex) !== null && _ref3 !== void 0 ? _ref3 : 0;
82
+ var initialPageSize = pagination === true ? defaultPageSize : (_ref4 = (_pagination$pageSize = pagination.pageSize) !== null && _pagination$pageSize !== void 0 ? _pagination$pageSize : pagination.initialPageSize) !== null && _ref4 !== void 0 ? _ref4 : defaultPageSize;
71
83
  if (showPerPageOptions && initialPageSize != null && !(pageSizeOptions !== null && pageSizeOptions !== void 0 && pageSizeOptions.includes(initialPageSize))) {
72
84
  throw new Error("EuiInMemoryTable received initialPageSize ".concat(initialPageSize, ", which wasn't provided within pageSizeOptions."));
73
85
  }
@@ -120,15 +132,16 @@ function getInitialSorting(columns, sorting) {
120
132
  }
121
133
  export var EuiInMemoryTable = /*#__PURE__*/function (_Component) {
122
134
  function EuiInMemoryTable(props, context) {
135
+ var _props$searchFormat;
123
136
  var _this;
124
137
  _classCallCheck(this, EuiInMemoryTable);
125
138
  _this = _callSuper(this, EuiInMemoryTable, [props]);
126
- _defineProperty(_this, "onTableChange", function (_ref4) {
127
- var page = _ref4.page,
128
- sort = _ref4.sort;
129
- var _ref5 = page || {},
130
- pageIndex = _ref5.index,
131
- pageSize = _ref5.size;
139
+ _defineProperty(_this, "onTableChange", function (_ref5) {
140
+ var page = _ref5.page,
141
+ sort = _ref5.sort;
142
+ var _ref6 = page || {},
143
+ pageIndex = _ref6.index,
144
+ pageSize = _ref6.size;
132
145
 
133
146
  // don't apply pagination changes that are otherwise controlled
134
147
  // `page` is left unchanged as it goes to the consumer's `onTableChange` callback, allowing the app to respond
@@ -137,9 +150,9 @@ export var EuiInMemoryTable = /*#__PURE__*/function (_Component) {
137
150
  if (pagination.pageSize != null) pageSize = pagination.pageSize;
138
151
  if (pagination.pageIndex != null) pageIndex = pagination.pageIndex;
139
152
  }
140
- var _ref6 = sort || {},
141
- sortName = _ref6.field,
142
- sortDirection = _ref6.direction;
153
+ var _ref7 = sort || {},
154
+ sortName = _ref7.field,
155
+ sortDirection = _ref7.direction;
143
156
 
144
157
  // To keep backwards compatibility reportedSortName needs to be tracked separately
145
158
  // from sortName; sortName gets stored internally while reportedSortName is sent to the callback
@@ -182,10 +195,10 @@ export var EuiInMemoryTable = /*#__PURE__*/function (_Component) {
182
195
  sortDirection: sortDirection
183
196
  });
184
197
  });
185
- _defineProperty(_this, "onQueryChange", function (_ref7) {
186
- var query = _ref7.query,
187
- queryText = _ref7.queryText,
188
- error = _ref7.error;
198
+ _defineProperty(_this, "onQueryChange", function (_ref8) {
199
+ var query = _ref8.query,
200
+ queryText = _ref8.queryText,
201
+ error = _ref8.error;
189
202
  var search = _this.props.search;
190
203
  if (isEuiSearchBarProps(search)) {
191
204
  if (search.onChange) {
@@ -219,12 +232,11 @@ export var EuiInMemoryTable = /*#__PURE__*/function (_Component) {
219
232
  // search bar to ignore EQL syntax and only use the searchbar for plain text
220
233
  _defineProperty(_this, "onPlainTextSearch", function (searchValue) {
221
234
  var escapedQueryText = searchValue.replace(/["\\]/g, '\\$&');
222
- var finalQuery = "\"".concat(escapedQueryText, "\"");
223
235
  var search = _this.props.search;
224
236
  if (isEuiSearchBarProps(search)) {
225
237
  if (search.onChange) {
226
238
  var shouldQueryInMemory = search.onChange({
227
- query: EuiSearchBar.Query.parse(finalQuery),
239
+ query: null,
228
240
  queryText: escapedQueryText,
229
241
  error: null
230
242
  });
@@ -234,7 +246,7 @@ export var EuiInMemoryTable = /*#__PURE__*/function (_Component) {
234
246
  }
235
247
  }
236
248
  _this.setState({
237
- query: EuiSearchBar.Query.parse(finalQuery)
249
+ query: "\"".concat(escapedQueryText, "\"")
238
250
  });
239
251
  });
240
252
  var columns = props.columns,
@@ -258,7 +270,7 @@ export var EuiInMemoryTable = /*#__PURE__*/function (_Component) {
258
270
  search: _search
259
271
  },
260
272
  search: _search,
261
- query: getQueryFromSearch(_search, true),
273
+ query: getQueryFromSearch(_search, true, (_props$searchFormat = props.searchFormat) !== null && _props$searchFormat !== void 0 ? _props$searchFormat : 'eql'),
262
274
  pageIndex: _pageIndex || 0,
263
275
  pageSize: _pageSize,
264
276
  pageSizeOptions: pageSizeOptions,
@@ -279,13 +291,28 @@ export var EuiInMemoryTable = /*#__PURE__*/function (_Component) {
279
291
  if (!search) return;
280
292
  var searchBar;
281
293
  if (searchFormat === 'text') {
282
- var _searchBoxProps = (search === null || search === void 0 ? void 0 : search.box) || {}; // Work around | boolean type
283
- var schema = _searchBoxProps.schema,
284
- searchBoxProps = _objectWithoutProperties(_searchBoxProps, _excluded); // Destructure `schema` so it doesn't get rendered to DOM
294
+ var _ref9 = search,
295
+ _ref9$box = _ref9.box,
296
+ box = _ref9$box === void 0 ? {} : _ref9$box,
297
+ query = _ref9.query,
298
+ defaultQuery = _ref9.defaultQuery;
299
+ var schema = box.schema,
300
+ searchBoxProps = _objectWithoutProperties(box, _excluded);
301
+
302
+ // in the unexpected case a Query object is passed with searchFormat=text
303
+ if (process.env.NODE_ENV === 'development') {
304
+ if (query != null && !isString(query)) {
305
+ console.warn('EuiInMemoryTable: `query` should be a string when using searchFormat="text". Query objects are only supported with searchFormat="eql".');
306
+ }
307
+ if (defaultQuery != null && !isString(defaultQuery)) {
308
+ console.warn('EuiInMemoryTable: `defaultQuery` should be a string when using searchFormat="text". Query objects are only supported with searchFormat="eql".');
309
+ }
310
+ }
285
311
 
286
- searchBar = ___EmotionJSX(EuiSearchBox, _extends({
287
- query: "" // Unused, passed to satisfy Typescript
288
- }, searchBoxProps, {
312
+ // use only string values, ignore Query objects
313
+ var displayQuery = isString(query) ? query : isString(defaultQuery) ? defaultQuery : '';
314
+ searchBar = ___EmotionJSX(EuiSearchBox, _extends({}, searchBoxProps, {
315
+ query: displayQuery,
289
316
  onSearch: this.onPlainTextSearch
290
317
  }));
291
318
  } else {
@@ -313,9 +340,9 @@ export var EuiInMemoryTable = /*#__PURE__*/function (_Component) {
313
340
  value: function resolveSearchSchema() {
314
341
  var columns = this.props.columns;
315
342
  return columns.reduce(function (schema, column) {
316
- var _ref8 = column,
317
- field = _ref8.field,
318
- dataType = _ref8.dataType;
343
+ var _ref10 = column,
344
+ field = _ref10.field,
345
+ dataType = _ref10.dataType;
319
346
  if (field) {
320
347
  var type = dataType || 'string';
321
348
  schema.fields[field] = {
@@ -335,8 +362,8 @@ export var EuiInMemoryTable = /*#__PURE__*/function (_Component) {
335
362
  sortName = _this$state.sortName,
336
363
  sortDirection = _this$state.sortDirection;
337
364
  var columns = this.props.columns;
338
- var sortColumn = columns.find(function (_ref9) {
339
- var name = _ref9.name;
365
+ var sortColumn = columns.find(function (_ref11) {
366
+ var name = _ref11.name;
340
367
  return name === sortName;
341
368
  });
342
369
  if (sortColumn == null) {
@@ -386,7 +413,6 @@ export var EuiInMemoryTable = /*#__PURE__*/function (_Component) {
386
413
  var _this$props2 = this.props,
387
414
  columns = _this$props2.columns,
388
415
  loading = _this$props2.loading,
389
- message = _this$props2.message,
390
416
  noItemsMessage = _this$props2.noItemsMessage,
391
417
  error = _this$props2.error,
392
418
  selection = _this$props2.selection,
@@ -449,7 +475,7 @@ export var EuiInMemoryTable = /*#__PURE__*/function (_Component) {
449
475
  onChange: this.onTableChange,
450
476
  error: error,
451
477
  loading: loading,
452
- noItemsMessage: noItemsMessage || message,
478
+ noItemsMessage: noItemsMessage,
453
479
  tableLayout: tableLayout,
454
480
  compressed: compressed,
455
481
  itemIdToExpandedRowMap: itemIdToExpandedRowMap
@@ -507,11 +533,12 @@ export var EuiInMemoryTable = /*#__PURE__*/function (_Component) {
507
533
  var nextQuery = nextProps.search ? nextProps.search.query : '';
508
534
  var prevQuery = prevState.prevProps.search ? prevState.prevProps.search.query : '';
509
535
  if (nextQuery !== prevQuery) {
536
+ var _nextProps$searchForm;
510
537
  updatedPrevState = _objectSpread(_objectSpread({}, updatedPrevState), {}, {
511
538
  prevProps: _objectSpread(_objectSpread({}, updatedPrevState.prevProps), {}, {
512
539
  search: nextProps.search
513
540
  }),
514
- query: getQueryFromSearch(nextProps.search, false)
541
+ query: getQueryFromSearch(nextProps.search, false, (_nextProps$searchForm = nextProps.searchFormat) !== null && _nextProps$searchForm !== void 0 ? _nextProps$searchForm : 'eql')
515
542
  });
516
543
  }
517
544
  if (updatedPrevState !== prevState) {
@@ -990,15 +1017,6 @@ EuiInMemoryTable.propTypes = {
990
1017
  * Sets the table-layout CSS property. Note that auto tableLayout prevents truncateText from working properly.
991
1018
  */
992
1019
  tableLayout: PropTypes.oneOf(["fixed", "auto"]),
993
- /**
994
- * Message to display if table is empty
995
- * @deprecated Use `noItemsMessage` instead.
996
- */
997
- /**
998
- * Message to display if table is empty
999
- * @deprecated Use `noItemsMessage` instead.
1000
- */
1001
- message: PropTypes.node,
1002
1020
  /**
1003
1021
  * Message to display if table is empty
1004
1022
  */
@@ -1007,194 +1025,28 @@ EuiInMemoryTable.propTypes = {
1007
1025
  */
1008
1026
  noItemsMessage: PropTypes.node,
1009
1027
  /**
1010
- * Configures {@link Search}.
1028
+ * Configures the search bar. Can be `true` for defaults,
1029
+ * or an {@link EuiSearchBarProps} object.
1030
+ *
1031
+ * When `searchFormat="text"`, `query` and `defaultQuery` must be strings
1032
+ * ({@link Query} objects are ignored).
1011
1033
  */
1012
1034
  /**
1013
- * Configures {@link Search}.
1035
+ * Configures the search bar. Can be `true` for defaults,
1036
+ * or an {@link EuiSearchBarProps} object.
1037
+ *
1038
+ * When `searchFormat="text"`, `query` and `defaultQuery` must be strings
1039
+ * ({@link Query} objects are ignored).
1014
1040
  */
1015
1041
  search: PropTypes.oneOfType([PropTypes.bool.isRequired, PropTypes.shape({
1016
- onChange: PropTypes.func,
1017
- /**
1018
- The initial query the bar will hold when first mounted
1019
- */
1020
- defaultQuery: PropTypes.oneOfType([PropTypes.any.isRequired, PropTypes.string.isRequired]),
1021
- /**
1022
- If you wish to use the search bar as a controlled component, continuously pass the query via this prop.
1023
- */
1024
- query: PropTypes.oneOfType([PropTypes.any.isRequired, PropTypes.string.isRequired]),
1025
- /**
1026
- Configures the search box. Set `placeholder` to change the placeholder text in the box and `incremental` to support incremental (as you type) search.
1027
- */
1028
- box: PropTypes.shape({
1029
- name: PropTypes.string,
1030
- id: PropTypes.string,
1031
- placeholder: PropTypes.string,
1032
- value: PropTypes.string,
1033
- isInvalid: PropTypes.bool,
1034
- /**
1035
- * Expand to fill 100% of the parent.
1036
- * Defaults to `fullWidth` prop of `<EuiForm>`.
1037
- * @default false
1038
- */
1039
- fullWidth: PropTypes.bool,
1040
- isLoading: PropTypes.bool,
1041
- /**
1042
- * Called when the user presses [Enter] OR on change if the incremental prop is `true`.
1043
- * If you don't need the on[Enter] functionality, prefer using onChange
1044
- */
1045
- onSearch: PropTypes.func,
1046
- /**
1047
- * When `true` the search will be executed (that is, the `onSearch` will be called) as the
1048
- * user types.
1049
- */
1050
- incremental: PropTypes.bool,
1051
- /**
1052
- * when `true` creates a shorter height input
1053
- */
1054
- compressed: PropTypes.bool,
1055
- inputRef: PropTypes.func,
1056
- /**
1057
- * Shows a button that quickly clears any input
1058
- */
1059
- isClearable: PropTypes.bool,
1060
- /**
1061
- * Creates an input group with element(s) coming before input
1062
- * `string` | `ReactElement` or an array of these
1063
- */
1064
- prepend: PropTypes.oneOfType([PropTypes.oneOfType([PropTypes.string.isRequired, PropTypes.element.isRequired]).isRequired, PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string.isRequired, PropTypes.element.isRequired]).isRequired).isRequired]),
1065
- /**
1066
- * Creates an input group with element(s) coming after input.
1067
- * `string` | `ReactElement` or an array of these
1068
- */
1069
- append: PropTypes.oneOfType([PropTypes.oneOfType([PropTypes.string.isRequired, PropTypes.element.isRequired]).isRequired, PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string.isRequired, PropTypes.element.isRequired]).isRequired).isRequired]),
1070
- className: PropTypes.string,
1071
- "aria-label": PropTypes.string,
1072
- "data-test-subj": PropTypes.string,
1073
- css: PropTypes.any,
1074
- // Boolean values are not meaningful to this EuiSearchBox, but are allowed so that other
1075
- // components can use e.g. a true value to mean "auto-derive a schema". See EuiInMemoryTable.
1076
- // Admittedly, this is a bit of a hack.
1077
- schema: PropTypes.oneOfType([PropTypes.shape({
1078
- strict: PropTypes.bool,
1079
- fields: PropTypes.any,
1080
- flags: PropTypes.arrayOf(PropTypes.string.isRequired),
1081
- // Controls which phrases will be parsed as field clauses
1082
- recognizedFields: PropTypes.arrayOf(PropTypes.string.isRequired)
1083
- }).isRequired, PropTypes.bool.isRequired])
1084
- }),
1085
- /**
1086
- An array of search filters. See {@link SearchFilterConfig}.
1087
- */
1088
- filters: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.shape({
1089
- type: PropTypes.oneOf(["is"]).isRequired,
1090
- field: PropTypes.string.isRequired,
1091
- name: PropTypes.string.isRequired,
1092
- negatedName: PropTypes.string,
1093
- available: PropTypes.func
1094
- }).isRequired, PropTypes.shape({
1095
- type: PropTypes.oneOf(["field_value_selection"]).isRequired,
1096
- field: PropTypes.string,
1097
- name: PropTypes.string.isRequired,
1098
- /**
1099
- * See {@link FieldValueOptionType}
1100
- */
1101
- options: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.shape({
1102
- field: PropTypes.string,
1103
- value: PropTypes.oneOfType([PropTypes.string.isRequired, PropTypes.number.isRequired, PropTypes.bool.isRequired, PropTypes.shape({
1104
- type: PropTypes.oneOf(["date"]).isRequired,
1105
- raw: PropTypes.any.isRequired,
1106
- granularity: PropTypes.oneOfType([PropTypes.shape({
1107
- es: PropTypes.oneOf(["d", "w", "M", "y"]).isRequired,
1108
- js: PropTypes.oneOf(["day", "week", "month", "year"]).isRequired,
1109
- isSame: PropTypes.func.isRequired,
1110
- start: PropTypes.func.isRequired,
1111
- startOfNext: PropTypes.func.isRequired,
1112
- iso8601: PropTypes.func.isRequired
1113
- }).isRequired, PropTypes.oneOf([undefined])]).isRequired,
1114
- text: PropTypes.string.isRequired,
1115
- resolve: PropTypes.func.isRequired
1116
- }).isRequired]).isRequired,
1117
- name: PropTypes.string,
1118
- view: PropTypes.node
1119
- }).isRequired).isRequired, PropTypes.func.isRequired]).isRequired,
1120
- filterWith: PropTypes.oneOfType([PropTypes.oneOf(["prefix", "includes"]), PropTypes.func.isRequired]),
1121
- cache: PropTypes.number,
1122
- multiSelect: PropTypes.oneOfType([PropTypes.bool.isRequired, PropTypes.oneOf(["and", "or"])]),
1123
- loadingMessage: PropTypes.string,
1124
- noOptionsMessage: PropTypes.string,
1125
- searchThreshold: PropTypes.number,
1126
- available: PropTypes.func,
1127
- autoClose: PropTypes.bool,
1128
- operator: PropTypes.oneOf(["eq", "exact", "gt", "gte", "lt", "lte"]),
1129
- autoSortOptions: PropTypes.bool
1130
- }).isRequired, PropTypes.shape({
1131
- type: PropTypes.oneOf(["field_value_toggle"]).isRequired,
1132
- field: PropTypes.string.isRequired,
1133
- value: PropTypes.oneOfType([PropTypes.string.isRequired, PropTypes.number.isRequired, PropTypes.bool.isRequired, PropTypes.shape({
1134
- type: PropTypes.oneOf(["date"]).isRequired,
1135
- raw: PropTypes.any.isRequired,
1136
- granularity: PropTypes.oneOfType([PropTypes.shape({
1137
- es: PropTypes.oneOf(["d", "w", "M", "y"]).isRequired,
1138
- js: PropTypes.oneOf(["day", "week", "month", "year"]).isRequired,
1139
- isSame: PropTypes.func.isRequired,
1140
- start: PropTypes.func.isRequired,
1141
- startOfNext: PropTypes.func.isRequired,
1142
- iso8601: PropTypes.func.isRequired
1143
- }).isRequired, PropTypes.oneOf([undefined])]).isRequired,
1144
- text: PropTypes.string.isRequired,
1145
- resolve: PropTypes.func.isRequired
1146
- }).isRequired]).isRequired,
1147
- name: PropTypes.string.isRequired,
1148
- negatedName: PropTypes.string,
1149
- available: PropTypes.func,
1150
- operator: PropTypes.oneOf(["eq", "exact", "gt", "gte", "lt", "lte"])
1151
- }).isRequired, PropTypes.shape({
1152
- type: PropTypes.oneOf(["field_value_toggle_group"]).isRequired,
1153
- field: PropTypes.string.isRequired,
1154
- /**
1155
- * See {@link FieldValueToggleGroupFilterItemType}
1156
- */
1157
- items: PropTypes.arrayOf(PropTypes.shape({
1158
- value: PropTypes.oneOfType([PropTypes.string.isRequired, PropTypes.number.isRequired, PropTypes.bool.isRequired]).isRequired,
1159
- name: PropTypes.string.isRequired,
1160
- negatedName: PropTypes.string,
1161
- operator: PropTypes.oneOf(["eq", "exact", "gt", "gte", "lt", "lte"])
1162
- }).isRequired).isRequired,
1163
- available: PropTypes.func
1164
- }).isRequired, PropTypes.shape({
1165
- type: PropTypes.oneOf(["custom_component"]).isRequired,
1166
- component: PropTypes.elementType.isRequired,
1167
- available: PropTypes.func
1168
- }).isRequired]).isRequired),
1169
- /**
1170
- * Tools which go to the left of the search bar.
1171
- */
1172
- toolsLeft: PropTypes.oneOfType([PropTypes.element.isRequired, PropTypes.arrayOf(PropTypes.element.isRequired).isRequired]),
1173
- /**
1174
- * Tools which go to the right of the search bar.
1175
- */
1176
- toolsRight: PropTypes.oneOfType([PropTypes.element.isRequired, PropTypes.arrayOf(PropTypes.element.isRequired).isRequired]),
1177
- /**
1178
- * Date formatter to use when parsing date values
1179
- */
1180
- dateFormat: PropTypes.any,
1181
- /**
1182
- * Hint to render below the search bar
1183
- */
1184
- hint: PropTypes.shape({
1185
- content: PropTypes.node.isRequired,
1186
- popoverProps: PropTypes.any
1187
- }),
1188
- className: PropTypes.string,
1189
- "aria-label": PropTypes.string,
1190
- "data-test-subj": PropTypes.string,
1191
- css: PropTypes.any
1042
+ onChange: PropTypes.func
1192
1043
  }).isRequired]),
1193
1044
  /**
1194
1045
  * By default, tables use `eql` format for search which allows using advanced filters.
1195
1046
  *
1196
1047
  * However, certain special characters (such as quotes, parentheses, and colons)
1197
1048
  * are reserved for EQL syntax and will error if used.
1049
+ *
1198
1050
  * If your table does not require filter search and instead requires searching for certain
1199
1051
  * symbols, use a plain `text` search format instead (note that filters will be ignored
1200
1052
  * in this format).
@@ -1206,6 +1058,7 @@ EuiInMemoryTable.propTypes = {
1206
1058
  *
1207
1059
  * However, certain special characters (such as quotes, parentheses, and colons)
1208
1060
  * are reserved for EQL syntax and will error if used.
1061
+ *
1209
1062
  * If your table does not require filter search and instead requires searching for certain
1210
1063
  * symbols, use a plain `text` search format instead (note that filters will be ignored
1211
1064
  * in this format).
@@ -63,6 +63,7 @@ export var EuiAbsoluteTab = function EuiAbsoluteTab(_ref) {
63
63
  setHasUnparsedText(false);
64
64
  setIsTextInvalid(false);
65
65
  }, [dateFormat]);
66
+ var textInputLabelId = useGeneratedHtmlId();
66
67
  var timeZomeDescriptionId = useGeneratedHtmlId();
67
68
  var submitButtonLabel = useEuiI18n('euiAbsoluteTab.dateFormatButtonLabel', 'Parse date');
68
69
  var dateFormatError = useEuiI18n('euiAbsoluteTab.dateFormatError', 'Allowed formats: {dateFormat}, ISO 8601, RFC 2822, or Unix timestamp.', {
@@ -163,6 +164,7 @@ export var EuiAbsoluteTab = function EuiAbsoluteTab(_ref) {
163
164
  helpText: hasUnparsedText && !isTextInvalid ? dateFormatError : undefined,
164
165
  describedByIds: [timeZomeDescriptionId]
165
166
  }, ___EmotionJSX(EuiFieldText, {
167
+ "aria-labelledby": textInputLabelId,
166
168
  compressed: true,
167
169
  isInvalid: isTextInvalid,
168
170
  value: textInputValue,
@@ -175,7 +177,9 @@ export var EuiAbsoluteTab = function EuiAbsoluteTab(_ref) {
175
177
  setIsReadyToParse(true);
176
178
  },
177
179
  "data-test-subj": "superDatePickerAbsoluteDateInput",
178
- prepend: ___EmotionJSX(EuiFormLabel, null, labelPrefix)
180
+ prepend: ___EmotionJSX(EuiFormLabel, {
181
+ id: textInputLabelId
182
+ }, labelPrefix)
179
183
  })), hasUnparsedText && ___EmotionJSX(EuiButtonIcon, {
180
184
  type: "submit",
181
185
  css: styles.euiAbsoluteTabDateForm__submit,
@@ -86,6 +86,7 @@ export var EuiRelativeTab = function EuiRelativeTab(_ref) {
86
86
  if (!parsedValue || !parsedValue.isValid()) return '';
87
87
  return parsedValue.locale(locale || 'en').format(dateFormat);
88
88
  }, [isInvalid, value, roundUp, locale, dateFormat]);
89
+ var textInputLabelId = useGeneratedHtmlId();
89
90
  var relativeDateInputNumberDescriptionId = useGeneratedHtmlId();
90
91
  var timeZomeDescriptionId = useGeneratedHtmlId();
91
92
  var numberAriaLabel = useEuiI18n('euiRelativeTab.numberInputLabel', 'Time span amount');
@@ -118,11 +119,14 @@ export var EuiRelativeTab = function EuiRelativeTab(_ref) {
118
119
  }))), ___EmotionJSX(EuiSpacer, {
119
120
  size: "s"
120
121
  }), ___EmotionJSX(EuiFieldText, {
122
+ "aria-labelledby": textInputLabelId,
121
123
  compressed: true,
122
124
  value: formattedValue,
123
125
  readOnly: true,
124
126
  "aria-describedby": timeZomeDescriptionId,
125
- prepend: ___EmotionJSX(EuiFormLabel, null, labelPrefix)
127
+ prepend: ___EmotionJSX(EuiFormLabel, {
128
+ id: textInputLabelId
129
+ }, labelPrefix)
126
130
  }), ___EmotionJSX(EuiScreenReaderOnly, null, ___EmotionJSX("p", {
127
131
  id: relativeDateInputNumberDescriptionId
128
132
  }, ___EmotionJSX(EuiI18n, {
@@ -54,7 +54,9 @@ export var EuiTimeZoneDisplay = function EuiTimeZoneDisplay(_ref) {
54
54
  "data-test-subj": "euiTimeZoneDisplay",
55
55
  "aria-label": label
56
56
  }, rest), typeof customRender === 'function' ? customRender({
57
- nameDisplay: nameDisplay
57
+ nameDisplay: nameDisplay,
58
+ utcOffset: utc,
59
+ timeZoneName: name
58
60
  }) : nameDisplay);
59
61
  };
60
62
 
@@ -9,4 +9,5 @@
9
9
  export { EuiCommonlyUsedTimeRanges } from './commonly_used_time_ranges';
10
10
  export { EuiQuickSelectPopover } from './quick_select_popover';
11
11
  export { EuiQuickSelect } from './quick_select';
12
+ export { EuiQuickSelectPanel } from './quick_select_panel';
12
13
  export { EuiRecentlyUsed } from './recently_used';
@@ -35,7 +35,7 @@ export var EuiTimeWindowButtons = function EuiTimeWindowButtons(_ref) {
35
35
  zoomFactor = _ref$zoomFactor === void 0 ? ZOOM_FACTOR_DEFAULT : _ref$zoomFactor;
36
36
  var buttonColor = 'text';
37
37
  var buttonSize = compressed ? 's' : 'm';
38
- var iconSize = compressed ? 's' : 'm';
38
+ var iconSize = 'm';
39
39
  var styles = useEuiMemoizedStyles(euiButtonGroupButtonsStyles);
40
40
  var _useEuiTimeWindow = useEuiTimeWindow(start, end, applyTime, {
41
41
  zoomFactor: zoomFactor
@@ -236,7 +236,7 @@ describe('EuiFilterGroup multiselect example', function () {
236
236
  cy.realPress('Enter');
237
237
  cy.get('div[data-test-subj="euiSelectableList"]').should('exist');
238
238
  cy.realPress('Tab');
239
- cy.repeatRealPress('ArrowDown', 3);
239
+ cy.repeatRealPress('ArrowDown', 4);
240
240
  cy.realPress('Enter');
241
241
  cy.get('li[aria-selected="true"]').find('span.euiSelectableListItem__text').should('have.text', 'Dmitri Shostakovich. Checked option. To exclude this option, press Enter.');
242
242
  cy.realPress('ArrowDown');
@@ -15,6 +15,7 @@ import PropTypes from "prop-types";
15
15
  import classNames from 'classnames';
16
16
  import { useEuiMemoizedStyles, getSecureRelForTarget } from '../../../services';
17
17
  import { validateHref } from '../../../services/security/href_validator';
18
+ import { useEuiButtonColorCSS } from '../../../global_styling';
18
19
  import { EuiIcon } from '../../icon';
19
20
  import { euiHeaderLogoStyles } from './header_logo.styles';
20
21
  import { jsx as ___EmotionJSX } from "@emotion/react";
@@ -31,6 +32,10 @@ export var EuiHeaderLogo = function EuiHeaderLogo(_ref) {
31
32
  rest = _objectWithoutProperties(_ref, _excluded);
32
33
  var classes = classNames('euiHeaderLogo', className);
33
34
  var styles = useEuiMemoizedStyles(euiHeaderLogoStyles);
35
+ var buttonColorStyles = useEuiButtonColorCSS({
36
+ display: 'empty'
37
+ });
38
+ var cssStyles = [styles.euiHeaderLogo, buttonColorStyles.text];
34
39
  var secureRel = getSecureRelForTarget({
35
40
  href: href,
36
41
  rel: rel,
@@ -41,7 +46,7 @@ export var EuiHeaderLogo = function EuiHeaderLogo(_ref) {
41
46
  href: isHrefValid ? href : '',
42
47
  rel: secureRel,
43
48
  target: target,
44
- css: styles.euiHeaderLogo,
49
+ css: cssStyles,
45
50
  className: classes
46
51
  }, rest), ___EmotionJSX(EuiIcon, {
47
52
  "aria-label": iconTitle,
@@ -15,7 +15,7 @@ export var euiHeaderLogoStyles = function euiHeaderLogoStyles(euiThemeContext) {
15
15
  var _euiHeaderVariables = euiHeaderVariables(euiThemeContext),
16
16
  childHeight = _euiHeaderVariables.childHeight;
17
17
  return {
18
- euiHeaderLogo: /*#__PURE__*/css("position:relative;", logicalCSS('height', childHeight), " line-height:", childHeight, ";", logicalCSS('min-width', childHeight), " padding-inline:", euiTheme.size.s, ";display:inline-flex;align-items:center;white-space:nowrap;", euiBreakpoint(euiThemeContext, ['xs']), "{", logicalCSS('padding-left', euiTheme.size.xs), ";};label:euiHeaderLogo;"),
18
+ euiHeaderLogo: /*#__PURE__*/css("position:relative;", logicalCSS('height', childHeight), " line-height:", childHeight, ";", logicalCSS('min-width', childHeight), " padding-inline:", euiTheme.size.s, ";display:inline-flex;border-radius:", euiTheme.border.radius.small, ";align-items:center;white-space:nowrap;", euiBreakpoint(euiThemeContext, ['xs']), "{", logicalCSS('padding-left', euiTheme.size.xs), ";};label:euiHeaderLogo;"),
19
19
  euiHeaderLogo__text: /*#__PURE__*/css(euiTitle(euiThemeContext, 'xxs'), " ", logicalCSS('padding-left', euiTheme.size.base), " ", euiBreakpoint(euiThemeContext, ['xs']), "{", logicalCSS('padding-left', euiTheme.size.s), ";};label:euiHeaderLogo__text;")
20
20
  };
21
21
  };
@@ -14,11 +14,11 @@ import { logicalSizeCSS, euiCanAnimate } from '../../global_styling';
14
14
  export var iconLoadingOpacity = 0.05;
15
15
  var iconLoading = keyframes(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n 0% {\n opacity: ", ";\n }\n\n 100% {\n opacity: 1;\n }\n"])), iconLoadingOpacity);
16
16
  var _ref = process.env.NODE_ENV === "production" ? {
17
- name: "njd749-logoElasticOutline",
18
- styles: "*[fill]{fill:none!important;}.outline{fill:currentColor!important;};label:logoElasticOutline;"
17
+ name: "p0011s-logoElasticOutline",
18
+ styles: "*[fill]{fill:none!important;stroke:currentColor!important;};label:logoElasticOutline;"
19
19
  } : {
20
- name: "njd749-logoElasticOutline",
21
- styles: "*[fill]{fill:none!important;}.outline{fill:currentColor!important;};label:logoElasticOutline;",
20
+ name: "p0011s-logoElasticOutline",
21
+ styles: "*[fill]{fill:none!important;stroke:currentColor!important;};label:logoElasticOutline;",
22
22
  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
23
23
  };
24
24
  var _ref2 = process.env.NODE_ENV === "production" ? {