@dialpad/dialtone
Version:
Dialpad's Dialtone design system monorepo
88 lines (87 loc) • 2.56 kB
JavaScript
import { DtIconClose as r } from "@dialpad/dialtone-icons/vue2";
import { DialtoneLocalization as n } from "../../localization/index.js";
import { n as s } from "../../_plugin-vue2_normalizer-DSLOjnn3.js";
import a from "../button/button.js";
const c = {
name: "PopoverHeaderFooter",
components: {
DtButton: a,
DtIconClose: r
},
props: {
// eslint-disable-next-line vue/require-default-prop
type: {
type: String,
validator: function(t) {
return ["header", "footer"].includes(t);
}
},
/**
* Additional class name for the content wrapper element.
*/
contentClass: {
type: [String, Array, Object],
default: ""
},
/**
* Determines visibility for close button
* @values true, false
*/
showCloseButton: {
type: Boolean,
default: !1
}
},
emits: [
/**
* Emitted when popover is closed
*
* @event close
* @type { Boolean }
*/
"close"
],
data() {
return {
i18n: new n()
};
},
computed: {
closeButtonTitle() {
return this.i18n.$t("DIALTONE_CLOSE_BUTTON");
}
},
methods: {
focusCloseButton() {
var e;
const t = (e = this.$refs["popover__close-button"]) == null ? void 0 : e.$el;
t == null || t.focus();
}
}
};
var p = function() {
var e = this, o = e._self._c;
return o("div", { class: {
"d-popover__header": e.type === "header",
"d-popover__footer": e.type === "footer"
}, attrs: { "data-qa": "dt-popover-header-footer" } }, [e.$slots.content ? o("div", { class: [{
"d-popover__header__content": e.type === "header",
"d-popover__footer__content": e.type === "footer"
}, e.contentClass], attrs: { "data-qa": "dt-popover-header-footer-content" } }, [e._t("content")], 2) : e._e(), e.showCloseButton ? o("dt-button", { ref: "popover__close-button", class: {
"d-popover__header__close-button": e.type === "header",
"d-popover__footer__close-button": e.type === "footer"
}, attrs: { "data-qa": "dt-popover-close", importance: "outlined", kind: "muted", circle: "", "aria-label": e.closeButtonTitle, title: e.closeButtonTitle }, on: { click: function(d) {
return e.$emit("close");
} }, scopedSlots: e._u([{ key: "icon", fn: function() {
return [o("dt-icon-close", { attrs: { size: "300" } })];
}, proxy: !0 }], null, !1, 2465905460) }) : e._e()], 1);
}, l = [], _ = /* @__PURE__ */ s(
c,
p,
l
);
const m = _.exports;
export {
m as default
};
//# sourceMappingURL=popover-header-footer.js.map