Could be a possible to add navigation/links toggle? #90
Comments
|
Globally turn off links handling except marked ones? Something like this: <script>
import {router} from 'tinro';
router.handleLinks(false);
</script>
<a href="/foo/bar">Won't be handled by tinro</a>
<a href="/bar/foo" tinro>Will be handled by tinro</a> |
|
I was thinking more something like this snippet bellow, because widget is injected inside external pages and I don't have any access to those. <html ...>
<body>
...
<a href="/foo/bar">Won't be handled by tinro</a>
<a href="/bar/foo2">Won't be handled by tinro</a>
...
<div id="#sveltewidget"><!-- container for widget --></div>
<script href=sveltewidgetapp.js" />
...
</body>//widgetapp.svelte
<script>
import {router} from 'tinro';
router.handleLinks("#sveltewidget"); <- handle only links below this node
</script>
<a href="/widget/bar">Will be handled by tinro</a>
<a href="/widget/foo">Will be handled by tinro</a> |
|
I got this idea but it doesn't solve a problem in all cases. Creator of widget may not know which id will have a container for widget. Or there may be two or more widgets on a page with independent links and routes. Best solution is to have a reference for the root element(to check if the link is its child) right in Svelte context, but I don't know a way to get it. Right now, best solution seems to turn off handling of all links on a page, except ones marked by creator in the widget. |
|
Are there plans to implement I'm happy to draft a PR if you want. It seems the |
Basically at the moment all click events will be intercepted by tinro, except those with ignore attr.
It would be great if this could be turned off or defined only for links below an css selectors (e.g. id, class etc.)
e.g. closest(".app-widget a[href]")
The text was updated successfully, but these errors were encountered: