@curi/svelte/dist/Link.html

Curi integration with Svelte

<a href="{href}" on:click="handleClick(event, location, $router)">
	<slot></slot>
</a>

<script>
	const canNavigate = event => {
		return (
			!event.defaultPrevented &&
			event.button === 0 &&
			!(event.metaKey || event.altKey || event.ctrlKey || event.shiftKey)
		);
	};

	export default {
		data() {
			return {
				to: '',
				params: {},
				hash: '',
				query: '',
				state: null
			};
		},
		computed: {
			location: ({ to, params, hash, query, state, $router, $curi }) => {
				const pathname = to
					? $router.route.pathname(to, params)
					: $curi.response.location.pathname;
				return { hash, query, state, pathname };
			},
			href: ({ location, $router }) => {
				return $router.history.toHref(location);
			}
		},
		methods: {
			handleClick(event, location, $router) {
				if (canNavigate(event)) {
					event.preventDefault();
					$router.history.navigate(location);
				}
			}
		}
	};
</script>