{
  "name": "bars-scale-01-scale",
  "type": "registry:ui",
  "tier": "free",
  "dependencies": [
    "framer-motion"
  ],
  "registryDependencies": [
    "https://www.craftui.space/r/craftui-base.json"
  ],
  "files": [
    {
      "path": "components/craftui/loaders/bars-scale-01/scale.tsx",
      "content": "'use client';\n\nimport { motion } from 'motion/react';\n\ninterface BarsScaleProps {\n  width?: number;\n  height?: number;\n  color?: string;\n  gap?: number;\n  isAnimating?: boolean;\n  duration?: number;\n  ease?: any;\n  staggerDelay?: number;\n}\n\nexport function BarsScale({\n  width = 40,\n  height = 40,\n  color = \"currentColor\",\n  gap = 4,\n  isAnimating = true,\n  duration = 1.0,\n  ease = 'easeInOut',\n  staggerDelay = 0.15,\n}: BarsScaleProps) {\n  const barWidth = (width - gap * 2) / 3;\n  \n  return (\n    <svg\n      width={width}\n      height={height}\n      viewBox={`0 0 ${width} ${height}`}\n      fill=\"none\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n    >\n      {[0, 1, 2].map((index) => (\n        <motion.rect\n          key={index}\n          x={index * (barWidth + gap)}\n          y={height / 4}\n          width={barWidth}\n          height={height / 2}\n          fill={color}\n          animate={{\n            scaleY: [1, 0.5, 1],\n            y: [height / 4, height / 2 - height / 8, height / 4]\n          }}\n          transition={{\n            duration: duration,\n            repeat: isAnimating ? Infinity : 0,\n            ease: ease,\n            delay: index * staggerDelay\n          }}\n        />\n      ))}\n    </svg>\n  );\n}",
      "type": "registry:ui",
      "target": "~/components/craftui/loaders/bars-scale-01/scale.tsx"
    }
  ],
  "meta": {
    "displayName": "Bars Scale - Bars Scale",
    "description": "Three vertical bars scaling up and down with sequential animation",
    "category": "loaders",
    "tags": [
      "bars",
      "loading",
      "scale",
      "vertical"
    ],
    "animationType": "loop"
  }
}