ClipboardCopy displays multi-line text oddly in the summary section

Describe the issue. What is the expected and unexpected behavior?

When passing text with newlines to ClipboardCopy, the summary section can render oddly, showing no whitespace between the lines. This screenshot shows the ClipboardCopy component above, along with the raw markdown source below.

Please provide the steps to reproduce. Feel free to link CodeSandbox or another tool.

https://codesandbox.io/s/vigilant-morse-bm32m

Is this a bug or enhancement? If this issue is a bug, is this issue blocking you or is there a work-around?

I don’t really see a workaround, since the <input> element is hidden under the component, so I can’t do anything with css.

What is your product and what release version are you targeting?

RedHat Advanced Cluster Management https://github.com/IBM/kui

[nicolethoen]

I think that we’ve wrestled with some quirks with using contenteditable and screen readers in the past. We’d want to test that it’d still work if that’s the solution we wanted to try.

I don’t think that updating the parsing to use .replace constitutes a breaking change in the ways that we would normally avoid. But I would defer to @tlabaj for that.

[mcoker]

@eliranmal I don’t know that one approach is better than another necessarily - as long as it addresses the underlying inconsistency between the way the content is applies as the value to the input. I suppose a structural change that handles the consistently inherently would be preferred to needing to modify the content - though I suspect there are pros and cons to each approach. I mostly work in the core repo, so I was just offering a non-JS solution.

Good question re: testing, maybe @tlabaj or @nicolethoen knows?