Interactive

Folder

A folder that opens on click: the flap tilts down and up to three papers fan out, leaning towards the pointer.
import { Folder } from "pleate/effects/folder";

Folders

Props

items

Up to three papers.

ReactNode[]

open / defaultOpen / onOpenChange

Controlled or uncontrolled.

booleandefault false

color

Folder color.

stringdefault var(--pl-accent)

size

Width in px.

numberdefault 120

label

Accessible name of the toggle.

stringdefault "Folder"

className

Extra classes on the root.

string

Accessibility

  • A toggle button with aria-expanded.
  • Paper content is hidden while closed.
  • Reduced motion opens without springs.