import { jsx, jsxs } from "react/jsx-runtime";
import { forwardRef } from "react";
import { useFormContext, Sizes } from "../../../../context/FormContext";
import Label from "../Label";
import { getSizeHeight as getInputSizeHeight } from "../Input";
import Checkbox from "../Checkbox";
import { useStyle } from "../../../../../../../runtimes/react/use-style";
import { useResponsiveStyle } from "../../../../../../utils/responsive-style";
import { cx } from "@emotion/css";
var CheckboxTableField_default = forwardRef(function CheckboxTableField({
  form,
  id,
  name,
  label = "",
  value = false,
  error,
  hideLabel,
  tableColumn,
  ...restOfProps
}, ref) {
  const { size } = useFormContext();
  function handleChange(event) {
    form.setFieldValue(name, event.currentTarget.checked);
  }
  return /* @__PURE__ */ jsxs(
    Label,
    {
      className: cx(
        useStyle({ display: "flex", alignItems: "center", margin: 0 }),
        useStyle(
          useResponsiveStyle([size], ([size2 = Sizes.MEDIUM]) => ({
            minHeight: getInputSizeHeight(size2),
            maxHeight: getInputSizeHeight(size2)
          }))
        )
      ),
      htmlFor: id,
      children: [
        /* @__PURE__ */ jsx("span", { className: useStyle({ marginRight: 8 }), children: /* @__PURE__ */ jsx(
          Checkbox,
          {
            ...restOfProps,
            "aria-label": label,
            checked: value,
            onChange: handleChange,
            ref,
            id,
            error: error != null
          }
        ) }),
        label
      ]
    }
  );
});
export {
  CheckboxTableField_default as default
};
//# sourceMappingURL=index.js.map