hongluan-ui/es/components/tag/src/tag.mjs

Hongluan Component Library for Vue 3

import { defineComponent, computed, resolveComponent, openBlock, createElementBlock, normalizeClass, normalizeStyle, renderSlot, createCommentVNode, createElementVNode, createBlock, withCtx, createVNode, Transition } from 'vue';
import { HlIcon } from '../../icon/index.mjs';
import '../../system-icon/index.mjs';
import '../../../hooks/index.mjs';
import { tagProps } from './tag2.mjs';
import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
import SystemClose from '../../system-icon/src/close.mjs';
import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
import { useConsistentProp } from '../../../hooks/use-consistent-prop/index.mjs';

const _sfc_main = defineComponent({
  name: "Tag",
  components: {
    HlIcon,
    SystemClose
  },
  props: tagProps,
  emits: ["close", "click"],
  setup(props, { emit }) {
    const { namespace } = useNamespace("tag");
    const { size: tagSize } = useConsistentProp();
    const classes = computed(() => {
      const { type, effect, outline, round, active } = props;
      return [
        namespace.value,
        type ? type : "",
        tagSize.value ? `${tagSize.value}` : "",
        effect && effect,
        outline ? "outline" : "",
        round ? "round" : "",
        active ? "is-focus" : ""
      ];
    });
    const handleClose = (event) => {
      event.stopPropagation();
      emit("close", event);
    };
    const handleClick = (event) => {
      emit("click", event);
    };
    return {
      classes,
      handleClose,
      handleClick
    };
  }
});
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
  const _component_system_close = resolveComponent("system-close");
  const _component_hl_icon = resolveComponent("hl-icon");
  return _ctx.disableTransitions ? (openBlock(), createElementBlock("span", {
    key: 0,
    class: normalizeClass(_ctx.classes),
    style: normalizeStyle({ backgroundColor: _ctx.color }),
    onClick: _ctx.handleClick
  }, [
    _ctx.$slots.prefix ? renderSlot(_ctx.$slots, "prefix", { key: 0 }) : createCommentVNode("v-if", true),
    createElementVNode("span", null, [
      renderSlot(_ctx.$slots, "default")
    ]),
    _ctx.$slots.suffix ? renderSlot(_ctx.$slots, "suffix", { key: 1 }) : createCommentVNode("v-if", true),
    _ctx.closable ? (openBlock(), createBlock(_component_hl_icon, {
      key: 2,
      class: "tag-close",
      onClick: _ctx.handleClose
    }, {
      default: withCtx(() => [
        createVNode(_component_system_close)
      ]),
      _: 1
    }, 8, ["onClick"])) : createCommentVNode("v-if", true)
  ], 14, ["onClick"])) : (openBlock(), createBlock(Transition, {
    key: 1,
    name: "zoom-in-center"
  }, {
    default: withCtx(() => [
      createElementVNode("span", {
        class: normalizeClass(_ctx.classes),
        style: normalizeStyle({ backgroundColor: _ctx.color }),
        onClick: _ctx.handleClick
      }, [
        _ctx.$slots.prefix ? renderSlot(_ctx.$slots, "prefix", { key: 0 }) : createCommentVNode("v-if", true),
        createElementVNode("span", null, [
          renderSlot(_ctx.$slots, "default")
        ]),
        _ctx.$slots.suffix ? renderSlot(_ctx.$slots, "suffix", { key: 1 }) : createCommentVNode("v-if", true),
        _ctx.closable ? (openBlock(), createBlock(_component_hl_icon, {
          key: 2,
          class: "tag-close",
          onClick: _ctx.handleClose
        }, {
          default: withCtx(() => [
            createVNode(_component_system_close)
          ]),
          _: 1
        }, 8, ["onClick"])) : createCommentVNode("v-if", true)
      ], 14, ["onClick"])
    ]),
    _: 3
  }));
}
var Tag = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);

export { Tag as default };
//# sourceMappingURL=tag.mjs.map