import { DtIconArrowUp as d, DtIconArrowDown as l } from "@dialpad/dialtone-icons/vue3";
import { UNREAD_PILL_KINDS as p, UNREAD_PILL_DIRECTIONS as s } from "./unread-pill-constants.js";
import { DialtoneLocalization as _ } from "../../localization/index.js";
import { resolveComponent as o, openBlock as t, createElementBlock as u, 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: d,
    DtIconArrowDown: l
  },
  props: {
    /**
     * The kind of unread pill which determines the styling
     * @values 'mentions', 'messages'
     **/
    kind: {
      type: String,
      required: !0,
      validator: (e) => p.includes(e)
    },
    /**
     * The direction of the arrow icon
     * @values 'up', 'down'
     **/
    direction: {
      type: String,
      required: !0,
      validator: (e) => s.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
