vue-formless 0.0.1 → 0.1.0

package/dist/index.js

@@ -1 +1,960 @@
-
+import { inject as j, nextTick as We, onMounted as he, toValue as v, watch as ve, onBeforeUnmount as be, ref as q, computed as x, defineComponent as I, createVNode as R, Fragment as Ie, provide as H, mergeProps as Ue, markRaw as O, h as y, getCurrentInstance as Ge, reactive as Ye } from "vue";
+const Z = Symbol("vue-formless.formContext");
+function se() {
+  const e = j(Z, null);
+  if (!e)
+    throw new Error("[vue-formless] useFormContext() must be used inside <FormView>.");
+  return e;
+}
+function ue(e) {
+  if (!e) return [];
+  const t = [];
+  let o = 0;
+  for (; o < e.length; ) {
+    if (e[o] === ".") {
+      o++;
+      continue;
+    }
+    if (e[o] === "[") {
+      const n = e.indexOf("]", o + 1);
+      if (n === -1)
+        throw new Error(`Invalid path "${e}": unclosed bracket`);
+      const r = e.slice(o + 1, n), l = Number(r);
+      if (!Number.isInteger(l) || String(l) !== r || l < 0)
+        throw new Error(`Invalid path "${e}": index must be a non-negative integer`);
+      t.push({ type: "index", index: l }), o = n + 1;
+    } else {
+      const n = /^[a-zA-Z_$][a-zA-Z0-9_$]*/.exec(e.slice(o));
+      if (!n)
+        throw new Error(`Invalid path "${e}" at position ${o}`);
+      t.push({ type: "key", key: n[0] }), o += n[0].length;
+    }
+  }
+  return t;
+}
+function ze(e, t) {
+  let o = e;
+  for (const n of t)
+    n.type === "key" ? o = o[n.key] : o = o[n.index];
+  return o;
+}
+function He(e, t) {
+  if (t.type === "key")
+    return e == null || typeof e != "object" || Array.isArray(e) ? void 0 : e[t.key];
+  if (Array.isArray(e))
+    return e[t.index];
+}
+function B(e, t) {
+  const o = ue(t);
+  if (o.length === 0) return;
+  const n = o[o.length - 1], r = ze(e, o.slice(0, -1));
+  return He(r, n);
+}
+function oe(e, t, o, n) {
+  const r = t[o], l = o === t.length - 1;
+  if (r.type === "key") {
+    if (Array.isArray(e))
+      throw new Error(`Cannot set "${r.key}" on an array node`);
+    const u = e != null && typeof e == "object" ? e : {};
+    return l ? { ...u, [r.key]: n } : {
+      ...u,
+      [r.key]: oe(u[r.key], t, o + 1, n)
+    };
+  }
+  const s = Array.isArray(e) ? [...e] : [];
+  return l ? (s[r.index] = n, s) : (s[r.index] = oe(s[r.index], t, o + 1, n), s);
+}
+function De(e, t, o) {
+  const n = ue(t);
+  if (n.length === 0)
+    throw new Error("Cannot set an empty prop");
+  return oe(e, n, 0, o);
+}
+function Ke(e) {
+  return ue(e).map((t) => t.type === "key" ? t.key : String(t.index)).join(".");
+}
+function Xe(e, t) {
+  let o = null;
+  function n(r, l) {
+    o || (o = [], We(() => {
+      if (!o?.length) {
+        o = null;
+        return;
+      }
+      let s = e();
+      for (const u of o)
+        s = De(s, u.prop, u.value);
+      o = null, t(s);
+    })), o.push({ prop: r, value: l });
+  }
+  return { update: n };
+}
+const d = 24, P = {
+  column: 1
+};
+function qe(e) {
+  const t = Math.floor(Number(e));
+  return t === 1 / 0 ? d : Number.isFinite(t) ? Math.min(d, Math.max(1, t)) : P.column;
+}
+function Ze(...e) {
+  return qe(e.find((t) => t != null) ?? P.column);
+}
+function Je(e, t) {
+  const o = t > 0 ? t : P.column, n = Math.max(1, Math.floor(d / o));
+  if (e == null || e === "") return n;
+  if (typeof e == "number")
+    return me(e), e;
+  const r = e.trim();
+  if (r === "max") return d;
+  const l = /^(\d+)x$/.exec(r);
+  if (l) {
+    const s = Number(l[1]);
+    if (s < 1)
+      throw new Error(`[vue-formless] col:span "${e}" is invalid`);
+    return Math.min(d, s * n);
+  }
+  if (/^\d+$/.test(r)) {
+    const s = Number(r);
+    return me(s), s;
+  }
+  throw new Error(`[vue-formless] col:span "${e}" is invalid`);
+}
+function me(e) {
+  if (!Number.isInteger(e) || e < 1 || e > d)
+    throw new Error(`[vue-formless] col:span ${e} must be an integer 1–${d}`);
+}
+function Qe(e) {
+  if (e == null || e === "" || e === "auto") return "auto";
+  if (e === "start" || e === "end") return e;
+  throw new Error(`[vue-formless] col:place "${String(e)}" is invalid`);
+}
+const D = Symbol(
+  "vue-formless:layout-view"
+);
+function et(e, t, o = { childList: !0 }) {
+  if (typeof MutationObserver > "u") return;
+  let n = null;
+  function r(s) {
+    n?.disconnect(), n = null, s && (n = new MutationObserver(t), n.observe(s, o));
+  }
+  he(() => r(v(e)));
+  const l = ve(() => v(e), r, { flush: "post" });
+  be(() => {
+    l(), n?.disconnect(), n = null;
+  });
+}
+function tt(e, t = 0) {
+  const o = q([]);
+  function n() {
+    const r = v(e);
+    o.value = r ? Array.from(r.children) : [];
+  }
+  return ve(() => [v(e), v(t)], n, { immediate: !0 }), et(e, n), o;
+}
+function nt(e, t, o) {
+  const n = [];
+  if (o === "auto")
+    return e.n + t > d && (e.n = 0), n;
+  if (o === "start")
+    return e.n > 0 && (n.push(d - e.n), e.n = 0), n;
+  e.n + t > d && e.n > 0 && (n.push(d - e.n), e.n = 0);
+  const r = d - e.n - t;
+  return r > 0 && (n.push(r), e.n += r), n;
+}
+function ot(e) {
+  return x(() => {
+    const t = { n: 0 }, o = /* @__PURE__ */ new Map();
+    for (const n of v(e)) {
+      const r = nt(t, n.span, n.place);
+      o.set(n.id, r), t.n += n.span;
+    }
+    return o;
+  });
+}
+function Ee(e) {
+  if (e == null || typeof e != "object") return null;
+  if (typeof Element < "u" && e instanceof Element) return e;
+  const t = e;
+  return z(t.vnode?.el) ?? z(t.subTree?.el) ?? z(t.subTree?.component?.vnode?.el) ?? z(t.$el);
+}
+function z(e) {
+  if (typeof Element < "u" && e instanceof Element) return e;
+  if (e && e.nodeType === 8) {
+    for (let t = e.nextSibling; t; t = t.nextSibling)
+      if (typeof Element < "u" && t instanceof Element) return t;
+  }
+  return null;
+}
+const rt = /* @__PURE__ */ I({
+  name: "LayoutBlanks",
+  inheritAttrs: !1,
+  props: {
+    is: {
+      type: Object,
+      default: void 0
+    },
+    spans: {
+      type: Array,
+      required: !0
+    }
+  },
+  setup(e) {
+    return () => {
+      if (e.spans.length === 0 || e.is == null) return null;
+      const t = e.is;
+      return R(Ie, null, [e.spans.map((o, n) => R(t, {
+        key: n,
+        span: o
+      }, null))]);
+    };
+  }
+}), lt = /* @__PURE__ */ I({
+  name: "LayoutItem",
+  inheritAttrs: !1,
+  props: {
+    span: {
+      type: [String, Number],
+      default: void 0
+    },
+    place: {
+      type: String,
+      default: void 0
+    }
+  },
+  setup(e, {
+    slots: t
+  }) {
+    const o = j(D, null);
+    if (!o) return () => t.default?.() ?? null;
+    const {
+      span: n,
+      blanks: r,
+      itemRef: l,
+      Col: s,
+      disabled: u
+    } = o(() => e.span, () => e.place);
+    return () => {
+      if (u.value) return t.default?.() ?? null;
+      const c = s;
+      return R(Ie, null, [R(rt, {
+        is: s,
+        spans: r.value
+      }, null), R(c, {
+        ref: l,
+        span: n.value
+      }, {
+        default: () => [t.default?.() ?? null]
+      })]);
+    };
+  }
+}), st = /* @__PURE__ */ I({
+  name: "LayoutItemPassThrough",
+  inheritAttrs: !1,
+  setup(e, {
+    slots: t
+  }) {
+    return () => t.default?.() ?? null;
+  }
+});
+function ut() {
+  return j(D, null) ? lt : st;
+}
+function it(e) {
+  const t = q({});
+  let o = 0;
+  return {
+    get value() {
+      return t.value;
+    },
+    setup(n, r) {
+      const l = String(++o), s = x(() => Je(v(n), v(e))), u = x(() => Qe(v(r)));
+      return t.value[l] = {
+        span: s,
+        place: u,
+        el: null,
+        mounted: !1
+      }, he(() => {
+        const c = t.value[l];
+        c && (c.mounted = !0);
+      }), be(() => {
+        delete t.value[l];
+      }), l;
+    },
+    span(n) {
+      return t.value[n]?.span ?? 0;
+    },
+    ref(n, r) {
+      const l = t.value[n];
+      if (!l) return;
+      const s = Ee(r);
+      l.el !== s && (l.el = s);
+    }
+  };
+}
+function at(e, t) {
+  const o = new Map(Object.entries(e).filter(([, n]) => n.el).map(([n, r]) => [r.el, {
+    id: n,
+    span: r.span,
+    place: r.place
+  }]));
+  return t.filter((n) => o.has(n)).map((n) => o.get(n));
+}
+function ct(e, t) {
+  const o = tt(() => Ee(t.value), () => Object.keys(e.value).filter((n) => e.value[n].mounted).join(","));
+  return ot(() => at(e.value, o.value));
+}
+function Ce(e = {}) {
+  const {
+    Row: t,
+    Col: o
+  } = e;
+  return /* @__PURE__ */ I({
+    name: "LayoutView",
+    inheritAttrs: !1,
+    props: {
+      disabled: {
+        type: Boolean,
+        default: !1
+      },
+      column: {
+        type: Number,
+        default: void 0
+      }
+    },
+    setup(n, {
+      slots: r,
+      attrs: l
+    }) {
+      const s = x(() => !t || !o || n.disabled), u = it(() => Ze(n.column, e.column)), c = q(null), i = ct(u, c);
+      return H(D, (m, g) => {
+        H(D, null);
+        const p = u.setup(m, g);
+        return {
+          span: x(() => u.span(p)),
+          blanks: x(() => i.value.get(p) ?? []),
+          itemRef: (E) => u.ref(p, E),
+          Col: o,
+          disabled: s
+        };
+      }), () => s.value ? r.default?.() ?? null : R(t, Ue({
+        ref: c
+      }, l), {
+        default: () => [r.default?.() ?? null]
+      });
+    }
+  });
+}
+const ft = /* @__PURE__ */ new Set(["item", "layout", "model", "span"]), mt = /* @__PURE__ */ new Set([
+  "component",
+  "props",
+  "model",
+  "prop",
+  "item",
+  // leftover schema `layout` must not leak into Item snapshot extras
+  "layout"
+]);
+function re(e) {
+  const t = {};
+  for (const [o, n] of Object.entries(e))
+    n !== void 0 && (t[o] = n);
+  return t;
+}
+function ie(e) {
+  const t = {};
+  for (const [o, n] of Object.entries(e))
+    o === "span" && n !== void 0 && console.warn("[vue-formless] fl:span is removed; use col:span"), ft.has(o) || (t[o] = n);
+  return t;
+}
+function dt(e) {
+  const t = {};
+  for (const [o, n] of Object.entries(e))
+    !mt.has(o) && n !== void 0 && (t[o] = n);
+  return t;
+}
+function pt(e) {
+  if (e == null || typeof e != "object") return {};
+  const t = e.formless;
+  if (t == null || typeof t != "object") return {};
+  const { model: o, item: n } = t;
+  return re({ model: o, item: n });
+}
+function Fe(e) {
+  const t = {};
+  for (const [o, n] of Object.entries(e))
+    !o.startsWith("fl:") || o.length <= 3 || n === void 0 || (t[o.slice(3)] = n);
+  return t;
+}
+function wt(e, t) {
+  const o = /* @__PURE__ */ new Set();
+  for (const r of t)
+    o.add(r), o.add(`onUpdate:${r}`);
+  const n = {};
+  for (const [r, l] of Object.entries(e))
+    o.has(r) || (n[r] = l);
+  return n;
+}
+function K(e, t) {
+  return e == null ? {} : re(typeof e == "function" ? e(t) ?? {} : e);
+}
+function ae(...e) {
+  const t = {};
+  for (const o of e)
+    if (o != null)
+      for (const [n, r] of Object.entries(o))
+        r !== void 0 && (t[n] = r);
+  return t;
+}
+function yt(e) {
+  const t = e.Item ? O(e.Item) : void 0;
+  return (o, n) => t && n.item !== !1 && (n.item === !0 || (e.isItemEnabled?.() ?? !0)) ? y(
+    t,
+    ae(
+      K(e.itemProps, n.fl),
+      n.itemAttrs,
+      n.itemOn
+    ),
+    {
+      ...n.itemSlots,
+      default: () => o
+    }
+  ) : o;
+}
+function de(e) {
+  return typeof e == "string" ? [e] : [...e];
+}
+function Se(e, t = {}, o = {}) {
+  if (o.prop === "")
+    throw new Error(`[vue-formless] fl:prop cannot be an empty string (control "${e}")`);
+  if (t.prop === "")
+    throw new Error(`[vue-formless] prop cannot be an empty string (control "${e}")`);
+  const n = de(t.model ?? "modelValue"), r = de(
+    o.prop !== void 0 ? o.prop : t.prop ?? e
+  );
+  if (r.length > n.length)
+    throw new Error(
+      `createFormControls: prop cannot be longer than model (control "${e}": model has ${n.length}, prop has ${r.length})`
+    );
+  if (r.some((l) => l === ""))
+    throw new Error(`[vue-formless] prop cannot be an empty string (control "${e}")`);
+  return { models: n, props: r };
+}
+function Mt(e, t) {
+  return e.props.length === 1 ? Ke(e.props[0]) : t;
+}
+function gt(e, t) {
+  const o = e.models.indexOf(t);
+  if (o === -1)
+    throw new Error(
+      `[vue-formless] useFormItem("${t}"): not a v-model port of this control`
+    );
+  const n = e.props[o];
+  if (n === void 0)
+    throw new Error(
+      `[vue-formless] useFormItem("${t}"): port is not bound to a prop`
+    );
+  return { models: [t], props: [n] };
+}
+function Ae(e, t, o) {
+  const n = {};
+  for (let r = 0; r < t.props.length; r++) {
+    const l = t.models[r], s = t.props[r];
+    n[l] = B(e, s), n[`onUpdate:${l}`] = (u) => {
+      o(s, u);
+    };
+  }
+  return n;
+}
+const $ = "item:", Q = "onItem:", ee = "fl:", te = "row:", ne = "col:", ht = /* @__PURE__ */ new Set(["column", "gutter"]), vt = /* @__PURE__ */ new Set(["span", "place"]);
+function pe(e) {
+  console.warn(e);
+}
+function Oe(e) {
+  const t = {}, o = {};
+  for (const n of Object.keys(e)) {
+    const r = e[n];
+    r && (n.startsWith($) && n.length > $.length ? t[n.slice($.length)] = r : o[n] = r);
+  }
+  return { itemSlots: t, inputSlots: o };
+}
+function Le(e) {
+  const t = {}, o = {};
+  for (const [n, r] of Object.entries(e))
+    n.startsWith(ee) && n.length > ee.length ? t[n.slice(ee.length)] = r : o[n] = r;
+  return { fl: t, rest: o };
+}
+function Ve(e) {
+  const t = {}, o = {}, n = {};
+  for (const [r, l] of Object.entries(e))
+    if (r.startsWith(te) && r.length > te.length) {
+      const s = r.slice(te.length);
+      ht.has(s) ? t[s] = l : pe(`[vue-formless] unknown row:${s} is ignored`);
+    } else if (r.startsWith(ne) && r.length > ne.length) {
+      const s = r.slice(ne.length);
+      vt.has(s) ? o[s] = l : pe(`[vue-formless] unknown col:${s} is ignored`);
+    } else
+      n[r] = l;
+  return { row: t, col: o, rest: n };
+}
+function we(e) {
+  if (e == null || e === "") return;
+  const t = typeof e == "number" ? e : Number(e);
+  if (Number.isFinite(t))
+    return t;
+}
+function ke(e) {
+  const t = {}, o = {}, n = {};
+  for (const [r, l] of Object.entries(e))
+    r.startsWith(Q) && r.length > Q.length ? o[bt(r.slice(Q.length))] = l : r.startsWith($) && r.length > $.length ? t[r.slice($.length)] = l : n[r] = l;
+  return { itemAttrs: t, itemOn: o, inputAttrs: n };
+}
+function bt(e) {
+  const t = e.indexOf(":");
+  return t === -1 ? `on${ye(e)}` : `on${ye(e.slice(0, t))}:${e.slice(t + 1)}`;
+}
+function ye(e) {
+  return e && e.charAt(0).toUpperCase() + e.slice(1);
+}
+const xe = Symbol(
+  "vue-formless.controlRuntime"
+);
+function It(e) {
+  H(xe, e);
+}
+const Et = {
+  "fl:prop": { type: [String, Array], default: void 0 },
+  "col:span": { type: [String, Number], default: void 0 },
+  "col:place": { type: String, default: void 0 }
+};
+function Re(e) {
+  return I({
+    name: e ? `FormViewItem_${e}` : "FormViewItem",
+    inheritAttrs: !1,
+    props: Et,
+    setup(t, { slots: o, attrs: n }) {
+      const r = se(), l = ut(), s = j(xe, null);
+      if (e != null && !s)
+        throw new Error(
+          "[vue-formless] useFormItem(port) must be used inside a namespaced control."
+        );
+      return () => Ft(
+        r,
+        l,
+        s,
+        e,
+        o,
+        n,
+        t
+      );
+    }
+  });
+}
+const $e = Re();
+function Ct(e) {
+  return se(), e === void 0 ? $e : Re(e);
+}
+function Ft(e, t, o, n, r, l, s) {
+  const { fl: u, rest: c } = Le(l), { row: i, col: m, rest: g } = Ve(c), p = { ...u, ...Fe(s) }, { itemAttrs: E, itemOn: b, inputAttrs: L } = ke(g), C = { ...E, ...L }, { itemSlots: w } = Oe(r), f = n == null && o != null, F = s["col:span"] ?? m.span, V = s["col:place"] ?? m.place, a = o?.getFrame(), k = F ?? (f ? a?.colSpan : void 0), _ = V ?? (f ? a?.colPlace : void 0), W = St(e, o, n, p), U = Ae(e.model, W.binding, e.update), J = r.default?.({ field: U }) ?? null;
+  !f && (i.column != null || i.gutter != null) && console.warn("[vue-formless] :row:* is ignored on a leaf cell");
+  let S = C, A = b, G = w;
+  f && a && (S = { ...a.itemAttrs, ...C }, A = { ...a.itemOn, ...b }, G = { ...a.itemSlots, ...w });
+  let M, Y, N = !1;
+  f && a && (M = a.wrapItem, Y = a.wrapCol, N = a.extraRow);
+  let h = J;
+  if (N && a) {
+    const T = h;
+    h = y(
+      e.LayoutView,
+      {
+        disabled: !e.isLayoutEnabled(),
+        column: a.rowColumn ?? e.factoryColumn,
+        gutter: a.rowGutter ?? e.factoryGutter
+      },
+      () => T
+    );
+  }
+  if (h = e.wrap(h, {
+    item: M === !1 ? !1 : M === !0 ? !0 : void 0,
+    fl: W.fl,
+    itemAttrs: S,
+    itemOn: A,
+    itemSlots: G
+  }), Y !== !1) {
+    const T = h;
+    h = y(t, { span: k, place: _ }, () => T);
+  }
+  return h;
+}
+function St(e, t, o, n) {
+  const r = ie(n);
+  if (t) {
+    const i = t.getFrame(), m = o != null ? gt(i.binding, o) : i.binding, g = {
+      ...i.fl,
+      ...r,
+      controlKey: t.controlKey,
+      binding: m,
+      getValues: () => m.props.map((p) => B(e.model, p))
+    };
+    return { binding: m, fl: g };
+  }
+  const l = n.prop;
+  if (l === "")
+    throw new Error("[vue-formless] fl:prop cannot be an empty string");
+  const s = typeof l == "string" ? l : Array.isArray(l) && l[0] ? String(l[0]) : "", u = l === void 0 ? { models: ["modelValue"], props: [] } : Se(s || "field", {
+    prop: l
+  }), c = {
+    ...r,
+    controlKey: s,
+    binding: u,
+    getValues: () => u.props.map((i) => B(e.model, i))
+  };
+  return { binding: u, fl: c };
+}
+function Pe(e) {
+  const t = e;
+  return t.Item = $e, t;
+}
+const le = 0;
+function At(e) {
+  return new Proxy(
+    {},
+    {
+      get(t, o) {
+        const n = e.value;
+        if (n == null) return;
+        const r = Reflect.get(n, o, n);
+        return typeof r == "function" ? r.bind(n) : r;
+      },
+      has(t, o) {
+        return e.value != null && o in e.value;
+      }
+    }
+  );
+}
+const je = {
+  modelValue: {
+    type: [Object, Array],
+    default: void 0
+  },
+  "fl:layout": {
+    type: Boolean,
+    default: !1
+  },
+  "row:column": { type: Number, default: void 0 },
+  "row:gutter": { type: Number, default: void 0 },
+  "fl:form": {
+    type: [Boolean, String],
+    default: "auto"
+  },
+  "fl:item": {
+    type: Boolean,
+    default: !0
+  }
+}, _e = {
+  "update:modelValue": (e) => !0
+};
+function X(e) {
+  if (e != null && typeof e == "object")
+    throw new Error("[vue-formless] fl:layout is boolean only; use :row:column / :row:gutter");
+  return e === !0 || e === "";
+}
+function Ot(e, t) {
+  return e === !0 || e === !1 ? e : !t;
+}
+function Lt(e) {
+  return e == null ? !1 : "modelValue" in e || "model-value" in e || "onUpdate:modelValue" in e || "onUpdate:model-value" in e;
+}
+function Me(e) {
+  const t = yt({
+    Item: e.Item,
+    itemProps: e.itemProps,
+    isItemEnabled: e.isItemEnabled
+  }), o = e.isItemEnabled ?? (() => !0);
+  H(
+    Z,
+    Ye({
+      get model() {
+        return e.getModel();
+      },
+      update: e.update,
+      wrap: t,
+      isItemEnabled: o,
+      isLayoutEnabled: e.isLayoutEnabled,
+      LayoutView: O(e.LayoutView),
+      factoryColumn: e.factoryColumn,
+      factoryGutter: e.factoryGutter
+    })
+  );
+}
+function Ne(e, t) {
+  const o = j(Z, null);
+  if (Lt(Ge()?.vnode.props)) {
+    const r = Xe(e, t);
+    return { getModel: e, update: r.update };
+  }
+  if (o)
+    return {
+      getModel: () => o.model,
+      update: o.update
+    };
+  throw new Error("[vue-formless] FormView requires v-model unless nested inside another FormView.");
+}
+function Vt(e) {
+  if (e != null) {
+    if (e.Row == null || e.Col == null)
+      throw new Error("[vue-formless] createFormView layout requires both Row and Col.");
+    return {
+      Row: O(e.Row),
+      Col: O(e.Col),
+      column: e.column,
+      gutter: e.gutter
+    };
+  }
+}
+function Nt(e = {}) {
+  const t = Vt(e.layout), o = e.form?.component ? O(e.form.component) : void 0, n = e.form?.props, r = e.item?.component ? O(e.item.component) : void 0, l = e.item?.props, s = Ce(
+    t ? { Row: t.Row, Col: t.Col } : {}
+  ), u = t?.column ?? P.column, c = t?.gutter ?? le;
+  return Pe(
+    I({
+      name: "FormView",
+      inheritAttrs: !1,
+      props: je,
+      emits: _e,
+      setup(i, { slots: m, emit: g, attrs: p, expose: E }) {
+        const b = q(null);
+        E(At(b));
+        const L = j(Z, null) != null, { getModel: C, update: w } = Ne(
+          () => i.modelValue,
+          (f) => g("update:modelValue", f)
+        );
+        return Me({
+          getModel: C,
+          update: w,
+          Item: r,
+          itemProps: l,
+          isItemEnabled: () => i["fl:item"] !== !1,
+          isLayoutEnabled: () => X(i["fl:layout"]),
+          LayoutView: s,
+          factoryColumn: u,
+          factoryGutter: c
+        }), () => {
+          const f = m.default?.() ?? null, F = X(i["fl:layout"]), V = {
+            column: i["row:column"] ?? u,
+            gutter: i["row:gutter"] ?? c
+          }, a = y(
+            s,
+            { disabled: !F, column: V.column, gutter: V.gutter },
+            () => f
+          ), k = o ? Ot(i["fl:form"], L) : !1;
+          if (!o || !k) return a;
+          const _ = {
+            layout: F,
+            form: k,
+            item: i["fl:item"] !== !1,
+            modelValue: C()
+          };
+          return y(
+            o,
+            {
+              ref: b,
+              ...ae(K(n, _), p)
+            },
+            { default: () => a }
+          );
+        };
+      }
+    })
+  );
+}
+const ge = Ce(), Tt = Pe(
+  I({
+    name: "FormView",
+    inheritAttrs: !1,
+    props: je,
+    emits: _e,
+    setup(e, { slots: t, emit: o }) {
+      const { getModel: n, update: r } = Ne(
+        () => e.modelValue,
+        (l) => o("update:modelValue", l)
+      );
+      return Me({
+        getModel: n,
+        update: r,
+        isLayoutEnabled: () => X(e["fl:layout"]),
+        LayoutView: ge,
+        factoryColumn: P.column,
+        factoryGutter: le
+      }), () => y(
+        ge,
+        {
+          disabled: !X(e["fl:layout"]),
+          column: e["row:column"] ?? P.column,
+          gutter: e["row:gutter"] ?? le
+        },
+        () => t.default?.() ?? null
+      );
+    }
+  })
+);
+function Te(e) {
+  return e && e.charAt(0).toUpperCase() + e.slice(1);
+}
+function Bt(e) {
+  return e && e.charAt(0).toLowerCase() + e.slice(1);
+}
+function kt(e, t) {
+  if (e === "self" && t === !1 || e === !1 && t === "self")
+    throw new Error(
+      '[vue-formless] formless.item "self" conflicts with schema item: false'
+    );
+  return e ?? t;
+}
+function xt(e) {
+  const t = e.internalItem === "self";
+  let o;
+  e.tagItem === !0 ? o = !0 : e.tagItem === !1 || t || e.internalItem === !1 ? o = !1 : e.internalItem === !0 ? o = !0 : o = e.pageItem;
+  let n = e.pageLayoutOn;
+  t && e.tagItem !== !0 && (o = !1, n = !1);
+  const r = t && e.tagItem === !0 && e.pageLayoutOn;
+  return { wrapItem: o, wrapCol: n, extraRow: r, self: t };
+}
+const Rt = {
+  "fl:prop": { type: [String, Array], default: void 0 },
+  "fl:item": { type: Boolean, default: void 0 },
+  "col:span": { type: [String, Number], default: void 0 },
+  "col:place": { type: String, default: void 0 },
+  "row:column": { type: Number, default: void 0 },
+  "row:gutter": { type: Number, default: void 0 }
+};
+function Wt(e, t) {
+  const o = jt(e), n = {};
+  for (const r of Object.keys(o)) {
+    const l = o[r];
+    if (!l) continue;
+    const s = Te(r);
+    n[s] = $t(
+      r,
+      l,
+      t
+    );
+  }
+  return n;
+}
+function $t(e, t, o) {
+  const n = pt(t.component), r = n.model ?? t.model, l = kt(n.item, t.item);
+  return I({
+    name: `Control_${Te(e)}`,
+    inheritAttrs: !1,
+    props: Rt,
+    setup(s, { attrs: u, slots: c }) {
+      const i = se();
+      let m;
+      It({
+        controlKey: e,
+        getFrame: () => m
+      });
+      const g = Ct();
+      return () => {
+        const { fl: p, rest: E } = Le(u), { row: b, col: L, rest: C } = Ve(E), w = { ...p, ...Fe(s) }, f = Se(
+          e,
+          { model: r, prop: t.prop },
+          {
+            prop: w.prop
+          }
+        ), F = t.component, { itemSlots: V, inputSlots: a } = Oe(c), { itemAttrs: k, itemOn: _, inputAttrs: W } = ke(C), U = dt(t), J = w.item === !0 ? !0 : w.item === !1 ? !1 : void 0, S = xt({
+          pageItem: i.isItemEnabled(),
+          pageLayoutOn: i.isLayoutEnabled(),
+          internalItem: l,
+          tagItem: J
+        }), A = Pt(i, e, f, U, w), G = ae(
+          K(o?.props, A),
+          K(t.props, A),
+          wt(W, f.models)
+        ), M = Ae(i.model, f, i.update), Y = f.props[0] ?? e, N = typeof A.label == "string" ? A.label : void 0, h = s["col:span"] ?? L.span, T = s["col:place"] ?? L.place, ce = we(s["row:column"] ?? b.column), fe = we(s["row:gutter"] ?? b.gutter);
+        !S.extraRow && (ce != null || fe != null) && console.warn("[vue-formless] :row:* is ignored on a leaf control");
+        const Be = F ? y(
+          F,
+          {
+            ...G,
+            ...M
+          },
+          a
+        ) : y(
+          "div",
+          { class: "vue-formless-control", "data-control": e },
+          [
+            N ? y("label", { class: "vue-formless-control__label" }, String(N)) : null,
+            String(B(i.model, Y) ?? "")
+          ]
+        );
+        return m = {
+          fl: {
+            ...U,
+            ...ie(w)
+          },
+          binding: f,
+          wrapItem: S.wrapItem,
+          wrapCol: S.wrapCol,
+          extraRow: S.extraRow,
+          colSpan: h,
+          colPlace: T,
+          rowColumn: ce,
+          rowGutter: fe,
+          itemAttrs: k,
+          itemOn: _,
+          itemSlots: V
+        }, y(g, null, () => Be);
+      };
+    }
+  });
+}
+function Pt(e, t, o, n, r) {
+  return {
+    ...n,
+    ...ie(r),
+    controlKey: t,
+    binding: o,
+    getValues: () => o.props.map((l) => B(e.model, l))
+  };
+}
+function jt(e) {
+  const t = {
+    ...e
+  };
+  for (const o of Object.keys(t)) {
+    const n = t[o];
+    n && (t[o] = {
+      ...n,
+      component: n.component && typeof n.component == "object" ? O(n.component) : n.component
+    });
+  }
+  return t;
+}
+export {
+  P as DEFAULT_LAYOUT,
+  Tt as FormView,
+  $e as FormViewItem,
+  d as GRID_TOTAL,
+  Ae as applyControlBinding,
+  gt as bindingForPort,
+  Te as camelToPascal,
+  Wt as createFormControls,
+  Nt as createFormView,
+  Ce as createLayoutView,
+  Z as formContextKey,
+  Ke as formItemProp,
+  B as getIn,
+  kt as mergeInternalItem,
+  ae as overlayProps,
+  ue as parsePath,
+  Bt as pascalToCamel,
+  Se as resolveControlBinding,
+  xt as resolveControlShell,
+  Mt as resolveFormItemProp,
+  K as resolveProps,
+  De as setIn,
+  de as toBindingList,
+  se as useFormContext,
+  Ct as useFormItem,
+  ut as useLayoutItem
+};