Support loading islands from a URL

[KonnorRogers]

Prior Art: https://turbo.hotwired.dev/reference/frames#lazy-loaded-frame

<turbo-frame id="messages" src="/messages" loading="lazy">
  Content will be replaced when the frame becomes visible and /messages has been loaded.
</turbo-frame>

Maybe don't need the loading, but being able to load a route on client:visible would be 🤌

Something like:

<is-land client:visible src="/island-1.html">
  <!-- Injects HTML from `src` here: -->
</is-land>

Happy to discuss further!

[zachleat]

I do this pattern quite a bit but pairing it with an html-fetch custom element:

Definition: https://github.com/11ty/11ty-website/blob/67b3b23154110846c71ebe7857e63de8efd51e07/src/_includes/components/html-fetch.js#L2

Example use: https://github.com/11ty/11ty-website/blob/67b3b23154110846c71ebe7857e63de8efd51e07/src/_includes/supporters.njk#L24-L29

The simplest usage would be:

<is-land on:visible><html-fetch src="/imports/supporters.html"></html-fetch></is-land>

[zachleat]

Maybe I need to package up html-fetch?