import { useDown } from "../core/media.js";
import vui from "../core/vui.js";
import FooterColumn from "./footerColumn.js";
import FooterRow from "./footerRow.js";
import { jsx, jsxs } from "react/jsx-runtime";

//#region src/footer/footerColumns.tsx
/** Organizes sections with links into a single column. Different width per breakpoint. */
const FooterColumns = vui((props, ref) => {
	const { columns } = props;
	const downMd = useDown("md");
	if (!columns) return null;
	if (downMd) {
		const columnsEven = columns.filter((_, index) => index % 2 === 0).flat();
		const columnsOdd = columns.filter((_, index) => index % 2 === 1).flat();
		return /* @__PURE__ */ jsxs(FooterRow, {
			ref,
			children: [/* @__PURE__ */ jsx(FooterColumn, { sections: columnsEven }, "evenColumns"), /* @__PURE__ */ jsx(FooterColumn, { sections: columnsOdd }, "oddColumns")]
		});
	}
	return /* @__PURE__ */ jsx(FooterRow, {
		ref,
		children: columns.map((sections, index) => /* @__PURE__ */ jsx(FooterColumn, { sections }, index))
	});
});
FooterColumns.displayName = "Footer Mobile Column";

//#endregion
export { FooterColumns as default };
globalThis.__vuiVersion__ = "4.0.1"
//# sourceMappingURL=footerColumns.js.map