import { defineComponent as F, ref as y, computed as g, watch as N, openBlock as d, createElementBlock as p, normalizeClass as V, createVNode as K, withCtx as L, toDisplayString as $ } from "vue";
import { C as c } from "./base-PQGakkrl.js";
import { _ as v } from "./Index.vue_vue_type_script_setup_true_lang-DWw1B8Z2.js";
const j = /* @__PURE__ */ F({
  name: "ClInputSearch",
  components: {
    ClInput: v
  },
  __name: "Index",
  props: {
    theme: {
      type: String,
      default: "icon",
      validator: (n) => ["icon", "text"].indexOf(n) !== -1
    },
    location: {
      type: String,
      default: "right",
      validator: (n) => ["left", "right"].indexOf(n) !== -1
    },
    value: {
      type: String,
      default: ""
    },
    placeholder: {
      type: String,
      default: ""
    },
    className: {
      type: String,
      default: ""
    },
    disabled: {
      type: Boolean,
      default: !1
    },
    textLabel: {
      type: String,
      default: ""
    },
    changDelayTime: {
      type: Number,
      default: 200
    }
  },
  emits: ["update:value", "onChange", "onSearch", "onFocus", "onBlur"],
  setup(n, { expose: C, emit: b }) {
    const t = n, o = b, m = y(null);
    let r = t.value;
    const a = y(t.value), S = g(() => {
      const e = {
        "panel-input-search": !0,
        "input-search-disabled": t.disabled
      };
      c.isEmpty(t.className) || t.className?.split(" ").forEach((i) => {
        c.isEmpty(i) || (e[i] = !0);
      });
      const l = c.isEmpty(t.theme) ? "icon" : t.theme;
      return e[`input-search-${l}`] = !0, e;
    }), x = g(() => {
      let e = "append";
      return c.isEmpty(t.location) || (e = t.location === "left" ? "prepend" : "append"), e;
    });
    let s;
    const E = () => {
      s && (clearTimeout(s), s = null);
    }, f = (e) => {
      o("update:value", e), o("onChange", e);
    }, u = (e) => {
      o("onSearch", e);
    }, B = (e) => {
      o("onFocus", e);
    }, _ = (e) => {
      o("onBlur", e);
    };
    N(
      () => t.value,
      (e, l) => {
        e !== l && (a.value = e);
      }
    );
    const k = (e) => {
      t.disabled || (E(), s = setTimeout(() => {
        r !== e && (r = e, f(e));
      }, t.changDelayTime));
    }, I = (e) => {
      t.disabled || setTimeout(() => {
        u(e);
      }, t.changDelayTime);
    }, T = (e) => {
      t.disabled || B(e);
    }, O = (e) => {
      t.disabled || _(e);
    }, h = () => {
      t.disabled || u(a.value);
    }, D = () => {
      t.disabled || (f(""), u(""));
    };
    return C({
      getValue: () => a.value,
      setValue: (e) => {
        r = e, a.value = e;
      },
      focus: () => {
        m.value?.focus();
      }
    }), (e, l) => (d(), p("div", {
      class: V(S.value)
    }, [
      K(v, {
        ref_key: "refElInput",
        ref: m,
        value: a.value,
        "onUpdate:value": l[0] || (l[0] = (i) => a.value = i),
        theme: "icon",
        placeholder: n.placeholder,
        isClean: !0,
        disabled: n.disabled,
        onOnChange: k,
        onOnKeyupEnter: I,
        onOnFocus: T,
        onOnBlur: O,
        onOnClear: D
      }, {
        [x.value]: L(() => [
          n.theme === "text" ? (d(), p("span", {
            key: 0,
            onClick: h
          }, $(n.textLabel), 1)) : (d(), p("i", {
            key: 1,
            class: "clIconFont clIcon-search",
            onClick: h
          }))
        ]),
        _: 2
      }, 1032, ["value", "placeholder", "disabled"])
    ], 2));
  }
});
export {
  j as _
};
//# sourceMappingURL=Index.vue_vue_type_script_setup_true_lang-B_jfFc6B.js.map
