{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "base-widget",
  "title": "Base Widget",
  "description": "base widgets component",
  "dependencies": [
    "framer-motion"
  ],
  "files": [
    {
      "path": "registry/widgets/base-widget.tsx",
      "content": "\"use client\"\n\nimport * as React from \"react\"\nimport { motion, type HTMLMotionProps, type Variants } from \"framer-motion\"\nimport { cn } from \"@/lib/utils\"\n\ninterface GlassWidgetBaseProps extends Omit<HTMLMotionProps<\"div\">, \"children\"> {\n  children: React.ReactNode\n  size?: \"sm\" | \"md\" | \"lg\" | \"xl\"\n  glowEffect?: boolean\n  glowColor?: \"cyan\" | \"purple\" | \"blue\" | \"pink\" | \"green\" | \"amber\" | \"red\"\n  hoverScale?: boolean\n  interactive?: boolean\n}\n\nconst sizeClasses = {\n  sm: \"p-3\",\n  md: \"p-4\",\n  lg: \"p-5\",\n  xl: \"p-6\",\n}\n\nconst glowColors = {\n  cyan: \"from-cyan-500/30 via-blue-500/30 to-purple-500/30\",\n  purple: \"from-purple-500/30 via-pink-500/30 to-purple-500/30\",\n  blue: \"from-blue-500/30 via-indigo-500/30 to-blue-500/30\",\n  pink: \"from-pink-500/30 via-rose-500/30 to-pink-500/30\",\n  green: \"from-emerald-500/30 via-teal-500/30 to-emerald-500/30\",\n  amber: \"from-amber-500/30 via-orange-500/30 to-amber-500/30\",\n  red: \"from-red-500/30 via-rose-500/30 to-red-500/30\",\n}\n\nconst widgetVariants = {\n  hidden: { opacity: 0, y: 20, scale: 0.95 },\n  visible: {\n    opacity: 1,\n    y: 0,\n    scale: 1,\n    transition: {\n      type: \"spring\",\n      visualDuration: 0.4,\n      bounce: 0.2,\n    },\n  },\n  hover: {\n    y: -2,\n    transition: {\n      type: \"spring\",\n      visualDuration: 0.3,\n      bounce: 0.4,\n    },\n  },\n} as const\n\nconst glowVariants: Variants = {\n  initial: { opacity: 0.4, scale: 0.98 },\n  animate: {\n    opacity: [0.4, 0.6, 0.4] as number[],\n    scale: [0.98, 1, 0.98] as number[],\n    transition: {\n      duration: 4,\n      repeat: Number.POSITIVE_INFINITY,\n      ease: \"easeInOut\",\n    },\n  },\n  hover: {\n    opacity: 0.8,\n    scale: 1.02,\n    transition: {\n      type: \"spring\",\n      visualDuration: 0.3,\n      bounce: 0.3,\n    },\n  },\n}\n\nconst GlassWidgetBase = React.forwardRef<HTMLDivElement, GlassWidgetBaseProps>(\n  (\n    {\n      className,\n      children,\n      size = \"md\",\n      glowEffect = true,\n      glowColor = \"cyan\",\n      hoverScale = true,\n      interactive = true,\n      ...props\n    },\n    ref,\n  ) => {\n    return (\n      <motion.div\n        className=\"relative h-full\"\n        initial=\"hidden\"\n        animate=\"visible\"\n        whileHover={interactive && hoverScale ? \"hover\" : undefined}\n        variants={widgetVariants}\n      >\n        {/* Glow effect */}\n        {glowEffect && (\n          <motion.div\n            className={cn(\"absolute -inset-0.5 rounded-2xl bg-linear-to-r blur-xl\", glowColors[glowColor])}\n            variants={glowVariants}\n            initial=\"initial\"\n            animate=\"animate\"\n            whileHover={interactive ? \"hover\" : undefined}\n            aria-hidden=\"true\"\n          />\n        )}\n\n        {/* Widget container */}\n        <motion.div\n          ref={ref}\n          className={cn(\n            \"relative h-full rounded-2xl border border-white/20\",\n            \"bg-white/10 backdrop-blur-xl\",\n            \"shadow-[0_8px_32px_rgba(0,0,0,0.37)]\",\n            // Inner highlight linear\n            \"before:absolute before:inset-0 before:rounded-2xl\",\n            \"before:bg-linear-to-b before:from-white/20 before:to-transparent before:pointer-events-none\",\n            // Inner shadow for depth\n            \"after:absolute after:inset-px after:rounded-[calc(1rem-1px)]\",\n            \"after:shadow-[inset_0_1px_1px_rgba(255,255,255,0.1)] after:pointer-events-none\",\n            sizeClasses[size],\n            className,\n          )}\n          role=\"article\"\n          {...props}\n        >\n          <div className=\"relative z-10 h-full\">{children}</div>\n        </motion.div>\n      </motion.div>\n    )\n  },\n)\nGlassWidgetBase.displayName = \"GlassWidgetBase\"\n\nexport { GlassWidgetBase }\nexport type { GlassWidgetBaseProps }\n",
      "type": "registry:ui"
    }
  ],
  "type": "registry:ui"
}