Software Engineer - Web Developer
- Tweets280
- Following596
- Followers71
- Likes3.3K
![function RadioSelector({ options, category }: RadioProps) { const [selected, setSelected] = useState<string | null>(null); const [prevCategory, setPrevCategory] = useState(category); // Reset selection when category changes if (category !== prevCategory) { setPrevCategory(category); setSelected(null); } return ( <div> <h3>{category}</h3> {options.map(option => ( <label key={option}> <input type="radio" checked={selected === option} onChange={() => setSelected(option)} /> {option} </label> ))} {selected && <p>Selected: {selected}</p>} </div> ); }](https://pbs.twimg.com/media/G1Ji9uyWEAAocq4.jpg?name=orig)
ALT function RadioSelector({ options, category }: RadioProps) { const [selected, setSelected] = useState<string | null>(null); const [prevCategory, setPrevCategory] = useState(category); // Reset selection when category changes if (category !== prevCategory) { setPrevCategory(category); setSelected(null); } return ( <div> <h3>{category}</h3> {options.map(option => ( <label key={option}> <input type="radio" checked={selected === option} onChange={() => setSelected(option)} /> {option} </label> ))} {selected && <p>Selected: {selected}</p>} </div> ); }
ALT // Check if the browser supports a given media query, regardless of whether the // query currently matches. function supportsMedia(query) { // This works because `media` serializes to `'not all'` for unsupported queries. return matchMedia(query).media === query; } // Results for the latest Chrome Canary: supportsMedia('(prefers-reduced-data: reduce)'); // → true iff chrome://flags/#enable-experimental-web-platform-features is enabled supportsMedia('(prefers-color-scheme: light)'); // → true supportsMedia('(prefers-color-scheme: dark)'); // → true supportsMedia('(prefers-color-scheme: this-does-not-exist)'); // → false
