MapComplete/src/UI/Base/MapControlButton.svelte

Ignoring revisions in .git-blame-ignore-revs. Click here to bypass and see the normal blame view.

23 lines
655 B
Svelte
Raw Normal View History

2023-03-24 19:21:15 +01:00
<script lang="ts">
import { createEventDispatcher } from "svelte"
import { twJoin } from "tailwind-merge"
import { Translation } from "../i18n/Translation"
import { ariaLabel } from "../../Utils/ariaLabel"
2023-03-24 19:21:15 +01:00
/**
* A round button with an icon and possible a small text, which hovers above the map
*/
const dispatch = createEventDispatcher()
export let cls = "m-0.5 p-0.5 sm:p-1 md:m-1"
2023-12-21 01:46:18 +01:00
export let arialabel: Translation = undefined
2023-03-24 19:21:15 +01:00
</script>
<button
on:click={(e) => dispatch("click", e)}
on:keydown
use:ariaLabel={arialabel}
2023-12-21 01:46:18 +01:00
class={twJoin("pointer-events-auto relative h-fit w-fit rounded-full", cls)}
2023-06-15 16:12:46 +02:00
>
<slot />
</button>