import { jsx as e, jsxs as m, Fragment as h } from "@emotion/react/jsx-runtime";
import { forwardRef as N, useId as $ } from "react";
import { useModuleSkeleton as M, useEnvironment as B } from "@m4l/core";
import { useComponentSize as E } from "../../../../hooks/useComponentSize/index.js";
import { getComponentClasses as T } from "../../../../utils/getComponentSlotRoot.js";
import { CHECK_BOX_KEY_COMPONENT as U } from "./constants.js";
import j from "clsx";
import { CheckBoxRootStyled as F, MUICheckboxStyled as O, IconStyled as p, IconCheckedStyled as R, TypographyStyled as K, SkeletonStyled as S } from "./slots/CheckBoxSlots.js";
import { CheckBoxSlots as P } from "./slots/CheckBoxEnum.js";
const ee = N((k, u) => {
  const {
    className: b,
    size: l = "medium",
    disabled: o,
    color: f = "default",
    mandatory: H,
    mandatoryMessage: X,
    helperMessage: Y,
    id: x,
    htmlFor: q,
    error: r,
    inlineText: s,
    checked: d = !1,
    ...y
  } = k, { currentSize: t } = E(l), I = M(), C = t === "small" || t === "medium" ? t : "medium", v = T(U, P), { host_static_assets: c, environment_assets: a } = B(), g = $(), i = x || g, _ = `${c}/${a}/frontend/components/check_box/assets/icons/checked.svg`, w = `${c}/${a}/frontend/components/check_box/assets/icons/unchecked.svg`, z = `${c}/${a}/frontend/components/check_box/assets/icons/indeterminate.svg`, n = {
    disabled: o,
    color: f,
    error: r,
    size: l,
    checked: d
  };
  return /* @__PURE__ */ e(F, { ownerState: { ...n }, className: j(b, v.root), children: I ? /* @__PURE__ */ m(h, { children: [
    /* @__PURE__ */ e(S, { variant: "rounded", className: "checkSkeleton" }),
    s ? /* @__PURE__ */ e(S, { variant: "rectangular", className: "checkSkeletonInlineText" }) : null
  ] }) : /* @__PURE__ */ m(h, { children: [
    /* @__PURE__ */ e(
      O,
      {
        ref: u,
        ownerState: { ...n },
        disableRipple: !0,
        id: i,
        checked: d,
        indeterminateIcon: /* @__PURE__ */ e(p, { src: z, size: t, color: o ? "text.disabled" : r ? "error.enabled" : "primary.enabled", ownerState: { ...n } }),
        checkedIcon: /* @__PURE__ */ e(R, { src: _, size: t, color: o ? "text.disabled" : r ? "error.enabled" : "primary.enabled", ownerState: { ...n } }),
        icon: /* @__PURE__ */ e(p, { src: w, size: t, ownerState: { ...n }, color: o ? "text.disabled" : r ? "error.enabled" : "text.primary" }),
        disabled: o,
        inputProps: { "aria-labelledby": i, "aria-invalid": r ? "true" : void 0 },
        ...y
      }
    ),
    s && /* @__PURE__ */ e(
      K,
      {
        component: "label",
        htmlFor: i,
        variant: "bodyStandard",
        ownerState: { ...n },
        size: C,
        disabled: o,
        ellipsis: !0,
        children: s
      }
    )
  ] }) });
});
export {
  ee as CheckBox
};
