AI Response Cards

import { AIResponseCards } from '@/blocks/ai-transparency/ai-response-cards'
import { useState } from 'react'

export default function Example() {
 const [selected, setSelected] = useState<string>()

 const responses = [
 {
 id: '1',
 content: 'Professional response with formal tone...',
 tone: 'professional',
 confidence: 92,
 tags: ['Business', 'Formal'],
 },
 {
 id: '2',
 content: 'Casual, friendly response...',
 tone: 'casual',
 confidence: 88,
 },
 {
 id: '3',
 content: 'Brief, to-the-point answer',
 tone: 'concise',
 confidence: 95,
 },
 ]

 return (
 <AIResponseCards
 responses={responses}
 selectedId={selected}
 onSelect={setSelected}
 variant="carousel"
 onCopy={(id) => {
 console.log('Copied response:', id)
 }}
 onFeedback={(id, positive) => {
 console.log(`Feedback for ${id}: ${positive ? 'positive' : 'negative'}`)
 }}
 onRegenerate={() => {
 console.log('Generate new responses')
 }}
 />
 )
}