Problem Statement
Reacting to a specific (named) container's size is currently impossible in EUI from the JS world. We need a useEuiContainerQuery hook that provides container query features in JS, so that components like EuiFlyout can use it to toggle between the push state (pushMinBreakpoint).
Proposed Solution
The useEuiContainerQuery(attributes: ContainerQueryAttributes, containerName?: string): boolean hook should be added to EUI.
Use Case
This is needed for the new flyout system initiative, the new Kibana chrome, as well as in some internal EUI components
Value / Impact
Having this will enable consumers to react to specific container size changes and adjust their layouts accordingly. It'll be highly beneficial for push flyouts and other resizable layout elements.
Urgency
This is needed in Q2 due to being a dependency for some of the work around the new flyout system, and more.
Do alternatives or workarounds exist?
Alternatives exist, but we need an in-house solution that works well with EUI components and is tightly integrated with them.
Problem Statement
Reacting to a specific (named) container's size is currently impossible in EUI from the JS world. We need a
useEuiContainerQueryhook that provides container query features in JS, so that components likeEuiFlyoutcan use it to toggle between the push state (pushMinBreakpoint).Proposed Solution
The
useEuiContainerQuery(attributes: ContainerQueryAttributes, containerName?: string): booleanhook should be added to EUI.Use Case
This is needed for the new flyout system initiative, the new Kibana chrome, as well as in some internal EUI components
Value / Impact
Having this will enable consumers to react to specific container size changes and adjust their layouts accordingly. It'll be highly beneficial for push flyouts and other resizable layout elements.
Urgency
This is needed in Q2 due to being a dependency for some of the work around the new flyout system, and more.
Do alternatives or workarounds exist?
Alternatives exist, but we need an in-house solution that works well with EUI components and is tightly integrated with them.