ucc-ui/dist/es/Tag-B4vn4kSj.js

ucc-ui components library

import { defineComponent as p, computed as m, openBlock as o, createElementBlock as s, normalizeClass as l, normalizeStyle as C, createVNode as r, unref as c, createCommentVNode as a, renderSlot as y } from "vue";
import { U as u } from "./Button-DOc5qANu.js";
const T = {
  PRIMARY: "primary",
  SUCCESS: "success",
  WARNING: "warning",
  DANGER: "danger",
  INFO: "info"
}, k = {
  SMALL: "small",
  DEFAULT: "default",
  LARGE: "large"
}, L = {
  DARK: "dark",
  LIGHT: "light",
  PLAIN: "plain"
}, A = {
  LEFT: "left",
  RIGHT: "right",
  DEFAULT: "default"
}, P = {
  key: 1,
  class: "u-tag__content"
}, N = /* @__PURE__ */ p({
  name: "UTag",
  __name: "Tag",
  props: {
    type: { default: T.PRIMARY },
    size: { default: k.DEFAULT },
    effect: { default: L.PLAIN },
    closable: { type: Boolean },
    border: { type: Boolean },
    color: {},
    textColor: {},
    round: { type: Boolean },
    transition: { type: Boolean, default: !0 },
    closePosition: { default: "default" },
    triggerClick: { type: Boolean, default: !1 }
  },
  emits: ["close", "click"],
  setup(f, { emit: d }) {
    const n = f, t = d, i = m(() => n.closePosition === A.LEFT), g = (e) => {
      if (e.target.classList.contains("u-tag__close")) {
        t("close", e), n.triggerClick && t("click", e);
        return;
      }
      t("click", e);
    };
    return (e, E) => (o(), s("div", {
      class: l([
        "u-tag",
        {
          [`u-tag--${e.type}`]: e.type,
          [`u-tag--${e.size}`]: e.size,
          [`u-tag--${e.effect}`]: e.effect,
          "is-round": e.round,
          "is-border": e.border,
          "is-transition": e.transition
        }
      ]),
      style: C({ backgroundColor: e.color }),
      onClick: g
    }, [
      e.closable && i.value ? (o(), s("span", {
        key: 0,
        class: l([
          "u-tag__close",
          { [`u-tag__close--${e.closePosition}`]: e.closePosition }
        ])
      }, [
        r(c(u), { icon: "close" })
      ], 2)) : a("", !0),
      e.$slots.default ? (o(), s("span", P, [
        y(e.$slots, "default")
      ])) : a("", !0),
      e.closable && !i.value ? (o(), s("span", {
        key: 2,
        class: l([
          "u-tag__close",
          { [`u-tag__close--${e.closePosition}`]: e.closePosition }
        ])
      }, [
        r(c(u), { icon: "close" })
      ], 2)) : a("", !0)
    ], 6));
  }
});
export {
  N as _
};