Migrate EuiTable and a bunch of other stuff to TS

[pugnascotia]

Summary

This PR converts the fundamental table components to TypeScript. As a consequence, it also converts a number of other components; popover, buttons, pagination, outside click detector, focus trap, context menu, and panel.

@chandlerprall I'm getting an error with the prop type extractor. Could you take a look? With it disabled in the babel config, all the tests were passing (apart from a couple of flex tests that rely on the extract prop types to be present).

Checklist

• Checked in dark mode
• Checked in mobile
• Checked in IE11 and Firefox
• Props have proper autodocs
• Added documentation examples
• Added or updated jest tests
• Checked for breaking changes and labeled appropriately
• Checked for accessibility including keyboard-only and screenreader modes
• A changelog entry exists and is marked appropriately

[pugnascotia]

@chandlerprall I've resolved most of the issues with the generated eui.d.ts but there's one weird outstanding issue. Would you mind taking a look?

[pugnascotia]

To be more specific - the generated definitions in

types/src/components/drag_and_drop/draggable.d.ts

contain this line:

import("@elastic/eui").PaddingSize[]

This is odd because this import doesn't appear in the original source, in:

src/components/drag_and_drop/draggable.tsx

In the final eui.d.ts, the import has been transformed into (note the different import name!)

import ("@elastic/eui/src/components/panel").PanelPaddingSize[];

which I thought ought to resolve, but doesn't. If I add /panel at the end of the import, it works.

It looks a bit like something (maybe TypeScript, I don't know) is spotting that the type of SPACING in draggable.tsx is structurally the same as PaddingSize in src/components/code/index.d.ts and in PanelPaddingSize in src/components/panel/panel.tsx.

[pugnascotia]

Looks like src/components/drag_and_drop/droppable has the same issue. I can hack around it by altering the type e.g. adding aardvark into the union, but that's just masking the issue.

[thompsongl]

@pugnascotia I saw that same oddity.
Looking into it today, and I'll probably have a PR for you to address SPACING and some exports that will make upgrading in Kibana-land smoother.

[pugnascotia]

I wiped out types/ and ran yarn tsc, and the replaced type is there in what TypeScript generates. How PaddingSize is turned into PanelPaddingSize isn't clear to me though.

[thompsongl]

New question: Do you use SPACING in cloud? Because it's not actually used in EUI, exported in a meaningful way, or imported in Kibana.

[thompsongl]

@pugnascotia See pugnascotia#3 for some additional things. I think these get us to a point where no unnecessary changes to Kibana will need to happen.

[pugnascotia]

CI is now green!

Any chance of a review now, @chandlerprall / @thompsongl?

[thompsongl]

I'll take another pass. I do know there'll be a merge conflict once #1933 gets in, but it shouldn't be too bad.

[thompsongl]

This looks ready to me. We'll have a good deal of work to do to get Kibana's type check to pass, but all the errors look like legitimate configurations that need changing.

@snide, given we're a week out from FF and the last release is still blocked, do we want to merge this now?

[snide]

given we're a week out from FF and the last release is still blocked, do we want to merge this now?

@thompsongl and i discussed offline. We're going to do an EUI release before this lands, with the intention of it being the final release for Kibana 7.4. When that's done (let's just say by tomorrow) we can merge this in and set it up for 7.5.

[pugnascotia]

Ok, let me know when I’m good to merge.

[snide]

@pugnascotia Just an update. We need one more day. We have some complication with EUI PRs hitting kibana downstream and need a couple important PRs to get in before this one (since we don't want to deal with fallout from this in Kibana).

I'll post an update tomorrow, but should be OK to merge then.

[snide]

@pugnascotia You're now safe to merge. Thanks!