adverich-kun-ui
Version:
Una librería de componentes Vue.js con Tailwind CSS
65 lines (64 loc) • 1.81 kB
JavaScript
import { ref as a, inject as F, computed as E, watch as V, onUnmounted as T } from "vue";
import { debounce as j } from "../../../../utils/utils.js";
function R(u, r) {
const t = a(u.modelValue ?? ""), o = a(!1), l = a(""), n = a(!1), g = a(null), h = a(null), s = a(!1), v = F("registerField", null), d = F("unregisterField", null), y = E(() => u.error || !!l.value && n.value), c = async () => {
for (const e of u.rules) {
const m = await Promise.resolve(e(t.value));
if (m !== !0) return m;
}
return !0;
}, f = j(async () => {
const e = await c();
l.value = e === !0 ? "" : e;
}, u.debounce ?? 300);
V(() => u.modelValue, (e) => {
e !== t.value && (s.value = !0, t.value = e ?? "");
}), V(t, () => {
if (s.value) {
s.value = !1;
return;
}
n.value = !0, r("update:modelValue", t.value), u.validateOnBlur || f();
});
const b = (e) => {
t.value = e.target.value;
}, w = async () => {
if (o.value = !1, u.validateOnBlur) {
const e = await c();
l.value = e === !0 ? "" : e;
}
r("blur");
}, B = () => {
o.value = !0, r("focus");
}, I = () => {
t.value = "", n.value = !0, u.validateOnBlur || f();
}, i = async () => {
n.value = !0;
const e = await c();
return l.value = e === !0 ? "" : e, e === !0;
}, O = () => {
t.value = u.modelValue, n.value = !1, l.value = "";
}, x = () => {
n.value = !1, l.value = "";
};
return v && v({ validate: i }), T(() => {
d && d({ validate: i });
}), {
inputField: g,
inputValue: t,
rootRef: h,
inputFocused: o,
validationError: l,
hasError: y,
handleInput: b,
handleBlur: w,
focusInput: B,
validate: i,
reset: O,
resetValidation: x,
clearInput: I
};
}
export {
R as default
};