{
if (active) {
el.blur();
} else {
el.focus();
active = true;
}
}}
onblur={async () => {
active = false;
release_all_pressed_keys();
}}
onkeydown={(e) => on_keyboard_input(e, true)}
onkeyup={(e) => on_keyboard_input(e, false)}
class="flex justify-center items-center text-center grow py-2 px-8 w-70 h-full cursor-pointer rounded-xl transition-colors duration-200 select-none {get_selectable_color_classes(
active,
{
bg: true,
hover: true,
active: true,
text: true
}
)}"
>
{active ? 'Erfassung aktiv' : 'Hier für Erfassung klicken'}
{#each last_keys as item (item.id)}
{#if item.key.split(' ')[0] === 'PRESS'}
{:else}
{/if}
{item.key.split(' ').at(-1)}
{/each}