File size: 2,237 Bytes
b1324bf | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 | import React from 'react';
import { cn } from '@/lib/utils';
/**
* Static preview of embed form fields (matches public embed styling).
*/
export default function CtaFormPreview({ fields, className }) {
const list = fields || [];
return (
<div className={cn('rounded-xl border border-slate-200 bg-white p-4', className)}>
{list.length === 0 ? (
<p className="text-sm text-slate-400 text-center py-6">Add fields to preview</p>
) : (
<div className="space-y-3">
{list.map((f, idx) => (
<div key={`${f.key}-${idx}`}>
<label className="block text-xs font-medium text-slate-600 mb-1">
{f.label}
{f.required ? ' *' : ''}
</label>
{f.type === 'textarea' ? (
<textarea
readOnly
tabIndex={-1}
rows={3}
placeholder=""
className="w-full rounded-lg border border-slate-200 px-3 py-2 text-sm bg-white pointer-events-none"
/>
) : (
<input
readOnly
tabIndex={-1}
type={f.type || 'text'}
placeholder=""
className="w-full rounded-lg border border-slate-200 px-3 py-2 text-sm bg-white pointer-events-none"
/>
)}
</div>
))}
<button
type="button"
tabIndex={-1}
className="w-full rounded-lg bg-violet-600 py-2.5 text-sm font-semibold text-white pointer-events-none"
>
Submit
</button>
</div>
)}
</div>
);
}
|