# ShopProQuote Modal Click-Outside Behavior ## Default pattern (to REMOVE) ShopProQuote modals use this pattern to close on outside click: ```js // Close on outside click modal.addEventListener('click', (e) => { if (e.target === modal) { modal.classList.add('hidden'); // or closeModal() or modal.remove() } }); ``` Or for confirm dialogs in `shared/modal-manager.js`: ```js overlay.onclick = (e) => { if (e.target === overlay) { overlay.remove(); resolve(false); } }; ``` ## Finding all instances ```bash grep -rn "e\.target\s*===.*modal\|e\.target\s*===.*overlay" /mnt/seagate8tb/Websites/ShopProQuote/ ``` ## Locations (as of June 2026) | File | Context | |---|---| | `quote-tab-manager.js:1379` | Service edit modal — `modal.classList.add('hidden')` | | `quote-tab-manager.js:1680` | Parts availability modal — `closeModal()` | | `shared/customer-lookup.js:253` | Customer lookup modal — `modal.remove()` | | `settings.js:315` | Site settings modal — `closeModal()` | | `shared/modal-manager.js:328` | Confirm dialog overlay — `overlay.remove(); resolve(false)` | ## Fix Remove the entire `modal.addEventListener('click', ...)` block (or `overlay.onclick = ...` line) and replace with a comment: ```js // Click-outside-to-close disabled per user preference: only close via save or close button ``` ## What NOT to touch Dropdown menus (`ui.js`, `dashboard.js`, `repair-orders.js`, `financial-dashboard.js`, `shared/customer-lookup.js` search results) — these use the same pattern but closing on outside click is expected UX for dropdowns. Only disable for **modal dialogs**.