From 6c022c514f87ffc024cf3a14355b34cbbdc4cdc4 Mon Sep 17 00:00:00 2001
From: "gpt-engineer-app[bot]"
 <159125892+gpt-engineer-app[bot]@users.noreply.github.com>
Date: Thu, 21 May 2026 21:39:39 +0000
Subject: [PATCH] Changes

Co-authored-by: Reifonas <211114984+Reifonas@users.noreply.github.com>
---
 src/components/three/XRHudInWorld.tsx | 52 ++++++++++++++++++---------
 1 file changed, 35 insertions(+), 17 deletions(-)

diff --git a/src/components/three/XRHudInWorld.tsx b/src/components/three/XRHudInWorld.tsx
index 4f89c49..dd41d6e 100644
--- a/src/components/three/XRHudInWorld.tsx
+++ b/src/components/three/XRHudInWorld.tsx
@@ -328,6 +328,15 @@ function ToolsTab(p: XRHudInWorldProps) {
   const setShowGrid = useModelStore((s) => s.setShowGrid);
   const measureMode = useModelStore((s) => s.measureMode);
   const setMeasureMode = useModelStore((s) => s.setMeasureMode);
+  const selectionMode = useModelStore((s) => s.selectionMode);
+  const setSelectionMode = useModelStore((s) => s.setSelectionMode);
+  const selectedCount = useModelStore((s) => s.selectedElementKeys.size);
+  const hideSelectedElements = useModelStore((s) => s.hideSelectedElements);
+  const isolateSelectedElements = useModelStore((s) => s.isolateSelectedElements);
+  const showAllElements = useModelStore((s) => s.showAllElements);
+  const hasHidden = useModelStore((s) =>
+    s.hiddenElementKeys.size > 0 || s.isolatedElementKeys !== null
+  );
   const scaleRatio = useModelStore((s) => s.scaleRatio);
   const setScaleRatio = useModelStore((s) => s.setScaleRatio);
   const resetScale = useModelStore((s) => s.resetScale);
@@ -353,52 +362,61 @@ function ToolsTab(p: XRHudInWorldProps) {
       <XR3DButton position={[0.08, 0.025, 0]} size={[0.075, 0.022]}
         label={p.placementMode ? 'Posic…' : 'Reposic.'}
         active={p.placementMode} onClick={p.onTogglePlacement} />
+      <XR3DButton position={[0.16, 0.025, 0]} size={[0.075, 0.022]}
+        label={`Zoom ${p.allowScale ? 'ON' : 'OFF'}`}
+        active={p.allowScale} onClick={p.onToggleAllowScale} />
 
-      <Text position={[-0.24, -0.02, 0]} fontSize={0.008} color="#94a3b8" anchorX="left">
+      {/* Selecionar — paridade com a tela inicial */}
+      <Text position={[-0.24, -0.005, 0]} fontSize={0.008} color="#94a3b8" anchorX="left">Selecionar</Text>
+      <XR3DButton position={[-0.16, -0.03, 0]} size={[0.075, 0.022]}
+        label={selectionMode ? (selectedCount > 0 ? `${selectedCount} sel.` : 'Selec…') : 'Selec'}
+        active={selectionMode} onClick={() => setSelectionMode(!selectionMode)} />
+      <XR3DButton position={[-0.08, -0.03, 0]} size={[0.075, 0.022]} label="Esconder"
+        onClick={hideSelectedElements} />
+      <XR3DButton position={[0.0, -0.03, 0]} size={[0.075, 0.022]} label="Isolar"
+        onClick={isolateSelectedElements} />
+      <XR3DButton position={[0.08, -0.03, 0]} size={[0.075, 0.022]} label="Mostrar"
+        active={hasHidden} onClick={showAllElements} />
+
+      <Text position={[-0.24, -0.06, 0]} fontSize={0.008} color="#94a3b8" anchorX="left">
         Opacidade {Math.round(opacity * 100)}%
       </Text>
-      <XR3DButton position={[-0.16, -0.045, 0]} size={[0.05, 0.022]} label="−25%"
+      <XR3DButton position={[-0.16, -0.085, 0]} size={[0.05, 0.022]} label="−25%"
         onClick={() => setOpacity(Math.max(0, opacity - 0.25))} />
-      <XR3DButton position={[-0.105, -0.045, 0]} size={[0.05, 0.022]} label="−5%"
+      <XR3DButton position={[-0.105, -0.085, 0]} size={[0.05, 0.022]} label="−5%"
         onClick={() => setOpacity(Math.max(0, opacity - 0.05))} />
-      <XR3DButton position={[-0.05, -0.045, 0]} size={[0.05, 0.022]} label="+5%"
+      <XR3DButton position={[-0.05, -0.085, 0]} size={[0.05, 0.022]} label="+5%"
         onClick={() => setOpacity(Math.min(1, opacity + 0.05))} />
-      <XR3DButton position={[0.005, -0.045, 0]} size={[0.05, 0.022]} label="+25%"
+      <XR3DButton position={[0.005, -0.085, 0]} size={[0.05, 0.022]} label="+25%"
         onClick={() => setOpacity(Math.min(1, opacity + 0.25))} />
-      <XR3DButton position={[0.06, -0.045, 0]} size={[0.05, 0.022]} label="100%"
+      <XR3DButton position={[0.06, -0.085, 0]} size={[0.05, 0.022]} label="100%"
         onClick={() => setOpacity(1)} />
 
-      <Text position={[-0.24, -0.085, 0]} fontSize={0.008} color="#94a3b8" anchorX="left">
+      <Text position={[-0.24, -0.115, 0]} fontSize={0.008} color="#94a3b8" anchorX="left">
         Escala {scaleRatio.label}
       </Text>
       {SCALE_LABELS.map((lbl, i) => {
         const preset = SCALE_PRESETS.find((sp) => sp.label === lbl)!;
         return (
           <XR3DButton key={lbl}
-            position={[-0.16 + i * 0.06, -0.11, 0]} size={[0.055, 0.022]} label={lbl}
+            position={[-0.16 + i * 0.06, -0.14, 0]} size={[0.055, 0.022]} label={lbl}
             active={scaleRatio.label === lbl}
             onClick={() => setScaleRatio(preset)} />
         );
       })}
-      {/* Reset Escala — devolve a peça ao tamanho 1:1 (cancela qualquer
-          escala manual feita com duas mãos). */}
-      <XR3DButton position={[0.10, -0.11, 0]} size={[0.062, 0.022]}
+      <XR3DButton position={[0.10, -0.14, 0]} size={[0.062, 0.022]}
         label="↺ Reset" color="#dc2626"
         onClick={resetScale} fontSize={0.0085} />
-      {/* Limpa todos os labels de medição. */}
-      <XR3DButton position={[0.17, -0.11, 0]} size={[0.062, 0.022]}
+      <XR3DButton position={[0.17, -0.14, 0]} size={[0.062, 0.022]}
         label="✕ Medidas" color="#dc2626"
         onClick={clearMeasurements} fontSize={0.0085} />
 
-      {/* Legenda dos controles para Medir */}
       {measureMode && (
-        <Text position={[-0.24, -0.145, 0]} fontSize={0.0065} color="#a3e635" anchorX="left" maxWidth={0.5}>
+        <Text position={[-0.24, -0.17, 0]} fontSize={0.0065} color="#a3e635" anchorX="left" maxWidth={0.5}>
           Gatilho D: marcar · A: desfazer · B: limpar · Gatilho E: alternar snap
         </Text>
       )}
 
-
-      {/* Grid floor controls */}
       <GridFloorRow />
     </group>
   );