Как реализуешь кнопку с разными типами которая передает разные props для разных типов

Для реализации кнопки с разными типами можно использовать TypeScript и union-типы. Пример: ```tsx type ButtonProps = { variant: 'primary' | 'secondary' | 'danger'; size?: 'sm' | 'md' | 'lg'; onClick: () => void; children: React.ReactNode; } & ( | { variant: 'primary'; icon?: React.ReactNode } | { variant: 'secondary'; outline?: boolean } | { variant: 'danger'; confirmText?: string } ); const Button = ({ variant, size = 'md', onClick, children, ...props }: ButtonProps) => { const baseClasses = 'rounded font-medium transition'; const variantClasses = { primary: 'bg-blue-500 text-white hover:bg-blue-600', secondary: props.outline ? 'border border-gray-300 hover:bg-gray-100' : 'bg-gray-200 hover:bg-gray-300', danger: 'bg-red-500 text-white hover:bg-red-600' }; return ( {children} ); }; ``` Такой подход обеспечит: 1. Типобезопасность - для каждого варианта доступны только свои пропсы 2. Автодополнение в IDE 3. Четкую документацию через типы