Webform message setting "Allow users to close the message" not respected

Webform messages are using status-messages--alerts.html.twig template, which in turn uses the code in alert.twig component

Webform theming in WebformMessage::preRenderWebformMessage() adds the close button as part of the first message and not appended to each message, which is a big difference for this functionality.

Enabling the Webform-powered close button creates two close buttons, then. One added by Webform and one added by Bootstrap Barrio via alert.twig

Not sure best way to proceed as this seems a case where both Webform module and BB theme are providing the same UI but via different methods and one needs to get out of the other's way. I would prefer to preserve the BB theme to keep all templating in the same place, but still have it respect the "Allow users to close the message" option in Webform.

Webform outputs messages via webform-message.html.twig, which acts as a wrapper for what is output in status-messages.html.twig

Here's what I did in my subtheme to have the Bootstrap Barrio close button respect the Webform message element setting:

1) created my own webform-message.html.twig template in subtheme and changed its output, changing

{{ message }}

to:

{% include '@weaver/misc/status-messages--alerts.html.twig' with { message_list: message_list, show_close_button: show_close_button } %}

2) added hook_webform_message_preprocess() to my subtheme to pass the right message_list and the new show_close_button variable

function mytheme_preprocess_webform_message(&$variables) {
  // allows Webform alerts to respect the Webform close button settings
  // see also webform-message.html.twig and alert.twig
  $element = $variables['element'];
  $variables['message_list'] = $element['#message']['#message_list'];
  $variables['show_close_button'] = $element['#message_close'];
}

3) finally, updated alert.twig to show/hide the close button according to show_close_button

      {% if show_close_button == true %}
           // HTML for button
     {% endif %}

The Webform javascript close button still appears and I just used CSS to hide it.

This is all kinda hacky but I just wanted a quick fix for now. Perhaps some unity can be found in matching Bootstrap Barrio's alerts with how Claro and core use them.