Skeleton

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

React

skeleton.demo.tsx

import { Skeleton } from "../react/index.js";

export default function SkeletonDemo() {
  return (
    <div className="flex max-w-sm flex-col gap-3">
      <Skeleton className="h-4 w-3/4" />
      <Skeleton className="h-4 w-full" />
      <Skeleton className="h-24 w-full" />
    </div>
  );
}

Svelte

skeleton.demo.svelte

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

<div class="flex max-w-sm flex-col gap-3">
  <Skeleton class="h-4 w-3/4" />
  <Skeleton class="h-4 w-full" />
  <Skeleton class="h-24 w-full" />
</div>