import { jsx as n } from "react/jsx-runtime";
import e from "prop-types";
import { Box as a } from "@mui/material";
import { styled as i } from "@arcblock/ux/lib/Theme";
import l from "clsx";
function m({ children: o = null, autoCenter: r = !1, ...t }) {
  return o ? /* @__PURE__ */ n(p, { ...t, className: l(t.className, { "footer-row-auto-center": r }), children: o }) : null;
}
m.propTypes = {
  children: e.any,
  autoCenter: e.bool
};
const p = i(a)`
  display: flex;
  justify-content: space-between;
  & + & {
    margin-top: 24px;
  }
  &.footer-row-auto-center > *:only-child {
    margin: 0 auto;
  }

  ${({ theme: o }) => o.breakpoints.down("md")} {
    align-items: stretch;
    flex-direction: column;
    gap: ${({ theme: o }) => o.spacing(1)};
    > * {
      flex: 1 0 100%;
    }
    &.footer-row-auto-center > * {
      margin: 0 auto;
    }
  }
`;
export {
  m as default
};
