Footer

One recipe, two bindings — rendered side by side from the same source the package ships.

React

footer.demo.tsx

import { Footer, Link } from "../react/index.js";

export default function FooterDemo() {
  return (
    <div className="overflow-hidden rounded-md border border-line">
      <Footer>
        <div className="flex items-center justify-between gap-4">
          <span>© 2026 SnowballSH</span>
          <Link href="https://github.com/SnowballSH" external subtle>
            GitHub
          </Link>
        </div>
      </Footer>
    </div>
  );
}

Svelte

footer.demo.svelte

<script lang="ts">
  import { Footer, Link } from "../svelte/index.js";
</script>

<div class="overflow-hidden rounded-md border border-line">
  <Footer>
    <div class="flex items-center justify-between gap-4">
      <span>© 2026 SnowballSH</span>
      <Link href="https://github.com/SnowballSH" external subtle>GitHub</Link>
    </div>
  </Footer>
</div>