@aotearoan/neon/dist/components/feedback/alert/container/NeonAlertContainer.vue.es.js

Neon is a lightweight design library of Vue 3 components with minimal dependencies.

import v from "./NeonAlertContainer.es.js";
import { resolveComponent as b, openBlock as o, createElementBlock as i, normalizeClass as u, createVNode as A, TransitionGroup as $, withCtx as d, Fragment as f, renderList as h, createBlock as s, createCommentVNode as l, createElementVNode as _, withKeys as a, withModifiers as y, toDisplayString as c } from "vue";
import w from "../../../../_virtual/_plugin-vue_export-helper.es.js";
const C = ["aria-describedby", "aria-labelledby", "role", "onClick"], M = ["role", "tabindex", "onKeydown"], m = ["id"], K = ["id"], N = {
  key: 1,
  class: "neon-alert__actions"
}, V = { class: "neon-alert__action-label" }, B = { class: "neon-alert__action-label" };
function T(e, E, I, z, D, F) {
  const k = b("neon-icon"), p = b("neon-link");
  return o(), i("div", {
    class: u([`neon-alert--${e.placement}`, "neon-alert"])
  }, [
    A($, { name: "neon-alert-transition" }, {
      default: d(() => [
        (o(!0), i(f, null, h(e.modelValue, (n, r) => (o(), i("div", {
          key: n.id,
          "aria-describedby": n.message ? `alertMessage${r}` : void 0,
          "aria-labelledby": n.title ? `alertTitle${r}` : void 0,
          class: u([[
            `neon-alert__message--${n.level}`,
            {
              "neon-alert__message--dismissible": n.dismissible,
              "neon-alert__message--with-actions": n.primaryAction,
              "neon-alert__message--with-icon": n.showIcon
            }
          ], "neon-alert__message"]),
          role: n.primaryAction ? "dialog" : n.duration && n.duration > 0 ? "alert" : "alertdialog",
          onClick: (t) => !n.primaryAction && n.dismissible && e.closeMessage(n.id)
        }, [
          n.showIcon ? (o(), s(k, {
            key: 0,
            color: n.level,
            name: e.icon(n.level),
            class: "neon-alert__message-icon"
          }, null, 8, ["color", "name"])) : l("", !0),
          _("div", {
            role: n.primaryAction ? void 0 : "button",
            tabindex: n.primaryAction ? -1 : 0,
            class: "neon-alert__content",
            onKeydown: [
              a(y((t) => !n.primaryAction && n.dismissible && e.closeMessage(n.id), ["prevent"]), ["space"]),
              a((t) => !n.primaryAction && n.dismissible && e.closeMessage(n.id), ["enter"])
            ]
          }, [
            n.title ? (o(), i("div", {
              key: 0,
              id: `alertTitle${r}`,
              class: "neon-alert__title"
            }, c(n.title), 9, m)) : l("", !0),
            n.message ? (o(), i("div", {
              key: 1,
              id: `alertMessage${r}`,
              class: "neon-alert__body"
            }, c(n.message), 9, K)) : l("", !0)
          ], 40, M),
          n.primaryAction ? (o(), i("div", N, [
            n.primaryAction ? (o(), s(p, {
              key: 0,
              class: "neon-alert__action",
              "no-style": "",
              role: "button",
              onClick: (t) => {
                n.primaryAction.callback(), e.closeMessage(n.id);
              },
              onKeydown: a(y((t) => {
                n.primaryAction.callback(), e.closeMessage(n.id);
              }, ["prevent"]), ["space"])
            }, {
              default: d(() => [
                _("span", V, c(n.primaryAction.label), 1)
              ]),
              _: 2
            }, 1032, ["onClick", "onKeydown"])) : l("", !0),
            n.secondaryAction ? (o(), s(p, {
              key: 1,
              class: "neon-alert__action",
              "no-style": "",
              role: "button",
              onClick: (t) => {
                n.secondaryAction.callback(), e.closeMessage(n.id);
              },
              onKeydown: a(y((t) => {
                n.secondaryAction.callback(), e.closeMessage(n.id);
              }, ["prevent"]), ["space"])
            }, {
              default: d(() => [
                _("span", B, c(n.secondaryAction.label), 1)
              ]),
              _: 2
            }, 1032, ["onClick", "onKeydown"])) : l("", !0)
          ])) : l("", !0)
        ], 10, C))), 128))
      ]),
      _: 1
    })
  ], 2);
}
const j = /* @__PURE__ */ w(v, [["render", T]]);
export {
  j as default
};
//# sourceMappingURL=NeonAlertContainer.vue.es.js.map