winbox-ui-next/lib/_components/dropdown/dropdown-option.js

We Design Vue 2.0: A Vue.js 3 UI Library

"use strict";
var vue = require("vue");
var globalConfig = require("../../_utils/global-config.js");
var index = require("../../checkbox/index.js");
var pluginVue_exportHelper = require("../../_virtual/plugin-vue_export-helper");
const _sfc_main = vue.defineComponent({
  name: "DropdownOption",
  components: {
    Checkbox: index["default"]
  },
  props: {
    value: [String, Number],
    label: String,
    disabled: Boolean,
    multiple: Boolean,
    isSelected: Boolean,
    isActive: Boolean,
    component: {
      type: String,
      default: "li"
    },
    onClick: {
      type: [Function, Array]
    },
    onMouseenter: {
      type: [Function, Array]
    },
    onMouseleave: {
      type: [Function, Array]
    }
  },
  emits: ["click", "mouseenter", "mouseleave"],
  setup(props, { emit }) {
    const prefixCls = globalConfig.getPrefixCls("dropdown-option");
    const handleClick = (e) => {
      if (!props.disabled) {
        emit("click", props.value, e);
      }
    };
    const handleMouseEnter = (e) => {
      if (!props.disabled) {
        emit("mouseenter", props.value, e);
      }
    };
    const handleMouseLeave = (e) => {
      if (!props.disabled) {
        emit("mouseleave", props.value, e);
      }
    };
    const cls = vue.computed(() => [
      prefixCls,
      {
        [`${prefixCls}-disabled`]: props.disabled,
        [`${prefixCls}-active`]: props.isActive,
        [`${prefixCls}-multiple`]: props.multiple
      }
    ]);
    return {
      prefixCls,
      cls,
      handleClick,
      handleMouseEnter,
      handleMouseLeave
    };
  }
});
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
  const _component_checkbox = vue.resolveComponent("checkbox");
  return vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.component), {
    class: vue.normalizeClass([_ctx.cls, { [`${_ctx.prefixCls}-has-suffix`]: Boolean(_ctx.$slots.suffix) }]),
    onClick: _ctx.handleClick,
    onMouseenter: _ctx.handleMouseEnter,
    onMouseleave: _ctx.handleMouseLeave
  }, {
    default: vue.withCtx(() => [
      _ctx.$slots.icon ? (vue.openBlock(), vue.createElementBlock("span", {
        key: 0,
        class: vue.normalizeClass(`${_ctx.prefixCls}-icon`)
      }, [
        vue.renderSlot(_ctx.$slots, "icon")
      ], 2)) : vue.createCommentVNode("v-if", true),
      _ctx.multiple ? (vue.openBlock(), vue.createBlock(_component_checkbox, {
        key: 1,
        class: vue.normalizeClass(`${_ctx.prefixCls}-checkbox`),
        "model-value": _ctx.isSelected,
        disabled: _ctx.disabled,
        "uninject-group-context": ""
      }, {
        default: vue.withCtx(() => [
          vue.renderSlot(_ctx.$slots, "default")
        ]),
        _: 3
      }, 8, ["class", "model-value", "disabled"])) : vue.renderSlot(_ctx.$slots, "default", { key: 2 }),
      _ctx.$slots.suffix ? (vue.openBlock(), vue.createElementBlock("span", {
        key: 3,
        class: vue.normalizeClass(`${_ctx.prefixCls}-suffix`)
      }, [
        vue.renderSlot(_ctx.$slots, "suffix")
      ], 2)) : vue.createCommentVNode("v-if", true)
    ]),
    _: 3
  }, 8, ["class", "onClick", "onMouseenter", "onMouseleave"]);
}
var DropDownOption = /* @__PURE__ */ pluginVue_exportHelper(_sfc_main, [["render", _sfc_render]]);
module.exports = DropDownOption;