tyh-ui2
Version:
The next generation ui component library of tyh-ui is based on vue3 Version, fully embrace vue3.
72 lines (71 loc) • 2.41 kB
JavaScript
import { defineComponent as f, ref as c, computed as u, openBlock as a, createElementBlock as i, normalizeClass as s, normalizeStyle as y, createCommentVNode as h, createElementVNode as $, unref as m, withKeys as z } from "vue";
import { Props as I } from "./index2.js";
const P = ["type", "value", "placeholder", "maxlength", "disabled", "autofocus", "name"], B = f({
name: "TyhInput"
}), K = /* @__PURE__ */ f({
...B,
props: I,
emits: [
"update:modelValue",
"clear",
"enter",
"onblur",
"onfocus"
],
setup(v, { emit: o }) {
const n = v, r = c(n.type), l = c(!1), b = (e) => {
o("update:modelValue", e.target.value);
}, w = () => {
n.disabled || (o("update:modelValue", ""), o("clear"));
}, g = u(() => [
"tyh-input-input",
`tyh-input-input-${n.size}`,
{
"tyh-input-icon-padding": n.icon,
"tyh-input-clear-padding": n.clear,
"tyh-input-disabled": n.disabled
}
]), k = () => {
l.value = !l.value, r.value = l.value ? "text" : "password";
}, d = u(() => n.clear ? !!n.showPassword : !0), C = u(() => d.value ? l.value ? "tyh-ui-browse" : "tyh-ui-eye-close" : "tyh-ui-guanbi"), V = () => {
d.value ? k() : w();
};
return (e, t) => (a(), i("div", {
class: s(["tyh-input", { "tyh-input-disabled": e.disabled }])
}, [
e.icon ? (a(), i("i", {
key: 0,
class: s(["tyh-icon", "tyh-input-icon", `tyh-input-icon-${e.size}`, e.icon]),
style: y({ cursor: e.disabled ? "not-allowed" : "Default" })
}, null, 6)) : h("", !0),
$("input", {
class: s(m(g)),
type: r.value,
value: e.modelValue,
placeholder: e.placeholder,
maxlength: e.max,
disabled: e.disabled,
autofocus: e.autofocus,
name: e.name,
onInput: b,
onKeyup: t[0] || (t[0] = z((p) => o("enter"), ["enter"])),
onBlur: t[1] || (t[1] = (p) => o("onblur")),
onFocus: t[2] || (t[2] = (p) => o("onfocus"))
}, null, 42, P),
e.clear || e.showPassword ? (a(), i("i", {
key: 1,
class: s([
"tyh-icon",
"tyh-input-clear",
`tyh-input-icon-${e.size}`,
m(C)
]),
style: y({ cursor: e.disabled ? "not-allowed" : "pointer" }),
onClick: V
}, null, 6)) : h("", !0)
], 2));
}
});
export {
K as default
};