From 4d39cd020e6a7f342e56da5353bcf489bb53c94b Mon Sep 17 00:00:00 2001
From: Victor Giers <mail@victorgiers.com>
Date: Mon, 11 May 2026 21:23:40 +0200
Subject: [PATCH] Feature: Add UI control and state management for NPC
 targetability

---
 src/app/App.tsx | 22 ++++++++++++++++++++++
 1 file changed, 22 insertions(+)

diff --git a/src/app/App.tsx b/src/app/App.tsx
index 1349cf41..e194b485 100644
--- a/src/app/App.tsx
+++ b/src/app/App.tsx
@@ -10245,6 +10245,7 @@ export function App({
 
   const applyNpcChange = (
     overrides: {
+      targetable?: boolean;
       modelAssetId?: string | null;
       colliderMode?: PlayerStartColliderMode;
     } = {}
@@ -10263,6 +10264,7 @@ export function App({
         name: selectedNpc.name,
         actorId: npcActorIdDraft,
         presence: createNpcAlwaysPresence(),
+        targetable: overrides.targetable ?? selectedNpc.targetable,
         position: snapVec3ToGrid(
           readVec3Draft(entityPositionDraft, "NPC position"),
           DEFAULT_GRID_SIZE
@@ -25006,6 +25008,26 @@ export function App({
                         selectedNpcLinks
                       )}
 
+                      <div className="form-section">
+                        <div className="label">Targeting</div>
+                        <label className="form-field form-field--toggle">
+                          <span className="label">Targetable</span>
+                          <input
+                            data-testid="npc-targetable"
+                            type="checkbox"
+                            checked={selectedNpc.targetable}
+                            onChange={(event) =>
+                              applyNpcChange({
+                                targetable: event.currentTarget.checked
+                              })
+                            }
+                          />
+                        </label>
+                        <div className="material-summary">
+                          Lets Lux acquire this NPC as a third-person target.
+                        </div>
+                      </div>
+
                       <div className="form-section">
                         <div className="label">Facing</div>
                         <label className="form-field">