Bug - CodeEditor - Default height is not 100%

[rebeccaalpert]

Please describe the issue
PatternFly is using a third-party dependency for CodeEditor. This dependency states that by default, it will be 100% of the parent. Unfortunately, this is not what happens in PF React. The docs say the default is 100%. However, in PF React, you have to set a fixed height or rely on the height of the code.

You can see this issue if you go to https://patternfly-react-v6.surge.sh/components/code-editor and remove height="400px" from the first demo.

It appears the third-party dependency by itself still defaults to 100%: https://codesandbox.io/p/sandbox/competent-jepsen-gz9dzf?workspaceId=f5599198-6a68-44b3-85bd-1caed5609909. I had a go at trying to replicate this in PatternFly React and I was able to get it to work locally if I removed the default height: '' prop in React and set certain heights on parent divs with style={{}} attributes. I don't think PF React will let me merge anything with style={{}} attributes, so I made those changes here: patternfly/patternfly#7087.

The 90% height takes into account the header we place on top of the editor. If we use 100%, the CodeEditor always overflows the parent since the third-party Monaco Editor tries to take the full 100%. This way it is 100% of 90% of 100%. 🪦

We're trying to place the CodeEditor in a modal in virtual-assistant, and it would be a huge help if we could rely on getting a default height.

Are there visuals for this issue? Please provide screenshots

[rebeccaalpert]

From @thatblindgeye: "Just wanted to check whether the fix you have up in Core would resolve that bug you noticed in React (removing the height="400px" won't cause the code editor to be cut off)? Or would there still need to be a hard coded pixel value for the height?"