import { jsx } from "react/jsx-runtime";
import { ErrorMessage } from "@hookform/error-message";
import { useFormContext, Controller } from "react-hook-form";
/* empty css                                                                                                                                                                                       */
/* empty css                                                                                                                                                                                        */
/* empty css                                                                                                                                                                                                */
/* empty css                                                                                                                                                                                           */
/* empty css                                                                                                                                                                                           */
import { MultiSelect } from "../../primitive/Select/index.mjs";
const FormMultiSelect = ({
  name,
  rules,
  onChange: onSelect,
  data,
  ...restProps
}) => {
  const { control, formState, getFieldState } = useFormContext();
  const { error } = getFieldState(name, formState);
  return /* @__PURE__ */ jsx(
    Controller,
    {
      name,
      control,
      rules,
      render: ({ field: { onChange, value } }) => {
        return /* @__PURE__ */ jsx(
          MultiSelect,
          {
            value,
            data,
            onChange: (val) => {
              onChange(val);
              onSelect == null ? void 0 : onSelect(val);
            },
            error: error ? /* @__PURE__ */ jsx(ErrorMessage, { errors: formState.errors, name }) : void 0,
            ...restProps
          }
        );
      }
    }
  );
};
export {
  FormMultiSelect
};
