index.tsx

/* eslint-disable @typescript-eslint/ban-ts-comment */
/* eslint-disable @typescript-eslint/no-explicit-any */
// @ts-nocheck
// This file is autogenerated by scripts/build-registry.ts
// Do not edit this file directly.
import * as React from "react";

export const Index: Record<string, any> = {
  index: {
    name: "index",
    description: "",
    type: "registry:style",
    registryDependencies: ["utils"],
    files: [],
    component: null,
    meta: undefined,
  },
  "magic-card": {
    name: "magic-card",
    description:
      "A spotlight effect that follows your mouse cursor and highlights borders on hover.",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/magic-card.tsx",
        type: "registry:ui",
        target: "components/magicui/magic-card.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/magic-card.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  android: {
    name: "android",
    description: "A mockup of an Android device.",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/android.tsx",
        type: "registry:ui",
        target: "components/magicui/android.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/android.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "warp-background": {
    name: "warp-background",
    description: "A card with a time warping background effect.",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/warp-background.tsx",
        type: "registry:ui",
        target: "components/magicui/warp-background.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/warp-background.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "line-shadow-text": {
    name: "line-shadow-text",
    description: "A text component with a moving line shadow.",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/line-shadow-text.tsx",
        type: "registry:ui",
        target: "components/magicui/line-shadow-text.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/line-shadow-text.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "aurora-text": {
    name: "aurora-text",
    description: "A beautiful aurora text effect",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/aurora-text.tsx",
        type: "registry:ui",
        target: "components/magicui/aurora-text.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/aurora-text.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "morphing-text": {
    name: "morphing-text",
    description: "A dynamic text morphing component for Magic UI.",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/morphing-text.tsx",
        type: "registry:ui",
        target: "components/magicui/morphing-text.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/morphing-text.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "scroll-progress": {
    name: "scroll-progress",
    description: "Animated Scroll Progress for your pages",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/scroll-progress.tsx",
        type: "registry:ui",
        target: "components/magicui/scroll-progress.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/scroll-progress.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  lens: {
    name: "lens",
    description:
      "A interactive component that enables zooming into images, videos and other elements.",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/lens.tsx",
        type: "registry:ui",
        target: "components/magicui/lens.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/lens.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  pointer: {
    name: "pointer",
    description:
      "A component that displays a pointer when hovering over an element",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/pointer.tsx",
        type: "registry:ui",
        target: "components/magicui/pointer.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/pointer.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "neon-gradient-card": {
    name: "neon-gradient-card",
    description: "A beautiful neon card effect",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/neon-gradient-card.tsx",
        type: "registry:ui",
        target: "components/magicui/neon-gradient-card.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/neon-gradient-card.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  meteors: {
    name: "meteors",
    description: "A meteor shower effect.",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/meteors.tsx",
        type: "registry:ui",
        target: "components/magicui/meteors.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/meteors.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "grid-pattern": {
    name: "grid-pattern",
    description:
      "A background grid pattern made with SVGs, fully customizable using Tailwind CSS.",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/grid-pattern.tsx",
        type: "registry:ui",
        target: "components/magicui/grid-pattern.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/grid-pattern.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "interactive-grid-pattern": {
    name: "interactive-grid-pattern",
    description:
      "A interactive background grid pattern made with SVGs, fully customizable using Tailwind CSS.",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/interactive-grid-pattern.tsx",
        type: "registry:ui",
        target: "components/magicui/interactive-grid-pattern.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import(
        "@/registry/magicui/interactive-grid-pattern.tsx"
      );
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "dot-pattern": {
    name: "dot-pattern",
    description:
      "A background dot pattern made with SVGs, fully customizable using Tailwind CSS.",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/dot-pattern.tsx",
        type: "registry:ui",
        target: "components/magicui/dot-pattern.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/dot-pattern.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "flickering-grid": {
    name: "flickering-grid",
    description:
      "A flickering grid background made with SVGs, fully customizable using Tailwind CSS.",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/flickering-grid.tsx",
        type: "registry:ui",
        target: "components/magicui/flickering-grid.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/flickering-grid.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "hero-video-dialog": {
    name: "hero-video-dialog",
    description: "A hero video dialog component.",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/hero-video-dialog.tsx",
        type: "registry:ui",
        target: "components/magicui/hero-video-dialog.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/hero-video-dialog.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "code-comparison": {
    name: "code-comparison",
    description: "A component which compares two code snippets.",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/code-comparison.tsx",
        type: "registry:ui",
        target: "components/magicui/code-comparison.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/code-comparison.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "script-copy-btn": {
    name: "script-copy-btn",
    description: "Copy code to clipboard",
    type: "registry:ui",
    registryDependencies: ["button"],
    files: [
      {
        path: "registry/magicui/script-copy-btn.tsx",
        type: "registry:ui",
        target: "components/magicui/script-copy-btn.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/script-copy-btn.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  marquee: {
    name: "marquee",
    description:
      "An infinite scrolling component that can be used to display text, images, or videos.",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/marquee.tsx",
        type: "registry:ui",
        target: "components/magicui/marquee.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/marquee.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  globe: {
    name: "globe",
    description:
      "An autorotating, interactive, and highly performant globe made using WebGL.",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/globe.tsx",
        type: "registry:ui",
        target: "components/magicui/globe.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/globe.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "shimmer-button": {
    name: "shimmer-button",
    description:
      "A button with a shimmering light which travels around the perimeter.",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/shimmer-button.tsx",
        type: "registry:ui",
        target: "components/magicui/shimmer-button.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/shimmer-button.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "tweet-card": {
    name: "tweet-card",
    description:
      "A card that displays a tweet with the author's name, handle, and profile picture.",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/tweet-card.tsx",
        type: "registry:ui",
        target: "components/magicui/tweet-card.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/tweet-card.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "client-tweet-card": {
    name: "client-tweet-card",
    description:
      "A client-side version of the tweet card that displays a tweet with the author's name, handle, and profile picture.",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/client-tweet-card.tsx",
        type: "registry:ui",
        target: "components/magicui/client-tweet-card.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/client-tweet-card.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "bento-grid": {
    name: "bento-grid",
    description:
      "Bento grid is a layout used to showcase the features of a product in a simple and elegant way.",
    type: "registry:ui",
    registryDependencies: ["button"],
    files: [
      {
        path: "registry/magicui/bento-grid.tsx",
        type: "registry:ui",
        target: "components/magicui/bento-grid.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/bento-grid.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  particles: {
    name: "particles",
    description:
      "Particles are a fun way to add some visual flair to your website. They can be used to create a sense of depth, movement, and interactivity.",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/particles.tsx",
        type: "registry:ui",
        target: "components/magicui/particles.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/particles.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "number-ticker": {
    name: "number-ticker",
    description: "Animate numbers to count up or down to a target number",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/number-ticker.tsx",
        type: "registry:ui",
        target: "components/magicui/number-ticker.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/number-ticker.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  ripple: {
    name: "ripple",
    description:
      "An animated ripple effect typically used behind elements to emphasize them.",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/ripple.tsx",
        type: "registry:ui",
        target: "components/magicui/ripple.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/ripple.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "retro-grid": {
    name: "retro-grid",
    description: "An animated scrolling retro grid effect",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/retro-grid.tsx",
        type: "registry:ui",
        target: "components/magicui/retro-grid.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/retro-grid.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "animated-list": {
    name: "animated-list",
    description:
      "A list that animates each item in sequence with a delay. Used to showcase notifications or events on your landing page.",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/animated-list.tsx",
        type: "registry:ui",
        target: "components/magicui/animated-list.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/animated-list.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "animated-shiny-text": {
    name: "animated-shiny-text",
    description:
      "A light glare effect which pans across text making it appear as if it is shimmering.",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/animated-shiny-text.tsx",
        type: "registry:ui",
        target: "components/magicui/animated-shiny-text.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/animated-shiny-text.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "animated-grid-pattern": {
    name: "animated-grid-pattern",
    description:
      "A animated background grid pattern made with SVGs, fully customizable using Tailwind CSS.",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/animated-grid-pattern.tsx",
        type: "registry:ui",
        target: "components/magicui/animated-grid-pattern.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/animated-grid-pattern.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "border-beam": {
    name: "border-beam",
    description:
      "An animated beam of light which travels along the border of its container.",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/border-beam.tsx",
        type: "registry:ui",
        target: "components/magicui/border-beam.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/border-beam.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "animated-beam": {
    name: "animated-beam",
    description:
      'An animated beam of light which travels along a path. Useful for showcasing the "integration" features of a website.',
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/animated-beam.tsx",
        type: "registry:ui",
        target: "components/magicui/animated-beam.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/animated-beam.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "text-reveal": {
    name: "text-reveal",
    description: "Fade in text as you scroll down the page.",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/text-reveal.tsx",
        type: "registry:ui",
        target: "components/magicui/text-reveal.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/text-reveal.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "hyper-text": {
    name: "hyper-text",
    description:
      "A text animation that scrambles letters before revealing the final text.",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/hyper-text.tsx",
        type: "registry:ui",
        target: "components/magicui/hyper-text.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/hyper-text.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "animated-gradient-text": {
    name: "animated-gradient-text",
    description:
      "An animated gradient background which transitions between colors for text.",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/animated-gradient-text.tsx",
        type: "registry:ui",
        target: "components/magicui/animated-gradient-text.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/animated-gradient-text.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "orbiting-circles": {
    name: "orbiting-circles",
    description:
      "A collection of circles which move in orbit along a circular path",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/orbiting-circles.tsx",
        type: "registry:ui",
        target: "components/magicui/orbiting-circles.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/orbiting-circles.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  dock: {
    name: "dock",
    description:
      "An implementation of the MacOS dock using react + tailwindcss + motion",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/dock.tsx",
        type: "registry:ui",
        target: "components/magicui/dock.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/dock.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "word-rotate": {
    name: "word-rotate",
    description: "A vertical rotation of words",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/word-rotate.tsx",
        type: "registry:ui",
        target: "components/magicui/word-rotate.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/word-rotate.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "avatar-circles": {
    name: "avatar-circles",
    description: "Overlapping circles of avatars.",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/avatar-circles.tsx",
        type: "registry:ui",
        target: "components/magicui/avatar-circles.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/avatar-circles.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "typing-animation": {
    name: "typing-animation",
    description: "Characters appearing in typed animation",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/typing-animation.tsx",
        type: "registry:ui",
        target: "components/magicui/typing-animation.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/typing-animation.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "sparkles-text": {
    name: "sparkles-text",
    description:
      "A dynamic text that generates continuous sparkles with smooth transitions, perfect for highlighting text with animated stars.",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/sparkles-text.tsx",
        type: "registry:ui",
        target: "components/magicui/sparkles-text.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/sparkles-text.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "spinning-text": {
    name: "spinning-text",
    description:
      "The Spinning Text component animates text in a circular motion with customizable speed, direction, color, and transitions for dynamic and engaging effects.",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/spinning-text.tsx",
        type: "registry:ui",
        target: "components/magicui/spinning-text.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/spinning-text.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "flip-text": {
    name: "flip-text",
    description: "Text flipping character animation",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/flip-text.tsx",
        type: "registry:ui",
        target: "components/magicui/flip-text.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/flip-text.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "icon-cloud": {
    name: "icon-cloud",
    description: "An interactive 3D tag cloud component",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/icon-cloud.tsx",
        type: "registry:ui",
        target: "components/magicui/icon-cloud.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/icon-cloud.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "text-animate": {
    name: "text-animate",
    description:
      "A text animation component that animates text using a variety of different animations.",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/text-animate.tsx",
        type: "registry:ui",
        target: "components/magicui/text-animate.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/text-animate.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "scroll-based-velocity": {
    name: "scroll-based-velocity",
    description: "Scrolling text whose speed changes based on scroll speed",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/scroll-based-velocity.tsx",
        type: "registry:ui",
        target: "components/magicui/scroll-based-velocity.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/scroll-based-velocity.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "scratch-to-reveal": {
    name: "scratch-to-reveal",
    description:
      "The ScratchToReveal component creates an interactive scratch-off effect with customizable dimensions and animations, revealing hidden content beneath.",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/scratch-to-reveal.tsx",
        type: "registry:ui",
        target: "components/magicui/scratch-to-reveal.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/scratch-to-reveal.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "shiny-button": {
    name: "shiny-button",
    description:
      "A shiny button component with dynamic styles in the dark mode or light mode.",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/shiny-button.tsx",
        type: "registry:ui",
        target: "components/magicui/shiny-button.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/shiny-button.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "box-reveal": {
    name: "box-reveal",
    description: "Sliding box animation that reveals text behind it.",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/box-reveal.tsx",
        type: "registry:ui",
        target: "components/magicui/box-reveal.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/box-reveal.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "shine-border": {
    name: "shine-border",
    description: "Shine border is an animated background border effect.",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/shine-border.tsx",
        type: "registry:ui",
        target: "components/magicui/shine-border.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/shine-border.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "animated-circular-progress-bar": {
    name: "animated-circular-progress-bar",
    description:
      "Animated Circular Progress Bar is a component that displays a circular gauge with a percentage value.",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/animated-circular-progress-bar.tsx",
        type: "registry:ui",
        target: "components/magicui/animated-circular-progress-bar.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import(
        "@/registry/magicui/animated-circular-progress-bar.tsx"
      );
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  confetti: {
    name: "confetti",
    description:
      "Confetti animations are best used to delight your users when something special happens",
    type: "registry:ui",
    registryDependencies: ["button"],
    files: [
      {
        path: "registry/magicui/confetti.tsx",
        type: "registry:ui",
        target: "components/magicui/confetti.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/confetti.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "animated-subscribe-button": {
    name: "animated-subscribe-button",
    description:
      "An animated subscribe button useful for showing a micro animation from intial to final result.",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/animated-subscribe-button.tsx",
        type: "registry:ui",
        target: "components/magicui/animated-subscribe-button.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import(
        "@/registry/magicui/animated-subscribe-button.tsx"
      );
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "cool-mode": {
    name: "cool-mode",
    description: "Cool mode effect for buttons, links, and other DOMs",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/cool-mode.tsx",
        type: "registry:ui",
        target: "components/magicui/cool-mode.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/cool-mode.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "pulsating-button": {
    name: "pulsating-button",
    description:
      "An animated pulsating button useful for capturing attention of users.",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/pulsating-button.tsx",
        type: "registry:ui",
        target: "components/magicui/pulsating-button.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/pulsating-button.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "ripple-button": {
    name: "ripple-button",
    description: "An animated button with ripple useful for user engagement.",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/ripple-button.tsx",
        type: "registry:ui",
        target: "components/magicui/ripple-button.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/ripple-button.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "file-tree": {
    name: "file-tree",
    description:
      "A component used to showcase the folder and file structure of a directory.",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/file-tree.tsx",
        type: "registry:ui",
        target: "components/magicui/file-tree.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/file-tree.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "blur-fade": {
    name: "blur-fade",
    description:
      "Blur fade in and out animation. Used to smoothly fade in and out content.",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/blur-fade.tsx",
        type: "registry:ui",
        target: "components/magicui/blur-fade.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/blur-fade.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  safari: {
    name: "safari",
    description: "A safari browser mockup to showcase your website.",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/safari.tsx",
        type: "registry:ui",
        target: "components/magicui/safari.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/safari.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "iphone-15-pro": {
    name: "iphone-15-pro",
    description: "A mockup of the iPhone 15 Pro",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/iphone-15-pro.tsx",
        type: "registry:ui",
        target: "components/magicui/iphone-15-pro.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/iphone-15-pro.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "rainbow-button": {
    name: "rainbow-button",
    description: "An animated button with a rainbow effect.",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/rainbow-button.tsx",
        type: "registry:ui",
        target: "components/magicui/rainbow-button.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/rainbow-button.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "interactive-hover-button": {
    name: "interactive-hover-button",
    description: "",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/interactive-hover-button.tsx",
        type: "registry:ui",
        target: "components/magicui/interactive-hover-button.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import(
        "@/registry/magicui/interactive-hover-button.tsx"
      );
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  terminal: {
    name: "terminal",
    description: "A terminal component",
    type: "registry:ui",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/magicui/terminal.tsx",
        type: "registry:ui",
        target: "components/magicui/terminal.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/magicui/terminal.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "magic-card-demo": {
    name: "magic-card-demo",
    description:
      "Example showing a spotlight effect that follows your mouse cursor and highlights borders on hover.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/magic-card"],
    files: [
      {
        path: "registry/example/magic-card-demo.tsx",
        type: "registry:example",
        target: "components/magic-card-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/magic-card-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "android-demo": {
    name: "android-demo",
    description: "Example showing a mockup of an Android device.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/android"],
    files: [
      {
        path: "registry/example/android-demo.tsx",
        type: "registry:example",
        target: "components/android-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/android-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "android-demo-2": {
    name: "android-demo-2",
    description: "Second example showing a mockup of an Android device.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/android"],
    files: [
      {
        path: "registry/example/android-demo-2.tsx",
        type: "registry:example",
        target: "components/android-demo-2.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/android-demo-2.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "android-demo-3": {
    name: "android-demo-3",
    description: "Third example showing a mockup of an Android device.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/android"],
    files: [
      {
        path: "registry/example/android-demo-3.tsx",
        type: "registry:example",
        target: "components/android-demo-3.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/android-demo-3.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "warp-background-demo": {
    name: "warp-background-demo",
    description:
      "Example showing a card with a time warping background effect.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/warp-background"],
    files: [
      {
        path: "registry/example/warp-background-demo.tsx",
        type: "registry:example",
        target: "components/warp-background-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/warp-background-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "line-shadow-text-demo": {
    name: "line-shadow-text-demo",
    description: "Example showing a text component with a moving line shadow.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/line-shadow-text"],
    files: [
      {
        path: "registry/example/line-shadow-text-demo.tsx",
        type: "registry:example",
        target: "components/line-shadow-text-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/line-shadow-text-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "aurora-text-demo": {
    name: "aurora-text-demo",
    description: "Example showing a beautiful aurora text effect.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/aurora-text"],
    files: [
      {
        path: "registry/example/aurora-text-demo.tsx",
        type: "registry:example",
        target: "components/aurora-text-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/aurora-text-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "morphing-text-demo": {
    name: "morphing-text-demo",
    description: "Example showing a dynamic text morphing component.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/morphing-text"],
    files: [
      {
        path: "registry/example/morphing-text-demo.tsx",
        type: "registry:example",
        target: "components/morphing-text-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/morphing-text-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "scroll-progress-demo": {
    name: "scroll-progress-demo",
    description: "Example showing animated scroll progress for your pages.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/scroll-progress"],
    files: [
      {
        path: "registry/example/scroll-progress-demo.tsx",
        type: "registry:example",
        target: "components/scroll-progress-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/scroll-progress-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "lens-demo": {
    name: "lens-demo",
    description: "Example showing a lens effect component",
    type: "registry:example",
    registryDependencies: ["button", "card", "https://magicui.design/r/lens"],
    files: [
      {
        path: "registry/example/lens-demo.tsx",
        type: "registry:example",
        target: "components/lens-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/lens-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "lens-demo-2": {
    name: "lens-demo-2",
    description: "Second example showing a lens effect component",
    type: "registry:example",
    registryDependencies: ["button", "card", "https://magicui.design/r/lens"],
    files: [
      {
        path: "registry/example/lens-demo-2.tsx",
        type: "registry:example",
        target: "components/lens-demo-2.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/lens-demo-2.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "lens-demo-3": {
    name: "lens-demo-3",
    description: "Third example showing a lens effect component",
    type: "registry:example",
    registryDependencies: ["button", "card", "https://magicui.design/r/lens"],
    files: [
      {
        path: "registry/example/lens-demo-3.tsx",
        type: "registry:example",
        target: "components/lens-demo-3.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/lens-demo-3.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "pointer-demo-1": {
    name: "pointer-demo-1",
    description: "Example showing a pointer effect component",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/pointer"],
    files: [
      {
        path: "registry/example/pointer-demo-1.tsx",
        type: "registry:example",
        target: "components/pointer-demo-1.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/pointer-demo-1.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "neon-gradient-card-demo": {
    name: "neon-gradient-card-demo",
    description: "Example showing a beautiful neon card effect.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/neon-gradient-card"],
    files: [
      {
        path: "registry/example/neon-gradient-card-demo.tsx",
        type: "registry:example",
        target: "components/neon-gradient-card-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import(
        "@/registry/example/neon-gradient-card-demo.tsx"
      );
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "meteors-demo": {
    name: "meteors-demo",
    description: "Example showing a meteor shower effect.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/meteors"],
    files: [
      {
        path: "registry/example/meteors-demo.tsx",
        type: "registry:example",
        target: "components/meteors-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/meteors-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "grid-pattern-demo": {
    name: "grid-pattern-demo",
    description: "Example showing a background grid pattern made with SVGs.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/grid-pattern"],
    files: [
      {
        path: "registry/example/grid-pattern-demo.tsx",
        type: "registry:example",
        target: "components/grid-pattern-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/grid-pattern-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "grid-pattern-linear-gradient": {
    name: "grid-pattern-linear-gradient",
    description: "Example showing a grid pattern with linear gradient effects.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/grid-pattern"],
    files: [
      {
        path: "registry/example/grid-pattern-linear-gradient.tsx",
        type: "registry:example",
        target: "components/grid-pattern-linear-gradient.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import(
        "@/registry/example/grid-pattern-linear-gradient.tsx"
      );
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "grid-pattern-dashed": {
    name: "grid-pattern-dashed",
    description: "Example showing a dashed grid pattern.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/grid-pattern"],
    files: [
      {
        path: "registry/example/grid-pattern-dashed.tsx",
        type: "registry:example",
        target: "components/grid-pattern-dashed.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/grid-pattern-dashed.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "dot-pattern-demo": {
    name: "dot-pattern-demo",
    description: "Example showing a background dot pattern made with SVGs.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/dot-pattern"],
    files: [
      {
        path: "registry/example/dot-pattern-demo.tsx",
        type: "registry:example",
        target: "components/dot-pattern-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/dot-pattern-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "dot-pattern-linear-gradient": {
    name: "dot-pattern-linear-gradient",
    description: "Example showing a dot pattern with linear gradient effects.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/dot-pattern"],
    files: [
      {
        path: "registry/example/dot-pattern-linear-gradient.tsx",
        type: "registry:example",
        target: "components/dot-pattern-linear-gradient.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import(
        "@/registry/example/dot-pattern-linear-gradient.tsx"
      );
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "dot-pattern-with-glow-effect": {
    name: "dot-pattern-with-glow-effect",
    description: "Example showing a dot pattern with glow effect",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/dot-pattern"],
    files: [
      {
        path: "registry/example/dot-pattern-with-glow-effect.tsx",
        type: "registry:example",
        target: "components/dot-pattern-with-glow-effect.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import(
        "@/registry/example/dot-pattern-with-glow-effect.tsx"
      );
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "flickering-grid-demo": {
    name: "flickering-grid-demo",
    description: "Example showing a flickering grid background.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/flickering-grid"],
    files: [
      {
        path: "registry/example/flickering-grid-demo.tsx",
        type: "registry:example",
        target: "components/flickering-grid-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/flickering-grid-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "flickering-grid-rounded-demo": {
    name: "flickering-grid-rounded-demo",
    description:
      "Example showing a flickering grid background with rounded corners.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/flickering-grid"],
    files: [
      {
        path: "registry/example/flickering-grid-rounded-demo.tsx",
        type: "registry:example",
        target: "components/flickering-grid-rounded-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import(
        "@/registry/example/flickering-grid-rounded-demo.tsx"
      );
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "hero-video-dialog-demo": {
    name: "hero-video-dialog-demo",
    description: "Example showing a hero video dialog component.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/hero-video-dialog"],
    files: [
      {
        path: "registry/example/hero-video-dialog-demo.tsx",
        type: "registry:example",
        target: "components/hero-video-dialog-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/hero-video-dialog-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "hero-video-dialog-demo-top-in-bottom-out": {
    name: "hero-video-dialog-demo-top-in-bottom-out",
    description:
      "Example showing a hero video dialog with top-in bottom-out animation.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/hero-video-dialog"],
    files: [
      {
        path: "registry/example/hero-video-dialog-demo-top-in-bottom-out.tsx",
        type: "registry:example",
        target: "components/hero-video-dialog-demo-top-in-bottom-out.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import(
        "@/registry/example/hero-video-dialog-demo-top-in-bottom-out.tsx"
      );
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "code-comparison-demo": {
    name: "code-comparison-demo",
    description:
      "Example showing a component which compares two code snippets.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/code-comparison"],
    files: [
      {
        path: "registry/example/code-comparison-demo.tsx",
        type: "registry:example",
        target: "components/code-comparison-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/code-comparison-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "script-copy-btn-demo": {
    name: "script-copy-btn-demo",
    description: "Example showing how to copy code to clipboard.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/script-copy-btn"],
    files: [
      {
        path: "registry/example/script-copy-btn-demo.tsx",
        type: "registry:example",
        target: "components/script-copy-btn-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/script-copy-btn-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "marquee-demo": {
    name: "marquee-demo",
    description: "Example showing an infinite scrolling component.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/marquee"],
    files: [
      {
        path: "registry/example/marquee-demo.tsx",
        type: "registry:example",
        target: "components/marquee-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/marquee-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "marquee-demo-vertical": {
    name: "marquee-demo-vertical",
    description: "Example showing a vertical infinite scrolling component.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/marquee"],
    files: [
      {
        path: "registry/example/marquee-demo-vertical.tsx",
        type: "registry:example",
        target: "components/marquee-demo-vertical.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/marquee-demo-vertical.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "marquee-logos": {
    name: "marquee-logos",
    description: "Example showing an infinite scrolling logo carousel.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/marquee"],
    files: [
      {
        path: "registry/example/marquee-logos.tsx",
        type: "registry:example",
        target: "components/marquee-logos.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/marquee-logos.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "marquee-3d": {
    name: "marquee-3d",
    description: "Example showing a 3D infinite scrolling component.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/marquee"],
    files: [
      {
        path: "registry/example/marquee-3d.tsx",
        type: "registry:example",
        target: "components/marquee-3d.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/marquee-3d.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "globe-demo": {
    name: "globe-demo",
    description: "Example showing an autorotating, interactive WebGL globe.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/globe"],
    files: [
      {
        path: "registry/example/globe-demo.tsx",
        type: "registry:example",
        target: "components/globe-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/globe-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "tweet-card-demo": {
    name: "tweet-card-demo",
    description: "Example showing a tweet card with author info.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/tweet-card"],
    files: [
      {
        path: "registry/example/tweet-card-demo.tsx",
        type: "registry:example",
        target: "components/tweet-card-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/tweet-card-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "tweet-card-images": {
    name: "tweet-card-images",
    description: "Example showing a tweet card with images.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/tweet-card"],
    files: [
      {
        path: "registry/example/tweet-card-images.tsx",
        type: "registry:example",
        target: "components/tweet-card-images.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/tweet-card-images.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "tweet-card-meta-preview": {
    name: "tweet-card-meta-preview",
    description: "Example showing a tweet card with meta preview.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/tweet-card"],
    files: [
      {
        path: "registry/example/tweet-card-meta-preview.tsx",
        type: "registry:example",
        target: "components/tweet-card-meta-preview.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import(
        "@/registry/example/tweet-card-meta-preview.tsx"
      );
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "shimmer-button-demo": {
    name: "shimmer-button-demo",
    description: "Example showing a button with a shimmering light effect.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/shimmer-button"],
    files: [
      {
        path: "registry/example/shimmer-button-demo.tsx",
        type: "registry:example",
        target: "components/shimmer-button-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/shimmer-button-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "bento-demo": {
    name: "bento-demo",
    description: "Example showing a bento grid layout for showcasing features.",
    type: "registry:example",
    registryDependencies: [
      "button",
      "calendar",
      "https://magicui.design/r/marquee",
      "https://magicui.design/r/bento-grid",
      "https://magicui.design/r/animated-list-demo",
      "https://magicui.design/r/animated-beam-multiple-outputs",
    ],
    files: [
      {
        path: "registry/example/bento-demo.tsx",
        type: "registry:example",
        target: "components/bento-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/bento-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "bento-demo-vertical": {
    name: "bento-demo-vertical",
    description: "Example showing a vertical bento grid layout.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/bento-grid"],
    files: [
      {
        path: "registry/example/bento-demo-vertical.tsx",
        type: "registry:example",
        target: "components/bento-demo-vertical.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/bento-demo-vertical.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "number-ticker-demo": {
    name: "number-ticker-demo",
    description: "Example showing animated counting numbers.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/number-ticker"],
    files: [
      {
        path: "registry/example/number-ticker-demo.tsx",
        type: "registry:example",
        target: "components/number-ticker-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/number-ticker-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "number-ticker-demo-2": {
    name: "number-ticker-demo-2",
    description: "Example showing animated counting numbers.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/number-ticker"],
    files: [
      {
        path: "registry/example/number-ticker-demo-2.tsx",
        type: "registry:example",
        target: "components/number-ticker-demo-2.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/number-ticker-demo-2.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "number-ticker-decimal-demo": {
    name: "number-ticker-decimal-demo",
    description: "Example showing animated counting decimal numbers.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/number-ticker"],
    files: [
      {
        path: "registry/example/number-ticker-decimal-demo.tsx",
        type: "registry:example",
        target: "components/number-ticker-decimal-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import(
        "@/registry/example/number-ticker-decimal-demo.tsx"
      );
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "ripple-demo": {
    name: "ripple-demo",
    description: "Example showing an animated ripple effect.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/ripple"],
    files: [
      {
        path: "registry/example/ripple-demo.tsx",
        type: "registry:example",
        target: "components/ripple-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/ripple-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "retro-grid-demo": {
    name: "retro-grid-demo",
    description: "Example showing an animated scrolling retro grid effect.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/retro-grid"],
    files: [
      {
        path: "registry/example/retro-grid-demo.tsx",
        type: "registry:example",
        target: "components/retro-grid-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/retro-grid-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "animated-list-demo": {
    name: "animated-list-demo",
    description: "Example showing a list with sequenced item animations.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/animated-list"],
    files: [
      {
        path: "registry/example/animated-list-demo.tsx",
        type: "registry:example",
        target: "components/animated-list-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/animated-list-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "animated-shiny-text-demo": {
    name: "animated-shiny-text-demo",
    description: "Example showing text with a shimmering light effect.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/animated-shiny-text"],
    files: [
      {
        path: "registry/example/animated-shiny-text-demo.tsx",
        type: "registry:example",
        target: "components/animated-shiny-text-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import(
        "@/registry/example/animated-shiny-text-demo.tsx"
      );
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "particles-demo": {
    name: "particles-demo",
    description: "Example showing interactive particle effects.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/particles"],
    files: [
      {
        path: "registry/example/particles-demo.tsx",
        type: "registry:example",
        target: "components/particles-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/particles-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "animated-grid-pattern-demo": {
    name: "animated-grid-pattern-demo",
    description: "Example showing an animated grid pattern background.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/animated-grid-pattern"],
    files: [
      {
        path: "registry/example/animated-grid-pattern-demo.tsx",
        type: "registry:example",
        target: "components/animated-grid-pattern-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import(
        "@/registry/example/animated-grid-pattern-demo.tsx"
      );
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "interactive-grid-pattern-demo": {
    name: "interactive-grid-pattern-demo",
    description: "Example showing an interactive grid pattern background.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/interactive-grid-pattern"],
    files: [
      {
        path: "registry/example/interactive-grid-pattern-demo.tsx",
        type: "registry:example",
        target: "components/interactive-grid-pattern-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import(
        "@/registry/example/interactive-grid-pattern-demo.tsx"
      );
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "interactive-grid-pattern-demo-2": {
    name: "interactive-grid-pattern-demo-2",
    description:
      "Second example showing an interactive grid pattern background.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/interactive-grid-pattern"],
    files: [
      {
        path: "registry/example/interactive-grid-pattern-demo-2.tsx",
        type: "registry:example",
        target: "components/interactive-grid-pattern-demo-2.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import(
        "@/registry/example/interactive-grid-pattern-demo-2.tsx"
      );
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "border-beam-demo": {
    name: "border-beam-demo",
    description: "Example showing an animated border beam effect.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/border-beam"],
    files: [
      {
        path: "registry/example/border-beam-demo.tsx",
        type: "registry:example",
        target: "components/border-beam-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/border-beam-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "border-beam-demo-2": {
    name: "border-beam-demo-2",
    description: "Example showing an animated border beam effect.",
    type: "registry:example",
    registryDependencies: [
      "button",
      "card",
      "https://magicui.design/r/border-beam",
    ],
    files: [
      {
        path: "registry/example/border-beam-demo-2.tsx",
        type: "registry:example",
        target: "components/border-beam-demo-2.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/border-beam-demo-2.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "border-beam-demo-3": {
    name: "border-beam-demo-3",
    description: "Example showing an animated border beam effect.",
    type: "registry:example",
    registryDependencies: [
      "button",
      "card",
      "input",
      "label",
      "https://magicui.design/r/border-beam",
    ],
    files: [
      {
        path: "registry/example/border-beam-demo-3.tsx",
        type: "registry:example",
        target: "components/border-beam-demo-3.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/border-beam-demo-3.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "border-beam-demo-4": {
    name: "border-beam-demo-4",
    description: "Example showing an animated border beam effect.",
    type: "registry:example",
    registryDependencies: ["button", "https://magicui.design/r/border-beam"],
    files: [
      {
        path: "registry/example/border-beam-demo-4.tsx",
        type: "registry:example",
        target: "components/border-beam-demo-4.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/border-beam-demo-4.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "animated-beam-demo": {
    name: "animated-beam-demo",
    description: "Example showing an animated beam of light effect.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/animated-beam"],
    files: [
      {
        path: "registry/example/animated-beam-demo.tsx",
        type: "registry:example",
        target: "components/animated-beam-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/animated-beam-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "animated-beam-unidirectional": {
    name: "animated-beam-unidirectional",
    description: "Example showing a unidirectional animated beam effect.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/animated-beam"],
    files: [
      {
        path: "registry/example/animated-beam-unidirectional.tsx",
        type: "registry:example",
        target: "components/animated-beam-unidirectional.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import(
        "@/registry/example/animated-beam-unidirectional.tsx"
      );
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "animated-beam-bidirectional": {
    name: "animated-beam-bidirectional",
    description: "Example showing a bidirectional animated beam effect.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/animated-beam"],
    files: [
      {
        path: "registry/example/animated-beam-bidirectional.tsx",
        type: "registry:example",
        target: "components/animated-beam-bidirectional.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import(
        "@/registry/example/animated-beam-bidirectional.tsx"
      );
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "animated-beam-multiple-inputs": {
    name: "animated-beam-multiple-inputs",
    description: "Example showing animated beams with multiple input points.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/animated-beam"],
    files: [
      {
        path: "registry/example/animated-beam-multiple-inputs.tsx",
        type: "registry:example",
        target: "components/animated-beam-multiple-inputs.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import(
        "@/registry/example/animated-beam-multiple-inputs.tsx"
      );
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "animated-beam-multiple-outputs": {
    name: "animated-beam-multiple-outputs",
    description: "Example showing animated beams with multiple output points.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/animated-beam"],
    files: [
      {
        path: "registry/example/animated-beam-multiple-outputs.tsx",
        type: "registry:example",
        target: "components/animated-beam-multiple-outputs.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import(
        "@/registry/example/animated-beam-multiple-outputs.tsx"
      );
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "text-reveal-demo": {
    name: "text-reveal-demo",
    description: "Example showing text that fades in on scroll.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/text-reveal"],
    files: [
      {
        path: "registry/example/text-reveal-demo.tsx",
        type: "registry:example",
        target: "components/text-reveal-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/text-reveal-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "animated-gradient-text-demo": {
    name: "animated-gradient-text-demo",
    description: "Example showing text with animated gradient backgrounds.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/animated-gradient-text"],
    files: [
      {
        path: "registry/example/animated-gradient-text-demo.tsx",
        type: "registry:example",
        target: "components/animated-gradient-text-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import(
        "@/registry/example/animated-gradient-text-demo.tsx"
      );
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "animated-gradient-text-demo-2": {
    name: "animated-gradient-text-demo-2",
    description:
      "Second example showing text with animated gradient backgrounds.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/animated-gradient-text"],
    files: [
      {
        path: "registry/example/animated-gradient-text-demo-2.tsx",
        type: "registry:example",
        target: "components/animated-gradient-text-demo-2.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import(
        "@/registry/example/animated-gradient-text-demo-2.tsx"
      );
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "orbiting-circles-demo": {
    name: "orbiting-circles-demo",
    description: "Example showing circles moving in orbital paths.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/orbiting-circles"],
    files: [
      {
        path: "registry/example/orbiting-circles-demo.tsx",
        type: "registry:example",
        target: "components/orbiting-circles-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/orbiting-circles-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "dock-demo": {
    name: "dock-demo",
    description: "Example showing a MacOS-style dock implementation.",
    type: "registry:example",
    registryDependencies: ["button", "https://magicui.design/r/dock"],
    files: [
      {
        path: "registry/example/dock-demo.tsx",
        type: "registry:example",
        target: "components/dock-demo.tsx",
      },
      {
        path: "registry/magicui/mode-toggle.tsx",
        type: "registry:ui",
        target: "components/magicui/mode-toggle.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/dock-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "dock-demo-2": {
    name: "dock-demo-2",
    description: "Second example showing a MacOS-style dock implementation.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/dock"],
    files: [
      {
        path: "registry/example/dock-demo-2.tsx",
        type: "registry:example",
        target: "components/dock-demo-2.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/dock-demo-2.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "dock-demo-3": {
    name: "dock-demo-3",
    description: "Third example showing a MacOS-style dock implementation.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/dock"],
    files: [
      {
        path: "registry/example/dock-demo-3.tsx",
        type: "registry:example",
        target: "components/dock-demo-3.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/dock-demo-3.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "word-rotate-demo": {
    name: "word-rotate-demo",
    description: "Example showing vertical word rotation animation.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/word-rotate"],
    files: [
      {
        path: "registry/example/word-rotate-demo.tsx",
        type: "registry:example",
        target: "components/word-rotate-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/word-rotate-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "hyper-text-demo": {
    name: "hyper-text-demo",
    description: "Example showing text with scrambling letter animations.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/hyper-text"],
    files: [
      {
        path: "registry/example/hyper-text-demo.tsx",
        type: "registry:example",
        target: "components/hyper-text-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/hyper-text-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "avatar-circles-demo": {
    name: "avatar-circles-demo",
    description: "Example showing overlapping avatar circles.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/avatar-circles"],
    files: [
      {
        path: "registry/example/avatar-circles-demo.tsx",
        type: "registry:example",
        target: "components/avatar-circles-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/avatar-circles-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "typing-animation-demo": {
    name: "typing-animation-demo",
    description: "Example showing typed character animations.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/typing-animation"],
    files: [
      {
        path: "registry/example/typing-animation-demo.tsx",
        type: "registry:example",
        target: "components/typing-animation-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/typing-animation-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "scroll-based-velocity-demo": {
    name: "scroll-based-velocity-demo",
    description: "Example showing text speed changes based on scroll velocity.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/scroll-based-velocity"],
    files: [
      {
        path: "registry/example/scroll-based-velocity-demo.tsx",
        type: "registry:example",
        target: "components/scroll-based-velocity-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import(
        "@/registry/example/scroll-based-velocity-demo.tsx"
      );
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "scratch-to-reveal-demo": {
    name: "scratch-to-reveal-demo",
    description: "Example showing an interactive scratch-off reveal effect.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/scratch-to-reveal"],
    files: [
      {
        path: "registry/example/scratch-to-reveal-demo.tsx",
        type: "registry:example",
        target: "components/scratch-to-reveal-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/scratch-to-reveal-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "flip-text-demo": {
    name: "flip-text-demo",
    description: "Example showing text with character flip animations.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/flip-text"],
    files: [
      {
        path: "registry/example/flip-text-demo.tsx",
        type: "registry:example",
        target: "components/flip-text-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/flip-text-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "sparkles-text-demo": {
    name: "sparkles-text-demo",
    description: "Example showing text with animated sparkle effects.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/sparkles-text"],
    files: [
      {
        path: "registry/example/sparkles-text-demo.tsx",
        type: "registry:example",
        target: "components/sparkles-text-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/sparkles-text-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "spinning-text-demo": {
    name: "spinning-text-demo",
    description: "Example showing spinning text animation.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/spinning-text"],
    files: [
      {
        path: "registry/example/spinning-text-demo.tsx",
        type: "registry:example",
        target: "components/spinning-text-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/spinning-text-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "spinning-text-demo-2": {
    name: "spinning-text-demo-2",
    description: "Example showing spinning text animation.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/spinning-text"],
    files: [
      {
        path: "registry/example/spinning-text-demo-2.tsx",
        type: "registry:example",
        target: "components/spinning-text-demo-2.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/spinning-text-demo-2.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "icon-cloud-demo": {
    name: "icon-cloud-demo",
    description: "Example showing an interactive 3D icon cloud.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/icon-cloud"],
    files: [
      {
        path: "registry/example/icon-cloud-demo.tsx",
        type: "registry:example",
        target: "components/icon-cloud-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/icon-cloud-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "icon-cloud-demo-2": {
    name: "icon-cloud-demo-2",
    description: "Second example showing an interactive 3D icon cloud.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/icon-cloud"],
    files: [
      {
        path: "registry/example/icon-cloud-demo-2.tsx",
        type: "registry:example",
        target: "components/icon-cloud-demo-2.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/icon-cloud-demo-2.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "icon-cloud-demo-3": {
    name: "icon-cloud-demo-3",
    description: "Third example showing an interactive 3D icon cloud.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/icon-cloud"],
    files: [
      {
        path: "registry/example/icon-cloud-demo-3.tsx",
        type: "registry:example",
        target: "components/icon-cloud-demo-3.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/icon-cloud-demo-3.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "text-animate-demo": {
    name: "text-animate-demo",
    description: "Example showing various text animations.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/text-animate"],
    files: [
      {
        path: "registry/example/text-animate-demo.tsx",
        type: "registry:example",
        target: "components/text-animate-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/text-animate-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "text-animate-demo-2": {
    name: "text-animate-demo-2",
    description: "Second example showing various text animations.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/text-animate"],
    files: [
      {
        path: "registry/example/text-animate-demo-2.tsx",
        type: "registry:example",
        target: "components/text-animate-demo-2.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/text-animate-demo-2.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "text-animate-demo-3": {
    name: "text-animate-demo-3",
    description: "Third example showing various text animations.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/text-animate"],
    files: [
      {
        path: "registry/example/text-animate-demo-3.tsx",
        type: "registry:example",
        target: "components/text-animate-demo-3.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/text-animate-demo-3.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "text-animate-demo-4": {
    name: "text-animate-demo-4",
    description: "Fourth example showing various text animations.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/text-animate"],
    files: [
      {
        path: "registry/example/text-animate-demo-4.tsx",
        type: "registry:example",
        target: "components/text-animate-demo-4.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/text-animate-demo-4.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "text-animate-demo-5": {
    name: "text-animate-demo-5",
    description: "Fifth example showing various text animations.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/text-animate"],
    files: [
      {
        path: "registry/example/text-animate-demo-5.tsx",
        type: "registry:example",
        target: "components/text-animate-demo-5.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/text-animate-demo-5.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "text-animate-demo-6": {
    name: "text-animate-demo-6",
    description: "Sixth example showing various text animations.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/text-animate"],
    files: [
      {
        path: "registry/example/text-animate-demo-6.tsx",
        type: "registry:example",
        target: "components/text-animate-demo-6.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/text-animate-demo-6.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "text-animate-demo-7": {
    name: "text-animate-demo-7",
    description: "Seventh example showing various text animations.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/text-animate"],
    files: [
      {
        path: "registry/example/text-animate-demo-7.tsx",
        type: "registry:example",
        target: "components/text-animate-demo-7.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/text-animate-demo-7.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "text-animate-demo-8": {
    name: "text-animate-demo-8",
    description: "Eighth example showing various text animations.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/text-animate"],
    files: [
      {
        path: "registry/example/text-animate-demo-8.tsx",
        type: "registry:example",
        target: "components/text-animate-demo-8.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/text-animate-demo-8.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "text-animate-demo-9": {
    name: "text-animate-demo-9",
    description: "Ninth example showing various text animations.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/text-animate"],
    files: [
      {
        path: "registry/example/text-animate-demo-9.tsx",
        type: "registry:example",
        target: "components/text-animate-demo-9.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/text-animate-demo-9.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "shiny-button-demo": {
    name: "shiny-button-demo",
    description: "Example showing a shiny button with dynamic styles.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/shiny-button"],
    files: [
      {
        path: "registry/example/shiny-button-demo.tsx",
        type: "registry:example",
        target: "components/shiny-button-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/shiny-button-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "box-reveal-demo": {
    name: "box-reveal-demo",
    description: "Example showing a sliding box text reveal animation.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/box-reveal"],
    files: [
      {
        path: "registry/example/box-reveal-demo.tsx",
        type: "registry:example",
        target: "components/box-reveal-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/box-reveal-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "animated-circular-progress-bar-demo": {
    name: "animated-circular-progress-bar-demo",
    description: "Example showing an animated circular progress gauge.",
    type: "registry:example",
    registryDependencies: [
      "https://magicui.design/r/animated-circular-progress-bar",
    ],
    files: [
      {
        path: "registry/example/animated-circular-progress-bar-demo.tsx",
        type: "registry:example",
        target: "components/animated-circular-progress-bar-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import(
        "@/registry/example/animated-circular-progress-bar-demo.tsx"
      );
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "shine-border-demo": {
    name: "shine-border-demo",
    description: "Example showing an animated shining border effect.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/shine-border"],
    files: [
      {
        path: "registry/example/shine-border-demo.tsx",
        type: "registry:example",
        target: "components/shine-border-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/shine-border-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "shine-border-demo-2": {
    name: "shine-border-demo-2",
    description: "Second example showing an animated shining border effect.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/shine-border"],
    files: [
      {
        path: "registry/example/shine-border-demo-2.tsx",
        type: "registry:example",
        target: "components/shine-border-demo-2.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/shine-border-demo-2.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "confetti-demo": {
    name: "confetti-demo",
    description: "Example showing confetti animations for celebrations.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/confetti"],
    files: [
      {
        path: "registry/example/confetti-demo.tsx",
        type: "registry:example",
        target: "components/confetti-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/confetti-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "confetti-basic-cannon": {
    name: "confetti-basic-cannon",
    description: "Example showing basic confetti cannon animation.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/confetti"],
    files: [
      {
        path: "registry/example/confetti-basic-cannon.tsx",
        type: "registry:example",
        target: "components/confetti-basic-cannon.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/confetti-basic-cannon.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "confetti-random-direction": {
    name: "confetti-random-direction",
    description: "Example showing confetti with random directions.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/confetti"],
    files: [
      {
        path: "registry/example/confetti-random-direction.tsx",
        type: "registry:example",
        target: "components/confetti-random-direction.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import(
        "@/registry/example/confetti-random-direction.tsx"
      );
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "confetti-fireworks": {
    name: "confetti-fireworks",
    description: "Example showing fireworks-style confetti animation.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/confetti"],
    files: [
      {
        path: "registry/example/confetti-fireworks.tsx",
        type: "registry:example",
        target: "components/confetti-fireworks.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/confetti-fireworks.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "confetti-stars": {
    name: "confetti-stars",
    description: "Example showing star-shaped confetti animation.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/confetti"],
    files: [
      {
        path: "registry/example/confetti-stars.tsx",
        type: "registry:example",
        target: "components/confetti-stars.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/confetti-stars.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "confetti-side-cannons": {
    name: "confetti-side-cannons",
    description: "Example showing side-mounted confetti cannons.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/confetti"],
    files: [
      {
        path: "registry/example/confetti-side-cannons.tsx",
        type: "registry:example",
        target: "components/confetti-side-cannons.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/confetti-side-cannons.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "confetti-custom-shapes": {
    name: "confetti-custom-shapes",
    description: "Example showing confetti with custom shape particles.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/confetti"],
    files: [
      {
        path: "registry/example/confetti-custom-shapes.tsx",
        type: "registry:example",
        target: "components/confetti-custom-shapes.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/confetti-custom-shapes.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "confetti-emoji": {
    name: "confetti-emoji",
    description: "Example showing confetti with emoji particles.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/confetti"],
    files: [
      {
        path: "registry/example/confetti-emoji.tsx",
        type: "registry:example",
        target: "components/confetti-emoji.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/confetti-emoji.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "animated-subscribe-button-demo": {
    name: "animated-subscribe-button-demo",
    description:
      "Example showing an animated subscribe button with micro animations.",
    type: "registry:example",
    registryDependencies: [
      "https://magicui.design/r/animated-subscribe-button",
    ],
    files: [
      {
        path: "registry/example/animated-subscribe-button-demo.tsx",
        type: "registry:example",
        target: "components/animated-subscribe-button-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import(
        "@/registry/example/animated-subscribe-button-demo.tsx"
      );
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "cool-mode-demo": {
    name: "cool-mode-demo",
    description: "Example showing cool mode effect for buttons and links.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/cool-mode"],
    files: [
      {
        path: "registry/example/cool-mode-demo.tsx",
        type: "registry:example",
        target: "components/cool-mode-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/cool-mode-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "cool-mode-custom": {
    name: "cool-mode-custom",
    description: "Example showing customized cool mode effects.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/cool-mode"],
    files: [
      {
        path: "registry/example/cool-mode-custom.tsx",
        type: "registry:example",
        target: "components/cool-mode-custom.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/cool-mode-custom.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "pulsating-button-demo": {
    name: "pulsating-button-demo",
    description: "Example showing an animated pulsating button.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/pulsating-button"],
    files: [
      {
        path: "registry/example/pulsating-button-demo.tsx",
        type: "registry:example",
        target: "components/pulsating-button-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/pulsating-button-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "ripple-button-demo": {
    name: "ripple-button-demo",
    description: "Example showing an animated button with ripple effect.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/ripple-button"],
    files: [
      {
        path: "registry/example/ripple-button-demo.tsx",
        type: "registry:example",
        target: "components/ripple-button-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/ripple-button-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "file-tree-demo": {
    name: "file-tree-demo",
    description:
      "Example showing a component that displays folder and file structure.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/file-tree"],
    files: [
      {
        path: "registry/example/file-tree-demo.tsx",
        type: "registry:example",
        target: "components/file-tree-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/file-tree-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "blur-fade-demo": {
    name: "blur-fade-demo",
    description: "Example showing blur fade in and out animations.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/blur-fade"],
    files: [
      {
        path: "registry/example/blur-fade-demo.tsx",
        type: "registry:example",
        target: "components/blur-fade-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/blur-fade-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "blur-fade-text-demo": {
    name: "blur-fade-text-demo",
    description: "Example showing blur fade animations with text.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/blur-fade"],
    files: [
      {
        path: "registry/example/blur-fade-text-demo.tsx",
        type: "registry:example",
        target: "components/blur-fade-text-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/blur-fade-text-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "safari-demo": {
    name: "safari-demo",
    description: "Example showing a Safari browser mockup.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/safari"],
    files: [
      {
        path: "registry/example/safari-demo.tsx",
        type: "registry:example",
        target: "components/safari-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/safari-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "safari-demo-2": {
    name: "safari-demo-2",
    description: "Second example showing a Safari browser mockup.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/safari"],
    files: [
      {
        path: "registry/example/safari-demo-2.tsx",
        type: "registry:example",
        target: "components/safari-demo-2.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/safari-demo-2.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "safari-demo-3": {
    name: "safari-demo-3",
    description: "Third example showing a Safari browser mockup.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/safari"],
    files: [
      {
        path: "registry/example/safari-demo-3.tsx",
        type: "registry:example",
        target: "components/safari-demo-3.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/safari-demo-3.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "safari-demo-4": {
    name: "safari-demo-4",
    description: "Fourth example showing a Safari browser mockup.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/safari"],
    files: [
      {
        path: "registry/example/safari-demo-4.tsx",
        type: "registry:example",
        target: "components/safari-demo-4.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/safari-demo-4.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "iphone-15-pro-demo": {
    name: "iphone-15-pro-demo",
    description: "Example showing an iPhone 15 Pro mockup.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/iphone-15-pro"],
    files: [
      {
        path: "registry/example/iphone-15-pro-demo.tsx",
        type: "registry:example",
        target: "components/iphone-15-pro-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/iphone-15-pro-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "iphone-15-pro-demo-2": {
    name: "iphone-15-pro-demo-2",
    description: "Second example showing an iPhone 15 Pro mockup.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/iphone-15-pro"],
    files: [
      {
        path: "registry/example/iphone-15-pro-demo-2.tsx",
        type: "registry:example",
        target: "components/iphone-15-pro-demo-2.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/iphone-15-pro-demo-2.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "iphone-15-pro-demo-3": {
    name: "iphone-15-pro-demo-3",
    description: "Third example showing an iPhone 15 Pro mockup.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/iphone-15-pro"],
    files: [
      {
        path: "registry/example/iphone-15-pro-demo-3.tsx",
        type: "registry:example",
        target: "components/iphone-15-pro-demo-3.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/iphone-15-pro-demo-3.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "rainbow-button-demo": {
    name: "rainbow-button-demo",
    description: "Example showing an animated button with rainbow effect.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/rainbow-button"],
    files: [
      {
        path: "registry/example/rainbow-button-demo.tsx",
        type: "registry:example",
        target: "components/rainbow-button-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/rainbow-button-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "interactive-hover-button-demo": {
    name: "interactive-hover-button-demo",
    description: "Example showing an interactive button with hover effects.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/interactive-hover-button"],
    files: [
      {
        path: "registry/example/interactive-hover-button-demo.tsx",
        type: "registry:example",
        target: "components/interactive-hover-button-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import(
        "@/registry/example/interactive-hover-button-demo.tsx"
      );
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  "terminal-demo": {
    name: "terminal-demo",
    description: "Example showing a terminal with animated text.",
    type: "registry:example",
    registryDependencies: ["https://magicui.design/r/terminal"],
    files: [
      {
        path: "registry/example/terminal-demo.tsx",
        type: "registry:example",
        target: "components/terminal-demo.tsx",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/example/terminal-demo.tsx");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
  utils: {
    name: "utils",
    description: "",
    type: "registry:lib",
    registryDependencies: undefined,
    files: [
      {
        path: "registry/lib/utils.ts",
        type: "registry:lib",
        target: "",
      },
    ],
    component: React.lazy(async () => {
      const mod = await import("@/registry/lib/utils.ts");
      const exportName =
        Object.keys(mod).find(
          (key) =>
            typeof mod[key] === "function" || typeof mod[key] === "object",
        ) || item.name;
      return { default: mod.default || mod[exportName] };
    }),
    meta: undefined,
  },
};