Botyglot Components V0.0.1
x
1
2
3
4
5
6
7
8
9
10
11
12
<div data-controller="notification" data-notification-target="notification" data-notification-auto-close-value="true" data-notification-delay-value="4000" role="alert" aria_live="assertive" class="elevate-notification--container">
  <div role="progressbar" aria-valuetext="Loading..." data-notification-target="progress" class="elevate-notification elevate-notification--progress--animation elevate-notification--variant--success"></div>
  <div class="elevate-notification--inner-container">
    <header class="elevate-notification--header">
      <h2 class="elevate-notification--header--title">Success</h2>
      <button data-action="notification#dismiss" type="button" class="elevate-button elevate-button--size-s elevate-button--align-center elevate-notification--dismiss-button">
        X
      </button>
    </header>
    <p class="elevate-notification--message">My custom message</p>
  </div>
</div>
1
render(Elevate::NotificationComponent.new(title:, message:, variant:, auto_close:, close_duration:))

No notes provided.

Param Description Input

The title of the notification.

The message or content of the notification.

The style variant of the notification.

Whether the notification should automatically close.

Time in milliseconds before the notification auto-closes.