Handling alert dialogs with multi-paragraph descriptions

[stuartkeith]

Hi there, I'm wondering how to implement an alert dialog where the description is more than one paragraph (assuming that is not a bad idea in the first place).

It seems like the built in Description component assumes one p tag and can't be overridden.

I thought maybe I could implement my own by using aria-describedby to point to my own element, but it seems like Radix doesn't really support this - there's a warning that comes up even if aria-describedby is set to an element in the DOM. It seems like it's expected aria-describedby will be either context.descriptionId or undefined.

https://github.com/radix-ui/primitives/blob/main/packages/react/dialog/src/Dialog.tsx#L536-L541

It looks like this was changed in 82ede9a#diff-18be67c22def126bf675c06beb358c92a4a8c6d1a071adf162fcd5ac9cac18bdL521-R533. Before that, I think a custom aria-describedby would not have been warned about (as long as it's set and it exists). Although it wasn't clear to me from that PR why the change was made.

https://www.radix-ui.com/primitives/docs/components/alert-dialog#description says "Alternatively, you can provide aria-describedby to AlertDialog.Content and exclude this component", which to me suggested I can handle it myself.

Although the dialog documentation does straightforwardly say only undefined is supported: https://www.radix-ui.com/primitives/docs/components/dialog#description, so maybe this is just a documentation mismatch on the alert dialog side.

I'm not sure whether

• Description should be more flexible
• this is just not supported and the alert dialog docs could maybe match the dialog docs
• there is good reason to support users implementing their own description if necessary

Thanks for reading.