[EuiProvider] Component defaults

[cee-chen]

As of #6995, the EuiProvider component now supports a componentDefaults prop that allows consumers to configure specific components' default props, overriding EUI's own defaults.

For example: EuiFocusTrap defaults to crossFrame={false} - i.e., it does not trap focus between iframes. If you wanted to change that behavior in your app across all instances of EuiFocusTrap, you would previously be stuck manually passing that prop over and over again, including in higher-level components (like modals, popovers, and flyouts) that utilize focus traps. You can now instead do this:

<EuiProvider
  componentDefaults={{
    EuiFocusTrap: { crossFrame: true },
  }}
>
  <App />
</EuiProvider>

This new API is in beta, and is initially only releasing with a limited number of supported components to test out usage and developer experience. While we're eventually hoping to adopt an architecture that would potentially allow all props across all EUI components to be customizable, for right now, please use this thread to request specific combinations of component/prop defaults.