/*! ratio-ui · design system for knowledge sharing · https://github.com/losol/ratio-ui · (c) 2026 Losol AS · MPL-2.0 */
import { cn } from "../../utils/cn.js";
import { buildSpacingClasses } from "../../tokens/spacing.js";
import { buildBorderClasses } from "../../tokens/borders.js";
import { surfaceBgClasses } from "../../tokens/colors.js";
import "react";
import { jsx } from "react/jsx-runtime";
//#region src/layout/Container/Container.tsx
var SIZE_CLASSES = {
	sm: "max-w-xl",
	md: "max-w-3xl",
	lg: "max-w-5xl",
	xl: "max-w-7xl",
	full: "max-w-none"
};
var Container = ({ size = "lg", color, dark = false, children, as: Component = "div", className, style, testId, ...spacingAndBorder }) => {
	const { padding, paddingX, paddingY, paddingTop, paddingBottom, margin, marginX, marginY, marginTop, marginBottom, gap, border, borderColor, radius, ...rest } = spacingAndBorder;
	const spacingClasses = buildSpacingClasses({
		padding,
		paddingX,
		paddingY,
		paddingTop,
		paddingBottom,
		margin,
		marginX,
		marginY,
		marginTop,
		marginBottom,
		gap
	});
	const borderClasses = buildBorderClasses({
		border,
		borderColor,
		radius
	});
	const bgClasses = color ? surfaceBgClasses[color] : void 0;
	const autoCenter = !margin && !marginX;
	const defaultPx = padding === void 0 && paddingX === void 0 ? "px-3 sm:px-4 lg:px-6" : void 0;
	return /* @__PURE__ */ jsx(Component, {
		className: cn(autoCenter && "mx-auto", "w-full", SIZE_CLASSES[size], defaultPx, bgClasses, borderClasses, spacingClasses, dark && "surface-dark", className),
		style,
		"data-testid": testId,
		...rest,
		children
	});
};
Container.displayName = "Container";
//#endregion
export { Container };

//# sourceMappingURL=Container.js.map