النور

صمملي pdf يحتوي على هذا القاموس import React, { useState } from 'react'; import { Book, Search, Brain, Star, CheckCircle2, XCircle, RotateCcw, ChevronRight, BookOpen, GraduationCap } from 'lucide-react'; // --- بيانات القاموس (عينة من كلمات الصف الرابع) --- const dictionaryData = [   { id: 1, word: "العَزيمَة", meaning: "الإرادة القوية والمُصَمِّمة", opposite: "التكاسل / التراخي", typeInfo: "جمعها: العزائم", example: "بالعزيمة والإصرار نحقق النجاح." },   { id: 2, word: "يَبْتَكِر", meaning: "يخترع / ينشئ شيئاً جديداً", opposite: "يُقلِّد", typeInfo: "فعل مضارع", example: "يبتكر العالم أجهزة تفيد البشرية." },   { id: 3, word: "التُّرَاث", meaning: "ما تركه الأجداد من ثقافة وفنون", opposite: "الحداثة / المعاصرة", typeInfo: "اسم", example: "نفتخر بالتراث المصري القديم." },   { id: 4, word: "عَرِيقَة", meaning: "أصيلة وقديمة", opposite: "حديثة / جديدة", typeInfo: "مذكرها: عريق", example: "مصر تمتلك حضارة عريقة." },   { id: 5, word: "الْيَأْس", meaning: "القنوط وفقدان الأمل", opposite: "الأمل / الرجاء", typeInfo: "اسم", example: "لا تستسلم لليأس أبداً." },   { id: 6, word: "يَجْتَاز", meaning: "يتخطى / يعبر", opposite: "يتراجع / يتعثر", typeInfo: "فعل مضارع", example: "استطاع البطل أن يجتاز الصعاب." },   { id: 7, word: "مُتَتَالِيَة", meaning: "متتابعة / وراء بعضها", opposite: "متقطعة / منفصلة", typeInfo: "مفرد", example: "حققت اللاعبة نجاحات متتالية." },   { id: 8, word: "اسْتِرْدَاد", meaning: "استرجاع", opposite: "فقد / تضييع", typeInfo: "اسم", example: "نجح الجيش في استرداد أرضه." },   { id: 9, word: "تَتَأَرْجَح", meaning: "تتحرك وتتهادى", opposite: "تثبت / تستقر", typeInfo: "فعل مضارع", example: "تتأرجح السفينة في البحر المائج." },   { id: 10, word: "الْبَاهِرَة", meaning: "المدهشة / الرائعة", opposite: "العادية / القبيحة", typeInfo: "جمعها: الباهرات", example: "قدمت التلميذة لوحة باهرة." }, ]; // --- بيانات الأسئلة التفاعلية --- const quizData = [   { id: 1, question: "ما معنى كلمة 'يَبْتَكِر'؟", options: ["يشتري", "يخترع ويبدع", "يقلد الآخرين", "ينام مبكراً"], answer: "يخترع ويبدع" },   { id: 2, question: "مضاد (عكس) كلمة 'الْيَأْس' هو:", options: ["الحزن", "الخوف", "الأمل", "الغضب"], answer: "الأمل" },   { id: 3, question: "أكمل الجملة: تمتلك بلادنا حضارة .......", options: ["عريقة", "ضعيفة", "متأخرة", "سيئة"], answer: "عريقة" },   { id: 4, question: "ما معنى كلمة 'يَجْتَاز' في جملة (يجتاز المتسابق الحواجز)؟", options: ["يقف أمامها", "يتخطاها ويعبرها", "ينظر إليها", "يبكي منها"], answer: "يتخطاها ويعبرها" },   { id: 5, question: "مضاد كلمة 'مُتَتَالِيَة' هو:", options: ["سريعة", "متقطعة", "جميلة", "مستمرة"], answer: "متقطعة" } ]; export default function App() {   const [activeTab, setActiveTab] = useState('dictionary'); // 'dictionary' or 'quiz'   const [searchTerm, setSearchTerm] = useState('');      // Quiz States   const [currentQuestionIndex, setCurrentQuestionIndex] = useState(0);   const [score, setScore] = useState(0);   const [showResults, setShowResults] = useState(false);   const [selectedAnswer, setSelectedAnswer] = useState(null);   const [isAnswerCorrect, setIsAnswerCorrect] = useState(null);   // تصفية القاموس بناء على البحث   const filteredDictionary = dictionaryData.filter(item =>      item.word.includes(searchTerm) || item.meaning.includes(searchTerm)   );   // معالجة الإجابة على السؤال   const handleAnswerClick = (option) => {     if (selectedAnswer) return; // منع الإجابة مرتين في نفس السؤال          setSelectedAnswer(option);     const correct = option === quizData[currentQuestionIndex].answer;     setIsAnswerCorrect(correct);          if (correct) {       setScore(score + 1);     }     // الانتقال للسؤال التالي بعد تأخير بسيط     setTimeout(() => {       if (currentQuestionIndex + 1 < quizData.length) {         setCurrentQuestionIndex(currentQuestionIndex + 1);         setSelectedAnswer(null);         setIsAnswerCorrect(null);       } else {         setShowResults(true);       }     }, 1500);   };   // إعادة تشغيل الاختبار   const restartQuiz = () => {     setCurrentQuestionIndex(0);     setScore(0);     setShowResults(false);     setSelectedAnswer(null);     setIsAnswerCorrect(null);   };   return (    

             {/* Header / Navbar */}      

       

         

           

             

                             

             

               

القاموس اللغوي الذكي

               

للصف الرابع الابتدائي

             

           

                         {/* Tabs */}            

              setActiveTab('dictionary')}                 className={`flex-1 md:flex-none flex items-center justify-center gap-2 px-6 py-2.5 rounded-lg font-bold transition-all ${activeTab === 'dictionary' ? 'bg-white text-blue-700 shadow-md' : 'text-white hover:bg-white/20'}`}               >                                 القاموس                             setActiveTab('quiz')}                 className={`flex-1 md:flex-none flex items-center justify-center gap-2 px-6 py-2.5 rounded-lg font-bold transition-all ${activeTab === 'quiz' ? 'bg-yellow-400 text-indigo-900 shadow-md' : 'text-white hover:bg-white/20'}`}               >                                 اختبر نفسك                          

         

       

     

      {/* Main Content Area */}      

                 {/* ================= TAB 1: DICTIONARY ================= */}         {activeTab === 'dictionary' && (          

                         {/* Search Bar */}            

             

                             

              setSearchTerm(e.target.value)}               />            

            {/* Dictionary Grid */}            

              {filteredDictionary.length > 0 ? (                 filteredDictionary.map((item) => (                  

                   

                                        

                     

{item.word}

                                              {item.typeInfo}                                          

                                        

                     

                        المعنى:                         {item.meaning}                      

                     

                        المضاد:                         {item.opposite}                      

                   

                                        

                     

                        مثال:                          {item.example}                      

                   

                 

                ))               ) : (                

                 

                                     

                 

لم نجد هذه الكلمة!

                 

حاول البحث بكلمة أخرى أو راجع كتاب اللغة العربية.

               

              )}            

         

        )}         {/* ================= TAB 2: QUIZ ================= */}         {activeTab === 'quiz' && (          

                         {!showResults ? (              

                {/* Quiz Header */}                

                 

                                        تطبيقات القاموس                  

                 

                    السؤال {currentQuestionIndex + 1} من {quizData.length}                  

               

                {/* Progress Bar */}                

                 

               

                {/* Question Area */}                

                 

                    {quizData[currentQuestionIndex].question}                  

                 

                    {quizData[currentQuestionIndex].options.map((option, idx) => {                       // تحديد حالة الزر (عادي، صحيح، خطأ)                       let buttonClass = "w-full text-right p-5 rounded-2xl text-xl font-medium border-2 transition-all duration-300 flex justify-between items-center ";                       let icon = null;                       if (selectedAnswer === null) {                         buttonClass += "border-gray-200 bg-white hover:border-blue-400 hover:bg-blue-50 text-gray-700";                       } else if (option === quizData[currentQuestionIndex].answer) {                         buttonClass += "border-green-500 bg-green-50 text-green-700 shadow-md";                         icon = ;                       } else if (selectedAnswer === option) {                         buttonClass += "border-red-500 bg-red-50 text-red-700 shadow-md";                         icon = ;                       } else {                         buttonClass += "border-gray-200 bg-gray-50 text-gray-400 opacity-50";                       }                       return (                                               );                     })}                  

               

             

            ) : (               /* Quiz Results */              

               

                                

                 

                                     

                                    

أحسنت يا بطل!

                 

لقد أنهيت تدريبات القاموس اللغوي

                                    

                   

نتيجتك هي:

                   

                      {score} / {quizData.length}                    

                                         {/* Stars based on score */}                    

                      {[...Array(quizData.length)].map((_, i) => (                                               ))}                    

                 

                                                          إعادة الاختبار                                  

             

            )}          

        )}