import { jsx as x } from "react/jsx-runtime";
import { c as t } from "../../index-BtlgVD4m.js";
const p = ({ ref: i, columns: r, className: d, children: g }) => {
  const a = {
    "grid-cols-(--grid-xs)": r == null ? void 0 : r.xs,
    "sm:grid-cols-(--grid-sm)": r == null ? void 0 : r.sm,
    "md:grid-cols-(--grid-md)": r == null ? void 0 : r.md,
    "lg:grid-cols-(--grid-lg)": r == null ? void 0 : r.lg,
    "xl:grid-cols-(--grid-xl)": r == null ? void 0 : r.xl
  }, e = {
    ...(r == null ? void 0 : r.xs) && { "--grid-xs": `repeat(${r == null ? void 0 : r.xs},minmax(0,1fr))` },
    ...(r == null ? void 0 : r.sm) && { "--grid-sm": `repeat(${r == null ? void 0 : r.sm},minmax(0,1fr))` },
    ...(r == null ? void 0 : r.md) && { "--grid-md": `repeat(${r == null ? void 0 : r.md},minmax(0,1fr))` },
    ...(r == null ? void 0 : r.lg) && { "--grid-lg": `repeat(${r == null ? void 0 : r.lg},minmax(0,1fr))` },
    ...(r == null ? void 0 : r.xl) && { "--grid-xl": `repeat(${r == null ? void 0 : r.xl},minmax(0,1fr))` }
  };
  return /* @__PURE__ */ x("div", { ref: i, style: e, className: t("grid", "gap-[var(--spacing-6)]", a, d), children: g });
};
p.displayName = "Grid";
export {
  p as default
};
//# sourceMappingURL=Grid.js.map
