mirror of
https://github.com/pbakaus/impeccable.git
synced 2026-09-21 18:47:02 +03:00
Add /impeccable generate: agent-initiated live variants (Node-era squash)
Squash of the ten commits reviewed on PR #626, plus the last review round's connection-aware roll call, before the rebase onto the Rust engine: the generate command reference and router row, the overlay's agent-target handling (roll call, leases, replay, rescue), the Node-era live-server routes and live-generate CLI, the hook stand-down, the pricing cards e2e fixture, and the unit, contract, e2e, and skill-behavior tests. The server, CLI, hook, and pin halves are ported to the engine crates in the commits that follow. AI-assisted: implemented and tested with Claude Code under maintainer direction. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
Abdul Wahab
committed by
Abdul Wahab
Abdul Wahab
co-authored by
Claude Fable 5
Claude Fable 5
parent
1c043ea7c9
commit
fc89b0ed62
@@ -0,0 +1,11 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<title>Vite 8 + Pricing Cards Fixture</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="root"></div>
|
||||
<script type="module" src="/src/main.jsx"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,19 @@
|
||||
{
|
||||
"name": "vite8-react-pricing-cards-fixture",
|
||||
"private": true,
|
||||
"version": "0.0.0",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"dev": "vite --host 127.0.0.1",
|
||||
"build": "vite build",
|
||||
"preview": "vite preview"
|
||||
},
|
||||
"dependencies": {
|
||||
"react": "^19.0.0",
|
||||
"react-dom": "^19.0.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@vitejs/plugin-react": "^6.0.0",
|
||||
"vite": "^8.0.0"
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,30 @@
|
||||
const TIERS = [
|
||||
{ id: 'starter', name: 'Starter', price: '$19/mo', blurb: 'For a single project and one seat.' },
|
||||
{ id: 'studio', name: 'Studio', price: '$49/mo', blurb: 'For small teams shipping every week.' },
|
||||
{ id: 'atelier', name: 'Atelier', price: '$120/mo', blurb: 'For agencies running many brands.' },
|
||||
];
|
||||
|
||||
export default function App() {
|
||||
return (
|
||||
<main className="page">
|
||||
<section className="hero">
|
||||
<h1 className="hero-heading">A tall hero keeps the pricing far below the fold.</h1>
|
||||
<p className="hero-hook">
|
||||
The agent-target scenario must scroll the pricing section into view on its own.
|
||||
</p>
|
||||
</section>
|
||||
<section className="pricing" id="pricing">
|
||||
<h2 className="pricing-title">Simple pricing</h2>
|
||||
<div className="pricing-grid">
|
||||
{TIERS.map((tier) => (
|
||||
<article key={tier.id} className="pricing-card">
|
||||
<h3>{tier.name}</h3>
|
||||
<p className="tier-price">{tier.price}</p>
|
||||
<p>{tier.blurb}</p>
|
||||
</article>
|
||||
))}
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,10 @@
|
||||
import { StrictMode } from 'react';
|
||||
import { createRoot } from 'react-dom/client';
|
||||
import App from './App.jsx';
|
||||
import './styles.css';
|
||||
|
||||
createRoot(document.getElementById('root')).render(
|
||||
<StrictMode>
|
||||
<App />
|
||||
</StrictMode>,
|
||||
);
|
||||
@@ -0,0 +1,10 @@
|
||||
body { margin: 0; font-family: system-ui, sans-serif; color: #1d2229; }
|
||||
.page { max-width: 960px; margin: 0 auto; padding: 0 24px; }
|
||||
.hero { min-height: 160vh; display: flex; flex-direction: column; justify-content: center; }
|
||||
.hero-heading { font-size: 40px; max-width: 18ch; }
|
||||
.hero-hook { color: #55606e; }
|
||||
.pricing { padding: 80px 0 120px; }
|
||||
.pricing-title { font-size: 32px; }
|
||||
.pricing-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
|
||||
.pricing-card { border: 1px solid #d8dee7; border-radius: 10px; padding: 20px; }
|
||||
.tier-price { font-weight: 700; }
|
||||
@@ -0,0 +1,7 @@
|
||||
import { defineConfig } from 'vite';
|
||||
import react from '@vitejs/plugin-react';
|
||||
|
||||
export default defineConfig({
|
||||
plugins: [react()],
|
||||
server: { host: '127.0.0.1', strictPort: false },
|
||||
});
|
||||
@@ -0,0 +1,41 @@
|
||||
{
|
||||
"name": "Vite 8 + React + pricing cards below the fold (agent-initiated target)",
|
||||
"config": {
|
||||
"files": ["index.html"],
|
||||
"insertBefore": "</body>",
|
||||
"commentSyntax": "html"
|
||||
},
|
||||
"sourceFiles": ["index.html", "src/App.jsx", "src/main.jsx", "src/styles.css", "vite.config.js"],
|
||||
"generatedFiles": [],
|
||||
"wrapCases": [
|
||||
{
|
||||
"name": "wraps the below-the-fold pricing title in source JSX",
|
||||
"args": { "classes": "pricing-title", "tag": "h2" },
|
||||
"expectedFile": "src/App.jsx"
|
||||
}
|
||||
],
|
||||
"runtime": {
|
||||
"styling": "plain-css",
|
||||
"install": ["npm", "install", "--no-audit", "--no-fund", "--loglevel=error"],
|
||||
"devCommand": ["npx", "vite", "--host", "127.0.0.1"],
|
||||
"readyPattern": "Local:\\s+https?://[^:]+:(\\d+)",
|
||||
"readyTimeoutMs": 120000,
|
||||
"steer": false,
|
||||
"pickSelector": "h2.pricing-title",
|
||||
"acceptedSourcePattern": "<h2[^>]*(class|className)=\"[^\"]*\\bpricing-title\\b",
|
||||
"assertSourceContains": ["{tier.name}"],
|
||||
"agentTargetScenario": {
|
||||
"selector": "h2.pricing-title",
|
||||
"action": "bolder",
|
||||
"count": 3,
|
||||
"prompt": "keep it monochrome",
|
||||
"minScrollY": 300,
|
||||
"ambiguousSelector": ".pricing-card",
|
||||
"missSelector": ".does-not-exist"
|
||||
},
|
||||
"probe": {
|
||||
"expectLiveInit": true,
|
||||
"expectConsoleClean": true
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,4 @@
|
||||
node_modules/
|
||||
dist/
|
||||
.vite/
|
||||
package-lock.json
|
||||
Reference in New Issue
Block a user