Milton Gonzalez
1d22adc42e
Backend (Express + MariaDB) y frontend (React + Vite, identidad Fluent/Windows) con el nucleo funcional: seguridad, organizacion, proyectos, actividades, subtareas, dependencias, dashboard, calendario, gantt, comentarios, adjuntos, notificaciones in-app y catalogos. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
20 lines
714 B
React
20 lines
714 B
React
import { useState } from 'react';
|
|
import { ChevronRight } from 'lucide-react';
|
|
|
|
export function Expander({ icon: Icon, title, description, defaultOpen = false, children }) {
|
|
const [open, setOpen] = useState(defaultOpen);
|
|
return (
|
|
<div className={`expander ${open ? 'open' : ''}`}>
|
|
<div className="expander-header" onClick={() => setOpen((v) => !v)}>
|
|
{Icon && <Icon size={18} />}
|
|
<div>
|
|
<div className="expander-title">{title}</div>
|
|
{description && <div className="expander-desc">{description}</div>}
|
|
</div>
|
|
<ChevronRight className="chevron" size={16} />
|
|
</div>
|
|
{open && <div className="expander-body">{children}</div>}
|
|
</div>
|
|
);
|
|
}
|