working on the frontend

web/src/lib/components/ui/skeleton/index.ts

@@ -0,0 +1,7 @@
+import Root from "./skeleton.svelte";
+
+export {
+    Root,
+    //
+    Root as Skeleton,
+};

web/src/lib/components/ui/skeleton/skeleton.svelte

@@ -0,0 +1,17 @@
+<script lang="ts">
+    import type {WithElementRef, WithoutChildren} from "bits-ui";
+    import type {HTMLAttributes} from "svelte/elements";
+    import {cn} from "$lib/utils.js";
+
+    let {
+        ref = $bindable(null),
+        class: className,
+        ...restProps
+    }: WithoutChildren<WithElementRef<HTMLAttributes<HTMLDivElement>>> = $props();
+</script>
+
+<div
+        {...restProps}
+        bind:this={ref}
+        class={cn("bg-primary/10 animate-pulse rounded-md", className)}
+></div>