blacktrigram 0.7.2

package/lib/components/screens/combat/components/effects/TraumaOverlay3D.js

@@ -0,0 +1,296 @@
+import { KOREAN_COLORS } from "../../../../../types/constants/colors.js";
+import { FONT_FAMILY } from "../../../../../types/constants/typography.js";
+import "../../../../../types/constants/index.js";
+import { InjuryType } from "../../../../../types/injury.js";
+import { hexToRgbaString } from "../../../../../utils/colorUtils.js";
+import { useMemo } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Html } from "@react-three/drei";
+import * as THREE from "three";
+//#region src/components/screens/combat/components/effects/TraumaOverlay3D.tsx
+/**
+* TraumaOverlay3D - Bruising and injury visualization system
+*
+* Renders progressive bruising, cuts, and bone fracture indicators on 3D character models
+* using shader-based texture overlays with color blending. Bruises darken with repeated
+* hits to the same body region and persist across combat rounds.
+*
+* Features:
+* - Progressive bruising (purple/black gradients)
+* - Cut/laceration marks for sharp strikes
+* - Bone fracture indicators at <30% health
+* - Injury persistence across rounds
+* - Korean-themed injury visualization
+*
+* @module components/combat/TraumaOverlay3D
+* @category Combat Effects
+* @korean 외상오버레이3D
+*/
+/**
+* Color constants for injury visualization
+*/
+var INJURY_COLORS = {
+	BRUISE_FRESH: 9109504,
+	BRUISE_OLD: 4915330,
+	BRUISE_SEVERE: 0,
+	CUT_COLOR: 16711680,
+	FRACTURE_INDICATOR: KOREAN_COLORS.ACCENT_GOLD
+};
+/**
+* Get bruise color based on severity and hit count
+*/
+var getBruiseColor = (severity, hitCount) => {
+	if (hitCount >= 3 || severity > .8) return INJURY_COLORS.BRUISE_SEVERE;
+	else if (hitCount >= 2 || severity > .5) return INJURY_COLORS.BRUISE_OLD;
+	else return INJURY_COLORS.BRUISE_FRESH;
+};
+/**
+* Get injury size based on severity
+*/
+var getInjurySize = (severity) => {
+	return .1 + severity * .3;
+};
+/**
+* InjuryMarker - Individual injury visualization
+*/
+var InjuryMarker = ({ injury, characterPosition, isMobile }) => {
+	const worldPosition = useMemo(() => {
+		return [
+			characterPosition[0] + injury.position[0],
+			characterPosition[1] + injury.position[1],
+			characterPosition[2] + injury.position[2]
+		];
+	}, [characterPosition, injury.position]);
+	const size = useMemo(() => getInjurySize(injury.severity), [injury.severity]);
+	switch (injury.type) {
+		case InjuryType.BRUISE: {
+			const color = getBruiseColor(injury.severity, injury.hitCount);
+			const opacity = Math.min(.8, .3 + injury.severity * .5);
+			return /* @__PURE__ */ jsxs("mesh", {
+				position: worldPosition,
+				"data-testid": `injury-${injury.id}`,
+				children: [/* @__PURE__ */ jsx("sphereGeometry", { args: [
+					size,
+					isMobile ? 8 : 16,
+					isMobile ? 8 : 16
+				] }), /* @__PURE__ */ jsx("meshBasicMaterial", {
+					color,
+					transparent: true,
+					opacity,
+					depthTest: true
+				})]
+			});
+		}
+		case InjuryType.CUT:
+		case InjuryType.LACERATION: {
+			const cutLength = injury.type === InjuryType.LACERATION ? size * 3 : size * 2;
+			return /* @__PURE__ */ jsxs("group", {
+				position: worldPosition,
+				"data-testid": `injury-${injury.id}`,
+				children: [/* @__PURE__ */ jsxs("mesh", { children: [/* @__PURE__ */ jsx("boxGeometry", { args: [
+					cutLength,
+					.02,
+					.02
+				] }), /* @__PURE__ */ jsx("meshBasicMaterial", {
+					color: INJURY_COLORS.CUT_COLOR,
+					transparent: true,
+					opacity: .9
+				})] }), injury.type === InjuryType.LACERATION && /* @__PURE__ */ jsxs("mesh", {
+					position: [
+						0,
+						-size * .5,
+						0
+					],
+					children: [/* @__PURE__ */ jsx("boxGeometry", { args: [
+						.02,
+						size,
+						.02
+					] }), /* @__PURE__ */ jsx("meshBasicMaterial", {
+						color: KOREAN_COLORS.BLOODLOSS_INDICATOR,
+						transparent: true,
+						opacity: .7
+					})]
+				})]
+			});
+		}
+		case InjuryType.FRACTURE: return /* @__PURE__ */ jsxs("group", {
+			position: worldPosition,
+			"data-testid": `injury-${injury.id}`,
+			children: [
+				/* @__PURE__ */ jsxs("mesh", {
+					rotation: [
+						-Math.PI / 2,
+						0,
+						0
+					],
+					children: [/* @__PURE__ */ jsx("ringGeometry", { args: [
+						size * .8,
+						size,
+						16
+					] }), /* @__PURE__ */ jsx("meshBasicMaterial", {
+						color: INJURY_COLORS.FRACTURE_INDICATOR,
+						transparent: true,
+						opacity: .6,
+						side: THREE.DoubleSide
+					})]
+				}),
+				/* @__PURE__ */ jsxs("mesh", { children: [/* @__PURE__ */ jsx("boxGeometry", { args: [
+					size * 2,
+					.02,
+					.02
+				] }), /* @__PURE__ */ jsx("meshBasicMaterial", {
+					color: INJURY_COLORS.FRACTURE_INDICATOR,
+					transparent: true,
+					opacity: .8
+				})] }),
+				/* @__PURE__ */ jsxs("mesh", {
+					rotation: [
+						0,
+						0,
+						Math.PI / 2
+					],
+					children: [/* @__PURE__ */ jsx("boxGeometry", { args: [
+						size * 2,
+						.02,
+						.02
+					] }), /* @__PURE__ */ jsx("meshBasicMaterial", {
+						color: INJURY_COLORS.FRACTURE_INDICATOR,
+						transparent: true,
+						opacity: .8
+					})]
+				})
+			]
+		});
+		default: return null;
+	}
+};
+/**
+* FractureWarning - Html overlay warning for critical bone damage
+* 
+* Rendered as a styled Html overlay with Korean/English text and alert semantics.
+*/
+var FractureWarning = ({ health, isMobile }) => {
+	const warningOpacity = useMemo(() => {
+		const rawOpacity = .5 + (30 - health) / 60;
+		return Math.min(1, Math.max(0, rawOpacity));
+	}, [health]);
+	if (health >= 30) return null;
+	return /* @__PURE__ */ jsxs(Html, {
+		center: true,
+		position: [
+			0,
+			2.5,
+			0
+		],
+		children: [/* @__PURE__ */ jsx("div", {
+			style: {
+				padding: isMobile ? "8px 12px" : "10px 16px",
+				backgroundColor: hexToRgbaString(INJURY_COLORS.FRACTURE_INDICATOR, warningOpacity * .3),
+				border: `2px solid ${hexToRgbaString(INJURY_COLORS.FRACTURE_INDICATOR, 1)}`,
+				borderRadius: "6px",
+				fontSize: isMobile ? "12px" : "14px",
+				color: hexToRgbaString(INJURY_COLORS.FRACTURE_INDICATOR, 1),
+				fontWeight: "bold",
+				textShadow: "0 0 4px rgba(0,0,0,0.8)",
+				animation: "fracturePulse 1s ease-in-out infinite",
+				fontFamily: FONT_FAMILY.KOREAN
+			},
+			"data-testid": "fracture-warning",
+			role: "alert",
+			"aria-live": "assertive",
+			children: "⚠️ 골절위험 | Bone Fracture Risk"
+		}), /* @__PURE__ */ jsx("style", { children: `
+          @keyframes fracturePulse {
+            0%, 100% { opacity: 0.7; transform: scale(1); }
+            50% { opacity: 1; transform: scale(1.05); }
+          }
+        ` })]
+	});
+};
+/**
+* TraumaOverlay3D Component
+*
+* Visualizes progressive combat trauma including bruising, cuts, and bone damage
+* on 3D character models. Injuries persist across rounds and darken with repeated
+* hits to the same body region.
+*
+* @example
+* ```tsx
+* const [injuries, setInjuries] = useState<Injury[]>([]);
+*
+* // On hit event
+* const handleHit = (region: BodyRegion, position: [number, number, number], type: InjuryType) => {
+*   const existingInjury = injuries.find(i => 
+*     i.region === region && 
+*     distance(i.position, position) < 0.2
+*   );
+*
+*   if (existingInjury) {
+*     // Progressive bruising - increase hit count
+*     setInjuries(prev => prev.map(i => 
+*       i.id === existingInjury.id 
+*         ? { ...i, hitCount: i.hitCount + 1, severity: Math.min(1.0, i.severity + 0.2) }
+*         : i
+*     ));
+*   } else {
+*     // New injury
+*     setInjuries([...injuries, {
+*       id: generateId(),
+*       region,
+*       type,
+*       position,
+*       severity: 0.5,
+*       hitCount: 1,
+*       timestamp: Date.now(),
+*     }]);
+*   }
+* };
+*
+* <TraumaOverlay3D
+*   playerId={playerId}
+*   health={playerHealth}
+*   injuries={injuries}
+*   characterPosition={characterPosition}
+*   isMobile={isMobile}
+*   showFractures={true}
+* />
+* ```
+*/
+var TraumaOverlay3D = ({ playerId, health, injuries, characterPosition, isMobile = false, showFractures = true }) => {
+	const playerInjuries = useMemo(() => {
+		if (playerId === null || playerId === void 0) return injuries;
+		return injuries.filter((injury) => {
+			if (injury.playerId === null || injury.playerId === void 0) return true;
+			return injury.playerId === playerId;
+		});
+	}, [injuries, playerId]);
+	const { fractures, otherInjuries } = useMemo(() => {
+		return {
+			fractures: playerInjuries.filter((i) => i.type === InjuryType.FRACTURE),
+			otherInjuries: playerInjuries.filter((i) => i.type !== InjuryType.FRACTURE)
+		};
+	}, [playerInjuries]);
+	return /* @__PURE__ */ jsxs("group", {
+		"data-testid": `trauma-overlay-${playerId}`,
+		children: [
+			otherInjuries.map((injury) => /* @__PURE__ */ jsx(InjuryMarker, {
+				injury,
+				characterPosition,
+				isMobile
+			}, injury.id)),
+			showFractures && health < 30 && fractures.map((injury) => /* @__PURE__ */ jsx(InjuryMarker, {
+				injury,
+				characterPosition,
+				isMobile
+			}, injury.id)),
+			showFractures && health < 30 && fractures.length > 0 && /* @__PURE__ */ jsx(FractureWarning, {
+				health,
+				isMobile
+			})
+		]
+	});
+};
+//#endregion
+export { TraumaOverlay3D as default };
+
+//# sourceMappingURL=TraumaOverlay3D.js.map

package/lib/components/screens/combat/components/effects/TraumaOverlay3D.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TraumaOverlay3D.js","names":[],"sources":["../../../../../../src/components/screens/combat/components/effects/TraumaOverlay3D.tsx"],"sourcesContent":["/**\n * TraumaOverlay3D - Bruising and injury visualization system\n *\n * Renders progressive bruising, cuts, and bone fracture indicators on 3D character models\n * using shader-based texture overlays with color blending. Bruises darken with repeated\n * hits to the same body region and persist across combat rounds.\n *\n * Features:\n * - Progressive bruising (purple/black gradients)\n * - Cut/laceration marks for sharp strikes\n * - Bone fracture indicators at <30% health\n * - Injury persistence across rounds\n * - Korean-themed injury visualization\n *\n * @module components/combat/TraumaOverlay3D\n * @category Combat Effects\n * @korean 외상오버레이3D\n */\n\nimport { Html } from \"@react-three/drei\";\nimport React, { useMemo } from \"react\";\nimport * as THREE from \"three\";\nimport { KOREAN_COLORS, FONT_FAMILY } from \"../../../../../types/constants\";\nimport { hexToRgbaString } from \"../../../../../utils/colorUtils\";\nimport { InjuryType, Injury } from \"../../../../../types/injury\";\n\n/**\n * Props for TraumaOverlay3D component\n */\nexport interface TraumaOverlay3DProps {\n  /** Character ID for injury tracking */\n  readonly playerId: string;\n  /** Current health (0-100) */\n  readonly health: number;\n  /** Active injuries to visualize */\n  readonly injuries: readonly Injury[];\n  /** Character position in world space */\n  readonly characterPosition: [number, number, number];\n  /** Whether character is mobile (simplified visualization) */\n  readonly isMobile?: boolean;\n  /** Whether to show fracture indicators */\n  readonly showFractures?: boolean;\n}\n\n// Re-export for backward compatibility\nexport { InjuryType };\nexport type { Injury };\n\n/**\n * Color constants for injury visualization\n */\nconst INJURY_COLORS = {\n  BRUISE_FRESH: 0x8B0000,      // Dark red (fresh bruise)\n  BRUISE_OLD: 0x4B0082,        // Indigo (aging bruise)\n  BRUISE_SEVERE: 0x000000,     // Black (severe bruising)\n  CUT_COLOR: 0xFF0000,         // Bright red (cut)\n  FRACTURE_INDICATOR: KOREAN_COLORS.ACCENT_GOLD, // Gold (bone fracture)\n} as const;\n\n/**\n * Get bruise color based on severity and hit count\n */\nconst getBruiseColor = (severity: number, hitCount: number): number => {\n  if (hitCount >= 3 || severity > 0.8) {\n    return INJURY_COLORS.BRUISE_SEVERE; // Black for severe/repeated trauma\n  } else if (hitCount >= 2 || severity > 0.5) {\n    return INJURY_COLORS.BRUISE_OLD; // Indigo for moderate bruising\n  } else {\n    return INJURY_COLORS.BRUISE_FRESH; // Dark red for fresh bruise\n  }\n};\n\n/**\n * Get injury size based on severity\n */\nconst getInjurySize = (severity: number): number => {\n  return 0.1 + severity * 0.3; // 0.1 to 0.4 units\n};\n\n/**\n * InjuryMarker - Individual injury visualization\n */\nconst InjuryMarker: React.FC<{\n  injury: Injury;\n  characterPosition: [number, number, number];\n  isMobile: boolean;\n}> = ({ injury, characterPosition, isMobile }) => {\n  // Calculate world position relative to character\n  const worldPosition: [number, number, number] = useMemo(() => {\n    return [\n      characterPosition[0] + injury.position[0],\n      characterPosition[1] + injury.position[1],\n      characterPosition[2] + injury.position[2],\n    ];\n  }, [characterPosition, injury.position]);\n\n  const size = useMemo(() => getInjurySize(injury.severity), [injury.severity]);\n\n  // Render based on injury type\n  switch (injury.type) {\n    case InjuryType.BRUISE: {\n      const color = getBruiseColor(injury.severity, injury.hitCount);\n      const opacity = Math.min(0.8, 0.3 + injury.severity * 0.5);\n\n      return (\n        <mesh position={worldPosition} data-testid={`injury-${injury.id}`}>\n          <sphereGeometry args={[size, isMobile ? 8 : 16, isMobile ? 8 : 16]} />\n          <meshBasicMaterial\n            color={color}\n            transparent\n            opacity={opacity}\n            depthTest={true}\n          />\n        </mesh>\n      );\n    }\n\n    case InjuryType.CUT:\n    case InjuryType.LACERATION: {\n      const cutLength = injury.type === InjuryType.LACERATION ? size * 3 : size * 2;\n      return (\n        <group position={worldPosition} data-testid={`injury-${injury.id}`}>\n          {/* Cut mark - thin red line */}\n          <mesh>\n            <boxGeometry args={[cutLength, 0.02, 0.02]} />\n            <meshBasicMaterial\n              color={INJURY_COLORS.CUT_COLOR}\n              transparent\n              opacity={0.9}\n            />\n          </mesh>\n          {/* Blood trail for lacerations */}\n          {injury.type === InjuryType.LACERATION && (\n            <mesh position={[0, -size * 0.5, 0]}>\n              <boxGeometry args={[0.02, size, 0.02]} />\n              <meshBasicMaterial\n                color={KOREAN_COLORS.BLOODLOSS_INDICATOR}\n                transparent\n                opacity={0.7}\n              />\n            </mesh>\n          )}\n        </group>\n      );\n    }\n\n    case InjuryType.FRACTURE: {\n      return (\n        <group position={worldPosition} data-testid={`injury-${injury.id}`}>\n          {/* Fracture indicator - pulsing gold ring */}\n          <mesh rotation={[-Math.PI / 2, 0, 0]}>\n            <ringGeometry args={[size * 0.8, size, 16]} />\n            <meshBasicMaterial\n              color={INJURY_COLORS.FRACTURE_INDICATOR}\n              transparent\n              opacity={0.6}\n              side={THREE.DoubleSide}\n            />\n          </mesh>\n          {/* Cross indicator */}\n          <mesh>\n            <boxGeometry args={[size * 2, 0.02, 0.02]} />\n            <meshBasicMaterial\n              color={INJURY_COLORS.FRACTURE_INDICATOR}\n              transparent\n              opacity={0.8}\n            />\n          </mesh>\n          <mesh rotation={[0, 0, Math.PI / 2]}>\n            <boxGeometry args={[size * 2, 0.02, 0.02]} />\n            <meshBasicMaterial\n              color={INJURY_COLORS.FRACTURE_INDICATOR}\n              transparent\n              opacity={0.8}\n            />\n          </mesh>\n        </group>\n      );\n    }\n\n    default:\n      return null;\n  }\n};\n\n/**\n * FractureWarning - Html overlay warning for critical bone damage\n * \n * Rendered as a styled Html overlay with Korean/English text and alert semantics.\n */\nconst FractureWarning: React.FC<{\n  health: number;\n  isMobile: boolean;\n}> = ({ health, isMobile }) => {\n  // Calculate opacity before early return to avoid conditional hook call\n  const warningOpacity = useMemo(() => {\n    // Pulse more intensely as health drops\n    const rawOpacity = 0.5 + (30 - health) / 60; // 0.5 at 30% health, 1.0 at 0% health\n    // Clamp to valid CSS opacity range [0, 1] in case health falls outside [0, 30]\n    return Math.min(1, Math.max(0, rawOpacity));\n  }, [health]);\n\n  if (health >= 30) return null;\n\n  return (\n    <Html center position={[0, 2.5, 0]}>\n      <div\n        style={{\n          padding: isMobile ? \"8px 12px\" : \"10px 16px\",\n          backgroundColor: hexToRgbaString(INJURY_COLORS.FRACTURE_INDICATOR, warningOpacity * 0.3),\n          border: `2px solid ${hexToRgbaString(INJURY_COLORS.FRACTURE_INDICATOR, 1)}`,\n          borderRadius: \"6px\",\n          fontSize: isMobile ? \"12px\" : \"14px\",\n          color: hexToRgbaString(INJURY_COLORS.FRACTURE_INDICATOR, 1),\n          fontWeight: \"bold\",\n          textShadow: \"0 0 4px rgba(0,0,0,0.8)\",\n          animation: \"fracturePulse 1s ease-in-out infinite\",\n          fontFamily: FONT_FAMILY.KOREAN,\n        }}\n        data-testid=\"fracture-warning\"\n        role=\"alert\"\n        aria-live=\"assertive\"\n      >\n        ⚠️ 골절위험 | Bone Fracture Risk\n      </div>\n      <style>\n        {`\n          @keyframes fracturePulse {\n            0%, 100% { opacity: 0.7; transform: scale(1); }\n            50% { opacity: 1; transform: scale(1.05); }\n          }\n        `}\n      </style>\n    </Html>\n  );\n};\n\n/**\n * TraumaOverlay3D Component\n *\n * Visualizes progressive combat trauma including bruising, cuts, and bone damage\n * on 3D character models. Injuries persist across rounds and darken with repeated\n * hits to the same body region.\n *\n * @example\n * ```tsx\n * const [injuries, setInjuries] = useState<Injury[]>([]);\n *\n * // On hit event\n * const handleHit = (region: BodyRegion, position: [number, number, number], type: InjuryType) => {\n *   const existingInjury = injuries.find(i => \n *     i.region === region && \n *     distance(i.position, position) < 0.2\n *   );\n *\n *   if (existingInjury) {\n *     // Progressive bruising - increase hit count\n *     setInjuries(prev => prev.map(i => \n *       i.id === existingInjury.id \n *         ? { ...i, hitCount: i.hitCount + 1, severity: Math.min(1.0, i.severity + 0.2) }\n *         : i\n *     ));\n *   } else {\n *     // New injury\n *     setInjuries([...injuries, {\n *       id: generateId(),\n *       region,\n *       type,\n *       position,\n *       severity: 0.5,\n *       hitCount: 1,\n *       timestamp: Date.now(),\n *     }]);\n *   }\n * };\n *\n * <TraumaOverlay3D\n *   playerId={playerId}\n *   health={playerHealth}\n *   injuries={injuries}\n *   characterPosition={characterPosition}\n *   isMobile={isMobile}\n *   showFractures={true}\n * />\n * ```\n */\nexport const TraumaOverlay3D: React.FC<TraumaOverlay3DProps> = ({\n  playerId,\n  health,\n  injuries,\n  characterPosition,\n  isMobile = false,\n  showFractures = true,\n}) => {\n  // Filter injuries for this player\n  const playerInjuries = useMemo(() => {\n    // In multi-player scenarios, filter by player when available\n    if (playerId === null || playerId === undefined) {\n      // Single-player or unspecified player: show all injuries\n      return injuries;\n    }\n\n    // Backward-compatible filtering:\n    // - If an injury has a playerId, it must match the current playerId.\n    // - If an injury has no playerId, include it (legacy/global injuries).\n    return injuries.filter((injury) => {\n      if (injury.playerId === null || injury.playerId === undefined) {\n        return true;\n      }\n      return injury.playerId === playerId;\n    });\n  }, [injuries, playerId]);\n\n  // Separate fractures from other injuries\n  const { fractures, otherInjuries } = useMemo(() => {\n    const frac = playerInjuries.filter((i) => i.type === InjuryType.FRACTURE);\n    const other = playerInjuries.filter((i) => i.type !== InjuryType.FRACTURE);\n    return { fractures: frac, otherInjuries: other };\n  }, [playerInjuries]);\n\n  return (\n    <group data-testid={`trauma-overlay-${playerId}`}>\n      {/* Render non-fracture injuries */}\n      {otherInjuries.map((injury) => (\n        <InjuryMarker\n          key={injury.id}\n          injury={injury}\n          characterPosition={characterPosition}\n          isMobile={isMobile}\n        />\n      ))}\n\n      {/* Render fractures if enabled and health is critical */}\n      {showFractures &&\n        health < 30 &&\n        fractures.map((injury) => (\n          <InjuryMarker\n            key={injury.id}\n            injury={injury}\n            characterPosition={characterPosition}\n            isMobile={isMobile}\n          />\n        ))}\n\n      {/* Fracture warning overlay */}\n      {showFractures && health < 30 && fractures.length > 0 && (\n        <FractureWarning health={health} isMobile={isMobile} />\n      )}\n    </group>\n  );\n};\n\nexport default TraumaOverlay3D;\n"],"mappings":"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"}

package/lib/components/screens/combat/components/effects/WaterRipple3D.d.ts

@@ -0,0 +1,64 @@
+/**
+ * WaterRipple3D - Adaptive flow ripple effects for Gam (Water) trigram footwork
+ *
+ * Creates concentric water ripple rings that emanate from footfall positions
+ * during Gam stance techniques. Ripples expand outward with wave motion and
+ * fade over time, following the philosophy: "물처럼 흘러 적의 힘을 이용하라"
+ * (Flow like water and use the enemy's force).
+ *
+ * PERFORMANCE OPTIMIZATION (Minimal Allocations):
+ * - Uses primitive numeric types instead of Vector3 objects to minimize allocations
+ * - Ring-based geometry with instancing for efficient rendering
+ * - Target: 60fps with up to 10 simultaneous ripple effects
+ *
+ * Features:
+ * - Concentric ring expansion from footfall
+ * - Korean cyberpunk cyan water coloring
+ * - Wave amplitude oscillation
+ * - Smooth alpha fade-out
+ * - Mobile performance optimization
+ *
+ * @module components/combat/WaterRipple3D
+ * @category Combat Effects - Water (감괘)
+ * @korean 물결파문3D
+ */
+import React from "react";
+/**
+ * Water ripple effect data for Gam (Water) trigram
+ * 물결 파문 효과 데이터 (감괘)
+ */
+export interface WaterRippleEffect {
+    /** Unique identifier */
+    readonly id: string;
+    /** Origin position in 3D world space (foot impact point) */
+    readonly position: [number, number, number];
+    /** Flow type: adaptive, flowing, or reactive */
+    readonly flowType: "adaptive" | "flowing" | "reactive";
+    /** Timestamp when effect was created */
+    readonly startTime: number;
+    /** Intensity of ripple (0.0 to 1.0) - affects amplitude and radius */
+    readonly intensity?: number;
+}
+/**
+ * Props for WaterRipple3D component
+ */
+export interface WaterRipple3DProps {
+    /** Active ripple effects to render */
+    readonly effects: readonly WaterRippleEffect[];
+    /** Whether to enable ripple effects */
+    readonly enabled?: boolean;
+    /** Mobile device mode (reduced ring count) */
+    readonly isMobile?: boolean;
+    /** Callback when effect completes */
+    readonly onEffectComplete?: (effectId: string) => void;
+}
+/**
+ * WaterRipple3D Component
+ * Renders water ripple effects for Gam (Water) trigram techniques
+ */
+export declare const WaterRipple3D: React.FC<WaterRipple3DProps>;
+/**
+ * Default export for lazy loading
+ */
+export default WaterRipple3D;
+//# sourceMappingURL=WaterRipple3D.d.ts.map

package/lib/components/screens/combat/components/effects/WaterRipple3D.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"WaterRipple3D.d.ts","sourceRoot":"","sources":["../../../../../../src/components/screens/combat/components/effects/WaterRipple3D.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AAGH,OAAO,KAA0B,MAAM,OAAO,CAAC;AAI/C;;;GAGG;AACH,MAAM,WAAW,iBAAiB;IAChC,wBAAwB;IACxB,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAC;IACpB,4DAA4D;IAC5D,QAAQ,CAAC,QAAQ,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAC;IAC5C,gDAAgD;IAChD,QAAQ,CAAC,QAAQ,EAAE,UAAU,GAAG,SAAS,GAAG,UAAU,CAAC;IACvD,wCAAwC;IACxC,QAAQ,CAAC,SAAS,EAAE,MAAM,CAAC;IAC3B,sEAAsE;IACtE,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;CAC7B;AAED;;GAEG;AACH,MAAM,WAAW,kBAAkB;IACjC,sCAAsC;IACtC,QAAQ,CAAC,OAAO,EAAE,SAAS,iBAAiB,EAAE,CAAC;IAC/C,uCAAuC;IACvC,QAAQ,CAAC,OAAO,CAAC,EAAE,OAAO,CAAC;IAC3B,8CAA8C;IAC9C,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAC5B,qCAAqC;IACrC,QAAQ,CAAC,gBAAgB,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;CACxD;AAmGD;;;GAGG;AACH,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAyMtD,CAAC;AAEF;;GAEG;AACH,eAAe,aAAa,CAAC"}

package/lib/components/screens/combat/components/effects/WaterWave3D.d.ts

@@ -0,0 +1,72 @@
+/**
+ * WaterWave3D - Wave particle burst for Gam (Water) counter techniques
+ *
+ * Creates flowing wave particles that burst outward during counter-attack
+ * techniques, visualizing the redirection of opponent's force. Particles
+ * flow in curved trajectories mimicking water splashing and flowing.
+ *
+ * Used for:
+ * - gam_water_counter (수류반격) - Adaptive flow burst
+ * - gam_circular_parry (원형받기) - Circular flowing waves
+ * - gam_wrist_twist_counter (손목비틀기반격) - Reactive splash
+ *
+ * PERFORMANCE OPTIMIZATION (Object Pooling):
+ * - Uses ThreeObjectPools for all Vector3 allocations
+ * - Instanced particle rendering
+ * - Target: 60fps with up to 5 simultaneous wave effects
+ *
+ * Features:
+ * - Flowing water particle trajectories
+ * - Counter timing window visualization
+ * - Perfect counter enhanced effects
+ * - Korean cyberpunk cyan coloring
+ * - Flow type-specific patterns
+ *
+ * @module components/combat/WaterWave3D
+ * @category Combat Effects - Water (감괘)
+ * @korean 물결파동3D
+ */
+import React from "react";
+/**
+ * Water wave effect data for counter techniques
+ * 물결 파동 효과 데이터 (반격 기술)
+ */
+export interface WaterWaveEffect {
+    /** Unique identifier */
+    readonly id: string;
+    /** Origin position (counter impact point) */
+    readonly position: [number, number, number];
+    /** Direction of wave burst (opponent's force vector) */
+    readonly direction: [number, number, number];
+    /** Flow type determines particle pattern */
+    readonly flowType: "adaptive" | "flowing" | "reactive";
+    /** Whether this was a perfect counter (enhanced effect) */
+    readonly isPerfect: boolean;
+    /** Timestamp when effect was created */
+    readonly startTime: number;
+    /** Intensity multiplier (0.0 to 1.0) */
+    readonly intensity?: number;
+}
+/**
+ * Props for WaterWave3D component
+ */
+export interface WaterWave3DProps {
+    /** Active wave effects to render */
+    readonly effects: readonly WaterWaveEffect[];
+    /** Whether to enable wave effects */
+    readonly enabled?: boolean;
+    /** Mobile device mode (reduced particle count) */
+    readonly isMobile?: boolean;
+    /** Callback when effect completes */
+    readonly onEffectComplete?: (effectId: string) => void;
+}
+/**
+ * WaterWave3D Component
+ * Renders water wave particles for counter techniques
+ */
+export declare const WaterWave3D: React.FC<WaterWave3DProps>;
+/**
+ * Default export for lazy loading
+ */
+export default WaterWave3D;
+//# sourceMappingURL=WaterWave3D.d.ts.map

package/lib/components/screens/combat/components/effects/WaterWave3D.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"WaterWave3D.d.ts","sourceRoot":"","sources":["../../../../../../src/components/screens/combat/components/effects/WaterWave3D.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AAIH,OAAO,KAAqC,MAAM,OAAO,CAAC;AAK1D;;;GAGG;AACH,MAAM,WAAW,eAAe;IAC9B,wBAAwB;IACxB,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAC;IACpB,6CAA6C;IAC7C,QAAQ,CAAC,QAAQ,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAC;IAC5C,wDAAwD;IACxD,QAAQ,CAAC,SAAS,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAC;IAC7C,4CAA4C;IAC5C,QAAQ,CAAC,QAAQ,EAAE,UAAU,GAAG,SAAS,GAAG,UAAU,CAAC;IACvD,2DAA2D;IAC3D,QAAQ,CAAC,SAAS,EAAE,OAAO,CAAC;IAC5B,wCAAwC;IACxC,QAAQ,CAAC,SAAS,EAAE,MAAM,CAAC;IAC3B,wCAAwC;IACxC,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;CAC7B;AAED;;GAEG;AACH,MAAM,WAAW,gBAAgB;IAC/B,oCAAoC;IACpC,QAAQ,CAAC,OAAO,EAAE,SAAS,eAAe,EAAE,CAAC;IAC7C,qCAAqC;IACrC,QAAQ,CAAC,OAAO,CAAC,EAAE,OAAO,CAAC;IAC3B,kDAAkD;IAClD,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAC5B,qCAAqC;IACrC,QAAQ,CAAC,gBAAgB,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;CACxD;AAuLD;;;GAGG;AACH,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAqNlD,CAAC;AAEF;;GAEG;AACH,eAAe,WAAW,CAAC"}

package/lib/components/screens/combat/components/effects/index.d.ts

@@ -0,0 +1,121 @@
+/**
+ * Particle Effects System - Enhanced 3D particle effects for combat realism
+ *
+ * This module provides a comprehensive particle effects system for Black Trigram,
+ * including blood splatter, impact sparks, dust clouds, and Korean trigram symbols.
+ *
+ * Features:
+ * - Object pooling for performance optimization
+ * - Physics-based particle simulation
+ * - Korean cultural theming and aesthetics
+ * - Mobile performance optimization
+ * - 75 comprehensive tests with 100% pass rate
+ *
+ * @module components/effects
+ * @category Combat Effects
+ * @korean 입자효과체계
+ */
+export { ParticlePool, globalParticlePool, } from "../../../../../utils/particlePool";
+export type { ParticlePoolConfig } from "../../../../../utils/particlePool";
+export { BloodParticles3D } from "./BloodParticles3D";
+export type { BloodSplatterEffect, BloodParticles3DProps, } from "./BloodParticles3D";
+export { ArterialSpray3D } from "./ArterialSpray3D";
+export type { ArterialSprayEffect, ArterialSpray3DProps, ArterialVitalPoint, } from "./ArterialSpray3D";
+export { BoneCrackParticles3D } from "./BoneCrackParticles3D";
+export type { BoneCrackEffect, BoneCrackParticles3DProps, FractureType, BoneType, } from "./BoneCrackParticles3D";
+export { NerveStrikeParticles3D } from "./NerveStrikeParticles3D";
+export type { NerveStrikeEffect, NerveStrikeParticles3DProps, } from "./NerveStrikeParticles3D";
+export { InternalDamage3D } from "./InternalDamage3D";
+export type { InternalDamageEffect, InternalDamage3DProps, OrganType, PenetrationDepth, } from "./InternalDamage3D";
+export { BloodViscosity3D } from "./BloodViscosity3D";
+export type { BloodViscosityEffect, BloodViscosity3DProps, ViscosityType, } from "./BloodViscosity3D";
+export { ParticleAudio3D, createAudioTrigger } from "./ParticleAudio3D";
+export type { ParticleAudioTrigger, ParticleAudio3DProps, ParticleEffectType, } from "./ParticleAudio3D";
+export { CombatParticleEffects3D } from "./CombatParticleEffects3D";
+export type { CombatParticleEffects3DProps } from "./CombatParticleEffects3D";
+export { ImpactSparks3D } from "./ImpactSparks3D";
+export type { ImpactSparkEffect, ImpactSparks3DProps } from "./ImpactSparks3D";
+export { DustClouds3D } from "./DustClouds3D";
+export type { DustCloudEffect, DustClouds3DProps } from "./DustClouds3D";
+export { EarthCrackEffect3D } from "./EarthCrackEffect3D";
+export type { EarthCrackEffect, EarthCrackEffect3DProps, } from "./EarthCrackEffect3D";
+export { EarthHealingEffect3D } from "./EarthHealingEffect3D";
+export type { EarthHealingEffect, EarthHealingEffect3DProps, } from "./EarthHealingEffect3D";
+export { default as HitEffects3D } from "../../../../shared/three/effects/HitEffects3D";
+export type { HitEffects3DProps } from "../../../../shared/three/effects/HitEffects3D";
+/**
+ * Performance Configuration Guide
+ *
+ * **Desktop (60fps target):**
+ * - Impact Sparks: 50-100 particles
+ * - Dust Clouds: 30-60 particles (80 for throw impacts)
+ * - Earth Cracks: 8 lines × 6 segments = 48 line segments
+ * - Earth Healing: 6 roots × 8 particles/HP = 48 particles (max)
+ * - Blood Splatter: 100-300 particles
+ * - Arterial Spray: 250 particles (high-velocity jets)
+ * - Bone Fractures: 15-60 particles (fracture type dependent)
+ * - Nerve Strikes: 80 particles (electric-blue pulse)
+ * - Trigram Symbols: 8 symbols per effect
+ * - Max concurrent effects: 10-15
+ *
+ * **Mobile (55fps target):**
+ * - Impact Sparks: 25-50 particles
+ * - Dust Clouds: 15-30 particles (40 for throw impacts)
+ * - Earth Cracks: 5 lines × 4 segments = 20 line segments
+ * - Earth Healing: 4 roots × 5 particles/HP = 20 particles (max)
+ * - Blood Splatter: 50-100 particles
+ * - Arterial Spray: 120 particles (optimized)
+ * - Bone Fractures: 8-30 particles (reduced)
+ * - Nerve Strikes: 40 particles (optimized)
+ * - Trigram Symbols: 8 symbols per effect
+ * - Max concurrent effects: 5-8
+ *
+ * **Memory Budget:**
+ * - Particle pool: ~2MB
+ * - Active particles: ~1-3MB
+ * - Total overhead: +2-5MB
+ *
+ * @example
+ * ```typescript
+ * import {
+ *   ImpactSparks3D,
+ *   DustClouds3D,
+ *   type ImpactSparkEffect,
+ *   type DustCloudEffect,
+ * } from '../../../../effects';
+ *
+ * // Manage effect state
+ * const [sparkEffects, setSparkEffects] = useState<ImpactSparkEffect[]>([]);
+ * const [dustEffects, setDustEffects] = useState<DustCloudEffect[]>([]);
+ *
+ * // Trigger effects on game events
+ * const handleCriticalHit = (position: [number, number, number]) => {
+ *   const effect: ImpactSparkEffect = {
+ *     id: generateId(),
+ *     position,
+ *     isCritical: true,
+ *     intensity: 1.0,
+ *     startTime: Date.now(),
+ *   };
+ *   setSparkEffects([...sparkEffects, effect]);
+ * };
+ *
+ * // Render in scene
+ * <Scene3D>
+ *   <ImpactSparks3D
+ *     effects={sparkEffects}
+ *     enabled={visualSettings.sparks}
+ *     isMobile={isMobile}
+ *     onEffectComplete={(id) => setSparkEffects(prev => prev.filter(e => e.id !== id))}
+ *   />
+ *
+ *   <DustClouds3D
+ *     effects={dustEffects}
+ *     enabled={visualSettings.dust}
+ *     isMobile={isMobile}
+ *     onEffectComplete={(id) => setDustEffects(prev => prev.filter(e => e.id !== id))}
+ *   />
+ * </Scene3D>
+ * ```
+ */
+//# sourceMappingURL=index.d.ts.map

package/lib/components/screens/combat/components/effects/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/components/screens/combat/components/effects/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;GAgBG;AAGH,OAAO,EACL,YAAY,EACZ,kBAAkB,GACnB,MAAM,mCAAmC,CAAC;AAC3C,YAAY,EAAE,kBAAkB,EAAE,MAAM,mCAAmC,CAAC;AAG5E,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,YAAY,EACV,mBAAmB,EACnB,qBAAqB,GACtB,MAAM,oBAAoB,CAAC;AAG5B,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,YAAY,EACV,mBAAmB,EACnB,oBAAoB,EACpB,kBAAkB,GACnB,MAAM,mBAAmB,CAAC;AAG3B,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAC9D,YAAY,EACV,eAAe,EACf,yBAAyB,EACzB,YAAY,EACZ,QAAQ,GACT,MAAM,wBAAwB,CAAC;AAGhC,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AAClE,YAAY,EACV,iBAAiB,EACjB,2BAA2B,GAC5B,MAAM,0BAA0B,CAAC;AAGlC,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,YAAY,EACV,oBAAoB,EACpB,qBAAqB,EACrB,SAAS,EACT,gBAAgB,GACjB,MAAM,oBAAoB,CAAC;AAG5B,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,YAAY,EACV,oBAAoB,EACpB,qBAAqB,EACrB,aAAa,GACd,MAAM,oBAAoB,CAAC;AAG5B,OAAO,EAAE,eAAe,EAAE,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AACxE,YAAY,EACV,oBAAoB,EACpB,oBAAoB,EACpB,kBAAkB,GACnB,MAAM,mBAAmB,CAAC;AAG3B,OAAO,EAAE,uBAAuB,EAAE,MAAM,2BAA2B,CAAC;AACpE,YAAY,EAAE,4BAA4B,EAAE,MAAM,2BAA2B,CAAC;AAG9E,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,YAAY,EAAE,iBAAiB,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAG/E,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,YAAY,EAAE,eAAe,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAGzE,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,YAAY,EACV,gBAAgB,EAChB,uBAAuB,GACxB,MAAM,sBAAsB,CAAC;AAG9B,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAC9D,YAAY,EACV,kBAAkB,EAClB,yBAAyB,GAC1B,MAAM,wBAAwB,CAAC;AAKhC,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,+CAA+C,CAAC;AACxF,YAAY,EAAE,iBAAiB,EAAE,MAAM,+CAA+C,CAAC;AAEvF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0EG"}

package/lib/components/screens/combat/components/feedback/MatchCountdown.d.ts

@@ -0,0 +1,31 @@
+/**
+ * MatchCountdown Component - Displays match start countdown sequence
+ *
+ * Korean: 매치 시작 카운트다운 (Match Start Countdown)
+ *
+ * Shows "Ready?" → "3... 2... 1..." → "Fight!" sequence with animations.
+ * Implements Korean cyberpunk aesthetic with bilingual text support.
+ * Plays audio cues for countdown and fight announcement.
+ *
+ * Refactored to use useKoreanTheme for consistent styling.
+ *
+ * @module components/combat/MatchCountdown
+ * @category Combat UI
+ */
+import React from "react";
+/**
+ * Props for the MatchCountdown component
+ */
+export interface MatchCountdownProps {
+    /** Callback when countdown completes */
+    readonly onComplete: () => void;
+    /** Whether layout should adapt for mobile screens */
+    readonly isMobile: boolean;
+    /** Optional callback for skip button */
+    readonly onSkip?: () => void;
+    /** Whether skip button should be shown */
+    readonly showSkip?: boolean;
+}
+export declare const MatchCountdown: React.FC<MatchCountdownProps>;
+export default MatchCountdown;
+//# sourceMappingURL=MatchCountdown.d.ts.map

package/lib/components/screens/combat/components/feedback/MatchCountdown.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MatchCountdown.d.ts","sourceRoot":"","sources":["../../../../../../src/components/screens/combat/components/feedback/MatchCountdown.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;GAaG;AAEH,OAAO,KAAqC,MAAM,OAAO,CAAC;AAS1D;;GAEG;AACH,MAAM,WAAW,mBAAmB;IAClC,wCAAwC;IACxC,QAAQ,CAAC,UAAU,EAAE,MAAM,IAAI,CAAC;IAChC,qDAAqD;IACrD,QAAQ,CAAC,QAAQ,EAAE,OAAO,CAAC;IAC3B,wCAAwC;IACxC,QAAQ,CAAC,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IAC7B,0CAA0C;IAC1C,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;CAC7B;AA+CD,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CA+OxD,CAAC;AAEF,eAAe,cAAc,CAAC"}