Added maxWidth prop to EuiFlyout

[cchaos]

Fixes #1071

Similarly to how EuiPage uses the restrictWidth prop, the maxWidth prop can be:

• false (default): No max-width
• true: Adds a pre-defined max width depending on flyout size
• number: Will add the number to the style prop as a maxWidth value in px
• string: Will add the full string as the maxWidth value in whatever measurement it provides

---

The string option has now also been added to EuiPage and EuiPageBody as well as the simplified style js commented below, including removing the unnecessary --widthIsNotRestricted classes, and adding this prop to the TS definitions.

[chandlerprall]

Best to create a new style object here,

newStyle = { ...style, maxWidth };

otherwise this will add the maxWidth key/value to the original style prop.

[cchaos]

I also get confused about JS's stupid array reference stuff and forget about the spread method. Just so I understand, does the way your method work is that it will add the key/value pair of maxWidth or is it just adding that value?

[cchaos]

Oh wow, that actually completely negates the need for the if statement, because if style is empty, then there's just no other key/value pairs. Nice!

[cchaos]

@chandlerprall Can you take another look. I also updated EuiPage and EuiPageBody to utilize the same type of logic.

Can you also check that I added the TS stuff correctly?

[chandlerprall]

LGTM!; reviewed code changes

[chandlerprall]

@cchaos all looks good to me (including TS defs), thanks for the changes!

[snide]

Tested in browser by making my own example. Verified docs and review code.

I like that we're standardizing this kind of variety from a props perspective. It's a nice pattern.