import { i as FormSize, n as AnalyticsId } from "./constants2.js";
import classNames from "classnames";
import React from "react";
import { jsx } from "react/jsx-runtime";
import formGroupStyles from "./components/FormLayout/styles.module.scss";
let FormLayoutColumns = /* @__PURE__ */ function(FormLayoutColumns$1) {
	FormLayoutColumns$1["one"] = "one";
	FormLayoutColumns$1["two"] = "two";
	FormLayoutColumns$1["three"] = "three";
	FormLayoutColumns$1["four"] = "four";
	FormLayoutColumns$1["five"] = "five";
	return FormLayoutColumns$1;
}({});
const FormLayout = (props) => {
	const { maxColumns: columns = FormLayoutColumns.one, colMinWidth = 300, size, className, mapHelper, ref } = props;
	const cssVariable = { "--min-col-width": `${colMinWidth}px` };
	const formLayoutContainerClasses = classNames(formGroupStyles["form-layout-container"], { [formGroupStyles["form-layout-container--large"]]: size === FormSize.large }, className);
	const formLayoutChildClasses = classNames(formGroupStyles["form-layout-child"], {
		[formGroupStyles["form-layout-child--two"]]: columns === FormLayoutColumns.two,
		[formGroupStyles["form-layout-child--three"]]: columns === FormLayoutColumns.three,
		[formGroupStyles["form-layout-child--four"]]: columns === FormLayoutColumns.four,
		[formGroupStyles["form-layout-child--five"]]: columns === FormLayoutColumns.five
	});
	return /* @__PURE__ */ jsx("div", {
		"data-testid": props.testId,
		"data-analyticsid": AnalyticsId.FormLayout,
		style: cssVariable,
		className: formLayoutContainerClasses,
		ref,
		children: React.Children.map(props.children, (child, index) => {
			return /* @__PURE__ */ jsx("div", {
				className: formLayoutChildClasses,
				children: mapHelper ? mapHelper(child, index) : child
			});
		})
	});
};
FormLayout.displayName = "FormLayout";
var FormLayout_default$1 = FormLayout;
export { FormLayout as n, FormLayoutColumns as r, FormLayout_default$1 as t };

//# sourceMappingURL=FormLayout.js.map