import { jsx } from "react/jsx-runtime";
import assert from "assert";
import { Box } from "../Box/Box.mjs";
import { negativeMargin } from "../../css/negativeMargin/negativeMargin.mjs";
import { resolveCollapsibleAlignmentProps } from "../../utils/collapsibleAlignmentProps.mjs";
import { normalizeResponsiveValue } from "../../css/atoms/sprinkles.css.mjs";
import { buildDataAttributes } from "../Accordion/Accordion.mjs";
import { validColumnsComponents, ColumnsContext } from "../Column/Column.mjs";
const Columns = ({
  children,
  collapseBelow,
  reverse = false,
  space = "none",
  align,
  alignY,
  component = "div",
  data,
  ...restProps
}) => {
  assert(
    validColumnsComponents.includes(component),
    `Invalid Columns component: '${component}'. Should be one of [${validColumnsComponents.map((c) => `'${c}'`).join(", ")}]`
  );
  const normalizedSpace = normalizeResponsiveValue(space);
  const {
    mobile: mobileSpace = "none",
    tablet: tabletSpace = mobileSpace,
    desktop: desktopSpace = tabletSpace,
    wide: wideSpace = desktopSpace
  } = normalizedSpace;
  const {
    collapsibleAlignmentProps,
    collapsibleAlignmentChildProps,
    collapseMobile,
    collapseTablet,
    collapseDesktop,
    orderChildren
  } = resolveCollapsibleAlignmentProps({
    collapseBelow,
    align,
    alignY,
    reverse
  });
  return /* @__PURE__ */ jsx(
    Box,
    {
      component,
      ...collapsibleAlignmentProps,
      className: negativeMargin("left", {
        mobile: collapseMobile ? "none" : mobileSpace,
        tablet: collapseTablet ? "none" : tabletSpace,
        desktop: collapseDesktop ? "none" : desktopSpace,
        wide: wideSpace
      }),
      ...buildDataAttributes({ data, validateRestProps: restProps }),
      children: /* @__PURE__ */ jsx(
        ColumnsContext.Provider,
        {
          value: {
            collapseMobile,
            collapseTablet,
            collapseDesktop,
            mobileSpace,
            tabletSpace,
            desktopSpace,
            wideSpace,
            collapsibleAlignmentChildProps,
            component
          },
          children: orderChildren(children)
        }
      )
    }
  );
};
export {
  Columns
};
