Can I vibe code OptinMonster?

Build a lightweight, zero-dependency Vanilla JavaScript overlay script and backend handling endpoint to capture email leads on an e-commerce storefront.

1. FRONTEND SNIPPET (vanilla-lead-capture.js):
- Create a single closure that injects a hidden, fully accessible HTML5 <dialog> element into the DOM.
- Implement three triggering mechanisms: (a) Exit intent: detect mouse Y-position velocity moving off the top of the browser viewport; (b) Time delay: configurable timer (e.g., 8 seconds); (c) Scroll depth: fire when page scroll reaches 50%.
- Add frequency capping logic using localStorage. Once a user closes or submits the modal, suppress showing it again for 30 days.
- Include accessible keyboard traps (Escape key closes, tab focus remains inside modal) and an explicit close button.
- Design a clean, responsive modal using scoped inline CSS to avoid conflicting with store themes. Include headline, body text, email input field, submit button, and status messaging (loading, success, error).

2. CLIENT-SIDE EVENT LOGIC:
- Submit email address asynchronously via fetch POST to `/api/capture-lead`.
- Validate email format before dispatch using standard regex.
- Render immediate success message and auto-close the modal after 3 seconds on success.

3. BACKEND API ROUTE (Next.js / Node.js handler):
- Accept POST requests containing email, site_source, and trigger_type.
- Enforce rate-limiting per IP address to prevent spam bots.
- Authenticate and forward the lead payload to Klaviyo API (v3 `/api/profile-import` or `/api/events`) using server-side API keys stored in environment variables.
- Return strict JSON responses with HTTP status codes (200 for success, 400 for bad input, 429 for rate limit).

4. FAILURE MODES & OUT OF SCOPE:
- Handle network timeouts gracefully by displaying a fallback user error inside the modal without throwing uncaught console exceptions.
- Ignore exit-intent logic on mobile devices; fall back strictly to time-delay or scroll-depth on touch screens.
- Do NOT build a visual drag-and-drop editor or complex administrative UI. All settings (delay time, expiry days, API endpoints) must be configured via a clean JS config object.

$ each button prefixes agent-specific run instructions · build your own product, never copy proprietary code, trademarks or designs