@lv-x-software-house/x_view 1.2.4-dev.13 → 1.2.4-dev.15

package/dist/index.js

@@ -7975,13 +7975,9 @@ var import_react16 = __toESM(require("react"));
 var import_fi14 = require("react-icons/fi");
 var QUEST_STATUS_COLORS = {
   "Backlog": "#64748b",
-  // Slate (Cinza azulado)
   "In Progress": "#eab308",
-  // Yellow (Amarelo)
   "Review": "#a855f7",
-  // Purple (Roxo)
   "Done": "#22c55e"
-  // Green (Verde)
 };
 function InSceneQuestForm({
   onSave,
@@ -8001,6 +7997,7 @@ function InSceneQuestForm({
   const [size, setSize] = (0, import_react16.useState)("medium");
   const [intensity, setIntensity] = (0, import_react16.useState)(0);
   const [description, setDescription] = (0, import_react16.useState)("");
+  const [isStatusDropdownOpen, setIsStatusDropdownOpen] = (0, import_react16.useState)(false);
   const [customProps, setCustomProps] = (0, import_react16.useState)([]);
   const [isDescriptionModalOpen, setIsDescriptionModalOpen] = (0, import_react16.useState)(false);
   const propsEndRef = (0, import_react16.useRef)(null);
@@ -8051,7 +8048,6 @@ function InSceneQuestForm({
       name: name.trim(),
       type: types,
       color: QUEST_STATUS_COLORS[status],
-      // Cor atrelada ao status
       status,
       size,
       intensity,
@@ -8078,20 +8074,38 @@ function InSceneQuestForm({
       onDoubleClick: swallow
     },
     /* @__PURE__ */ import_react16.default.createElement("div", { className: "h-[2px]", style: { background: `linear-gradient(to right, transparent, ${QUEST_STATUS_COLORS[status]}, transparent)` } }),
-    /* @__PURE__ */ import_react16.default.createElement("div", { className: "px-6 pt-5 pb-3" }, /* @__PURE__ */ import_react16.default.createElement("div", { className: "flex items-center gap-2 mb-1" }, /* @__PURE__ */ import_react16.default.createElement(import_fi14.FiTarget, { className: "text-sky-400", size: 14 }), /* @__PURE__ */ import_react16.default.createElement("p", { className: "text-xs/relaxed text-slate-300" }, "Nova Tarefa / Objetivo")), /* @__PURE__ */ import_react16.default.createElement("h2", { className: "text-xl sm:text-2xl font-semibold tracking-tight" }, "Criar Quest")),
-    /* @__PURE__ */ import_react16.default.createElement("form", { onSubmit: handleSubmit, className: "flex flex-col max-h-[68vh]" }, /* @__PURE__ */ import_react16.default.createElement("div", { className: "px-6 pb-28 overflow-y-auto overscroll-contain space-y-4 custom-scrollbar" }, /* @__PURE__ */ import_react16.default.createElement("div", { className: "space-y-1.5 relative" }, /* @__PURE__ */ import_react16.default.createElement("label", { className: "text-xs text-slate-300" }, "Status da Quest"), /* @__PURE__ */ import_react16.default.createElement(
-      "select",
-      {
-        value: status,
-        onChange: (e) => setStatus(e.target.value),
-        className: "w-full bg-slate-800/70 p-2.5 text-sm rounded-lg border border-white/10 focus:outline-none focus:ring-2 focus:ring-indigo-400/60 appearance-none cursor-pointer",
-        style: { borderLeft: `4px solid ${QUEST_STATUS_COLORS[status]}` }
+    /* @__PURE__ */ import_react16.default.createElement("div", { className: "px-6 pt-5 pb-3 flex items-start justify-between gap-4" }, /* @__PURE__ */ import_react16.default.createElement("div", null, /* @__PURE__ */ import_react16.default.createElement("div", { className: "flex items-center gap-2 mb-1" }, /* @__PURE__ */ import_react16.default.createElement(import_fi14.FiTarget, { className: "text-sky-400", size: 14 }), /* @__PURE__ */ import_react16.default.createElement("p", { className: "text-xs/relaxed text-slate-300" }, "Nova Tarefa / Objetivo")), /* @__PURE__ */ import_react16.default.createElement("h2", { className: "text-xl sm:text-2xl font-semibold tracking-tight" }, "Criar Quest")), /* @__PURE__ */ import_react16.default.createElement(
+      "button",
+      {
+        type: "button",
+        onClick: onCancel,
+        className: "w-9 h-9 grid place-content-center rounded-lg border border-white/15 bg-transparent hover:bg-white/5 transition-colors text-xl",
+        title: "Fechar"
       },
-      /* @__PURE__ */ import_react16.default.createElement("option", { value: "Backlog" }, "Backlog"),
-      /* @__PURE__ */ import_react16.default.createElement("option", { value: "In Progress" }, "In Progress"),
-      /* @__PURE__ */ import_react16.default.createElement("option", { value: "Review" }, "Review"),
-      /* @__PURE__ */ import_react16.default.createElement("option", { value: "Done" }, "Done")
-    )), /* @__PURE__ */ import_react16.default.createElement("div", { className: "space-y-1.5" }, /* @__PURE__ */ import_react16.default.createElement("label", { className: "text-xs text-slate-300" }, "Nome da Quest"), /* @__PURE__ */ import_react16.default.createElement("input", { required: true, type: "text", placeholder: "Ex.: Refatorar M\xF3dulo X", value: name, onChange: (e) => setName(e.target.value), className: "w-full bg-slate-800/70 p-2.5 text-sm rounded-lg border border-white/10 focus:outline-none focus:ring-2 focus:ring-indigo-400/60" })), /* @__PURE__ */ import_react16.default.createElement("div", { className: "space-y-1.5" }, /* @__PURE__ */ import_react16.default.createElement("label", { className: "text-xs text-slate-300" }, "Tipos Adicionais"), /* @__PURE__ */ import_react16.default.createElement("div", { className: "relative w-full bg-slate-800/70 p-1.5 min-h-[42px] flex flex-wrap gap-1.5 rounded-lg border border-white/10 focus-within:ring-2 focus-within:ring-indigo-400/60 transition-all" }, types.map((t, index) => /* @__PURE__ */ import_react16.default.createElement("span", { key: index, className: `flex items-center gap-1 px-1.5 py-0.5 rounded-md text-xs font-medium border ${t === "quest" ? "bg-sky-500/20 text-sky-200 border-sky-500/30" : "bg-indigo-500/30 text-indigo-100 border-indigo-500/20"}` }, t, t !== "quest" && /* @__PURE__ */ import_react16.default.createElement("button", { type: "button", onClick: () => handleRemoveType(index), className: "hover:text-white transition-colors" }, /* @__PURE__ */ import_react16.default.createElement(import_fi14.FiX, { size: 12 })))), /* @__PURE__ */ import_react16.default.createElement(
+      "\xD7"
+    )),
+    /* @__PURE__ */ import_react16.default.createElement("form", { onSubmit: handleSubmit, className: "flex flex-col max-h-[68vh]" }, /* @__PURE__ */ import_react16.default.createElement("div", { className: "px-6 pb-28 overflow-y-auto overscroll-contain space-y-4 custom-scrollbar" }, /* @__PURE__ */ import_react16.default.createElement("div", { className: "space-y-1.5 relative" }, /* @__PURE__ */ import_react16.default.createElement("label", { className: "text-xs text-slate-300" }, "Status da Quest"), /* @__PURE__ */ import_react16.default.createElement("div", { className: "relative" }, /* @__PURE__ */ import_react16.default.createElement(
+      "button",
+      {
+        type: "button",
+        onClick: () => setIsStatusDropdownOpen(!isStatusDropdownOpen),
+        className: "w-full bg-slate-800/70 p-2.5 text-sm rounded-lg border border-white/10 hover:border-white/20 focus:outline-none focus:ring-2 focus:ring-indigo-400/60 transition-colors flex items-center justify-between"
+      },
+      /* @__PURE__ */ import_react16.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react16.default.createElement("span", { className: "w-3 h-3 rounded-full shadow-[0_0_8px_rgba(0,0,0,0.5)]", style: { backgroundColor: QUEST_STATUS_COLORS[status] } }), /* @__PURE__ */ import_react16.default.createElement("span", { className: "text-slate-200 font-medium" }, status)),
+      /* @__PURE__ */ import_react16.default.createElement(import_fi14.FiChevronDown, { className: `text-slate-400 transition-transform duration-200 ${isStatusDropdownOpen ? "rotate-180" : ""}` })
+    ), isStatusDropdownOpen && /* @__PURE__ */ import_react16.default.createElement(import_react16.default.Fragment, null, /* @__PURE__ */ import_react16.default.createElement("div", { className: "fixed inset-0 z-40", onClick: () => setIsStatusDropdownOpen(false) }), /* @__PURE__ */ import_react16.default.createElement("ul", { className: "absolute top-full left-0 mt-1.5 w-full bg-slate-800 border border-white/10 rounded-lg shadow-[0_8px_30px_rgba(0,0,0,0.5)] z-50 overflow-hidden" }, Object.keys(QUEST_STATUS_COLORS).map((s) => /* @__PURE__ */ import_react16.default.createElement(
+      "li",
+      {
+        key: s,
+        onClick: () => {
+          setStatus(s);
+          setIsStatusDropdownOpen(false);
+        },
+        className: `px-3 py-2.5 text-sm cursor-pointer transition-colors flex items-center gap-2 ${status === s ? "bg-indigo-500/20 text-white" : "text-slate-300 hover:bg-white/5 hover:text-white"}`
+      },
+      /* @__PURE__ */ import_react16.default.createElement("span", { className: "w-3 h-3 rounded-full", style: { backgroundColor: QUEST_STATUS_COLORS[s] } }),
+      s
+    )))))), /* @__PURE__ */ import_react16.default.createElement("div", { className: "space-y-1.5" }, /* @__PURE__ */ import_react16.default.createElement("label", { className: "text-xs text-slate-300" }, "Nome da Quest"), /* @__PURE__ */ import_react16.default.createElement("input", { required: true, type: "text", placeholder: "Ex.: Refatorar M\xF3dulo X", value: name, onChange: (e) => setName(e.target.value), className: "w-full bg-slate-800/70 p-2.5 text-sm rounded-lg border border-white/10 focus:outline-none focus:ring-2 focus:ring-indigo-400/60" })), /* @__PURE__ */ import_react16.default.createElement("div", { className: "space-y-1.5" }, /* @__PURE__ */ import_react16.default.createElement("label", { className: "text-xs text-slate-300" }, "Tipos Adicionais"), /* @__PURE__ */ import_react16.default.createElement("div", { className: "relative w-full bg-slate-800/70 p-1.5 min-h-[42px] flex flex-wrap gap-1.5 rounded-lg border border-white/10 focus-within:ring-2 focus-within:ring-indigo-400/60 transition-all" }, types.map((t, index) => /* @__PURE__ */ import_react16.default.createElement("span", { key: index, className: `flex items-center gap-1 px-1.5 py-0.5 rounded-md text-xs font-medium border ${t === "quest" ? "bg-sky-500/20 text-sky-200 border-sky-500/30" : "bg-indigo-500/30 text-indigo-100 border-indigo-500/20"}` }, t, t !== "quest" && /* @__PURE__ */ import_react16.default.createElement("button", { type: "button", onClick: () => handleRemoveType(index), className: "hover:text-white transition-colors" }, /* @__PURE__ */ import_react16.default.createElement(import_fi14.FiX, { size: 12 })))), /* @__PURE__ */ import_react16.default.createElement(
       "input",
       {
         type: "text",
@@ -10294,7 +10308,7 @@ function XViewScene({
         });
       }
       return {
-        node: effectiveNode || { id: nodeId, name: "Unknown" },
+        ...effectiveNode ? { node: effectiveNode } : { node: { id: nodeId, name: "Unknown" } },
         relationship: treeItem.relationship || {},
         children: (treeItem.children || []).map(recursiveBuild).filter(Boolean),
         parallel_branches: processedBranches
@@ -11098,38 +11112,6 @@ function XViewScene({
         }
       }
     }
-    function handleCancelAncestryCreation() {
-      setAncestryMode({ isActive: false, tree: null, selectedParentId: null, isEditMode: false, currentAncestryId: null, ancestryName: "", ancestryDescription: "", ancestryDescriptionSections: [], isAddingNodes: false });
-      if (mountRef.current) mountRef.current.style.cursor = "grab";
-    }
-    function handleKeyDown(event) {
-      var _a2, _b2, _c2, _d2;
-      const context = actionHandlerContext;
-      if (event.key === "Escape") {
-        if (stateRef.current.connection.isActive) userActionHandlers.handleCancelConnection(context);
-        if (stateRef.current.relink.isActive) userActionHandlers.handleCancelRelink(context);
-        if (stateRef.current.creation.isActive) userActionHandlers.handleCancelCreation(context);
-        if ((_a2 = stateRef.current.versionMode) == null ? void 0 : _a2.isActive) userActionHandlers.handleCancelVersioning(context);
-        if (stateRef.current.ancestry.isActive) handleCancelAncestryCreation();
-        if ((_b2 = context.questMode) == null ? void 0 : _b2.isActive) context.setters.setQuestMode({ isActive: false });
-        if (stateRef.current.selectedNodes.size > 0) {
-          stateRef.current.selectedNodes.clear();
-        }
-        setContextMenu((prev) => prev.visible ? { ...prev, visible: false } : prev);
-        setMultiContextMenu((prev) => ({ ...prev, visible: false }));
-        setRelationshipMenu((prev) => ({ ...prev, visible: false }));
-      }
-      if (event.key.toLowerCase() === "q") {
-        const isUiClear = !stateRef.current.creation.isActive && !stateRef.current.connection.isActive && !stateRef.current.relink.isActive && !stateRef.current.ancestry.isActive && !((_c2 = context.versionMode) == null ? void 0 : _c2.isActive) && !contextMenu.visible && !multiContextMenu.visible && !relationshipMenu.visible && !readingMode.isActive && !isImportModalOpen && !isAncestryBoardOpen;
-        if (isUiClear) {
-          const isView = ((_d2 = viewParams == null ? void 0 : viewParams.type) == null ? void 0 : _d2.toLowerCase()) === "view";
-          if (!isView) {
-            return;
-          }
-          setQuestMode({ isActive: true });
-        }
-      }
-    }
     function handleDoubleClick(event) {
       if (stateRef.current.camera) stateRef.current.camera.layers.enableAll();
       if (isFromUiOverlay(event) || stateRef.current.isDragging || stateRef.current.creation.isActive || stateRef.current.connection.isActive || stateRef.current.relink.isActive) return;
@@ -11182,7 +11164,6 @@ function XViewScene({
     currentMount.addEventListener("dblclick", handleDoubleClick);
     currentMount.addEventListener("pointermove", onPointerMove);
     currentMount.addEventListener("contextmenu", handleContextMenu);
-    window.addEventListener("keydown", handleKeyDown);
     const originalBackground = scene.background;
     const clock = new THREE3.Clock();
     let animationFrameId = 0;
@@ -11320,7 +11301,6 @@ function XViewScene({
     return () => {
       cancelAnimationFrame(animationFrameId);
       window.removeEventListener("resize", handleResize);
-      window.removeEventListener("keydown", handleKeyDown);
       currentMount.removeEventListener("pointerdown", onPointerDown);
       currentMount.removeEventListener("pointerup", onPointerUp);
       currentMount.removeEventListener("dblclick", handleDoubleClick);
@@ -13124,6 +13104,62 @@ function XViewScene({
       }
     }
   }, [isInitialized, sceneVersion, focusAncestryId, hasOpenedInitialAncestry, handleStartReadingAncestry]);
+  (0, import_react25.useEffect)(() => {
+    function handleKeyDown(event) {
+      var _a2, _b2, _c2, _d2;
+      const context = actionHandlerContext;
+      if (event.key === "Escape") {
+        if (stateRef.current.connection.isActive) userActionHandlers.handleCancelConnection(context);
+        if (stateRef.current.relink.isActive) userActionHandlers.handleCancelRelink(context);
+        if (stateRef.current.creation.isActive) userActionHandlers.handleCancelCreation(context);
+        if ((_a2 = stateRef.current.versionMode) == null ? void 0 : _a2.isActive) userActionHandlers.handleCancelVersioning(context);
+        if (stateRef.current.ancestry.isActive) {
+          setAncestryMode({ isActive: false, tree: null, selectedParentId: null, isEditMode: false, currentAncestryId: null, ancestryName: "", ancestryDescription: "", ancestryDescriptionSections: [], isAddingNodes: false });
+          if (mountRef.current) mountRef.current.style.cursor = "grab";
+        }
+        if ((_b2 = context.questMode) == null ? void 0 : _b2.isActive) context.setters.setQuestMode({ isActive: false });
+        if (stateRef.current.selectedNodes.size > 0) {
+          stateRef.current.selectedNodes.clear();
+        }
+        setContextMenu((prev) => prev.visible ? { ...prev, visible: false } : prev);
+        setMultiContextMenu((prev) => ({ ...prev, visible: false }));
+        setRelationshipMenu((prev) => ({ ...prev, visible: false }));
+      }
+      if (event.key.toLowerCase() === "q") {
+        const isUiClear = !stateRef.current.creation.isActive && !stateRef.current.connection.isActive && !stateRef.current.relink.isActive && !stateRef.current.ancestry.isActive && !((_c2 = context.versionMode) == null ? void 0 : _c2.isActive) && !contextMenu.visible && !multiContextMenu.visible && !relationshipMenu.visible && !readingMode.isActive && !isImportModalOpen && !isAncestryBoardOpen && !isSidebarOpen && // Condição nova
+        !detailsNode && // Condição nova
+        !detailsLink && // Condição nova
+        !ancestryLinkDetails && // Condição nova
+        !imageViewer.visible && // Condição nova
+        !editingAncestryRel.visible && // Condição nova
+        !questMode.isActive;
+        if (isUiClear) {
+          const isView = ((_d2 = viewParams == null ? void 0 : viewParams.type) == null ? void 0 : _d2.toLowerCase()) === "view";
+          if (!isView) return;
+          setQuestMode({ isActive: true });
+        }
+      }
+    }
+    window.addEventListener("keydown", handleKeyDown);
+    return () => window.removeEventListener("keydown", handleKeyDown);
+  }, [
+    // Dependências: sempre que um painel abrir ou fechar, o React atualiza o listener com os dados frescos
+    contextMenu.visible,
+    multiContextMenu.visible,
+    relationshipMenu.visible,
+    readingMode.isActive,
+    isImportModalOpen,
+    isAncestryBoardOpen,
+    isSidebarOpen,
+    detailsNode,
+    detailsLink,
+    ancestryLinkDetails,
+    imageViewer.visible,
+    editingAncestryRel.visible,
+    questMode.isActive,
+    viewParams,
+    actionHandlerContext
+  ]);
   if (isLoading || status === "loading" || permissionStatus === "loading") {
     return /* @__PURE__ */ import_react25.default.createElement(LoadingScreen, null);
   }

package/dist/index.mjs

@@ -7959,16 +7959,12 @@ function InSceneVersionForm({
 
 // src/components/InSceneQuestForm.jsx
 import React15, { useState as useState16, useRef as useRef12 } from "react";
-import { FiPlus as FiPlus5, FiCheck as FiCheck9, FiEdit2 as FiEdit26, FiTarget, FiX as FiX4 } from "react-icons/fi";
+import { FiPlus as FiPlus5, FiCheck as FiCheck9, FiEdit2 as FiEdit26, FiTarget, FiX as FiX4, FiChevronDown as FiChevronDown5 } from "react-icons/fi";
 var QUEST_STATUS_COLORS = {
   "Backlog": "#64748b",
-  // Slate (Cinza azulado)
   "In Progress": "#eab308",
-  // Yellow (Amarelo)
   "Review": "#a855f7",
-  // Purple (Roxo)
   "Done": "#22c55e"
-  // Green (Verde)
 };
 function InSceneQuestForm({
   onSave,
@@ -7988,6 +7984,7 @@ function InSceneQuestForm({
   const [size, setSize] = useState16("medium");
   const [intensity, setIntensity] = useState16(0);
   const [description, setDescription] = useState16("");
+  const [isStatusDropdownOpen, setIsStatusDropdownOpen] = useState16(false);
   const [customProps, setCustomProps] = useState16([]);
   const [isDescriptionModalOpen, setIsDescriptionModalOpen] = useState16(false);
   const propsEndRef = useRef12(null);
@@ -8038,7 +8035,6 @@ function InSceneQuestForm({
       name: name.trim(),
       type: types,
       color: QUEST_STATUS_COLORS[status],
-      // Cor atrelada ao status
       status,
       size,
       intensity,
@@ -8065,20 +8061,38 @@ function InSceneQuestForm({
       onDoubleClick: swallow
     },
     /* @__PURE__ */ React15.createElement("div", { className: "h-[2px]", style: { background: `linear-gradient(to right, transparent, ${QUEST_STATUS_COLORS[status]}, transparent)` } }),
-    /* @__PURE__ */ React15.createElement("div", { className: "px-6 pt-5 pb-3" }, /* @__PURE__ */ React15.createElement("div", { className: "flex items-center gap-2 mb-1" }, /* @__PURE__ */ React15.createElement(FiTarget, { className: "text-sky-400", size: 14 }), /* @__PURE__ */ React15.createElement("p", { className: "text-xs/relaxed text-slate-300" }, "Nova Tarefa / Objetivo")), /* @__PURE__ */ React15.createElement("h2", { className: "text-xl sm:text-2xl font-semibold tracking-tight" }, "Criar Quest")),
-    /* @__PURE__ */ React15.createElement("form", { onSubmit: handleSubmit, className: "flex flex-col max-h-[68vh]" }, /* @__PURE__ */ React15.createElement("div", { className: "px-6 pb-28 overflow-y-auto overscroll-contain space-y-4 custom-scrollbar" }, /* @__PURE__ */ React15.createElement("div", { className: "space-y-1.5 relative" }, /* @__PURE__ */ React15.createElement("label", { className: "text-xs text-slate-300" }, "Status da Quest"), /* @__PURE__ */ React15.createElement(
-      "select",
-      {
-        value: status,
-        onChange: (e) => setStatus(e.target.value),
-        className: "w-full bg-slate-800/70 p-2.5 text-sm rounded-lg border border-white/10 focus:outline-none focus:ring-2 focus:ring-indigo-400/60 appearance-none cursor-pointer",
-        style: { borderLeft: `4px solid ${QUEST_STATUS_COLORS[status]}` }
+    /* @__PURE__ */ React15.createElement("div", { className: "px-6 pt-5 pb-3 flex items-start justify-between gap-4" }, /* @__PURE__ */ React15.createElement("div", null, /* @__PURE__ */ React15.createElement("div", { className: "flex items-center gap-2 mb-1" }, /* @__PURE__ */ React15.createElement(FiTarget, { className: "text-sky-400", size: 14 }), /* @__PURE__ */ React15.createElement("p", { className: "text-xs/relaxed text-slate-300" }, "Nova Tarefa / Objetivo")), /* @__PURE__ */ React15.createElement("h2", { className: "text-xl sm:text-2xl font-semibold tracking-tight" }, "Criar Quest")), /* @__PURE__ */ React15.createElement(
+      "button",
+      {
+        type: "button",
+        onClick: onCancel,
+        className: "w-9 h-9 grid place-content-center rounded-lg border border-white/15 bg-transparent hover:bg-white/5 transition-colors text-xl",
+        title: "Fechar"
       },
-      /* @__PURE__ */ React15.createElement("option", { value: "Backlog" }, "Backlog"),
-      /* @__PURE__ */ React15.createElement("option", { value: "In Progress" }, "In Progress"),
-      /* @__PURE__ */ React15.createElement("option", { value: "Review" }, "Review"),
-      /* @__PURE__ */ React15.createElement("option", { value: "Done" }, "Done")
-    )), /* @__PURE__ */ React15.createElement("div", { className: "space-y-1.5" }, /* @__PURE__ */ React15.createElement("label", { className: "text-xs text-slate-300" }, "Nome da Quest"), /* @__PURE__ */ React15.createElement("input", { required: true, type: "text", placeholder: "Ex.: Refatorar M\xF3dulo X", value: name, onChange: (e) => setName(e.target.value), className: "w-full bg-slate-800/70 p-2.5 text-sm rounded-lg border border-white/10 focus:outline-none focus:ring-2 focus:ring-indigo-400/60" })), /* @__PURE__ */ React15.createElement("div", { className: "space-y-1.5" }, /* @__PURE__ */ React15.createElement("label", { className: "text-xs text-slate-300" }, "Tipos Adicionais"), /* @__PURE__ */ React15.createElement("div", { className: "relative w-full bg-slate-800/70 p-1.5 min-h-[42px] flex flex-wrap gap-1.5 rounded-lg border border-white/10 focus-within:ring-2 focus-within:ring-indigo-400/60 transition-all" }, types.map((t, index) => /* @__PURE__ */ React15.createElement("span", { key: index, className: `flex items-center gap-1 px-1.5 py-0.5 rounded-md text-xs font-medium border ${t === "quest" ? "bg-sky-500/20 text-sky-200 border-sky-500/30" : "bg-indigo-500/30 text-indigo-100 border-indigo-500/20"}` }, t, t !== "quest" && /* @__PURE__ */ React15.createElement("button", { type: "button", onClick: () => handleRemoveType(index), className: "hover:text-white transition-colors" }, /* @__PURE__ */ React15.createElement(FiX4, { size: 12 })))), /* @__PURE__ */ React15.createElement(
+      "\xD7"
+    )),
+    /* @__PURE__ */ React15.createElement("form", { onSubmit: handleSubmit, className: "flex flex-col max-h-[68vh]" }, /* @__PURE__ */ React15.createElement("div", { className: "px-6 pb-28 overflow-y-auto overscroll-contain space-y-4 custom-scrollbar" }, /* @__PURE__ */ React15.createElement("div", { className: "space-y-1.5 relative" }, /* @__PURE__ */ React15.createElement("label", { className: "text-xs text-slate-300" }, "Status da Quest"), /* @__PURE__ */ React15.createElement("div", { className: "relative" }, /* @__PURE__ */ React15.createElement(
+      "button",
+      {
+        type: "button",
+        onClick: () => setIsStatusDropdownOpen(!isStatusDropdownOpen),
+        className: "w-full bg-slate-800/70 p-2.5 text-sm rounded-lg border border-white/10 hover:border-white/20 focus:outline-none focus:ring-2 focus:ring-indigo-400/60 transition-colors flex items-center justify-between"
+      },
+      /* @__PURE__ */ React15.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React15.createElement("span", { className: "w-3 h-3 rounded-full shadow-[0_0_8px_rgba(0,0,0,0.5)]", style: { backgroundColor: QUEST_STATUS_COLORS[status] } }), /* @__PURE__ */ React15.createElement("span", { className: "text-slate-200 font-medium" }, status)),
+      /* @__PURE__ */ React15.createElement(FiChevronDown5, { className: `text-slate-400 transition-transform duration-200 ${isStatusDropdownOpen ? "rotate-180" : ""}` })
+    ), isStatusDropdownOpen && /* @__PURE__ */ React15.createElement(React15.Fragment, null, /* @__PURE__ */ React15.createElement("div", { className: "fixed inset-0 z-40", onClick: () => setIsStatusDropdownOpen(false) }), /* @__PURE__ */ React15.createElement("ul", { className: "absolute top-full left-0 mt-1.5 w-full bg-slate-800 border border-white/10 rounded-lg shadow-[0_8px_30px_rgba(0,0,0,0.5)] z-50 overflow-hidden" }, Object.keys(QUEST_STATUS_COLORS).map((s) => /* @__PURE__ */ React15.createElement(
+      "li",
+      {
+        key: s,
+        onClick: () => {
+          setStatus(s);
+          setIsStatusDropdownOpen(false);
+        },
+        className: `px-3 py-2.5 text-sm cursor-pointer transition-colors flex items-center gap-2 ${status === s ? "bg-indigo-500/20 text-white" : "text-slate-300 hover:bg-white/5 hover:text-white"}`
+      },
+      /* @__PURE__ */ React15.createElement("span", { className: "w-3 h-3 rounded-full", style: { backgroundColor: QUEST_STATUS_COLORS[s] } }),
+      s
+    )))))), /* @__PURE__ */ React15.createElement("div", { className: "space-y-1.5" }, /* @__PURE__ */ React15.createElement("label", { className: "text-xs text-slate-300" }, "Nome da Quest"), /* @__PURE__ */ React15.createElement("input", { required: true, type: "text", placeholder: "Ex.: Refatorar M\xF3dulo X", value: name, onChange: (e) => setName(e.target.value), className: "w-full bg-slate-800/70 p-2.5 text-sm rounded-lg border border-white/10 focus:outline-none focus:ring-2 focus:ring-indigo-400/60" })), /* @__PURE__ */ React15.createElement("div", { className: "space-y-1.5" }, /* @__PURE__ */ React15.createElement("label", { className: "text-xs text-slate-300" }, "Tipos Adicionais"), /* @__PURE__ */ React15.createElement("div", { className: "relative w-full bg-slate-800/70 p-1.5 min-h-[42px] flex flex-wrap gap-1.5 rounded-lg border border-white/10 focus-within:ring-2 focus-within:ring-indigo-400/60 transition-all" }, types.map((t, index) => /* @__PURE__ */ React15.createElement("span", { key: index, className: `flex items-center gap-1 px-1.5 py-0.5 rounded-md text-xs font-medium border ${t === "quest" ? "bg-sky-500/20 text-sky-200 border-sky-500/30" : "bg-indigo-500/30 text-indigo-100 border-indigo-500/20"}` }, t, t !== "quest" && /* @__PURE__ */ React15.createElement("button", { type: "button", onClick: () => handleRemoveType(index), className: "hover:text-white transition-colors" }, /* @__PURE__ */ React15.createElement(FiX4, { size: 12 })))), /* @__PURE__ */ React15.createElement(
       "input",
       {
         type: "text",
@@ -10294,7 +10308,7 @@ function XViewScene({
         });
       }
       return {
-        node: effectiveNode || { id: nodeId, name: "Unknown" },
+        ...effectiveNode ? { node: effectiveNode } : { node: { id: nodeId, name: "Unknown" } },
         relationship: treeItem.relationship || {},
         children: (treeItem.children || []).map(recursiveBuild).filter(Boolean),
         parallel_branches: processedBranches
@@ -11098,38 +11112,6 @@ function XViewScene({
         }
       }
     }
-    function handleCancelAncestryCreation() {
-      setAncestryMode({ isActive: false, tree: null, selectedParentId: null, isEditMode: false, currentAncestryId: null, ancestryName: "", ancestryDescription: "", ancestryDescriptionSections: [], isAddingNodes: false });
-      if (mountRef.current) mountRef.current.style.cursor = "grab";
-    }
-    function handleKeyDown(event) {
-      var _a2, _b2, _c2, _d2;
-      const context = actionHandlerContext;
-      if (event.key === "Escape") {
-        if (stateRef.current.connection.isActive) userActionHandlers.handleCancelConnection(context);
-        if (stateRef.current.relink.isActive) userActionHandlers.handleCancelRelink(context);
-        if (stateRef.current.creation.isActive) userActionHandlers.handleCancelCreation(context);
-        if ((_a2 = stateRef.current.versionMode) == null ? void 0 : _a2.isActive) userActionHandlers.handleCancelVersioning(context);
-        if (stateRef.current.ancestry.isActive) handleCancelAncestryCreation();
-        if ((_b2 = context.questMode) == null ? void 0 : _b2.isActive) context.setters.setQuestMode({ isActive: false });
-        if (stateRef.current.selectedNodes.size > 0) {
-          stateRef.current.selectedNodes.clear();
-        }
-        setContextMenu((prev) => prev.visible ? { ...prev, visible: false } : prev);
-        setMultiContextMenu((prev) => ({ ...prev, visible: false }));
-        setRelationshipMenu((prev) => ({ ...prev, visible: false }));
-      }
-      if (event.key.toLowerCase() === "q") {
-        const isUiClear = !stateRef.current.creation.isActive && !stateRef.current.connection.isActive && !stateRef.current.relink.isActive && !stateRef.current.ancestry.isActive && !((_c2 = context.versionMode) == null ? void 0 : _c2.isActive) && !contextMenu.visible && !multiContextMenu.visible && !relationshipMenu.visible && !readingMode.isActive && !isImportModalOpen && !isAncestryBoardOpen;
-        if (isUiClear) {
-          const isView = ((_d2 = viewParams == null ? void 0 : viewParams.type) == null ? void 0 : _d2.toLowerCase()) === "view";
-          if (!isView) {
-            return;
-          }
-          setQuestMode({ isActive: true });
-        }
-      }
-    }
     function handleDoubleClick(event) {
       if (stateRef.current.camera) stateRef.current.camera.layers.enableAll();
       if (isFromUiOverlay(event) || stateRef.current.isDragging || stateRef.current.creation.isActive || stateRef.current.connection.isActive || stateRef.current.relink.isActive) return;
@@ -11182,7 +11164,6 @@ function XViewScene({
     currentMount.addEventListener("dblclick", handleDoubleClick);
     currentMount.addEventListener("pointermove", onPointerMove);
     currentMount.addEventListener("contextmenu", handleContextMenu);
-    window.addEventListener("keydown", handleKeyDown);
     const originalBackground = scene.background;
     const clock = new THREE3.Clock();
     let animationFrameId = 0;
@@ -11320,7 +11301,6 @@ function XViewScene({
     return () => {
       cancelAnimationFrame(animationFrameId);
       window.removeEventListener("resize", handleResize);
-      window.removeEventListener("keydown", handleKeyDown);
       currentMount.removeEventListener("pointerdown", onPointerDown);
       currentMount.removeEventListener("pointerup", onPointerUp);
       currentMount.removeEventListener("dblclick", handleDoubleClick);
@@ -13124,6 +13104,62 @@ function XViewScene({
       }
     }
   }, [isInitialized, sceneVersion, focusAncestryId, hasOpenedInitialAncestry, handleStartReadingAncestry]);
+  useEffect21(() => {
+    function handleKeyDown(event) {
+      var _a2, _b2, _c2, _d2;
+      const context = actionHandlerContext;
+      if (event.key === "Escape") {
+        if (stateRef.current.connection.isActive) userActionHandlers.handleCancelConnection(context);
+        if (stateRef.current.relink.isActive) userActionHandlers.handleCancelRelink(context);
+        if (stateRef.current.creation.isActive) userActionHandlers.handleCancelCreation(context);
+        if ((_a2 = stateRef.current.versionMode) == null ? void 0 : _a2.isActive) userActionHandlers.handleCancelVersioning(context);
+        if (stateRef.current.ancestry.isActive) {
+          setAncestryMode({ isActive: false, tree: null, selectedParentId: null, isEditMode: false, currentAncestryId: null, ancestryName: "", ancestryDescription: "", ancestryDescriptionSections: [], isAddingNodes: false });
+          if (mountRef.current) mountRef.current.style.cursor = "grab";
+        }
+        if ((_b2 = context.questMode) == null ? void 0 : _b2.isActive) context.setters.setQuestMode({ isActive: false });
+        if (stateRef.current.selectedNodes.size > 0) {
+          stateRef.current.selectedNodes.clear();
+        }
+        setContextMenu((prev) => prev.visible ? { ...prev, visible: false } : prev);
+        setMultiContextMenu((prev) => ({ ...prev, visible: false }));
+        setRelationshipMenu((prev) => ({ ...prev, visible: false }));
+      }
+      if (event.key.toLowerCase() === "q") {
+        const isUiClear = !stateRef.current.creation.isActive && !stateRef.current.connection.isActive && !stateRef.current.relink.isActive && !stateRef.current.ancestry.isActive && !((_c2 = context.versionMode) == null ? void 0 : _c2.isActive) && !contextMenu.visible && !multiContextMenu.visible && !relationshipMenu.visible && !readingMode.isActive && !isImportModalOpen && !isAncestryBoardOpen && !isSidebarOpen && // Condição nova
+        !detailsNode && // Condição nova
+        !detailsLink && // Condição nova
+        !ancestryLinkDetails && // Condição nova
+        !imageViewer.visible && // Condição nova
+        !editingAncestryRel.visible && // Condição nova
+        !questMode.isActive;
+        if (isUiClear) {
+          const isView = ((_d2 = viewParams == null ? void 0 : viewParams.type) == null ? void 0 : _d2.toLowerCase()) === "view";
+          if (!isView) return;
+          setQuestMode({ isActive: true });
+        }
+      }
+    }
+    window.addEventListener("keydown", handleKeyDown);
+    return () => window.removeEventListener("keydown", handleKeyDown);
+  }, [
+    // Dependências: sempre que um painel abrir ou fechar, o React atualiza o listener com os dados frescos
+    contextMenu.visible,
+    multiContextMenu.visible,
+    relationshipMenu.visible,
+    readingMode.isActive,
+    isImportModalOpen,
+    isAncestryBoardOpen,
+    isSidebarOpen,
+    detailsNode,
+    detailsLink,
+    ancestryLinkDetails,
+    imageViewer.visible,
+    editingAncestryRel.visible,
+    questMode.isActive,
+    viewParams,
+    actionHandlerContext
+  ]);
   if (isLoading || status === "loading" || permissionStatus === "loading") {
     return /* @__PURE__ */ React24.createElement(LoadingScreen, null);
   }

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@lv-x-software-house/x_view",
-    "version": "1.2.4-dev.13",
+    "version": "1.2.4-dev.15",
     "description": "Pacote privado contendo os componentes e lógica de renderização 3D do X View.",
     "author": "iv.x - Engenharia de Software - ivxsoftwarehouse@gmail.com",
     "license": "UNLICENSED",