29 lines
612 B
TypeScript
29 lines
612 B
TypeScript
import React, { ReactNode } from "react";
|
|
import clsx from "clsx";
|
|
|
|
interface CardGroupProps {
|
|
children: ReactNode;
|
|
cols?: number;
|
|
className?: string;
|
|
}
|
|
|
|
const CardGroup: React.FC<CardGroupProps> = ({ children, cols = 2, className }) => {
|
|
const cardsArray = React.Children.toArray(children); // Pastikan children berupa array
|
|
|
|
return (
|
|
<div
|
|
className={clsx(
|
|
"grid gap-4",
|
|
`grid-cols-1 sm:grid-cols-${cols}`,
|
|
className
|
|
)}
|
|
>
|
|
{cardsArray.map((card, index) => (
|
|
<div key={index}>{card}</div>
|
|
))}
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default CardGroup;
|