@macrulez/vue-form-schema 0.1.9 → 0.2.1

package/dist/ui.js

@@ -1,10 +1,11 @@
-import { defineComponent as V, computed as B, openBlock as t, createElementBlock as r, normalizeClass as T, createTextVNode as I, toDisplayString as y, createCommentVNode as k, renderSlot as A, normalizeProps as W, guardReactiveProps as X, Fragment as x, renderList as S, ref as w, onMounted as Y, onUnmounted as Z, createBlock as F, withCtx as q, createElementVNode as b, mergeProps as R, createVNode as M, unref as z, resolveDynamicComponent as U, resolveComponent as _, createSlots as ee } from "vue";
-import { b as te, t as P, q as le, h as K } from "./MaskEngine-mLoXKd4d.js";
-const ae = ["for"], ne = {
+import { defineComponent as V, computed as B, openBlock as t, createElementBlock as n, normalizeClass as T, createTextVNode as I, toDisplayString as y, createCommentVNode as k, renderSlot as A, normalizeProps as W, guardReactiveProps as X, Fragment as x, renderList as S, ref as w, onMounted as Y, onUnmounted as Z, createBlock as F, withCtx as q, createElementVNode as b, mergeProps as R, createVNode as M, unref as z, resolveDynamicComponent as U, resolveComponent as _, createSlots as ee } from "vue";
+import { b as te, d as P, u as le } from "./MaskEngine-BEXwX4BK.js";
+import { g as K } from "./ValidationEngine-BC4U1ef1.js";
+const ae = ["for"], re = {
   key: 0,
   class: "vfs-field__required",
   "aria-hidden": "true"
-}, re = ["id"], C = /* @__PURE__ */ V({
+}, ne = ["id"], C = /* @__PURE__ */ V({
   __name: "BaseField",
   props: {
     field: {},
@@ -13,37 +14,37 @@ const ae = ["for"], ne = {
   },
   setup(e) {
     const o = e, l = B(() => {
-      var u;
-      return !!(o.touched && ((u = o.error) != null && u.length));
+      var d;
+      return !!(o.touched && ((d = o.error) != null && d.length));
     }), s = B(() => `${o.field.name}-error`), a = B(() => ({
       "aria-required": o.field.required ? "true" : void 0,
       "aria-invalid": l.value ? "true" : "false",
       "aria-describedby": l.value ? s.value : void 0
     }));
-    return (u, m) => (t(), r("div", {
+    return (d, m) => (t(), n("div", {
       class: T(["vfs-field", [`vfs-field--${o.field.type}`, { "vfs-field--error": l.value }]])
     }, [
-      o.field.label ? (t(), r("label", {
+      o.field.label ? (t(), n("label", {
         key: 0,
         for: o.field.name,
         class: "vfs-field__label"
       }, [
         I(y(o.field.label) + " ", 1),
-        o.field.required ? (t(), r("span", ne, "*")) : k("", !0)
+        o.field.required ? (t(), n("span", re, "*")) : k("", !0)
       ], 8, ae)) : k("", !0),
-      A(u.$slots, "default", W(X(a.value))),
-      l.value ? (t(), r("ul", {
+      A(d.$slots, "default", W(X(a.value))),
+      l.value ? (t(), n("ul", {
         key: 1,
         id: s.value,
         class: "vfs-field__errors",
         role: "alert",
         "aria-live": "polite"
       }, [
-        (t(!0), r(x, null, S(e.error, (f, h) => (t(), r("li", {
+        (t(!0), n(x, null, S(e.error, (f, h) => (t(), n("li", {
           key: h,
           class: "vfs-field__error"
         }, y(f), 1))), 128))
-      ], 8, re)) : k("", !0)
+      ], 8, ne)) : k("", !0)
     ], 2));
   }
 }), oe = ["id", "type", "name", "value", "placeholder", "disabled", "required"], N = /* @__PURE__ */ V({
@@ -57,10 +58,10 @@ const ae = ["for"], ne = {
   emits: ["update:modelValue", "blur"],
   setup(e, { emit: o }) {
     const l = e, s = o, a = w(null);
-    let u = null;
+    let d = null;
     Y(() => {
-      a.value && l.field.mask && (u = te(a.value, l.field.mask));
-    }), Z(() => u == null ? void 0 : u());
+      a.value && l.field.mask && (d = te(a.value, l.field.mask));
+    }), Z(() => d == null ? void 0 : d());
     function m(f) {
       s("update:modelValue", f.target.value);
     }
@@ -101,10 +102,10 @@ const ae = ["for"], ne = {
   setup(e, { emit: o }) {
     const l = o;
     function s(a) {
-      const u = a.target.value;
-      l("update:modelValue", u === "" ? null : Number(u));
+      const d = a.target.value;
+      l("update:modelValue", d === "" ? null : Number(d));
     }
-    return (a, u) => (t(), F(C, {
+    return (a, d) => (t(), F(C, {
       field: e.field,
       error: e.error,
       touched: e.touched
@@ -121,7 +122,7 @@ const ae = ["for"], ne = {
         }, m, {
           class: "vfs-input",
           onInput: s,
-          onBlur: u[0] || (u[0] = (f) => l("blur"))
+          onBlur: d[0] || (d[0] = (f) => l("blur"))
         }), null, 16, ie)
       ]),
       _: 1
@@ -143,7 +144,7 @@ const ae = ["for"], ne = {
       error: e.error,
       touched: e.touched
     }, {
-      default: q((u) => [
+      default: q((d) => [
         b("textarea", R({
           id: e.field.name,
           name: e.field.name,
@@ -151,7 +152,7 @@ const ae = ["for"], ne = {
           placeholder: e.field.placeholder,
           disabled: e.field.disabled === !0,
           required: e.field.required
-        }, u, {
+        }, d, {
           class: "vfs-textarea",
           onInput: a[0] || (a[0] = (m) => l("update:modelValue", m.target.value)),
           onBlur: a[1] || (a[1] = (m) => l("blur"))
@@ -173,10 +174,8 @@ const ae = ["for"], ne = {
   },
   emits: ["update:modelValue", "blur"],
   setup(e, { emit: o }) {
-    const l = e, s = o, a = B(
-      () => Array.isArray(l.field.options) ? l.field.options : []
-    );
-    function u(m) {
+    const l = e, s = o, a = B(() => Array.isArray(l.field.options) ? l.field.options : []);
+    function d(m) {
       const f = m.target, h = a.value.find((c) => String(c.value) === f.value);
       s("update:modelValue", (h == null ? void 0 : h.value) ?? f.value);
     }
@@ -186,7 +185,7 @@ const ae = ["for"], ne = {
       touched: e.touched
     }, {
       default: q((h) => [
-        e.field.optionsLoading ? (t(), r("div", de, "Loading…")) : (t(), r("select", R({
+        e.field.optionsLoading ? (t(), n("div", de, "Loading…")) : (t(), n("select", R({
           key: 1,
           id: e.field.name,
           name: e.field.name,
@@ -194,7 +193,7 @@ const ae = ["for"], ne = {
           required: e.field.required
         }, h, {
           class: "vfs-select",
-          onChange: u,
+          onChange: d,
           onBlur: f[0] || (f[0] = (c) => s("blur"))
         }), [
           b("option", {
@@ -202,7 +201,7 @@ const ae = ["for"], ne = {
             disabled: "",
             selected: e.modelValue === null || e.modelValue === void 0 || e.modelValue === ""
           }, y(e.field.placeholder ?? "Select an option"), 9, ce),
-          (t(!0), r(x, null, S(a.value, (c) => (t(), r("option", {
+          (t(!0), n(x, null, S(a.value, (c) => (t(), n("option", {
             key: String(c.value),
             value: String(c.value),
             selected: e.modelValue === c.value
@@ -231,7 +230,7 @@ const ae = ["for"], ne = {
       error: e.error,
       touched: e.touched
     }, {
-      default: q((u) => [
+      default: q((d) => [
         b("label", fe, [
           b("input", R({
             id: e.field.name,
@@ -241,12 +240,12 @@ const ae = ["for"], ne = {
             disabled: e.field.disabled === !0,
             required: e.field.required,
             "aria-checked": e.modelValue ? "true" : "false"
-          }, u, {
+          }, d, {
             class: "vfs-checkbox",
             onChange: a[0] || (a[0] = (m) => l("update:modelValue", m.target.checked)),
             onBlur: a[1] || (a[1] = (m) => l("blur"))
           }), null, 16, ve),
-          e.field.label ? (t(), r("span", be, y(e.field.label), 1)) : k("", !0)
+          e.field.label ? (t(), n("span", be, y(e.field.label), 1)) : k("", !0)
         ])
       ]),
       _: 1
@@ -272,21 +271,19 @@ const ae = ["for"], ne = {
     const l = e, s = o, a = B(() => {
       var f;
       return !!(l.touched && ((f = l.error) != null && f.length));
-    }), u = B(() => `${l.field.name}-error`), m = B(
-      () => Array.isArray(l.field.options) ? l.field.options : []
-    );
-    return (f, h) => (t(), r("fieldset", {
+    }), d = B(() => `${l.field.name}-error`), m = B(() => Array.isArray(l.field.options) ? l.field.options : []);
+    return (f, h) => (t(), n("fieldset", {
       class: T(["vfs-field vfs-field--radio", { "vfs-field--error": a.value }]),
       "aria-required": e.field.required ? "true" : void 0,
       "aria-invalid": a.value ? "true" : "false",
-      "aria-describedby": a.value ? u.value : void 0
+      "aria-describedby": a.value ? d.value : void 0
     }, [
-      e.field.label ? (t(), r("legend", ye, [
+      e.field.label ? (t(), n("legend", ye, [
         I(y(e.field.label) + " ", 1),
-        e.field.required ? (t(), r("span", $e, "*")) : k("", !0)
+        e.field.required ? (t(), n("span", $e, "*")) : k("", !0)
       ])) : k("", !0),
       b("div", ke, [
-        (t(!0), r(x, null, S(m.value, (c) => (t(), r("label", {
+        (t(!0), n(x, null, S(m.value, (c) => (t(), n("label", {
           key: String(c.value),
           class: "vfs-radio-label"
         }, [
@@ -303,14 +300,14 @@ const ae = ["for"], ne = {
           I(" " + y(c.label), 1)
         ]))), 128))
       ]),
-      a.value ? (t(), r("ul", {
+      a.value ? (t(), n("ul", {
         key: 1,
-        id: u.value,
+        id: d.value,
         class: "vfs-field__errors",
         role: "alert",
         "aria-live": "polite"
       }, [
-        (t(!0), r(x, null, S(e.error, (c, g) => (t(), r("li", {
+        (t(!0), n(x, null, S(e.error, (c, g) => (t(), n("li", {
           key: g,
           class: "vfs-field__error"
         }, y(c), 1))), 128))
@@ -333,7 +330,7 @@ const ae = ["for"], ne = {
       error: e.error,
       touched: e.touched
     }, {
-      default: q((u) => [
+      default: q((d) => [
         b("input", R({
           id: e.field.name,
           type: "date",
@@ -341,7 +338,7 @@ const ae = ["for"], ne = {
           value: e.modelValue ?? "",
           disabled: e.field.disabled === !0,
           required: e.field.required
-        }, u, {
+        }, d, {
           class: "vfs-input",
           onInput: a[0] || (a[0] = (m) => l("update:modelValue", m.target.value)),
           onBlur: a[1] || (a[1] = (m) => l("blur"))
@@ -372,20 +369,20 @@ const ae = ["for"], ne = {
       date: Q
     };
     function a($) {
-      var n;
-      return $.component ? $.component : ((n = o.components) == null ? void 0 : n[$.type]) ?? l[$.type] ?? s[$.type] ?? null;
+      var r;
+      return $.component ? $.component : ((r = o.components) == null ? void 0 : r[$.type]) ?? l[$.type] ?? s[$.type] ?? null;
     }
-    const { rows: u, append: m, remove: f } = le(o.form, o.field.name);
+    const { rows: d, append: m, remove: f } = le(o.form, o.field.name);
     function h($) {
       return K(o.form.values.value, $.name);
     }
-    function c($, n) {
-      o.form.setField($.name, n);
+    function c($, r) {
+      o.form.setField($.name, r);
     }
     function g($) {
       var i;
-      const n = o.form;
-      (i = n.touchField) == null || i.call(n, $.name);
+      const r = o.form;
+      (i = r.touchField) == null || i.call(r, $.name);
     }
     function D($) {
       return o.form.errors.value[$.name] ?? [];
@@ -393,19 +390,19 @@ const ae = ["for"], ne = {
     function L($) {
       return o.form.touched.value[$.name] ?? !1;
     }
-    return ($, n) => (t(), r("div", xe, [
+    return ($, r) => (t(), n("div", xe, [
       M(C, {
         field: { ...e.field, label: void 0 },
         error: [],
         touched: !1
       }, {
         default: q(() => [
-          e.field.label ? (t(), r("div", Fe, y(e.field.label), 1)) : k("", !0),
-          (t(!0), r(x, null, S(z(u), (i) => (t(), r("div", {
+          e.field.label ? (t(), n("div", Fe, y(e.field.label), 1)) : k("", !0),
+          (t(!0), n(x, null, S(z(d), (i) => (t(), n("div", {
             key: i.key,
             class: "vfs-array__row"
           }, [
-            (t(!0), r(x, null, S(i.fields, (v) => (t(), r(x, {
+            (t(!0), n(x, null, S(i.fields, (v) => (t(), n(x, {
               key: v.name
             }, [
               a(v) ? (t(), F(U(a(v)), {
@@ -414,21 +411,21 @@ const ae = ["for"], ne = {
                 "model-value": h(v),
                 error: D(v),
                 touched: L(v),
-                "onUpdate:modelValue": (d) => c(v, d),
-                onBlur: (d) => g(v)
+                "onUpdate:modelValue": (u) => c(v, u),
+                onBlur: (u) => g(v)
               }, null, 40, ["field", "model-value", "error", "touched", "onUpdate:modelValue", "onBlur"])) : k("", !0)
             ], 64))), 128)),
             b("button", {
               type: "button",
               class: "vfs-array__remove",
               onClick: (v) => z(f)(i.index)
-            }, " Remove ", 8, qe)
+            }, "Remove", 8, qe)
           ]))), 128)),
           b("button", {
             type: "button",
             class: "vfs-array__add",
-            onClick: n[0] || (n[0] = (i) => z(m)())
-          }, " + Add row ")
+            onClick: r[0] || (r[0] = (i) => z(m)())
+          }, "+ Add row")
         ]),
         _: 1
       }, 8, ["field"])
@@ -450,7 +447,7 @@ const ae = ["for"], ne = {
   },
   emits: ["update:modelValue", "blur"],
   setup(e, { emit: o }) {
-    const l = e, s = o, a = w(!1), u = w(null), m = B(() => l.modelValue ? Array.isArray(l.modelValue) ? l.modelValue : [l.modelValue] : []), f = B(() => l.field.multiple ?? !1);
+    const l = e, s = o, a = w(!1), d = w(null), m = B(() => l.modelValue ? Array.isArray(l.modelValue) ? l.modelValue : [l.modelValue] : []), f = B(() => l.field.multiple ?? !1);
     function h(i) {
       if (!i || i.length === 0) {
         s("update:modelValue", null);
@@ -472,10 +469,10 @@ const ae = ["for"], ne = {
       a.value = !1;
     }
     function $(i) {
-      const v = m.value.filter((d, p) => p !== i);
-      v.length === 0 ? (s("update:modelValue", null), u.value && (u.value.value = "")) : f.value ? s("update:modelValue", v) : s("update:modelValue", v[0]);
+      const v = m.value.filter((u, p) => p !== i);
+      v.length === 0 ? (s("update:modelValue", null), d.value && (d.value.value = "")) : f.value ? s("update:modelValue", v) : s("update:modelValue", v[0]);
     }
-    function n(i) {
+    function r(i) {
       return i < 1024 ? `${i} B` : i < 1024 * 1024 ? `${(i / 1024).toFixed(1)} KB` : `${(i / (1024 * 1024)).toFixed(1)} MB`;
     }
     return (i, v) => (t(), F(C, {
@@ -483,7 +480,7 @@ const ae = ["for"], ne = {
       error: e.error,
       touched: e.touched
     }, {
-      default: q((d) => [
+      default: q((u) => [
         b("div", {
           class: T(["vfs-file-zone", { "vfs-file-zone--dragging": a.value }]),
           onDragover: D,
@@ -493,14 +490,14 @@ const ae = ["for"], ne = {
           b("input", R({
             id: e.field.name,
             ref_key: "inputRef",
-            ref: u,
+            ref: d,
             type: "file",
             name: e.field.name,
             accept: e.field.accept,
             multiple: f.value,
             disabled: e.field.disabled === !0,
             required: e.field.required
-          }, d, {
+          }, u, {
             class: "vfs-file-input",
             onChange: c
           }), null, 16, Se),
@@ -513,16 +510,16 @@ const ae = ["for"], ne = {
               "aria-hidden": "true"
             }, "📁", -1)),
             b("span", null, y(a.value ? "Drop files here" : "Click to upload or drag & drop"), 1),
-            e.field.accept ? (t(), r("span", Re, y(e.field.accept), 1)) : k("", !0)
+            e.field.accept ? (t(), n("span", Re, y(e.field.accept), 1)) : k("", !0)
           ], 8, Ce)
         ], 34),
-        m.value.length ? (t(), r("ul", De, [
-          (t(!0), r(x, null, S(m.value, (p, E) => (t(), r("li", {
+        m.value.length ? (t(), n("ul", De, [
+          (t(!0), n(x, null, S(m.value, (p, E) => (t(), n("li", {
             key: `${p.name}-${E}`,
             class: "vfs-file-item"
           }, [
             b("span", Le, y(p.name), 1),
-            b("span", Ae, y(n(p.size)), 1),
+            b("span", Ae, y(r(p.size)), 1),
             b("button", {
               type: "button",
               class: "vfs-file-remove",
@@ -543,11 +540,12 @@ const ae = ["for"], ne = {
   props: {
     form: {},
     components: {},
-    submitLabel: {}
+    submitLabel: {},
+    fields: {}
   },
   emits: ["submit"],
   setup(e, { emit: o }) {
-    const l = e, s = P(), a = o, u = {
+    const l = e, s = P(), a = o, d = {
       text: N,
       email: N,
       number: O,
@@ -558,92 +556,93 @@ const ae = ["for"], ne = {
       date: Q,
       file: Te
     };
-    function m(n) {
+    function m(r) {
       var i;
-      return n.component ? n.component : ((i = l.components) == null ? void 0 : i[n.type]) ?? s[n.type] ?? u[n.type] ?? null;
+      return r.component ? r.component : ((i = l.components) == null ? void 0 : i[r.type]) ?? s[r.type] ?? d[r.type] ?? null;
     }
-    function f(n) {
-      return K(l.form.values.value, n.name);
+    function f(r) {
+      return K(l.form.values.value, r.name);
     }
-    function h(n, i) {
-      l.form.setField(n.name, i);
+    function h(r, i) {
+      l.form.setField(r.name, i);
     }
-    function c(n) {
+    function c(r) {
       var v;
       const i = l.form;
-      (v = i.touchField) == null || v.call(i, n.name);
+      (v = i.touchField) == null || v.call(i, r.name);
     }
-    function g(n) {
-      return l.form.errors.value[n.name] ?? [];
+    function g(r) {
+      return l.form.errors.value[r.name] ?? [];
     }
-    function D(n) {
-      return l.form.touched.value[n.name] ?? !1;
+    function D(r) {
+      return l.form.touched.value[r.name] ?? !1;
     }
     const L = B(
-      () => l.form.fields.value.filter((n) => n.visible !== !1)
+      () => (l.fields ?? l.form.fields.value).filter((r) => r.visible !== !1)
     );
-    async function $(n) {
-      n.preventDefault(), await l.form.submit(), a("submit");
+    async function $(r) {
+      r.preventDefault(), await l.form.submit(), a("submit");
     }
-    return (n, i) => {
+    return (r, i) => {
       const v = _("FormRenderer", !0);
-      return t(), r("form", {
+      return t(), n("form", {
         class: "vfs-form",
         novalidate: "",
         onSubmit: $
       }, [
-        (t(!0), r(x, null, S(L.value, (d) => (t(), r(x, {
-          key: d.name
+        (t(!0), n(x, null, S(L.value, (u) => (t(), n(x, {
+          key: u.name
         }, [
-          n.$slots[`field-${d.name}`] ? A(n.$slots, `field-${d.name}`, {
+          r.$slots[`field-${u.name}`] ? A(r.$slots, `field-${u.name}`, {
             key: 0,
-            field: d,
-            value: f(d),
-            error: g(d),
-            touched: D(d),
-            setValue: (p) => h(d, p),
-            touch: () => c(d)
-          }) : d.type === "group" ? (t(), r("fieldset", ze, [
-            d.label ? (t(), r("legend", Ie, y(d.label), 1)) : k("", !0),
-            d.fields ? (t(), F(v, {
+            field: u,
+            value: f(u),
+            error: g(u),
+            touched: D(u),
+            setValue: (p) => h(u, p),
+            touch: () => c(u)
+          }) : u.type === "group" ? (t(), n("fieldset", ze, [
+            u.label ? (t(), n("legend", Ie, y(u.label), 1)) : k("", !0),
+            u.fields ? (t(), F(v, {
               key: 1,
               form: e.form,
+              fields: u.fields,
               components: e.components
-            }, null, 8, ["form", "components"])) : k("", !0)
-          ])) : d.type === "array" ? (t(), F(Be, {
+            }, null, 8, ["form", "fields", "components"])) : k("", !0)
+          ])) : u.type === "array" ? (t(), F(Be, {
             key: 2,
-            field: d,
+            field: u,
             form: e.form,
             components: e.components
-          }, null, 8, ["field", "form", "components"])) : m(d) ? (t(), F(U(m(d)), {
+          }, null, 8, ["field", "form", "components"])) : m(u) ? (t(), F(U(m(u)), {
             key: 3,
-            field: d,
-            "model-value": f(d),
-            error: g(d),
-            touched: D(d),
-            "onUpdate:modelValue": (p) => h(d, p),
-            onBlur: (p) => c(d)
+            field: u,
+            "model-value": f(u),
+            error: g(u),
+            touched: D(u),
+            "onUpdate:modelValue": (p) => h(u, p),
+            onBlur: (p) => c(u)
           }, ee({ _: 2 }, [
-            n.$slots[`label-${d.name}`] ? {
+            r.$slots[`label-${u.name}`] ? {
               name: "label",
               fn: q(() => [
-                A(n.$slots, `label-${d.name}`, { field: d })
+                A(r.$slots, `label-${u.name}`, { field: u })
               ]),
               key: "0"
             } : void 0,
-            n.$slots[`error-${d.name}`] ? {
+            r.$slots[`error-${u.name}`] ? {
               name: "error",
               fn: q(() => [
-                A(n.$slots, `error-${d.name}`, {
-                  field: d,
-                  error: g(d)
+                A(r.$slots, `error-${u.name}`, {
+                  field: u,
+                  error: g(u)
                 })
               ]),
               key: "1"
             } : void 0
           ]), 1064, ["field", "model-value", "error", "touched", "onUpdate:modelValue", "onBlur"])) : k("", !0)
         ], 64))), 128)),
-        A(n.$slots, "submit", {
+        A(r.$slots, "submit", {
           isSubmitting: e.form.isSubmitting.value,
           isValid: e.form.isValid.value
         }, () => [
@@ -659,7 +658,7 @@ const ae = ["for"], ne = {
 }), Me = { class: "vfs-multistep" }, Ue = { class: "vfs-multistep__steps" }, Pe = { class: "vfs-multistep__step-number" }, Ke = {
   key: 0,
   class: "vfs-multistep__step-label"
-}, Oe = { class: "vfs-multistep__progress" }, je = { class: "vfs-multistep__nav" }, Ge = ["disabled"], We = /* @__PURE__ */ V({
+}, Oe = { class: "vfs-multistep__progress" }, je = { class: "vfs-multistep__nav" }, Ge = ["disabled"], Xe = /* @__PURE__ */ V({
   __name: "MultiStepFormRenderer",
   props: {
     form: {},
@@ -675,14 +674,14 @@ const ae = ["for"], ne = {
     async function a() {
       await l.form.next();
     }
-    async function u() {
+    async function d() {
       await l.form.submit(), s("submit");
     }
-    return (m, f) => (t(), r("div", Me, [
+    return (m, f) => (t(), n("div", Me, [
       b("div", Ue, [
-        (t(!0), r(x, null, S(e.form.steps, (h, c) => {
+        (t(!0), n(x, null, S(e.form.steps, (h, c) => {
           var g;
-          return t(), r("div", {
+          return t(), n("div", {
             key: c,
             class: T(["vfs-multistep__step", {
               "vfs-multistep__step--active": c === e.form.currentStep.value,
@@ -690,7 +689,7 @@ const ae = ["for"], ne = {
             }])
           }, [
             b("span", Pe, y(c + 1), 1),
-            (g = e.stepLabels) != null && g[c] ? (t(), r("span", Ke, y(e.stepLabels[c]), 1)) : k("", !0)
+            (g = e.stepLabels) != null && g[c] ? (t(), n("span", Ke, y(e.stepLabels[c]), 1)) : k("", !0)
           ], 2);
         }), 128))
       ]),
@@ -701,19 +700,19 @@ const ae = ["for"], ne = {
       }, {
         submit: q(() => [
           b("div", je, [
-            e.form.isFirstStep.value ? k("", !0) : (t(), r("button", {
+            e.form.isFirstStep.value ? k("", !0) : (t(), n("button", {
               key: 0,
               type: "button",
               class: "vfs-multistep__back",
               onClick: f[0] || (f[0] = (h) => e.form.back())
             }, y(e.backLabel ?? "← Back"), 1)),
-            e.form.isLastStep.value ? (t(), r("button", {
+            e.form.isLastStep.value ? (t(), n("button", {
               key: 2,
               type: "button",
               class: "vfs-submit",
               disabled: e.form.isSubmitting.value,
-              onClick: u
-            }, y(e.submitLabel ?? "Submit"), 9, Ge)) : (t(), r("button", {
+              onClick: d
+            }, y(e.submitLabel ?? "Submit"), 9, Ge)) : (t(), n("button", {
               key: 1,
               type: "button",
               class: "vfs-multistep__next",
@@ -732,7 +731,7 @@ export {
   Q as DateField,
   Te as FileField,
   Ee as FormRenderer,
-  We as MultiStepFormRenderer,
+  Xe as MultiStepFormRenderer,
   O as NumberField,
   J as RadioField,
   G as SelectField,

package/dist/valibot.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});function p(t){if(!t||t.type!=="object"||!t.entries)throw new Error("[vue-form-schema] parseValibot expects a v.object() schema");return Object.entries(t.entries).map(([r,i])=>o(r,i))}function o(t,r){let i=!0,e=r;(e.type==="optional"||e.type==="nullable"||e.type==="nullish")&&(i=!1,e=e.wrapped??e);const a=u(e),s={type:a,name:t,required:i};return a==="select"&&(s.options=e.options.map(n=>({label:String(n),value:n}))),a==="group"&&e.entries&&(s.fields=Object.entries(e.entries).map(([n,l])=>o(n,l))),s}function u(t){const r=t.type;if(r==="string"&&Array.isArray(t.pipe)&&t.pipe.some(e=>e.type==="email"))return"email";switch(r){case"string":return"text";case"number":return"number";case"boolean":return"checkbox";case"picklist":case"enum":return"select";case"array":return"array";case"object":return"group";default:return"text"}}exports.parseValibot=p;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("./schemaUtils-Cc7CwGXB.cjs");function b(r){const e=r;if((e==null?void 0:e.type)==="variant")return f(e);if(!e||e.type!=="object"||!e.entries)throw new Error("[vue-form-schema] parseValibot expects a v.object() or v.variant() schema");return Object.entries(e.entries).map(([i,t])=>l(i,t))}function f(r){const e=r.key,i=r.options;function t(n){var o;const s=n.entries??{};return String((o=s[e])==null?void 0:o.literal)}const c={type:"select",name:e,label:e,required:!0,options:i.map(n=>{const s=t(n);return{label:s,value:s}})},a={};for(const n of i){const s=n.entries??{};a[t(n)]=Object.entries(s).filter(([o])=>o!==e).map(([o,p])=>l(o,p))}return[c,...u.discriminatedFields(e,a)]}function l(r,e){let i=!0,t=e;(t.type==="optional"||t.type==="nullable"||t.type==="nullish")&&(i=!1,t=t.wrapped??t);const c=m(t),a={type:c,name:r,required:i};return c==="select"&&(a.options=t.options.map(n=>({label:String(n),value:n}))),c==="group"&&t.entries&&(a.fields=Object.entries(t.entries).map(([n,s])=>l(`${r}.${n}`,s))),a}function m(r){const e=r.type;if(e==="string"&&Array.isArray(r.pipe)&&r.pipe.some(t=>t.type==="email"))return"email";switch(e){case"string":return"text";case"number":return"number";case"boolean":return"checkbox";case"picklist":case"enum":return"select";case"array":return"array";case"object":return"group";default:return"text"}}exports.parseValibot=b;

package/dist/valibot.d.ts

@@ -1,4 +1,6 @@
 import { Component } from 'vue';
+import { GenericSchema } from 'valibot';
+import { InferOutput } from 'valibot';
 
 declare type AsyncValidatorFn = (value: unknown, values: Record<string, unknown>) => Promise<string | null>;
 
@@ -82,10 +84,31 @@ declare type MaskPreset = 'phone-ru' | 'phone-eu' | 'date' | 'inn' | 'iban';
  *
  * const schema = v.object({ email: v.pipe(v.string(), v.email()), age: v.number() })
  * const fields = parseValibot(schema)
+ *
+ * The return type carries the schema's inferred value type
+ * (`v.InferOutput<S>`), so `useForm({ schema: fields })` picks up fully
+ * typed `values`/`errors`/`onSubmit` without an explicit `useForm<Values>(...)`.
+ *
+ * Also accepts a `v.variant(key, [...])` schema — converted into a `select`
+ * field for the discriminator plus every variant's own fields, each only
+ * visible while the discriminator matches its variant (see
+ * `discriminatedFields`). Combine with `clearOnHide: true` on `useForm` so
+ * switching variants resets the now-hidden variant's values.
  */
-export declare function parseValibot(schema: ValibotSchema): FieldDefinition[];
+export declare function parseValibot<S extends GenericSchema>(schema: S): TypedFieldDefinitions<InferOutput<S>>;
 
-declare type ValibotSchema = any;
+/**
+ * A `FieldDefinition[]` returned by a schema adapter (`parseZod` / `parseYup`
+ * / `parseValibot`) that also carries the source schema's inferred value
+ * type at the type level. `useForm({ schema: parseZod(mySchema) })` then
+ * infers `T` automatically — no `useForm<Values>(...)` needed.
+ *
+ * `__inferredValues` does not exist at runtime; it is a type-only marker
+ * erased by the compiler.
+ */
+declare type TypedFieldDefinitions<T> = FieldDefinition[] & {
+    readonly __inferredValues?: T;
+};
 
 declare type ValidatorFn = (value: unknown, values: Record<string, unknown>) => string | null;