@lanaco/lnc-react-ui/dist/FlexGrid.js

React component library

import { jsx as u } from "react/jsx-runtime";
import { forwardRef as S, Children as d, isValidElement as y, cloneElement as g } from "react";
import { P as e } from "./index-S5Cd7WrG.js";
import b from "./FlexBox.js";
import j from "./FlexGridItem.js";
const x = S((r, t) => {
  const {
    columns: o = 12,
    spacing: p,
    rowSpacing: m,
    columnSpacing: a,
    justifyContent: c = "Start",
    alignItems: i = "Stretch",
    children: l,
    rest: s
  } = r, f = d.map(l, (n) => {
    if (!(!y(n) || n.type != j))
      return g(n, {
        columns: o,
        spacing: p,
        rowSpacing: m,
        columnSpacing: a
      });
  });
  return /* @__PURE__ */ u(
    b,
    {
      ref: t,
      wrap: "Wrap",
      justifyContent: c,
      alignItems: i,
      ...s,
      children: f
    }
  );
});
x.propTypes = {
  /**
   * Number of available grid columns.
   */
  columns: e.number,
  /**
   * Defines spacing for rows and columns.
   */
  spacing: e.oneOfType([e.number, e.object]),
  /**
   * Defines row spacing. If this is set, `spacing` property is ignored for this value.
   */
  rowSpacing: e.oneOfType([e.number, e.object]),
  /**
   * Defines column spacing. If this is set, `spacing` property is ignored for this value.
   */
  columnSpacing: e.oneOfType([e.number, e.object]),
  /**
   * Controls how the space is distributed between items along the main-axis.
   */
  justifyContent: e.oneOf([
    "Start",
    "Center",
    "End",
    "SpaceAround",
    "SpaceBetween",
    "SpaceEvenly"
  ]),
  /**
   * Controls how the space is distributed between items along the cross-axis.
   */
  alignItems: e.oneOf([
    "Start",
    "Center",
    "Stretch",
    "End",
    "Baseline"
  ])
};
export {
  x as default
};