comic-plus/es/components/tag/src/complex.vue.mjs

<p align="center"> <img width="200px" src="./logo.png"/> </p>

import { defineComponent, openBlock, createElementBlock, normalizeClass, normalizeStyle, createElementVNode, renderSlot, toDisplayString, createBlock, unref, createCommentVNode, Transition, withCtx } from "vue";
import "../../../icons/index.mjs";
import "../style/tag.css";
import { tagComplexProps, tagComplexEmits } from "./complex.props.mjs";
import { CloseOne } from "../../../icons/components/components.mjs";
const _hoisted_1 = { class: "cu-tag-content" };
const _hoisted_2 = { class: "cu-tag-content" };
const _sfc_main = /* @__PURE__ */ defineComponent({
  ...{
    name: "CuTagComplex"
  },
  __name: "complex",
  props: tagComplexProps,
  emits: tagComplexEmits,
  setup(__props, { emit: __emit }) {
    const props = __props;
    const emit = __emit;
    function handleClose() {
      emit("close");
    }
    const handleVNodeMounted = (vnode) => {
      vnode.component.subTree.component.bum = null;
    };
    return (_ctx, _cache) => {
      return !_ctx.transition ? (openBlock(), createElementBlock("span", {
        key: 0,
        class: normalizeClass(["cu-tag-complex", [_ctx.type ? "cu-tag--" + _ctx.type : void 0, { "is-round": _ctx.round }]]),
        style: normalizeStyle({ "--tag-size": _ctx.size + "px", borderColor: props.color })
      }, [
        createElementVNode("span", _hoisted_1, [
          renderSlot(_ctx.$slots, "default")
        ]),
        createElementVNode("span", {
          class: "complex-content",
          style: normalizeStyle({ background: props.color })
        }, [
          createElementVNode("span", null, toDisplayString(_ctx.title), 1),
          _ctx.closable ? (openBlock(), createBlock(unref(CloseOne), {
            key: 0,
            class: "closeicon",
            onClick: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("close"))
          })) : createCommentVNode("", true)
        ], 4)
      ], 6)) : (openBlock(), createBlock(Transition, {
        key: 1,
        name: "cu-zoom-x",
        appear: "",
        onVnodeMounted: handleVNodeMounted
      }, {
        default: withCtx(() => [
          createElementVNode("span", {
            class: normalizeClass(["cu-tag-complex", [_ctx.type ? "cu-tag--" + _ctx.type : void 0, { "is-round": _ctx.round }]]),
            style: normalizeStyle({ "--tag-size": _ctx.size + "px", borderColor: props.color })
          }, [
            createElementVNode("span", _hoisted_2, [
              renderSlot(_ctx.$slots, "default")
            ]),
            createElementVNode("span", {
              class: "complex-content",
              style: normalizeStyle({ background: props.color })
            }, [
              createElementVNode("span", null, toDisplayString(_ctx.title), 1),
              _ctx.closable ? (openBlock(), createBlock(unref(CloseOne), {
                key: 0,
                class: "closeicon",
                onClick: handleClose
              })) : createCommentVNode("", true)
            ], 4)
          ], 6)
        ]),
        _: 3
      }, 512));
    };
  }
});
export {
  _sfc_main as default
};