← DOCS
inputs

DraggableDocument

Draggable paper/folder document with classification, stamp, and coffee stain.

npx chaos add draggable-document

PREVIEW

DOC

USAGE

case 'glass-button': return ; case 'neon-glow': return ; case 'floating-button': return ;
import { DraggableDocument } from '@oalacea/chaosui/inputs/draggable-document';

<DraggableDocument
  title="PROJET ÆTHER"
  classification="secret"
  stamp="VALIDÉ"
  reference="ÆTH-2024-001"
>
  <p>Confidential document content here...</p>
</DraggableDocument>

PROPS

PropTypeDefault
titleDocument title
string-
referenceReference number
string-
classificationClassification level
"public" | "confidentiel" | "secret" | "top-secret""confidentiel"
stampStamp text
string-
contentDocument content
ReactNode-
backContentBack content (revealed on double-click)
ReactNode-
initialPositionInitial position
{x: number; y: number}{x: 100, y: 100}