P4RS3LT0NGV3/templates/promptcraft.html

<div v-if="activeTab === 'promptcraft'" class="tab-content">
    <div class="transform-layout">
        <div class="transform-section promptcraft-section">
            <div class="section-header">
                <h3><i class="fas fa-wand-magic-sparkles"></i> PromptCraft <small>AI-assisted prompt mutation</small></h3>
            </div>

            <div class="input-section">
                <label>
                    Source Prompt
                    <textarea v-model="pcInput" placeholder="Enter your prompt to mutate..." rows="4"></textarea>
                </label>
            </div>

            <div v-if="pcGetLexemeAnalysis().totalFindings" class="lexeme-analysis-card">
                <div class="lexeme-analysis-header">
                    <div>
                        <div class="lexeme-analysis-kicker">Latin-Root Analysis</div>
                        <h4>{{ pcGetLexemeAnalysis().summary }}</h4>
                        <p>This input contains affix patterns that skew toward destructive or lethal framing. Use the generated rewrites to neutralize tone before mutation.</p>
                    </div>
                    <button type="button" class="action-button copy lexeme-neutralize-btn" @click="pcNeutralizeInput">
                        <i class="fas fa-seedling"></i> Neutralize flagged terms
                    </button>
                </div>

                <div class="lexeme-analysis-list">
                    <div v-for="finding in pcGetLexemeAnalysis().findings" :key="finding.id" class="lexeme-analysis-item">
                        <div class="lexeme-analysis-item-top">
                            <div class="lexeme-analysis-term-group">
                                <code class="lexeme-term">{{ finding.term }}</code>
                                <span class="lexeme-chip">{{ finding.partOfSpeech }}</span>
                                <span class="lexeme-chip">{{ finding.affixes.join(', ') }}</span>
                                <span class="lexeme-chip">confidence {{ Math.round(finding.confidence * 100) }}%</span>
                            </div>
                            <div class="lexeme-analysis-domain">
                                <span v-if="finding.semanticDomain"><strong>Domain:</strong> {{ finding.semanticDomain }}</span>
                                <span v-else><strong>Domain:</strong> unresolved root</span>
                            </div>
                        </div>
                        <p class="lexeme-analysis-rationale">{{ finding.rationale }}</p>
                        <div class="lexeme-analysis-rewrites">
                            <button
                                v-for="rewrite in finding.rewrites"
                                :key="finding.id + '-' + rewrite"
                                type="button"
                                class="lexeme-rewrite-btn"
                                @click="pcApplyLexemeRewrite(finding.term, rewrite)"
                            >
                                {{ rewrite }}
                            </button>
                        </div>
                    </div>
                </div>
            </div>

            <div class="pc-controls">
                <div class="pc-strategies">
                    <div class="pc-label" id="pc-strategy-label">Strategy</div>
                    <div
                        class="pc-strategy-grid"
                        role="group"
                        aria-labelledby="pc-strategy-label"
                    >
                        <button
                            v-for="s in pcStrategies"
                            :key="s.id"
                            type="button"
                            @click="pcStrategy = s.id"
                            :class="['pc-strategy-btn', { active: pcStrategy === s.id }]"
                            :aria-pressed="pcStrategy === s.id ? 'true' : 'false'"
                            :title="s.desc"
                        >
                            <i :class="'fas ' + s.icon" aria-hidden="true"></i>
                            <span>{{ s.name }}</span>
                        </button>
                    </div>
                </div>

                <div v-if="pcStrategy === 'custom'" class="pc-custom-instruction">
                    <label>
                        Custom Mutation Instruction
                        <textarea v-model="pcCustomInstruction" placeholder="Describe how to mutate the prompt..." rows="2"></textarea>
                    </label>
                </div>

                <div class="options-grid pc-options">
                    <openrouter-model-select v-model="pcModel" label="Model"></openrouter-model-select>
                    <label>
                        Variants
                        <input type="number" v-model.number="pcCount" min="1" max="10" />
                    </label>
                    <label
                        class="slider-block"
                        title="Sampling randomness: lower is more deterministic, higher is more varied (OpenRouter 0–2)."
                    >
                        Temperature
                        <input
                            type="range"
                            v-model.number="pcTemperature"
                            min="0"
                            max="2"
                            step="0.05"
                        />
                        <span class="slider-value">{{ Number(pcTemperature).toFixed(2) }}</span>
                    </label>
                </div>
            </div>

            <div class="tool-toolbar">
                <button type="button" class="transform-button pc-generate-btn tool-primary-btn" @click="pcRunMutation" :disabled="pcLoading">
                    <i :class="pcLoading ? 'fas fa-spinner fa-spin' : 'fas fa-bolt'"></i>
                    {{ pcLoading ? 'Generating...' : 'Mutate Prompt' }}
                </button>
                <button class="action-button copy" v-if="pcOutputs.length" @click="pcCopyAll">
                    <i class="fas fa-copy"></i> Copy All
                </button>
            </div>

            <div v-if="pcError" class="pc-error">
                <i class="fas fa-exclamation-triangle"></i> {{ pcError }}
            </div>

            <div class="output-container" v-if="pcOutputs.length">
                <div class="pc-results">
                    <div v-for="(out, i) in pcOutputs" :key="'pc-'+i" class="pc-result-card">
                        <div class="pc-result-header">
                            <span class="pc-result-num">#{{ i + 1 }}</span>
                            <div class="pc-result-actions">
                                <button class="pc-action-btn" @click="pcUseAsInput(out)" title="Use as new input">
                                    <i class="fas fa-arrow-rotate-left"></i>
                                </button>
                                <button class="pc-action-btn" @click="pcCopyOutput(out)" title="Copy">
                                    <i class="fas fa-copy"></i>
                                </button>
                            </div>
                        </div>
                        <div class="pc-result-text">{{ out }}</div>
                    </div>
                </div>
            </div>

            <div v-if="!pcOutputs.length && !pcLoading && !pcError" class="pc-empty-state">
                <i class="fas fa-wand-magic-sparkles"></i>
                <p>Enter a prompt and choose a mutation strategy.</p>
                <p><small>Uses OpenRouter API — requires an API key set in Advanced Settings.</small></p>
            </div>
        </div>
    </div>
</div>