import { cn } from './utils';
import type { VariantProps } from 'class-variance-authority';
import { cva } from 'class-variance-authority';
import { forwardRef, type HTMLAttributes } from 'react';

const variants = cva('rounded-sm border border-slate-100 bg-white');

export type BackgroundProps = HTMLAttributes<HTMLDivElement> & VariantProps<typeof variants>;

export const Background = forwardRef<HTMLDivElement, BackgroundProps>(
  ({ children, className, ...props }, ref) => (
    <div className={cn(variants({ className }))} ref={ref} {...props}>
      {children}
    </div>
  )
);