Value Proposition Generator

Value Proposition Generator

Clearly articulate why a customer should choose your product.

Core Components

Generated Value Propositions

Your unique value propositions will appear here.

${prop}

`; elements.propositionsContainer.appendChild(card); }); document.querySelectorAll('.copy-btn').forEach(btn => { btn.addEventListener('click', handleCopy); }); elements.resultsPlaceholder.classList.add('hidden'); elements.resultsContainer.classList.remove('hidden'); } function setLoadingState(isLoading) { elements.generateBtn.disabled = isLoading; if (isLoading) { elements.generateBtn.innerHTML = `Generating...`; elements.resultsContainer.classList.add('hidden'); elements.resultsPlaceholder.classList.remove('hidden'); elements.resultsPlaceholder.innerHTML = `

Defining Your Value...

`; } else { elements.generateBtn.innerHTML = `Generate Value Propositions`; } } function displayError(message) { elements.resultsPlaceholder.innerHTML = `

Generation Failed

${message}

`; elements.resultsPlaceholder.classList.remove('hidden'); elements.resultsContainer.classList.add('hidden'); } function handleCopy(e) { const button = e.currentTarget; const propText = button.closest('.proposition-card').querySelector('p').textContent; navigator.clipboard.writeText(propText).then(() => { const originalText = button.innerHTML; button.innerHTML = `Copied!`; setTimeout(() => { button.innerHTML = originalText; }, 2000); }).catch(err => console.error('Failed to copy: ', err)); } // --- PDF Generation --- function generatePdf() { if (!generationResult) return; const { jsPDF } = window.jspdf; const doc = new jsPDF(); doc.setFont('helvetica', 'bold'); doc.setFontSize(18); doc.text("Value Proposition Report", doc.internal.pageSize.getWidth() / 2, 20, { align: 'center' }); doc.setFontSize(11); doc.setTextColor(100); doc.text(`Generated on: ${new Date().toLocaleDateString('en-US')}`, 14, 30); const { details, propositions } = generationResult; const criteriaBody = [ ['Product Name', details.name], ['Target Customer', details.customer], ['Customer Problem', details.problem], ['Key Benefit', details.benefit], ['Differentiator', details.unique], ]; doc.autoTable({ startY: 35, head: [['Input Component', 'Value']], body: criteriaBody, theme: 'striped', headStyles: { fillColor: '#4f46e5' } }); const propositionsBody = propositions.map(p => [p]); doc.autoTable({ startY: doc.autoTable.previous.finalY + 10, head: [['Generated Value Proposition']], body: propositionsBody, theme: 'grid' }); doc.save(`value-proposition-report.pdf`); } initialize(); });
Scroll to Top