@dialpad/dialtone/dist/vue3/lib/notice/notice-action.js

Dialpad's Dialtone design system monorepo

import { DtIconClose as d } from "@dialpad/dialtone-icons/vue3";
import u from "../../common/mixins/sr-only-close-button.js";
import m from "../../shared/sr_only_close_button.js";
import { resolveComponent as t, openBlock as s, createElementBlock as f, renderSlot as p, createCommentVNode as l, createBlock as c, mergeProps as _, withCtx as h, createVNode as C } from "vue";
import { _ as b } from "../../_plugin-vue_export-helper-CHgC5LLL.js";
import y from "../button/button.js";
const B = {
  compatConfig: { MODE: 3 },
  name: "DtNoticeAction",
  components: {
    DtIconClose: d,
    DtButton: y,
    SrOnlyCloseButton: m
  },
  mixins: [u],
  props: {
    /**
     * Props for the notice close button.
     */
    closeButtonProps: {
      type: Object,
      default: () => ({})
    },
    /**
     * Hides the close button from the notice
     * @values true, false
     */
    hideClose: {
      type: Boolean,
      default: !1
    },
    /**
     * Hides the action from the notice
     * @values true, false
     */
    hideAction: {
      type: Boolean,
      default: !1
    }
  },
  emits: [
    /**
     * Close button click event
     *
     * @event close
     */
    "close"
  ],
  created() {
    !this.hideClose && !this.closeButtonProps.ariaLabel && console.error("Invalid props: you must pass in closeButtonProps.ariaLabel if the close button is displayed.");
  },
  mounted() {
    this.hideClose || (this.lastFocusedElement = document.activeElement);
  },
  beforeUnmount() {
    var e;
    (e = this.lastFocusedElement) == null || e.focus();
  },
  methods: {
    close() {
      this.$emit("close");
    }
  }
}, k = {
  class: "d-notice__actions",
  "data-qa": "notice-content-actions"
};
function v(e, P, o, D, E, n) {
  const i = t("dt-icon-close"), a = t("dt-button"), r = t("sr-only-close-button");
  return s(), f("div", k, [
    o.hideAction ? l("", !0) : p(e.$slots, "default", { key: 0 }),
    o.hideClose ? l("", !0) : (s(), c(a, _({
      key: 1,
      ref: "closeButton",
      "data-qa": "dt-notice-action-close-button",
      size: "sm",
      importance: "clear",
      circle: "",
      "aria-label": o.closeButtonProps.ariaLabel ? o.closeButtonProps.ariaLabel : "Close"
    }, o.closeButtonProps, { onClick: n.close }), {
      icon: h(() => [
        C(i, { size: "200" })
      ]),
      _: 1
    }, 16, ["aria-label", "onClick"])),
    e.showVisuallyHiddenClose ? (s(), c(r, {
      key: 2,
      "visually-hidden-close-label": e.visuallyHiddenCloseLabel,
      onClose: n.close
    }, null, 8, ["visually-hidden-close-label", "onClose"])) : l("", !0)
  ]);
}
const V = /* @__PURE__ */ b(B, [["render", v]]);
export {
  V as default
};
//# sourceMappingURL=notice-action.js.map