Purpose: Creation workflow UI for DreamNodes - inline editing in 3D space.
Parent feature: dreamnode/ (core types, services, persistence)
dreamnode-creator/
├── store/
│ └── slice.ts # Creation workflow state (DraftDreamNode, validation)
├── DreamNodeCreator3D.tsx # Main 3D creation component (self-contained)
├── index.ts # Barrel export
└── README.md
// Store (state management)
export * from './store/slice';
// → createCreationSlice, CreationSlice, DraftDreamNode, ValidationErrors
// Components
export { default as DreamNodeCreator3D } from './DreamNodeCreator3D';- Start:
startCreation(position)orstartCreationWithData(position, initialData) - Edit: User modifies title, type, uploads DreamTalk media
- Validate: Title required, <255 chars, no invalid filesystem characters
- Complete:
completeCreation()triggersGitDreamNodeService.create()in parent feature - Cancel:
cancelCreation()resets state
- DreamNodeCreator3D: Self-contained DreamNode creation UI
- Renders only when
creationState.isCreatingis true - Title input, type toggle (Dream/Dreamer), file upload
- Media preview: Images, videos, PDFs, YouTube thumbnails
- Completion animation: Slides z=-25 → z=-75 while fading UI
- Keyboard: Enter to create
- Renders only when
From dreamnode/:
dreamNodeStyles- Visual constants (dimensions, colors, glows)getNodeColors(),getNodeGlow()- Type-specific stylingisValidDreamTalkMedia()- Media file validation
External:
- React Three Fiber (
useFrame) @react-three/drei(Html)
When in liminal-web mode (viewing a DreamNode's connections), the creator could:
- Pre-fill relationship data based on current context
- Auto-suggest title based on parent DreamNode's content
- Position new node intelligently within the web layout
- Create with initial link to the focused DreamNode
This would transform creation from "make a thing" to "extend the conversation" - supporting the liminal web's social relationship model.