function PricingCard({ plan, price, features, isPopular }) { return /*#__PURE__*/ React.createElement("div", { className: "font-roboto bg-white rounded-lg shadow-lg p-6 max-w-sm", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, isPopular && /*#__PURE__*/ React.createElement("span", { className: "bg-blue-600 text-white px-4 py-1 rounded-full text-sm mb-4 inline-block", __source: { fileName: "", lineNumber: 5, columnNumber: 9 }, __self: this }, "Most Popular"), /*#__PURE__*/ React.createElement("h3", { className: "text-xl font-bold mb-2", __source: { fileName: "", lineNumber: 9, columnNumber: 7 }, __self: this }, plan), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 10, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-3xl font-bold", __source: { fileName: "", lineNumber: 11, columnNumber: 9 }, __self: this }, "₹", price), /*#__PURE__*/ React.createElement("span", { className: "text-gray-600", __source: { fileName: "", lineNumber: 12, columnNumber: 9 }, __self: this }, "/month")), /*#__PURE__*/ React.createElement("ul", { className: "mb-6 space-y-2", __source: { fileName: "", lineNumber: 14, columnNumber: 7 }, __self: this }, features.map((feature, index)=>/*#__PURE__*/ React.createElement("li", { key: index, className: "flex items-center text-gray-600", __source: { fileName: "", lineNumber: 16, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-check text-green-500 mr-2", __source: { fileName: "", lineNumber: 17, columnNumber: 13 }, __self: this }), feature))), /*#__PURE__*/ React.createElement("button", { className: "w-full bg-blue-600 text-white py-2 px-4 rounded-lg hover:bg-blue-700 transition-colors", __source: { fileName: "", lineNumber: 22, columnNumber: 7 }, __self: this }, "Subscribe")); } function PricingCardStory() { const plans = [ { plan: "Basic", price: "499", features: [ "10 Users", "2GB Storage", "Email Support" ], isPopular: false }, { plan: "Pro", price: "999", features: [ "50 Users", "10GB Storage", "Priority Support", "Advanced Analytics" ], isPopular: true }, { plan: "Enterprise", price: "1999", features: [ "Unlimited Users", "100GB Storage", "24/7 Support", "Custom Features" ], isPopular: false } ]; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col md:flex-row gap-6 p-6 bg-gray-50", __source: { fileName: "", lineNumber: 62, columnNumber: 5 }, __self: this }, plans.map((plan, index)=>/*#__PURE__*/ React.createElement(PricingCard, { key: index, ...plan, __source: { fileName: "", lineNumber: 64, columnNumber: 9 }, __self: this }))); } function LanguageSelector({ onLanguageChange, defaultLanguage, className }) { const languages = [ "Hindi", "Bengali", "Telugu", "Marathi", "Tamil", "Urdu", "Gujarati", "Kannada", "Odia", "Punjabi", "Malayalam", "Assamese", "Maithili", "Sanskrit", "Santali", "Kashmiri", "Nepali", "Konkani", "Sindhi", "Dogri", "Manipuri", "Bodo" ]; return /*#__PURE__*/ React.createElement("select", { onChange: (e)=>onLanguageChange?.(e.target.value), value: defaultLanguage, className: `px-4 py-2 border rounded-lg bg-white ${className || ""}`, __source: { fileName: "", lineNumber: 28, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "", __source: { fileName: "", lineNumber: 33, columnNumber: 7 }, __self: this }, "Select Language"), languages.map((language)=>/*#__PURE__*/ React.createElement("option", { key: language, value: language, __source: { fileName: "", lineNumber: 35, columnNumber: 9 }, __self: this }, language))); } function LanguageSelectorStory() { const [selectedLanguage, setSelectedLanguage] = useState(""); return /*#__PURE__*/ React.createElement("div", { className: "p-6 space-y-4", __source: { fileName: "", lineNumber: 47, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 48, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "mb-2 text-lg font-bold", __source: { fileName: "", lineNumber: 49, columnNumber: 9 }, __self: this }, "Default Dropdown"), /*#__PURE__*/ React.createElement(LanguageSelector, { onLanguageChange: (lang)=>setSelectedLanguage(lang), __source: { fileName: "", lineNumber: 50, columnNumber: 9 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 53, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "mb-2 text-lg font-bold", __source: { fileName: "", lineNumber: 54, columnNumber: 9 }, __self: this }, "Dropdown with Default Selection"), /*#__PURE__*/ React.createElement(LanguageSelector, { defaultLanguage: "Hindi", __source: { fileName: "", lineNumber: 57, columnNumber: 9 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 60, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "mb-2 text-lg font-bold", __source: { fileName: "", lineNumber: 61, columnNumber: 9 }, __self: this }, "Custom Styled Dropdown"), /*#__PURE__*/ React.createElement(LanguageSelector, { className: "w-[300px] text-blue-600", __source: { fileName: "", lineNumber: 62, columnNumber: 9 }, __self: this }))); } function PdfUploader({ onUpload }) { const [upload, { loading }] = useUpload(); const [isDragging, setIsDragging] = useState(false); const [error, setError] = useState(null); const handleDrop = useCallback(async (e)=>{ e.preventDefault(); setIsDragging(false); const file = e.dataTransfer.files[0]; if (file && file.type === "application/pdf") { const { url, error } = await upload({ file }); if (error) { setError(error); return; } onUpload?.(url); } else { setError("Please upload a PDF file"); } }, [ upload, onUpload ]); const handleFileInput = useCallback(async (e)=>{ const file = e.target.files?.[0]; if (file && file.type === "application/pdf") { const { url, error } = await upload({ file }); if (error) { setError(error); return; } onUpload?.(url); } else { setError("Please upload a PDF file"); } }, [ upload, onUpload ]); return /*#__PURE__*/ React.createElement("div", { onDragOver: (e)=>{ e.preventDefault(); setIsDragging(true); }, onDragLeave: ()=>setIsDragging(false), onDrop: handleDrop, className: `relative cursor-pointer rounded-lg border-2 border-dashed p-12 text-center ${isDragging ? "border-blue-600 bg-blue-50" : "border-blue-300"}`, __source: { fileName: "", lineNumber: 43, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "file", accept: ".pdf", onChange: handleFileInput, className: "absolute inset-0 cursor-pointer opacity-0", __source: { fileName: "", lineNumber: 54, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("i", { className: "fas fa-file-upload text-4xl text-blue-400 mb-4", __source: { fileName: "", lineNumber: 60, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600", __source: { fileName: "", lineNumber: 61, columnNumber: 7 }, __self: this }, "Drop your PDF here or click to upload"), loading && /*#__PURE__*/ React.createElement("p", { className: "mt-2 text-blue-600", __source: { fileName: "", lineNumber: 62, columnNumber: 19 }, __self: this }, "Uploading..."), error && /*#__PURE__*/ React.createElement("p", { className: "mt-2 text-red-600", __source: { fileName: "", lineNumber: 63, columnNumber: 17 }, __self: this }, error)); } function PdfUploaderStory() { return /*#__PURE__*/ React.createElement("div", { className: "p-4 max-w-xl mx-auto", __source: { fileName: "", lineNumber: 70, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(PdfUploader, { onUpload: (url)=>console.log("Uploaded:", url), __source: { fileName: "", lineNumber: 71, columnNumber: 7 }, __self: this })); } function MainComponent() { const [showUploader, setShowUploader] = useState(false); return /*#__PURE__*/ React.createElement("div", { className: "font-roboto min-h-screen bg-gray-50", __source: { fileName: "", lineNumber: 5, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-gradient-to-r from-blue-600 to-blue-800 text-white", __source: { fileName: "", lineNumber: 6, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "container mx-auto px-6 py-20 text-center", __source: { fileName: "", lineNumber: 7, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-4xl md:text-6xl font-bold mb-8", __source: { fileName: "", lineNumber: 8, columnNumber: 11 }, __self: this }, "Translate PDFs into 22 Indian Languages"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowUploader(true), className: "bg-white text-blue-600 px-8 py-4 rounded-lg text-xl font-bold hover:bg-blue-50 transition-all", __source: { fileName: "", lineNumber: 11, columnNumber: 11 }, __self: this }, "Start Translating"))), /*#__PURE__*/ React.createElement("div", { className: "container mx-auto px-6 py-16", __source: { fileName: "", lineNumber: 20, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-8 mb-20", __source: { fileName: "", lineNumber: 21, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white p-8 rounded-lg shadow text-center", __source: { fileName: "", lineNumber: 22, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-4xl text-blue-600 mb-4", __source: { fileName: "", lineNumber: 23, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-calendar-alt", __source: { fileName: "", lineNumber: 24, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("h3", { className: "text-xl font-bold mb-2", __source: { fileName: "", lineNumber: 26, columnNumber: 13 }, __self: this }, "14-day free trial"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600", __source: { fileName: "", lineNumber: 27, columnNumber: 13 }, __self: this }, "Test all features without commitment")), /*#__PURE__*/ React.createElement("div", { className: "bg-white p-8 rounded-lg shadow text-center", __source: { fileName: "", lineNumber: 31, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-4xl text-blue-600 mb-4", __source: { fileName: "", lineNumber: 32, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-bolt", __source: { fileName: "", lineNumber: 33, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("h3", { className: "text-xl font-bold mb-2", __source: { fileName: "", lineNumber: 35, columnNumber: 13 }, __self: this }, "Instant translation"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600", __source: { fileName: "", lineNumber: 36, columnNumber: 13 }, __self: this }, "Get translations in seconds")), /*#__PURE__*/ React.createElement("div", { className: "bg-white p-8 rounded-lg shadow text-center", __source: { fileName: "", lineNumber: 38, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-4xl text-blue-600 mb-4", __source: { fileName: "", lineNumber: 39, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-code", __source: { fileName: "", lineNumber: 40, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("h3", { className: "text-xl font-bold mb-2", __source: { fileName: "", lineNumber: 42, columnNumber: 13 }, __self: this }, "Embed anywhere"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600", __source: { fileName: "", lineNumber: 43, columnNumber: 13 }, __self: this }, "Simple integration with any website"))), /*#__PURE__*/ React.createElement("div", { className: "text-center mb-16", __source: { fileName: "", lineNumber: 47, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-3xl font-bold mb-12", __source: { fileName: "", lineNumber: 48, columnNumber: 11 }, __self: this }, "How it works"), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-8", __source: { fileName: "", lineNumber: 49, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 50, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-16 h-16 bg-blue-600 rounded-full flex items-center justify-center text-white text-2xl mx-auto mb-4", __source: { fileName: "", lineNumber: 51, columnNumber: 15 }, __self: this }, "1"), /*#__PURE__*/ React.createElement("h3", { className: "text-xl font-bold mb-2", __source: { fileName: "", lineNumber: 54, columnNumber: 15 }, __self: this }, "Upload PDF"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600", __source: { fileName: "", lineNumber: 55, columnNumber: 15 }, __self: this }, "Upload your PDF document")), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 57, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-16 h-16 bg-blue-600 rounded-full flex items-center justify-center text-white text-2xl mx-auto mb-4", __source: { fileName: "", lineNumber: 58, columnNumber: 15 }, __self: this }, "2"), /*#__PURE__*/ React.createElement("h3", { className: "text-xl font-bold mb-2", __source: { fileName: "", lineNumber: 61, columnNumber: 15 }, __self: this }, "Select languages"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600", __source: { fileName: "", lineNumber: 62, columnNumber: 15 }, __self: this }, "Choose target Indian languages")), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 64, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-16 h-16 bg-blue-600 rounded-full flex items-center justify-center text-white text-2xl mx-auto mb-4", __source: { fileName: "", lineNumber: 65, columnNumber: 15 }, __self: this }, "3"), /*#__PURE__*/ React.createElement("h3", { className: "text-xl font-bold mb-2", __source: { fileName: "", lineNumber: 68, columnNumber: 15 }, __self: this }, "Get embed code"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600", __source: { fileName: "", lineNumber: 69, columnNumber: 15 }, __self: this }, "Copy and paste to your site")))), /*#__PURE__*/ React.createElement("div", { className: "text-center", __source: { fileName: "", lineNumber: 74, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowUploader(true), className: "bg-blue-600 text-white px-8 py-4 rounded-lg text-xl font-bold hover:bg-blue-700 transition-all", __source: { fileName: "", lineNumber: 75, columnNumber: 11 }, __self: this }, "Start Translating"))), showUploader && /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center p-4", __source: { fileName: "", lineNumber: 85, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-lg p-8 max-w-lg w-full", __source: { fileName: "", lineNumber: 86, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center mb-6", __source: { fileName: "", lineNumber: 87, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-xl font-bold", __source: { fileName: "", lineNumber: 88, columnNumber: 15 }, __self: this }, "Upload PDF"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowUploader(false), __source: { fileName: "", lineNumber: 89, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-times", __source: { fileName: "", lineNumber: 90, columnNumber: 17 }, __self: this }))), /*#__PURE__*/ React.createElement(React.Fragment, null)))); }