@elastic/eui 88.5.4 → 89.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.
- package/dist/eui_theme_dark.css +26 -526
- package/dist/eui_theme_dark.min.css +1 -1
- package/dist/eui_theme_light.css +26 -526
- package/dist/eui_theme_light.min.css +1 -1
- package/es/components/basic_table/basic_table.js +7 -2
- package/es/components/basic_table/in_memory_table.js +7 -2
- package/es/components/collapsible_nav/collapsible_nav.js +5 -0
- package/es/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_item.js +4 -2
- package/es/components/color_picker/index.js +0 -4
- package/es/components/combo_box/combo_box.js +142 -304
- package/es/components/combo_box/combo_box_input/combo_box_input.js +0 -13
- package/es/components/combo_box/combo_box_options_list/combo_box_options_list.js +34 -118
- package/es/components/context_menu/context_menu_panel.js +6 -6
- package/es/components/flex/flex_grid.styles.js +1 -1
- package/es/components/flex/flex_group.styles.js +1 -1
- package/es/components/flyout/flyout.js +32 -33
- package/es/components/flyout/flyout.styles.js +13 -3
- package/es/components/form/range/dual_range.js +4 -0
- package/es/components/form/range/range.js +4 -0
- package/es/components/index.js +0 -1
- package/es/components/popover/input_popover.js +47 -3
- package/es/components/popover/popover.js +2 -2
- package/es/components/table/table_row_cell.js +27 -9
- package/es/components/text_truncate/index.js +1 -0
- package/es/components/text_truncate/text_block_truncate.js +78 -0
- package/es/global_styling/reset/global_styles.js +16 -2
- package/es/services/accessibility/index.js +0 -3
- package/es/services/index.js +1 -1
- package/es/test/rtl/component_helpers.d.ts +2 -0
- package/es/test/rtl/component_helpers.js +29 -1
- package/eui.d.ts +375 -667
- package/i18ntokens.json +52 -286
- package/lib/components/basic_table/basic_table.js +7 -2
- package/lib/components/basic_table/in_memory_table.js +7 -2
- package/lib/components/collapsible_nav/collapsible_nav.js +5 -0
- package/lib/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_item.js +4 -2
- package/lib/components/color_picker/index.js +0 -7
- package/lib/components/combo_box/combo_box.js +141 -303
- package/lib/components/combo_box/combo_box_input/combo_box_input.js +0 -13
- package/lib/components/combo_box/combo_box_options_list/combo_box_options_list.js +34 -118
- package/lib/components/context_menu/context_menu_panel.js +5 -5
- package/lib/components/flex/flex_grid.styles.js +1 -1
- package/lib/components/flex/flex_group.styles.js +1 -1
- package/lib/components/flyout/flyout.js +31 -32
- package/lib/components/flyout/flyout.styles.js +19 -10
- package/lib/components/form/range/dual_range.js +4 -0
- package/lib/components/index.js +0 -11
- package/lib/components/popover/input_popover.js +48 -3
- package/lib/components/popover/popover.js +1 -1
- package/lib/components/table/table_row_cell.js +26 -8
- package/lib/components/text_truncate/index.js +7 -0
- package/lib/components/text_truncate/text_block_truncate.js +85 -0
- package/lib/global_styling/reset/global_styles.js +16 -2
- package/lib/services/accessibility/index.js +0 -21
- package/lib/services/index.js +0 -21
- package/lib/test/rtl/component_helpers.d.ts +2 -0
- package/lib/test/rtl/component_helpers.js +31 -2
- package/optimize/es/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_item.js +4 -2
- package/optimize/es/components/color_picker/index.js +0 -4
- package/optimize/es/components/combo_box/combo_box.js +137 -304
- package/optimize/es/components/combo_box/combo_box_input/combo_box_input.js +0 -12
- package/optimize/es/components/combo_box/combo_box_options_list/combo_box_options_list.js +28 -107
- package/optimize/es/components/context_menu/context_menu_panel.js +6 -6
- package/optimize/es/components/flex/flex_grid.styles.js +1 -1
- package/optimize/es/components/flex/flex_group.styles.js +1 -1
- package/optimize/es/components/flyout/flyout.js +32 -33
- package/optimize/es/components/flyout/flyout.styles.js +13 -3
- package/optimize/es/components/index.js +0 -1
- package/optimize/es/components/popover/input_popover.js +43 -3
- package/optimize/es/components/popover/popover.js +2 -2
- package/optimize/es/components/table/table_row_cell.js +13 -5
- package/optimize/es/components/text_truncate/index.js +1 -0
- package/optimize/es/components/text_truncate/text_block_truncate.js +58 -0
- package/optimize/es/global_styling/reset/global_styles.js +13 -2
- package/optimize/es/services/accessibility/index.js +0 -3
- package/optimize/es/services/index.js +1 -1
- package/optimize/es/test/rtl/component_helpers.d.ts +2 -0
- package/optimize/es/test/rtl/component_helpers.js +29 -1
- package/optimize/lib/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_item.js +4 -2
- package/optimize/lib/components/color_picker/index.js +0 -7
- package/optimize/lib/components/combo_box/combo_box.js +136 -303
- package/optimize/lib/components/combo_box/combo_box_input/combo_box_input.js +0 -12
- package/optimize/lib/components/combo_box/combo_box_options_list/combo_box_options_list.js +28 -107
- package/optimize/lib/components/context_menu/context_menu_panel.js +5 -5
- package/optimize/lib/components/flex/flex_grid.styles.js +1 -1
- package/optimize/lib/components/flex/flex_group.styles.js +1 -1
- package/optimize/lib/components/flyout/flyout.js +31 -32
- package/optimize/lib/components/flyout/flyout.styles.js +19 -10
- package/optimize/lib/components/index.js +0 -11
- package/optimize/lib/components/popover/input_popover.js +44 -3
- package/optimize/lib/components/popover/popover.js +1 -1
- package/optimize/lib/components/table/table_row_cell.js +12 -4
- package/optimize/lib/components/text_truncate/index.js +7 -0
- package/optimize/lib/components/text_truncate/text_block_truncate.js +66 -0
- package/optimize/lib/global_styling/reset/global_styles.js +19 -10
- package/optimize/lib/services/accessibility/index.js +0 -21
- package/optimize/lib/services/index.js +0 -21
- package/optimize/lib/test/rtl/component_helpers.d.ts +2 -0
- package/optimize/lib/test/rtl/component_helpers.js +31 -2
- package/package.json +1 -1
- package/src/components/combo_box/combo_box_options_list/_combo_box_options_list.scss +5 -15
- package/src/components/context_menu/_context_menu_panel.scss +4 -0
- package/src/components/index.scss +0 -1
- package/src/global_styling/mixins/_index.scss +0 -1
- package/src/global_styling/variables/_index.scss +0 -1
- package/src/test/README.md +0 -15
- package/src/themes/amsterdam/global_styling/mixins/_index.scss +0 -1
- package/test-env/components/basic_table/basic_table.js +7 -2
- package/test-env/components/basic_table/in_memory_table.js +7 -2
- package/test-env/components/collapsible_nav/collapsible_nav.js +5 -0
- package/test-env/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_item.js +4 -2
- package/test-env/components/color_picker/index.js +0 -7
- package/test-env/components/combo_box/combo_box.js +141 -303
- package/test-env/components/combo_box/combo_box_input/combo_box_input.js +0 -13
- package/test-env/components/combo_box/combo_box_options_list/combo_box_options_list.js +33 -117
- package/test-env/components/context_menu/context_menu_panel.js +5 -5
- package/test-env/components/flex/flex_grid.styles.js +1 -1
- package/test-env/components/flex/flex_group.styles.js +1 -1
- package/test-env/components/flyout/flyout.styles.js +19 -10
- package/test-env/components/form/range/dual_range.js +4 -0
- package/test-env/components/index.js +0 -11
- package/test-env/components/popover/input_popover.js +48 -3
- package/test-env/components/popover/popover.js +1 -1
- package/test-env/components/table/table_row_cell.js +26 -8
- package/test-env/components/text_truncate/index.js +7 -0
- package/test-env/components/text_truncate/text_block_truncate.js +82 -0
- package/test-env/global_styling/reset/global_styles.js +19 -10
- package/test-env/services/accessibility/index.js +0 -21
- package/test-env/services/index.js +0 -21
- package/test-env/test/rtl/component_helpers.js +31 -2
- package/es/components/color_picker/color_stops/color_stop_thumb.js +0 -371
- package/es/components/color_picker/color_stops/color_stop_thumb.styles.js +0 -55
- package/es/components/color_picker/color_stops/color_stops.js +0 -499
- package/es/components/color_picker/color_stops/color_stops.styles.js +0 -61
- package/es/components/color_picker/color_stops/index.js +0 -9
- package/es/components/color_picker/color_stops/utils.js +0 -95
- package/es/components/suggest/index.js +0 -10
- package/es/components/suggest/suggest.a11y.js +0 -70
- package/es/components/suggest/suggest.js +0 -347
- package/es/components/suggest/suggest_item.js +0 -123
- package/es/components/suggest/types.js +0 -9
- package/es/services/accessibility/accessible_click_keys.js +0 -17
- package/es/services/accessibility/cascading_menu_keys.js +0 -28
- package/es/services/accessibility/combo_box_keys.js +0 -25
- package/lib/components/color_picker/color_stops/color_stop_thumb.js +0 -380
- package/lib/components/color_picker/color_stops/color_stop_thumb.styles.js +0 -62
- package/lib/components/color_picker/color_stops/color_stops.js +0 -505
- package/lib/components/color_picker/color_stops/color_stops.styles.js +0 -67
- package/lib/components/color_picker/color_stops/index.js +0 -12
- package/lib/components/color_picker/color_stops/utils.js +0 -108
- package/lib/components/suggest/index.js +0 -19
- package/lib/components/suggest/suggest.a11y.js +0 -73
- package/lib/components/suggest/suggest.js +0 -356
- package/lib/components/suggest/suggest_item.js +0 -130
- package/lib/components/suggest/types.js +0 -16
- package/lib/services/accessibility/accessible_click_keys.js +0 -21
- package/lib/services/accessibility/cascading_menu_keys.js +0 -35
- package/lib/services/accessibility/combo_box_keys.js +0 -32
- package/optimize/es/components/color_picker/color_stops/color_stop_thumb.js +0 -329
- package/optimize/es/components/color_picker/color_stops/color_stop_thumb.styles.js +0 -55
- package/optimize/es/components/color_picker/color_stops/color_stops.js +0 -444
- package/optimize/es/components/color_picker/color_stops/color_stops.styles.js +0 -61
- package/optimize/es/components/color_picker/color_stops/index.js +0 -9
- package/optimize/es/components/color_picker/color_stops/utils.js +0 -90
- package/optimize/es/components/suggest/index.js +0 -10
- package/optimize/es/components/suggest/suggest.a11y.js +0 -70
- package/optimize/es/components/suggest/suggest.js +0 -256
- package/optimize/es/components/suggest/suggest_item.js +0 -89
- package/optimize/es/components/suggest/types.js +0 -9
- package/optimize/es/services/accessibility/accessible_click_keys.js +0 -14
- package/optimize/es/services/accessibility/cascading_menu_keys.js +0 -28
- package/optimize/es/services/accessibility/combo_box_keys.js +0 -25
- package/optimize/lib/components/color_picker/color_stops/color_stop_thumb.js +0 -339
- package/optimize/lib/components/color_picker/color_stops/color_stop_thumb.styles.js +0 -62
- package/optimize/lib/components/color_picker/color_stops/color_stops.js +0 -451
- package/optimize/lib/components/color_picker/color_stops/color_stops.styles.js +0 -67
- package/optimize/lib/components/color_picker/color_stops/index.js +0 -12
- package/optimize/lib/components/color_picker/color_stops/utils.js +0 -106
- package/optimize/lib/components/suggest/index.js +0 -19
- package/optimize/lib/components/suggest/suggest.a11y.js +0 -73
- package/optimize/lib/components/suggest/suggest.js +0 -266
- package/optimize/lib/components/suggest/suggest_item.js +0 -96
- package/optimize/lib/components/suggest/types.js +0 -16
- package/optimize/lib/services/accessibility/accessible_click_keys.js +0 -20
- package/optimize/lib/services/accessibility/cascading_menu_keys.js +0 -35
- package/optimize/lib/services/accessibility/combo_box_keys.js +0 -32
- package/src/components/suggest/_index.scss +0 -5
- package/src/components/suggest/_suggest_input.scss +0 -4
- package/src/components/suggest/_suggest_item.scss +0 -103
- package/src/components/suggest/_variables.scss +0 -13
- package/src/global_styling/mixins/_header.scss +0 -29
- package/src/global_styling/variables/_header.scss +0 -3
- package/test-env/components/color_picker/color_stops/color_stop_thumb.js +0 -372
- package/test-env/components/color_picker/color_stops/color_stop_thumb.styles.js +0 -62
- package/test-env/components/color_picker/color_stops/color_stops.js +0 -494
- package/test-env/components/color_picker/color_stops/color_stops.styles.js +0 -67
- package/test-env/components/color_picker/color_stops/index.js +0 -12
- package/test-env/components/color_picker/color_stops/utils.js +0 -106
- package/test-env/components/suggest/index.js +0 -19
- package/test-env/components/suggest/suggest.a11y.js +0 -73
- package/test-env/components/suggest/suggest.js +0 -348
- package/test-env/components/suggest/suggest_item.js +0 -129
- package/test-env/components/suggest/types.js +0 -16
- package/test-env/services/accessibility/accessible_click_keys.js +0 -20
- package/test-env/services/accessibility/cascading_menu_keys.js +0 -35
- package/test-env/services/accessibility/combo_box_keys.js +0 -32
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
/*
|
|
2
|
-
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
|
3
|
-
* or more contributor license agreements. Licensed under the Elastic License
|
|
4
|
-
* 2.0 and the Server Side Public License, v 1; you may not use this file except
|
|
5
|
-
* in compliance with, at your election, the Elastic License 2.0 or the Server
|
|
6
|
-
* Side Public License, v 1.
|
|
7
|
-
*/
|
|
8
|
-
|
|
9
|
-
export { EuiSuggestItem } from './suggest_item';
|
|
10
|
-
export { EuiSuggest } from './suggest';
|
|
@@ -1,70 +0,0 @@
|
|
|
1
|
-
/*
|
|
2
|
-
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
|
3
|
-
* or more contributor license agreements. Licensed under the Elastic License
|
|
4
|
-
* 2.0 and the Server Side Public License, v 1; you may not use this file except
|
|
5
|
-
* in compliance with, at your election, the Elastic License 2.0 or the Server
|
|
6
|
-
* Side Public License, v 1.
|
|
7
|
-
*/
|
|
8
|
-
|
|
9
|
-
/// <reference types="cypress" />
|
|
10
|
-
/// <reference types="cypress-real-events" />
|
|
11
|
-
/// <reference types="../../../cypress/support" />
|
|
12
|
-
|
|
13
|
-
import React from 'react';
|
|
14
|
-
import { EuiFormRow } from '../form';
|
|
15
|
-
import { EuiSuggest } from './suggest';
|
|
16
|
-
import { jsx as ___EmotionJSX } from "@emotion/react";
|
|
17
|
-
var Suggest = function Suggest() {
|
|
18
|
-
var suggestedItems = [{
|
|
19
|
-
type: {
|
|
20
|
-
iconType: 'accessibility',
|
|
21
|
-
color: 'tint1'
|
|
22
|
-
},
|
|
23
|
-
label: 'Accessibility',
|
|
24
|
-
description: 'A short description'
|
|
25
|
-
}, {
|
|
26
|
-
type: {
|
|
27
|
-
iconType: 'image',
|
|
28
|
-
color: 'tint2'
|
|
29
|
-
},
|
|
30
|
-
label: 'Images',
|
|
31
|
-
description: 'Another short description'
|
|
32
|
-
}, {
|
|
33
|
-
type: {
|
|
34
|
-
iconType: 'lock',
|
|
35
|
-
color: 'tint3'
|
|
36
|
-
},
|
|
37
|
-
label: 'Locks',
|
|
38
|
-
description: 'A third short description'
|
|
39
|
-
}];
|
|
40
|
-
return ___EmotionJSX(EuiFormRow, {
|
|
41
|
-
label: "Suggest a topic",
|
|
42
|
-
id: "cy-label-suggest-1"
|
|
43
|
-
}, ___EmotionJSX(EuiSuggest, {
|
|
44
|
-
"aria-labelledby": "cy-label-suggest-1-label",
|
|
45
|
-
suggestions: suggestedItems
|
|
46
|
-
}));
|
|
47
|
-
};
|
|
48
|
-
describe('EuiSuggest', function () {
|
|
49
|
-
beforeEach(function () {
|
|
50
|
-
cy.realMount(___EmotionJSX(Suggest, null));
|
|
51
|
-
});
|
|
52
|
-
describe('Automated accessibility check', function () {
|
|
53
|
-
it('has zero violations when rendered', function () {
|
|
54
|
-
cy.checkAxe();
|
|
55
|
-
});
|
|
56
|
-
});
|
|
57
|
-
describe('Keyboard accessibility', function () {
|
|
58
|
-
it('has zero violations after traversing list items', function () {
|
|
59
|
-
cy.realPress('Tab');
|
|
60
|
-
cy.get('#cy-label-suggest-1').should('have.focus');
|
|
61
|
-
cy.get('ul[role="listbox"]').should('exist');
|
|
62
|
-
cy.realPress('ArrowDown');
|
|
63
|
-
cy.realPress('ArrowUp');
|
|
64
|
-
cy.realPress('ArrowRight');
|
|
65
|
-
cy.realPress('ArrowLeft');
|
|
66
|
-
cy.get('li[role="option"]').first().should('have.attr', 'aria-selected', 'true');
|
|
67
|
-
cy.checkAxe();
|
|
68
|
-
});
|
|
69
|
-
});
|
|
70
|
-
});
|
|
@@ -1,347 +0,0 @@
|
|
|
1
|
-
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
|
2
|
-
var _excluded = ["onItemClick", "onBlur", "onFocus", "onInput", "onSearch", "status", "append", "tooltipContent", "suggestions", "id", "aria-label", "aria-labelledby", "isPreFiltered", "isVirtualized", "fullWidth", "maxHeight"];
|
|
3
|
-
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
4
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
5
|
-
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
6
|
-
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
|
|
7
|
-
function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
8
|
-
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
9
|
-
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
10
|
-
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
11
|
-
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
|
12
|
-
function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
|
|
13
|
-
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
14
|
-
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
15
|
-
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
16
|
-
/*
|
|
17
|
-
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
|
18
|
-
* or more contributor license agreements. Licensed under the Elastic License
|
|
19
|
-
* 2.0 and the Server Side Public License, v 1; you may not use this file except
|
|
20
|
-
* in compliance with, at your election, the Elastic License 2.0 or the Server
|
|
21
|
-
* Side Public License, v 1.
|
|
22
|
-
*/
|
|
23
|
-
|
|
24
|
-
import React, { useState, useCallback } from 'react';
|
|
25
|
-
import PropTypes from "prop-types";
|
|
26
|
-
import classNames from 'classnames';
|
|
27
|
-
import { EuiIcon } from '../icon';
|
|
28
|
-
import { useEuiI18n } from '../i18n';
|
|
29
|
-
import { EuiInputPopover } from '../popover';
|
|
30
|
-
import { EuiSelectable } from '../selectable';
|
|
31
|
-
import { EuiToolTip } from '../tool_tip';
|
|
32
|
-
import { EuiSuggestItem } from './suggest_item';
|
|
33
|
-
import { jsx as ___EmotionJSX } from "@emotion/react";
|
|
34
|
-
var statusMap = {
|
|
35
|
-
unsaved: {
|
|
36
|
-
icon: 'dot',
|
|
37
|
-
color: 'accent'
|
|
38
|
-
},
|
|
39
|
-
saved: {
|
|
40
|
-
icon: 'checkInCircleFilled',
|
|
41
|
-
color: 'success'
|
|
42
|
-
},
|
|
43
|
-
unchanged: {
|
|
44
|
-
icon: '',
|
|
45
|
-
color: 'success'
|
|
46
|
-
},
|
|
47
|
-
loading: {}
|
|
48
|
-
};
|
|
49
|
-
|
|
50
|
-
// keys of _EuiSuggestItemPropsBase
|
|
51
|
-
var suggestItemPropsKeys = ['label', 'type', 'description', 'labelDisplay', 'labelWidth', 'descriptionDisplay'];
|
|
52
|
-
|
|
53
|
-
/**
|
|
54
|
-
* @deprecated
|
|
55
|
-
*/
|
|
56
|
-
|
|
57
|
-
/**
|
|
58
|
-
* @deprecated
|
|
59
|
-
*/
|
|
60
|
-
|
|
61
|
-
/**
|
|
62
|
-
* @deprecated - EuiSuggest is scheduled for deprecation due to low internal usage and high
|
|
63
|
-
* overlap with other existing EUI components. We recommend using EuiSelectable instead,
|
|
64
|
-
* or copying this component into your own application for usage if necessary.
|
|
65
|
-
*
|
|
66
|
-
* The component will be permanently removed in October 2023.
|
|
67
|
-
*/
|
|
68
|
-
export var EuiSuggest = function EuiSuggest(_ref) {
|
|
69
|
-
var onItemClick = _ref.onItemClick,
|
|
70
|
-
onBlur = _ref.onBlur,
|
|
71
|
-
onFocus = _ref.onFocus,
|
|
72
|
-
onInput = _ref.onInput,
|
|
73
|
-
onSearch = _ref.onSearch,
|
|
74
|
-
_ref$status = _ref.status,
|
|
75
|
-
status = _ref$status === void 0 ? 'unchanged' : _ref$status,
|
|
76
|
-
append = _ref.append,
|
|
77
|
-
tooltipContent = _ref.tooltipContent,
|
|
78
|
-
suggestions = _ref.suggestions,
|
|
79
|
-
id = _ref.id,
|
|
80
|
-
ariaLabel = _ref['aria-label'],
|
|
81
|
-
labelId = _ref['aria-labelledby'],
|
|
82
|
-
_ref$isPreFiltered = _ref.isPreFiltered,
|
|
83
|
-
isPreFiltered = _ref$isPreFiltered === void 0 ? false : _ref$isPreFiltered,
|
|
84
|
-
_ref$isVirtualized = _ref.isVirtualized,
|
|
85
|
-
isVirtualized = _ref$isVirtualized === void 0 ? false : _ref$isVirtualized,
|
|
86
|
-
_ref$fullWidth = _ref.fullWidth,
|
|
87
|
-
fullWidth = _ref$fullWidth === void 0 ? true : _ref$fullWidth,
|
|
88
|
-
_ref$maxHeight = _ref.maxHeight,
|
|
89
|
-
maxHeight = _ref$maxHeight === void 0 ? '60vh' : _ref$maxHeight,
|
|
90
|
-
rest = _objectWithoutProperties(_ref, _excluded);
|
|
91
|
-
/**
|
|
92
|
-
* Popover helpers
|
|
93
|
-
*/
|
|
94
|
-
var _useState = useState(null),
|
|
95
|
-
_useState2 = _slicedToArray(_useState, 2),
|
|
96
|
-
popoverRef = _useState2[0],
|
|
97
|
-
setPopoverRef = _useState2[1];
|
|
98
|
-
var _useState3 = useState(false),
|
|
99
|
-
_useState4 = _slicedToArray(_useState3, 2),
|
|
100
|
-
isPopoverOpen = _useState4[0],
|
|
101
|
-
setIsPopoverOpen = _useState4[1];
|
|
102
|
-
var openPopover = function openPopover() {
|
|
103
|
-
return setIsPopoverOpen(true);
|
|
104
|
-
};
|
|
105
|
-
var closePopover = function closePopover() {
|
|
106
|
-
return setIsPopoverOpen(false);
|
|
107
|
-
};
|
|
108
|
-
|
|
109
|
-
/**
|
|
110
|
-
* Search helpers
|
|
111
|
-
*/
|
|
112
|
-
var searchOnFocus = function searchOnFocus(e) {
|
|
113
|
-
onFocus === null || onFocus === void 0 ? void 0 : onFocus(e);
|
|
114
|
-
openPopover();
|
|
115
|
-
};
|
|
116
|
-
var searchOnBlur = function searchOnBlur(e) {
|
|
117
|
-
onBlur === null || onBlur === void 0 ? void 0 : onBlur(e);
|
|
118
|
-
if (!(popoverRef !== null && popoverRef !== void 0 && popoverRef.contains(e.relatedTarget))) {
|
|
119
|
-
closePopover();
|
|
120
|
-
}
|
|
121
|
-
};
|
|
122
|
-
var searchOnInput = function searchOnInput(e) {
|
|
123
|
-
onInput === null || onInput === void 0 ? void 0 : onInput(e.target);
|
|
124
|
-
openPopover();
|
|
125
|
-
};
|
|
126
|
-
var searchOnChange = function searchOnChange(value) {
|
|
127
|
-
onSearch === null || onSearch === void 0 ? void 0 : onSearch(value);
|
|
128
|
-
};
|
|
129
|
-
|
|
130
|
-
/**
|
|
131
|
-
* Status
|
|
132
|
-
*/
|
|
133
|
-
var icon = '';
|
|
134
|
-
var color = '';
|
|
135
|
-
if (statusMap[status]) {
|
|
136
|
-
icon = statusMap[status].icon || '';
|
|
137
|
-
color = statusMap[status].color || '';
|
|
138
|
-
}
|
|
139
|
-
|
|
140
|
-
// EuiFieldText's append accepts an array of elements so start by creating an empty array
|
|
141
|
-
var appendArray = [];
|
|
142
|
-
var _useEuiI18n = useEuiI18n(['euiSuggest.stateSavedTooltip', 'euiSuggest.stateUnsavedTooltip'], ['Saved.', 'Changes have not been saved.']),
|
|
143
|
-
_useEuiI18n2 = _slicedToArray(_useEuiI18n, 2),
|
|
144
|
-
statusSaved = _useEuiI18n2[0],
|
|
145
|
-
statusUnsaved = _useEuiI18n2[1];
|
|
146
|
-
statusMap.saved.tooltip = statusSaved;
|
|
147
|
-
statusMap.unsaved.tooltip = statusUnsaved;
|
|
148
|
-
var statusElement = (status === 'saved' || status === 'unsaved') && ___EmotionJSX(EuiToolTip, {
|
|
149
|
-
position: "left",
|
|
150
|
-
content: tooltipContent || statusMap[status].tooltip
|
|
151
|
-
}, ___EmotionJSX(EuiIcon, {
|
|
152
|
-
className: "euiSuggestInput__statusIcon",
|
|
153
|
-
color: color,
|
|
154
|
-
type: icon
|
|
155
|
-
}));
|
|
156
|
-
|
|
157
|
-
// Push the status element to the array if it is not undefined
|
|
158
|
-
if (statusElement) appendArray.push(statusElement);
|
|
159
|
-
|
|
160
|
-
// Check to see if consumer passed an append item and if so, add it to the array
|
|
161
|
-
if (append) appendArray.push(append);
|
|
162
|
-
var _useEuiI18n3 = useEuiI18n(['euiSuggest.stateLoading', 'euiSuggest.stateSaved', 'euiSuggest.stateUnsaved', 'euiSuggest.stateUnchanged'], ['State: loading.', 'State: saved.', 'State: unsaved.', 'State: unchanged.']),
|
|
163
|
-
_useEuiI18n4 = _slicedToArray(_useEuiI18n3, 4),
|
|
164
|
-
stateLoading = _useEuiI18n4[0],
|
|
165
|
-
stateSaved = _useEuiI18n4[1],
|
|
166
|
-
stateUnsaved = _useEuiI18n4[2],
|
|
167
|
-
stateUnchanged = _useEuiI18n4[3];
|
|
168
|
-
var stateMessageMap = {
|
|
169
|
-
loading: stateLoading,
|
|
170
|
-
saved: stateSaved,
|
|
171
|
-
unsaved: stateUnsaved,
|
|
172
|
-
unchanged: stateUnchanged
|
|
173
|
-
};
|
|
174
|
-
var stateMessage = stateMessageMap[status];
|
|
175
|
-
|
|
176
|
-
/**
|
|
177
|
-
* Options list
|
|
178
|
-
*/
|
|
179
|
-
var suggestionList = suggestions.map(function (props) {
|
|
180
|
-
// Omit props destined for the EuiSuggestItem so that they don't
|
|
181
|
-
// cause warnings or render in the DOM of the EuiSelectableItem
|
|
182
|
-
var data = {};
|
|
183
|
-
var liProps = {
|
|
184
|
-
label: props.label
|
|
185
|
-
};
|
|
186
|
-
Object.keys(props).forEach(function (key) {
|
|
187
|
-
if (suggestItemPropsKeys.includes(key)) {
|
|
188
|
-
// @ts-ignore string index type
|
|
189
|
-
data[key] = props[key];
|
|
190
|
-
} else {
|
|
191
|
-
// @ts-ignore string index type
|
|
192
|
-
liProps[key] = props[key];
|
|
193
|
-
}
|
|
194
|
-
});
|
|
195
|
-
return _objectSpread(_objectSpread({}, liProps), {}, {
|
|
196
|
-
data: data,
|
|
197
|
-
className: classNames(props.className, 'euiSuggestItemOption'),
|
|
198
|
-
// Force truncation if `isVirtualized` is true
|
|
199
|
-
truncate: isVirtualized ? true : props.truncate
|
|
200
|
-
});
|
|
201
|
-
});
|
|
202
|
-
var renderOption = useCallback(function (props) {
|
|
203
|
-
return ___EmotionJSX(EuiSuggestItem, props);
|
|
204
|
-
}, []);
|
|
205
|
-
var onItemSelect = useCallback(function (options) {
|
|
206
|
-
if (onItemClick) {
|
|
207
|
-
var selectedIndex = options.findIndex(function (option) {
|
|
208
|
-
return option.checked === 'on';
|
|
209
|
-
});
|
|
210
|
-
if (selectedIndex >= 0) {
|
|
211
|
-
var selectedSuggestion = suggestions[selectedIndex];
|
|
212
|
-
onItemClick(selectedSuggestion);
|
|
213
|
-
}
|
|
214
|
-
}
|
|
215
|
-
}, [onItemClick, suggestions]);
|
|
216
|
-
return ___EmotionJSX(React.Fragment, null, ___EmotionJSX(EuiSelectable, {
|
|
217
|
-
selectableScreenReaderText: stateMessage,
|
|
218
|
-
singleSelection: true,
|
|
219
|
-
height: isVirtualized ? undefined : 'full',
|
|
220
|
-
options: suggestionList,
|
|
221
|
-
renderOption: renderOption,
|
|
222
|
-
onChange: onItemSelect,
|
|
223
|
-
listProps: {
|
|
224
|
-
bordered: false,
|
|
225
|
-
showIcons: false,
|
|
226
|
-
onFocusBadge: false,
|
|
227
|
-
paddingSize: 'none',
|
|
228
|
-
textWrap: isVirtualized ? 'truncate' : 'wrap',
|
|
229
|
-
isVirtualized: isVirtualized
|
|
230
|
-
},
|
|
231
|
-
searchable: true,
|
|
232
|
-
isPreFiltered: isPreFiltered,
|
|
233
|
-
searchProps: _objectSpread({
|
|
234
|
-
id: id,
|
|
235
|
-
append: appendArray.length ? appendArray : undefined,
|
|
236
|
-
fullWidth: fullWidth,
|
|
237
|
-
isLoading: status === 'loading' ? true : false,
|
|
238
|
-
onFocus: searchOnFocus,
|
|
239
|
-
onBlur: searchOnBlur,
|
|
240
|
-
onInput: searchOnInput,
|
|
241
|
-
onChange: searchOnChange,
|
|
242
|
-
'aria-label': ariaLabel,
|
|
243
|
-
'aria-labelledby': labelId
|
|
244
|
-
}, rest)
|
|
245
|
-
}, function (list, search) {
|
|
246
|
-
return ___EmotionJSX(EuiInputPopover, {
|
|
247
|
-
disableFocusTrap: true,
|
|
248
|
-
input: ___EmotionJSX(React.Fragment, null, search),
|
|
249
|
-
isOpen: isPopoverOpen,
|
|
250
|
-
panelPaddingSize: "none",
|
|
251
|
-
fullWidth: fullWidth,
|
|
252
|
-
closePopover: closePopover,
|
|
253
|
-
panelRef: setPopoverRef,
|
|
254
|
-
panelProps: {
|
|
255
|
-
'aria-live': undefined,
|
|
256
|
-
'aria-modal': false,
|
|
257
|
-
role: undefined
|
|
258
|
-
}
|
|
259
|
-
}, ___EmotionJSX("div", {
|
|
260
|
-
style: {
|
|
261
|
-
maxHeight: maxHeight
|
|
262
|
-
},
|
|
263
|
-
className: "eui-yScroll"
|
|
264
|
-
}, list));
|
|
265
|
-
}));
|
|
266
|
-
};
|
|
267
|
-
EuiSuggest.propTypes = {
|
|
268
|
-
className: PropTypes.string,
|
|
269
|
-
"aria-label": PropTypes.oneOfType([PropTypes.string, PropTypes.oneOfType([PropTypes.string.isRequired, PropTypes.string])]),
|
|
270
|
-
"data-test-subj": PropTypes.string,
|
|
271
|
-
css: PropTypes.any,
|
|
272
|
-
/**
|
|
273
|
-
* List of suggestions to display using EuiSuggestItem.
|
|
274
|
-
* Accepts props from #EuiSuggestItemProps
|
|
275
|
-
*/
|
|
276
|
-
suggestions: PropTypes.arrayOf(PropTypes.shape({
|
|
277
|
-
className: PropTypes.string,
|
|
278
|
-
"aria-label": PropTypes.string,
|
|
279
|
-
"data-test-subj": PropTypes.string,
|
|
280
|
-
css: PropTypes.any,
|
|
281
|
-
/**
|
|
282
|
-
* Takes `iconType` for EuiIcon and 'color'. 'color' can be tint1 through tint9.
|
|
283
|
-
*/
|
|
284
|
-
type: PropTypes.shape({
|
|
285
|
-
iconType: PropTypes.oneOfType([PropTypes.oneOf(["accessibility", "addDataApp", "advancedSettingsApp", "agentApp", "aggregate", "analyzeEvent", "annotation", "apmApp", "apmTrace", "appSearchApp", "apps", "arrowDown", "arrowLeft", "arrowRight", "arrowUp", "arrowStart", "arrowEnd", "article", "asterisk", "at", "auditbeatApp", "beaker", "bell", "bellSlash", "beta", "bolt", "boxesHorizontal", "boxesVertical", "branch", "branchUser", "broom", "brush", "bug", "bullseye", "calendar", "canvasApp", "casesApp", "check", "checkInCircleFilled", "cheer", "classificationJob", "clock", "cloudDrizzle", "cloudStormy", "cloudSunny", "cluster", "codeApp", "color", "compute", "console", "consoleApp", "container", "continuityAbove", "continuityAboveBelow", "continuityBelow", "continuityWithin", "controlsHorizontal", "controlsVertical", "copy", "copyClipboard", "createAdvancedJob", "createMultiMetricJob", "createPopulationJob", "createSingleMetricJob", "cross", "crossClusterReplicationApp", "crosshairs", "currency", "cut", "dashboardApp", "dataVisualizer", "database", "desktop", "devToolsApp", "discoverApp", "discuss", "document", "documentEdit", "documentation", "documents", "dot", "dotInCircle", "doubleArrowLeft", "doubleArrowRight", "download", "editorAlignCenter", "editorAlignLeft", "editorAlignRight", "editorBold", "editorChecklist", "editorCodeBlock", "editorComment", "editorDistributeHorizontal", "editorDistributeVertical", "editorHeading", "editorItalic", "editorItemAlignBottom", "editorItemAlignCenter", "editorItemAlignLeft", "editorItemAlignMiddle", "editorItemAlignRight", "editorItemAlignTop", "editorLink", "editorOrderedList", "editorPositionBottomLeft", "editorPositionBottomRight", "editorPositionTopLeft", "editorPositionTopRight", "editorRedo", "editorStrike", "editorTable", "editorUnderline", "editorUndo", "editorUnorderedList", "email", "empty", "emsApp", "eql", "eraser", "error", "exit", "expand", "expandMini", "exportAction", "eye", "eyeClosed", "faceHappy", "faceNeutral", "faceSad", "filebeatApp", "filter", "filterExclude", "filterIgnore", "filterInclude", "filterInCircle", "flag", "fleetApp", "fold", "folderCheck", "folderClosed", "folderExclamation", "folderOpen", "frameNext", "framePrevious", "fullScreen", "fullScreenExit", "function", "gear", "gisApp", "glasses", "globe", "grab", "grabHorizontal", "grabOmnidirectional", "gradient", "graphApp", "grid", "grokApp", "heart", "heartbeatApp", "heatmap", "help", "home", "iInCircle", "image", "importAction", "indexClose", "indexEdit", "indexFlush", "indexManagementApp", "indexMapping", "indexOpen", "indexPatternApp", "indexRollupApp", "indexRuntime", "indexSettings", "indexTemporary", "infinity", "inputOutput", "inspect", "invert", "ip", "key", "keyboard", "kqlField", "kqlFunction", "kqlOperand", "kqlSelector", "kqlValue", "kubernetesNode", "kubernetesPod", "launch", "layers", "lensApp", "lettering", "lineDashed", "lineDotted", "lineSolid", "link", "list", "listAdd", "lock", "lockOpen", "logoAWS", "logoAWSMono", "logoAerospike", "logoApache", "logoAppSearch", "logoAzure", "logoAzureMono", "logoBeats", "logoBusinessAnalytics", "logoCeph", "logoCloud", "logoCloudEnterprise", "logoCode", "logoCodesandbox", "logoCouchbase", "logoDocker", "logoDropwizard", "logoElastic", "logoElasticStack", "logoElasticsearch", "logoEnterpriseSearch", "logoEtcd", "logoGCP", "logoGCPMono", "logoGithub", "logoGmail", "logoGolang", "logoGoogleG", "logoHAproxy", "logoIBM", "logoIBMMono", "logoKafka", "logoKibana", "logoKubernetes", "logoLogging", "logoLogstash", "logoMaps", "logoMemcached", "logoMetrics", "logoMongodb", "logoMySQL", "logoNginx", "logoObservability", "logoOsquery", "logoPhp", "logoPostgres", "logoPrometheus", "logoRabbitmq", "logoRedis", "logoSecurity", "logoSiteSearch", "logoSketch", "logoSlack", "logoUptime", "logoVulnerabilityManagement", "logoWebhook", "logoWindows", "logoWorkplaceSearch", "logsApp", "logstashFilter", "logstashIf", "logstashInput", "logstashOutput", "logstashQueue", "machineLearningApp", "magnet", "magnifyWithExclamation", "magnifyWithMinus", "magnifyWithPlus", "managementApp", "mapMarker", "memory", "menu", "menuDown", "menuLeft", "menuRight", "menuUp", "merge", "metricbeatApp", "metricsApp", "minimize", "minus", "minusInCircle", "minusInCircleFilled", "mobile", "monitoringApp", "moon", "namespace", "nested", "node", "notebookApp", "number", "offline", "online", "outlierDetectionJob", "package", "packetbeatApp", "pageSelect", "pagesSelect", "palette", "paperClip", "partial", "pause", "payment", "pencil", "percent", "pin", "pinFilled", "pipelineApp", "pivot", "play", "playFilled", "plus", "plusInCircle", "plusInCircleFilled", "popout", "push", "questionInCircle", "quote", "recentlyViewedApp", "refresh", "regressionJob", "reporter", "reportingApp", "returnKey", "save", "savedObjectsApp", "scale", "search", "searchProfilerApp", "securityAnalyticsApp", "securityApp", "securitySignal", "securitySignalDetected", "securitySignalResolved", "sessionViewer", "shard", "share", "snowflake", "sortAscending", "sortDescending", "sortDown", "sortLeft", "sortRight", "sortUp", "sortable", "spaces", "spacesApp", "sparkles", "sqlApp", "starEmpty", "starEmptySpace", "starFilled", "starFilledSpace", "starMinusEmpty", "starMinusFilled", "starPlusEmpty", "starPlusFilled", "stats", "stop", "stopFilled", "stopSlash", "storage", "string", "submodule", "sun", "swatchInput", "symlink", "tableDensityCompact", "tableDensityExpanded", "tableDensityNormal", "tableOfContents", "tag", "tear", "temperature", "timeline", "timelineWithArrow", "timelionApp", "timeRefresh", "timeslider", "training", "transitionLeftIn", "transitionLeftOut", "transitionTopIn", "transitionTopOut", "trash", "unfold", "unlink", "upgradeAssistantApp", "uptimeApp", "user", "userAvatar", "users", "usersRolesApp", "vector", "videoPlayer", "visArea", "visAreaStacked", "visBarHorizontal", "visBarHorizontalStacked", "visBarVertical", "visBarVerticalStacked", "visGauge", "visGoal", "visLine", "visMapCoordinate", "visMapRegion", "visMetric", "visPie", "visTable", "visTagCloud", "visText", "visTimelion", "visVega", "visVisualBuilder", "visualizeApp", "vulnerabilityManagementApp", "warning", "alert", "watchesApp", "wordWrap", "wordWrapDisabled", "workplaceSearchApp", "wrench", "tokenAlias", "tokenAnnotation", "tokenArray", "tokenBinary", "tokenBoolean", "tokenClass", "tokenCompletionSuggester", "tokenConstant", "tokenDate", "tokenDenseVector", "tokenElement", "tokenEnum", "tokenEnumMember", "tokenEvent", "tokenException", "tokenField", "tokenFile", "tokenFlattened", "tokenFunction", "tokenGeo", "tokenHistogram", "tokenInterface", "tokenIP", "tokenJoin", "tokenKey", "tokenKeyword", "tokenMethod", "tokenMetricCounter", "tokenMetricGauge", "tokenModule", "tokenNamespace", "tokenNested", "tokenNull", "tokenNumber", "tokenObject", "tokenOperator", "tokenPackage", "tokenParameter", "tokenPercolator", "tokenProperty", "tokenRange", "tokenRankFeature", "tokenRankFeatures", "tokenRepo", "tokenSearchType", "tokenShape", "tokenString", "tokenStruct", "tokenSymbol", "tokenTag", "tokenText", "tokenTokenCount", "tokenVariable"]).isRequired, PropTypes.string.isRequired, PropTypes.elementType.isRequired]).isRequired,
|
|
286
|
-
color: PropTypes.oneOfType([PropTypes.string.isRequired, PropTypes.oneOf(["tint0", "tint1", "tint2", "tint3", "tint4", "tint5", "tint6", "tint7", "tint8", "tint9", "tint10"]).isRequired]).isRequired
|
|
287
|
-
}).isRequired,
|
|
288
|
-
/**
|
|
289
|
-
* Label or primary text.
|
|
290
|
-
*/
|
|
291
|
-
label: PropTypes.string.isRequired,
|
|
292
|
-
/**
|
|
293
|
-
* Description or secondary text (optional).
|
|
294
|
-
*/
|
|
295
|
-
description: PropTypes.string,
|
|
296
|
-
/**
|
|
297
|
-
* Percentage width of `label`.
|
|
298
|
-
* Accepts multiples of `10`, from `20` to `90`.
|
|
299
|
-
* Label will expand to 100% if `description` is not provided.
|
|
300
|
-
*/
|
|
301
|
-
labelWidth: PropTypes.oneOf(["20", "30", "40", "50", "60", "70", "80", "90", 20, 30, 40, 50, 60, 70, 80, 90]),
|
|
302
|
-
/**
|
|
303
|
-
* Truncates both label and description.
|
|
304
|
-
*/
|
|
305
|
-
truncate: PropTypes.bool
|
|
306
|
-
}).isRequired).isRequired,
|
|
307
|
-
/**
|
|
308
|
-
* Changes the content of the tooltip that wraps the status icon
|
|
309
|
-
*/
|
|
310
|
-
tooltipContent: PropTypes.string,
|
|
311
|
-
/**
|
|
312
|
-
* Status of the current query 'unsaved', 'saved', 'unchanged' or 'loading'.
|
|
313
|
-
*/
|
|
314
|
-
status: PropTypes.any,
|
|
315
|
-
/**
|
|
316
|
-
* Element to be appended to the input bar.
|
|
317
|
-
*/
|
|
318
|
-
append: PropTypes.any,
|
|
319
|
-
/**
|
|
320
|
-
* Handler for click on an EuiSuggestItem.
|
|
321
|
-
*/
|
|
322
|
-
onItemClick: PropTypes.func,
|
|
323
|
-
/**
|
|
324
|
-
* Callback function called when the input changes.
|
|
325
|
-
*/
|
|
326
|
-
onInput: PropTypes.func,
|
|
327
|
-
/**
|
|
328
|
-
* Callback function called when the search changes.
|
|
329
|
-
*/
|
|
330
|
-
onSearch: PropTypes.func,
|
|
331
|
-
/**
|
|
332
|
-
* Use virtualized rendering for list items with `react-window`.
|
|
333
|
-
* Best used when there are a lot of items.
|
|
334
|
-
*/
|
|
335
|
-
isVirtualized: PropTypes.bool,
|
|
336
|
-
/**
|
|
337
|
-
* Maximum height to set for the list.
|
|
338
|
-
* Default is `60vh`
|
|
339
|
-
*/
|
|
340
|
-
maxHeight: PropTypes.any,
|
|
341
|
-
/**
|
|
342
|
-
* Control whether or not options get filtered internally or if consumer will filter.
|
|
343
|
-
* Default `false`
|
|
344
|
-
*/
|
|
345
|
-
isPreFiltered: PropTypes.bool,
|
|
346
|
-
"aria-labelledby": PropTypes.oneOfType([PropTypes.string, PropTypes.string.isRequired])
|
|
347
|
-
};
|
|
@@ -1,123 +0,0 @@
|
|
|
1
|
-
var _excluded = ["className", "label", "type", "labelWidth", "description", "truncate", "onClick"];
|
|
2
|
-
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
3
|
-
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
4
|
-
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
5
|
-
/*
|
|
6
|
-
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
|
7
|
-
* or more contributor license agreements. Licensed under the Elastic License
|
|
8
|
-
* 2.0 and the Server Side Public License, v 1; you may not use this file except
|
|
9
|
-
* in compliance with, at your election, the Elastic License 2.0 or the Server
|
|
10
|
-
* Side Public License, v 1.
|
|
11
|
-
*/
|
|
12
|
-
|
|
13
|
-
import React from 'react';
|
|
14
|
-
import PropTypes from "prop-types";
|
|
15
|
-
import { keysOf } from '../common';
|
|
16
|
-
import classNames from 'classnames';
|
|
17
|
-
import { EuiIcon } from '../icon';
|
|
18
|
-
|
|
19
|
-
/**
|
|
20
|
-
* @deprecated
|
|
21
|
-
*/
|
|
22
|
-
import { jsx as ___EmotionJSX } from "@emotion/react";
|
|
23
|
-
var colorToClassNameMap = {
|
|
24
|
-
tint0: 'euiSuggestItem__type--tint0',
|
|
25
|
-
tint1: 'euiSuggestItem__type--tint1',
|
|
26
|
-
tint2: 'euiSuggestItem__type--tint2',
|
|
27
|
-
tint3: 'euiSuggestItem__type--tint3',
|
|
28
|
-
tint4: 'euiSuggestItem__type--tint4',
|
|
29
|
-
tint5: 'euiSuggestItem__type--tint5',
|
|
30
|
-
tint6: 'euiSuggestItem__type--tint6',
|
|
31
|
-
tint7: 'euiSuggestItem__type--tint7',
|
|
32
|
-
tint8: 'euiSuggestItem__type--tint8',
|
|
33
|
-
tint9: 'euiSuggestItem__type--tint9',
|
|
34
|
-
tint10: 'euiSuggestItem__type--tint10'
|
|
35
|
-
};
|
|
36
|
-
export var COLORS = keysOf(colorToClassNameMap);
|
|
37
|
-
|
|
38
|
-
/**
|
|
39
|
-
* @deprecated - EuiSuggest is scheduled for deprecation due to low internal usage and high
|
|
40
|
-
* overlap with other existing EUI components. We recommend using EuiSelectable instead,
|
|
41
|
-
* or copying this component into your own application for usage if necessary.
|
|
42
|
-
*
|
|
43
|
-
* The component will be permanently removed in October 2023.
|
|
44
|
-
*/
|
|
45
|
-
export var EuiSuggestItem = function EuiSuggestItem(_ref) {
|
|
46
|
-
var className = _ref.className,
|
|
47
|
-
label = _ref.label,
|
|
48
|
-
type = _ref.type,
|
|
49
|
-
_ref$labelWidth = _ref.labelWidth,
|
|
50
|
-
labelWidth = _ref$labelWidth === void 0 ? '50' : _ref$labelWidth,
|
|
51
|
-
description = _ref.description,
|
|
52
|
-
_ref$truncate = _ref.truncate,
|
|
53
|
-
truncate = _ref$truncate === void 0 ? true : _ref$truncate,
|
|
54
|
-
onClick = _ref.onClick,
|
|
55
|
-
rest = _objectWithoutProperties(_ref, _excluded);
|
|
56
|
-
var classes = classNames('euiSuggestItem', {
|
|
57
|
-
'euiSuggestItem--truncate': truncate
|
|
58
|
-
}, className);
|
|
59
|
-
var labelClassNames = classNames('euiSuggestItem__label', "euiSuggestItem__label--width".concat(labelWidth));
|
|
60
|
-
var descriptionClassNames = classNames('euiSuggestItem__description', {
|
|
61
|
-
'euiSuggestItem__description--wrap': !truncate
|
|
62
|
-
});
|
|
63
|
-
var typeColorClass = '';
|
|
64
|
-
if (type && type.color) {
|
|
65
|
-
if (COLORS.indexOf(type.color) > -1) {
|
|
66
|
-
typeColorClass = colorToClassNameMap[type.color];
|
|
67
|
-
}
|
|
68
|
-
}
|
|
69
|
-
var innerContent = ___EmotionJSX(React.Fragment, null, ___EmotionJSX("span", {
|
|
70
|
-
className: "euiSuggestItem__type ".concat(typeColorClass)
|
|
71
|
-
}, ___EmotionJSX(EuiIcon, {
|
|
72
|
-
type: type.iconType,
|
|
73
|
-
color: "inherit" // forces the icon to inherit its parent color
|
|
74
|
-
})), ___EmotionJSX("span", {
|
|
75
|
-
className: labelClassNames,
|
|
76
|
-
title: label
|
|
77
|
-
}, label), description && ___EmotionJSX("span", {
|
|
78
|
-
className: descriptionClassNames,
|
|
79
|
-
title: description
|
|
80
|
-
}, description));
|
|
81
|
-
if (onClick) {
|
|
82
|
-
return ___EmotionJSX("button", _extends({
|
|
83
|
-
onClick: onClick,
|
|
84
|
-
className: classes
|
|
85
|
-
}, rest), innerContent);
|
|
86
|
-
} else {
|
|
87
|
-
return ___EmotionJSX("span", _extends({
|
|
88
|
-
className: classes
|
|
89
|
-
}, rest), innerContent);
|
|
90
|
-
}
|
|
91
|
-
};
|
|
92
|
-
EuiSuggestItem.propTypes = {
|
|
93
|
-
className: PropTypes.string,
|
|
94
|
-
"aria-label": PropTypes.string,
|
|
95
|
-
"data-test-subj": PropTypes.string,
|
|
96
|
-
css: PropTypes.any,
|
|
97
|
-
/**
|
|
98
|
-
* Takes `iconType` for EuiIcon and 'color'. 'color' can be tint1 through tint9.
|
|
99
|
-
*/
|
|
100
|
-
type: PropTypes.shape({
|
|
101
|
-
iconType: PropTypes.oneOfType([PropTypes.oneOf(["accessibility", "addDataApp", "advancedSettingsApp", "agentApp", "aggregate", "analyzeEvent", "annotation", "apmApp", "apmTrace", "appSearchApp", "apps", "arrowDown", "arrowLeft", "arrowRight", "arrowUp", "arrowStart", "arrowEnd", "article", "asterisk", "at", "auditbeatApp", "beaker", "bell", "bellSlash", "beta", "bolt", "boxesHorizontal", "boxesVertical", "branch", "branchUser", "broom", "brush", "bug", "bullseye", "calendar", "canvasApp", "casesApp", "check", "checkInCircleFilled", "cheer", "classificationJob", "clock", "cloudDrizzle", "cloudStormy", "cloudSunny", "cluster", "codeApp", "color", "compute", "console", "consoleApp", "container", "continuityAbove", "continuityAboveBelow", "continuityBelow", "continuityWithin", "controlsHorizontal", "controlsVertical", "copy", "copyClipboard", "createAdvancedJob", "createMultiMetricJob", "createPopulationJob", "createSingleMetricJob", "cross", "crossClusterReplicationApp", "crosshairs", "currency", "cut", "dashboardApp", "dataVisualizer", "database", "desktop", "devToolsApp", "discoverApp", "discuss", "document", "documentEdit", "documentation", "documents", "dot", "dotInCircle", "doubleArrowLeft", "doubleArrowRight", "download", "editorAlignCenter", "editorAlignLeft", "editorAlignRight", "editorBold", "editorChecklist", "editorCodeBlock", "editorComment", "editorDistributeHorizontal", "editorDistributeVertical", "editorHeading", "editorItalic", "editorItemAlignBottom", "editorItemAlignCenter", "editorItemAlignLeft", "editorItemAlignMiddle", "editorItemAlignRight", "editorItemAlignTop", "editorLink", "editorOrderedList", "editorPositionBottomLeft", "editorPositionBottomRight", "editorPositionTopLeft", "editorPositionTopRight", "editorRedo", "editorStrike", "editorTable", "editorUnderline", "editorUndo", "editorUnorderedList", "email", "empty", "emsApp", "eql", "eraser", "error", "exit", "expand", "expandMini", "exportAction", "eye", "eyeClosed", "faceHappy", "faceNeutral", "faceSad", "filebeatApp", "filter", "filterExclude", "filterIgnore", "filterInclude", "filterInCircle", "flag", "fleetApp", "fold", "folderCheck", "folderClosed", "folderExclamation", "folderOpen", "frameNext", "framePrevious", "fullScreen", "fullScreenExit", "function", "gear", "gisApp", "glasses", "globe", "grab", "grabHorizontal", "grabOmnidirectional", "gradient", "graphApp", "grid", "grokApp", "heart", "heartbeatApp", "heatmap", "help", "home", "iInCircle", "image", "importAction", "indexClose", "indexEdit", "indexFlush", "indexManagementApp", "indexMapping", "indexOpen", "indexPatternApp", "indexRollupApp", "indexRuntime", "indexSettings", "indexTemporary", "infinity", "inputOutput", "inspect", "invert", "ip", "key", "keyboard", "kqlField", "kqlFunction", "kqlOperand", "kqlSelector", "kqlValue", "kubernetesNode", "kubernetesPod", "launch", "layers", "lensApp", "lettering", "lineDashed", "lineDotted", "lineSolid", "link", "list", "listAdd", "lock", "lockOpen", "logoAWS", "logoAWSMono", "logoAerospike", "logoApache", "logoAppSearch", "logoAzure", "logoAzureMono", "logoBeats", "logoBusinessAnalytics", "logoCeph", "logoCloud", "logoCloudEnterprise", "logoCode", "logoCodesandbox", "logoCouchbase", "logoDocker", "logoDropwizard", "logoElastic", "logoElasticStack", "logoElasticsearch", "logoEnterpriseSearch", "logoEtcd", "logoGCP", "logoGCPMono", "logoGithub", "logoGmail", "logoGolang", "logoGoogleG", "logoHAproxy", "logoIBM", "logoIBMMono", "logoKafka", "logoKibana", "logoKubernetes", "logoLogging", "logoLogstash", "logoMaps", "logoMemcached", "logoMetrics", "logoMongodb", "logoMySQL", "logoNginx", "logoObservability", "logoOsquery", "logoPhp", "logoPostgres", "logoPrometheus", "logoRabbitmq", "logoRedis", "logoSecurity", "logoSiteSearch", "logoSketch", "logoSlack", "logoUptime", "logoVulnerabilityManagement", "logoWebhook", "logoWindows", "logoWorkplaceSearch", "logsApp", "logstashFilter", "logstashIf", "logstashInput", "logstashOutput", "logstashQueue", "machineLearningApp", "magnet", "magnifyWithExclamation", "magnifyWithMinus", "magnifyWithPlus", "managementApp", "mapMarker", "memory", "menu", "menuDown", "menuLeft", "menuRight", "menuUp", "merge", "metricbeatApp", "metricsApp", "minimize", "minus", "minusInCircle", "minusInCircleFilled", "mobile", "monitoringApp", "moon", "namespace", "nested", "node", "notebookApp", "number", "offline", "online", "outlierDetectionJob", "package", "packetbeatApp", "pageSelect", "pagesSelect", "palette", "paperClip", "partial", "pause", "payment", "pencil", "percent", "pin", "pinFilled", "pipelineApp", "pivot", "play", "playFilled", "plus", "plusInCircle", "plusInCircleFilled", "popout", "push", "questionInCircle", "quote", "recentlyViewedApp", "refresh", "regressionJob", "reporter", "reportingApp", "returnKey", "save", "savedObjectsApp", "scale", "search", "searchProfilerApp", "securityAnalyticsApp", "securityApp", "securitySignal", "securitySignalDetected", "securitySignalResolved", "sessionViewer", "shard", "share", "snowflake", "sortAscending", "sortDescending", "sortDown", "sortLeft", "sortRight", "sortUp", "sortable", "spaces", "spacesApp", "sparkles", "sqlApp", "starEmpty", "starEmptySpace", "starFilled", "starFilledSpace", "starMinusEmpty", "starMinusFilled", "starPlusEmpty", "starPlusFilled", "stats", "stop", "stopFilled", "stopSlash", "storage", "string", "submodule", "sun", "swatchInput", "symlink", "tableDensityCompact", "tableDensityExpanded", "tableDensityNormal", "tableOfContents", "tag", "tear", "temperature", "timeline", "timelineWithArrow", "timelionApp", "timeRefresh", "timeslider", "training", "transitionLeftIn", "transitionLeftOut", "transitionTopIn", "transitionTopOut", "trash", "unfold", "unlink", "upgradeAssistantApp", "uptimeApp", "user", "userAvatar", "users", "usersRolesApp", "vector", "videoPlayer", "visArea", "visAreaStacked", "visBarHorizontal", "visBarHorizontalStacked", "visBarVertical", "visBarVerticalStacked", "visGauge", "visGoal", "visLine", "visMapCoordinate", "visMapRegion", "visMetric", "visPie", "visTable", "visTagCloud", "visText", "visTimelion", "visVega", "visVisualBuilder", "visualizeApp", "vulnerabilityManagementApp", "warning", "alert", "watchesApp", "wordWrap", "wordWrapDisabled", "workplaceSearchApp", "wrench", "tokenAlias", "tokenAnnotation", "tokenArray", "tokenBinary", "tokenBoolean", "tokenClass", "tokenCompletionSuggester", "tokenConstant", "tokenDate", "tokenDenseVector", "tokenElement", "tokenEnum", "tokenEnumMember", "tokenEvent", "tokenException", "tokenField", "tokenFile", "tokenFlattened", "tokenFunction", "tokenGeo", "tokenHistogram", "tokenInterface", "tokenIP", "tokenJoin", "tokenKey", "tokenKeyword", "tokenMethod", "tokenMetricCounter", "tokenMetricGauge", "tokenModule", "tokenNamespace", "tokenNested", "tokenNull", "tokenNumber", "tokenObject", "tokenOperator", "tokenPackage", "tokenParameter", "tokenPercolator", "tokenProperty", "tokenRange", "tokenRankFeature", "tokenRankFeatures", "tokenRepo", "tokenSearchType", "tokenShape", "tokenString", "tokenStruct", "tokenSymbol", "tokenTag", "tokenText", "tokenTokenCount", "tokenVariable"]).isRequired, PropTypes.string.isRequired, PropTypes.elementType.isRequired]).isRequired,
|
|
102
|
-
color: PropTypes.oneOfType([PropTypes.string.isRequired, PropTypes.oneOf(["tint0", "tint1", "tint2", "tint3", "tint4", "tint5", "tint6", "tint7", "tint8", "tint9", "tint10"]).isRequired]).isRequired
|
|
103
|
-
}).isRequired,
|
|
104
|
-
/**
|
|
105
|
-
* Label or primary text.
|
|
106
|
-
*/
|
|
107
|
-
label: PropTypes.string.isRequired,
|
|
108
|
-
/**
|
|
109
|
-
* Description or secondary text (optional).
|
|
110
|
-
*/
|
|
111
|
-
description: PropTypes.string,
|
|
112
|
-
/**
|
|
113
|
-
* Percentage width of `label`.
|
|
114
|
-
* Accepts multiples of `10`, from `20` to `90`.
|
|
115
|
-
* Label will expand to 100% if `description` is not provided.
|
|
116
|
-
*/
|
|
117
|
-
labelWidth: PropTypes.oneOf(["20", "30", "40", "50", "60", "70", "80", "90", 20, 30, 40, 50, 60, 70, 80, 90]),
|
|
118
|
-
/**
|
|
119
|
-
* Truncates both label and description.
|
|
120
|
-
*/
|
|
121
|
-
truncate: PropTypes.bool,
|
|
122
|
-
onClick: PropTypes.func
|
|
123
|
-
};
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
/*
|
|
2
|
-
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
|
3
|
-
* or more contributor license agreements. Licensed under the Elastic License
|
|
4
|
-
* 2.0 and the Server Side Public License, v 1; you may not use this file except
|
|
5
|
-
* in compliance with, at your election, the Elastic License 2.0 or the Server
|
|
6
|
-
* Side Public License, v 1.
|
|
7
|
-
*/
|
|
8
|
-
|
|
9
|
-
export var ALL_STATUSES = ['unsaved', 'saved', 'unchanged', 'loading'];
|
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
var _accessibleClickKeys;
|
|
2
|
-
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
|
3
|
-
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
4
|
-
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
|
|
5
|
-
function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
6
|
-
/*
|
|
7
|
-
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
|
8
|
-
* or more contributor license agreements. Licensed under the Elastic License
|
|
9
|
-
* 2.0 and the Server Side Public License, v 1; you may not use this file except
|
|
10
|
-
* in compliance with, at your election, the Elastic License 2.0 or the Server
|
|
11
|
-
* Side Public License, v 1.
|
|
12
|
-
*/
|
|
13
|
-
|
|
14
|
-
import { ENTER, SPACE } from '../keys';
|
|
15
|
-
|
|
16
|
-
// These keys are used to execute click actions on interactive elements like buttons and links.
|
|
17
|
-
export var accessibleClickKeys = (_accessibleClickKeys = {}, _defineProperty(_accessibleClickKeys, ENTER, 'enter'), _defineProperty(_accessibleClickKeys, SPACE, 'space'), _accessibleClickKeys);
|
|
@@ -1,28 +0,0 @@
|
|
|
1
|
-
/*
|
|
2
|
-
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
|
3
|
-
* or more contributor license agreements. Licensed under the Elastic License
|
|
4
|
-
* 2.0 and the Server Side Public License, v 1; you may not use this file except
|
|
5
|
-
* in compliance with, at your election, the Elastic License 2.0 or the Server
|
|
6
|
-
* Side Public License, v 1.
|
|
7
|
-
*/
|
|
8
|
-
|
|
9
|
-
/**
|
|
10
|
-
* These keys are used for navigating cascading menu UI components.
|
|
11
|
-
*
|
|
12
|
-
* ARROW_DOWN: Select the next item in the list.
|
|
13
|
-
* ARROW_LEFT: Show the previous menu.
|
|
14
|
-
* ARROW_RIGHT: Show the next menu for the selected item.
|
|
15
|
-
* ARROW_UP: Select the previous item in the list.
|
|
16
|
-
* ESC: Deselect the current selection and hide the list.
|
|
17
|
-
* TAB: Normal tabbing navigation is still supported.
|
|
18
|
-
*/
|
|
19
|
-
|
|
20
|
-
import { ARROW_DOWN, ARROW_LEFT, ARROW_RIGHT, ARROW_UP, ESCAPE, TAB } from '../keys';
|
|
21
|
-
export var cascadingMenuKeys = {
|
|
22
|
-
ARROW_DOWN: ARROW_DOWN,
|
|
23
|
-
ARROW_LEFT: ARROW_LEFT,
|
|
24
|
-
ARROW_RIGHT: ARROW_RIGHT,
|
|
25
|
-
ARROW_UP: ARROW_UP,
|
|
26
|
-
ESCAPE: ESCAPE,
|
|
27
|
-
TAB: TAB
|
|
28
|
-
};
|