import { jsx as r, Fragment as p } from "@emotion/react/jsx-runtime";
import { forwardRef as d } from "react";
import { useModuleSkeleton as S } from "@m4l/core";
import { clsx as f } from "clsx";
import { useComponentSize as u } from "../../hooks/useComponentSize/index.js";
import { HELPER_ERROR_KEY_COMPONENT as E, classHelperErrorRoot as R } from "./constant.js";
import { TypographyStyled as y, SkeletonStyled as z } from "./slots/HelperErrorSlots.js";
const _ = d(function(m, n) {
  const { message: s = "", size: o = "medium", className: a, ...i } = m, l = S(), { currentSize: e } = u(o), c = e === "small" || e === "medium" ? e : "medium", t = {
    size: o,
    color: "error"
  };
  return /* @__PURE__ */ r(p, { children: l ? /* @__PURE__ */ r(z, { ownerState: { ...t }, variant: "text" }) : /* @__PURE__ */ r(
    y,
    {
      ref: n,
      "aria-errormessage": E,
      className: f(R, a),
      ownerState: { ...t },
      size: c,
      variant: "bodyStandard",
      component: "label",
      ...i,
      children: s
    }
  ) });
});
export {
  _ as HelperError
};
