@elastic/eui 71.1.0 → 72.1.0

package/es/components/form/range/range_levels.styles.js

@@ -18,7 +18,7 @@ export var euiRangeLevelsStyles = function euiRangeLevelsStyles(euiThemeContext)
   var stripesBackground = "repeating-linear-gradient(\n    -45deg,\n    ".concat(transparentize(stripeColor, 0.5), ",\n    ").concat(transparentize(stripeColor, 0.5), " 25%,\n    ").concat(transparentize(stripeColor, 0.7), " 25%,\n    ").concat(transparentize(stripeColor, 0.7), " 50%,\n    ").concat(transparentize(stripeColor, 0.5), " 50%\n  )");
   return {
     euiRangeLevels: /*#__PURE__*/css("display:flex;justify-content:stretch;position:absolute;inset-inline:0;inset-block-start:", range.trackTopPositionWithoutTicks, ";z-index:", range.levelsZIndex, ";;label:euiRangeLevels;"),
-    hasRange: /*#__PURE__*/css("&::after{content:'';position:absolute;block-size:", range.trackHeight, ";inline-size:100%;background-image:", stripesBackground, ";background-size:", euiTheme.size.s, " ", euiTheme.size.s, ";border-radius:", range.trackBorderRadius, ";};label:hasRange;"),
+    hasRange: /*#__PURE__*/css("&::after{content:'';position:absolute;block-size:", range.trackHeight, ";inline-size:100%;background-image:", stripesBackground, ";background-size:", euiTheme.size.xs, " ", euiTheme.size.xs, ";border-radius:", range.trackBorderRadius, ";};label:hasRange;"),
     hasTicks: /*#__PURE__*/css("inset-block-start:", range.trackTopPositionWithTicks, ";;label:hasTicks;")
   };
 };

package/es/components/form/range/range_track.js

@@ -1,4 +1,4 @@
-var _excluded = ["children", "disabled", "max", "min", "step", "showTicks", "tickInterval", "ticks", "levels", "onChange", "value", "compressed", "showRange"];
+var _excluded = ["children", "disabled", "max", "min", "step", "showTicks", "tickInterval", "ticks", "levels", "onChange", "value", "compressed", "showRange", "className"];
 
 function _extends() { _extends = Object.assign || 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); }
 
@@ -27,6 +27,7 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
  */
 import React, { useState, useMemo, useEffect } from 'react';
 import PropTypes from "prop-types";
+import classNames from 'classnames';
 import range from 'lodash/range';
 import { useEuiTheme, isEvenlyDivisibleBy } from '../../../services';
 import { EuiRangeLevels } from './range_levels';
@@ -47,6 +48,7 @@ export var EuiRangeTrack = function EuiRangeTrack(_ref) {
       value = _ref.value,
       compressed = _ref.compressed,
       showRange = _ref.showRange,
+      className = _ref.className,
       rest = _objectWithoutProperties(_ref, _excluded);
 
   useEffect(function () {
@@ -106,8 +108,9 @@ export var EuiRangeTrack = function EuiRangeTrack(_ref) {
       trackWidth = _useState2[0],
       setTrackWidth = _useState2[1];
 
+  var classes = classNames('euiRangeTrack', className);
   return ___EmotionJSX("div", _extends({
-    className: "euiRangeTrack",
+    className: classes,
     css: cssStyles
   }, rest, {
     ref: function ref(node) {

package/es/components/header/header.a11y.js

@@ -0,0 +1,374 @@
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+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."); }
+
+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); }
+
+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; }
+
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+/*
+ * 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/support"/>
+import React, { useState } from 'react';
+import { EuiAvatar } from '../avatar';
+import { EuiFlexGroup, EuiFlexItem } from '../flex';
+import { EuiHeaderBreadcrumbs } from './header_breadcrumbs';
+import { EuiHeader } from './header';
+import { EuiHeaderLogo } from './header_logo';
+import { EuiHeaderSectionItemButton, EuiHeaderSectionItem, EuiHeaderSection } from './header_section';
+import { EuiIcon } from '../icon';
+import { EuiKeyPadMenu, EuiKeyPadMenuItem } from '../key_pad_menu';
+import { EuiLink } from '../link';
+import { EuiPopover, EuiPopoverTitle } from '../popover';
+import { EuiSelectable, EuiSelectableMessage, EuiSelectableTemplateSitewide } from '../selectable';
+import { EuiSpacer } from '../spacer';
+import { EuiText } from '../text';
+import { useGeneratedHtmlId } from '../../services';
+import { jsx as ___EmotionJSX } from "@emotion/react";
+
+var Header = function Header() {
+  var renderLogo = function renderLogo() {
+    return ___EmotionJSX(EuiHeaderLogo, {
+      iconType: "logoElastic",
+      href: "#",
+      onClick: function onClick(e) {
+        return e.preventDefault();
+      },
+      "aria-label": "Go to home page"
+    });
+  };
+
+  var renderBreadcrumbs = function renderBreadcrumbs() {
+    var breadcrumbs = [{
+      text: 'Management',
+      href: '#',
+      onClick: function onClick(e) {
+        e.preventDefault();
+      },
+      'data-test-subj': 'breadcrumbsAnimals',
+      className: 'customClass'
+    }, {
+      text: 'Truncation test is here for a really long item',
+      href: '#',
+      onClick: function onClick(e) {
+        e.preventDefault();
+      }
+    }, {
+      text: 'Hidden',
+      'data-test-subj': 'cy-breadcrumb-hidden',
+      href: '#',
+      onClick: function onClick(e) {
+        e.preventDefault();
+      }
+    }, {
+      text: 'Users',
+      href: '#',
+      onClick: function onClick(e) {
+        e.preventDefault();
+      }
+    }, {
+      text: 'Create'
+    }];
+    return ___EmotionJSX(EuiHeaderBreadcrumbs, {
+      "aria-label": "Header breadcrumbs example",
+      breadcrumbs: breadcrumbs
+    });
+  };
+
+  var search = ___EmotionJSX(EuiSelectableTemplateSitewide, {
+    options: [],
+    searchProps: {
+      compressed: true
+    },
+    popoverButton: ___EmotionJSX(EuiHeaderSectionItemButton, {
+      "aria-label": "Sitewide search"
+    }, ___EmotionJSX(EuiIcon, {
+      type: "search",
+      size: "m"
+    })),
+    emptyMessage: ___EmotionJSX(EuiSelectableMessage, {
+      style: {
+        minHeight: 300
+      },
+      "data-test-subj": "cy-search-menu"
+    }, ___EmotionJSX("p", null, "Please see the component page for", ' ', ___EmotionJSX("strong", null, "EuiSelectableTemplateSitewide"), "on how to configure your sitewide search."))
+  });
+
+  return ___EmotionJSX(EuiHeader, null, ___EmotionJSX(EuiHeaderSection, {
+    grow: false
+  }, ___EmotionJSX(EuiHeaderSectionItem, {
+    border: "right"
+  }, renderLogo()), ___EmotionJSX(EuiHeaderSectionItem, {
+    border: "right"
+  }, ___EmotionJSX(HeaderSpacesMenu, null))), renderBreadcrumbs(), ___EmotionJSX(EuiHeaderSection, {
+    side: "right"
+  }, ___EmotionJSX(EuiHeaderSectionItem, null, search), ___EmotionJSX(EuiHeaderSectionItem, null, ___EmotionJSX(HeaderUserMenu, null)), ___EmotionJSX(EuiHeaderSectionItem, null, ___EmotionJSX(HeaderAppMenu, null))));
+};
+
+var HeaderUserMenu = function HeaderUserMenu() {
+  var headerUserPopoverId = useGeneratedHtmlId({
+    prefix: 'headerUserPopover'
+  });
+
+  var _useState = useState(false),
+      _useState2 = _slicedToArray(_useState, 2),
+      isOpen = _useState2[0],
+      setIsOpen = _useState2[1];
+
+  var onMenuButtonClick = function onMenuButtonClick() {
+    setIsOpen(!isOpen);
+  };
+
+  var closeMenu = function closeMenu() {
+    setIsOpen(false);
+  };
+
+  var button = ___EmotionJSX(EuiHeaderSectionItemButton, {
+    "aria-controls": headerUserPopoverId,
+    "aria-expanded": isOpen,
+    "aria-haspopup": "true",
+    "aria-label": "Account menu",
+    onClick: onMenuButtonClick
+  }, ___EmotionJSX(EuiAvatar, {
+    name: "John Username",
+    size: "s"
+  }));
+
+  return ___EmotionJSX(EuiPopover, {
+    id: headerUserPopoverId,
+    button: button,
+    isOpen: isOpen,
+    anchorPosition: "downRight",
+    closePopover: closeMenu,
+    panelPaddingSize: "none",
+    "data-test-subj": "cy-account-menu"
+  }, ___EmotionJSX("div", {
+    style: {
+      width: 320
+    }
+  }, ___EmotionJSX(EuiFlexGroup, {
+    gutterSize: "m",
+    className: "euiHeaderProfile",
+    responsive: false
+  }, ___EmotionJSX(EuiFlexItem, {
+    grow: false
+  }, ___EmotionJSX(EuiAvatar, {
+    name: "John Username",
+    size: "xl"
+  })), ___EmotionJSX(EuiFlexItem, null, ___EmotionJSX(EuiText, null, ___EmotionJSX("p", null, "John Username")), ___EmotionJSX(EuiSpacer, {
+    size: "m"
+  }), ___EmotionJSX(EuiFlexGroup, null, ___EmotionJSX(EuiFlexItem, null, ___EmotionJSX(EuiFlexGroup, {
+    justifyContent: "spaceBetween"
+  }, ___EmotionJSX(EuiFlexItem, {
+    grow: false
+  }, ___EmotionJSX(EuiLink, null, "Edit profile")), ___EmotionJSX(EuiFlexItem, {
+    grow: false
+  }, ___EmotionJSX(EuiLink, null, "Log out")))))))));
+};
+
+var HeaderSpacesMenu = function HeaderSpacesMenu() {
+  var headerSpacesPopoverId = useGeneratedHtmlId({
+    prefix: 'headerSpacesPopover'
+  });
+  var spacesValues = [{
+    label: 'Sales team',
+    prepend: ___EmotionJSX(EuiAvatar, {
+      type: "space",
+      name: "Sales Team",
+      size: "s"
+    }),
+    checked: 'on'
+  }, {
+    label: 'Engineering',
+    prepend: ___EmotionJSX(EuiAvatar, {
+      type: "space",
+      name: "Engineering",
+      size: "s"
+    })
+  }];
+
+  var _useState3 = useState(spacesValues),
+      _useState4 = _slicedToArray(_useState3, 2),
+      spaces = _useState4[0],
+      setSpaces = _useState4[1];
+
+  var _useState5 = useState(spaces.filter(function (option) {
+    return option.checked;
+  })[0]),
+      _useState6 = _slicedToArray(_useState5, 2),
+      selectedSpace = _useState6[0],
+      setSelectedSpace = _useState6[1];
+
+  var _useState7 = useState(false),
+      _useState8 = _slicedToArray(_useState7, 2),
+      isOpen = _useState8[0],
+      setIsOpen = _useState8[1];
+
+  var isListExtended = function isListExtended() {
+    return spaces.length > 4 ? true : false;
+  };
+
+  var onMenuButtonClick = function onMenuButtonClick() {
+    setIsOpen(!isOpen);
+  };
+
+  var closePopover = function closePopover() {
+    setIsOpen(false);
+  };
+
+  var onChange = function onChange(options) {
+    setSpaces(options);
+    setSelectedSpace(options.filter(function (option) {
+      return option.checked;
+    })[0]);
+    setIsOpen(false);
+  };
+
+  var button = ___EmotionJSX(EuiHeaderSectionItemButton, {
+    "aria-controls": headerSpacesPopoverId,
+    "aria-expanded": isOpen,
+    "aria-haspopup": "true",
+    "aria-label": "Spaces menu",
+    onClick: onMenuButtonClick
+  }, selectedSpace.prepend);
+
+  return ___EmotionJSX(EuiPopover, {
+    id: headerSpacesPopoverId,
+    button: button,
+    isOpen: isOpen,
+    anchorPosition: "downLeft",
+    closePopover: closePopover,
+    panelPaddingSize: "none"
+  }, ___EmotionJSX(EuiSelectable, {
+    searchable: isListExtended(),
+    searchProps: {
+      placeholder: 'Find a space',
+      compressed: true
+    },
+    options: spaces,
+    singleSelection: "always",
+    style: {
+      width: 300
+    },
+    onChange: onChange,
+    listProps: {
+      rowHeight: 40,
+      showIcons: false
+    },
+    "data-test-subj": "cy-spaces-menu"
+  }, function (list, search) {
+    return ___EmotionJSX(React.Fragment, null, ___EmotionJSX(EuiPopoverTitle, {
+      paddingSize: "s"
+    }, search || 'Your spaces'), list);
+  }));
+};
+
+var HeaderAppMenu = function HeaderAppMenu() {
+  var headerAppPopoverId = useGeneratedHtmlId({
+    prefix: 'headerAppPopover'
+  });
+  var headerAppKeyPadMenuId = useGeneratedHtmlId({
+    prefix: 'headerAppKeyPadMenu'
+  });
+
+  var _useState9 = useState(false),
+      _useState10 = _slicedToArray(_useState9, 2),
+      isOpen = _useState10[0],
+      setIsOpen = _useState10[1];
+
+  var onMenuButtonClick = function onMenuButtonClick() {
+    setIsOpen(!isOpen);
+  };
+
+  var closeMenu = function closeMenu() {
+    setIsOpen(false);
+  };
+
+  var button = ___EmotionJSX(EuiHeaderSectionItemButton, {
+    "aria-controls": headerAppKeyPadMenuId,
+    "aria-expanded": isOpen,
+    "aria-haspopup": "true",
+    "aria-label": "Apps menu with 1 new app",
+    notification: "1",
+    onClick: onMenuButtonClick
+  }, ___EmotionJSX(EuiIcon, {
+    type: "apps",
+    size: "m"
+  }));
+
+  return ___EmotionJSX(EuiPopover, {
+    id: headerAppPopoverId,
+    button: button,
+    isOpen: isOpen,
+    anchorPosition: "downRight",
+    closePopover: closeMenu
+  }, ___EmotionJSX(EuiKeyPadMenu, {
+    id: headerAppKeyPadMenuId,
+    style: {
+      width: 288
+    },
+    "data-test-subj": "cy-apps-menu"
+  }, ___EmotionJSX(EuiKeyPadMenuItem, {
+    label: "Discover"
+  }, ___EmotionJSX(EuiIcon, {
+    type: "discoverApp",
+    size: "l"
+  })), ___EmotionJSX(EuiKeyPadMenuItem, {
+    label: "Dashboard"
+  }, ___EmotionJSX(EuiIcon, {
+    type: "dashboardApp",
+    size: "l"
+  })), ___EmotionJSX(EuiKeyPadMenuItem, {
+    label: "Dev Tools"
+  }, ___EmotionJSX(EuiIcon, {
+    type: "devToolsApp",
+    size: "l"
+  }))));
+};
+
+beforeEach(function () {
+  cy.viewport(1024, 768); // medium breakpoint
+
+  cy.realMount(___EmotionJSX(Header, null));
+});
+describe('EuiHeader', function () {
+  describe('Automated accessibility check', function () {
+    it('has zero violations on first render', function () {
+      cy.checkAxe();
+    });
+    it('has zero violations when Spaces menu is expanded', function () {
+      cy.get('button[aria-label="Spaces menu"]').realClick();
+      cy.get('div[data-test-subj="cy-spaces-menu"]').should('exist');
+      cy.checkAxe();
+    });
+    it('has zero violations when Account menu is expanded', function () {
+      cy.get('button[aria-label="Account menu"]').realClick();
+      cy.get('div[data-test-subj="cy-account-menu"]').should('exist');
+      cy.checkAxe();
+    });
+    it('has zero violations when Sitewide search is expanded', function () {
+      cy.get('button[aria-label="Sitewide search"]').realClick();
+      cy.get('div[data-test-subj="cy-search-menu"]').should('exist');
+      cy.checkAxe();
+    });
+    it('has zero violations when Apps menu is expanded', function () {
+      cy.get('button[aria-label="Apps menu with 1 new app"]').realClick();
+      cy.get('ul[data-test-subj="cy-apps-menu"]').should('exist');
+      cy.checkAxe();
+    });
+    it('has zero violations when a hidden breadcrumb is expanded', function () {
+      cy.get('button[aria-label="See collapsed breadcrumbs"]').realClick();
+      cy.get('a[data-test-subj="cy-breadcrumb-hidden"]').should('exist');
+      cy.checkAxe();
+    });
+  });
+});

package/es/components/icon/icon_ML.a11y.js

@@ -0,0 +1,33 @@
+/*
+ * 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/support"/>
+import React from 'react';
+import { EuiIcon } from './icon';
+import { jsx as ___EmotionJSX } from "@emotion/react";
+describe('EuiIcons', function () {
+  describe('Automated accessibility check for ML icons', function () {
+    var MLIcons = ['dataVisualizer', 'createAdvancedJob', 'classificationJob', 'createMultiMetricJob', 'outlierDetectionJob', 'createPopulationJob', 'regressionJob', 'createSingleMetricJob'];
+
+    var MLGrid = function MLGrid() {
+      return ___EmotionJSX("div", null, MLIcons.map(function (glyph) {
+        return ___EmotionJSX(EuiIcon, {
+          className: "eui-alignMiddle",
+          type: glyph
+        });
+      }));
+    };
+
+    it('has zero violations on first render', function () {
+      cy.mount(___EmotionJSX(MLGrid, null));
+      cy.get('div[data-cy-root]').find('svg', {
+        timeout: 5000
+      }).should('have.length', 8);
+      cy.checkAxe();
+    });
+  });
+});

package/es/components/icon/icon_apps.a11y.js

@@ -0,0 +1,33 @@
+/*
+ * 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/support"/>
+import React from 'react';
+import { EuiIcon } from './icon';
+import { jsx as ___EmotionJSX } from "@emotion/react";
+describe('EuiIcons', function () {
+  describe('Automated accessibility check for app icons', function () {
+    var AppIcons = ['addDataApp', 'advancedSettingsApp', 'agentApp', 'apmApp', 'appSearchApp', 'auditbeatApp', 'canvasApp', 'casesApp', 'codeApp', 'consoleApp', 'crossClusterReplicationApp', 'dashboardApp', 'devToolsApp', 'discoverApp', 'emsApp', 'filebeatApp', 'fleetApp', 'gisApp', 'graphApp', 'grokApp', 'heartbeatApp', 'indexManagementApp', 'indexPatternApp', 'indexRollupApp', 'lensApp', 'logsApp', 'machineLearningApp', 'managementApp', 'metricbeatApp', 'metricsApp', 'monitoringApp', 'notebookApp', 'packetbeatApp', 'pipelineApp', 'recentlyViewedApp', 'reportingApp', 'savedObjectsApp', 'searchProfilerApp', 'securityAnalyticsApp', 'securityApp', 'spacesApp', 'sqlApp', 'timelionApp', 'upgradeAssistantApp', 'uptimeApp', 'usersRolesApp', 'visualizeApp', 'watchesApp', 'workplaceSearchApp'];
+
+    var AppGrid = function AppGrid() {
+      return ___EmotionJSX("div", null, AppIcons.map(function (glyph) {
+        return ___EmotionJSX(EuiIcon, {
+          className: "eui-alignMiddle",
+          type: glyph
+        });
+      }));
+    };
+
+    it('has zero violations on first render', function () {
+      cy.mount(___EmotionJSX(AppGrid, null));
+      cy.get('div[data-cy-root]').find('svg', {
+        timeout: 5000
+      }).should('have.length', 49);
+      cy.checkAxe();
+    });
+  });
+});

package/es/components/icon/icon_editor.a11y.js

@@ -0,0 +1,33 @@
+/*
+ * 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/support"/>
+import React from 'react';
+import { EuiIcon } from './icon';
+import { jsx as ___EmotionJSX } from "@emotion/react";
+describe('EuiIcons', function () {
+  describe('Automated accessibility check for editor icons', function () {
+    var EditorIcons = ['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'];
+
+    var EditorGrid = function EditorGrid() {
+      return ___EmotionJSX("div", null, EditorIcons.map(function (glyph) {
+        return ___EmotionJSX(EuiIcon, {
+          className: "eui-alignMiddle",
+          type: glyph
+        });
+      }));
+    };
+
+    it('has zero violations on first render', function () {
+      cy.mount(___EmotionJSX(EditorGrid, null));
+      cy.get('div[data-cy-root]').find('svg', {
+        timeout: 5000
+      }).should('have.length', 29);
+      cy.checkAxe();
+    });
+  });
+});

package/es/components/icon/icon_elastic.a11y.js

@@ -0,0 +1,33 @@
+/*
+ * 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/support"/>
+import React from 'react';
+import { EuiIcon } from './icon';
+import { jsx as ___EmotionJSX } from "@emotion/react";
+describe('EuiIcons', function () {
+  describe('Automated accessibility check for Elastic logos', function () {
+    var ElasticLogos = ['logoElastic', 'logoElasticStack', 'logoElasticsearch', 'logoAppSearch', 'logoBeats', 'logoBusinessAnalytics', 'logoCloud', 'logoCloudEnterprise', 'logoEnterpriseSearch', 'logoKibana', 'logoLogging', 'logoLogstash', 'logoMaps', 'logoMetrics', 'logoObservability', 'logoSecurity', 'logoSiteSearch', 'logoUptime', 'logoWorkplaceSearch'];
+
+    var ElasticGrid = function ElasticGrid() {
+      return ___EmotionJSX("div", null, ElasticLogos.map(function (glyph) {
+        return ___EmotionJSX(EuiIcon, {
+          className: "eui-alignMiddle",
+          type: glyph
+        });
+      }));
+    };
+
+    it('has zero violations on first render', function () {
+      cy.mount(___EmotionJSX(ElasticGrid, null));
+      cy.get('div[data-cy-root]').find('svg', {
+        timeout: 5000
+      }).should('have.length', 19);
+      cy.checkAxe();
+    });
+  });
+});

package/es/components/icon/icon_glyphs.a11y.js

@@ -0,0 +1,33 @@
+/*
+ * 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/support"/>
+import React from 'react';
+import { EuiIcon } from './icon';
+import { jsx as ___EmotionJSX } from "@emotion/react";
+describe('EuiIcons', function () {
+  describe('Automated accessibility check for glyph icons', function () {
+    var GlyphIcons = ['accessibility', 'aggregate', 'alert', 'analyzeEvent', 'annotation', 'apmTrace', 'apps', 'arrowDown', 'arrowLeft', 'arrowRight', 'arrowUp', 'arrowStart', 'arrowEnd', 'article', 'asterisk', 'beaker', 'bell', 'bellSlash', 'beta', 'bolt', 'boxesHorizontal', 'boxesVertical', 'branch', 'branchUser', 'broom', 'brush', 'bug', 'bullseye', 'calendar', 'check', 'checkInCircleFilled', 'cheer', 'clock', 'cloudDrizzle', 'cloudStormy', 'cloudSunny', 'cluster', 'color', 'compute', 'console', 'container', 'continuityAbove', 'continuityAboveBelow', 'continuityBelow', 'continuityWithin', 'controlsHorizontal', 'controlsVertical', 'copy', 'copyClipboard', 'cross', 'crosshairs', 'crossInACircleFilled', 'currency', 'cut', 'database', 'desktop', 'discuss', 'document', 'documents', 'documentEdit', 'documentation', 'dot', 'dotInCircle', 'doubleArrowLeft', 'doubleArrowRight', 'download', 'email', 'empty', 'eql', 'eraser', 'exit', 'expand', 'expandMini', 'exportAction', 'eye', 'eyeClosed', 'faceHappy', 'faceNeutral', 'faceSad', 'filter', 'filterExclude', 'filterIgnore', 'filterInclude', 'filterInCircle', 'flag', 'fold', 'folderCheck', 'folderClosed', 'folderExclamation', 'folderOpen', 'frameNext', 'framePrevious', 'fullScreen', 'fullScreenExit', 'function', 'gear', 'glasses', 'globe', 'grab', 'grabHorizontal', 'grid', 'heart', 'heatmap', 'help', 'home', 'iInCircle', 'image', 'importAction', 'indexClose', 'indexEdit', 'indexFlush', 'indexMapping', 'indexOpen', 'indexRuntime', 'indexSettings', 'indexTemporary', 'infinity', 'inputOutput', 'inspect', 'invert', 'ip', 'keyboard', 'kqlField', 'kqlFunction', 'kqlOperand', 'kqlSelector', 'kqlValue', 'kubernetesNode', 'kubernetesPod', 'launch', 'layers', 'lettering', 'lineDashed', 'lineDotted', 'lineSolid', 'link', 'list', 'listAdd', 'lock', 'lockOpen', 'logstashFilter', 'logstashIf', 'logstashInput', 'logstashOutput', 'logstashQueue', 'magnifyWithExclamation', 'magnifyWithMinus', 'magnifyWithPlus', 'magnet', 'mapMarker', 'memory', 'merge', 'menu', 'menuDown', 'menuLeft', 'menuRight', 'menuUp', 'minimize', 'minus', 'minusInCircle', 'minusInCircleFilled', 'mobile', 'moon', 'namespace', 'nested', 'node', 'number', 'offline', 'online', 'package', 'pageSelect', 'pagesSelect', 'paperClip', 'partial', 'pause', 'payment', 'pencil', 'percent', 'pin', 'pinFilled', 'play', 'playFilled', 'plus', 'plusInCircle', 'plusInCircleFilled', 'popout', 'push', 'questionInCircle', 'quote', 'refresh', 'reporter', 'returnKey', 'save', 'scale', 'search', 'securitySignal', 'securitySignalDetected', 'securitySignalResolved', 'sessionViewer', 'shard', 'share', 'snowflake', 'sortable', 'sortAscending', 'sortDescending', 'sortDown', 'sortLeft', 'sortRight', 'sortUp', 'spaces', 'starEmpty', 'starEmptySpace', 'starFilled', 'starFilledSpace', 'starMinusEmpty', 'starMinusFilled', 'starPlusEmpty', 'starPlusFilled', 'stats', 'stop', 'stopFilled', 'stopSlash', 'storage', 'string', 'submodule', 'sun', 'symlink', 'tableOfContents', 'tableDensityExpanded', 'tableDensityCompact', 'tableDensityNormal', 'tag', 'tear', 'temperature', 'timeline', 'timeRefresh', 'timeslider', 'training', 'trash', 'unfold', 'unlink', 'user', 'userAvatar', 'users', 'vector', 'videoPlayer', 'visArea', 'visAreaStacked', 'visBarHorizontal', 'visBarHorizontalStacked', 'visBarVertical', 'visBarVerticalStacked', 'visGauge', 'visGoal', 'visLine', 'visMapCoordinate', 'visMapRegion', 'visMetric', 'visPie', 'visTable', 'visTagCloud', 'visText', 'visTimelion', 'visVega', 'visVisualBuilder', 'wordWrap', 'wordWrapDisabled', 'wrench'];
+
+    var GlyphGrid = function GlyphGrid() {
+      return ___EmotionJSX("div", null, GlyphIcons.map(function (glyph) {
+        return ___EmotionJSX(EuiIcon, {
+          className: "eui-alignMiddle",
+          type: glyph
+        });
+      }));
+    };
+
+    it('has zero violations on first render', function () {
+      cy.mount(___EmotionJSX(GlyphGrid, null));
+      cy.get('svg[data-icon-type="wrench"]', {
+        timeout: 5000
+      }).should('exist');
+      cy.checkAxe();
+    });
+  });
+});

package/es/components/icon/icon_tokens.a11y.js

@@ -0,0 +1,33 @@
+/*
+ * 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/support"/>
+import React from 'react';
+import { EuiIcon } from './icon';
+import { jsx as ___EmotionJSX } from "@emotion/react";
+describe('EuiIcons', function () {
+  describe('Automated accessibility check for token icons', function () {
+    var TokenIcons = ['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'];
+
+    var TokenGrid = function TokenGrid() {
+      return ___EmotionJSX("div", null, TokenIcons.map(function (glyph) {
+        return ___EmotionJSX(EuiIcon, {
+          className: "eui-alignMiddle",
+          type: glyph
+        });
+      }));
+    };
+
+    it('has zero violations on first render', function () {
+      cy.mount(___EmotionJSX(TokenGrid, null));
+      cy.get('div[data-cy-root]').find('svg', {
+        timeout: 5000
+      }).should('have.length', 53);
+      cy.checkAxe();
+    });
+  });
+});