Initial commit

src/lib/components/BlurFade.svelte

@@ -8,6 +8,16 @@
     export let yOffset = 6;
     export let inViewMargin = "-50px";
     export let blur = "6px";
+    const generateUUID = () =>
+  typeof crypto?.randomUUID === "function"
+    ? crypto.randomUUID()
+    : "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, (c) => {
+        const r = (Math.random() * 16) | 0;
+        return (c === "x" ? r : (r & 0x3) | 0x8).toString(16);
+      });
+
+export let id = generateUUID().slice(0, 8);
+
     export let id = browser ? crypto.randomUUID().slice(0, 8) : "fallback-id";
     export let once = false;
     let defaultVariants = {

src/lib/components/hero.svelte

@@ -4,8 +4,6 @@
 <script>
   import BlurFade from "./BlurFade.svelte";
   import { browser } from "$app/environment";
-
-  export let id = browser ? crypto.randomUUID().slice(0, 8) : "fallback-id";
 </script>
 <style>
   .hero p {