<script>
    import { onMount } from 'svelte';

    import { navigate } from '../lib/routing.js';

    export let target;
    export let hotkey = null;
    export let ctrl = false
    export let alt = false;
    export let shift = false;

    function click() {
        if (typeof target === 'string') {
            navigate(target);
        }
        else if (typeof target === 'function') {
            target();
        }
        else {
            throw(`Link target is not a string or a function: ${target}`)
        }
    }


    function handleHotkey(event) {
        if (!hotkey) return;
        if (ctrl && !event.ctrlKey) return;
        if (alt && !event.altKey) return;
        if (shift && !event.shiftKey) return;

        if (event.code === hotkey) click();
        if (hotkey === 'Enter' && event.code === 'NumpadEnter') click();
    }
</script>


<svelte:window on:keydown={handleHotkey} />

<a href="#" on:click="{click}">
    <slot></slot>
</a>
