- Updated the sub-navigation for the wizard to conditionally display step creation options based on the default state and available bundles.
- Improved the bundles page layout by categorizing steps into pre-invite, post-invite, and additional categories, enhancing user experience.
- Added orphaned step handling to allow users to remove steps that no longer have an associated entry.
- Displayed the associated wizard bundle name in the invite card if applicable.
- Adjusted JavaScript routing for bundle steps in the wizard.
- Modified the development script to set the NODE_ENV to development when installing npm dependencies, ensuring proper handling of devDependencies.
- Updated the subproject reference in the plus directory to indicate a dirty state.
Now supports multiple next buttons in interaction gating
Refactor the `attachInteractionGating` function to handle multiple "next" buttons, specifically for mobile and desktop versions.
The previous implementation only considered a single `#next-btn` element. This change updates it to find both `#wizard-next-btn` and `#wizard-next-btn-desktop`, allowing interaction gating to apply to all relevant next buttons.
A shared `enableAllButtons` function is introduced to ensure that once interaction is detected in the content, all next buttons are enabled simultaneously. Store button-specific handlers for proper cleanup.
Also, ensure the `attachInteractionGating` function is re-initialized after HTMX processes new content.
Add comprehensive "require interaction" functionality for wizard steps that prevents users from proceeding until they engage with step content.
## Key Features:
- **Database Integration**: New `require_interaction` boolean field in WizardStep model with migration
- **Frontend Gating**: Robust JavaScript system that disables "Next" button until user clicks links/buttons in step content
- **UI Enhancement**: Improved checkbox forms with clear descriptions and visual indicators
- **Event Handling**: Advanced interaction detection with proper HTMX disabling and event capture
- **Admin Interface**: Full integration with wizard configuration forms (main and simple)
- **Export/Import**: Support for require_interaction field in wizard step data operations
## Technical Implementation:
- Disabled button state management with pointer-events and tabindex control
- HTMX attribute manipulation to prevent premature navigation
- Event listener capture phase handling for reliable interaction blocking
- Comprehensive test coverage for interaction scenarios
- Form validation and user experience improvements
## Files Modified:
- Backend: models, routes, forms, services, migration
- Frontend: JavaScript interaction logic, templates, UI components
- Testing: Complete test suite for interaction requirements
This feature ensures users engage with critical wizard content before proceeding, improving onboarding experience and preventing accidental step skipping.
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>