EUI 13.0.0 (#41723)

2025-04-23 09:19:04 -04:00 · 2019-07-23 15:09:16 -07:00 · 2019-07-23 15:09:16 -07:00 · c2b926e2e7
commit c2b926e2e7
parent 23b46f98ff
16 changed files with 114 additions and 154 deletions
--- a/package.json
+++ b/package.json
@ -106,7 +106,7 @@
    "@babel/register": "7.4.4",
    "@elastic/charts": "^7.2.1",
    "@elastic/datemath": "5.0.2",
-    "@elastic/eui": "12.4.0",
+    "@elastic/eui": "13.0.0",
    "@elastic/filesaver": "1.1.2",
    "@elastic/good": "8.1.1-kibana2",
    "@elastic/numeral": "2.3.3",
--- a/packages/kbn-ui-framework/doc_site/src/main.scss
+++ b/packages/kbn-ui-framework/doc_site/src/main.scss
@ -1,8 +1,7 @@
-@import '~@elastic/eui/src/themes/k6/k6_globals';
-@import '~@elastic/eui/src/themes/k6/k6_colors_dark';
+@import '~@elastic/eui/src/themes/eui/eui_colors_dark';
@import '~@elastic/eui/src/global_styling/functions/index';
@import '~@elastic/eui/src/global_styling/variables/index';
@import '~@elastic/eui/src/global_styling/mixins/index';
@import '~@elastic/eui/src/global_styling/reset/index';
-@import "../../dist/kui_dark.css";
-@import "./components/guide_components";
+@import '../../dist/kui_dark.css';
+@import './components/guide_components';
--- a/src/dev/jest/setup/polyfills.js
+++ b/src/dev/jest/setup/polyfills.js
@ -23,6 +23,17 @@ const bluebird = require('bluebird');
 bluebird.Promise.setScheduler(function (fn) { global.setImmediate.call(global, fn); });

 const MutationObserver = require('mutation-observer');
+// There's a bug in mutation-observer around the `attributes` option
+// https://dom.spec.whatwg.org/#mutationobserver
+// If either options's attributeOldValue or attributeFilter is present and options's attributes is omitted, then set options's attributes to true.
+const _observe = MutationObserver.prototype.observe;
+MutationObserver.prototype.observe = function observe(target, options) {
+  const needsAttributes = options.hasOwnProperty('attributeOldValue') || options.hasOwnProperty('attributeFilter');
+  if (needsAttributes && !options.hasOwnProperty('attributes')) {
+    options.attributes = true;
+  }
+  Function.prototype.call(_observe, this, target, options);
+};
 Object.defineProperty(window, 'MutationObserver', { value: MutationObserver });

 require('whatwg-fetch');
--- a/src/legacy/core_plugins/kibana/public/management/sections/index_patterns/create_button/create_button.tsx
+++ b/src/legacy/core_plugins/kibana/public/management/sections/index_patterns/create_button/create_button.tsx
@ -18,7 +18,7 @@
 */

 // @ts-ignore
-import { euiColorAccent } from '@elastic/eui/dist/eui_theme_k6_light.json';
+import { euiColorAccent } from '@elastic/eui/dist/eui_theme_light.json';
 import React, { Component, Fragment } from 'react';

 import {
--- a/src/legacy/ui/public/vis/editors/components/snapshots/editor_options_group.test.js.snap
+++ b/src/legacy/ui/public/vis/editors/components/snapshots/editor_options_group.test.js.snap
@ -8,44 +8,34 @@ exports[`<EditorOptionsGroup/> renders as expected 1`] = `
    class="euiAccordion euiAccordion-isOpen"
  >
    <div
-      class="euiFlexGroup euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive"
+      class="euiAccordion__triggerWrapper"
    >
-      <div
-        class="euiFlexItem"
+      <button
+        aria-controls="eog_staticId"
+        aria-expanded="true"
+        class="euiAccordion__button"
+        type="button"
      >
-        <button
-          aria-controls="eog_staticId"
-          aria-expanded="true"
-          class="euiAccordion__button"
-          type="button"
+        <span
+          class="euiAccordion__iconWrapper"
        >
-          <div
-            class="euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow"
+          <svg
+            class="euiIcon euiIcon--medium euiIcon-isLoading euiAccordion__icon"
+            focusable="false"
+            height="16"
+            viewBox="0 0 16 16"
+            width="16"
+            xmlns="http://www.w3.org/2000/svg"
+          />
+        </span>
+        <span>
+          <h2
+            class="euiTitle euiTitle--xsmall"
          >
-            <div
-              class="euiFlexItem euiFlexItem--flexGrowZero euiAccordion__iconWrapper"
-            >
-              <svg
-                class="euiIcon euiIcon--medium euiIcon-isLoading"
-                focusable="false"
-                height="16"
-                viewBox="0 0 16 16"
-                width="16"
-                xmlns="http://www.w3.org/2000/svg"
-              />
-            </div>
-            <div
-              class="euiFlexItem euiAccordion__buttonContent"
-            >
-              <h2
-                class="euiTitle euiTitle--xsmall"
-              >
-                Some options
-              </h2>
-            </div>
-          </div>
-        </button>
-      </div>
+            Some options
+          </h2>
+        </span>
+      </button>
    </div>
    <div
      class="euiAccordion__childWrapper"
@ -79,46 +69,36 @@ exports[`<EditorOptionsGroup/> renders as expected with actions 1`] = `
    class="euiAccordion euiAccordion-isOpen"
  >
    <div
-      class="euiFlexGroup euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive"
+      class="euiAccordion__triggerWrapper"
    >
-      <div
-        class="euiFlexItem"
+      <button
+        aria-controls="eog_staticId"
+        aria-expanded="true"
+        class="euiAccordion__button"
+        type="button"
      >
-        <button
-          aria-controls="eog_staticId"
-          aria-expanded="true"
-          class="euiAccordion__button"
-          type="button"
+        <span
+          class="euiAccordion__iconWrapper"
        >
-          <div
-            class="euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow"
+          <svg
+            class="euiIcon euiIcon--medium euiIcon-isLoading euiAccordion__icon"
+            focusable="false"
+            height="16"
+            viewBox="0 0 16 16"
+            width="16"
+            xmlns="http://www.w3.org/2000/svg"
+          />
+        </span>
+        <span>
+          <h2
+            class="euiTitle euiTitle--xsmall"
          >
-            <div
-              class="euiFlexItem euiFlexItem--flexGrowZero euiAccordion__iconWrapper"
-            >
-              <svg
-                class="euiIcon euiIcon--medium euiIcon-isLoading"
-                focusable="false"
-                height="16"
-                viewBox="0 0 16 16"
-                width="16"
-                xmlns="http://www.w3.org/2000/svg"
-              />
-            </div>
-            <div
-              class="euiFlexItem euiAccordion__buttonContent"
-            >
-              <h2
-                class="euiTitle euiTitle--xsmall"
-              >
-                Some actions
-              </h2>
-            </div>
-          </div>
-        </button>
-      </div>
+            Some actions
+          </h2>
+        </span>
+      </button>
      <div
-        class="euiFlexItem euiFlexItem--flexGrowZero"
+        class="euiAccordion__optionalAction"
      >
        <button
          aria-label="Remove"
@ -166,44 +146,34 @@ exports[`<EditorOptionsGroup/> renders as expected with initial collapsed 1`] =
    class="euiAccordion"
  >
    <div
-      class="euiFlexGroup euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive"
+      class="euiAccordion__triggerWrapper"
    >
-      <div
-        class="euiFlexItem"
+      <button
+        aria-controls="eog_staticId"
+        aria-expanded="false"
+        class="euiAccordion__button"
+        type="button"
      >
-        <button
-          aria-controls="eog_staticId"
-          aria-expanded="false"
-          class="euiAccordion__button"
-          type="button"
+        <span
+          class="euiAccordion__iconWrapper"
        >
-          <div
-            class="euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow"
+          <svg
+            class="euiIcon euiIcon--medium euiIcon-isLoading euiAccordion__icon"
+            focusable="false"
+            height="16"
+            viewBox="0 0 16 16"
+            width="16"
+            xmlns="http://www.w3.org/2000/svg"
+          />
+        </span>
+        <span>
+          <h2
+            class="euiTitle euiTitle--xsmall"
          >
-            <div
-              class="euiFlexItem euiFlexItem--flexGrowZero euiAccordion__iconWrapper"
-            >
-              <svg
-                class="euiIcon euiIcon--medium euiIcon-isLoading"
-                focusable="false"
-                height="16"
-                viewBox="0 0 16 16"
-                width="16"
-                xmlns="http://www.w3.org/2000/svg"
-              />
-            </div>
-            <div
-              class="euiFlexItem euiAccordion__buttonContent"
-            >
-              <h2
-                class="euiTitle euiTitle--xsmall"
-              >
-                Some options
-              </h2>
-            </div>
-          </div>
-        </button>
-      </div>
+            Some options
+          </h2>
+        </span>
+      </button>
    </div>
    <div
      class="euiAccordion__childWrapper"
--- a/test/interpreter_functional/plugins/kbn_tp_run_pipeline/package.json
+++ b/test/interpreter_functional/plugins/kbn_tp_run_pipeline/package.json
@ -7,7 +7,7 @@
  },
  "license": "Apache-2.0",
  "dependencies": {
-    "@elastic/eui": "12.4.0",
+    "@elastic/eui": "13.0.0",
    "react": "^16.8.0",
    "react-dom": "^16.8.0"
  }
--- a/test/plugin_functional/plugins/kbn_tp_custom_visualizations/package.json
+++ b/test/plugin_functional/plugins/kbn_tp_custom_visualizations/package.json
@ -7,7 +7,7 @@
  },
  "license": "Apache-2.0",
  "dependencies": {
-    "@elastic/eui": "12.4.0",
+    "@elastic/eui": "13.0.0",
    "react": "^16.8.0"
  }
 }
--- a/test/plugin_functional/plugins/kbn_tp_embeddable_explorer/package.json
+++ b/test/plugin_functional/plugins/kbn_tp_embeddable_explorer/package.json
@ -8,7 +8,7 @@
  },
  "license": "Apache-2.0",
  "dependencies": {
-    "@elastic/eui": "12.4.0",
+    "@elastic/eui": "13.0.0",
    "react": "^16.8.0"
  },
  "scripts": {
--- a/test/plugin_functional/plugins/kbn_tp_sample_panel_action/package.json
+++ b/test/plugin_functional/plugins/kbn_tp_sample_panel_action/package.json
@ -8,7 +8,7 @@
  },
  "license": "Apache-2.0",
  "dependencies": {
-    "@elastic/eui": "12.4.0",
+    "@elastic/eui": "13.0.0",
    "react": "^16.8.0"
  },
  "scripts": {
--- a/test/plugin_functional/plugins/kbn_tp_visualize_embedding/package.json
+++ b/test/plugin_functional/plugins/kbn_tp_visualize_embedding/package.json
@ -7,7 +7,7 @@
  },
  "license": "Apache-2.0",
  "dependencies": {
-    "@elastic/eui": "12.4.0",
+    "@elastic/eui": "13.0.0",
    "react": "^16.8.0",
    "react-dom": "^16.8.0"
  }
--- a/x-pack/dev-tools/jest/setup/polyfills.js
+++ b/x-pack/dev-tools/jest/setup/polyfills.js
@ -12,4 +12,15 @@ const bluebird = require('bluebird');
 bluebird.Promise.setScheduler(function (fn) { global.setImmediate.call(global, fn); });

 const MutationObserver = require('mutation-observer');
+// There's a bug in mutation-observer around the `attributes` option
+// https://dom.spec.whatwg.org/#mutationobserver
+// If either options's attributeOldValue or attributeFilter is present and options's attributes is omitted, then set options's attributes to true.
+const _observe = MutationObserver.prototype.observe;
+MutationObserver.prototype.observe = function observe(target, options) {
+  const needsAttributes = options.hasOwnProperty('attributeOldValue') || options.hasOwnProperty('attributeFilter');
+  if (needsAttributes && !options.hasOwnProperty('attributes')) {
+    options.attributes = true;
+  }
+  Function.prototype.call(_observe, this, target, options);
+};
 Object.defineProperty(window, 'MutationObserver', { value: MutationObserver });
--- a/x-pack/legacy/plugins/apm/public/style/global_overrides.css
+++ b/x-pack/legacy/plugins/apm/public/style/global_overrides.css
@ -17,7 +17,7 @@ Remove unnecessary space below the navigation dropdown
  border-bottom: none;
 }

-/* 
+/*
 Hide the "0-10 of 100" text in KUIPager component for all KUIControlledTable
 */
 .kuiControlledTable .kuiPagerText {
@ -32,10 +32,3 @@ Hide default dashed gridlines in EUI chart component for all APM graphs
  stroke-opacity: 1;
  stroke-dasharray: 1;
 }
-
-/*
-Override tab size since K6 theme makes "s" and "m" tabs both 14px
-*/
-.k6Tab--large .euiTab {
-  font-size: 16px;
-}
--- a/x-pack/legacy/plugins/beats_management/public/index.tsx
+++ b/x-pack/legacy/plugins/beats_management/public/index.tsx
@ -4,7 +4,7 @@
 * you may not use this file except in compliance with the Elastic License.
 */

-import * as euiVars from '@elastic/eui/dist/eui_theme_k6_light.json';
+import * as euiVars from '@elastic/eui/dist/eui_theme_light.json';
 import { i18n } from '@kbn/i18n';
 import React from 'react';
 import { HashRouter } from 'react-router-dom';
--- a/x-pack/legacy/plugins/beats_management/public/pages/tag/create.tsx
+++ b/x-pack/legacy/plugins/beats_management/public/pages/tag/create.tsx
@ -5,7 +5,7 @@
 */

 import { EuiButton, EuiButtonEmpty, EuiFlexGroup, EuiFlexItem, EuiSpacer } from '@elastic/eui';
-import euiVars from '@elastic/eui/dist/eui_theme_k6_light.json';
+import euiVars from '@elastic/eui/dist/eui_theme_light.json';
 import { i18n } from '@kbn/i18n';
 import { FormattedMessage, InjectedIntl, injectI18n } from '@kbn/i18n/react';
 import 'brace/mode/yaml';
--- a/x-pack/package.json
+++ b/x-pack/package.json
@ -172,7 +172,7 @@
    "@babel/runtime": "7.4.5",
    "@elastic/ctags-langserver": "^0.1.2",
    "@elastic/datemath": "5.0.2",
-    "@elastic/eui": "12.4.0",
+    "@elastic/eui": "13.0.0",
    "@elastic/javascript-typescript-langserver": "^0.2.1",
    "@elastic/lsp-extension": "^0.1.2",
    "@elastic/node-crypto": "^1.0.0",
--- a/yarn.lock
+++ b/yarn.lock
@ -1659,10 +1659,10 @@
    tabbable "^1.1.0"
    uuid "^3.1.0"

-"@elastic/eui@12.4.0":
-  version "12.4.0"
-  resolved "https://registry.yarnpkg.com/@elastic/eui/-/eui-12.4.0.tgz#a679c498e5890fea34dab35346212022538fef5d"
-  integrity sha512-b3bY5cRqvbyRa8Uain1drZc6djvxxcZFfx0uQbkHOe9iK+AppHfkqQ5KeXtH3CUF55PZI56DRkVzsBbcOMMtOQ==
+"@elastic/eui@13.0.0":
+  version "13.0.0"
+  resolved "https://registry.yarnpkg.com/@elastic/eui/-/eui-13.0.0.tgz#bead6830cff58a2cc617e9e9f1d344768bdd7004"
+  integrity sha512-nU/kgp6c4cH5IdcgD3XXEh0Gkbzf4byacJN62oYr1UGTWC0RT8N09FAQzDFIEGz+lDWTSLhap9RWPH3Kgy+O/A==
  dependencies:
    "@types/lodash" "^4.14.116"
    "@types/numeral" "^0.0.25"
@ -1680,7 +1680,6 @@
    react-input-autosize "^2.2.1"
    react-is "~16.3.0"
    react-virtualized "^9.18.5"
-    react-vis "1.10.2"
    resize-observer-polyfill "^1.5.0"
    tabbable "^1.1.0"
    uuid "^3.1.0"
@ -14873,7 +14872,7 @@ hoek@2.x.x:
  resolved "https://registry.yarnpkg.com/hoek/-/hoek-2.16.3.tgz#20bb7403d3cea398e91dc4710a8ff1b8274a25ed"
  integrity sha1-ILt0A9POo5jpHcRxCo/xuCdKJe0=

-hoek@4.2.1, hoek@4.x.x:
+hoek@4.x.x:
  version "4.2.1"
  resolved "https://registry.yarnpkg.com/hoek/-/hoek-4.2.1.tgz#9634502aa12c445dd5a7c5734b572bb8738aacbb"
  integrity sha512-QLg82fGkfnJ/4iy1xZ81/9SIJiq1NGFUMGs6ParyjBZr6jW2Ufj/snDqTHixNlHdPNwN2RLVD0Pi3igeK9+JfA==
@ -23405,29 +23404,6 @@ react-virtualized@^9.18.5:
    prop-types "^15.6.0"
    react-lifecycles-compat "^3.0.4"

-react-vis@1.10.2:
-  version "1.10.2"
-  resolved "https://registry.yarnpkg.com/react-vis/-/react-vis-1.10.2.tgz#7520bd31bb2f81a8faef49cc285f678fd0795242"
-  integrity sha512-Xd39x49JvvtAYBFZ6pkyItBUv3bT3CEW0dcAOXyYTCsM9uGRq90umF8LKHb28pOaWv3KiCXfK+hDAjNtIKkgHg==
-  dependencies:
-    d3-array "^1.2.0"
-    d3-collection "^1.0.3"
-    d3-color "^1.0.3"
-    d3-contour "^1.1.0"
-    d3-format "^1.2.0"
-    d3-geo "^1.6.4"
-    d3-hierarchy "^1.1.4"
-    d3-interpolate "^1.1.4"
-    d3-sankey "^0.7.1"
-    d3-scale "^1.0.5"
-    d3-shape "^1.1.0"
-    d3-voronoi "^1.1.2"
-    deep-equal "^1.0.1"
-    global "^4.3.1"
-    hoek "4.2.1"
-    prop-types "^15.5.8"
-    react-motion "^0.5.2"
-
 react-vis@^1.8.1:
  version "1.8.2"
  resolved "https://registry.yarnpkg.com/react-vis/-/react-vis-1.8.2.tgz#0e0aebc427e50856a01b666569ffad0411ef050f"