Optimized for: Gemini / ChatGPT / Claude
Advanced AI Prompt for Cascading Radix UI Dropdown Menus
Use this engineered prompt to drastically optimize your workflow and output.
Required Variables
- ✦
[HIERARCHY_LEVELS] - ✦
[DATA_STRUCTURE] - ✦
[OPEN_DELAY]
cascading-radix-dropdown-logic.txt
Create a deeply nested navigation system using Radix UI DropdownMenu with [HIERARCHY_LEVELS] levels of cascading submenus. Implement a [OPEN_DELAY] and 'hover intent' logic to prevent accidental submenu closing when moving the mouse diagonally. The [DATA_STRUCTURE] should be mapped recursively. Crucially, detail the keyboard interaction model: ensure Right Arrow opens submenus and Left Arrow closes them, following W3C standards. Include logic to handle submenus that might open off-screen.
Example Output
"The AI generates a recursive 'Submenu' component using DropdownMenu.Sub and DropdownMenu.SubContent, with optimized pointer-event handling for better UX."