'use client';


import { useFormField } from "../FormField.mjs";
import { FormItemLayout } from "../layout/FormItemLayout.mjs";
import { MultiSelect } from "../../Select/Multiselect.mjs";
import { Form } from "../Form.mjs";
import { jsx } from "react/jsx-runtime";
import { useFormContext } from "react-hook-form";

//#region src/components/Form/elements/MultiselectElement.tsx
const MultiSelectElement = ({ name, description, label, isRequired, info, showErrorMessage, children,...props }) => {
	const { control } = useFormContext();
	return /* @__PURE__ */ jsx(Form.Field, {
		control,
		name,
		render: ({ field }) => {
			const { error } = useFormField();
			return /* @__PURE__ */ jsx(FormItemLayout, {
				htmlFor: name,
				label,
				description,
				isRequired,
				info,
				showErrorMessage,
				"aria-invalid": !!error,
				children: /* @__PURE__ */ jsx(MultiSelect, {
					onValueChange: field.onChange,
					values: field.value,
					...props,
					children
				})
			});
		}
	});
};

//#endregion
export { MultiSelectElement };
//# sourceMappingURL=MultiselectElement.mjs.map