Add OPENED event to uui-toast-notification-element

Author: iOvergaard

packages/uui-toast-notification/lib/UUIToastNotificationEvent.ts

@@ -1,11 +1,13 @@
 import { UUIEvent } from '@umbraco-ui/uui-base/lib/events';
+
 import { UUIToastNotificationElement } from './uui-toast-notification.element';
 
 export class UUIToastNotificationEvent extends UUIEvent<
   {},
   UUIToastNotificationElement
 > {
   public static readonly OPENING = 'opening';
+  public static readonly OPENED = 'opened';
   public static readonly CLOSING = 'closing';
   public static readonly CLOSED = 'closed';
 }

packages/uui-toast-notification/lib/uui-toast-notification.element.ts

@@ -13,6 +13,7 @@ import { UUIToastNotificationEvent } from './UUIToastNotificationEvent';
 /**
  *  @element uui-toast-notification
  *  @fires {UUIToastNotificationEvent} opening - fires when the toast is starting to open
+ *  @fires {UUIToastNotificationEvent} opened - fires when the toast is open after the open-animation
  *  @fires {UUIToastNotificationEvent} closing - fires when the toast is starting to close
  *  @fires {UUIToastNotificationEvent} closed - fires when the toast is closed
  *  @description - Component for displaying a toast notification, preferably used in toast-notification-container.
@@ -257,6 +258,10 @@ export class UUIToastNotificationElement extends LitElement {
             if (this._pauseTimer === false) {
               this._timer?.start();
             }
+
+            this.dispatchEvent(
+              new UUIToastNotificationEvent(UUIToastNotificationEvent.OPENED)
+            );
           }
         }, 480);
       });