Start with the work. Trace it back to the maker and method.

// components/ui/scales.tsx import { cn } from "@/lib/utils"; import React from "react"; export interface ScalesProps { orientation?: "horizontal" |…

// components/ui/ascii-art.tsx "use client"; import React, { useEffect, useLayoutEffect, useRef, useState, useCallback, useId, } from "react"; impor…

// components/ui/3d-globe.tsx "use client"; import React, { useRef, useMemo, useState, useCallback, Suspense } from "react"; import { Canvas, useFra…

// components/ui/keyboard.tsx "use client"; import React, { createContext, useContext, useEffect, useRef, useState, useCallback, } from "react"; imp…

// components/ui/dither-shader.tsx "use client"; import React, { useEffect, useRef, useCallback, useState } from "react"; import { cn } from "@/lib/…

// components/ui/dotted-glow-background.tsx "use client"; import React, { useEffect, useRef, useState } from "react"; type DottedGlowBackgroundProps…

// components/ui/sticky-banner.tsx "use client"; import React, { SVGProps, useState } from "react"; import { motion, useMotionValueEvent, useScroll …

// components/ui/draggable-card.tsx "use client"; import { cn } from "@/lib/utils"; import React, { useRef, useState, useEffect } from "react"; impo…

// components/ui/resizable-navbar.tsx "use client"; import { cn } from "@/lib/utils"; import { IconMenu2, IconX } from "@tabler/icons-react"; import…

// components/ui/glowing-effect.tsx "use client"; import { memo, useCallback, useEffect, useRef } from "react"; import { cn } from "@/lib/utils"; im…

// components/ui/spotlight-new.tsx "use client"; import React from "react"; import { motion } from "motion/react"; type SpotlightProps = { gradientF…

// components/ui/magnetic-button.tsx "use client"; import React, { useRef, useState } from "react"; import { motion } from "motion/react"; export co…

// components/ui/carousel.tsx "use client"; import { IconArrowNarrowRight } from "@tabler/icons-react"; import { useState, useRef, useId, useEffect …

// components/ui/code-block.tsx "use client"; import React from "react"; import { Prism as SyntaxHighlighter } from "react-syntax-highlighter"; impo…

// components/ui/animated-testimonials.tsx "use client"; import { IconArrowLeft, IconArrowRight } from "@tabler/icons-react"; import { motion, Anima…

// components/ui/lens.tsx "use client"; import React, { useRef, useState } from "react"; import { AnimatePresence, motion } from "motion/react"; int…

// components/ui/background-beams-with-collision.tsx "use client"; import { cn } from "@/lib/utils"; import { motion, AnimatePresence } from "motion…

// components/ui/floating-dock.tsx "use client"; /** * Note: Use position fixed according to your needs * Desktop navbar is better positioned at the…

// components/ui/card-spotlight.tsx "use client"; import { useMotionValue, motion, useMotionTemplate } from "motion/react"; import React, { MouseEve…

// components/ui/animated-modal.tsx "use client"; import { cn } from "@/lib/utils"; import { AnimatePresence, motion } from "motion/react"; import R…

// components/ui/glare-card.tsx "use client"; import { cn } from "@/lib/utils"; import { useRef } from "react"; export const GlareCard = ({ children…

// components/ui/link-preview.tsx "use client"; import * as HoverCardPrimitive from "@radix-ui/react-hover-card"; import { encode } from "qss"; impo…

// components/ui/flip-words.tsx "use client"; import React, { useCallback, useEffect, useRef, useState } from "react"; import { AnimatePresence, mot…

// components/ui/aurora-background.tsx "use client"; import { cn } from "@/lib/utils"; import React, { ReactNode } from "react"; interface AuroraBac…