@elastic/eui 88.5.4 → 89.0.0

package/optimize/es/components/suggest/suggest.a11y.js

@@ -1,70 +0,0 @@
-/*
- * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
- * or more contributor license agreements. Licensed under the Elastic License
- * 2.0 and the Server Side Public License, v 1; you may not use this file except
- * in compliance with, at your election, the Elastic License 2.0 or the Server
- * Side Public License, v 1.
- */
-
-/// <reference types="cypress" />
-/// <reference types="cypress-real-events" />
-/// <reference types="../../../cypress/support" />
-
-import React from 'react';
-import { EuiFormRow } from '../form';
-import { EuiSuggest } from './suggest';
-import { jsx as ___EmotionJSX } from "@emotion/react";
-var Suggest = function Suggest() {
-  var suggestedItems = [{
-    type: {
-      iconType: 'accessibility',
-      color: 'tint1'
-    },
-    label: 'Accessibility',
-    description: 'A short description'
-  }, {
-    type: {
-      iconType: 'image',
-      color: 'tint2'
-    },
-    label: 'Images',
-    description: 'Another short description'
-  }, {
-    type: {
-      iconType: 'lock',
-      color: 'tint3'
-    },
-    label: 'Locks',
-    description: 'A third short description'
-  }];
-  return ___EmotionJSX(EuiFormRow, {
-    label: "Suggest a topic",
-    id: "cy-label-suggest-1"
-  }, ___EmotionJSX(EuiSuggest, {
-    "aria-labelledby": "cy-label-suggest-1-label",
-    suggestions: suggestedItems
-  }));
-};
-describe('EuiSuggest', function () {
-  beforeEach(function () {
-    cy.realMount(___EmotionJSX(Suggest, null));
-  });
-  describe('Automated accessibility check', function () {
-    it('has zero violations when rendered', function () {
-      cy.checkAxe();
-    });
-  });
-  describe('Keyboard accessibility', function () {
-    it('has zero violations after traversing list items', function () {
-      cy.realPress('Tab');
-      cy.get('#cy-label-suggest-1').should('have.focus');
-      cy.get('ul[role="listbox"]').should('exist');
-      cy.realPress('ArrowDown');
-      cy.realPress('ArrowUp');
-      cy.realPress('ArrowRight');
-      cy.realPress('ArrowLeft');
-      cy.get('li[role="option"]').first().should('have.attr', 'aria-selected', 'true');
-      cy.checkAxe();
-    });
-  });
-});

package/optimize/es/components/suggest/suggest.js

@@ -1,256 +0,0 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["onItemClick", "onBlur", "onFocus", "onInput", "onSearch", "status", "append", "tooltipContent", "suggestions", "id", "aria-label", "aria-labelledby", "isPreFiltered", "isVirtualized", "fullWidth", "maxHeight"];
-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; }
-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; }
-/*
- * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
- * or more contributor license agreements. Licensed under the Elastic License
- * 2.0 and the Server Side Public License, v 1; you may not use this file except
- * in compliance with, at your election, the Elastic License 2.0 or the Server
- * Side Public License, v 1.
- */
-
-import React, { useState, useCallback } from 'react';
-import classNames from 'classnames';
-import { EuiIcon } from '../icon';
-import { useEuiI18n } from '../i18n';
-import { EuiInputPopover } from '../popover';
-import { EuiSelectable } from '../selectable';
-import { EuiToolTip } from '../tool_tip';
-import { EuiSuggestItem } from './suggest_item';
-import { jsx as ___EmotionJSX } from "@emotion/react";
-var statusMap = {
-  unsaved: {
-    icon: 'dot',
-    color: 'accent'
-  },
-  saved: {
-    icon: 'checkInCircleFilled',
-    color: 'success'
-  },
-  unchanged: {
-    icon: '',
-    color: 'success'
-  },
-  loading: {}
-};
-
-// keys of _EuiSuggestItemPropsBase
-var suggestItemPropsKeys = ['label', 'type', 'description', 'labelDisplay', 'labelWidth', 'descriptionDisplay'];
-
-/**
- * @deprecated
- */
-
-/**
- * @deprecated
- */
-
-/**
- * @deprecated - EuiSuggest is scheduled for deprecation due to low internal usage and high
- * overlap with other existing EUI components. We recommend using EuiSelectable instead,
- * or copying this component into your own application for usage if necessary.
- *
- * The component will be permanently removed in October 2023.
- */
-export var EuiSuggest = function EuiSuggest(_ref) {
-  var onItemClick = _ref.onItemClick,
-    onBlur = _ref.onBlur,
-    onFocus = _ref.onFocus,
-    onInput = _ref.onInput,
-    onSearch = _ref.onSearch,
-    _ref$status = _ref.status,
-    status = _ref$status === void 0 ? 'unchanged' : _ref$status,
-    append = _ref.append,
-    tooltipContent = _ref.tooltipContent,
-    suggestions = _ref.suggestions,
-    id = _ref.id,
-    ariaLabel = _ref['aria-label'],
-    labelId = _ref['aria-labelledby'],
-    _ref$isPreFiltered = _ref.isPreFiltered,
-    isPreFiltered = _ref$isPreFiltered === void 0 ? false : _ref$isPreFiltered,
-    _ref$isVirtualized = _ref.isVirtualized,
-    isVirtualized = _ref$isVirtualized === void 0 ? false : _ref$isVirtualized,
-    _ref$fullWidth = _ref.fullWidth,
-    fullWidth = _ref$fullWidth === void 0 ? true : _ref$fullWidth,
-    _ref$maxHeight = _ref.maxHeight,
-    maxHeight = _ref$maxHeight === void 0 ? '60vh' : _ref$maxHeight,
-    rest = _objectWithoutProperties(_ref, _excluded);
-  /**
-   * Popover helpers
-   */
-  var _useState = useState(null),
-    _useState2 = _slicedToArray(_useState, 2),
-    popoverRef = _useState2[0],
-    setPopoverRef = _useState2[1];
-  var _useState3 = useState(false),
-    _useState4 = _slicedToArray(_useState3, 2),
-    isPopoverOpen = _useState4[0],
-    setIsPopoverOpen = _useState4[1];
-  var openPopover = function openPopover() {
-    return setIsPopoverOpen(true);
-  };
-  var closePopover = function closePopover() {
-    return setIsPopoverOpen(false);
-  };
-
-  /**
-   * Search helpers
-   */
-  var searchOnFocus = function searchOnFocus(e) {
-    onFocus === null || onFocus === void 0 ? void 0 : onFocus(e);
-    openPopover();
-  };
-  var searchOnBlur = function searchOnBlur(e) {
-    onBlur === null || onBlur === void 0 ? void 0 : onBlur(e);
-    if (!(popoverRef !== null && popoverRef !== void 0 && popoverRef.contains(e.relatedTarget))) {
-      closePopover();
-    }
-  };
-  var searchOnInput = function searchOnInput(e) {
-    onInput === null || onInput === void 0 ? void 0 : onInput(e.target);
-    openPopover();
-  };
-  var searchOnChange = function searchOnChange(value) {
-    onSearch === null || onSearch === void 0 ? void 0 : onSearch(value);
-  };
-
-  /**
-   * Status
-   */
-  var icon = '';
-  var color = '';
-  if (statusMap[status]) {
-    icon = statusMap[status].icon || '';
-    color = statusMap[status].color || '';
-  }
-
-  // EuiFieldText's append accepts an array of elements so start by creating an empty array
-  var appendArray = [];
-  var _useEuiI18n = useEuiI18n(['euiSuggest.stateSavedTooltip', 'euiSuggest.stateUnsavedTooltip'], ['Saved.', 'Changes have not been saved.']),
-    _useEuiI18n2 = _slicedToArray(_useEuiI18n, 2),
-    statusSaved = _useEuiI18n2[0],
-    statusUnsaved = _useEuiI18n2[1];
-  statusMap.saved.tooltip = statusSaved;
-  statusMap.unsaved.tooltip = statusUnsaved;
-  var statusElement = (status === 'saved' || status === 'unsaved') && ___EmotionJSX(EuiToolTip, {
-    position: "left",
-    content: tooltipContent || statusMap[status].tooltip
-  }, ___EmotionJSX(EuiIcon, {
-    className: "euiSuggestInput__statusIcon",
-    color: color,
-    type: icon
-  }));
-
-  // Push the status element to the array if it is not undefined
-  if (statusElement) appendArray.push(statusElement);
-
-  // Check to see if consumer passed an append item and if so, add it to the array
-  if (append) appendArray.push(append);
-  var _useEuiI18n3 = useEuiI18n(['euiSuggest.stateLoading', 'euiSuggest.stateSaved', 'euiSuggest.stateUnsaved', 'euiSuggest.stateUnchanged'], ['State: loading.', 'State: saved.', 'State: unsaved.', 'State: unchanged.']),
-    _useEuiI18n4 = _slicedToArray(_useEuiI18n3, 4),
-    stateLoading = _useEuiI18n4[0],
-    stateSaved = _useEuiI18n4[1],
-    stateUnsaved = _useEuiI18n4[2],
-    stateUnchanged = _useEuiI18n4[3];
-  var stateMessageMap = {
-    loading: stateLoading,
-    saved: stateSaved,
-    unsaved: stateUnsaved,
-    unchanged: stateUnchanged
-  };
-  var stateMessage = stateMessageMap[status];
-
-  /**
-   * Options list
-   */
-  var suggestionList = suggestions.map(function (props) {
-    // Omit props destined for the EuiSuggestItem so that they don't
-    // cause warnings or render in the DOM of the EuiSelectableItem
-    var data = {};
-    var liProps = {
-      label: props.label
-    };
-    Object.keys(props).forEach(function (key) {
-      if (suggestItemPropsKeys.includes(key)) {
-        // @ts-ignore string index type
-        data[key] = props[key];
-      } else {
-        // @ts-ignore string index type
-        liProps[key] = props[key];
-      }
-    });
-    return _objectSpread(_objectSpread({}, liProps), {}, {
-      data: data,
-      className: classNames(props.className, 'euiSuggestItemOption'),
-      // Force truncation if `isVirtualized` is true
-      truncate: isVirtualized ? true : props.truncate
-    });
-  });
-  var renderOption = useCallback(function (props) {
-    return ___EmotionJSX(EuiSuggestItem, props);
-  }, []);
-  var onItemSelect = useCallback(function (options) {
-    if (onItemClick) {
-      var selectedIndex = options.findIndex(function (option) {
-        return option.checked === 'on';
-      });
-      if (selectedIndex >= 0) {
-        var selectedSuggestion = suggestions[selectedIndex];
-        onItemClick(selectedSuggestion);
-      }
-    }
-  }, [onItemClick, suggestions]);
-  return ___EmotionJSX(React.Fragment, null, ___EmotionJSX(EuiSelectable, {
-    selectableScreenReaderText: stateMessage,
-    singleSelection: true,
-    height: isVirtualized ? undefined : 'full',
-    options: suggestionList,
-    renderOption: renderOption,
-    onChange: onItemSelect,
-    listProps: {
-      bordered: false,
-      showIcons: false,
-      onFocusBadge: false,
-      paddingSize: 'none',
-      textWrap: isVirtualized ? 'truncate' : 'wrap',
-      isVirtualized: isVirtualized
-    },
-    searchable: true,
-    isPreFiltered: isPreFiltered,
-    searchProps: _objectSpread({
-      id: id,
-      append: appendArray.length ? appendArray : undefined,
-      fullWidth: fullWidth,
-      isLoading: status === 'loading' ? true : false,
-      onFocus: searchOnFocus,
-      onBlur: searchOnBlur,
-      onInput: searchOnInput,
-      onChange: searchOnChange,
-      'aria-label': ariaLabel,
-      'aria-labelledby': labelId
-    }, rest)
-  }, function (list, search) {
-    return ___EmotionJSX(EuiInputPopover, {
-      disableFocusTrap: true,
-      input: ___EmotionJSX(React.Fragment, null, search),
-      isOpen: isPopoverOpen,
-      panelPaddingSize: "none",
-      fullWidth: fullWidth,
-      closePopover: closePopover,
-      panelRef: setPopoverRef,
-      panelProps: {
-        'aria-live': undefined,
-        'aria-modal': false,
-        role: undefined
-      }
-    }, ___EmotionJSX("div", {
-      style: {
-        maxHeight: maxHeight
-      },
-      className: "eui-yScroll"
-    }, list));
-  }));
-};

package/optimize/es/components/suggest/suggest_item.js

@@ -1,89 +0,0 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["className", "label", "type", "labelWidth", "description", "truncate", "onClick"];
-/*
- * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
- * or more contributor license agreements. Licensed under the Elastic License
- * 2.0 and the Server Side Public License, v 1; you may not use this file except
- * in compliance with, at your election, the Elastic License 2.0 or the Server
- * Side Public License, v 1.
- */
-
-import React from 'react';
-import { keysOf } from '../common';
-import classNames from 'classnames';
-import { EuiIcon } from '../icon';
-
-/**
- * @deprecated
- */
-import { jsx as ___EmotionJSX } from "@emotion/react";
-var colorToClassNameMap = {
-  tint0: 'euiSuggestItem__type--tint0',
-  tint1: 'euiSuggestItem__type--tint1',
-  tint2: 'euiSuggestItem__type--tint2',
-  tint3: 'euiSuggestItem__type--tint3',
-  tint4: 'euiSuggestItem__type--tint4',
-  tint5: 'euiSuggestItem__type--tint5',
-  tint6: 'euiSuggestItem__type--tint6',
-  tint7: 'euiSuggestItem__type--tint7',
-  tint8: 'euiSuggestItem__type--tint8',
-  tint9: 'euiSuggestItem__type--tint9',
-  tint10: 'euiSuggestItem__type--tint10'
-};
-export var COLORS = keysOf(colorToClassNameMap);
-
-/**
- * @deprecated - EuiSuggest is scheduled for deprecation due to low internal usage and high
- * overlap with other existing EUI components. We recommend using EuiSelectable instead,
- * or copying this component into your own application for usage if necessary.
- *
- * The component will be permanently removed in October 2023.
- */
-export var EuiSuggestItem = function EuiSuggestItem(_ref) {
-  var className = _ref.className,
-    label = _ref.label,
-    type = _ref.type,
-    _ref$labelWidth = _ref.labelWidth,
-    labelWidth = _ref$labelWidth === void 0 ? '50' : _ref$labelWidth,
-    description = _ref.description,
-    _ref$truncate = _ref.truncate,
-    truncate = _ref$truncate === void 0 ? true : _ref$truncate,
-    onClick = _ref.onClick,
-    rest = _objectWithoutProperties(_ref, _excluded);
-  var classes = classNames('euiSuggestItem', {
-    'euiSuggestItem--truncate': truncate
-  }, className);
-  var labelClassNames = classNames('euiSuggestItem__label', "euiSuggestItem__label--width".concat(labelWidth));
-  var descriptionClassNames = classNames('euiSuggestItem__description', {
-    'euiSuggestItem__description--wrap': !truncate
-  });
-  var typeColorClass = '';
-  if (type && type.color) {
-    if (COLORS.indexOf(type.color) > -1) {
-      typeColorClass = colorToClassNameMap[type.color];
-    }
-  }
-  var innerContent = ___EmotionJSX(React.Fragment, null, ___EmotionJSX("span", {
-    className: "euiSuggestItem__type ".concat(typeColorClass)
-  }, ___EmotionJSX(EuiIcon, {
-    type: type.iconType,
-    color: "inherit" // forces the icon to inherit its parent color
-  })), ___EmotionJSX("span", {
-    className: labelClassNames,
-    title: label
-  }, label), description && ___EmotionJSX("span", {
-    className: descriptionClassNames,
-    title: description
-  }, description));
-  if (onClick) {
-    return ___EmotionJSX("button", _extends({
-      onClick: onClick,
-      className: classes
-    }, rest), innerContent);
-  } else {
-    return ___EmotionJSX("span", _extends({
-      className: classes
-    }, rest), innerContent);
-  }
-};

package/optimize/es/components/suggest/types.js

@@ -1,9 +0,0 @@
-/*
- * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
- * or more contributor license agreements. Licensed under the Elastic License
- * 2.0 and the Server Side Public License, v 1; you may not use this file except
- * in compliance with, at your election, the Elastic License 2.0 or the Server
- * Side Public License, v 1.
- */
-
-export var ALL_STATUSES = ['unsaved', 'saved', 'unchanged', 'loading'];

package/optimize/es/services/accessibility/accessible_click_keys.js

@@ -1,14 +0,0 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-var _accessibleClickKeys;
-/*
- * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
- * or more contributor license agreements. Licensed under the Elastic License
- * 2.0 and the Server Side Public License, v 1; you may not use this file except
- * in compliance with, at your election, the Elastic License 2.0 or the Server
- * Side Public License, v 1.
- */
-
-import { ENTER, SPACE } from '../keys';
-
-// These keys are used to execute click actions on interactive elements like buttons and links.
-export var accessibleClickKeys = (_accessibleClickKeys = {}, _defineProperty(_accessibleClickKeys, ENTER, 'enter'), _defineProperty(_accessibleClickKeys, SPACE, 'space'), _accessibleClickKeys);

package/optimize/es/services/accessibility/cascading_menu_keys.js

@@ -1,28 +0,0 @@
-/*
- * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
- * or more contributor license agreements. Licensed under the Elastic License
- * 2.0 and the Server Side Public License, v 1; you may not use this file except
- * in compliance with, at your election, the Elastic License 2.0 or the Server
- * Side Public License, v 1.
- */
-
-/**
- * These keys are used for navigating cascading menu UI components.
- *
- * ARROW_DOWN: Select the next item in the list.
- * ARROW_LEFT: Show the previous menu.
- * ARROW_RIGHT: Show the next menu for the selected item.
- * ARROW_UP: Select the previous item in the list.
- * ESC: Deselect the current selection and hide the list.
- * TAB: Normal tabbing navigation is still supported.
- */
-
-import { ARROW_DOWN, ARROW_LEFT, ARROW_RIGHT, ARROW_UP, ESCAPE, TAB } from '../keys';
-export var cascadingMenuKeys = {
-  ARROW_DOWN: ARROW_DOWN,
-  ARROW_LEFT: ARROW_LEFT,
-  ARROW_RIGHT: ARROW_RIGHT,
-  ARROW_UP: ARROW_UP,
-  ESCAPE: ESCAPE,
-  TAB: TAB
-};

package/optimize/es/services/accessibility/combo_box_keys.js

@@ -1,25 +0,0 @@
-/*
- * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
- * or more contributor license agreements. Licensed under the Elastic License
- * 2.0 and the Server Side Public License, v 1; you may not use this file except
- * in compliance with, at your election, the Elastic License 2.0 or the Server
- * Side Public License, v 1.
- */
-
-/**
- * These keys are used for navigating combobox UI components.
- *
- * ARROW_UP: Select the previous item in the list.
- * ARROW_DOWN: Select the next item in the list.
- * ENTER / TAB: Complete input with the current selection.
- * ESC: Deselect the current selection and hide the list.
- */
-
-import { ARROW_DOWN, ENTER, ESCAPE, TAB, ARROW_UP } from '../keys';
-export var comboBoxKeys = {
-  ARROW_DOWN: ARROW_DOWN,
-  ARROW_UP: ARROW_UP,
-  ENTER: ENTER,
-  ESCAPE: ESCAPE,
-  TAB: TAB
-};