A dynamic UI component that simulates an interactive folder. Click to 'open' and reveal up to three items inside, which spread out. Items provide a subtle parallax effect on hover when open.
"use client"; import React from 'react'; import InteractiveFolder from "@/components/ui/interactive-folder" // Correct function declaration syntax: function ComponentName() { ... } export function SimpleFolderExample() { return ( <div className="flex items-center justify-center h-screen"> <InteractiveFolder cl={'#00d8ff'} it={[ <div key="1" className="p-2 text-black text-center rounded">Item 1</div>, <div key="2" className="p-2 text-black text-center rounded">Item 2</div>, <div key="3" className="p-2 text-black text-center rounded">Item 3</div>, ]} /> </div> ); }