select.js 812 B

123456789101112131415161718192021222324252627282930313233343536373839
  1. let languages = {
  2. html: "HTML",
  3. css: "CSS",
  4. javascript: "JavaScript",
  5. java: "Java",
  6. python: "Python",
  7. xml: "XML",
  8. ruby: "Ruby",
  9. sass: "Sass",
  10. markdown: "Markdown",
  11. mysql: "MySql",
  12. json: "JSON",
  13. handlebars: "Handlebars",
  14. golang: "Golang",
  15. csharp: "C Sharp",
  16. elixir: "Elixir",
  17. typescript: "TypeScript",
  18. };
  19. const SelectLang = ({ list = languages, onChange, value }) => {
  20. return (
  21. <>
  22. <select
  23. style={{ marginBottom: "10px", marginLeft: "15px" }}
  24. value={value}
  25. onChange={(e) => onChange(e.target.value)}
  26. className="select"
  27. >
  28. {Object.entries(list).map(([value, text]) => (
  29. <option value={value} key={value}>
  30. {text}
  31. </option>
  32. ))}
  33. </select>
  34. </>
  35. );
  36. };
  37. export default SelectLang;