drop.chapril.org-firefoxsend/app/ui/selectbox.js

36 lines
900 B
JavaScript
Raw Normal View History

2018-10-25 04:07:10 +02:00
const html = require('choo/html');
module.exports = function(selected, options, translate, changed, htmlId) {
function choose(event) {
if (event.target.value != selected) {
2022-04-12 15:58:58 +02:00
console.log(
'Selected new value from dropdown',
htmlId,
':',
selected,
'->',
event.target.value
);
changed(event.target.value);
}
}
2022-04-12 15:58:58 +02:00
2018-10-25 04:07:10 +02:00
return html`
2018-11-16 21:39:36 +01:00
<select
id="${htmlId}"
2022-08-09 11:00:43 +02:00
class="appearance-none cursor-pointer border-default rounded-default bg-grey-10 hover:border-primary focus:border-primary pl-1 pr-8 py-1 my-1 h-8 dark:bg-grey-80"
data-selected="${selected}"
2018-11-16 21:39:36 +01:00
onchange="${choose}"
>
2019-01-24 21:31:20 +01:00
${options.map(
value =>
2019-01-24 21:31:20 +01:00
html`
<option value="${value}" ${value == selected ? 'selected' : ''}>
${translate(value)}
</option>
2019-01-24 21:31:20 +01:00
`
)}
2018-11-16 21:39:36 +01:00
</select>
`;
2018-10-25 04:07:10 +02:00
};