Components
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.
Loading preview...
"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>
);
}