import { h, defineComponent, toRef } from 'vue';
import { resolveSlot } from "../../../_utils/index.mjs";
import { useStyle } from "../../../_mixins/index.mjs";
import { ClearIcon } from "../../icons/index.mjs";
import { NBaseIcon } from "../../icon/index.mjs";
import NIconSwitchTransition from "../../icon-switch-transition/index.mjs";
import style from "./styles/index.cssr.mjs";
export default defineComponent({
  name: 'BaseClear',
  props: {
    clsPrefix: {
      type: String,
      required: true
    },
    show: Boolean,
    onClear: Function
  },
  setup(props) {
    useStyle('-base-clear', style, toRef(props, 'clsPrefix'));
    return {
      handleMouseDown(e) {
        var _a;
        e.preventDefault();
        (_a = props.onClear) === null || _a === void 0 ? void 0 : _a.call(props, e);
      }
    };
  },
  render() {
    const {
      clsPrefix
    } = this;
    return h("div", {
      class: `${clsPrefix}-base-clear`
    }, h(NIconSwitchTransition, null, {
      default: () => {
        var _a, _b;
        return this.show ? h("div", {
          key: "dismiss",
          class: `${clsPrefix}-base-clear__clear`,
          onClick: this.onClear,
          onMousedown: this.handleMouseDown,
          "data-clear": true
        }, resolveSlot(this.$slots.icon, () => [h(NBaseIcon, {
          clsPrefix: clsPrefix
        }, {
          default: () => h(ClearIcon, null)
        })])) : h("div", {
          key: "icon",
          class: `${clsPrefix}-base-clear__placeholder`
        }, (_b = (_a = this.$slots).placeholder) === null || _b === void 0 ? void 0 : _b.call(_a));
      }
    }));
  }
});