Separación vista/lógica del wizard de creación de plan

src/components/planes/wizard/PasoResumenCard.tsx

@@ -0,0 +1,74 @@
+import type { NewPlanWizardState } from '@/features/planes/new/types'
+
+import {
+  Card,
+  CardContent,
+  CardDescription,
+  CardHeader,
+  CardTitle,
+} from '@/components/ui/card'
+
+export function PasoResumenCard({ wizard }: { wizard: NewPlanWizardState }) {
+  const modo = wizard.modoCreacion
+  const sub = wizard.subModoClonado
+  return (
+    <Card>
+      <CardHeader>
+        <CardTitle>Resumen</CardTitle>
+        <CardDescription>
+          Verifica la información antes de crear.
+        </CardDescription>
+      </CardHeader>
+      <CardContent>
+        <div className="grid gap-2 text-sm">
+          <div>
+            <span className="text-muted-foreground">Nombre: </span>
+            <span className="font-medium">
+              {wizard.datosBasicos.nombrePlan || '—'}
+            </span>
+          </div>
+          <div>
+            <span className="text-muted-foreground">Facultad/Carrera: </span>
+            <span className="font-medium">
+              {wizard.datosBasicos.facultadId || '—'} /{' '}
+              {wizard.datosBasicos.carreraId || '—'}
+            </span>
+          </div>
+          <div>
+            <span className="text-muted-foreground">Nivel: </span>
+            <span className="font-medium">
+              {wizard.datosBasicos.nivel || '—'}
+            </span>
+          </div>
+          <div>
+            <span className="text-muted-foreground">Ciclos: </span>
+            <span className="font-medium">
+              {wizard.datosBasicos.numCiclos} ({wizard.datosBasicos.tipoCiclo})
+            </span>
+          </div>
+          <div className="mt-2">
+            <span className="text-muted-foreground">Modo: </span>
+            <span className="font-medium">
+              {modo === 'MANUAL' && 'Manual'}
+              {modo === 'IA' && 'Generado con IA'}
+              {modo === 'CLONADO' &&
+                sub === 'INTERNO' &&
+                'Clonado desde plan del sistema'}
+              {modo === 'CLONADO' &&
+                sub === 'TRADICIONAL' &&
+                'Importado desde documentos tradicionales'}
+            </span>
+          </div>
+          {wizard.resumen.previewPlan && (
+            <div className="bg-muted mt-2 rounded-md p-3">
+              <div className="font-medium">Preview IA</div>
+              <div className="text-muted-foreground">
+                Materias aprox.: {wizard.resumen.previewPlan.numMateriasAprox}
+              </div>
+            </div>
+          )}
+        </div>
+      </CardContent>
+    </Card>
+  )
+}