mine-h5-ui/es/MeSearch/index.vue.js

一款轻量级、模块化基于 Vue3.x 的 H5 前端 UI 组件库 👍

import { defineComponent as h, mergeModels as c, useModel as v, createElementBlock as b, openBlock as a, normalizeStyle as k, createVNode as g, withDirectives as M, createCommentVNode as y, createElementVNode as T, unref as l, vModelText as $, Transition as x, withCtx as S, createBlock as z, toDisplayString as N } from "vue";
import { useSearch as w, useBtns as D } from "./hooks.js";
import C from "../MeIcon/index.vue.js";
/*!
          * mine-h5-ui v2.15.0
          * Copyright (c) 2025 biaov
          * @license MIT
          */
const E = ["placeholder", "disabled"], U = /* @__PURE__ */ h({
  name: "MeSearch",
  __name: "index",
  props: /* @__PURE__ */ c({
    placeholder: { default: "请搜索" },
    btnText: { default: "" },
    align: { default: "left" },
    radius: { default: "4px" },
    background: { default: "" },
    color: { default: "" },
    disabled: { type: Boolean, default: !1 }
  }, {
    modelValue: {},
    modelModifiers: {}
  }),
  emits: /* @__PURE__ */ c(["click", "search", "focus", "blur", "input", "change"], ["update:modelValue"]),
  setup(r, { emit: V }) {
    const s = V, t = v(r, "modelValue"), { onKeypress: d, onFocus: i, onBlur: u, onInput: m, onChange: p } = w(s), { onClean: B, handleBtn: f } = D({ emit: s, inputVal: t });
    return (n, e) => (a(), b("div", {
      class: "me-search",
      style: k(`border-radius:${n.radius};background:${n.background};color:${n.color};`)
    }, [
      g(C, {
        name: "icon-search1",
        size: "15px",
        color: "inherit"
      }),
      M(T("input", {
        type: "search",
        class: "input",
        "onUpdate:modelValue": e[0] || (e[0] = (o) => t.value = o),
        onFocus: e[1] || (e[1] = //@ts-ignore
        (...o) => l(i) && l(i)(...o)),
        onBlur: e[2] || (e[2] = //@ts-ignore
        (...o) => l(u) && l(u)(...o)),
        onKeypress: e[3] || (e[3] = //@ts-ignore
        (...o) => l(d) && l(d)(...o)),
        onInput: e[4] || (e[4] = //@ts-ignore
        (...o) => l(m) && l(m)(...o)),
        onChange: e[5] || (e[5] = //@ts-ignore
        (...o) => l(p) && l(p)(...o)),
        placeholder: n.placeholder,
        style: k(`text-align:${n.align};`),
        disabled: n.disabled
      }, null, 44, E), [
        [$, t.value]
      ]),
      g(x, { name: "fade" }, {
        default: S(() => [
          r.modelValue ? (a(), z(C, {
            key: 0,
            name: "icon-close",
            size: "16px",
            color: "inherit",
            onClick: l(B)
          }, null, 8, ["onClick"])) : y("", !0)
        ]),
        _: 1
      }),
      n.btnText ? (a(), b("div", {
        key: 0,
        class: "btn",
        onClick: e[6] || (e[6] = //@ts-ignore
        (...o) => l(f) && l(f)(...o))
      }, N(n.btnText), 1)) : y("", !0)
    ], 4));
  }
});
export {
  U as default
};