Show a notification

const save = async () => {
  // await api.save();

  TemporaryNotification.show("Your application has been saved.", {
    type: "success",
  });
};

<GoabTemporaryNotificationCtrl />
<GoabButton type="secondary" onClick={save}>
  Save
</GoabButton>

async save(): Promise<void> {
  // await this.api.save();

  TemporaryNotification.show("Your application has been saved.", {
    type: "success",
  });
}

<goab-temporary-notification-ctrl></goab-temporary-notification-ctrl>

<goab-button type="secondary" (onClick)="save()">Save</goab-button>

document.getElementById("save-btn").addEventListener("_click", () => {
  // await api.save();

  document.body.dispatchEvent(
    new CustomEvent("msg", {
      composed: true,
      bubbles: true,
      detail: {
        action: "goa:temp-notification",
        data: {
          message: "Your application has been saved.",
          type: "success",
          uuid: crypto.randomUUID(),
          duration: "short",
        },
      },
    }),
  );
});

<goa-temp-notification-ctrl></goa-temp-notification-ctrl>

<goa-button version="2" id="save-btn" type="secondary">Save</goa-button>