import type { ReactNode } from 'react';

export const FlexRow = ({
  children,
  justify = 'flex-start',
  align = 'center',
  wrap,
  gap = '1rem',
  margin,
}: {
  children: ReactNode;
  justify?: 'space-between' | 'center' | 'flex-start' | 'flex-end';
  align?: 'center' | 'flex-start' | 'flex-end';
  wrap?: boolean;
  gap?: string;
  margin?: string;
}) => {
  return (
    <div
      style={{
        display: 'flex',
        flexDirection: 'row',
        flexWrap: wrap ? 'wrap' : 'nowrap',
        gap,
        alignItems: align,
        justifyContent: justify,
        margin,
      }}
    >
      {children}
    </div>
  );
};
