{
  "$schema": "https://ui.shadcn.com/schema/registry.json",
  "name": "uselayouts",
  "homepage": "https://uselayouts.com",
  "items": [
    {
      "name": "3d-book",
      "type": "registry:component",
      "title": "3D Book",
      "description": "An interactive 3D book component with page flip animations.",
      "dependencies": ["motion", "clsx", "tailwind-merge"],
      "files": [
        {
          "path": "registry/default/example/3d-book.tsx",
          "type": "registry:component"
        }
      ]
    },
    {
      "name": "animated-collection",
      "type": "registry:component",
      "title": "Animated Collection",
      "description": "A collection of items with smooth layout transitions and animations.",
      "dependencies": [
        "motion",
        "@hugeicons/core-free-icons",
        "@hugeicons/react",
        "clsx",
        "tailwind-merge"
      ],
      "files": [
        {
          "path": "registry/default/example/animated-collection.tsx",
          "type": "registry:component"
        }
      ]
    },
    {
      "name": "bottom-menu",
      "type": "registry:component",
      "title": "Bottom Menu",
      "description": "A floating bottom navigation menu with smooth interactions.",
      "dependencies": [
        "motion",
        "react-use-measure",
        "@hugeicons/core-free-icons",
        "@hugeicons/react",
        "clsx",
        "tailwind-merge"
      ],
      "files": [
        {
          "path": "registry/default/example/bottom-menu.tsx",
          "type": "registry:component"
        }
      ]
    },
    {
      "name": "day-picker",
      "type": "registry:component",
      "title": "Day Picker",
      "description": "A custom day picker component with smooth animations.",
      "dependencies": [
        "motion",
        "@hugeicons/core-free-icons",
        "@hugeicons/react",
        "clsx",
        "tailwind-merge"
      ],
      "files": [
        {
          "path": "registry/default/example/day-picker.tsx",
          "type": "registry:component"
        }
      ]
    },
    {
      "name": "delete-button",
      "type": "registry:component",
      "title": "Delete Button",
      "description": "A confirmation button with smooth icon transitions.",
      "dependencies": [
        "motion",
        "@hugeicons/core-free-icons",
        "@hugeicons/react",
        "clsx",
        "tailwind-merge"
      ],
      "files": [
        {
          "path": "registry/default/example/delete-button.tsx",
          "type": "registry:component"
        }
      ]
    },
    {
      "name": "discover-button",
      "type": "registry:component",
      "title": "Discover Button",
      "description": "An interactive button with expanding discovery state.",
      "dependencies": [
        "motion",
        "@hugeicons/core-free-icons",
        "@hugeicons/react",
        "clsx",
        "tailwind-merge"
      ],
      "files": [
        {
          "path": "registry/default/example/discover-button.tsx",
          "type": "registry:component"
        }
      ]
    },
    {
      "name": "discrete-tabs",
      "type": "registry:component",
      "title": "Discrete Tabs",
      "description": "A tab component with discrete sliding animations.",
      "dependencies": ["motion", "clsx", "tailwind-merge"],
      "files": [
        {
          "path": "registry/default/example/discrete-tabs.tsx",
          "type": "registry:component"
        }
      ]
    },
    {
      "name": "dynamic-toolbar",
      "type": "registry:component",
      "title": "Dynamic Toolbar",
      "description": "A toolbar that adapts its size and layout based on content.",
      "dependencies": [
        "motion",
        "@hugeicons/core-free-icons",
        "@hugeicons/react",
        "clsx",
        "tailwind-merge"
      ],
      "files": [
        {
          "path": "registry/default/example/dynamic-toolbar.tsx",
          "type": "registry:component"
        },
        {
          "path": "hooks/use-measure.tsx",
          "type": "registry:hook"
        }
      ]
    },
    {
      "name": "expandable-gallery",
      "type": "registry:component",
      "title": "Expandable Gallery",
      "description": "A photo gallery with smooth item expansion.",
      "dependencies": [
        "motion",
        "@hugeicons/core-free-icons",
        "@hugeicons/react",
        "clsx",
        "tailwind-merge"
      ],
      "registryDependencies": ["button"],
      "files": [
        {
          "path": "registry/default/example/expandable-gallery.tsx",
          "type": "registry:component"
        },
        {
          "path": "hooks/use-outside-click.ts",
          "type": "registry:hook"
        }
      ]
    },
    {
      "name": "feature-carousel",
      "type": "registry:component",
      "title": "Feature Carousel",
      "description": "A smooth carousel for showcasing product features.",
      "dependencies": [
        "motion",
        "@hugeicons/core-free-icons",
        "@hugeicons/react",
        "clsx",
        "tailwind-merge"
      ],
      "files": [
        {
          "path": "registry/default/example/feature-carousel.tsx",
          "type": "registry:component"
        }
      ]
    },
    {
      "name": "folder-interaction",
      "type": "registry:component",
      "title": "Folder Interaction",
      "description": "A folder management system with drag-and-drop-like feel.",
      "dependencies": [
        "motion",
        "@hugeicons/core-free-icons",
        "@hugeicons/react",
        "clsx",
        "tailwind-merge"
      ],
      "files": [
        {
          "path": "registry/default/example/folder-interaction.tsx",
          "type": "registry:component"
        }
      ]
    },
    {
      "name": "inline-edit",
      "type": "registry:component",
      "title": "Inline Edit",
      "description": "An input that switches between read and edit modes.",
      "dependencies": [
        "motion",
        "@hugeicons/core-free-icons",
        "@hugeicons/react",
        "clsx",
        "tailwind-merge"
      ],
      "registryDependencies": ["input"],
      "files": [
        {
          "path": "registry/default/example/inline-edit.tsx",
          "type": "registry:component"
        }
      ]
    },
    {
      "name": "list-item",
      "type": "registry:component",
      "title": "List Item",
      "description": "Interactive list items with hover and focus effects.",
      "dependencies": [
        "motion",
        "@hugeicons/core-free-icons",
        "@hugeicons/react",
        "clsx",
        "tailwind-merge"
      ],
      "files": [
        {
          "path": "registry/default/example/list-item.tsx",
          "type": "registry:component"
        }
      ]
    },
    {
      "name": "morphing-input",
      "type": "registry:component",
      "title": "Morphing Input",
      "description": "An input field that morphs between different states.",
      "dependencies": [
        "motion",
        "@hugeicons/core-free-icons",
        "@hugeicons/react",
        "clsx",
        "tailwind-merge"
      ],
      "registryDependencies": ["input"],
      "files": [
        {
          "path": "registry/default/example/morphing-input.tsx",
          "type": "registry:component"
        }
      ]
    },
    {
      "name": "multi-step-form",
      "type": "registry:component",
      "title": "Multi Step Form",
      "description": "A dynamic, animated multi-step form with validation.",
      "dependencies": [
        "motion",
        "date-fns",
        "react-hook-form",
        "@hookform/resolvers",
        "zod",
        "sonner",
        "lucide-react",
        "react-use-measure",
        "clsx",
        "tailwind-merge"
      ],
      "registryDependencies": [
        "card",
        "button",
        "input",
        "textarea",
        "select",
        "badge",
        "calendar",
        "popover"
      ],
      "files": [
        {
          "path": "registry/default/example/multi-step-form.tsx",
          "type": "registry:component"
        }
      ]
    },
    {
      "name": "pricing-card",
      "type": "registry:component",
      "title": "Pricing Card",
      "description": "A focused pricing card layout with clear hierarchy.",
      "dependencies": [
        "motion",
        "@hugeicons/core-free-icons",
        "@hugeicons/react",
        "lucide-react",
        "@number-flow/react",
        "clsx",
        "tailwind-merge"
      ],
      "files": [
        {
          "path": "registry/default/example/pricing-card.tsx",
          "type": "registry:component"
        }
      ]
    },
    {
      "name": "shake-testimonial-card",
      "type": "registry:component",
      "title": "Shake Testimonial Card",
      "description": "An eye-catching testimonial card with playful animations.",
      "dependencies": [
        "motion",
        "@hugeicons/core-free-icons",
        "@hugeicons/react",
        "clsx",
        "tailwind-merge"
      ],
      "files": [
        {
          "path": "registry/default/example/shake-testimonial-card.tsx",
          "type": "registry:component"
        }
      ]
    },
    {
      "name": "smooth-dropdown",
      "type": "registry:component",
      "title": "Smooth Dropdown",
      "description": "A dropdown menu with premium layout transitions.",
      "dependencies": [
        "motion",
        "@hugeicons/core-free-icons",
        "@hugeicons/react",
        "clsx",
        "tailwind-merge"
      ],
      "files": [
        {
          "path": "registry/default/example/smooth-dropdown.tsx",
          "type": "registry:component"
        }
      ]
    },
    {
      "name": "status-button",
      "type": "registry:component",
      "title": "Status Button",
      "description": "A button with animated states for idle, loading, and success.",
      "dependencies": [
        "motion",
        "@hugeicons/core-free-icons",
        "@hugeicons/react",
        "clsx",
        "tailwind-merge"
      ],
      "registryDependencies": ["button"],
      "files": [
        {
          "path": "registry/default/example/status-button.tsx",
          "type": "registry:component"
        }
      ]
    },
    {
      "name": "vertical-tabs",
      "type": "registry:component",
      "title": "Vertical Tabs",
      "description": "A vertical tab interaction with smooth content switching.",
      "dependencies": [
        "motion",
        "@hugeicons/core-free-icons",
        "@hugeicons/react",
        "clsx",
        "tailwind-merge"
      ],
      "files": [
        {
          "path": "registry/default/example/vertical-tabs.tsx",
          "type": "registry:component"
        }
      ]
    },
    {
      "name": "stacked-list",
      "type": "registry:component",
      "title": "Stacked List",
      "description": "An expandable list widget with a stacked layout and smooth morphing transitions.",
      "dependencies": [
        "motion",
        "@hugeicons/core-free-icons",
        "@hugeicons/react",
        "clsx",
        "tailwind-merge"
      ],
      "registryDependencies": ["input", "button"],
      "files": [
        {
          "path": "registry/default/example/stacked-list.tsx",
          "type": "registry:component"
        }
      ]
    },
    {
      "name": "bucket",
      "type": "registry:component",
      "title": "Bucket",
      "description": "An interactive card component that simulates a bucket where chips are tossed and replaced with smooth physics-inspired animations.",
      "dependencies": [
        "motion",
        "@hugeicons/core-free-icons",
        "@hugeicons/react",
        "clsx",
        "tailwind-merge"
      ],
      "files": [
        {
          "path": "registry/default/example/bucket.tsx",
          "type": "registry:component"
        },
        {
          "path": "hooks/use-mobile.ts",
          "type": "registry:hook"
        }
      ]
    },
    {
      "name": "fluid-expanding-grid",
      "type": "registry:component",
      "title": "Fluid Expanding Grid",
      "description": "A responsive gallery grid that fluidly shifts and expands items using motion layout.",
      "dependencies": ["motion", "clsx", "tailwind-merge"],
      "files": [
        {
          "path": "registry/default/example/fluid-expanding-grid.tsx",
          "type": "registry:component"
        }
      ]
    },
    {
      "name": "bento-card",
      "type": "registry:component",
      "title": "Bento Card",
      "description": "An interactive bento card with animated tabs and workspace preview.",
      "dependencies": [
        "motion",
        "@hugeicons/core-free-icons",
        "@hugeicons/react",
        "clsx",
        "tailwind-merge"
      ],
      "files": [
        {
          "path": "registry/default/example/bento-card.tsx",
          "type": "registry:component"
        }
      ]
    },
    {
      "name": "magnified-bento",
      "type": "registry:component",
      "title": "Magnified Bento",
      "description": "A bento card component with a draggable magnifying lens effect over scrolling chips.",
      "dependencies": [
        "motion",
        "@hugeicons/core-free-icons",
        "@hugeicons/react",
        "clsx",
        "tailwind-merge"
      ],
      "files": [
        {
          "path": "registry/default/example/magnified-bento.tsx",
          "type": "registry:component"
        }
      ]
    },
    {
      "name": "empty-testimonial",
      "type": "registry:component",
      "title": "Empty Testimonial",
      "description": "An interactive empty state for testimonials with a playful folder animation.",
      "dependencies": [
        "motion",
        "@hugeicons/core-free-icons",
        "@hugeicons/react",
        "clsx",
        "tailwind-merge"
      ],
      "files": [
        {
          "path": "registry/default/example/empty-testimonial.tsx",
          "type": "registry:component"
        }
      ]
    }
  ]
}