selectbox.js 748 B

1234567891011121314151617181920212223242526272829303132
  1. const html = require('choo/html');
  2. module.exports = function(selected, options, translate, changed, htmlId) {
  3. let x = selected;
  4. return html`
  5. <select
  6. id="${htmlId}"
  7. class="appearance-none cursor-pointer border rounded bg-grey-10 hover:border-blue-50 focus:border-blue-50 pl-1 pr-8 py-1 my-1 h-8 dark:bg-grey-80"
  8. onchange="${choose}"
  9. >
  10. ${options.map(
  11. i =>
  12. html`
  13. <option value="${i}" ${i === selected ? 'selected' : ''}
  14. >${translate(i)}</option
  15. >
  16. `
  17. )}
  18. </select>
  19. `;
  20. function choose(event) {
  21. const target = event.target;
  22. const value = +target.value;
  23. if (x !== value) {
  24. x = value;
  25. changed(value);
  26. }
  27. }
  28. };