@dialpad/dialtone
Version:
Dialpad's Dialtone design system monorepo
84 lines (83 loc) • 2.33 kB
JavaScript
import { DtIconArrowDown as d, DtIconArrowUp as l } from "@dialpad/dialtone-icons/vue3";
import { UNREAD_PILL_DIRECTIONS as p, UNREAD_PILL_KINDS as s } from "./unread-pill-constants.js";
import { DialtoneLocalization as _ } from "../../localization/index.js";
import { resolveComponent as o, createElementBlock as u, openBlock as t, mergeProps as m, toHandlers as f, createBlock as i, createElementVNode as D, renderSlot as E, createTextVNode as L, toDisplayString as I } from "vue";
import { _ as N } from "../../_plugin-vue_export-helper-CHgC5LLL.js";
const k = {
compatConfig: { MODE: 3 },
name: "DtRecipeUnreadPill",
components: {
DtIconArrowUp: l,
DtIconArrowDown: d
},
props: {
/**
* The kind of unread pill which determines the styling
* @values 'mentions', 'messages'
**/
kind: {
type: String,
required: !0,
validator: (e) => s.includes(e)
},
/**
* The direction of the arrow icon
* @values 'up', 'down'
**/
direction: {
type: String,
required: !0,
validator: (e) => p.includes(e)
}
},
emits: [
/**
* Native click event
*
* @event click
* @type {PointerEvent | KeyboardEvent}
*/
"click"
],
data() {
return {
i18n: new _()
};
},
computed: {
text() {
return this.kind === "mentions" ? this.i18n.$t("DIALTONE_UNREAD_PILL_MENTIONS_TEXT") : this.i18n.$t("DIALTONE_UNREAD_PILL_MESSAGES_TEXT");
},
unreadChipListeners() {
return {
click: (e) => this.$emit("click", e)
};
}
}
}, w = { "data-qa": "dt-recipe-leftbar-unread-pill__label" };
function S(e, A, r, T, h, n) {
const a = o("dt-icon-arrow-up"), c = o("dt-icon-arrow-down");
return t(), u("button", m({
class: ["d-recipe-leftbar-unread-pill", `d-recipe-leftbar-unread-pill-${r.kind}`],
type: "button",
"data-qa": "dt-recipe-leftbar-unread-pill"
}, f(n.unreadChipListeners, !0)), [
r.direction === "up" ? (t(), i(a, {
key: 0,
size: "300"
})) : (t(), i(c, {
key: 1,
size: "300"
})),
D("span", w, [
E(e.$slots, "default", {}, () => [
L(I(n.text), 1)
])
])
], 16);
}
const g = /* @__PURE__ */ N(k, [["render", S]]);
export {
g as default
};
//# sourceMappingURL=unread-pill.js.map