song-ui-u/es/components/tag/src/index.mjs

vue3 + js的PC前端组件库

import { defineComponent, createVNode } from 'vue';
import { useNamespace } from '../../../hook/use-namespace/index.mjs';
import { X } from 'song-ui-pro-icon';
import '../../../hook/use-zindex/index.mjs';
import '../../button/index.mjs';
import '../../buttonGroup/index.mjs';
import { XIcon } from '../../icon/index.mjs';
import '../../input/index.mjs';
import '../../textarea/index.mjs';
import '../../row/index.mjs';
import '../../col/index.mjs';
import '../../container/index.mjs';
import '../../checkbox/index.mjs';
import '../../switch/index.mjs';
import '../../form/index.mjs';
import '../../message/index.mjs';
import '../../mask/src/mask.mjs';
import '../../modal/index.mjs';
import '../../messageBox/index.mjs';
import '../../drawer/index.mjs';
import '../../badge/index.mjs';
import '../../space/index.mjs';
import '../../image/index.mjs';
import '../../radio/index.mjs';
import '../../divider/index.mjs';
import '../../chat/index.mjs';
import '../../progress/index.mjs';
import '../../upload/index.mjs';
import '../../vTree/index.mjs';
import '../../table/index.mjs';
import '../../tabs/index.mjs';
import '../../menu/index.mjs';
import '../../steps/index.mjs';
import '../../header/index.mjs';
import '../../breadcrumble/index.mjs';
import '../../datePicker/index.mjs';
import '../../tooltip/index.mjs';
import '../../popover/index.mjs';
import '../../timePicker/index.mjs';
import '../../select/index.mjs';
import '../../collapse/index.mjs';
import '../../card/index.mjs';
import '../../timeline/index.mjs';
import '../index.mjs';
import '../../result/index.mjs';
import '../../sender/index.mjs';

var Tag = /* @__PURE__ */ defineComponent({
  name: "x-tag",
  props: {
    type: {
      type: String,
      default: "primary"
    },
    closable: {
      type: Boolean,
      default: false
    },
    round: {
      type: Boolean,
      default: true
    },
    size: {
      type: String,
      default: "medium"
    },
    // Tag 的颜色
    bgColor: {
      type: String,
      default: ""
    },
    textColor: {
      type: String,
      default: ""
    },
    // Tag 的主题
    effect: {
      type: String,
      default: "light",
      validator: (value) => {
        return ["light", "dark", "plain"].includes(value);
      }
    }
  },
  setup(props, {
    slots,
    emit
  }) {
    const ns = useNamespace("tag");
    const handelClose = (e) => {
      e.stopPropagation();
      e.preventDefault();
      emit("close", e);
    };
    return () => createVNode("div", {
      "class": [ns.b(), ns.m(props.type), ns.m("effect", props.effect), ns.m(props.size), ns.is("round", props.round)],
      "style": {
        backgroundColor: props.bgColor,
        color: props.textColor
      }
    }, [createVNode("div", {
      "class": [ns.e("main")]
    }, [slots.default?.()]), props.closable && createVNode("div", {
      "onClick": (e) => handelClose(e),
      "class": ns.e("close")
    }, [createVNode(XIcon, {
      "size": "12"
    }, {
      default: () => [createVNode(X, null, null)]
    })])]);
  }
});

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