2021 Roadmap - First 6 months

[cchaos]

High level themes/projects

Documentation (Project Link)

We will continue providing manually-curated documentation and examples, while exploring ideas for how to better present templates and patterns. We will also explore ways to enhance the docs with automation like source code links and versioning. We will also explore ways to enhance the docs with automation like source code links and versioning.

Modularization

Continuing from 2020, this effort intends to break EUI up into smaller, more consumable pieces. We do not yet know what the boundaries look like, either for development or when importing components into a project, only that finding them is growing in importance and benefit.

CSS in JS (via Emotion)

✅ We have decided on Emotion for authoring EUI's styles, and now provide customizable, extensible theming with support for color modes (e.g. "light" and "dark"). Component conversions to happen throughout 2022.

Begin monorepo split/setup

To better support the existing, various packages within this repo it needs to move to a more "traditional" monorepo with proper tooling. This will allow us to better support downstream uses both at Elastic and by our community ❤️. It is also a requirement for separating up the @elastic/eui package (no expectation yet what that actually means or looks like).

Bug fixes & other improvements

Barring any incoming large component work, the main focus of the first half of 2021 will be to strengthen the existing components. We will tackle our backlog of issues and in the same instance look for ways to increase efficiency at the code level.

Component level projects

We know a number of our components could use some love and care, including bug fixes and updated feature support. Some of these (below) are already being tracked.

• [EuiTooltip] Flexibility, accessibility & guidelines [Meta][EuiTooltip] Flexibility, accessibility & guidelines #4040
  • Other tooltip/popover related issues:
  • [EuiTooltip in EuiContextMenu] Needs to position on scroll #1235
  • [EuiInputPopover] In fixed container (like flyout) has positioning issues #1023
  • [EuiPopover and EuiComboBox] Has issues ownFocus #1454
  • [EuiPopover] Are 2 wrapper components necessary? #2022
  • [EuiFlyout] Popover and other positioned elements within should not scroll with the page #3456
• [EuiFormRow] API and a11y cleanup [EuiFormRow] API and a11y cleanup #2493
• Use [EuiSelectable] in more components (like EuiComboBox)
  • [Discuss] Interaction spec for input+popover form-like components #4302
  • [EuiSuggest] Rebuild using EuiSelectable #3733 [EuiSuggest] Use EuiSelectable #5157
  • [EuiFilterGroup][FieldValueSelectionFilter] Use EuiSelectable #5387
  • [EuiSelectable] Discoverability of exclusions #3625
  • Fix the many issues relating to [EuiComboBox] Issues
• Rewrite [EuiDatePicker] with less reliance on outside library UI's [EuiDatePicker] With even more EUI #3901
  • [EuiDatePicker] react-datepicker to src/; use EUI services #5339
• Consolidate [EuiText] and [EuiMarkdownFormat] styling [DRAFT] Consolidate EuiText and EuiMarkdownFormat styling #4145
• Create a theme / components / guide for using Monaco code editor Create a theme / components / guide for using Monaco code editor #499
• Create a [EuiToolbar] for consolidated experiences [Spec] Utility bar for meta information and bulk selection actions #4010, [AriaToolbar] component #3500
• Look into more/easier ways to create selection groups (ie [EuiKeyPadMenu] Add selection state  #4000)
• Investigate CSS Grid as alternative to FlexGrid components Investigate CSS Grid as alternative to FlexGrid components #55
• EuiCard's description rendering should be conditional [EuiCard] card's children is an escape hatch but description is still required #4546

Testing

Unit & component level

Our unit testing strategy is incomplete. For example, a major goal of EUI is to provide out-of-the-box accessibility that is either pre-configured or at least easy to implement with a pattern. That requires a lot of integration with browser APIs, which the existing jest environment falls short in. We will explore alternative environments like Cypress to enable better, more complete testing.

• Adding Cypress for browser-based component unit testing #5042
• Add combined Jest+Cypress code coverage reports #5262

Validating non-breaking changes #2760

Outside of choosing React, EUI strives to be agnostic about the technical decisions of consuming applications. This requires a number of potential setups to be considered when making platform-level decisions and in some cases it's easy to accidentally neglect some case and release a breaking change without considering its full impact. We are looking to create a CI integration which will allow us validate PRs against a set of projects.

Typescript definitions update

Last year every component was converted to TypeScript (#1557) - thank you to everyone who helped! This total conversion now provides better ways to generated the eui.d.ts definitions file, and doing so will remove code & accuracy in some edge cases.

Support

We will continue to support ongoing design and development efforts across the Elastic organization. As a part of that we are tracking a number of accessibility improvements ranging from small cleanups to improving still across larger concepts.

• Accessibility

[Anshultilondiya]

@chandlerprall I would like to contribute to this project, could you please direct me from where I can get more information of the same, and will this project be available in GSOC '21

[chandlerprall]

I would like to contribute to this project, could you please direct me from where I can get more information of the same, and will this project be available in GSOC '21

Unfortunately the EUI project is not participating in GSOC this year due to our own time constraints & commitments - hopefully next year! If you'd like to contribute outside of GSOC, we have a contributing guide and curate a list of good first issues (though no one is restricted to that list).

[malekjaroslav]

Do you plan to put SSR support on the roadmap? I am loving EUI and I use it in my project, but the no SSR is something that holds me back a bit. Thank you! 🙏

[chandlerprall]

Do you plan to put SSR support on the roadmap? I am loving EUI and I use it in my project, but the no SSR is something that holds me back a bit. Thank you! 🙏

Full SSR support will not be on our roadmap anytime soon, but we accept pull requests fixing any of those issues. Our Next+EUI starter project's configuration for SSR may also be a helpful reference.

[thompsongl]

🗓️ Move any relevant items to #5468