feat: guardian defensive stats — shield, barrier, health regen + stat label renames
Build and Publish Mana Loop Docker Image / build-and-publish (push) Successful in 1m21s
Build and Publish Mana Loop Docker Image / build-and-publish (push) Successful in 1m21s
This commit is contained in:
@@ -5,7 +5,7 @@ import { ELEMENTS } from '@/lib/game/constants';
|
||||
import type { GuardianDef, GuardianBoon } from '@/lib/game/types';
|
||||
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
|
||||
import { Badge } from '@/components/ui/badge';
|
||||
import { Shield, Swords, Clock, Sparkles, Check, Lock, ChevronRight } from 'lucide-react';
|
||||
import { Shield, Swords, Clock, Sparkles, Check, Lock, ChevronRight, Heart, Hexagon } from 'lucide-react';
|
||||
import clsx from 'clsx';
|
||||
import { DebugName } from '@/components/game/debug/debug-context';
|
||||
|
||||
@@ -152,20 +152,48 @@ GuardianCard.displayName = 'GuardianCard';
|
||||
// ─── Guardian Stats ──────────────────────────────────────────────────────────
|
||||
|
||||
function GuardianStats({ guardian }: { guardian: GuardianDef }) {
|
||||
const hasShield = !!(guardian.shield && guardian.shield > 0);
|
||||
const hasBarrier = !!(guardian.barrier && guardian.barrier > 0);
|
||||
const hasHealthRegen = !!(guardian.healthRegen && guardian.healthRegen > 0);
|
||||
|
||||
return (
|
||||
<div className="grid grid-cols-3 gap-2 text-xs">
|
||||
<div className="flex items-center gap-1 text-gray-400">
|
||||
<Shield className="w-3 h-3" />
|
||||
<span>HP: {guardian.hp.toLocaleString()}</span>
|
||||
</div>
|
||||
<div className="flex items-center gap-1 text-gray-400">
|
||||
<Swords className="w-3 h-3" />
|
||||
<span>PWR: {guardian.power.toLocaleString()}</span>
|
||||
</div>
|
||||
<div className="flex items-center gap-1 text-gray-400">
|
||||
<Shield className="w-3 h-3" />
|
||||
<span>ARM: {Math.round((guardian.armor ?? 0) * 100)}%</span>
|
||||
<div className="space-y-1.5">
|
||||
<div className="grid grid-cols-3 gap-2 text-xs">
|
||||
<div className="flex items-center gap-1 text-gray-400">
|
||||
<Shield className="w-3 h-3" />
|
||||
<span>Health: {guardian.hp.toLocaleString()}</span>
|
||||
</div>
|
||||
<div className="flex items-center gap-1 text-gray-400">
|
||||
<Swords className="w-3 h-3" />
|
||||
<span>Power: {guardian.power.toLocaleString()}</span>
|
||||
</div>
|
||||
<div className="flex items-center gap-1 text-gray-400">
|
||||
<Shield className="w-3 h-3" />
|
||||
<span>Armor: {Math.round((guardian.armor ?? 0) * 100)}%</span>
|
||||
</div>
|
||||
</div>
|
||||
{(hasShield || hasBarrier || hasHealthRegen) && (
|
||||
<div className="grid grid-cols-3 gap-2 text-xs border-t border-gray-700/40 pt-1.5">
|
||||
{hasShield && (
|
||||
<div className="flex items-center gap-1 text-cyan-400">
|
||||
<Hexagon className="w-3 h-3" />
|
||||
<span>Shield: {guardian.shield!.toLocaleString()}</span>
|
||||
</div>
|
||||
)}
|
||||
{hasBarrier && (
|
||||
<div className="flex items-center gap-1 text-blue-400">
|
||||
<Shield className="w-3 h-3" />
|
||||
<span>Barrier: {Math.round(guardian.barrier! * 100)}%</span>
|
||||
</div>
|
||||
)}
|
||||
{hasHealthRegen && (
|
||||
<div className="flex items-center gap-1 text-green-400">
|
||||
<Heart className="w-3 h-3" />
|
||||
<span>Regen: {guardian.healthRegenIsPercent ? guardian.healthRegen + '%/tick' : guardian.healthRegen + '/tick'}</span>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user