import React from 'react';
import { twMerge } from 'tailwind-merge';

interface DividerProps {
  orientation?: 'horizontal' | 'vertical';
  label?: string;
  className?: string;
}

const Divider: React.FC<DividerProps> = ({
  orientation = 'horizontal',
  label,
  className,
}) => {
  if (orientation === 'vertical') {
    return (
      <div 
        className={twMerge(
          'border-l border-gray-200 dark:border-gray-800 h-full inline-block', 
          className
        )} 
      />
    );
  }

  return (
    <div className={twMerge('relative my-4', className)}>
      <div className="absolute inset-0 flex items-center" aria-hidden="true">
        <div className="w-full border-t border-gray-200 dark:border-gray-800" />
      </div>
      {label && (
        <div className="relative flex justify-center text-xs uppercase">
          <span className="bg-white dark:bg-gray-950 px-2 text-gray-500 dark:text-gray-400">
            {label}
          </span>
        </div>
      )}
    </div>
  );
};

export default Divider;