creddy/src/ui/Link.svelte

<script>
    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;

    let classes = "";
    export {classes as class};

    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.key === hotkey) {
            click();
        }
    }
</script>


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

<a href="/{target}" on:click|preventDefault="{click}" class={classes}>
    <slot></slot>
</a>