import { defineComponent as E, provide as I, onMounted as S, watch as $, nextTick as A, openBlock as c, createElementBlock as m, normalizeStyle as C, unref as i, normalizeClass as n, renderSlot as r, toDisplayString as p, createCommentVNode as f, createElementVNode as y } from "vue";
import { injectFormKey as N } from "../../composables/keys.js";
import { useTheme as T } from "../../composables/useTheme.js";
const j = {
  key: 0,
  class: "mb-6"
}, w = ["disabled"], z = {
  autoValidate: {
    type: Boolean,
    default: !0
  },
  autoFocus: {
    type: Boolean,
    default: !0
  },
  disabled: Boolean,
  errors: {
    type: [Array, Object],
    default: () => []
  },
  title: String,
  description: String,
  hasFooter: {
    type: Boolean,
    default: !0
  }
}, D = {
  name: "XForm"
}, O = /* @__PURE__ */ E({
  ...D,
  props: z,
  emits: ["submit"],
  setup(h, { emit: b }) {
    const l = h, F = b, s = [];
    I(N, {
      registerInput: (e, t, o, d) => {
        const u = s.find((B) => B.name === e);
        u ? (u.focus = t, u.validate = o, u.setError = d) : s.push({ name: e, focus: t, validate: o, setError: d });
      },
      unregisterInput: (e) => {
        const t = s.findIndex((o) => o.name === e);
        s.splice(t, 1);
      },
      isInsideForm: !0
    }), S(async () => {
      l.autoFocus && s && s.length > 0 && setTimeout(s[0].focus, 50);
    }), $(() => l.errors, (e) => {
      e && A(() => {
        if (Array.isArray(e))
          e.forEach((t) => {
            const o = s.find((d) => d.name === t.field);
            o && o.setError(t.msg);
          });
        else {
          const t = s.find((o) => o.name === e.field);
          t && t.setError(e.msg);
        }
      });
    });
    const g = () => {
      let e = !0;
      return s.forEach((t) => {
        !t.validate() && e && (e = !1, t.focus && t.focus());
      }), e;
    }, V = (e) => {
      e.preventDefault(), e.stopPropagation();
      const t = l.autoValidate ? g() : !0;
      F("submit", t);
    }, { styles: k, classes: a, className: v } = T("Form", {}, l);
    return (e, t) => (c(), m("form", {
      style: C(i(k)),
      class: n([
        i(v),
        i(a).wrapper
      ]),
      onSubmit: V
    }, [
      r(e.$slots, "header", {}, () => [
        e.title || e.description ? (c(), m("div", j, [
          e.title ? (c(), m("p", {
            key: 0,
            class: n(i(a).title)
          }, p(e.title), 3)) : f("", !0),
          e.description ? (c(), m("p", {
            key: 1,
            class: n(i(a).description)
          }, p(e.description), 3)) : f("", !0)
        ])) : f("", !0)
      ]),
      y("fieldset", {
        disabled: e.disabled,
        class: n(i(a).content)
      }, [
        r(e.$slots, "default")
      ], 10, w),
      e.hasFooter ? r(e.$slots, "footer", { key: 0 }, () => [
        y("div", {
          class: n(i(a).footer)
        }, [
          r(e.$slots, "primary-action"),
          r(e.$slots, "secondary-action")
        ], 2)
      ]) : f("", !0)
    ], 38));
  }
});
export {
  O as default
};
