@nextworks/blocks-templates 0.2.0-alpha.13 → 0.2.0-alpha.15

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (36) hide show
  1. package/README.md +3 -0
  2. package/dist/templates/aiworkflow/PresetThemeVars.d.ts +1 -6
  3. package/dist/templates/aiworkflow/PresetThemeVars.d.ts.map +1 -1
  4. package/dist/templates/aiworkflow/PresetThemeVars.jsx +1 -7
  5. package/dist/templates/aiworkflow/components/CTA.jsx +9 -9
  6. package/dist/templates/aiworkflow/components/Contact.d.ts.map +1 -1
  7. package/dist/templates/aiworkflow/components/Contact.jsx +10 -10
  8. package/dist/templates/aiworkflow/components/FAQ.d.ts.map +1 -1
  9. package/dist/templates/aiworkflow/components/FAQ.jsx +18 -18
  10. package/dist/templates/aiworkflow/components/FeatureMockups.d.ts +5 -0
  11. package/dist/templates/aiworkflow/components/FeatureMockups.d.ts.map +1 -0
  12. package/dist/templates/aiworkflow/components/FeatureMockups.jsx +442 -0
  13. package/dist/templates/aiworkflow/components/Features.d.ts.map +1 -1
  14. package/dist/templates/aiworkflow/components/Features.jsx +16 -14
  15. package/dist/templates/aiworkflow/components/Footer.d.ts.map +1 -1
  16. package/dist/templates/aiworkflow/components/Footer.jsx +13 -9
  17. package/dist/templates/aiworkflow/components/Hero.d.ts.map +1 -1
  18. package/dist/templates/aiworkflow/components/Hero.jsx +664 -416
  19. package/dist/templates/aiworkflow/components/Navbar.d.ts.map +1 -1
  20. package/dist/templates/aiworkflow/components/Navbar.jsx +13 -14
  21. package/dist/templates/aiworkflow/components/Pricing.d.ts.map +1 -1
  22. package/dist/templates/aiworkflow/components/Pricing.jsx +25 -21
  23. package/dist/templates/aiworkflow/components/ProcessTimeline.d.ts.map +1 -1
  24. package/dist/templates/aiworkflow/components/ProcessTimeline.jsx +15 -15
  25. package/dist/templates/aiworkflow/components/Testimonials.d.ts.map +1 -1
  26. package/dist/templates/aiworkflow/components/Testimonials.jsx +14 -10
  27. package/dist/templates/aiworkflow/components/TrustBadges.d.ts.map +1 -1
  28. package/dist/templates/aiworkflow/components/TrustBadges.jsx +14 -12
  29. package/dist/templates/aiworkflow/themes/default.d.ts +7 -0
  30. package/dist/templates/aiworkflow/themes/default.d.ts.map +1 -0
  31. package/dist/templates/aiworkflow/themes/default.jsx +9 -0
  32. package/dist/templates/gallery/PresetThemeVars.d.ts.map +1 -1
  33. package/dist/templates/gallery/PresetThemeVars.jsx +2 -0
  34. package/dist/templates/gallery/page.d.ts.map +1 -1
  35. package/dist/templates/gallery/page.jsx +381 -34
  36. package/package.json +3 -3
package/dist/templates/aiworkflow/components/Hero.jsx CHANGED
@@ -4,591 +4,839 @@
4
4
  import { HeroProductDemo } from "@nextworks/blocks-sections";
5
5
  const scenarios = [
6
6
  {
7
- key: "intake-triage",
8
- label: "Intake & triage",
9
- description: "AI turns (test ) revenue operations request into a routed workflow with approvals and live context.",
7
+ key: "fix-auth-flow",
8
+ label: "Coding agent",
9
+ description: "Choose a repo task and watch the agent inspect code, apply edits, and update the diff.",
10
10
  activeWindow: "workflowStudio",
11
+ playback: {
12
+ workflowStudio: {
13
+ playbackStepDurationsMs: [780, 860, 1480, 1120, 940, 760, 1720],
14
+ playbackResetDelayMs: 2200,
15
+ },
16
+ runConsole: {
17
+ playbackStepDurationsMs: [1260, 1540, 980, 760, 680, 620, 1380],
18
+ playbackResetDelayMs: 2200,
19
+ playbackStepEntryIndices: [0, 0, 1, 1, 2, 2, 2, 2, 3],
20
+ playbackStepVisibleLineCounts: [2, 2, 3, 4, 6, 9, 12, 15, 16],
21
+ },
22
+ },
23
+ taskList: {
24
+ window: {
25
+ key: "taskList",
26
+ title: "Tasks",
27
+ subtitle: "Current workspace",
28
+ status: { label: "3 tasks", tone: "info" },
29
+ },
30
+ title: "Agent tasks",
31
+ subtitle: "Select a coding task to inspect and execute.",
32
+ activeItemId: "fix-auth-flow",
33
+ items: [
34
+ {
35
+ id: "fix-auth-flow",
36
+ title: "Fix auth flow",
37
+ description: "Fix the post-login redirect after the OAuth callback.",
38
+ meta: "apps/web · active",
39
+ },
40
+ {
41
+ id: "refactor-pricing-page",
42
+ title: "Refactor pricing page",
43
+ description: "Extract repeated pricing sections into reusable components.",
44
+ meta: "marketing site · queued",
45
+ },
46
+ {
47
+ id: "ship-command-palette",
48
+ title: "Ship command palette",
49
+ description: "Add global search, shortcuts, and action routing.",
50
+ meta: "dashboard · ready",
51
+ },
52
+ ],
53
+ },
11
54
  workflowStudio: {
12
55
  window: {
13
56
  key: "workflowStudio",
14
- title: "Workflow Studio",
15
- subtitle: "Request intake",
16
- status: { label: "Drafting", tone: "info" },
17
- badge: "Scenario 01",
18
- layoutHint: {
19
- x: 0,
20
- y: 0,
21
- width: 62,
22
- height: 72,
23
- zIndex: 40,
24
- rotateDeg: -2,
25
- },
57
+ title: "Agent",
58
+ subtitle: "Active session",
59
+ status: { label: "Thinking", tone: "info" },
26
60
  },
27
- title: "New request → launch expansion campaign",
28
- subtitle: "AI maps triggers, owners, systems, and approval checkpoints before launch.",
29
- activeNodeId: "route-approval",
30
- activeRegionId: "handoffs",
31
- highlights: [
32
- { id: "route-approval", label: "Approval routing", tone: "accent" },
33
- { id: "crm-sync", label: "CRM sync", tone: "info" },
34
- ],
35
- nodes: [
61
+ title: "Investigating redirect bug",
62
+ subtitle: "The agent inspects the callback and prepares a safe patch.",
63
+ activeNodeId: "edit-callback",
64
+ transcript: [
65
+ { id: "auth-title", kind: "title", text: "Fix auth flow" },
36
66
  {
37
- id: "request-intake",
38
- label: "Parse request",
39
- description: "Extract goal, audience, budget, and timing from Slack.",
40
- type: "AI",
41
- status: "success",
42
- metadata: "Slack → structured brief",
67
+ id: "auth-prompt",
68
+ kind: "prompt",
69
+ text: "Fix the OAuth callback redirect so the app preserves the intended destination after sign-in.",
43
70
  },
44
71
  {
45
- id: "policy-check",
46
- label: "Check playbooks",
47
- description: "Validate budget thresholds and required approvers.",
48
- type: "Guardrail",
49
- status: "success",
50
- metadata: "Policy set v3.2",
72
+ id: "auth-read-1",
73
+ kind: "activity",
74
+ text: "Read app/auth/callback/page.tsx",
51
75
  },
52
76
  {
53
- id: "route-approval",
54
- label: "Route approval",
55
- description: "Send legal + finance review in parallel with due dates.",
56
- type: "Approval",
57
- status: "warning",
58
- active: true,
59
- emphasized: true,
60
- metadata: "2 approvers pending",
77
+ id: "auth-file-1",
78
+ kind: "file",
79
+ path: "app/auth/callback/page.tsx",
80
+ text: "app/auth/callback/page.tsx",
81
+ added: 14,
82
+ removed: 3,
61
83
  },
62
84
  {
63
- id: "crm-sync",
64
- label: "Update CRM",
65
- description: "Create campaign and account tasks once approved.",
66
- type: "Action",
67
- status: "neutral",
68
- metadata: "HubSpot + Salesforce",
85
+ id: "auth-file-2",
86
+ kind: "file",
87
+ path: "lib/auth/normalize-return-to.ts",
88
+ text: "lib/auth/normalize-return-to.ts",
89
+ added: 6,
90
+ removed: 1,
69
91
  },
70
- ],
71
- branches: [
72
92
  {
73
- id: "b1",
74
- fromNodeId: "request-intake",
75
- toNodeId: "policy-check",
76
- status: "success",
77
- active: true,
93
+ id: "auth-run-1",
94
+ kind: "activity",
95
+ text: "Run redirect scenarios for nested routes and invalid returnTo values",
78
96
  },
79
97
  {
80
- id: "b2",
81
- fromNodeId: "policy-check",
82
- toNodeId: "route-approval",
83
- label: "Budget > $25k",
84
- status: "warning",
85
- active: true,
98
+ id: "auth-thought-1",
99
+ kind: "thought",
100
+ text: "Preserve same-origin destinations, drop empty values, and avoid redirecting twice after the callback completes.",
86
101
  },
87
102
  {
88
- id: "b3",
89
- fromNodeId: "route-approval",
90
- toNodeId: "crm-sync",
91
- label: "On approval",
92
- status: "neutral",
103
+ id: "auth-message-1",
104
+ kind: "message",
105
+ text: "Patch keeps /dashboard/settings intact, falls back only when sanitize returns null, and records the redirect source for debugging.",
106
+ },
107
+ {
108
+ id: "auth-run-2",
109
+ kind: "activity",
110
+ text: "Prepare regression notes for auth loop and malformed path checks",
93
111
  },
94
112
  ],
95
- regions: [
113
+ composer: {
114
+ placeholder: "Plan, inspect, or patch the next issue...",
115
+ modeLabel: "Agent",
116
+ modelLabel: "Sonnet",
117
+ },
118
+ highlights: [
119
+ { id: "inspect-route", label: "Read files", tone: "info" },
120
+ { id: "edit-callback", label: "Write patch", tone: "accent" },
121
+ ],
122
+ nodes: [
96
123
  {
97
- id: "intake",
98
- label: "Intake",
99
- description: "AI request parsing and enrichment",
124
+ id: "inspect-route",
125
+ label: "Inspect auth callback",
126
+ description: "Read callback handler and post-login redirect logic.",
127
+ type: "Read",
100
128
  status: "success",
101
- nodeIds: ["request-intake", "policy-check"],
129
+ metadata: "app/auth/callback/page.tsx",
102
130
  },
103
131
  {
104
- id: "handoffs",
105
- label: "Handoffs",
106
- description: "Approval routing and downstream actions",
107
- status: "warning",
108
- nodeIds: ["route-approval", "crm-sync"],
132
+ id: "trace-session",
133
+ label: "Trace session state",
134
+ description: "Verify redirect target after token exchange completes.",
135
+ type: "Analyze",
136
+ status: "success",
137
+ metadata: "session + router state",
138
+ },
139
+ {
140
+ id: "edit-callback",
141
+ label: "Patch redirect handling",
142
+ type: "Edit",
143
+ status: "info",
109
144
  active: true,
110
- highlighted: true,
145
+ emphasized: true,
146
+ metadata: "drafting change set",
147
+ },
148
+ {
149
+ id: "run-checks",
150
+ label: "Run validation",
151
+ description: "Check for auth loop regression and invalid destination paths.",
152
+ type: "Verify",
153
+ status: "neutral",
154
+ metadata: "tests next",
111
155
  },
112
156
  ],
113
157
  },
114
158
  runConsole: {
115
159
  window: {
116
160
  key: "runConsole",
117
- title: "Live Run",
118
- subtitle: "Execution feed",
119
- status: { label: "Streaming", tone: "info" },
120
- badge: "24 events",
121
- layoutHint: {
122
- x: 50,
123
- y: 12,
124
- width: 44,
125
- height: 52,
126
- zIndex: 30,
127
- rotateDeg: 2,
128
- },
161
+ title: "Editor",
162
+ subtitle: "Live diff",
163
+ status: { label: "Updating", tone: "info" },
129
164
  },
130
- title: "AI orchestration log",
131
- subtitle: "Every step is visible, timed, and recoverable.",
132
- statusLabel: "Awaiting approvals",
133
- progressLabel: "3 of 5 steps complete",
134
- progressPercent: 64,
135
- activeEntryId: "log-3",
165
+ title: "app/auth/callback/page.tsx",
166
+ subtitle: "The diff updates as the agent writes the patch.",
167
+ statusLabel: "Applying patch",
168
+ progressLabel: "17 lines changed",
169
+ progressPercent: 68,
170
+ activeEntryId: "diff-3",
171
+ editorTabLabel: "page.tsx",
172
+ editorLanguage: "TypeScript",
173
+ editorSummary: "Guard empty return paths and preserve intended destination.",
136
174
  entries: [
137
175
  {
138
- id: "log-1",
139
- message: "Parsed inbound request from #revops-priority",
140
- timestamp: "09:14",
141
- source: "Slack",
176
+ id: "diff-1",
177
+ message: "Opened callback page and redirect helper",
178
+ timestamp: "11:02",
179
+ source: "agent",
142
180
  status: "success",
143
181
  },
144
182
  {
145
- id: "log-2",
146
- message: "Matched campaign launch playbook and risk policy",
147
- timestamp: "09:14",
148
- source: "Policy Engine",
183
+ id: "diff-2",
184
+ message: "Found empty redirect path after OAuth callback",
185
+ timestamp: "11:02",
186
+ source: "analysis",
149
187
  status: "success",
188
+ detail: "Fallback was defaulting too early and dropping intended destination.",
150
189
  },
151
190
  {
152
- id: "log-3",
153
- message: "Opened approval tasks for finance and legal",
154
- timestamp: "09:15",
155
- source: "Approval Router",
156
- status: "warning",
191
+ id: "diff-3",
192
+ message: "Writing guarded redirect with preserved returnTo",
193
+ timestamp: "11:03",
194
+ source: "editor",
195
+ status: "info",
157
196
  highlighted: true,
158
- detail: "Due in 2h • fallback escalation enabled",
197
+ lineNumber: "38",
198
+ code: [
199
+ " const safeReturnTo = normalizeReturnTo(searchParams.get('returnTo'))",
200
+ "+const shouldTrackRedirect = safeReturnTo !== null",
201
+ "+const fallbackDestination = '/dashboard'",
202
+ " const destination = safeReturnTo ?? '/dashboard'",
203
+ "+const nextPath = destination || fallbackDestination",
204
+ "+const redirectSource = safeReturnTo ? 'return_to' : 'fallback'",
205
+ " ",
206
+ "+if (!nextPath.startsWith('/')) {",
207
+ "+ router.replace(fallbackDestination)",
208
+ "+ return null",
209
+ "+}",
210
+ "-router.replace('/dashboard')",
211
+ "+router.replace(nextPath)",
212
+ "+if (shouldTrackRedirect) trackAuthRedirect(nextPath, redirectSource)",
213
+ "+logAuthNavigation('oauth_callback_redirect', { destination: nextPath })",
214
+ " return null",
215
+ ],
159
216
  },
160
217
  {
161
- id: "log-4",
162
- message: "Prepared CRM updates and downstream notifications",
163
- timestamp: "09:15",
164
- source: "Workflow Engine",
165
- status: "info",
218
+ id: "diff-4",
219
+ message: "Validated redirect to /dashboard/settings",
220
+ timestamp: "11:03",
221
+ source: "preview",
222
+ status: "neutral",
166
223
  },
167
224
  ],
168
225
  metrics: [
169
- { id: "m1", label: "Latency", value: "1.8s", tone: "success" },
170
- { id: "m2", label: "Systems", value: "6", tone: "info" },
171
- { id: "m3", label: "Fallbacks", value: "0", tone: "success" },
226
+ { id: "m1", label: "Files", value: "2", tone: "success" },
227
+ { id: "m2", label: "Edits", value: "12", tone: "info" },
228
+ { id: "m3", label: "Checks", value: "1/2", tone: "warning" },
172
229
  ],
173
- highlights: [{ id: "log-3", label: "Approval handoff", tone: "warning" }],
230
+ highlights: [],
174
231
  },
175
232
  approvalInbox: {
176
233
  window: {
177
234
  key: "approvalInbox",
178
- title: "Approval Inbox",
179
- subtitle: "Decisions",
180
- status: { label: "Needs review", tone: "warning" },
181
- badge: "2 pending",
182
- layoutHint: {
183
- x: 8,
184
- y: 56,
185
- width: 38,
186
- height: 38,
187
- zIndex: 20,
188
- rotateDeg: 1,
189
- },
235
+ title: "Hidden",
190
236
  },
191
- title: "High-confidence approvals",
192
- subtitle: "Review only where policy requires human sign-off.",
193
- activeItemId: "approval-1",
194
- counts: [
195
- { id: "c1", label: "Pending", value: "2", tone: "warning" },
196
- { id: "c2", label: "Auto-approved", value: "14", tone: "success" },
197
- { id: "c3", label: "Escalated", value: "0", tone: "info" },
198
- ],
199
- items: [
200
- {
201
- id: "approval-1",
202
- title: "Budget increase for EMEA launch",
203
- description: "AI recommends +18% budget based on forecasted pipeline lift.",
204
- requester: "Growth workflow",
205
- status: "warning",
206
- priorityLabel: "High impact",
207
- dueLabel: "Due in 2h",
208
- highlighted: true,
209
- actions: [
210
- { id: "a1", label: "Approve", tone: "success" },
211
- { id: "a2", label: "Request change", tone: "warning" },
212
- ],
213
- },
214
- {
215
- id: "approval-2",
216
- title: "Legal review for new vendor terms",
217
- description: "Generated summary attached with highlighted clause changes.",
218
- requester: "Procurement workflow",
219
- status: "info",
220
- priorityLabel: "Standard",
221
- dueLabel: "Today",
222
- },
223
- ],
224
- highlights: [
225
- { id: "approval-1", label: "Priority approval", tone: "accent" },
226
- ],
237
+ items: [],
227
238
  },
228
239
  knowledgePanel: {
229
240
  window: {
230
241
  key: "knowledgePanel",
231
242
  title: "Knowledge",
232
- subtitle: "Grounding",
233
- status: { label: "Synced", tone: "success" },
234
- badge: "12 sources",
235
- layoutHint: {
236
- x: 58,
237
- y: 56,
238
- width: 36,
239
- height: 36,
240
- zIndex: 10,
241
- rotateDeg: -1,
242
- },
243
+ subtitle: "Preview",
244
+ status: { label: "Ready", tone: "success" },
243
245
  },
244
- title: "Context behind every action",
245
- subtitle: "AI cites policies, customer context, and prior outcomes before it acts.",
246
- query: "Which approvals are required for a regional budget expansion over $25k?",
247
- summary: "Finance and legal approval are required when forecasted spend exceeds threshold and vendor terms change.",
248
- sources: [
249
- { id: "s1", label: "Budget Policy", kind: "Policy", status: "success" },
250
- { id: "s2", label: "Vendor Terms", kind: "Contract", status: "info" },
251
- {
252
- id: "s3",
253
- label: "Campaign Playbook",
254
- kind: "Runbook",
255
- status: "success",
256
- },
257
- ],
258
- activeSnippetId: "snippet-1",
246
+ title: "Patch preview",
247
+ subtitle: "Show the code the agent is producing right now.",
248
+ query: "page.tsx",
249
+ summary: "Redirects now preserve a sanitized returnTo destination and fall back only when needed.",
259
250
  snippets: [
260
251
  {
261
252
  id: "snippet-1",
262
- title: "Budget threshold rule",
263
- content: "Campaigns above $25k require finance approval. Add legal review when vendor commitments or contractual language change.",
264
- sourceId: "s1",
265
- confidence: "98% match",
266
- excerptLabel: "Recommended policy",
267
- tags: ["finance", "approval routing"],
253
+ title: "Updated callback handler",
254
+ excerptLabel: "Live diff",
255
+ confidence: "12 changed lines",
268
256
  highlighted: true,
269
- },
270
- {
271
- id: "snippet-2",
272
- title: "Previous launch outcome",
273
- content: "Similar EMEA launch workflows reduced manual routing time by 72% while keeping audit logs intact.",
274
- sourceId: "s3",
275
- confidence: "Historical pattern",
276
- tags: ["benchmark", "ops efficiency"],
257
+ content: "const safeReturnTo = normalizeReturnTo(searchParams.get('returnTo'))\nconst destination = safeReturnTo ?? '/dashboard'\nrouter.replace(destination)",
258
+ tags: ["redirect", "auth", "callback"],
277
259
  },
278
260
  ],
279
261
  highlights: [
280
- { id: "snippet-1", label: "Policy citation", tone: "success" },
262
+ { id: "snippet-1", label: "Generated code", tone: "success" },
281
263
  ],
282
264
  },
283
265
  highlights: [
284
- { id: "route-approval", label: "Approval branch", tone: "accent" },
285
- { id: "approval-1", label: "Human checkpoint", tone: "warning" },
266
+ { id: "edit-callback", label: "Active edit", tone: "accent" },
267
+ { id: "diff-3", label: "Result updates", tone: "info" },
286
268
  ],
287
269
  },
288
270
  {
289
- key: "run-sync",
290
- label: "Live execution",
291
- description: "Once approved, AI updates systems, posts status, and keeps teams synced in real time.",
292
- activeWindow: "runConsole",
271
+ key: "refactor-pricing-page",
272
+ label: "Coding agent",
273
+ description: "Choose a repo task and watch the agent inspect code, apply edits, and update the diff.",
274
+ activeWindow: "workflowStudio",
275
+ playback: {
276
+ workflowStudio: {
277
+ playbackStepDurationsMs: [820, 920, 1380, 1180, 980, 840, 1640],
278
+ playbackResetDelayMs: 2200,
279
+ },
280
+ runConsole: {
281
+ playbackStepDurationsMs: [1320, 1480, 920, 760, 700, 660, 1320],
282
+ playbackResetDelayMs: 2200,
283
+ playbackStepEntryIndices: [0, 0, 1, 1, 2, 2, 2, 3, 3],
284
+ playbackStepVisibleLineCounts: [2, 2, 3, 4, 5, 7, 9, 11, 11],
285
+ },
286
+ },
287
+ taskList: {
288
+ window: {
289
+ key: "taskList",
290
+ title: "Tasks",
291
+ subtitle: "Current workspace",
292
+ status: { label: "3 tasks", tone: "info" },
293
+ },
294
+ title: "Agent tasks",
295
+ subtitle: "Select a coding task to inspect and execute.",
296
+ activeItemId: "refactor-pricing-page",
297
+ items: [
298
+ {
299
+ id: "fix-auth-flow",
300
+ title: "Fix auth flow",
301
+ description: "Fix the post-login redirect after the OAuth callback.",
302
+ meta: "apps/web · active",
303
+ },
304
+ {
305
+ id: "refactor-pricing-page",
306
+ title: "Refactor pricing page",
307
+ description: "Extract repeated pricing sections into reusable components.",
308
+ meta: "marketing site · queued",
309
+ },
310
+ {
311
+ id: "ship-command-palette",
312
+ title: "Ship command palette",
313
+ description: "Add global search, shortcuts, and action routing.",
314
+ meta: "dashboard · ready",
315
+ },
316
+ ],
317
+ },
293
318
  workflowStudio: {
294
319
  window: {
295
320
  key: "workflowStudio",
296
- title: "Workflow Studio",
297
- subtitle: "Approved flow",
298
- status: { label: "Executing", tone: "success" },
299
- badge: "Scenario 02",
300
- layoutHint: {
301
- x: 0,
302
- y: 0,
303
- width: 62,
304
- height: 72,
305
- zIndex: 30,
306
- rotateDeg: -2,
321
+ title: "Agent",
322
+ subtitle: "Active session",
323
+ status: { label: "Planning", tone: "info" },
324
+ },
325
+ title: "Extracting pricing sections",
326
+ subtitle: "The agent maps repeated UI and rewires the page composition.",
327
+ activeNodeId: "create-blocks",
328
+ transcript: [
329
+ { id: "pricing-title", kind: "title", text: "Refactor pricing page" },
330
+ {
331
+ id: "pricing-prompt",
332
+ kind: "prompt",
333
+ text: "Extract the pricing page into reusable sections without changing the visual output.",
334
+ },
335
+ {
336
+ id: "pricing-read-1",
337
+ kind: "activity",
338
+ text: "Read app/(marketing)/pricing/page.tsx",
339
+ },
340
+ {
341
+ id: "pricing-file-1",
342
+ kind: "file",
343
+ path: "components/pricing/PricingTiers.tsx",
344
+ text: "components/pricing/PricingTiers.tsx",
345
+ added: 52,
346
+ removed: 0,
347
+ },
348
+ {
349
+ id: "pricing-file-2",
350
+ kind: "file",
351
+ path: "app/(marketing)/pricing/page.tsx",
352
+ text: "app/(marketing)/pricing/page.tsx",
353
+ added: 18,
354
+ removed: 34,
355
+ },
356
+ {
357
+ id: "pricing-run-1",
358
+ kind: "activity",
359
+ text: "Move the tier grid wrapper into PricingTiers and normalize the plans prop shape",
360
+ },
361
+ {
362
+ id: "pricing-thought-1",
363
+ kind: "thought",
364
+ text: "Keep the visual output identical by preserving card order, CTA copy, and the existing spacing classes.",
365
+ },
366
+ {
367
+ id: "pricing-message-1",
368
+ kind: "message",
369
+ text: "The page entry now composes extracted sections while shared pricing data stays centralized and easier to extend.",
307
370
  },
371
+ {
372
+ id: "pricing-run-2",
373
+ kind: "activity",
374
+ text: "Compare extracted markup against the original layout before final cleanup",
375
+ },
376
+ ],
377
+ composer: {
378
+ placeholder: "Plan, search, or restructure the page...",
379
+ modeLabel: "Agent",
380
+ modelLabel: "Sonnet",
308
381
  },
309
- title: "Approved workflow in motion",
310
- subtitle: "The same flow now drives tool updates, notifications, and handoffs automatically.",
311
- activeNodeId: "notify-teams",
382
+ highlights: [
383
+ { id: "scan-page", label: "Find repetition", tone: "info" },
384
+ { id: "create-blocks", label: "Extract components", tone: "accent" },
385
+ ],
312
386
  nodes: [
313
387
  {
314
- id: "approval-complete",
315
- label: "Approvals cleared",
316
- description: "Finance and legal sign-off recorded.",
317
- type: "Checkpoint",
388
+ id: "scan-page",
389
+ label: "Scan pricing page",
390
+ description: "Detect repeated tier, feature, and CTA structures.",
391
+ type: "Read",
318
392
  status: "success",
319
- metadata: "2/2 approved",
393
+ metadata: "app/(marketing)/pricing/page.tsx",
320
394
  },
321
395
  {
322
- id: "update-crm",
323
- label: "Update CRM",
324
- description: "Sync campaign fields, account owners, and target lists.",
325
- type: "Action",
396
+ id: "map-sections",
397
+ label: "Map component boundaries",
398
+ description: "Group hero, tiers, FAQ, and comparison table logic.",
399
+ type: "Analyze",
326
400
  status: "success",
327
- metadata: "HubSpot + Salesforce",
401
+ metadata: "4 extractable sections",
328
402
  },
329
403
  {
330
- id: "notify-teams",
331
- label: "Notify teams",
332
- description: "Post launch brief and tasks to GTM channels.",
333
- type: "Action",
404
+ id: "create-blocks",
405
+ label: "Create reusable blocks",
406
+ type: "Edit",
334
407
  status: "info",
335
408
  active: true,
336
409
  emphasized: true,
337
- metadata: "Slack + Linear",
410
+ metadata: "components/pricing/*",
338
411
  },
339
412
  {
340
- id: "monitor-results",
341
- label: "Monitor rollout",
342
- description: "Track errors, latency, and downstream completion.",
343
- type: "Observe",
413
+ id: "trim-page",
414
+ label: "Simplify page entry",
415
+ description: "Reduce the page to composition and imported data.",
416
+ type: "Verify",
344
417
  status: "neutral",
345
- metadata: "Audit + telemetry",
418
+ metadata: "cleanup pending",
346
419
  },
347
420
  ],
348
- branches: [
421
+ },
422
+ runConsole: {
423
+ window: {
424
+ key: "runConsole",
425
+ title: "Editor",
426
+ subtitle: "Component output",
427
+ status: { label: "Updating", tone: "info" },
428
+ },
429
+ title: "components/pricing/PricingTiers.tsx",
430
+ subtitle: "The diff updates as the extracted component takes shape.",
431
+ statusLabel: "Extracting components",
432
+ progressLabel: "3 files updated",
433
+ progressPercent: 59,
434
+ activeEntryId: "pricing-3",
435
+ editorTabLabel: "PricingTiers.tsx",
436
+ editorLanguage: "TSX",
437
+ editorSummary: "Move repeated pricing JSX into a reusable tiers component.",
438
+ entries: [
349
439
  {
350
- id: "rb1",
351
- fromNodeId: "approval-complete",
352
- toNodeId: "update-crm",
440
+ id: "pricing-1",
441
+ message: "Found repeated tier markup and CTA footer",
442
+ timestamp: "11:11",
443
+ source: "agent",
353
444
  status: "success",
354
- active: true,
355
445
  },
356
446
  {
357
- id: "rb2",
358
- fromNodeId: "update-crm",
359
- toNodeId: "notify-teams",
447
+ id: "pricing-2",
448
+ message: "Created shared types for pricing data and features",
449
+ timestamp: "11:12",
450
+ source: "editor",
451
+ status: "success",
452
+ },
453
+ {
454
+ id: "pricing-3",
455
+ message: "Extracting PricingTiers component and props shape",
456
+ timestamp: "11:12",
457
+ source: "editor",
360
458
  status: "info",
361
- active: true,
459
+ highlighted: true,
460
+ lineNumber: "18",
461
+ code: [
462
+ " export function PricingTiers({ plans }: PricingTiersProps) {",
463
+ "- return plans.map((plan) => (",
464
+ "+ return (",
465
+ "+ <div className='grid gap-6 lg:grid-cols-3'>",
466
+ "+ {plans.map((plan) => (",
467
+ " <PricingCard key={plan.name} plan={plan} />",
468
+ "+ ))}",
469
+ "+ </div>",
470
+ "- ))",
471
+ "+ )",
472
+ " }",
473
+ ],
362
474
  },
363
475
  {
364
- id: "rb3",
365
- fromNodeId: "notify-teams",
366
- toNodeId: "monitor-results",
476
+ id: "pricing-4",
477
+ message: "Updating page.tsx to compose extracted sections",
478
+ timestamp: "11:13",
479
+ source: "editor",
367
480
  status: "neutral",
368
481
  },
369
482
  ],
370
- regions: [
483
+ metrics: [
484
+ { id: "pm1", label: "Files", value: "4", tone: "success" },
485
+ { id: "pm2", label: "Blocks", value: "3", tone: "info" },
486
+ { id: "pm3", label: "Dupes", value: "-38%", tone: "success" },
487
+ ],
488
+ highlights: [],
489
+ },
490
+ approvalInbox: {
491
+ window: {
492
+ key: "approvalInbox",
493
+ title: "Hidden",
494
+ },
495
+ items: [],
496
+ },
497
+ knowledgePanel: {
498
+ window: {
499
+ key: "knowledgePanel",
500
+ title: "Knowledge",
501
+ subtitle: "Preview",
502
+ status: { label: "Ready", tone: "success" },
503
+ },
504
+ title: "Component preview",
505
+ subtitle: "Show the extracted UI structure the agent is generating.",
506
+ query: "PricingTiers.tsx",
507
+ summary: "The page is being reduced to reusable blocks with shared data and a slimmer entry point.",
508
+ snippets: [
371
509
  {
372
- id: "execution",
373
- label: "Execution lane",
374
- description: "System updates and notifications",
375
- status: "info",
376
- nodeIds: ["update-crm", "notify-teams", "monitor-results"],
377
- active: true,
510
+ id: "pricing-snippet",
511
+ title: "Extracted tier component",
512
+ excerptLabel: "Live component",
513
+ confidence: "3 components created",
378
514
  highlighted: true,
515
+ content: "export function PricingTiers({ plans }: PricingTiersProps) {\n return plans.map((plan) => <PricingCard key={plan.name} plan={plan} />)\n}",
516
+ tags: ["components", "refactor", "pricing"],
379
517
  },
380
518
  ],
519
+ highlights: [
520
+ { id: "pricing-snippet", label: "Generated UI", tone: "success" },
521
+ ],
381
522
  },
382
- runConsole: {
523
+ highlights: [
524
+ { id: "create-blocks", label: "Active extraction", tone: "accent" },
525
+ { id: "pricing-3", label: "Result updates", tone: "info" },
526
+ ],
527
+ },
528
+ {
529
+ key: "ship-command-palette",
530
+ label: "Coding agent",
531
+ description: "Choose a repo task and watch the agent inspect code, apply edits, and update the diff.",
532
+ activeWindow: "workflowStudio",
533
+ playback: {
534
+ workflowStudio: {
535
+ playbackStepDurationsMs: [760, 900, 1320, 1160, 920, 820, 1560],
536
+ playbackResetDelayMs: 2200,
537
+ },
538
+ runConsole: {
539
+ playbackStepDurationsMs: [1180, 1420, 940, 780, 700, 660, 1280],
540
+ playbackResetDelayMs: 2200,
541
+ playbackStepEntryIndices: [0, 0, 1, 1, 2, 2, 2, 3, 3],
542
+ playbackStepVisibleLineCounts: [2, 2, 3, 4, 6, 8, 10, 12, 12],
543
+ },
544
+ },
545
+ taskList: {
383
546
  window: {
384
- key: "runConsole",
385
- title: "Live Run",
386
- subtitle: "Execution feed",
387
- status: { label: "Healthy", tone: "success" },
388
- badge: "42 events",
389
- layoutHint: {
390
- x: 50,
391
- y: 10,
392
- width: 44,
393
- height: 54,
394
- zIndex: 40,
395
- rotateDeg: 2,
547
+ key: "taskList",
548
+ title: "Tasks",
549
+ subtitle: "Current workspace",
550
+ status: { label: "3 tasks", tone: "info" },
551
+ },
552
+ title: "Agent tasks",
553
+ subtitle: "Select a coding task to inspect and execute.",
554
+ activeItemId: "ship-command-palette",
555
+ items: [
556
+ {
557
+ id: "fix-auth-flow",
558
+ title: "Fix auth flow",
559
+ description: "Fix the post-login redirect after the OAuth callback.",
560
+ meta: "apps/web · active",
561
+ },
562
+ {
563
+ id: "refactor-pricing-page",
564
+ title: "Refactor pricing page",
565
+ description: "Extract repeated pricing sections into reusable components.",
566
+ meta: "marketing site · queued",
567
+ },
568
+ {
569
+ id: "ship-command-palette",
570
+ title: "Ship command palette",
571
+ description: "Add global search, shortcuts, and action routing.",
572
+ meta: "dashboard · ready",
396
573
  },
574
+ ],
575
+ },
576
+ workflowStudio: {
577
+ window: {
578
+ key: "workflowStudio",
579
+ title: "Agent",
580
+ subtitle: "Active session",
581
+ status: { label: "Building", tone: "info" },
397
582
  },
398
- title: "Everything updates in sequence",
399
- subtitle: "Users see the workflow advance without digging through logs or scripts.",
400
- statusLabel: "Running smoothly",
401
- progressLabel: "5 of 6 steps complete",
402
- progressPercent: 86,
403
- activeEntryId: "exec-4",
404
- entries: [
583
+ title: "Adding command palette",
584
+ subtitle: "The agent wires shortcuts and fast navigation into one flow.",
585
+ activeNodeId: "wire-shortcuts",
586
+ transcript: [
587
+ { id: "cmd-title", kind: "title", text: "Ship command palette" },
588
+ {
589
+ id: "cmd-prompt",
590
+ kind: "prompt",
591
+ text: "Add a command palette with global shortcut support, grouped actions, and fast route switching.",
592
+ },
593
+ {
594
+ id: "cmd-read-1",
595
+ kind: "activity",
596
+ text: "Read app/dashboard/layout.tsx",
597
+ },
405
598
  {
406
- id: "exec-1",
407
- message: "Recorded finance and legal approval payloads",
408
- timestamp: "09:18",
409
- source: "Approval Router",
599
+ id: "cmd-file-1",
600
+ kind: "file",
601
+ path: "components/command-menu.tsx",
602
+ text: "components/command-menu.tsx",
603
+ added: 27,
604
+ removed: 4,
605
+ },
606
+ {
607
+ id: "cmd-file-2",
608
+ kind: "file",
609
+ path: "app/dashboard/layout.tsx",
610
+ text: "app/dashboard/layout.tsx",
611
+ added: 9,
612
+ removed: 1,
613
+ },
614
+ {
615
+ id: "cmd-run-1",
616
+ kind: "activity",
617
+ text: "Index route actions and quick commands so grouped search stays responsive",
618
+ },
619
+ {
620
+ id: "cmd-thought-1",
621
+ kind: "thought",
622
+ text: "The global shortcut should ignore focused text inputs and always remove its keydown listener on unmount.",
623
+ },
624
+ {
625
+ id: "cmd-message-1",
626
+ kind: "message",
627
+ text: "Palette now opens globally, keeps grouped actions discoverable, and routes immediately after a selection.",
628
+ },
629
+ {
630
+ id: "cmd-run-2",
631
+ kind: "activity",
632
+ text: "Validate keyboard open-close flow, route jumps, and the empty search state",
633
+ },
634
+ ],
635
+ composer: {
636
+ placeholder: "Ask the agent to search, wire, or ship...",
637
+ modeLabel: "Agent",
638
+ modelLabel: "Sonnet",
639
+ },
640
+ highlights: [
641
+ { id: "inspect-layout", label: "Inspect layout", tone: "info" },
642
+ { id: "wire-shortcuts", label: "Add shortcuts", tone: "accent" },
643
+ ],
644
+ nodes: [
645
+ {
646
+ id: "inspect-layout",
647
+ label: "Inspect app shell",
648
+ description: "Find the dashboard layout, nav state, and modal primitives.",
649
+ type: "Read",
410
650
  status: "success",
651
+ metadata: "dashboard shell",
411
652
  },
412
653
  {
413
- id: "exec-2",
414
- message: "Updated 38 CRM records and created launch tasks",
415
- timestamp: "09:18",
416
- source: "CRM Sync",
654
+ id: "gather-actions",
655
+ label: "Collect command actions",
656
+ description: "Build a searchable list of routes and common actions.",
657
+ type: "Analyze",
417
658
  status: "success",
418
- detail: "0 conflicts detected",
659
+ metadata: "12 candidate commands",
419
660
  },
420
661
  {
421
- id: "exec-3",
422
- message: "Published launch brief to #gtm-launch and created Linear checklist",
423
- timestamp: "09:19",
424
- source: "Notifier",
662
+ id: "wire-shortcuts",
663
+ label: "Wire keyboard shortcuts",
664
+ type: "Edit",
425
665
  status: "info",
666
+ active: true,
667
+ emphasized: true,
668
+ metadata: "keydown + dialog state",
426
669
  },
427
670
  {
428
- id: "exec-4",
429
- message: "Monitoring downstream task completion and SLA risk",
430
- timestamp: "09:19",
431
- source: "Observer",
432
- status: "success",
433
- highlighted: true,
434
- detail: "Auto-escalation armed if blockers appear",
671
+ id: "polish-results",
672
+ label: "Polish result list",
673
+ description: "Add grouping, empty state, and active selection feedback.",
674
+ type: "Verify",
675
+ status: "neutral",
676
+ metadata: "UX pass next",
435
677
  },
436
678
  ],
437
- metrics: [
438
- { id: "rm1", label: "Tasks created", value: "18", tone: "success" },
439
- { id: "rm2", label: "Records updated", value: "38", tone: "info" },
440
- { id: "rm3", label: "Errors", value: "0", tone: "success" },
441
- ],
442
- highlights: [{ id: "exec-4", label: "Live monitoring", tone: "success" }],
443
679
  },
444
- approvalInbox: {
680
+ runConsole: {
445
681
  window: {
446
- key: "approvalInbox",
447
- title: "Approval Inbox",
448
- subtitle: "Audit trail",
449
- status: { label: "Clear", tone: "success" },
450
- badge: "0 pending",
451
- layoutHint: {
452
- x: 10,
453
- y: 58,
454
- width: 36,
455
- height: 34,
456
- zIndex: 20,
457
- rotateDeg: 1,
458
- },
682
+ key: "runConsole",
683
+ title: "Editor",
684
+ subtitle: "UI output",
685
+ status: { label: "Updating", tone: "info" },
459
686
  },
460
- title: "Approvals only when needed",
461
- subtitle: "Human review is targeted, auditable, and out of the critical path once complete.",
462
- counts: [
463
- { id: "rc1", label: "Pending", value: "0", tone: "success" },
464
- { id: "rc2", label: "Completed", value: "8", tone: "info" },
465
- { id: "rc3", label: "Auto-approved", value: "22", tone: "success" },
466
- ],
467
- items: [
687
+ title: "components/command-menu.tsx",
688
+ subtitle: "The diff updates as the command palette is wired into the app shell.",
689
+ statusLabel: "Wiring command palette",
690
+ progressLabel: "8 commands indexed",
691
+ progressPercent: 73,
692
+ activeEntryId: "cmd-3",
693
+ editorTabLabel: "command-menu.tsx",
694
+ editorLanguage: "TSX",
695
+ editorSummary: "Wire a global shortcut and searchable action list into the dashboard shell.",
696
+ entries: [
468
697
  {
469
- id: "approval-done-1",
470
- title: "Finance approval recorded",
471
- description: "Budget threshold exception approved with full audit log.",
472
- requester: "Growth workflow",
698
+ id: "cmd-1",
699
+ message: "Opened dialog primitive and dashboard nav state",
700
+ timestamp: "11:21",
701
+ source: "agent",
473
702
  status: "success",
474
- priorityLabel: "Complete",
475
- dueLabel: "09:17",
476
703
  },
477
704
  {
478
- id: "approval-done-2",
479
- title: "Legal review completed",
480
- description: "Clause changes accepted and attached to workflow record.",
481
- requester: "Procurement workflow",
705
+ id: "cmd-2",
706
+ message: "Generated grouped command list and action search",
707
+ timestamp: "11:22",
708
+ source: "editor",
482
709
  status: "success",
483
- priorityLabel: "Complete",
484
- dueLabel: "09:18",
710
+ },
711
+ {
712
+ id: "cmd-3",
713
+ message: "Binding Cmd+K to open the command menu globally",
714
+ timestamp: "11:22",
715
+ source: "editor",
716
+ status: "info",
717
+ highlighted: true,
718
+ lineNumber: "27",
719
+ code: [
720
+ " useEffect(() => {",
721
+ "+ const handleKeyDown = (event: KeyboardEvent) => {",
722
+ "+ if ((event.metaKey || event.ctrlKey) && event.key.toLowerCase() === 'k') {",
723
+ "+ event.preventDefault()",
724
+ "+ setOpen((current) => !current)",
725
+ "+ }",
726
+ "+ }",
727
+ "- window.addEventListener('keydown', onKeyDown)",
728
+ "+ window.addEventListener('keydown', handleKeyDown)",
729
+ "- return () => window.removeEventListener('keydown', onKeyDown)",
730
+ "+ return () => window.removeEventListener('keydown', handleKeyDown)",
731
+ " }, [])",
732
+ ],
733
+ },
734
+ {
735
+ id: "cmd-4",
736
+ message: "Validated route jump and quick action execution",
737
+ timestamp: "11:23",
738
+ source: "preview",
739
+ status: "neutral",
485
740
  },
486
741
  ],
742
+ metrics: [
743
+ { id: "cm1", label: "Commands", value: "8", tone: "info" },
744
+ { id: "cm2", label: "Routes", value: "5", tone: "success" },
745
+ { id: "cm3", label: "Shortcut", value: "Cmd+K", tone: "success" },
746
+ ],
747
+ highlights: [],
748
+ },
749
+ approvalInbox: {
750
+ window: {
751
+ key: "approvalInbox",
752
+ title: "Hidden",
753
+ },
754
+ items: [],
487
755
  },
488
756
  knowledgePanel: {
489
757
  window: {
490
758
  key: "knowledgePanel",
491
759
  title: "Knowledge",
492
- subtitle: "Operational context",
493
- status: { label: "Fresh", tone: "success" },
494
- badge: "8 live docs",
495
- layoutHint: {
496
- x: 58,
497
- y: 56,
498
- width: 34,
499
- height: 34,
500
- zIndex: 10,
501
- rotateDeg: -1,
502
- },
760
+ subtitle: "Preview",
761
+ status: { label: "Ready", tone: "success" },
503
762
  },
504
- title: "Grounded automation, not guesswork",
505
- subtitle: "Every downstream change is tied back to source context and prior operating rules.",
506
- query: "What should happen after launch approval is complete?",
507
- summary: "Sync CRM, notify GTM owners, create follow-up tasks, and monitor SLA risks until completion.",
508
- sources: [
509
- {
510
- id: "rs1",
511
- label: "Launch Runbook",
512
- kind: "Runbook",
513
- status: "success",
514
- },
515
- { id: "rs2", label: "Team SLA Policy", kind: "Policy", status: "info" },
516
- ],
517
- activeSnippetId: "runbook-snippet",
763
+ title: "Palette preview",
764
+ subtitle: "Show the agent's latest UI output for the command menu.",
765
+ query: "command-menu.tsx",
766
+ summary: "A global command palette is being added with grouped actions, shortcut support, and instant route changes.",
518
767
  snippets: [
519
768
  {
520
- id: "runbook-snippet",
521
- title: "Post-approval sequence",
522
- content: "After approvals clear, update CRM state, notify GTM channels, open implementation tasks, and start SLA monitoring for any dependencies.",
523
- sourceId: "rs1",
524
- confidence: "Runbook step 4",
525
- excerptLabel: "Execution guidance",
526
- tags: ["execution", "handoff"],
769
+ id: "command-snippet",
770
+ title: "Command menu",
771
+ excerptLabel: "Live UI",
772
+ confidence: "8 commands wired",
527
773
  highlighted: true,
774
+ content: '<CommandDialog open={open} onOpenChange={setOpen}>\n <CommandInput placeholder="Search commands" />\n <CommandList>{groups.map(renderGroup)}</CommandList>\n</CommandDialog>',
775
+ tags: ["command palette", "ux", "keyboard"],
528
776
  },
529
777
  ],
778
+ highlights: [
779
+ { id: "command-snippet", label: "Generated UI", tone: "success" },
780
+ ],
530
781
  },
531
782
  highlights: [
532
- { id: "notify-teams", label: "Live handoff", tone: "accent" },
533
- { id: "exec-4", label: "Observed completion", tone: "success" },
783
+ { id: "wire-shortcuts", label: "Active build", tone: "accent" },
784
+ { id: "cmd-3", label: "Result updates", tone: "info" },
534
785
  ],
535
786
  },
536
787
  ];
537
788
  export function Hero() {
538
- return (<div className="relative overflow-hidden">
539
- <div className="pointer-events-none absolute inset-0 bg-[radial-gradient(circle_at_top_left,theme(colors.cyan.500/0.18),transparent_32%),radial-gradient(circle_at_bottom_right,theme(colors.violet.500/0.14),transparent_34%)]"/>
540
-
541
- <HeroProductDemo className="bg-[linear-gradient(180deg,rgba(248,250,252,0.98)_0%,rgba(239,246,255,0.92)_46%,rgba(248,250,252,0.98)_100%)] dark:bg-[linear-gradient(180deg,rgba(2,6,23,0.98)_0%,rgba(8,47,73,0.96)_42%,rgba(15,23,42,0.98)_100%)]" heading={{
542
- text: "Let AI run the workflows your team still manages by hand.",
543
- className: "max-w-3xl text-left font-outfit text-4xl font-semibold leading-tight tracking-tight text-slate-950 sm:text-5xl lg:text-6xl dark:text-white",
789
+ return (<div className="relative overflow-hidden">
790
+ <div className="pointer-events-none absolute inset-0 bg-[linear-gradient(180deg,#eef3f8_0%,#f6f8fb_48%,#eef3f8_100%)] dark:bg-[linear-gradient(180deg,#171717_0%,#121212_18%,#1d1d1d_46%,#131313_76%,#1b1b1b_100%)]"/>
791
+ <div className="pointer-events-none absolute inset-0 bg-[linear-gradient(112deg,transparent_18%,rgba(255,255,255,0.18)_28%,rgba(255,255,255,0.05)_37%,transparent_50%),linear-gradient(248deg,transparent_22%,rgba(255,255,255,0.14)_31%,rgba(255,255,255,0.04)_41%,transparent_56%)] opacity-70 dark:opacity-100"/>
792
+ <div className="pointer-events-none absolute inset-0 bg-[radial-gradient(circle_at_top,rgba(255,255,255,0.12),transparent_34%)] opacity-70 dark:opacity-100"/>
793
+ <div className="pointer-events-none absolute left-1/2 top-[26rem] h-[32rem] w-[62rem] -translate-x-1/2 rounded-full bg-[radial-gradient(circle_at_center,rgba(255,255,255,0.22)_0%,rgba(255,255,255,0.12)_12%,rgba(255,255,255,0.06)_24%,transparent_66%)] blur-3xl opacity-85 dark:opacity-100"/>
794
+
795
+ <HeroProductDemo className="bg-transparent" heading={{
796
+ text: "Code with agents.",
797
+ className: "max-w-4xl text-left font-outfit text-3xl font-semibold leading-none tracking-tight text-[var(--heading-fg)] sm:text-4xl lg:text-5xl",
544
798
  }} subheading={{
545
- text: "Turn requests into multi-step workflows that gather context, route approvals, update tools, and show live execution from one AI workflow automation platform.",
546
- className: "mt-6 max-w-2xl text-left font-inter text-base leading-7 text-slate-600 sm:text-lg dark:text-slate-300",
799
+ text: "Watch the agent read, edit, and update the result in real time.",
800
+ className: "mt-3 max-w-2xl text-left font-inter text-sm leading-6 text-[var(--subheading-fg)] sm:text-base",
547
801
  }} cta1={{
548
- label: "Start automating",
802
+ label: "Start building",
549
803
  href: "#contact",
550
804
  variant: "default",
551
805
  size: "lg",
552
806
  className: [
553
- "px-8 py-3 text-base font-semibold shadow-lg shadow-cyan-500/20",
554
- "[--btn-bg:theme(colors.cyan.500)]",
555
- "hover:[--btn-hover-bg:theme(colors.cyan.400)]",
556
- "[--btn-fg:theme(colors.slate.950)]",
557
- "hover:[--btn-hover-fg:theme(colors.slate.950)]",
807
+ "px-7 py-3 text-sm font-semibold shadow-lg shadow-black/10 dark:shadow-black/30",
808
+ "[--btn-bg:var(--hero-cta-primary-bg)]",
809
+ "hover:[--btn-hover-bg:var(--hero-cta-primary-hover-bg)]",
810
+ "[--btn-fg:var(--hero-cta-primary-fg)]",
811
+ "hover:[--btn-hover-fg:var(--hero-cta-primary-hover-fg)]",
558
812
  ].join(" "),
559
813
  }} cta2={{
560
- label: "See how it works",
814
+ label: "View features",
561
815
  href: "#features",
562
816
  variant: "outline",
563
817
  size: "lg",
564
818
  className: [
565
- "border px-8 py-3 text-base font-semibold shadow-sm",
566
- "[--btn-bg:transparent]",
567
- "[--btn-fg:theme(colors.cyan.700)]",
568
- "[--btn-border:theme(colors.cyan.300)]",
569
- "hover:[--btn-hover-bg:theme(colors.cyan.50)]",
570
- "hover:[--btn-hover-fg:theme(colors.cyan.800)]",
571
- "dark:[--btn-fg:theme(colors.cyan.300)]",
572
- "dark:[--btn-border:theme(colors.cyan.700)]",
573
- "dark:hover:[--btn-hover-bg:theme(colors.cyan.950)]",
574
- "dark:hover:[--btn-hover-fg:theme(colors.cyan.200)]",
819
+ "border px-7 py-3 text-sm font-semibold shadow-sm dark:shadow-black/20",
820
+ "[--btn-bg:var(--hero-cta-secondary-bg)]",
821
+ "[--btn-fg:var(--hero-cta-secondary-fg)]",
822
+ "[--btn-border:var(--hero-cta-secondary-border)]",
823
+ "hover:[--btn-hover-bg:var(--hero-cta-secondary-hover-bg)]",
824
+ "hover:[--btn-hover-fg:var(--hero-cta-secondary-hover-fg)]",
575
825
  ].join(" "),
576
826
  }} stage={{
577
827
  scenarios,
578
828
  initialScenarioIndex: 0,
579
- autoCycle: true,
580
- cycleIntervalMs: 5200,
581
- className: "[--demo-stage-bg:linear-gradient(180deg,rgba(255,255,255,0.92)_0%,rgba(224,242,254,0.72)_100%)] dark:[--demo-stage-bg:linear-gradient(180deg,rgba(15,23,42,0.92)_0%,rgba(12,74,110,0.70)_100%)]",
829
+ className: "mt-0",
582
830
  }} section={{
583
- className: "px-6 py-16 sm:px-8 lg:px-10 lg:py-24",
831
+ className: "px-6 py-10 sm:px-8 lg:px-10 lg:py-12",
584
832
  }} container={{
585
- className: "relative z-10 items-start gap-14 lg:grid-cols-[minmax(0,0.9fr)_minmax(0,1.1fr)]",
833
+ className: "relative z-10 max-w-7xl",
586
834
  }} textContainer={{
587
- className: "pt-4 lg:pt-10",
835
+ className: "max-w-3xl pt-1 lg:pl-4 lg:pt-0",
588
836
  }} demoContainer={{
589
- className: "relative min-h-[36rem] lg:min-h-[42rem]",
837
+ className: "relative min-h-[32rem] w-full max-w-full lg:px-4 lg:h-[clamp(30rem,calc(100svh-7rem),42rem)] lg:min-h-0",
590
838
  }} buttonsContainer={{
591
- className: "mt-8 flex-col items-start sm:flex-row sm:items-center",
592
- }} ariaLabel="AI workflow automation hero section"/>
839
+ className: "mt-4 flex-col items-start sm:flex-row sm:items-center",
840
+ }} demoBelowText ariaLabel="AI coding agent hero section"/>
593
841
  </div>);
594
842
  }