Inky9/LFM2-WebGPU

1import type React from "react";2import { DEFAULT_EXAMPLES, type Example } from "../constants/examples";3 4interface ExamplePromptsProps {5  examples?: Example[];6  onExampleClick: (messageText: string) => void;7}8 9const ExamplePrompts: React.FC<ExamplePromptsProps> = ({10  examples,11  onExampleClick,12}) => (13  <div className="flex flex-col items-center justify-center h-full space-y-6">14    <div className="text-center mb-6">15      <h2 className="text-2xl font-semibold text-gray-300 mb-1">16        Try an example17      </h2>18      <p className="text-sm text-gray-500">Click one to get started</p>19    </div>20 21    <div className="grid grid-cols-1 sm:grid-cols-2 gap-3 max-w-2xl w-full px-4">22      {(examples || DEFAULT_EXAMPLES).map((example, index) => (23        <button24          key={index}25          onClick={() => onExampleClick(example.messageText)}26          className="flex items-center gap-3 p-4 bg-gray-700 hover:bg-gray-600 rounded-lg transition-colors text-left group cursor-pointer"27        >28          <span className="text-xl flex-shrink-0 group-hover:scale-110 transition-transform">29            {example.icon}30          </span>31          <span className="text-sm text-gray-200 group-hover:text-white transition-colors">32            {example.displayText}33          </span>34        </button>35      ))}36    </div>37  </div>38);39 40export default ExamplePrompts;41