Organization Tree Widget
Component Detail
User Interface
high complexity
frontend
0
Dependencies
1
Dependents
0
Entities
0
Integrations
Description
Reusable recursive React component that renders a single level of the organization hierarchy and recursively renders child nodes. Handles expand/collapse state, keyboard navigation (arrow keys, Enter, Space), and emits events for drag/move and inline editing actions.
org-tree-widget
Responsibilities
- Recursively render organization nodes and their children
- Manage expand/collapse state per node
- Emit move and edit events to parent page
- Ensure all interactive controls meet WCAG 2.2 AA keyboard and focus requirements
Interfaces
OrgTreeWidget({ node, depth, onMove, onEdit, onNavigate })
handleExpandToggle(orgId)
handleKeyDown(event, orgId)
handleDragStart(orgId)
handleDrop(targetId)
renderNodeActions(orgId)