Upgrade EUI to v34.3.0

[thompsongl]

Summary

eui@33.0.0 ⏩ eui@34.3.0

• EuiFlyout
  • defaults to onwFocus=true, which also adds an overlay mask
  • renders inside a React portal
  • used by EuiCollapsibleNav
• Deprecated EuiLoadingKibana

---

34.3.0

• Added testenv mock for EuiFlyout (#4858)
• Added mobile glyph to EuiIcon (#4827)
• Reduced display of arrow icon in EuiSideNav to only if the item is not linked but has children (#4827)
• Increased size and prominence of mobile toggle in EuiSideNav (#4827)
• Added heading, headingProps, and mobileBreakpoints props for better accessibility to EuiSideNav (#4827)

Bug fixes

• Fixed mobile menus styles on EuiDataGrid (#4844)

Theme: Amsterdam

• Decreased spacing and root element size of EuiSideNav (#4816)

34.2.0

• Removed text-transform: capitalize from the EuiTourSteps title to better fit with Elastic title guidelines (#4839)
• Added color and size props and added support for click event to EuiBetaBadge (#4798)
• Added documentation and layers glyphs to EuiIcon (#4833)
• Updated EuiTourStep's title and subtitle prop type from string to ReactNode (#4841)
• Added euiCantAnimate Sass mixin (#4835)
• Added new EuiLoadingLogo component (#4835)
• Added icon props to EuiEmptyPrompt for custom icons (#4835)
• Deprecated EuiLoadingKibana (#4835)
• Paused animations when prefers-reduced-motion is on for loader components (#4835)

Bug fixes

• Fixed onBlur and data-test-subj prop propagation in EuiColorPicker (#4822)
• Fixed mobile menus styles on EuiDataGrid (#4844)

34.1.0

• Updated max and min label positioning for EuiRange and EuiDualRange (#4781)
• Added timeslider, playFilled, frameNext and framePrevious glyphs to EuiIcon (#4810)
• Added default generic value for EuiSideNavProps (#4802)
• Added fullHeight and minHeight props to EuiPageTemplate (#4793)
• Added .eui-fullHeight and euiFullHeight() utilities (#4793)
• Added paddingSize prop to EuiPageSideBar (#4793)

Bug fixes

• Fixed EuiText color of EuiCallout to default (#4816)
• Fixed inconsistent width of EuiRange and EuiDualRange with custom tick values (#4781)
• Fixes browser freezing when EuiDataGrid is used together with EuiFlyout and the user clicks a cell (4813)
• Added flex-shrink: 0 to EuiTabs, EuiSpacer, and EuiImage to fix possible shrunken heights (#4793)
• Fixed duplicate main aria roles in EuiPageTemplate and most common EuiPage patterns (#4793)
• Fixed text color of EuiBottomBar (#4793)

34.0.0

• Added textTransform property to schemaDetectors prop of EuiDataGrid(#4752)
• Added color, continuityAbove, continuityAboveBelow, continuityBelow, continuityWithin, eraser, fullScreenExit, function, percent, wordWrap, and wordWrapDisabled glyphs to EuiIcon (#4779)
• Added as, role, closeButtonProps, closeButtonPosition, outsideClickCloses, side, type, and pushMinBreakpoint props to EuiFlyout (#4713)
• Extended EuiFlyout size prop to accept any CSS width value (#4713)
• Extended EuiFlyout and most of its props in EuiCollapsibleNav (#4713)
• Changed helpText prop in EuiFormRow to accept an array of messages(#4782)

Breaking changes

• Changed the default of EuiFlyout ownFocus to true (#4713)
• Wrapped EuiFlyout within the EuiOverlayMask when ownFocus=true (#4713)
• Changed EuiCollapsibleNav width sizing from a Sass variable to a size prop (#4713)
• Changed EuiOverlayMask z-indexing when positioned below header to using top offset (#4713)

Bug fixes

• Fixed EuiTourStepIndicator to use EuiI18n following the standard way (#4785)
• Fixed euiTourStep.closeTour default token value in EuiTourStep to be more specific (#4790)

[thompsongl]

@mistic mdast-util-to-hast is now an EUI dep

[thompsongl]

@cchaos $euiCollapsibleNavWidth was removed and this usage will need to change:

kibana/src/core/public/styles/_base.scss

Line 29 in 9b2d0c3

margin-left: $euiCollapsibleNavWidth;

[thompsongl]

@flash1293 Do you have any ideas for fixing the Lens data grid test failures?
Almost certainly related to your additions in elastic/eui#4813 but the setTimeout trick isn't working in this case.

Local output

  ● DatatableComponent › it invokes executeTriggerActions with correct context on click on top value

    Method “simulate” is meant to be run on 1 node. 0 found instead.

      179 |     });
      180 |
    > 181 |     wrapper.find('[data-test-subj="lensDatatableFilterOut"]').first().simulate('click');
          |                                                                       ^
      182 |
      183 |     expect(onDispatchEvent).toHaveBeenCalledWith({
      184 |       name: 'filter',

      at ReactWrapper.single (node_modules/enzyme/src/ReactWrapper.js:1168:13)
      at ReactWrapper.simulate (node_modules/enzyme/src/ReactWrapper.js:665:17)
      at Object.<anonymous> (x-pack/plugins/lens/public/datatable_visualization/components/table_basic.test.tsx:181:71)

  ● DatatableComponent › it invokes executeTriggerActions with correct context on click on timefield

    Method “simulate” is meant to be run on 1 node. 0 found instead.

      226 |     });
      227 |
    > 228 |     wrapper.find('[data-test-subj="lensDatatableFilterFor"]').first().simulate('click');
          |                                                                       ^
      229 |
      230 |     expect(onDispatchEvent).toHaveBeenCalledWith({
      231 |       name: 'filter',

      at ReactWrapper.single (node_modules/enzyme/src/ReactWrapper.js:1168:13)
      at ReactWrapper.simulate (node_modules/enzyme/src/ReactWrapper.js:665:17)
      at Object.<anonymous> (x-pack/plugins/lens/public/datatable_visualization/components/table_basic.test.tsx:228:71)

  ● DatatableComponent › it invokes executeTriggerActions with correct context on click on timefield from range

    Method “simulate” is meant to be run on 1 node. 0 found instead.

      312 |     });
      313 |
    > 314 |     wrapper.find('[data-test-subj="lensDatatableFilterFor"]').first().simulate('click');
          |                                                                       ^
      315 |
      316 |     expect(onDispatchEvent).toHaveBeenCalledWith({
      317 |       name: 'filter',

      at ReactWrapper.single (node_modules/enzyme/src/ReactWrapper.js:1168:13)
      at ReactWrapper.simulate (node_modules/enzyme/src/ReactWrapper.js:665:17)
      at Object.<anonymous> (x-pack/plugins/lens/public/datatable_visualization/components/table_basic.test.tsx:314:71)

[flash1293]

@thompsongl Thanks for pining me here. This worked for me (waiting for a tick, then updating the enzyme wrapper to get the new tree):

    await act(async () => {
      await new Promise(r => setTimeout(r, 0));
    });
    wrapper.update();

[shahzad31]

Uptime Changes LGTM !!

[streamich]

AppServices change LGTM

[cchaos]

👍 Looks good from design 😉

[yuliacech]

Stack Management changes LGTM!

[poffdeluxe]

Presentation changes LGTM. Just FYI I had to do a clean before doing the bootstrap but everything worked after that

[scottybollinger]

Workplace Search changes LGTM

[spong]

Security Solution changes LGTM! Thanks for the upgrade @thompsongl! 🙂

Note: In testing I did notice that the Security Solution Timeline was now in a partial page flyout vs full-page. I've pinged the @elastic/security-threat-hunting team and they'll address in a follow-up.

Before:

After:

[cchaos]

@spong That's most likely related to how you all were setting the size before. Now EuiFlyout takes any CSS width value for the size prop. So you can let your team know that all they need to do is set it to size="100%".

[thompsongl]

Code changes owned by @elastic/stack-monitoring-ui are only (expected) snapshot updates. Will merge after successful CI

[kibanamachine]

💚 Build Succeeded

• continuous-integration/kibana-ci/pull-request
• Commit: ebbca82
• Storybooks Preview
• Documentation Changes

Metrics [docs]

Async chunks

Total size of all lazy-loaded chunks that will be downloaded as the user navigates the app

id	before	after	diff
console	904.1KB	904.1KB	+12.0B
dataVisualizer	1.1MB	1.1MB	+12.0B
fleet	690.6KB	690.6KB	+6.0B
lens	1.5MB	1.5MB	+1.2KB
ml	5.9MB	5.9MB	+199.0B
presentationUtil	59.5KB	59.2KB	-232.0B
savedObjectsManagement	138.9KB	138.9KB	+44.0B
security	782.3KB	782.5KB	+144.0B
securitySolution	6.5MB	6.5MB	+113.0B
transform	928.0KB	927.9KB	-109.0B
triggersActionsUi	1.7MB	1.7MB	+2.7KB
total			+4.1KB

Public APIs missing exports

Total count of every type that is part of your API that should be exported but is not. This will cause broken links in the API documentation system. Target amount is 0. Run node scripts/build_api_docs --plugin [yourplugin] --stats exports for more detailed information.

id	before	after	diff
observability	11	10	-1

Page load bundle

Size of the bundles that are downloaded on every page load. Target size is below 100kb

id	before	after	diff
core	412.7KB	414.9KB	+2.2KB
data	832.8KB	833.7KB	+856.0B
kbnUiSharedDeps-css	504.2KB	511.0KB	+6.9KB
kbnUiSharedDeps-elastic	2.6MB	2.6MB	+38.1KB
kbnUiSharedDeps-js	6.4MB	6.4MB	-207.0B
total			+47.8KB

History

• 💔 Build #133682 failed 04ce4a1
• 💔 Build #133610 failed b9e3437
• 💔 Build #133560 failed 5095a14
• 💚 Build #133266 succeeded 91b26f9
• 💔 Build #133171 failed 4e495d8

To update your PR or re-run it, just comment with:
@elasticmachine merge upstream