blacktrigram 0.7.2

package/lib/components/screens/training/hooks/useTrainingActions.js

@@ -0,0 +1,284 @@
+import { AnimationState } from "../../../../systems/animation/core/types.js";
+import { CombatAttackType, DamageType, PlayerArchetype } from "../../../../types/common.js";
+import { TRIGRAM_STANCES_ORDER } from "../../../../systems/trigram/types.js";
+import { calculateDistance3D } from "../../../../utils/math.js";
+import { getAnimationForTechnique } from "../../../../systems/animation/core/AnimationRegistry.js";
+import "../../../../systems/animation/index.js";
+import { getTechniquesByStance } from "../../../../systems/trigram/techniques/index.js";
+import { KoreanTechniquesSystem } from "../../../../systems/trigram/KoreanTechniques.js";
+import { DEFAULT_BODY_RADIUS_METERS } from "../../../../types/physicsConstants.js";
+import { physicalReachCalculator } from "../../../../systems/physics/PhysicalReachCalculator.js";
+import "../../../../systems/physics/index.js";
+import { getArchetypePhysicalAttributes } from "../../../../data/archetypePhysicalAttributes.js";
+import { useCallback, useRef } from "react";
+//#region src/components/screens/training/hooks/useTrainingActions.ts
+/**
+* useTrainingActions Hook - Training Action Handlers
+*
+* Custom hook for managing training action handlers.
+* Mirrors useCombatActions pattern for consistency.
+*
+* @korean 훈련액션훅 - 훈련 액션 핸들러 관리
+*/
+/**
+* Get the best default technique for an archetype based on current stance.
+*
+* Each archetype has preferred combat styles:
+* - MUSA: Direct strikes, joint techniques (BLUNT/JOINT damage)
+* - AMSALJA: Nerve strikes, pressure points (NERVE/PRESSURE damage)
+* - HACKER: Precise calculated strikes (high accuracy)
+* - JEONGBO_YOWON: Psychological pressure, submissions (PRESSURE/JOINT)
+* - JOJIK_POKRYEOKBAE: High damage brutal strikes
+*
+* @korean 원형별 기본 기술 선택 - 8개 자세에 따른 최적 기술
+*/
+function getDefaultTechniqueForArchetype(archetype, stance) {
+	const techniques = getTechniquesByStance(stance);
+	if (techniques.length === 0) return void 0;
+	const scoredTechniques = techniques.map((tech) => {
+		let score = 0;
+		const damageType = tech.damageType;
+		const attackType = tech.type;
+		const isAdvanced = (tech.kiCost || 0) >= 10 || (tech.staminaCost || 0) >= 15;
+		switch (archetype) {
+			case PlayerArchetype.MUSA:
+				if (damageType === DamageType.JOINT) score += 30;
+				if (damageType === DamageType.CRUSHING) score += 25;
+				if (damageType === DamageType.BLUNT) score += 20;
+				if (attackType === CombatAttackType.STRIKE) score += 15;
+				if (attackType === CombatAttackType.PUNCH) score += 10;
+				if (isAdvanced) score += 10;
+				break;
+			case PlayerArchetype.AMSALJA:
+				if (damageType === DamageType.NERVE) score += 35;
+				if (damageType === DamageType.PRESSURE) score += 30;
+				if (attackType === CombatAttackType.NERVE_STRIKE) score += 25;
+				if (attackType === CombatAttackType.PRESSURE_POINT) score += 25;
+				if (attackType === CombatAttackType.THRUST) score += 15;
+				if ((tech.accuracy || 0) >= .9) score += 10;
+				break;
+			case PlayerArchetype.HACKER:
+				if ((tech.accuracy || 0) >= .9) score += 30;
+				if ((tech.accuracy || 0) >= .8) score += 15;
+				if (damageType === DamageType.NERVE) score += 20;
+				if (damageType === DamageType.INTERNAL) score += 20;
+				if (attackType === CombatAttackType.PRESSURE_POINT) score += 15;
+				break;
+			case PlayerArchetype.JEONGBO_YOWON:
+				if (damageType === DamageType.PRESSURE) score += 30;
+				if (damageType === DamageType.JOINT) score += 25;
+				if (attackType === CombatAttackType.GRAPPLE) score += 20;
+				if (attackType === CombatAttackType.PRESSURE_POINT) score += 15;
+				break;
+			case PlayerArchetype.JOJIK_POKRYEOKBAE:
+				if ((tech.damage || 0) >= 35) score += 35;
+				if ((tech.damage || 0) >= 30) score += 20;
+				if (damageType === DamageType.SLASHING) score += 20;
+				if (damageType === DamageType.PIERCING) score += 15;
+				if (damageType === DamageType.CRUSHING) score += 15;
+				if (attackType === CombatAttackType.KICK) score += 10;
+				break;
+		}
+		return {
+			technique: tech,
+			score
+		};
+	});
+	scoredTechniques.sort((a, b) => b.score - a.score);
+	return scoredTechniques[0]?.technique;
+}
+/**
+* Calculate hit accuracy based on distance and effective reach.
+* Uses PhysicalReachCalculator for animation-aware reach calculation.
+*
+* Distance logic matches CombatSystem: if out of reach, guaranteed miss (accuracy 0).
+* Training scene coordinates are in meters, using METERS_TO_TRAINING_UNITS = 1.0.
+*
+* **IMPORTANT**: Distance calculation accounts for body radius.
+* Center-to-center distance is adjusted by subtracting target body radius
+* because attacks hit the body surface, not the center point.
+* The target body radius is calculated from physical attributes for archetypes,
+* or uses DEFAULT_BODY_RADIUS_METERS for training dummies.
+*
+* Example: If player center is 1.5m from dummy center, but dummy body
+* extends 0.23m from center, the effective distance to hit is 1.27m.
+*
+* @korean 거리 기반 명중률 계산 - 사정거리 밖이면 빗나감
+*/
+function calculateHitAccuracy(playerPos, dummyPos, archetype, stance, animationType, reachConfig) {
+	const centerToCenterDistance = calculateDistance3D(playerPos, dummyPos);
+	const playerPhysicalAttributes = getArchetypePhysicalAttributes(archetype);
+	const effectiveDistance = Math.max(0, centerToCenterDistance - DEFAULT_BODY_RADIUS_METERS);
+	if (animationType !== void 0) {
+		const reachInUnits = physicalReachCalculator.calculateMaxReach(playerPhysicalAttributes, animationType, stance, reachConfig) * 1;
+		if (effectiveDistance > reachInUnits) return 0;
+		return Math.max(.7, 1 - effectiveDistance / reachInUnits * .3);
+	}
+	const defaultReach = .7 * 1;
+	if (effectiveDistance > defaultReach) return 0;
+	return Math.max(.5, 1 - effectiveDistance / defaultReach * .5);
+}
+/**
+* useTrainingActions hook
+* Provides training action handlers with proper memoization
+*/
+function useTrainingActions(config) {
+	const { state, actions, player3DPosition, dummyPosition, playerArchetype, playerStance, currentTechniqueAnimationTypeRef, audio, playBoneImpactSound, playAttackSound, onPlayerUpdate, playerAnimation, pendingAttackRef, selectedTechniqueId, setAttackAnimation } = config;
+	const dummyResetTimeoutRef = useRef(null);
+	const handleStartTraining = useCallback(() => {
+		actions.startTraining();
+		audio.playSFX("menu_select");
+	}, [actions, audio]);
+	const handleStopTraining = useCallback(() => {
+		if (dummyResetTimeoutRef.current) {
+			clearTimeout(dummyResetTimeoutRef.current);
+			dummyResetTimeoutRef.current = null;
+		}
+		actions.stopTraining();
+		audio.playSFX("menu_back");
+	}, [actions, audio]);
+	const handleDummyDefeated = useCallback(() => {
+		actions.setFeedback("훈련 더미 무력화! | Dummy Defeated!");
+		audio.playSFX("ki_release");
+		if (dummyResetTimeoutRef.current) clearTimeout(dummyResetTimeoutRef.current);
+		dummyResetTimeoutRef.current = setTimeout(() => {
+			actions.resetDummy();
+		}, 2e3);
+	}, [actions, audio]);
+	return {
+		handleStartTraining,
+		handleStopTraining,
+		handleDummyHit: useCallback((_vitalPointId, attackContext) => {
+			const animationType = attackContext?.animationType;
+			let reachConfig;
+			const resolvedTechniqueId = attackContext?.techniqueId ?? selectedTechniqueId;
+			if (resolvedTechniqueId) reachConfig = KoreanTechniquesSystem.getTechniqueById(resolvedTechniqueId)?.reachConfig;
+			const accuracy = calculateHitAccuracy(player3DPosition, dummyPosition, playerArchetype, playerStance, animationType, reachConfig);
+			const hitPosition = [
+				dummyPosition[0],
+				1.5,
+				dummyPosition[2]
+			];
+			if (accuracy > .5) {
+				const points = Math.round(accuracy * 100);
+				const damage = Math.round(accuracy * 15);
+				const isPerfect = accuracy > .9;
+				if (state.isTraining) actions.registerHit(points, damage, isPerfect);
+				if (playBoneImpactSound) playBoneImpactSound({
+					damage,
+					remainingHealth: 100,
+					vitalPoint: false,
+					hitPosition: {
+						x: hitPosition[0],
+						y: hitPosition[1],
+						z: hitPosition[2]
+					}
+				});
+				let effectType;
+				if (isPerfect) {
+					actions.setFeedback("완벽한 타격! | Perfect Strike!");
+					audio.playSFX("ki_release");
+					effectType = "perfect";
+				} else if (accuracy > .7) {
+					actions.setFeedback("좋은 타격! | Good Strike!");
+					audio.playSFX("ki_charge");
+					effectType = "success";
+				} else {
+					actions.setFeedback("타격 성공 | Strike Success");
+					audio.playSFX("menu_click");
+					effectType = "success";
+				}
+				actions.addHitEffect({
+					position: hitPosition,
+					type: effectType,
+					visible: true,
+					damage
+				});
+				return true;
+			} else {
+				if (state.isTraining) actions.registerMiss();
+				actions.setFeedback("빗나감 | Miss - Out of reach!");
+				audio.playSFX("menu_navigate");
+				actions.addHitEffect({
+					position: hitPosition,
+					type: "miss",
+					visible: true
+				});
+				return false;
+			}
+		}, [
+			state.isTraining,
+			player3DPosition,
+			dummyPosition,
+			playerArchetype,
+			playerStance,
+			actions,
+			audio,
+			playBoneImpactSound,
+			selectedTechniqueId
+		]),
+		handleDummyDefeated,
+		handleStanceChange: useCallback((stanceIndex) => {
+			actions.setStanceIndex(stanceIndex);
+			const stance = TRIGRAM_STANCES_ORDER[stanceIndex];
+			if (stance) {
+				playerAnimation.transitionToStanceGuard(stance);
+				onPlayerUpdate({ currentStance: stance });
+				audio.playSFX("stance_change");
+			}
+		}, [
+			actions,
+			onPlayerUpdate,
+			audio,
+			playerAnimation
+		]),
+		handleAttack: useCallback(() => {
+			let techniqueToUse;
+			let techniqueId = selectedTechniqueId;
+			if (!techniqueId) {
+				const defaultTechnique = getDefaultTechniqueForArchetype(playerArchetype, playerStance);
+				if (defaultTechnique) {
+					techniqueToUse = defaultTechnique;
+					techniqueId = defaultTechnique.id;
+				}
+			}
+			let animationType = currentTechniqueAnimationTypeRef.current;
+			if (techniqueToUse?.animationType) {
+				animationType = techniqueToUse.animationType;
+				currentTechniqueAnimationTypeRef.current = animationType;
+			}
+			const startTime = performance.now() / 1e3;
+			pendingAttackRef.current = {
+				accuracy: calculateHitAccuracy(player3DPosition, dummyPosition, playerArchetype, playerStance, animationType, techniqueToUse?.reachConfig),
+				vitalPoint: state.selectedVitalPoint ?? "generic",
+				animationType,
+				startTime,
+				techniqueId
+			};
+			if (setAttackAnimation && techniqueId) setAttackAnimation(getAnimationForTechnique(techniqueId));
+			playerAnimation.transitionTo(AnimationState.ATTACK);
+			if (!techniqueToUse && selectedTechniqueId) techniqueToUse = KoreanTechniquesSystem.getTechniqueById(selectedTechniqueId);
+			if (playAttackSound) {
+				const damage = techniqueToUse?.damage ?? 10;
+				playAttackSound(damage >= 40 ? "critical" : damage >= 25 ? "heavy" : damage >= 10 ? "medium" : "light");
+			} else audio.playSFX("whoosh");
+		}, [
+			state.selectedVitalPoint,
+			player3DPosition,
+			dummyPosition,
+			playerArchetype,
+			playerStance,
+			currentTechniqueAnimationTypeRef,
+			playerAnimation,
+			audio,
+			playAttackSound,
+			pendingAttackRef,
+			selectedTechniqueId,
+			setAttackAnimation
+		])
+	};
+}
+//#endregion
+export { useTrainingActions as default };
+
+//# sourceMappingURL=useTrainingActions.js.map

package/lib/components/screens/training/hooks/useTrainingActions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTrainingActions.js","names":[],"sources":["../../../../../src/components/screens/training/hooks/useTrainingActions.ts"],"sourcesContent":["/**\n * useTrainingActions Hook - Training Action Handlers\n *\n * Custom hook for managing training action handlers.\n * Mirrors useCombatActions pattern for consistency.\n *\n * @korean 훈련액션훅 - 훈련 액션 핸들러 관리\n */\n\nimport { useCallback, useRef } from \"react\";\nimport {\n  AudioBodyRegion,\n  ImpactIntensity,\n} from \"../../../../audio/types\";\nimport type { AttackIntensity } from \"../../../screens/combat/hooks/useCombatAudio\";\nimport { getArchetypePhysicalAttributes } from \"../../../../data/archetypePhysicalAttributes\";\nimport {\n  AnimationState,\n  AnimationType,\n  getAnimationForTechnique,\n} from \"../../../../systems/animation\";\nimport { physicalReachCalculator } from \"../../../../systems/physics\";\nimport { getTechniquesByStance } from \"../../../../systems/trigram/techniques\";\nimport { KoreanTechniquesSystem } from \"../../../../systems/trigram/KoreanTechniques\";\nimport { TRIGRAM_STANCES_ORDER } from \"../../../../systems/trigram/types\";\nimport type { KoreanTechnique } from \"../../../../systems/vitalpoint/types\";\nimport {\n  CombatAttackType,\n  DamageType,\n  PlayerArchetype,\n  Position,\n  TrigramStance,\n} from \"../../../../types/common\";\nimport {\n  DEFAULT_BODY_RADIUS_METERS,\n  METERS_TO_TRAINING_UNITS,\n} from \"../../../../types/physicsConstants\";\nimport { calculateDistance3D } from \"../../../../utils/math\";\nimport { TrainingActions, TrainingScreenState } from \"./useTrainingState\";\n\nexport interface UseTrainingActionsConfig {\n  readonly state: TrainingScreenState;\n  readonly actions: TrainingActions;\n  readonly playerPosition: Position;\n  readonly player3DPosition: [number, number, number];\n  readonly dummyPosition: [number, number, number];\n  readonly playerArchetype: import(\"../../../../types/common\").PlayerArchetype;\n  readonly playerStance: TrigramStance;\n  /** Ref to current selected technique's animation type for distance-based hit detection */\n  readonly currentTechniqueAnimationTypeRef: React.MutableRefObject<AnimationType>;\n  readonly audio: {\n    readonly playSFX: (sound: string, volume?: number) => Promise<void>;\n  };\n  /** Attack sound function from useCombatAudio for playing attack whoosh sounds */\n  readonly playAttackSound?: (intensity: AttackIntensity) => Promise<void>;\n  /** Bone impact audio function from useCombatAudio or similar hook */\n  readonly playBoneImpactSound?: (options: {\n    region?: AudioBodyRegion;\n    intensity?: ImpactIntensity;\n    damage?: number;\n    remainingHealth?: number;\n    vitalPoint?: boolean;\n    hitPosition?: { x: number; y: number; z?: number };\n  }) => Promise<void>;\n  readonly onPlayerUpdate: (updates: {\n    currentStance?: TrigramStance;\n    lastActionTime?: number;\n    position?: Position;\n  }) => void;\n  readonly playerAnimation: {\n    readonly transitionTo: (state: AnimationState) => boolean;\n    readonly transitionToStanceGuard: (stance: TrigramStance) => boolean;\n    readonly currentState: string;\n  };\n  /** External ref to store pending attack data - shared with animation events */\n  readonly pendingAttackRef: React.MutableRefObject<{\n    accuracy: number;\n    vitalPoint: string;\n    animationType?: AnimationType;\n    startTime?: number;\n    techniqueId?: string;\n  } | null>;\n  /** Currently selected technique ID (from technique bar) */\n  readonly selectedTechniqueId?: string;\n  /** Callback to set the visual attack animation */\n  readonly setAttackAnimation?: (animationName: string | undefined) => void;\n}\n\nexport interface UseTrainingActionsReturn {\n  readonly handleStartTraining: () => void;\n  readonly handleStopTraining: () => void;\n  readonly handleDummyHit: (\n    vitalPointId: string,\n    attackContext?: {\n      animationType?: AnimationType;\n      techniqueId?: string;\n    },\n  ) => boolean;\n  readonly handleDummyDefeated: () => void;\n  readonly handleStanceChange: (stanceIndex: number) => void;\n  readonly handleAttack: () => void;\n}\n\n/**\n * Get the best default technique for an archetype based on current stance.\n *\n * Each archetype has preferred combat styles:\n * - MUSA: Direct strikes, joint techniques (BLUNT/JOINT damage)\n * - AMSALJA: Nerve strikes, pressure points (NERVE/PRESSURE damage)\n * - HACKER: Precise calculated strikes (high accuracy)\n * - JEONGBO_YOWON: Psychological pressure, submissions (PRESSURE/JOINT)\n * - JOJIK_POKRYEOKBAE: High damage brutal strikes\n *\n * @korean 원형별 기본 기술 선택 - 8개 자세에 따른 최적 기술\n */\nfunction getDefaultTechniqueForArchetype(\n  archetype: PlayerArchetype,\n  stance: TrigramStance,\n): KoreanTechnique | undefined {\n  const techniques = getTechniquesByStance(stance);\n  if (techniques.length === 0) return undefined;\n\n  // Score each technique based on archetype preference\n  const scoredTechniques = techniques.map((tech) => {\n    let score = 0;\n    const damageType = tech.damageType;\n    const attackType = tech.type;\n    const isAdvanced =\n      (tech.kiCost || 0) >= 10 || (tech.staminaCost || 0) >= 15;\n\n    switch (archetype) {\n      case PlayerArchetype.MUSA:\n        // Musa prefers: strikes, blocks, counter-attacks (BLUNT/JOINT/CRUSHING)\n        if (damageType === DamageType.JOINT) score += 30;\n        if (damageType === DamageType.CRUSHING) score += 25;\n        if (damageType === DamageType.BLUNT) score += 20;\n        if (attackType === CombatAttackType.STRIKE) score += 15;\n        if (attackType === CombatAttackType.PUNCH) score += 10;\n        if (isAdvanced) score += 10;\n        break;\n\n      case PlayerArchetype.AMSALJA:\n        // Amsalja prefers: nerve strikes, pressure points, thrusts\n        if (damageType === DamageType.NERVE) score += 35;\n        if (damageType === DamageType.PRESSURE) score += 30;\n        if (attackType === CombatAttackType.NERVE_STRIKE) score += 25;\n        if (attackType === CombatAttackType.PRESSURE_POINT) score += 25;\n        if (attackType === CombatAttackType.THRUST) score += 15;\n        if ((tech.accuracy || 0) >= 0.9) score += 10;\n        break;\n\n      case PlayerArchetype.HACKER:\n        // Hacker prefers: high accuracy, calculated strikes\n        if ((tech.accuracy || 0) >= 0.9) score += 30;\n        if ((tech.accuracy || 0) >= 0.8) score += 15;\n        if (damageType === DamageType.NERVE) score += 20;\n        if (damageType === DamageType.INTERNAL) score += 20;\n        if (attackType === CombatAttackType.PRESSURE_POINT) score += 15;\n        break;\n\n      case PlayerArchetype.JEONGBO_YOWON:\n        // Jeongbo prefers: psychological pressure, submissions\n        if (damageType === DamageType.PRESSURE) score += 30;\n        if (damageType === DamageType.JOINT) score += 25;\n        if (attackType === CombatAttackType.GRAPPLE) score += 20;\n        if (attackType === CombatAttackType.PRESSURE_POINT) score += 15;\n        break;\n\n      case PlayerArchetype.JOJIK_POKRYEOKBAE:\n        // Jojik prefers: high damage, brutal techniques\n        if ((tech.damage || 0) >= 35) score += 35;\n        if ((tech.damage || 0) >= 30) score += 20;\n        if (damageType === DamageType.SLASHING) score += 20;\n        if (damageType === DamageType.PIERCING) score += 15;\n        if (damageType === DamageType.CRUSHING) score += 15;\n        if (attackType === CombatAttackType.KICK) score += 10;\n        break;\n    }\n\n    return { technique: tech, score };\n  });\n\n  // Sort by score descending, return highest scoring technique\n  scoredTechniques.sort((a, b) => b.score - a.score);\n  return scoredTechniques[0]?.technique;\n}\n\n/**\n * Calculate hit accuracy based on distance and effective reach.\n * Uses PhysicalReachCalculator for animation-aware reach calculation.\n *\n * Distance logic matches CombatSystem: if out of reach, guaranteed miss (accuracy 0).\n * Training scene coordinates are in meters, using METERS_TO_TRAINING_UNITS = 1.0.\n *\n * **IMPORTANT**: Distance calculation accounts for body radius.\n * Center-to-center distance is adjusted by subtracting target body radius\n * because attacks hit the body surface, not the center point.\n * The target body radius is calculated from physical attributes for archetypes,\n * or uses DEFAULT_BODY_RADIUS_METERS for training dummies.\n *\n * Example: If player center is 1.5m from dummy center, but dummy body\n * extends 0.23m from center, the effective distance to hit is 1.27m.\n *\n * @korean 거리 기반 명중률 계산 - 사정거리 밖이면 빗나감\n */\nfunction calculateHitAccuracy(\n  playerPos: [number, number, number],\n  dummyPos: [number, number, number],\n  archetype: import(\"../../../../types/common\").PlayerArchetype,\n  stance: TrigramStance,\n  animationType?: AnimationType,\n  reachConfig?: import(\"../../../../types/physics\").PhysicalReachConfig,\n): number {\n  // Calculate 3D distance between player and dummy centers (in meters)\n  const centerToCenterDistance = calculateDistance3D(playerPos, dummyPos);\n\n  // Get player's physical attributes for reach calculation\n  const playerPhysicalAttributes = getArchetypePhysicalAttributes(archetype);\n\n  // Training dummy uses default body radius since it has no archetype\n  // For combat between players, we would use calculateBodyRadius(targetPhysicalAttributes)\n  // 훈련 더미는 원형이 없으므로 기본 몸체 반경 사용\n  const targetBodyRadius = DEFAULT_BODY_RADIUS_METERS;\n\n  // Effective distance = center-to-center minus target body radius only\n  // Note: PhysicalReachCalculator already includes player body pivot/offset in reach calculation,\n  // so we only subtract the target radius to avoid double-counting.\n  // 유효 거리 = 중심간 거리 - 더미 몸체 반경 (플레이어 몸체 오프셋은 도달 거리에 포함됨)\n  const effectiveDistance = Math.max(\n    0,\n    centerToCenterDistance - targetBodyRadius,\n  );\n\n  // If animation type is available, use physics-based reach calculation\n  // We use calculateMaxReach (peak time reach) because:\n  // 1. Training hit detection happens at animation frame 6 (~100ms)\n  // 2. But technique hit timings expect longer animations (e.g., roundhouse 200-480ms)\n  // 3. Using max reach ensures the technique can hit if within peak reach range\n  // 4. This matches intuitive behavior - if you're close enough to be hit by the kick, it hits\n  // 훈련 타격 감지는 최대 도달 거리 사용 (애니메이션 타이밍과 기술 타이밍 불일치 보정)\n  if (animationType !== undefined) {\n    const maxReachMeters = physicalReachCalculator.calculateMaxReach(\n      playerPhysicalAttributes,\n      animationType,\n      stance,\n      reachConfig, // Use technique's designed reach if provided\n    );\n\n    // Convert reach from meters to training scene units.\n    // Training scenes are authored in real-world meters, so we intentionally\n    // use a 1:1 conversion here (METERS_TO_TRAINING_UNITS = 1.0).\n    // Combat AI uses METERS_TO_PIXELS_SCALE (100) for pixel coordinates.\n    const reachInUnits = maxReachMeters * METERS_TO_TRAINING_UNITS;\n\n    // STRICT DISTANCE CHECK (matches CombatSystem behavior):\n    // Out of reach = guaranteed miss with accuracy 0\n    if (effectiveDistance > reachInUnits) {\n      return 0;\n    }\n\n    // Within reach: accuracy based on how centered the hit is\n    // Closer = higher accuracy (0.7 to 1.0 range)\n    return Math.max(0.7, 1.0 - (effectiveDistance / reachInUnits) * 0.3);\n  }\n\n  // Fallback: use default punch reach (0.7 meters) for legacy behavior\n  const defaultReach = 0.7 * METERS_TO_TRAINING_UNITS;\n  if (effectiveDistance > defaultReach) {\n    return 0; // Out of reach = miss\n  }\n  // Within default reach: linear accuracy based on distance\n  return Math.max(0.5, 1.0 - (effectiveDistance / defaultReach) * 0.5);\n}\n\n/**\n * useTrainingActions hook\n * Provides training action handlers with proper memoization\n */\nexport function useTrainingActions(\n  config: UseTrainingActionsConfig,\n): UseTrainingActionsReturn {\n  const {\n    state,\n    actions,\n    player3DPosition,\n    dummyPosition,\n    playerArchetype,\n    playerStance,\n    currentTechniqueAnimationTypeRef,\n    audio,\n    playBoneImpactSound,\n    playAttackSound,\n    onPlayerUpdate,\n    playerAnimation,\n    pendingAttackRef,\n    selectedTechniqueId,\n    setAttackAnimation,\n  } = config;\n\n  // Ref to store timeout for dummy reset\n  const dummyResetTimeoutRef = useRef<NodeJS.Timeout | null>(null);\n\n  const handleStartTraining = useCallback(() => {\n    actions.startTraining();\n    audio.playSFX(\"menu_select\");\n  }, [actions, audio]);\n\n  const handleStopTraining = useCallback(() => {\n    // Clear any pending dummy reset timeout\n    if (dummyResetTimeoutRef.current) {\n      clearTimeout(dummyResetTimeoutRef.current);\n      dummyResetTimeoutRef.current = null;\n    }\n    actions.stopTraining();\n    audio.playSFX(\"menu_back\");\n  }, [actions, audio]);\n\n  const handleDummyDefeated = useCallback(() => {\n    actions.setFeedback(\"훈련 더미 무력화! | Dummy Defeated!\");\n    audio.playSFX(\"ki_release\");\n\n    // Clear any existing timeout\n    if (dummyResetTimeoutRef.current) {\n      clearTimeout(dummyResetTimeoutRef.current);\n    }\n\n    // Reset dummy health after delay\n    dummyResetTimeoutRef.current = setTimeout(() => {\n      actions.resetDummy();\n    }, 2000);\n  }, [actions, audio]);\n\n  const handleDummyHit = useCallback(\n    (\n      _vitalPointId: string,\n      attackContext?: {\n        animationType?: AnimationType;\n        techniqueId?: string;\n      },\n    ): boolean => {\n      // Get animation context from the passed attackContext parameter\n      // (TrainingScreen3D.tsx should pass the attackData before clearing the ref)\n      const animationType = attackContext?.animationType;\n\n      // Get technique's reachConfig for accurate reach calculation\n      // Priority: attackContext.techniqueId (resolved in handleAttack) > selectedTechniqueId\n      // This ensures default techniques (chosen when no explicit selection) also get their reachConfig\n      let reachConfig: import(\"../../../../types/physics\").PhysicalReachConfig | undefined;\n      const resolvedTechniqueId =\n        attackContext?.techniqueId ?? selectedTechniqueId;\n      if (resolvedTechniqueId) {\n        const technique = KoreanTechniquesSystem.getTechniqueById(resolvedTechniqueId);\n        reachConfig = technique?.reachConfig;\n      }\n\n      const accuracy = calculateHitAccuracy(\n        player3DPosition,\n        dummyPosition,\n        playerArchetype,\n        playerStance,\n        animationType,\n        reachConfig,\n      );\n\n      // Determine hit position (dummy center)\n      const hitPosition: [number, number, number] = [\n        dummyPosition[0],\n        1.5,\n        dummyPosition[2],\n      ];\n\n      if (accuracy > 0.5) {\n        const points = Math.round(accuracy * 100);\n        const damage = Math.round(accuracy * 15); // 0-15 damage based on accuracy\n        const isPerfect = accuracy > 0.9;\n\n        // Register hit with state (only counts if training)\n        if (state.isTraining) {\n          actions.registerHit(points, damage, isPerfect);\n        }\n\n        // Play bone impact audio with anatomical feedback using proper audio system\n        if (playBoneImpactSound) {\n          void playBoneImpactSound({\n            damage,\n            remainingHealth: 100, // Dummy has 100 health\n            vitalPoint: false,\n            hitPosition: { x: hitPosition[0], y: hitPosition[1], z: hitPosition[2] },\n          });\n        }\n\n        // Determine feedback and sound\n        let effectType: \"success\" | \"perfect\";\n        if (isPerfect) {\n          actions.setFeedback(\"완벽한 타격! | Perfect Strike!\");\n          audio.playSFX(\"ki_release\");\n          effectType = \"perfect\";\n        } else if (accuracy > 0.7) {\n          actions.setFeedback(\"좋은 타격! | Good Strike!\");\n          audio.playSFX(\"ki_charge\");\n          effectType = \"success\";\n        } else {\n          actions.setFeedback(\"타격 성공 | Strike Success\");\n          audio.playSFX(\"menu_click\");\n          effectType = \"success\";\n        }\n\n        // Add hit effect\n        actions.addHitEffect({\n          position: hitPosition,\n          type: effectType,\n          visible: true,\n          damage,\n        });\n\n        return true;\n      } else {\n        // Register miss (only counts if training)\n        if (state.isTraining) {\n          actions.registerMiss();\n        }\n        actions.setFeedback(\"빗나감 | Miss - Out of reach!\");\n        audio.playSFX(\"menu_navigate\");\n\n        // Add miss effect\n        actions.addHitEffect({\n          position: hitPosition,\n          type: \"miss\",\n          visible: true,\n        });\n\n        return false;\n      }\n    },\n    [\n      state.isTraining,\n      player3DPosition,\n      dummyPosition,\n      playerArchetype,\n      playerStance,\n      actions,\n      audio,\n      playBoneImpactSound,\n      selectedTechniqueId,\n    ],\n  );\n\n  const handleStanceChange = useCallback(\n    (stanceIndex: number) => {\n      actions.setStanceIndex(stanceIndex);\n      const stance = TRIGRAM_STANCES_ORDER[stanceIndex];\n      if (stance) {\n        // Directly transition to stance guard animation (skips transitional animation)\n        // 자세 가드 애니메이션으로 직접 전환 (전환 애니메이션 생략)\n        playerAnimation.transitionToStanceGuard(stance);\n        onPlayerUpdate({ currentStance: stance });\n        audio.playSFX(\"stance_change\");\n      }\n    },\n    [actions, onPlayerUpdate, audio, playerAnimation],\n  );\n\n  const handleAttack = useCallback(() => {\n    // Determine which technique to use:\n    // 1. If a technique is explicitly selected from the TechniqueBar, use that\n    // 2. Otherwise, use the best default technique for the archetype + stance\n    // 사용할 기술 결정: 명시적 선택 또는 원형+자세 기반 기본 기술\n    let techniqueToUse: KoreanTechnique | undefined;\n    let techniqueId = selectedTechniqueId;\n\n    if (!techniqueId) {\n      // No technique explicitly selected - get default for archetype + stance\n      // 명시적 선택 없음 - 원형과 자세에 맞는 기본 기술 사용\n      const defaultTechnique = getDefaultTechniqueForArchetype(\n        playerArchetype,\n        playerStance,\n      );\n      if (defaultTechnique) {\n        techniqueToUse = defaultTechnique;\n        techniqueId = defaultTechnique.id;\n      }\n    }\n\n    // Get the animation type from the technique\n    // 기술에서 애니메이션 타입 가져오기\n    let animationType = currentTechniqueAnimationTypeRef.current;\n    if (techniqueToUse?.animationType) {\n      animationType = techniqueToUse.animationType;\n      currentTechniqueAnimationTypeRef.current = animationType;\n    }\n\n    const startTime = performance.now() / 1000; // Current time in seconds\n\n    const accuracy = calculateHitAccuracy(\n      player3DPosition,\n      dummyPosition,\n      playerArchetype,\n      playerStance,\n      animationType,\n      techniqueToUse?.reachConfig, // Pass technique's reachConfig for accurate reach\n    );\n\n    pendingAttackRef.current = {\n      accuracy,\n      vitalPoint: state.selectedVitalPoint ?? \"generic\",\n      animationType,\n      startTime,\n      techniqueId, // Store resolved technique ID for handleDummyHit\n    };\n\n    // Set visual attack animation based on technique (AnimationRegistry lookup)\n    // This ensures the 3D model plays the correct technique animation (kick vs punch vs elbow)\n    // 기술에 따른 시각적 공격 애니메이션 설정 (발차기 vs 주먹 vs 팔꿈치)\n    if (setAttackAnimation && techniqueId) {\n      const animationName = getAnimationForTechnique(techniqueId);\n      setAttackAnimation(animationName);\n    }\n\n    // Trigger attack animation - this will fire onFrame event at frame 6\n    playerAnimation.transitionTo(AnimationState.ATTACK);\n\n    // Play attack sound based on technique damage/intensity\n    // Resolve technique data if we only have an ID (from TechniqueBar selection)\n    if (!techniqueToUse && selectedTechniqueId) {\n      // Technique selected from TechniqueBar but not yet resolved\n      techniqueToUse = KoreanTechniquesSystem.getTechniqueById(selectedTechniqueId);\n    }\n\n    if (playAttackSound) {\n      // Prefer explicit technique damage when available\n      const damage = techniqueToUse?.damage ?? 10;\n      const intensity: AttackIntensity =\n        damage >= 40\n          ? \"critical\"\n          : damage >= 25\n            ? \"heavy\"\n            : damage >= 10\n              ? \"medium\"\n              : \"light\";\n      void playAttackSound(intensity);\n    } else {\n      // Fallback to generic whoosh if playAttackSound not available\n      audio.playSFX(\"whoosh\");\n    }\n  }, [\n    state.selectedVitalPoint,\n    player3DPosition,\n    dummyPosition,\n    playerArchetype,\n    playerStance,\n    currentTechniqueAnimationTypeRef,\n    playerAnimation,\n    audio,\n    playAttackSound,\n    pendingAttackRef,\n    selectedTechniqueId,\n    setAttackAnimation,\n  ]);\n\n  return {\n    handleStartTraining,\n    handleStopTraining,\n    handleDummyHit,\n    handleDummyDefeated,\n    handleStanceChange,\n    handleAttack,\n  };\n}\n\nexport default useTrainingActions;\n"],"mappings":"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"}

package/lib/components/screens/training/hooks/useTrainingLayout.d.ts

@@ -0,0 +1,62 @@
+/**
+ * useTrainingLayout Hook - Enhanced Responsive Training Layout
+ *
+ * Custom hook for managing responsive training screen layout calculations with
+ * comprehensive support for all screen sizes from mobile to ultra-wide displays.
+ *
+ * Enhanced Features:
+ * - Five screen size categories (mobile, tablet, desktop, large, xlarge)
+ * - Proportional scaling for consistent sizing across devices
+ * - Optimized layout sizing for each device category
+ * - Smooth transitions for resize operations
+ * - 60fps performance maintained
+ *
+ * Uses robust device detection combining user-agent and screen size to ensure
+ * mobile controls are shown on all mobile devices, including high-resolution phones.
+ *
+ * Performance:
+ * - Reduces recalculations by checking only breakpoint changes, not exact dimensions
+ * - Memoizes layout constants to prevent cascading re-renders
+ * - Targets <1ms execution time for layout calculations
+ *
+ * @param width - Screen width
+ * @param height - Screen height
+ *
+ * @returns Layout constants and training area bounds
+ *
+ * @example
+ * ```typescript
+ * const { layoutConstants, trainingAreaBounds, isMobile, screenSize } = useTrainingLayout(1200, 800);
+ * ```
+ */
+import type { ScreenSize } from "../../../../systems/ResponsiveScaling";
+export interface TrainingLayoutConstants {
+    readonly padding: number;
+    readonly headerHeight: number;
+    readonly buttonHeight: number;
+    readonly sectionSpacing: number;
+    readonly controlsHeight: number;
+    readonly footerHeight: number;
+}
+export interface TrainingAreaBounds {
+    readonly x: number;
+    readonly y: number;
+    readonly width: number;
+    readonly height: number;
+    readonly scale: number;
+    readonly worldWidthMeters: number;
+    readonly worldDepthMeters: number;
+}
+export interface TrainingLayout {
+    readonly layoutConstants: TrainingLayoutConstants;
+    readonly trainingAreaBounds: TrainingAreaBounds;
+    readonly isMobile: boolean;
+    readonly screenSize: ScreenSize;
+}
+/**
+ * Custom hook for training screen layout calculations
+ * Enhanced with centralized responsive scaling system
+ * Optimized to reduce recalculations and improve 60fps performance
+ */
+export declare function useTrainingLayout(width: number, height: number): TrainingLayout;
+//# sourceMappingURL=useTrainingLayout.d.ts.map

package/lib/components/screens/training/hooks/useTrainingLayout.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTrainingLayout.d.ts","sourceRoot":"","sources":["../../../../../src/components/screens/training/hooks/useTrainingLayout.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AAQH,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,uCAAuC,CAAC;AAExE,MAAM,WAAW,uBAAuB;IACtC,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAC;IACzB,QAAQ,CAAC,YAAY,EAAE,MAAM,CAAC;IAC9B,QAAQ,CAAC,YAAY,EAAE,MAAM,CAAC;IAC9B,QAAQ,CAAC,cAAc,EAAE,MAAM,CAAC;IAChC,QAAQ,CAAC,cAAc,EAAE,MAAM,CAAC;IAChC,QAAQ,CAAC,YAAY,EAAE,MAAM,CAAC;CAC/B;AAED,MAAM,WAAW,kBAAkB;IACjC,QAAQ,CAAC,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,gBAAgB,EAAE,MAAM,CAAC;IAClC,QAAQ,CAAC,gBAAgB,EAAE,MAAM,CAAC;CACnC;AAED,MAAM,WAAW,cAAc;IAC7B,QAAQ,CAAC,eAAe,EAAE,uBAAuB,CAAC;IAClD,QAAQ,CAAC,kBAAkB,EAAE,kBAAkB,CAAC;IAChD,QAAQ,CAAC,QAAQ,EAAE,OAAO,CAAC;IAC3B,QAAQ,CAAC,UAAU,EAAE,UAAU,CAAC;CACjC;AAED;;;;GAIG;AACH,wBAAgB,iBAAiB,CAC/B,KAAK,EAAE,MAAM,EACb,MAAM,EAAE,MAAM,GACb,cAAc,CA8FhB"}

package/lib/components/screens/training/hooks/useTrainingLayout.js

@@ -0,0 +1,96 @@
+import { getScreenSize } from "../../../../systems/ResponsiveScaling.js";
+import { calculateArenaWorldDimensions } from "../../../../utils/arenaWorldDimensions.js";
+import { shouldUseMobileControls } from "../../../../utils/deviceDetection.js";
+import { calculateMobileAreaBounds } from "../../../../utils/mobileLayoutHelpers.js";
+import { useMemo } from "react";
+//#region src/components/screens/training/hooks/useTrainingLayout.ts
+/**
+* useTrainingLayout Hook - Enhanced Responsive Training Layout
+*
+* Custom hook for managing responsive training screen layout calculations with
+* comprehensive support for all screen sizes from mobile to ultra-wide displays.
+*
+* Enhanced Features:
+* - Five screen size categories (mobile, tablet, desktop, large, xlarge)
+* - Proportional scaling for consistent sizing across devices
+* - Optimized layout sizing for each device category
+* - Smooth transitions for resize operations
+* - 60fps performance maintained
+*
+* Uses robust device detection combining user-agent and screen size to ensure
+* mobile controls are shown on all mobile devices, including high-resolution phones.
+*
+* Performance:
+* - Reduces recalculations by checking only breakpoint changes, not exact dimensions
+* - Memoizes layout constants to prevent cascading re-renders
+* - Targets <1ms execution time for layout calculations
+*
+* @param width - Screen width
+* @param height - Screen height
+*
+* @returns Layout constants and training area bounds
+*
+* @example
+* ```typescript
+* const { layoutConstants, trainingAreaBounds, isMobile, screenSize } = useTrainingLayout(1200, 800);
+* ```
+*/
+/**
+* Custom hook for training screen layout calculations
+* Enhanced with centralized responsive scaling system
+* Optimized to reduce recalculations and improve 60fps performance
+*/
+function useTrainingLayout(width, height) {
+	const screenSize = useMemo(() => getScreenSize(width), [width]);
+	const isMobile = shouldUseMobileControls();
+	const layoutConstants = useMemo(() => {
+		const isLargeDesktop = screenSize === "xlarge";
+		const isTablet = screenSize === "tablet";
+		return {
+			padding: isMobile ? 20 : isTablet ? 25 : isLargeDesktop ? 35 : 30,
+			headerHeight: isMobile ? 80 : isTablet ? 90 : isLargeDesktop ? 110 : 100,
+			buttonHeight: isMobile ? 45 : isTablet ? 50 : isLargeDesktop ? 60 : 55,
+			sectionSpacing: isMobile ? 15 : isTablet ? 18 : isLargeDesktop ? 25 : 20,
+			controlsHeight: isMobile ? 120 : isTablet ? 110 : isLargeDesktop ? 150 : 130,
+			footerHeight: isMobile ? 60 : isTablet ? 70 : isLargeDesktop ? 90 : 80
+		};
+	}, [isMobile, screenSize]);
+	return {
+		layoutConstants,
+		trainingAreaBounds: useMemo(() => {
+			const areaY = layoutConstants.headerHeight + layoutConstants.padding;
+			const worldDimensions = calculateArenaWorldDimensions(width);
+			if (isMobile) return calculateMobileAreaBounds(width, height, 80, 120, areaY);
+			const totalReservedHeight = layoutConstants.headerHeight + layoutConstants.controlsHeight + layoutConstants.footerHeight;
+			const totalPadding = layoutConstants.padding * 3;
+			const availableHeight = height - totalReservedHeight - totalPadding;
+			let arenaWidth = width * .8;
+			let arenaHeight = arenaWidth * (3 / 4);
+			if (arenaHeight > availableHeight) {
+				arenaHeight = availableHeight;
+				arenaWidth = arenaHeight * (4 / 3);
+			}
+			const scale = arenaWidth / worldDimensions.widthMeters / 100;
+			return {
+				x: (width - arenaWidth) / 2,
+				y: areaY,
+				width: arenaWidth,
+				height: arenaHeight,
+				scale,
+				worldWidthMeters: worldDimensions.widthMeters,
+				worldDepthMeters: worldDimensions.depthMeters
+			};
+		}, [
+			width,
+			height,
+			layoutConstants,
+			isMobile
+		]),
+		isMobile,
+		screenSize
+	};
+}
+//#endregion
+export { useTrainingLayout };
+
+//# sourceMappingURL=useTrainingLayout.js.map

package/lib/components/screens/training/hooks/useTrainingLayout.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTrainingLayout.js","names":[],"sources":["../../../../../src/components/screens/training/hooks/useTrainingLayout.ts"],"sourcesContent":["/**\n * useTrainingLayout Hook - Enhanced Responsive Training Layout\n *\n * Custom hook for managing responsive training screen layout calculations with\n * comprehensive support for all screen sizes from mobile to ultra-wide displays.\n *\n * Enhanced Features:\n * - Five screen size categories (mobile, tablet, desktop, large, xlarge)\n * - Proportional scaling for consistent sizing across devices\n * - Optimized layout sizing for each device category\n * - Smooth transitions for resize operations\n * - 60fps performance maintained\n *\n * Uses robust device detection combining user-agent and screen size to ensure\n * mobile controls are shown on all mobile devices, including high-resolution phones.\n *\n * Performance:\n * - Reduces recalculations by checking only breakpoint changes, not exact dimensions\n * - Memoizes layout constants to prevent cascading re-renders\n * - Targets <1ms execution time for layout calculations\n *\n * @param width - Screen width\n * @param height - Screen height\n *\n * @returns Layout constants and training area bounds\n *\n * @example\n * ```typescript\n * const { layoutConstants, trainingAreaBounds, isMobile, screenSize } = useTrainingLayout(1200, 800);\n * ```\n */\n\nimport { useMemo } from \"react\";\nimport { getScreenSize } from \"../../../../systems/ResponsiveScaling\";\nimport { calculateArenaWorldDimensions } from \"../../../../utils/arenaWorldDimensions\";\nimport { shouldUseMobileControls } from \"../../../../utils/deviceDetection\";\nimport { calculateMobileAreaBounds } from \"../../../../utils/mobileLayoutHelpers\";\n\nimport type { ScreenSize } from \"../../../../systems/ResponsiveScaling\";\n\nexport interface TrainingLayoutConstants {\n  readonly padding: number;\n  readonly headerHeight: number;\n  readonly buttonHeight: number;\n  readonly sectionSpacing: number;\n  readonly controlsHeight: number;\n  readonly footerHeight: number;\n}\n\nexport interface TrainingAreaBounds {\n  readonly x: number;\n  readonly y: number;\n  readonly width: number;\n  readonly height: number;\n  readonly scale: number; // 3D scale factor for training area (1.0 = desktop, <1.0 = mobile)\n  readonly worldWidthMeters: number; // Physical training area width in meters\n  readonly worldDepthMeters: number; // Physical training area depth in meters\n}\n\nexport interface TrainingLayout {\n  readonly layoutConstants: TrainingLayoutConstants;\n  readonly trainingAreaBounds: TrainingAreaBounds;\n  readonly isMobile: boolean;\n  readonly screenSize: ScreenSize;\n}\n\n/**\n * Custom hook for training screen layout calculations\n * Enhanced with centralized responsive scaling system\n * Optimized to reduce recalculations and improve 60fps performance\n */\nexport function useTrainingLayout(\n  width: number,\n  height: number,\n): TrainingLayout {\n  // Determine screen size category using centralized scaling system\n  const screenSize = useMemo(() => getScreenSize(width), [width]);\n\n  // Device detection has its own internal caching based on screen dimensions\n  // No need for additional React memoization here\n  const isMobile = shouldUseMobileControls();\n\n  // Centralized layout constants for easier tweaking\n  // Enhanced with tablet-specific values for better responsive support\n  const layoutConstants = useMemo<TrainingLayoutConstants>(() => {\n    // Determine if large desktop\n    const isLargeDesktop = screenSize === \"xlarge\";\n    const isTablet = screenSize === \"tablet\";\n\n    return {\n      padding: isMobile ? 20 : isTablet ? 25 : isLargeDesktop ? 35 : 30,\n      headerHeight: isMobile ? 80 : isTablet ? 90 : isLargeDesktop ? 110 : 100,\n      buttonHeight: isMobile ? 45 : isTablet ? 50 : isLargeDesktop ? 60 : 55,\n      sectionSpacing: isMobile ? 15 : isTablet ? 18 : isLargeDesktop ? 25 : 20,\n      controlsHeight: isMobile\n        ? 120\n        : isTablet\n          ? 110\n          : isLargeDesktop\n            ? 150\n            : 130,\n      footerHeight: isMobile ? 60 : isTablet ? 70 : isLargeDesktop ? 90 : 80,\n    };\n  }, [isMobile, screenSize]);\n\n  // Training area bounds using physics-first 4:3 aspect ratio sizing\n  // Arena size is based on resolution (6×4.5, 8×6, 10×7.5, 12×9, 14×10.5 meters)\n  const trainingAreaBounds = useMemo<TrainingAreaBounds>(() => {\n    const areaY = layoutConstants.headerHeight + layoutConstants.padding;\n\n    // Calculate world dimensions based on screen resolution (not device type)\n    const worldDimensions = calculateArenaWorldDimensions(width);\n\n    // Mobile-specific training area sizing for better screen fit\n    if (isMobile) {\n      // Use shared mobile area calculation for consistency with combat screen\n      // Mobile bounds already include world dimensions from resolution\n      return calculateMobileAreaBounds(\n        width,\n        height,\n        80, // minTopClearance (header space)\n        120, // minBottomClearance (controls space)\n        areaY,\n      );\n    }\n\n    // Desktop training area sizing - create 4:3 aspect ratio arena\n    const totalReservedHeight =\n      layoutConstants.headerHeight +\n      layoutConstants.controlsHeight +\n      layoutConstants.footerHeight;\n    const totalPadding = layoutConstants.padding * 3;\n    const availableHeight = height - totalReservedHeight - totalPadding;\n    const availableWidth = width * 0.8;\n\n    // Calculate arena dimensions with 4:3 aspect ratio (width > height)\n    // Start with available width, constrain by height if needed\n    let arenaWidth = availableWidth;\n    let arenaHeight = arenaWidth * (3 / 4); // 4:3 aspect ratio\n\n    // If height is constrained, recalculate from height\n    if (arenaHeight > availableHeight) {\n      arenaHeight = availableHeight;\n      arenaWidth = arenaHeight * (4 / 3);\n    }\n\n    // Calculate pixels-per-meter and scale\n    const pixelsPerMeter = arenaWidth / worldDimensions.widthMeters;\n    const referencePixelsPerMeter = 100;\n    const scale = pixelsPerMeter / referencePixelsPerMeter;\n\n    return {\n      x: (width - arenaWidth) / 2, // Center horizontally\n      y: areaY,\n      width: arenaWidth,\n      height: arenaHeight, // 4:3 aspect ratio\n      scale,\n      worldWidthMeters: worldDimensions.widthMeters,\n      worldDepthMeters: worldDimensions.depthMeters,\n    };\n  }, [width, height, layoutConstants, isMobile]);\n\n  return {\n    layoutConstants,\n    trainingAreaBounds,\n    isMobile,\n    screenSize,\n  };\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuEA,SAAgB,kBACd,OACA,QACgB;CAEhB,MAAM,aAAa,cAAc,cAAc,MAAM,EAAE,CAAC,MAAM,CAAC;CAI/D,MAAM,WAAW,yBAAyB;CAI1C,MAAM,kBAAkB,cAAuC;EAE7D,MAAM,iBAAiB,eAAe;EACtC,MAAM,WAAW,eAAe;AAEhC,SAAO;GACL,SAAS,WAAW,KAAK,WAAW,KAAK,iBAAiB,KAAK;GAC/D,cAAc,WAAW,KAAK,WAAW,KAAK,iBAAiB,MAAM;GACrE,cAAc,WAAW,KAAK,WAAW,KAAK,iBAAiB,KAAK;GACpE,gBAAgB,WAAW,KAAK,WAAW,KAAK,iBAAiB,KAAK;GACtE,gBAAgB,WACZ,MACA,WACE,MACA,iBACE,MACA;GACR,cAAc,WAAW,KAAK,WAAW,KAAK,iBAAiB,KAAK;GACrE;IACA,CAAC,UAAU,WAAW,CAAC;AA2D1B,QAAO;EACL;EACA,oBAzDyB,cAAkC;GAC3D,MAAM,QAAQ,gBAAgB,eAAe,gBAAgB;GAG7D,MAAM,kBAAkB,8BAA8B,MAAM;AAG5D,OAAI,SAGF,QAAO,0BACL,OACA,QACA,IACA,KACA,MACD;GAIH,MAAM,sBACJ,gBAAgB,eAChB,gBAAgB,iBAChB,gBAAgB;GAClB,MAAM,eAAe,gBAAgB,UAAU;GAC/C,MAAM,kBAAkB,SAAS,sBAAsB;GAKvD,IAAI,aAJmB,QAAQ;GAK/B,IAAI,cAAc,cAAc,IAAI;AAGpC,OAAI,cAAc,iBAAiB;AACjC,kBAAc;AACd,iBAAa,eAAe,IAAI;;GAMlC,MAAM,QAFiB,aAAa,gBAAgB,cACpB;AAGhC,UAAO;IACL,IAAI,QAAQ,cAAc;IAC1B,GAAG;IACH,OAAO;IACP,QAAQ;IACR;IACA,kBAAkB,gBAAgB;IAClC,kBAAkB,gBAAgB;IACnC;KACA;GAAC;GAAO;GAAQ;GAAiB;GAAS,CAAC;EAK5C;EACA;EACD"}

package/lib/components/screens/training/hooks/useTrainingState.d.ts

@@ -0,0 +1,100 @@
+/**
+ * useTrainingState Hook - Consolidated Training State Management
+ *
+ * Custom hook for managing training state using useReducer.
+ * Mirrors useCombatState pattern for consistency.
+ *
+ * @korean 훈련상태관리훅 - useReducer를 사용한 통합 훈련 상태 관리
+ */
+import type { AnatomyLayer } from "../components/AnatomyOverlay3D";
+import type { FootworkDrill } from "../components/FootworkDrillsOverlayHtml";
+import type { TrainingMode } from "../components/TrainingModeSelectorOverlayHtml";
+export type { AnatomyLayer, FootworkDrill, TrainingMode };
+/**
+ * Training statistics
+ */
+export interface TrainingStats {
+    readonly score: number;
+    readonly combo: number;
+    readonly hits: number;
+    readonly misses: number;
+    readonly accuracy: number;
+    readonly sessionDuration?: number;
+    readonly bestCombo?: number;
+    readonly perfectStrikes?: number;
+}
+/**
+ * Hit effect for training
+ */
+export interface TrainingHitEffect {
+    readonly id: number;
+    readonly position: [number, number, number];
+    readonly type: "success" | "perfect" | "miss";
+    readonly visible: boolean;
+    readonly damage?: number;
+}
+/**
+ * Training screen state managed by the reducer
+ */
+export interface TrainingScreenState {
+    readonly trainingMode: TrainingMode;
+    readonly isTraining: boolean;
+    readonly selectedVitalPoint: string | null;
+    readonly feedback: string;
+    readonly showFeedback: boolean;
+    readonly hitEffects: TrainingHitEffect[];
+    readonly nextEffectId: number;
+    readonly dummyHealth: number;
+    readonly sessionStartTime: number | null;
+    readonly sessionDuration: number;
+    readonly perfectStrikes: number;
+    readonly bestCombo: number;
+    readonly stats: TrainingStats;
+    readonly currentStanceIndex: number;
+    readonly stanceWheelExpanded: boolean;
+    readonly visibleAnatomyLayers: AnatomyLayer[];
+    readonly footworkDrillActive: boolean;
+    readonly footworkDrillType: FootworkDrill;
+    readonly footworkDrillStep: number;
+}
+/**
+ * Training state actions interface
+ */
+export interface TrainingActions {
+    readonly setTrainingMode: (mode: TrainingMode) => void;
+    readonly startTraining: () => void;
+    readonly stopTraining: () => void;
+    readonly setSelectedVitalPoint: (point: string | null) => void;
+    readonly setFeedback: (feedback: string, show?: boolean) => void;
+    readonly hideFeedback: () => void;
+    readonly addHitEffect: (effect: Omit<TrainingHitEffect, "id">) => void;
+    readonly removeHitEffect: (id: number) => void;
+    readonly setDummyHealth: (health: number) => void;
+    readonly resetDummy: () => void;
+    readonly updateSessionDuration: (duration: number) => void;
+    readonly registerHit: (points: number, damage: number, isPerfect: boolean) => void;
+    readonly registerMiss: () => void;
+    readonly setStanceIndex: (index: number) => void;
+    readonly toggleStanceWheel: () => void;
+    readonly updateBestCombo: (combo: number) => void;
+    readonly toggleAnatomyLayer: (layer: AnatomyLayer) => void;
+    readonly setAnatomyLayers: (layers: AnatomyLayer[]) => void;
+    readonly startFootworkDrill: (drillType: FootworkDrill) => void;
+    readonly stopFootworkDrill: () => void;
+    readonly advanceFootworkStep: () => void;
+    readonly resetFootworkDrill: () => void;
+}
+/**
+ * Hook return type
+ */
+export interface UseTrainingStateReturn {
+    readonly state: TrainingScreenState;
+    readonly actions: TrainingActions;
+}
+/**
+ * useTrainingState hook
+ * Provides consolidated training state management using useReducer
+ */
+export declare function useTrainingState(): UseTrainingStateReturn;
+export default useTrainingState;
+//# sourceMappingURL=useTrainingState.d.ts.map

package/lib/components/screens/training/hooks/useTrainingState.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTrainingState.d.ts","sourceRoot":"","sources":["../../../../../src/components/screens/training/hooks/useTrainingState.ts"],"names":[],"mappings":"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"}