https://sickleinafrica.org/themes/contrib/bootstrap_barrio/js/messages.js?thydbl

1/**
2 * @file
3 * Message template overrides.
4 */
5
6((Drupal) => {
7  /**
8   * Overrides message theme function.
9   *
10   * @param {object} message
11   *   The message object.
12   * @param {string} message.text
13   *   The message text.
14   * @param {object} options
15   *   The message context.
16   * @param {string} options.type
17   *   The message type.
18   * @param {string} options.id
19   *   ID of the message, for reference.
20   *
21   * @return {HTMLElement}
22   *   A DOM Node.
23   */
24  Drupal.theme.message = ({ text }, { type, id }) => {
25    const messagesTypes = Drupal.Message.getMessageTypeLabels();
26    const messagesBootstrapTypes = {
27      status: 'success',
28      warning: 'warning',
29      error: 'danger',
30      info: 'info',
31    };
32    const messageWrapper = document.createElement('div');
33
34    messageWrapper.setAttribute(
35      'class',
36      `messages messages--${type}`
37    );
38    messageWrapper.setAttribute(
39      'role',
40      type === 'error' || type === 'warning' ? 'alert' : 'status'
41    );
42    messageWrapper.setAttribute('data-drupal-message-id', id);
43    messageWrapper.setAttribute('data-drupal-message-type', type);
44
45    messageWrapper.innerHTML = `
46    <div class="messages__content container alert alert-${messagesBootstrapTypes[type]} alert-dismissible fade show" role="alert">
47      <h2 class="visually-hidden">
48        ${messagesTypes[type]}
49      </h2>
50      <span class="messages__item">
51        ${text}
52      </span>
53      <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close">
54    </div>
55  `;
56
57    return messageWrapper;
58  };
59})(Drupal);