zrozumiecReact.pl

import { useState} from "react";
import { ColorContext } from "./ColorContext";
import { ThemedSpan } from "./ThemedSpan";
import { Article } from "./Article";
import { Footer } from "./Footer";

export default function App() {
    const [selectedColor, setSelectedColor] = useState("blue");

    return (<>
        <select 
            value={selectedColor} 
            onChange={(e) => setSelectedColor(e.target.value)}
        >
            <option value="blue">Niebieski</option>
            <option value="yellow">Żółty</option>
            <option value="green">Zielony</option>
        </select>
        <ColorContext.Provider value={selectedColor}>
            <h1><ThemedSpan>Witaj!</ThemedSpan></h1>
            <Article />
            <Footer />  
        </ColorContext.Provider>
    </>
    );
}