'use client';
import { jsx as t, jsxs as E } from "react/jsx-runtime";
import r from "react";
import { AnimatePresence as b, motion as y } from "framer-motion";
import { useTheme as w } from "../../hooks/use-theme.js";
import { useConfig as F } from "../../hooks/use-config.js";
function $({
  error: e,
  fieldName: a,
  immediate: n = !1,
  className: s = "",
  icon: o,
  showMultiple: i = !1,
  variant: l = "default",
  size: c = "md"
}) {
  const { getColorValue: f } = w(), { components: d } = F(), u = d.FieldError;
  if (u)
    return /* @__PURE__ */ t(u, { error: e, fieldName: a, immediate: n, className: s, icon: o, showMultiple: i, variant: l, size: c });
  const m = r.useMemo(() => e ? Array.isArray(e) ? e.filter(Boolean) : [e] : [], [e]);
  if (m.length === 0) return null;
  const h = i ? m : m.slice(0, 1), g = {
    sm: "text-xs",
    md: "text-sm",
    lg: "text-base"
  }, k = {
    default: "mt-1",
    inline: "ml-2 inline-block",
    tooltip: "absolute z-10 mt-1"
  }, v = {
    initial: { opacity: 0, y: -10, height: 0 },
    animate: {
      opacity: 1,
      y: 0,
      height: "auto",
      transition: { duration: 0.2, ease: "easeOut" }
    },
    exit: {
      opacity: 0,
      y: -10,
      height: 0,
      transition: { duration: 0.15, ease: "easeIn" }
    }
  }, p = o || /* @__PURE__ */ t(
    "svg",
    {
      className: "w-4 h-4 shrink-0",
      fill: "none",
      stroke: "currentColor",
      viewBox: "0 0 24 24",
      "aria-hidden": "true",
      children: /* @__PURE__ */ t(
        "path",
        {
          strokeLinecap: "round",
          strokeLinejoin: "round",
          strokeWidth: 2,
          d: "M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"
        }
      )
    }
  );
  return /* @__PURE__ */ t(b, { mode: "wait", children: h.length > 0 && /* @__PURE__ */ E(
    y.div,
    {
      initial: n ? "animate" : "initial",
      animate: "animate",
      exit: "exit",
      variants: v,
      className: `
            flex items-start gap-1
            text-danger-600 dark:text-danger-400
            ${g[c]}
            ${k[l]}
            ${s}
          `.trim(),
      role: "alert",
      "aria-live": "polite",
      "aria-relevant": "all",
      children: [
        p && /* @__PURE__ */ t("span", { className: "text-danger-500 dark:text-danger-400 mt-0.5", children: p }),
        /* @__PURE__ */ t("div", { className: "flex-1 min-w-0", children: h.map((C, x) => /* @__PURE__ */ t(
          "div",
          {
            className: x > 0 ? "mt-1" : "",
            children: /* @__PURE__ */ t("span", { className: "block text-inherit break-words", children: C })
          },
          `${a}-error-${x}`
        )) })
      ]
    }
  ) });
}
function B(e) {
  const [a, n] = r.useState(null), [s, o] = r.useState(!1), i = r.useMemo(() => s && !!a, [s, a]), l = r.useCallback(() => {
    n(null);
  }, []), c = r.useCallback((u) => {
    n(u);
  }, []), f = r.useCallback(() => {
    o(!0);
  }, []), d = r.useCallback(() => {
    n(null), o(!1);
  }, []);
  return {
    error: a,
    showError: i,
    touched: s,
    setError: c,
    clearError: l,
    touch: f,
    reset: d,
    fieldName: e
  };
}
var L = $;
export {
  $ as FieldError,
  L as default,
  B as useFieldError
};
//# sourceMappingURL=field-error.js.map
