@foormjs/vue 0.2.4 → 0.2.5

package/dist/index.js

@@ -1,156 +1,284 @@
-import { defineComponent as G, inject as I, computed as h, watch as J, openBlock as r, createBlock as N, unref as d, withCtx as z, renderSlot as A, ref as Q, createElementBlock as u, toDisplayString as n, createCommentVNode as U, Fragment as R, renderList as T, mergeProps as B, resolveDynamicComponent as K, withDirectives as D, normalizeClass as S, createElementVNode as p, vModelDynamic as W, vShow as O, vModelSelect as X, vModelRadio as Y, createTextVNode as P, vModelCheckbox as Z, reactive as ee } from "vue";
-import { evalComputed as M, supportsAltAction as oe, createFormData as te } from "foorm";
-import { VuilessField as ae, VuilessForm as ne } from "vuiless-forms";
-import { createFoorm as re } from "@foormjs/atscript";
-function le(a, o) {
-  if (!a)
-    return;
-  const t = {};
-  for (const [y, i] of Object.entries(a))
-    t[y] = M(i, o);
-  return t;
+import { computed as f, inject as I, provide as q, defineComponent as A, watch as Ue, openBlock as n, createBlock as w, resolveDynamicComponent as mo, mergeProps as ae, unref as l, createElementBlock as m, toDisplayString as g, isRef as vo, ref as J, withModifiers as Ze, renderSlot as W, createVNode as ie, createElementVNode as L, toRaw as fo, Fragment as T, renderList as X, withKeys as Je, onBeforeUnmount as yo, normalizeClass as re, createCommentVNode as k, useId as bo, withDirectives as N, vShow as Q, withCtx as H, vModelDynamic as ho, vModelSelect as po, vModelRadio as go, createTextVNode as _e, reactive as eo } from "vue";
+import { useFoormField as xo, useFoormForm as Bo } from "@foormjs/composables";
+import { getByPath as ko, setByPath as $o, isObjectField as Se, isArrayField as qe, isTupleField as Me, isUnionField as je, getFieldMeta as y, createFieldValidator as Fo, resolveOptions as Ie, resolveAttrs as Te, resolveFieldProp as S, buildFieldEntry as Co, createFoormValueResolver as xe, createFormData as le, getFormValidator as Ro, resolveFormProp as Qe, supportsAltAction as Lo, optKey as ge, optLabel as oo, detectUnionVariant as Oo, createFoormDef as Vo } from "@foormjs/atscript";
+const wo = f(() => "");
+function Ne(e) {
+  const o = I("__foorm_form");
+  if (!o)
+    throw new Error(`${e} must be used inside an OoForm component`);
+  const t = o, r = I("__foorm_root_data");
+  if (!r)
+    throw new Error(`${e} must be used inside an OoForm component (missing root data)`);
+  const a = () => r.value, d = I("__foorm_path_prefix", wo), s = I("__foorm_form_context"), v = f(() => s?.value ?? {});
+  function b(h) {
+    return f(() => {
+      const p = typeof h == "function" ? h() : h;
+      return p ? d.value ? `${d.value}.${p}` : p : d.value;
+    });
+  }
+  function O(h) {
+    return h ? d.value ? `${d.value}.${h}` : h : d.value;
+  }
+  function x(h) {
+    return ko(a(), h);
+  }
+  function $(h, p) {
+    $o(a(), h, p);
+  }
+  function F(h, p) {
+    const B = a();
+    return { v: h, data: B.value, context: v.value, entry: p };
+  }
+  return {
+    foormState: t,
+    rootFormData: a,
+    pathPrefix: d,
+    formContext: v,
+    joinPath: b,
+    buildPath: O,
+    getByPath: x,
+    setByPath: $,
+    buildScope: F
+  };
+}
+function Be() {
+  const e = I("__foorm_union", void 0);
+  return q("__foorm_union", void 0), e;
 }
-const se = /* @__PURE__ */ G({
+function to(e, o) {
+  return o !== void 0 ? e ? `${e} #${o + 1}` : `#${o + 1}` : e;
+}
+const Ao = { key: 1 }, pe = {
+  v: void 0,
+  data: {},
+  context: {},
+  entry: void 0
+}, de = /* @__PURE__ */ A({
   __name: "oo-field",
   props: {
     field: {},
-    type: {},
-    component: {},
-    autocomplete: {},
-    altAction: {},
-    order: {},
-    name: {},
-    phantom: { type: Boolean },
-    label: { type: [String, Function] },
-    description: { type: [String, Function] },
-    hint: { type: [String, Function] },
-    placeholder: { type: [String, Function] },
-    optional: { type: [Boolean, Function] },
-    disabled: { type: [Boolean, Function] },
-    hidden: { type: [Boolean, Function] },
-    readonly: { type: [Boolean, Function] },
-    classes: { type: [String, Object, Function] },
-    styles: { type: [String, Object, Function] },
-    options: { type: [Array, Function] },
-    attrs: {},
-    value: { type: Function },
-    validators: {},
-    maxLength: {},
-    minLength: {},
-    min: {},
-    max: {},
-    error: {}
+    error: {},
+    onRemove: { type: Function },
+    canRemove: { type: Boolean },
+    removeLabel: {},
+    arrayIndex: {}
   },
-  setup(a) {
-    const o = a, t = I(
-      "vuiless"
+  setup(e) {
+    const o = e, t = I("__foorm_types"), r = I("__foorm_components"), a = I("__foorm_errors"), d = I("__foorm_action_handler", () => {
+    }), s = I(
+      "__foorm_change_handler",
+      () => {
+      }
+    ), { rootFormData: v, formContext: b, joinPath: O, buildPath: x, getByPath: $, setByPath: F, buildScope: h } = Ne("OoField"), p = O(() => o.field.path), B = Se(o.field) || qe(o.field) || Me(o.field), E = je(o.field), j = I(
+      "__foorm_level",
+      f(() => -1)
+    ), M = B ? j.value + 1 : -1;
+    (B || E) && q(
+      "__foorm_path_prefix",
+      f(() => p.value)
+    ), B && q(
+      "__foorm_level",
+      f(() => M)
     );
-    function y(l, x, k) {
-      return typeof l == "function" ? h(() => l(x.value)) : l ?? k;
+    const u = (c) => vo(c) ? c.value : c;
+    function R(c, z, _) {
+      return c ? f(z) : _;
     }
-    const i = (l) => typeof l == "object" && l !== null && "value" in l ? l.value : l, V = h(() => ({
-      v: t.value.formData[o.field],
-      data: t.value.formData,
-      context: t.value.formContext ?? {},
-      entry: void 0
-    })), C = y(o.optional, V, !1), F = y(o.disabled, V, !1), _ = y(o.hidden, V, !1), g = y(o.readonly, V, !1), E = o.phantom ? void 0 : h(() => !i(C)), m = h(() => ({
-      v: t.value.formData[o.field],
-      data: t.value.formData,
-      context: t.value.formContext ?? {},
-      entry: {
-        field: o.field,
-        type: o.type,
-        component: o.component,
-        name: o.name || o.field,
-        optional: i(C),
-        disabled: i(F),
-        hidden: i(_),
-        readonly: i(g)
-      }
-    })), f = y(o.label, m, void 0), s = y(o.description, m, void 0), q = y(o.hint, m, void 0), v = y(o.placeholder, m, void 0), b = y(o.options, m, void 0), $ = y(o.styles, m, void 0), e = h(() => {
-      const l = typeof o.classes == "function" ? o.classes(m.value) : o.classes;
-      return typeof l == "string" ? {
-        [l]: !0,
-        disabled: i(F),
-        required: !i(C)
-      } : {
-        ...l,
-        disabled: i(F),
-        required: !i(C)
-      };
-    });
-    function L(l, x) {
+    function P(c, z, _) {
       return {
-        ...e.value,
-        error: !!l || !!x
+        ...typeof c == "string" ? { [c]: !0 } : c,
+        disabled: z,
+        required: _
       };
     }
-    const j = h(() => le(o.attrs, m.value)), w = o.phantom ? h(() => typeof o.value == "function" ? o.value(m.value) : o.value) : void 0;
-    if (typeof o.value == "function" && !o.phantom) {
-      const l = h(() => {
-        if (i(g))
-          return o.value(m.value);
-      });
-      J(
-        l,
-        (x) => {
-          x !== void 0 && i(g) && (t.value.formData[o.field] = x);
-        },
-        { immediate: !0 }
+    const i = o.field.prop, D = y(i, "foorm.autocomplete"), se = y(i, "expect.maxLength")?.length, Y = y(i, "foorm.component"), oe = y(i, "foorm.altAction"), $e = oe ? {
+      id: oe.id,
+      label: oe.label ?? y(i, "meta.label") ?? o.field.name
+    } : void 0, C = Fo(
+      i,
+      B || E ? { rootOnly: !0 } : void 0
+    );
+    function V() {
+      return $(p.value);
+    }
+    function G(c) {
+      F(p.value, c);
+    }
+    function ue(c) {
+      if (c) {
+        const z = xe(
+          v().value,
+          b.value
+        );
+        G(le(o.field.prop, z).value);
+      } else
+        G(void 0);
+      s("update", p.value, V());
+    }
+    const We = f(() => Y ? r?.value?.[Y] : t?.value?.[o.field.type]);
+    let K, ce, te, Z, me, ve, Fe, Ce, Re, Le, Oe, Ve, we, Ae, Ee, fe;
+    const ne = y(i, "meta.required") !== void 0;
+    if (o.field.allStatic)
+      fe = !1, K = y(i, "foorm.disabled") !== void 0, ce = y(i, "foorm.hidden") !== void 0, te = o.field.prop.optional ?? !1, Z = y(i, "foorm.readonly") !== void 0, me = o.field.phantom ? void 0 : ne, ve = y(i, "meta.label") ?? o.field.name, Fe = y(i, "meta.description"), Ce = y(i, "meta.hint"), Re = y(i, "meta.placeholder"), Oe = y(i, "foorm.styles"), Ve = Ie(i, pe), we = y(i, "foorm.attr") !== void 0 ? Te(i, pe) : void 0, Le = B ? y(i, "foorm.title") ?? y(i, "meta.label") ?? o.field.name : void 0, Ae = P(
+        y(i, "foorm.classes"),
+        K,
+        ne
+      ), Ee = o.field.phantom ? y(i, "foorm.value") : void 0;
+    else {
+      const c = /* @__PURE__ */ new Set();
+      for (const he of i.metadata.keys())
+        he.startsWith("foorm.fn.") && c.add(he.slice(9));
+      fe = y(i, "foorm.validate") !== void 0;
+      const z = c.has("disabled") || c.has("hidden") || c.has("readonly"), _ = c.has("label") || c.has("description") || c.has("hint") || c.has("placeholder") || c.has("classes") || c.has("styles") || c.has("options") || c.has("value") || c.has("attr") || c.has("title") || fe, be = z || _ ? f(() => h(V())) : void 0, Pe = { staticAsBoolean: !0 };
+      K = R(
+        c.has("disabled"),
+        () => S(i, "foorm.fn.disabled", "foorm.disabled", be.value, Pe) ?? !1,
+        y(i, "foorm.disabled") !== void 0
+      ), ce = R(
+        c.has("hidden"),
+        () => S(i, "foorm.fn.hidden", "foorm.hidden", be.value, Pe) ?? !1,
+        y(i, "foorm.hidden") !== void 0
+      ), te = o.field.prop.optional ?? !1, Z = R(
+        c.has("readonly"),
+        () => S(i, "foorm.fn.readonly", "foorm.readonly", be.value, Pe) ?? !1,
+        y(i, "foorm.readonly") !== void 0
+      ), me = o.field.phantom ? void 0 : ne;
+      const U = _ ? f(
+        () => Co(i, be.value, o.field.path, {
+          type: o.field.type,
+          component: Y,
+          name: o.field.name,
+          optional: u(te),
+          disabled: u(K),
+          hidden: u(ce),
+          readonly: u(Z)
+        })
+      ) : void 0;
+      if (ve = R(
+        c.has("label"),
+        () => S(i, "foorm.fn.label", "meta.label", U.value) ?? o.field.name,
+        y(i, "meta.label") ?? o.field.name
+      ), Fe = R(
+        c.has("description"),
+        () => S(i, "foorm.fn.description", "meta.description", U.value),
+        y(i, "meta.description")
+      ), Ce = R(
+        c.has("hint"),
+        () => S(i, "foorm.fn.hint", "meta.hint", U.value),
+        y(i, "meta.hint")
+      ), Re = R(
+        c.has("placeholder"),
+        () => S(i, "foorm.fn.placeholder", "meta.placeholder", U.value),
+        y(i, "meta.placeholder")
+      ), Oe = R(
+        c.has("styles"),
+        () => S(i, "foorm.fn.styles", "foorm.styles", U.value),
+        y(i, "foorm.styles")
+      ), Ve = R(
+        c.has("options"),
+        () => Ie(i, U.value),
+        Ie(i, pe)
+      ), we = c.has("attr") || y(i, "foorm.attr") !== void 0 ? c.has("attr") ? f(() => Te(i, U.value)) : Te(i, pe) : void 0, Le = B ? R(
+        c.has("title"),
+        () => S(i, "foorm.fn.title", "foorm.title", U.value) ?? y(i, "meta.label") ?? o.field.name,
+        y(i, "foorm.title") ?? y(i, "meta.label") ?? o.field.name
+      ) : void 0, Ae = c.has("classes") || typeof K != "boolean" ? f(
+        () => P(
+          c.has("classes") ? S(i, "foorm.fn.classes", void 0, U.value) : y(i, "foorm.classes"),
+          u(K),
+          ne
+        )
+      ) : P(y(i, "foorm.classes"), K, ne), Ee = o.field.phantom ? R(
+        c.has("value"),
+        () => S(i, "foorm.fn.value", "foorm.value", U.value),
+        y(i, "foorm.value")
+      ) : void 0, c.has("value") && !o.field.phantom) {
+        const he = f(() => {
+          if (u(Z)) return S(i, "foorm.fn.value", "foorm.value", U.value);
+        });
+        Ue(
+          he,
+          (He) => {
+            He !== void 0 && u(Z) && F(p.value, He);
+          },
+          { immediate: !0 }
+        );
+      }
+    }
+    function lo(c) {
+      return C(
+        c,
+        fe ? { data: v(), context: b.value } : void 0
       );
     }
-    const c = o.validators.map((l) => (x, k, H) => l({
-      v: x,
-      data: k,
-      context: H ?? {},
-      entry: m.value.entry
+    const ao = o.field.prop.optional ?? !1, {
+      model: ye,
+      error: io,
+      onBlur: Xe
+    } = xo({
+      getValue: V,
+      setValue: G,
+      rules: [lo],
+      path: () => p.value,
+      ...ao ? { resetValue: void 0 } : qe(o.field) || Me(o.field) ? { resetValue: [] } : Se(o.field) ? { resetValue: {} } : {}
+    });
+    let Ye = ye.value;
+    const ro = B || E ? Xe : () => {
+      Xe();
+      const c = ye.value;
+      c !== Ye && (Ye = c, s("update", p.value, c));
+    }, Ge = f(() => {
+      const c = x(o.field.path);
+      return (c ? a?.value?.[c] : void 0) ?? o.error ?? io.value;
+    }), so = {
+      onBlur: ro,
+      model: {
+        get value() {
+          return ye.value;
+        },
+        set value(c) {
+          ye.value = c;
+        }
+      },
+      type: o.field.type,
+      altAction: $e,
+      name: o.field.name,
+      field: o.field,
+      maxLength: se,
+      autocomplete: D,
+      level: B ? M : void 0
+    }, uo = f(() => ({
+      value: u(Ee),
+      label: u(ve),
+      description: u(Fe),
+      hint: u(Ce),
+      placeholder: u(Re),
+      style: u(Oe),
+      optional: u(te),
+      onToggleOptional: u(te) ? ue : void 0,
+      required: me !== void 0 ? u(me) : void 0,
+      disabled: u(K),
+      hidden: u(ce),
+      readonly: u(Z),
+      options: u(Ve),
+      title: u(Le),
+      onRemove: o.onRemove,
+      canRemove: o.canRemove,
+      removeLabel: o.removeLabel,
+      arrayIndex: o.arrayIndex,
+      ...u(we)
+    })), co = f(() => ({
+      ...so,
+      ...uo.value,
+      error: Ge.value,
+      class: { ...u(Ae), error: !!Ge.value }
     }));
-    return (l, x) => (r(), N(d(ae), {
-      modelValue: d(t).formData[o.field],
-      "onUpdate:modelValue": x[0] || (x[0] = (k) => d(t).formData[o.field] = k),
-      rules: d(c)
-    }, {
-      default: z((k) => [
-        A(l.$slots, "default", {
-          onBlur: k.onBlur,
-          error: a.error || k.error,
-          model: k.model,
-          formData: d(t).formData,
-          formContext: d(t).formContext,
-          label: d(f),
-          description: d(s),
-          hint: d(q),
-          placeholder: d(v),
-          value: d(w),
-          classes: L(a.error, k.error),
-          styles: d($),
-          optional: d(C),
-          disabled: d(F),
-          hidden: d(_),
-          readonly: d(g),
-          type: a.type,
-          altAction: a.altAction,
-          component: a.component,
-          vName: a.name,
-          field: a.field,
-          options: d(b),
-          maxLength: a.maxLength,
-          required: d(E),
-          autocomplete: a.autocomplete,
-          attrs: j.value
-        })
-      ]),
-      _: 3
-    }, 8, ["modelValue", "rules"]));
+    return (c, z) => We.value ? (n(), w(mo(We.value), ae({ key: 0 }, co.value, { onAction: l(d) }), null, 16, ["onAction"])) : (n(), m("div", Ao, " [" + g(u(l(ve))) + '] No component for type "' + g(e.field.type) + '"' + g(l(Y) ? ` (component "${l(Y)}" not supplied)` : ""), 1));
   }
-}), ce = { key: 0 }, ue = { key: 1 }, de = { key: 0 }, ie = ["onUpdate:modelValue", "onBlur", "placeholder", "autocomplete", "name", "type", "disabled", "readonly"], me = { class: "oo-error-slot" }, pe = { key: 4 }, ye = { key: 0 }, ve = ["onUpdate:modelValue", "onBlur", "name", "disabled", "readonly"], he = {
-  key: 0,
-  value: "",
-  disabled: ""
-}, be = ["value"], xe = { class: "oo-error-slot" }, ke = { class: "oo-field-label" }, Ce = { key: 0 }, Ve = { class: "oo-radio-group" }, _e = ["value", "onUpdate:modelValue", "onBlur", "name", "disabled", "readonly"], ge = { class: "oo-error-slot" }, Be = ["onUpdate:modelValue", "onBlur", "name", "disabled", "readonly"], De = { key: 0 }, Fe = { class: "oo-error-slot" }, Ae = ["onClick"], Ue = { key: 9 }, Ee = ["disabled"], $e = /* @__PURE__ */ G({
+}), Eo = ["disabled"], St = /* @__PURE__ */ A({
   __name: "oo-form",
   props: {
-    form: {},
+    def: {},
     formData: {},
     formContext: {},
     firstValidation: {},
@@ -158,251 +286,1306 @@ const se = /* @__PURE__ */ G({
     types: {},
     errors: {}
   },
-  emits: ["submit", "action", "unsupported-action"],
-  setup(a, { emit: o }) {
-    const t = a, y = Q({}), i = h(() => t.formData || y.value), V = h(() => ({
+  emits: ["submit", "error", "action", "unsupported-action", "change"],
+  setup(e, { emit: o }) {
+    const t = e, r = J({}), a = f(() => t.formData || r.value);
+    function d() {
+      return a.value.value;
+    }
+    const s = f(() => Ro(t.def)), { clearErrors: v, reset: b, submit: O, setErrors: x } = Bo({
+      formData: a,
+      formContext: f(() => t.formContext),
+      firstValidation: f(() => t.firstValidation),
+      submitValidator: () => s.value({
+        data: d(),
+        context: t.formContext ?? {}
+      })
+    });
+    q(
+      "__foorm_root_data",
+      f(() => a.value)
+    ), q(
+      "__foorm_path_prefix",
+      f(() => "")
+    ), q(
+      "__foorm_types",
+      f(() => t.types)
+    ), q(
+      "__foorm_components",
+      f(() => t.components)
+    ), q(
+      "__foorm_errors",
+      f(() => t.errors)
+    );
+    const $ = f(() => ({
       v: void 0,
-      data: i.value,
+      data: d(),
       context: t.formContext ?? {},
       entry: void 0
-    })), C = h(() => M(t.form.title, V.value)), F = h(() => M(t.form.submit.text, V.value)), _ = h(() => M(t.form.submit.disabled, V.value));
-    function g(s) {
-      oe(t.form, s) ? E("action", s, i.value) : E("unsupported-action", s, i.value);
+    })), F = f(
+      () => Qe(
+        t.def.type,
+        "foorm.fn.submit.text",
+        "foorm.submit.text",
+        $.value
+      ) ?? "Submit"
+    ), h = f(
+      () => Qe(
+        t.def.type,
+        "foorm.fn.submit.disabled",
+        "foorm.submit.disabled",
+        $.value
+      ) ?? !1
+    ), p = o, B = () => fo(d());
+    function E(u) {
+      Lo(t.def, u) ? p("action", u, B()) : p("unsupported-action", u, B());
     }
-    const E = o;
-    function m(s) {
-      return typeof s == "string" ? s : s.key;
+    q("__foorm_action_handler", E);
+    function j(u, R, P) {
+      p("change", u, R, P, B());
     }
-    function f(s) {
-      return typeof s == "string" ? s : s.label;
+    q("__foorm_change_handler", j);
+    function M() {
+      const u = O();
+      u === !0 ? p("submit", B()) : p("error", u);
     }
-    return (s, q) => (r(), N(d(ne), {
-      "first-validation": a.firstValidation,
-      onSubmit: q[0] || (q[0] = (v) => E("submit", v)),
-      "form-data": i.value,
-      "form-context": a.formContext
-    }, {
-      default: z((v) => [
-        A(s.$slots, "form.header", {
-          clearErrors: v.clearErrors,
-          reset: v.reset,
-          title: C.value,
-          formContext: a.formContext,
-          disabled: _.value
-        }, () => [
-          C.value ? (r(), u("h2", ce, n(C.value), 1)) : U("", !0)
+    return (u, R) => (n(), m("form", {
+      onSubmit: Ze(M, ["prevent"])
+    }, [
+      W(u.$slots, "form.header", {
+        clearErrors: l(v),
+        reset: l(b),
+        setErrors: l(x),
+        formContext: e.formContext,
+        disabled: h.value
+      }),
+      W(u.$slots, "form.before", {
+        clearErrors: l(v),
+        reset: l(b),
+        setErrors: l(x)
+      }),
+      ie(de, {
+        field: e.def.rootField
+      }, null, 8, ["field"]),
+      W(u.$slots, "form.after", {
+        clearErrors: l(v),
+        reset: l(b),
+        setErrors: l(x),
+        disabled: h.value,
+        formContext: e.formContext
+      }),
+      W(u.$slots, "form.submit", {
+        disabled: h.value,
+        text: F.value,
+        clearErrors: l(v),
+        reset: l(b),
+        setErrors: l(x),
+        formContext: e.formContext
+      }, () => [
+        L("button", { disabled: h.value }, g(F.value), 9, Eo)
+      ]),
+      W(u.$slots, "form.footer", {
+        disabled: h.value,
+        clearErrors: l(v),
+        reset: l(b),
+        setErrors: l(x),
+        formContext: e.formContext
+      })
+    ], 32));
+  }
+}), Po = /* @__PURE__ */ A({
+  __name: "oo-iterator",
+  props: {
+    def: {},
+    pathPrefix: {},
+    onRemove: { type: Function },
+    canRemove: { type: Boolean },
+    removeLabel: {}
+  },
+  setup(e) {
+    const o = e, t = I(
+      "__foorm_path_prefix",
+      f(() => "")
+    ), r = f(() => o.pathPrefix !== void 0 ? t.value ? `${t.value}.${o.pathPrefix}` : o.pathPrefix : t.value);
+    return q("__foorm_path_prefix", r), (a, d) => (n(!0), m(T, null, X(e.def.fields, (s) => (n(), w(de, {
+      key: s.path ?? s.name,
+      field: s,
+      "on-remove": e.onRemove,
+      "can-remove": e.canRemove,
+      "remove-label": e.removeLabel
+    }, null, 8, ["field", "on-remove", "can-remove", "remove-label"]))), 128));
+  }
+}), Io = { class: "oo-no-data-text" }, ee = /* @__PURE__ */ A({
+  __name: "oo-no-data",
+  props: {
+    onEdit: { type: Function }
+  },
+  setup(e) {
+    const o = J(!1);
+    return (t, r) => (n(), m("div", {
+      class: "oo-no-data",
+      onMouseenter: r[0] || (r[0] = (a) => o.value = !0),
+      onMouseleave: r[1] || (r[1] = (a) => o.value = !1),
+      onClick: r[2] || (r[2] = //@ts-ignore
+      (...a) => e.onEdit && e.onEdit(...a)),
+      role: "button",
+      tabindex: "0",
+      onKeydown: [
+        r[3] || (r[3] = Je(
+          //@ts-ignore
+          (...a) => e.onEdit && e.onEdit(...a),
+          ["enter"]
+        )),
+        r[4] || (r[4] = Je(Ze(
+          //@ts-ignore
+          (...a) => e.onEdit && e.onEdit(...a),
+          ["prevent"]
+        ), ["space"]))
+      ]
+    }, [
+      L("span", Io, g(o.value ? "Edit" : "No Data"), 1)
+    ], 32));
+  }
+});
+function Ke(e) {
+  const o = J(!1);
+  function t() {
+    o.value = !o.value;
+  }
+  function r() {
+    o.value = !1;
+  }
+  function a(s) {
+    s(), r();
+  }
+  function d(s) {
+    e.value && !e.value.contains(s.target) && r();
+  }
+  return Ue(o, (s) => {
+    s ? document.addEventListener("click", d, !0) : document.removeEventListener("click", d, !0);
+  }), yo(() => document.removeEventListener("click", d, !0)), { isOpen: o, toggle: t, close: r, select: a };
+}
+const To = ["disabled", "title"], Do = {
+  key: 0,
+  class: "oo-dropdown-menu"
+}, So = ["onClick"], no = /* @__PURE__ */ A({
+  __name: "oo-variant-picker",
+  props: {
+    unionContext: {},
+    disabled: { type: Boolean }
+  },
+  setup(e) {
+    const o = J(null), { isOpen: t, toggle: r, select: a } = Ke(o);
+    function d(s, v) {
+      a(() => s.changeVariant(v));
+    }
+    return (s, v) => (n(), m("div", {
+      ref_key: "dropdownRef",
+      ref: o,
+      class: "oo-dropdown"
+    }, [
+      L("button", {
+        type: "button",
+        class: "oo-variant-trigger",
+        disabled: e.disabled,
+        title: e.unionContext.variants[e.unionContext.currentIndex.value]?.label ?? "Switch variant",
+        onClick: v[0] || (v[0] = //@ts-ignore
+        (...b) => l(r) && l(r)(...b))
+      }, [...v[1] || (v[1] = [
+        L("svg", {
+          width: "14",
+          height: "14",
+          viewBox: "0 0 16 16",
+          fill: "none"
+        }, [
+          L("circle", {
+            cx: "3",
+            cy: "8",
+            r: "1.5",
+            fill: "currentColor"
+          }),
+          L("circle", {
+            cx: "8",
+            cy: "8",
+            r: "1.5",
+            fill: "currentColor"
+          }),
+          L("circle", {
+            cx: "13",
+            cy: "8",
+            r: "1.5",
+            fill: "currentColor"
+          })
+        ], -1)
+      ])], 8, To),
+      l(t) ? (n(), m("div", Do, [
+        (n(!0), m(T, null, X(e.unionContext.variants, (b, O) => (n(), m("button", {
+          key: O,
+          type: "button",
+          class: re(["oo-dropdown-item", { "oo-dropdown-item--active": e.unionContext.currentIndex.value === O }]),
+          onClick: (x) => d(e.unionContext, O)
+        }, g(b.label), 11, So))), 128))
+      ])) : k("", !0)
+    ], 512));
+  }
+}), qo = {
+  key: 0,
+  class: "oo-field-header-row"
+}, Mo = { class: "oo-field-header-content" }, Uo = {
+  key: 0,
+  class: "oo-field-header-actions"
+}, jo = ["disabled", "aria-label"], No = { class: "oo-field-input-row" }, Ko = ["role"], ke = /* @__PURE__ */ A({
+  __name: "oo-field-shell",
+  props: {
+    onBlur: { type: Function },
+    error: {},
+    model: {},
+    value: {},
+    label: {},
+    description: {},
+    hint: {},
+    placeholder: {},
+    class: {},
+    style: {},
+    optional: { type: Boolean },
+    onToggleOptional: { type: Function },
+    required: { type: Boolean },
+    readonly: { type: Boolean },
+    type: {},
+    altAction: {},
+    name: {},
+    field: {},
+    options: {},
+    maxLength: {},
+    autocomplete: {},
+    title: {},
+    level: {},
+    onRemove: { type: Function },
+    canRemove: { type: Boolean },
+    removeLabel: {},
+    arrayIndex: {},
+    disabled: { type: Boolean },
+    hidden: { type: Boolean },
+    fieldClass: {},
+    idPrefix: {}
+  },
+  setup(e) {
+    const o = e, t = bo(), r = o.idPrefix ?? "oo-field", a = `${r}-${t}`, d = `${r}-${t}-err`, s = `${r}-${t}-desc`, v = f(() => o.model?.value !== void 0), b = Be(), O = b !== void 0 && b.variants.length > 1, x = f(() => to(o.label, o.arrayIndex));
+    return ($, F) => N((n(), m("div", {
+      class: re(["oo-default-field", [e.fieldClass, $.$props.class]])
+    }, [
+      x.value || e.onRemove || e.optional && v.value || l(O) || $.$slots.header ? (n(), m("div", qo, [
+        L("div", Mo, [
+          $.$slots.header ? W($.$slots, "header", {
+            key: 0,
+            inputId: a,
+            descId: s,
+            optionalEnabled: v.value
+          }) : (n(), m(T, { key: 1 }, [
+            x.value ? (n(), m("label", {
+              key: 0,
+              for: a
+            }, g(x.value), 1)) : k("", !0),
+            e.description ? (n(), m("span", {
+              key: 1,
+              id: s
+            }, g(e.description), 1)) : k("", !0)
+          ], 64)),
+          l(O) ? (n(), w(no, {
+            key: 2,
+            "union-context": l(b),
+            disabled: e.disabled
+          }, null, 8, ["union-context", "disabled"])) : k("", !0)
         ]),
-        A(s.$slots, "form.before", {
-          clearErrors: v.clearErrors,
-          reset: v.reset
-        }),
-        (r(!0), u(R, null, T(t.form.fields, (b) => {
-          var $;
-          return r(), N(se, B({
-            key: b.field
-          }, { ref_for: !0 }, b, {
-            error: ($ = a.errors) == null ? void 0 : $[b.field]
-          }), {
-            default: z((e) => [
-              A(s.$slots, `field:${e.type}`, B({ ref_for: !0 }, e), () => {
-                var L, j, w;
-                return [
-                  b.component && ((L = t.components) != null && L[b.component]) ? (r(), N(K(t.components[b.component]), B({
-                    key: 0,
-                    "on-blur": e.onBlur,
-                    error: e.error,
-                    model: e.model,
-                    "form-data": e.formData,
-                    "form-context": e.formContext,
-                    label: e.label,
-                    description: e.description,
-                    hint: e.hint,
-                    placeholder: e.placeholder,
-                    class: e.classes,
-                    style: e.styles,
-                    optional: e.optional,
-                    required: !e.required,
-                    disabled: e.disabled,
-                    hidden: e.hidden,
-                    type: e.type,
-                    "alt-action": e.altAction,
-                    name: e.vName,
-                    field: e,
-                    options: e.options,
-                    "max-length": e.maxLength,
-                    autocomplete: e.autocomplete,
-                    onAction: g
-                  }, { ref_for: !0 }, e.attrs, {
-                    modelValue: e.model.value,
-                    "onUpdate:modelValue": (c) => e.model.value = c
-                  }), null, 16, ["on-blur", "error", "model", "form-data", "form-context", "label", "description", "hint", "placeholder", "class", "style", "optional", "required", "disabled", "hidden", "type", "alt-action", "name", "field", "options", "max-length", "autocomplete", "modelValue", "onUpdate:modelValue"])) : b.component && !((j = t.components) != null && j[b.component]) ? (r(), u("div", ue, " [" + n(e.label) + '] Component "' + n(e.component) + '" not supplied ', 1)) : (w = t.types) != null && w[b.type] ? (r(), N(K(t.types[b.type]), B({
-                    key: 2,
-                    "on-blur": e.onBlur,
-                    error: e.error,
-                    model: e.model,
-                    "form-data": e.formData,
-                    "form-context": e.formContext,
-                    label: e.label,
-                    description: e.description,
-                    hint: e.hint,
-                    placeholder: e.placeholder,
-                    class: e.classes,
-                    style: e.styles,
-                    optional: e.optional,
-                    required: !e.required,
-                    disabled: e.disabled,
-                    hidden: e.hidden,
-                    type: e.type,
-                    "alt-action": e.altAction,
-                    name: e.vName,
-                    field: e,
-                    options: e.options,
-                    "max-length": e.maxLength,
-                    autocomplete: e.autocomplete,
-                    onAction: g
-                  }, { ref_for: !0 }, e.attrs, {
-                    modelValue: e.model.value,
-                    "onUpdate:modelValue": (c) => e.model.value = c
-                  }), null, 16, ["on-blur", "error", "model", "form-data", "form-context", "label", "description", "hint", "placeholder", "class", "style", "optional", "required", "disabled", "hidden", "type", "alt-action", "name", "field", "options", "max-length", "autocomplete", "modelValue", "onUpdate:modelValue"])) : ["text", "password", "number"].includes(e.type) ? D((r(), u("div", {
-                    key: 3,
-                    class: S(["oo-default-field", e.classes])
-                  }, [
-                    p("label", null, n(e.label), 1),
-                    e.description ? (r(), u("span", de, n(e.description), 1)) : U("", !0),
-                    D(p("input", B({
-                      "onUpdate:modelValue": (c) => e.model.value = c,
-                      onBlur: e.onBlur,
-                      placeholder: e.placeholder,
-                      autocomplete: e.autocomplete,
-                      name: e.vName,
-                      type: e.type,
-                      disabled: e.disabled,
-                      readonly: e.readonly
-                    }, { ref_for: !0 }, e.attrs), null, 16, ie), [
-                      [W, e.model.value]
-                    ]),
-                    p("div", me, n(e.error || e.hint), 1)
-                  ], 2)), [
-                    [O, !e.hidden]
-                  ]) : e.type === "paragraph" ? (r(), u("p", pe, n(e.value), 1)) : e.type === "select" ? D((r(), u("div", {
-                    key: 5,
-                    class: S(["oo-default-field", e.classes])
-                  }, [
-                    p("label", null, n(e.label), 1),
-                    e.description ? (r(), u("span", ye, n(e.description), 1)) : U("", !0),
-                    D(p("select", B({
-                      "onUpdate:modelValue": (c) => e.model.value = c,
-                      onBlur: e.onBlur,
-                      name: e.vName,
-                      disabled: e.disabled,
-                      readonly: e.readonly
-                    }, { ref_for: !0 }, e.attrs), [
-                      e.placeholder ? (r(), u("option", he, n(e.placeholder), 1)) : U("", !0),
-                      (r(!0), u(R, null, T(e.options, (c) => (r(), u("option", {
-                        key: m(c),
-                        value: m(c)
-                      }, n(f(c)), 9, be))), 128))
-                    ], 16, ve), [
-                      [X, e.model.value]
-                    ]),
-                    p("div", xe, n(e.error || e.hint), 1)
-                  ], 2)), [
-                    [O, !e.hidden]
-                  ]) : e.type === "radio" ? D((r(), u("div", {
-                    key: 6,
-                    class: S(["oo-default-field oo-radio-field", e.classes])
-                  }, [
-                    p("span", ke, n(e.label), 1),
-                    e.description ? (r(), u("span", Ce, n(e.description), 1)) : U("", !0),
-                    p("div", Ve, [
-                      (r(!0), u(R, null, T(e.options, (c) => (r(), u("label", {
-                        key: m(c)
-                      }, [
-                        D(p("input", B({
-                          type: "radio",
-                          value: m(c),
-                          "onUpdate:modelValue": (l) => e.model.value = l,
-                          onBlur: e.onBlur,
-                          name: e.vName,
-                          disabled: e.disabled,
-                          readonly: e.readonly
-                        }, { ref_for: !0 }, e.attrs), null, 16, _e), [
-                          [Y, e.model.value]
-                        ]),
-                        P(" " + n(f(c)), 1)
-                      ]))), 128))
-                    ]),
-                    p("div", ge, n(e.error || e.hint), 1)
-                  ], 2)), [
-                    [O, !e.hidden]
-                  ]) : e.type === "checkbox" ? D((r(), u("div", {
-                    key: 7,
-                    class: S(["oo-default-field oo-checkbox-field", e.classes])
-                  }, [
-                    p("label", null, [
-                      D(p("input", B({
-                        type: "checkbox",
-                        "onUpdate:modelValue": (c) => e.model.value = c,
-                        onBlur: e.onBlur,
-                        name: e.vName,
-                        disabled: e.disabled,
-                        readonly: e.readonly
-                      }, { ref_for: !0 }, e.attrs), null, 16, Be), [
-                        [Z, e.model.value]
-                      ]),
-                      P(" " + n(e.label), 1)
-                    ]),
-                    e.description ? (r(), u("span", De, n(e.description), 1)) : U("", !0),
-                    p("div", Fe, n(e.error || e.hint), 1)
-                  ], 2)), [
-                    [O, !e.hidden]
-                  ]) : e.type === "action" ? (r(), u("div", {
-                    key: 8,
-                    class: S(["oo-default-field oo-action-field", e.classes])
-                  }, [
-                    p("button", {
-                      type: "button",
-                      onClick: (c) => g(e.altAction)
-                    }, n(e.label), 9, Ae)
-                  ], 2)) : (r(), u("div", Ue, " [" + n(e.label) + '] Not supported field type "' + n(e.type) + '" ' + n(e.component), 1))
-                ];
-              })
-            ]),
-            _: 2
-          }, 1040, ["error"]);
-        }), 128)),
-        A(s.$slots, "form.after", {
-          clearErrors: v.clearErrors,
-          reset: v.reset,
-          disabled: _.value,
-          formContext: a.formContext
-        }),
-        A(s.$slots, "form.submit", {
-          disabled: _.value,
-          text: F.value,
-          clearErrors: v.clearErrors,
-          reset: v.reset,
-          formContext: a.formContext
-        }, () => [
-          p("button", { disabled: _.value }, n(F.value), 9, Ee)
+        e.optional && v.value || e.onRemove ? (n(), m("div", Uo, [
+          e.optional && v.value ? (n(), m("button", {
+            key: 0,
+            type: "button",
+            class: "oo-optional-clear",
+            onClick: F[0] || (F[0] = (h) => e.onToggleOptional?.(!1))
+          }, " × ")) : k("", !0),
+          e.onRemove ? (n(), m("button", {
+            key: 1,
+            type: "button",
+            class: "oo-field-remove-btn",
+            disabled: !e.canRemove,
+            "aria-label": e.removeLabel || "Remove item",
+            onClick: F[1] || (F[1] = //@ts-ignore
+            (...h) => e.onRemove && e.onRemove(...h))
+          }, g(e.removeLabel || "Remove"), 9, jo)) : k("", !0)
+        ])) : k("", !0)
+      ])) : k("", !0),
+      e.optional && !v.value ? (n(), w(ee, {
+        key: 1,
+        "on-edit": () => e.onToggleOptional?.(!0)
+      }, null, 8, ["on-edit"])) : (n(), m(T, { key: 2 }, [
+        L("div", No, [
+          W($.$slots, "default", {
+            inputId: a,
+            errorId: d,
+            descId: s
+          })
         ]),
-        A(s.$slots, "form.footer", {
-          disabled: _.value,
-          clearErrors: v.clearErrors,
-          reset: v.reset,
-          formContext: a.formContext
-        })
+        W($.$slots, "after-input", { descId: s }),
+        L("div", {
+          id: d,
+          class: "oo-error-slot",
+          role: e.error ? "alert" : void 0
+        }, g(e.error || e.hint), 9, Ko)
+      ], 64))
+    ], 2)), [
+      [Q, !e.hidden]
+    ]);
+  }
+}), zo = ["id", "placeholder", "autocomplete", "name", "type", "disabled", "readonly", "aria-required", "aria-invalid", "aria-describedby", "aria-label"], De = /* @__PURE__ */ A({
+  __name: "oo-input",
+  props: {
+    onBlur: { type: Function },
+    error: {},
+    model: {},
+    value: {},
+    label: {},
+    description: {},
+    hint: {},
+    placeholder: {},
+    class: {},
+    style: {},
+    optional: { type: Boolean },
+    onToggleOptional: { type: Function },
+    required: { type: Boolean },
+    readonly: { type: Boolean },
+    type: {},
+    altAction: {},
+    name: {},
+    field: {},
+    options: {},
+    maxLength: {},
+    autocomplete: {},
+    title: {},
+    level: {},
+    onRemove: { type: Function },
+    canRemove: { type: Boolean },
+    removeLabel: {},
+    arrayIndex: {},
+    disabled: { type: Boolean },
+    hidden: { type: Boolean }
+  },
+  setup(e) {
+    return (o, t) => (n(), w(ke, ae(o.$props, { "id-prefix": "oo-input" }), {
+      default: H(({ inputId: r, errorId: a, descId: d }) => [
+        N(L("input", {
+          id: r,
+          "onUpdate:modelValue": t[0] || (t[0] = (s) => e.model.value = s),
+          onBlur: t[1] || (t[1] = //@ts-ignore
+          (...s) => e.onBlur && e.onBlur(...s)),
+          placeholder: e.placeholder,
+          autocomplete: e.autocomplete,
+          name: e.name,
+          type: e.type,
+          disabled: e.disabled,
+          readonly: e.readonly,
+          "aria-required": e.required || void 0,
+          "aria-invalid": !!e.error || void 0,
+          "aria-describedby": e.error || e.hint ? a : e.description ? d : void 0,
+          "aria-label": e.label ? void 0 : e.name
+        }, null, 40, zo), [
+          [ho, e.model.value]
+        ])
       ]),
-      _: 3
-    }, 8, ["first-validation", "form-data", "form-context"]));
+      _: 1
+    }, 16));
+  }
+}), Wo = ["id", "name", "disabled", "readonly", "aria-required", "aria-invalid", "aria-describedby", "aria-label"], Xo = {
+  key: 0,
+  value: "",
+  disabled: ""
+}, Yo = ["value"], Go = /* @__PURE__ */ A({
+  __name: "oo-select",
+  props: {
+    onBlur: { type: Function },
+    error: {},
+    model: {},
+    value: {},
+    label: {},
+    description: {},
+    hint: {},
+    placeholder: {},
+    class: {},
+    style: {},
+    optional: { type: Boolean },
+    onToggleOptional: { type: Function },
+    required: { type: Boolean },
+    readonly: { type: Boolean },
+    type: {},
+    altAction: {},
+    name: {},
+    field: {},
+    options: {},
+    maxLength: {},
+    autocomplete: {},
+    title: {},
+    level: {},
+    onRemove: { type: Function },
+    canRemove: { type: Boolean },
+    removeLabel: {},
+    arrayIndex: {},
+    disabled: { type: Boolean },
+    hidden: { type: Boolean }
+  },
+  setup(e) {
+    return (o, t) => (n(), w(ke, ae(o.$props, { "id-prefix": "oo-select" }), {
+      default: H(({ inputId: r, errorId: a, descId: d }) => [
+        N(L("select", {
+          id: r,
+          "onUpdate:modelValue": t[0] || (t[0] = (s) => e.model.value = s),
+          onChange: t[1] || (t[1] = //@ts-ignore
+          (...s) => e.onBlur && e.onBlur(...s)),
+          onBlur: t[2] || (t[2] = //@ts-ignore
+          (...s) => e.onBlur && e.onBlur(...s)),
+          name: e.name,
+          disabled: e.disabled,
+          readonly: e.readonly,
+          "aria-required": e.required || void 0,
+          "aria-invalid": !!e.error || void 0,
+          "aria-describedby": e.error || e.hint ? a : e.description ? d : void 0,
+          "aria-label": e.label ? void 0 : e.name
+        }, [
+          e.placeholder ? (n(), m("option", Xo, g(e.placeholder), 1)) : k("", !0),
+          (n(!0), m(T, null, X(e.options, (s) => (n(), m("option", {
+            key: l(ge)(s),
+            value: l(ge)(s)
+          }, g(l(oo)(s)), 9, Yo))), 128))
+        ], 40, Wo), [
+          [po, e.model.value]
+        ])
+      ]),
+      _: 1
+    }, 16));
+  }
+}), Ho = ["id"], Jo = ["id"], Qo = ["aria-labelledby", "aria-required", "aria-invalid", "aria-describedby"], Zo = ["value", "name", "disabled", "readonly"], _o = /* @__PURE__ */ A({
+  __name: "oo-radio",
+  props: {
+    onBlur: { type: Function },
+    error: {},
+    model: {},
+    value: {},
+    label: {},
+    description: {},
+    hint: {},
+    placeholder: {},
+    class: {},
+    style: {},
+    optional: { type: Boolean },
+    onToggleOptional: { type: Function },
+    required: { type: Boolean },
+    readonly: { type: Boolean },
+    type: {},
+    altAction: {},
+    name: {},
+    field: {},
+    options: {},
+    maxLength: {},
+    autocomplete: {},
+    title: {},
+    level: {},
+    onRemove: { type: Function },
+    canRemove: { type: Boolean },
+    removeLabel: {},
+    arrayIndex: {},
+    disabled: { type: Boolean },
+    hidden: { type: Boolean }
+  },
+  setup(e) {
+    return (o, t) => (n(), w(ke, ae(o.$props, {
+      "field-class": "oo-radio-field",
+      "id-prefix": "oo-radio"
+    }), {
+      header: H(({ inputId: r, descId: a }) => [
+        L("span", {
+          id: r,
+          class: "oo-field-label"
+        }, g(e.label), 9, Ho),
+        e.description ? (n(), m("span", {
+          key: 0,
+          id: a
+        }, g(e.description), 9, Jo)) : k("", !0)
+      ]),
+      default: H(({ inputId: r, errorId: a, descId: d }) => [
+        L("div", {
+          class: "oo-radio-group",
+          role: "radiogroup",
+          "aria-labelledby": r,
+          "aria-required": e.required || void 0,
+          "aria-invalid": !!e.error || void 0,
+          "aria-describedby": e.error || e.hint ? a : e.description ? d : void 0
+        }, [
+          (n(!0), m(T, null, X(e.options, (s) => (n(), m("label", {
+            key: l(ge)(s)
+          }, [
+            N(L("input", {
+              type: "radio",
+              value: l(ge)(s),
+              "onUpdate:modelValue": t[0] || (t[0] = (v) => e.model.value = v),
+              onChange: t[1] || (t[1] = //@ts-ignore
+              (...v) => e.onBlur && e.onBlur(...v)),
+              onBlur: t[2] || (t[2] = //@ts-ignore
+              (...v) => e.onBlur && e.onBlur(...v)),
+              name: e.name,
+              disabled: e.disabled,
+              readonly: e.readonly
+            }, null, 40, Zo), [
+              [go, e.model.value]
+            ]),
+            _e(" " + g(l(oo)(s)), 1)
+          ]))), 128))
+        ], 8, Qo)
+      ]),
+      _: 1
+    }, 16));
+  }
+}), et = {
+  key: 0,
+  class: "oo-field-label"
+}, ot = ["for"], tt = ["id", "checked", "name", "disabled", "readonly", "aria-invalid", "aria-describedby"], nt = ["id"], lt = /* @__PURE__ */ A({
+  __name: "oo-checkbox",
+  props: {
+    onBlur: { type: Function },
+    error: {},
+    model: {},
+    value: {},
+    label: {},
+    description: {},
+    hint: {},
+    placeholder: {},
+    class: {},
+    style: {},
+    optional: { type: Boolean },
+    onToggleOptional: { type: Function },
+    required: { type: Boolean },
+    readonly: { type: Boolean },
+    type: {},
+    altAction: {},
+    name: {},
+    field: {},
+    options: {},
+    maxLength: {},
+    autocomplete: {},
+    title: {},
+    level: {},
+    onRemove: { type: Function },
+    canRemove: { type: Boolean },
+    removeLabel: {},
+    arrayIndex: {},
+    disabled: { type: Boolean },
+    hidden: { type: Boolean }
+  },
+  setup(e) {
+    return (o, t) => (n(), w(ke, ae(o.$props, {
+      "field-class": "oo-checkbox-field",
+      "id-prefix": "oo-checkbox"
+    }), {
+      header: H(({ optionalEnabled: r }) => [
+        e.optional && !r ? (n(), m("span", et, g(e.label), 1)) : k("", !0)
+      ]),
+      default: H(({ inputId: r, errorId: a, descId: d }) => [
+        L("label", { for: r }, [
+          L("input", {
+            id: r,
+            type: "checkbox",
+            checked: !!e.model.value,
+            onChange: t[0] || (t[0] = (s) => {
+              e.model.value = s.target.checked, e.onBlur();
+            }),
+            onBlur: t[1] || (t[1] = //@ts-ignore
+            (...s) => e.onBlur && e.onBlur(...s)),
+            name: e.name,
+            disabled: e.disabled,
+            readonly: e.readonly,
+            "aria-invalid": !!e.error || void 0,
+            "aria-describedby": e.error || e.hint ? a : e.description ? d : void 0
+          }, null, 40, tt),
+          _e(" " + g(e.label), 1)
+        ], 8, ot)
+      ]),
+      "after-input": H(({ descId: r }) => [
+        e.description ? (n(), m("span", {
+          key: 0,
+          id: r
+        }, g(e.description), 9, nt)) : k("", !0)
+      ]),
+      _: 1
+    }, 16));
+  }
+}), at = /* @__PURE__ */ A({
+  __name: "oo-paragraph",
+  props: {
+    onBlur: { type: Function },
+    error: {},
+    model: {},
+    value: {},
+    label: {},
+    description: {},
+    hint: {},
+    placeholder: {},
+    class: {},
+    style: {},
+    optional: { type: Boolean },
+    onToggleOptional: { type: Function },
+    required: { type: Boolean },
+    readonly: { type: Boolean },
+    type: {},
+    altAction: {},
+    name: {},
+    field: {},
+    options: {},
+    maxLength: {},
+    autocomplete: {},
+    title: {},
+    level: {},
+    onRemove: { type: Function },
+    canRemove: { type: Boolean },
+    removeLabel: {},
+    arrayIndex: {},
+    disabled: { type: Boolean },
+    hidden: { type: Boolean }
+  },
+  setup(e) {
+    return (o, t) => N((n(), m("p", { "aria-live": "polite" }, g(e.value), 513)), [
+      [Q, !e.hidden]
+    ]);
+  }
+}), it = /* @__PURE__ */ A({
+  __name: "oo-action",
+  props: {
+    onBlur: { type: Function },
+    error: {},
+    model: {},
+    value: {},
+    label: {},
+    description: {},
+    hint: {},
+    placeholder: {},
+    class: {},
+    style: {},
+    optional: { type: Boolean },
+    onToggleOptional: { type: Function },
+    required: { type: Boolean },
+    readonly: { type: Boolean },
+    type: {},
+    altAction: {},
+    name: {},
+    field: {},
+    options: {},
+    maxLength: {},
+    autocomplete: {},
+    title: {},
+    level: {},
+    onRemove: { type: Function },
+    canRemove: { type: Boolean },
+    removeLabel: {},
+    arrayIndex: {},
+    disabled: { type: Boolean },
+    hidden: { type: Boolean }
+  },
+  emits: ["action"],
+  setup(e, { emit: o }) {
+    const t = o;
+    return (r, a) => N((n(), m("div", {
+      class: re(["oo-default-field oo-action-field", r.$props.class])
+    }, [
+      L("button", {
+        type: "button",
+        onClick: a[0] || (a[0] = (d) => e.altAction && t("action", e.altAction.id))
+      }, g(e.altAction?.label), 1)
+    ], 2)), [
+      [Q, !e.hidden]
+    ]);
+  }
+}), rt = {
+  key: 0,
+  class: "oo-structured-header"
+}, dt = { class: "oo-structured-header-content" }, st = {
+  key: 0,
+  class: "oo-structured-title oo-form-title"
+}, ut = {
+  key: 1,
+  class: "oo-structured-title"
+}, ct = ["disabled", "aria-label"], ze = /* @__PURE__ */ A({
+  __name: "oo-structured-header",
+  props: {
+    title: {},
+    level: {},
+    onRemove: { type: Function },
+    canRemove: { type: Boolean },
+    removeLabel: {},
+    optional: { type: Boolean },
+    optionalEnabled: { type: Boolean },
+    onToggleOptional: { type: Function },
+    disabled: { type: Boolean },
+    unionContext: {}
+  },
+  setup(e) {
+    const o = e, t = o.unionContext !== void 0 && o.unionContext.variants.length > 1;
+    return (r, a) => e.title || e.onRemove || e.optional || l(t) ? (n(), m("div", rt, [
+      L("div", dt, [
+        e.title && e.level === 0 ? (n(), m("h2", st, g(e.title), 1)) : e.title ? (n(), m("h3", ut, g(e.title), 1)) : k("", !0),
+        l(t) ? (n(), w(no, {
+          key: 2,
+          "union-context": e.unionContext,
+          disabled: e.disabled
+        }, null, 8, ["union-context", "disabled"])) : k("", !0)
+      ]),
+      e.optional && e.optionalEnabled ? (n(), m("button", {
+        key: 0,
+        type: "button",
+        class: "oo-optional-clear",
+        onClick: a[0] || (a[0] = (d) => e.onToggleOptional?.(!1))
+      }, " × ")) : k("", !0),
+      e.onRemove ? (n(), m("button", {
+        key: 1,
+        type: "button",
+        class: "oo-structured-remove-btn",
+        disabled: !e.canRemove,
+        "aria-label": e.removeLabel || "Remove item",
+        onClick: a[1] || (a[1] = //@ts-ignore
+        (...d) => e.onRemove && e.onRemove(...d))
+      }, g(e.removeLabel || "Remove"), 9, ct)) : k("", !0)
+    ])) : k("", !0);
+  }
+}), mt = {
+  key: 0,
+  class: "oo-object-error",
+  role: "alert"
+}, vt = /* @__PURE__ */ A({
+  __name: "oo-object",
+  props: {
+    onBlur: { type: Function },
+    error: {},
+    model: {},
+    value: {},
+    label: {},
+    description: {},
+    hint: {},
+    placeholder: {},
+    class: {},
+    style: {},
+    optional: { type: Boolean },
+    onToggleOptional: { type: Function },
+    required: { type: Boolean },
+    readonly: { type: Boolean },
+    type: {},
+    altAction: {},
+    name: {},
+    field: {},
+    options: {},
+    maxLength: {},
+    autocomplete: {},
+    title: {},
+    level: {},
+    onRemove: { type: Function },
+    canRemove: { type: Boolean },
+    removeLabel: {},
+    arrayIndex: {},
+    disabled: { type: Boolean },
+    hidden: { type: Boolean }
+  },
+  setup(e) {
+    const o = e, t = Se(o.field) ? o.field.objectDef : void 0, r = Be(), a = f(() => to(o.title, o.arrayIndex)), d = f(() => o.model?.value !== void 0);
+    return (s, v) => N((n(), m("div", {
+      class: re(["oo-object", { "oo-object--root": e.level === 0, "oo-object--nested": (e.level ?? 0) > 0 }])
+    }, [
+      ie(ze, {
+        title: a.value,
+        level: e.level,
+        "on-remove": e.onRemove && l(t) ? e.onRemove : void 0,
+        "can-remove": e.canRemove,
+        "remove-label": e.removeLabel,
+        optional: e.optional,
+        "optional-enabled": d.value,
+        "on-toggle-optional": e.onToggleOptional,
+        disabled: e.disabled,
+        "union-context": l(r)
+      }, null, 8, ["title", "level", "on-remove", "can-remove", "remove-label", "optional", "optional-enabled", "on-toggle-optional", "disabled", "union-context"]),
+      e.optional && !d.value ? (n(), w(ee, {
+        key: 0,
+        "on-edit": () => e.onToggleOptional?.(!0)
+      }, null, 8, ["on-edit"])) : (n(), m(T, { key: 1 }, [
+        e.error ? (n(), m("div", mt, g(e.error), 1)) : k("", !0),
+        l(t) ? (n(), w(Po, {
+          key: 1,
+          def: l(t)
+        }, null, 8, ["def"])) : k("", !0)
+      ], 64))
+    ], 2)), [
+      [Q, !e.hidden]
+    ]);
+  }
+});
+function ft(e, o) {
+  const { rootFormData: t, formContext: r, pathPrefix: a, getByPath: d, setByPath: s } = Ne("useFoormArray"), v = I(
+    "__foorm_change_handler",
+    () => {
+    }
+  ), b = f(() => {
+    const C = d(a.value);
+    return Array.isArray(C) ? C : [];
+  });
+  let O = 0;
+  const x = eo([]);
+  function $() {
+    return `oo-item-${O++}`;
+  }
+  function F() {
+    for (; x.length < b.value.length; )
+      x.push($());
+    const C = b.value.length;
+    if (x.length > C) {
+      for (const V of B.keys())
+        V >= C && B.delete(V);
+      for (; x.length > C; )
+        x.pop();
+    }
+  }
+  F(), Ue(
+    () => b.value.length,
+    () => F()
+  );
+  const h = je(e.itemField), p = h ? e.itemField.unionVariants : [], B = /* @__PURE__ */ new Map();
+  function E(C) {
+    let V = B.get(C);
+    return V || (V = { ...e.itemField, path: String(C), name: "" }, B.set(C, V)), V;
+  }
+  const j = y(e.prop, "expect.minLength"), M = y(e.prop, "expect.maxLength"), u = j?.length ?? 0, R = M?.length ?? 1 / 0, P = f(() => !o?.value && b.value.length < R), i = f(() => !o?.value && b.value.length > u);
+  function D() {
+    let C = d(a.value);
+    return Array.isArray(C) || (C = [], s(a.value, C)), C;
+  }
+  function se(C = 0) {
+    if (!P.value) return;
+    const V = xe(
+      t().value,
+      r.value
+    );
+    let G;
+    if (h) {
+      const ue = p[C];
+      if (!ue) return;
+      G = le(ue.type, V).value;
+    } else
+      G = le(e.itemType, V).value;
+    D().push(G), x.push($()), v("array-add", a.value, b.value);
+  }
+  function Y(C) {
+    if (i.value) {
+      D().splice(C, 1), x.splice(C, 1);
+      for (const V of B.keys())
+        V >= C && B.delete(V);
+      v("array-remove", a.value, b.value);
+    }
+  }
+  const oe = y(e.prop, "foorm.array.add.label") ?? "Add item", $e = y(e.prop, "foorm.array.remove.label") ?? "Remove";
+  return {
+    arrayValue: b,
+    itemKeys: x,
+    isUnion: h,
+    unionVariants: p,
+    getItemField: E,
+    addItem: se,
+    removeItem: Y,
+    canAdd: P,
+    canRemove: i,
+    addLabel: oe,
+    removeLabel: $e
+  };
+}
+const yt = { class: "oo-array-add" }, bt = ["disabled"], ht = ["disabled"], pt = {
+  key: 0,
+  class: "oo-dropdown-menu"
+}, gt = ["onClick"], xt = {
+  key: 0,
+  class: "oo-array-error",
+  role: "alert"
+}, Bt = /* @__PURE__ */ A({
+  __name: "oo-array",
+  props: {
+    onBlur: { type: Function },
+    error: {},
+    model: {},
+    value: {},
+    label: {},
+    description: {},
+    hint: {},
+    placeholder: {},
+    class: {},
+    style: {},
+    optional: { type: Boolean },
+    onToggleOptional: { type: Function },
+    required: { type: Boolean },
+    readonly: { type: Boolean },
+    type: {},
+    altAction: {},
+    name: {},
+    field: {},
+    options: {},
+    maxLength: {},
+    autocomplete: {},
+    title: {},
+    level: {},
+    onRemove: { type: Function },
+    canRemove: { type: Boolean },
+    removeLabel: {},
+    arrayIndex: {},
+    disabled: { type: Boolean },
+    hidden: { type: Boolean }
+  },
+  setup(e) {
+    const o = e, t = qe(o.field) ? o.field : void 0, r = Be(), a = f(() => Array.isArray(o.model?.value)), {
+      arrayValue: d,
+      itemKeys: s,
+      getItemField: v,
+      isUnion: b,
+      unionVariants: O,
+      addItem: x,
+      removeItem: $,
+      canAdd: F,
+      canRemove: h,
+      addLabel: p,
+      removeLabel: B
+    } = ft(
+      t,
+      f(() => o.disabled ?? !1)
+    ), E = J(null), { isOpen: j, toggle: M, select: u } = Ke(E);
+    return (R, P) => N((n(), m("div", {
+      class: re(["oo-array", { "oo-array--root": e.level === 0, "oo-array--nested": (e.level ?? 0) > 0 }])
+    }, [
+      ie(ze, {
+        title: e.title,
+        level: e.level,
+        "on-remove": e.onRemove,
+        "can-remove": o.canRemove,
+        "remove-label": o.removeLabel,
+        optional: e.optional,
+        "optional-enabled": a.value,
+        "on-toggle-optional": e.onToggleOptional,
+        disabled: e.disabled,
+        "union-context": l(r)
+      }, null, 8, ["title", "level", "on-remove", "can-remove", "remove-label", "optional", "optional-enabled", "on-toggle-optional", "disabled", "union-context"]),
+      e.optional && !a.value ? (n(), w(ee, {
+        key: 0,
+        "on-edit": () => e.onToggleOptional?.(!0)
+      }, null, 8, ["on-edit"])) : (n(), m(T, { key: 1 }, [
+        (n(!0), m(T, null, X(l(d), (i, D) => (n(), w(de, {
+          key: l(s)[D],
+          field: l(v)(D),
+          "on-remove": () => l($)(D),
+          "can-remove": l(h),
+          "remove-label": l(B),
+          "array-index": D
+        }, null, 8, ["field", "on-remove", "can-remove", "remove-label", "array-index"]))), 128)),
+        L("div", yt, [
+          l(b) ? (n(), m("div", {
+            key: 1,
+            ref_key: "addDropdownRef",
+            ref: E,
+            class: "oo-dropdown"
+          }, [
+            L("button", {
+              type: "button",
+              class: "oo-array-add-btn",
+              disabled: !l(F),
+              onClick: P[1] || (P[1] = //@ts-ignore
+              (...i) => l(M) && l(M)(...i))
+            }, g(l(p)) + " ▾ ", 9, ht),
+            l(j) ? (n(), m("div", pt, [
+              (n(!0), m(T, null, X(l(O), (i, D) => (n(), m("button", {
+                key: D,
+                type: "button",
+                class: "oo-dropdown-item",
+                onClick: (se) => l(u)(() => l(x)(D))
+              }, g(i.label), 9, gt))), 128))
+            ])) : k("", !0)
+          ], 512)) : (n(), m("button", {
+            key: 0,
+            type: "button",
+            class: "oo-array-add-btn",
+            disabled: !l(F),
+            onClick: P[0] || (P[0] = (i) => l(x)(0))
+          }, g(l(p)), 9, bt))
+        ]),
+        e.error ? (n(), m("div", xt, g(e.error), 1)) : k("", !0)
+      ], 64))
+    ], 2)), [
+      [Q, !e.hidden]
+    ]);
+  }
+});
+function kt(e) {
+  const o = I(
+    "__foorm_path_prefix",
+    f(() => "")
+  ), { rootFormData: t, formContext: r } = Ne("useFoormUnion"), a = I(
+    "__foorm_change_handler",
+    () => {
+    }
+  ), d = f(
+    () => e.field && je(e.field) ? e.field : void 0
+  ), s = f(
+    () => d.value !== void 0 && d.value.unionVariants.length > 1
+  ), v = J(
+    d.value ? Oo(e.model?.value, d.value.unionVariants) : 0
+  ), b = f(() => {
+    const u = d.value?.unionVariants;
+    if (u)
+      return u[v.value] ?? u[0];
+  });
+  function O() {
+    const u = b.value;
+    if (!u) return;
+    const R = d.value?.name ?? "";
+    if (u.def)
+      return { ...u.def.rootField, path: "", name: R };
+    if (u.itemField)
+      return { ...u.itemField, path: "" };
+  }
+  const x = f(O), $ = /* @__PURE__ */ new Map();
+  function F(u) {
+    $.set(v.value, e.model?.value), v.value = u;
+    const R = d.value?.unionVariants[u];
+    if (R && e.model) {
+      const P = $.get(u);
+      e.model.value = P !== void 0 ? P : le(
+        R.type,
+        xe(
+          t().value,
+          r.value
+        )
+      ).value;
+    }
+    a("union-switch", o.value, e.model?.value);
+  }
+  const h = f(() => e.model?.value !== void 0);
+  d.value && q("__foorm_union", {
+    variants: d.value.unionVariants,
+    currentIndex: v,
+    changeVariant: F
+  });
+  const p = J(null), { isOpen: B, toggle: E, select: j } = Ke(p);
+  function M() {
+    s.value ? E() : e.onToggleOptional?.(!0);
+  }
+  return {
+    unionField: d,
+    hasMultipleVariants: s,
+    localUnionIndex: v,
+    currentVariant: b,
+    innerField: x,
+    changeVariant: F,
+    optionalEnabled: h,
+    dropdownRef: p,
+    isOpen: B,
+    toggle: E,
+    select: j,
+    handleNaClick: M
+  };
+}
+const $t = { class: "oo-union" }, Ft = {
+  key: 0,
+  class: "oo-dropdown-menu"
+}, Ct = ["onClick"], Rt = /* @__PURE__ */ A({
+  __name: "oo-union",
+  props: {
+    onBlur: { type: Function },
+    error: {},
+    model: {},
+    value: {},
+    label: {},
+    description: {},
+    hint: {},
+    placeholder: {},
+    class: {},
+    style: {},
+    optional: { type: Boolean },
+    onToggleOptional: { type: Function },
+    required: { type: Boolean },
+    readonly: { type: Boolean },
+    type: {},
+    altAction: {},
+    name: {},
+    field: {},
+    options: {},
+    maxLength: {},
+    autocomplete: {},
+    title: {},
+    level: {},
+    onRemove: { type: Function },
+    canRemove: { type: Boolean },
+    removeLabel: {},
+    arrayIndex: {},
+    disabled: { type: Boolean },
+    hidden: { type: Boolean }
+  },
+  setup(e) {
+    const o = e, {
+      unionField: t,
+      hasMultipleVariants: r,
+      localUnionIndex: a,
+      innerField: d,
+      changeVariant: s,
+      optionalEnabled: v,
+      dropdownRef: b,
+      isOpen: O,
+      toggle: x,
+      select: $,
+      handleNaClick: F
+    } = kt(o);
+    return (h, p) => N((n(), m("div", $t, [
+      e.optional && !l(v) ? (n(), m(T, { key: 0 }, [
+        l(r) ? (n(), m("div", {
+          key: 0,
+          ref_key: "dropdownRef",
+          ref: b,
+          class: "oo-dropdown-anchor"
+        }, [
+          ie(ee, { "on-edit": l(F) }, null, 8, ["on-edit"]),
+          l(O) ? (n(), m("div", Ft, [
+            (n(!0), m(T, null, X(l(t).unionVariants, (B, E) => (n(), m("button", {
+              key: E,
+              type: "button",
+              class: "oo-dropdown-item",
+              onClick: (j) => l($)(() => {
+                l(s)(E), e.onToggleOptional?.(!0);
+              })
+            }, g(B.label), 9, Ct))), 128))
+          ])) : k("", !0)
+        ], 512)) : (n(), w(ee, {
+          key: 1,
+          "on-edit": () => e.onToggleOptional?.(!0)
+        }, null, 8, ["on-edit"]))
+      ], 64)) : (n(), m(T, { key: 1 }, [
+        e.optional ? (n(), m("button", {
+          key: 0,
+          type: "button",
+          class: "oo-optional-clear",
+          onClick: p[0] || (p[0] = (B) => e.onToggleOptional?.(!1))
+        }, " × ")) : k("", !0),
+        l(d) ? (n(), w(de, {
+          key: l(a),
+          field: l(d),
+          "array-index": e.arrayIndex,
+          "on-remove": e.onRemove,
+          "can-remove": e.canRemove,
+          "remove-label": e.removeLabel
+        }, null, 8, ["field", "array-index", "on-remove", "can-remove", "remove-label"])) : k("", !0)
+      ], 64))
+    ], 512)), [
+      [Q, !e.hidden]
+    ]);
+  }
+}), Lt = { class: "oo-tuple" }, Ot = {
+  key: 1,
+  class: "oo-tuple-error",
+  role: "alert"
+}, Vt = /* @__PURE__ */ A({
+  __name: "oo-tuple",
+  props: {
+    onBlur: { type: Function },
+    error: {},
+    model: {},
+    value: {},
+    label: {},
+    description: {},
+    hint: {},
+    placeholder: {},
+    class: {},
+    style: {},
+    optional: { type: Boolean },
+    onToggleOptional: { type: Function },
+    required: { type: Boolean },
+    readonly: { type: Boolean },
+    type: {},
+    altAction: {},
+    name: {},
+    field: {},
+    options: {},
+    maxLength: {},
+    autocomplete: {},
+    title: {},
+    level: {},
+    onRemove: { type: Function },
+    canRemove: { type: Boolean },
+    removeLabel: {},
+    arrayIndex: {},
+    disabled: { type: Boolean },
+    hidden: { type: Boolean }
+  },
+  setup(e) {
+    const o = e, t = Me(o.field) ? o.field : void 0, r = Be(), a = f(() => o.model?.value !== void 0);
+    return (d, s) => N((n(), m("div", Lt, [
+      ie(ze, {
+        title: e.title,
+        level: e.level,
+        "on-remove": e.onRemove,
+        "can-remove": e.canRemove,
+        "remove-label": e.removeLabel,
+        optional: e.optional,
+        "optional-enabled": a.value,
+        "on-toggle-optional": e.onToggleOptional,
+        disabled: e.disabled,
+        "union-context": l(r)
+      }, null, 8, ["title", "level", "on-remove", "can-remove", "remove-label", "optional", "optional-enabled", "on-toggle-optional", "disabled", "union-context"]),
+      e.optional && !a.value ? (n(), w(ee, {
+        key: 0,
+        "on-edit": () => e.onToggleOptional?.(!0)
+      }, null, 8, ["on-edit"])) : (n(), m(T, { key: 1 }, [
+        l(t) ? (n(!0), m(T, { key: 0 }, X(l(t).itemFields, (v, b) => (n(), w(de, {
+          key: b,
+          field: v
+        }, null, 8, ["field"]))), 128)) : k("", !0),
+        e.error ? (n(), m("div", Ot, g(e.error), 1)) : k("", !0)
+      ], 64))
+    ], 512)), [
+      [Q, !e.hidden]
+    ]);
   }
 });
-function Le(a) {
-  const o = re(a), t = ee(te(o.fields));
-  return { form: o, formData: t };
+function qt(e, o) {
+  const t = Vo(e), r = o ? xe({}, o) : void 0, a = eo(le(e, r));
+  return { def: t, formData: a };
+}
+function Mt() {
+  return {
+    text: De,
+    password: De,
+    number: De,
+    select: Go,
+    radio: _o,
+    checkbox: lt,
+    paragraph: at,
+    action: it,
+    object: vt,
+    array: Bt,
+    union: Rt,
+    tuple: Vt
+  };
 }
 export {
-  se as OoField,
-  $e as OoForm,
-  Le as useFoorm
+  it as OoAction,
+  Bt as OoArray,
+  lt as OoCheckbox,
+  de as OoField,
+  St as OoForm,
+  De as OoInput,
+  Po as OoIterator,
+  vt as OoObject,
+  at as OoParagraph,
+  _o as OoRadio,
+  Go as OoSelect,
+  Vt as OoTuple,
+  Rt as OoUnion,
+  Mt as createDefaultTypes,
+  to as formatIndexedLabel,
+  Be as useConsumeUnionContext,
+  qt as useFoorm,
+  ft as useFoormArray,
+  kt as useFoormUnion
 };