/** @license MIT | @cube-dev/ui-kit v0.142.7 | Cube Dev Team */
import { _LayoutContent } from "./LayoutContent.js";
import { tasty } from "@tenphi/tasty";
import { forwardRef, useMemo } from "react";
import { jsx } from "react/jsx-runtime";

//#region src/components/content/Layout/LayoutFooter.tsx
const FooterElement = tasty(_LayoutContent, {
	as: "footer",
	qa: "LayoutFooter",
	role: "contentinfo",
	styles: {
		container: "none",
		height: "min 5x",
		flexShrink: 0,
		flexGrow: 0,
		whiteSpace: "nowrap",
		border: {
			"": 0,
			"!:last-child": "($layout-border-size, 1bw) solid #border bottom"
		},
		Inner: {
			display: "flex",
			flow: {
				"": "row nowrap",
				inverted: "row-reverse nowrap"
			},
			placeContent: "center space-between",
			placeItems: "center stretch",
			gap: "1x"
		}
	}
});
function LayoutFooter(props, ref) {
	const { children, invertOrder, scrollbar = "tiny", mods, ...otherProps } = props;
	const finalMods = useMemo(() => ({
		inverted: invertOrder,
		...mods
	}), [invertOrder, mods]);
	return /* @__PURE__ */ jsx(FooterElement, {
		...otherProps,
		ref,
		mods: finalMods,
		scrollbar,
		children
	});
}
const _LayoutFooter = forwardRef(LayoutFooter);
_LayoutFooter.displayName = "Layout.Footer";

//#endregion
export { _LayoutFooter };
//# sourceMappingURL=LayoutFooter.js.map