import React from 'react';

import styles from './Row.module.css';

interface RowProps {
  style: {
    cols: number;
    gap: string;
    align: string;
    justify: string;
  };
  children: React.ReactNode;
}

export function Row({ style, children }: RowProps) {
  return (
    <div
      className={`${styles.row}`}
      style={{
        gridTemplateColumns: `repeat(${style.cols}, 1 fr)`,
        gap: `${style.gap}`,
        alignItems: `${style.align}`,
        justifyContent: `${style.justify}`,
      }}
    >
      {children}
    </div>
  );
}
