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

React component library

import { jsx as u } from "react/jsx-runtime";
import { forwardRef as s } from "react";
import { s as y } from "./emotion-styled.browser.esm-DfbrHHed.js";
const E = y.div`
  display: ${(a) => a.inline ? "inline-grid" : "grid"};
  row-gap: ${(a) => a.rowGap ? a.rowGap : a.gap ? a.gap : 0};
  column-gap: ${(a) => a.columnGap ? a.columnGap : a.gap ? a.gap : 0};
  ${(a) => a.gridTemplate && `grid-template: ${a.gridTemplate};`}
  ${(a) => a.templateRows && `grid-template-rows: ${a.templateRows};`}
  ${(a) => a.templateColumns && `grid-template-columns: ${a.templateColumns};`}
  ${(a) => a.justifySelf && `justify-self: ${a.justifySelf};`} 
  ${(a) => a.alignSelf && `align-self: ${a.alignSelf};`} 
  ${(a) => a.area && `grid-area: ${a.area};`} 
  ${(a) => a.colStart && `grid-column-start: ${a.colStart};`} 
  ${(a) => (a.colEnd || a.colSpan) && `grid-column-end: span ${a.colEnd || a.colSpan};`} 
  ${(a) => a.rowStart && `grid-row-start: ${a.rowStart};`} 
  ${(a) => (a.rowEnd || a.rowSpan) && `grid-row-end: span ${a.rowEnd || a.rowSpan};`}
`, R = s((a, t) => {
  const {
    colStart: e,
    colEnd: l,
    rowStart: n,
    rowEnd: r,
    colSpan: i,
    rowSpan: d,
    justifySelf: m,
    alignSelf: o,
    area: g,
    className: $ = "",
    style: c = {},
    children: S,
    ...f
  } = a;
  var w = {
    colStart: e,
    colEnd: l,
    rowStart: n,
    rowEnd: r,
    colSpan: i,
    rowSpan: d,
    justifySelf: m,
    alignSelf: o,
    area: g
  };
  return /* @__PURE__ */ u(
    E,
    {
      ref: t,
      ...w,
      className: $,
      style: c,
      ...f,
      children: S
    }
  );
});
export {
  R as default
};