@fidely-ui/react/dist/components/grid/gridItem.js

Fidely UI is a modern, beautifully crafted React design system powered by Ark UI and Panda CSS, delivering accessible and themeable components for building exceptional web apps

'use client';
import { jsx as _jsx } from "react/jsx-runtime";
import { forwardRef } from 'react';
import { styled } from '@fidely-ui/styled-system/jsx';
import { gridItem, } from '@fidely-ui/styled-system/patterns';
import { splitProps } from '../../utils/split-props';
/**
 * GridItem component
 *
 * Provides a flexible box layout system using Panda's gridItem pattern.
 */
export const GridItem = forwardRef(function GridItem(props, ref) {
    const [patternProps, restProps] = splitProps(props, [
        'colSpan',
        'rowSpan',
        'rowStart',
        'rowEnd',
        'colStart',
        'colEnd',
    ]);
    const styles = gridItem.raw(patternProps);
    return _jsx(styled.div, { ref: ref, ...styles, ...restProps });
});
GridItem.displayName = 'GridItem';