@lv-x-software-house/x_view 1.2.2-dev.14 → 1.2.2-dev.15

package/dist/index.js

@@ -3216,8 +3216,8 @@ function CustomPropertyDisplay({
     const availableOptions = [
       { value: "links", label: "Links", unique: true },
       { value: "images", label: "Images", unique: true },
-      { value: "documents", label: "Documents", unique: true },
       { value: "date", label: "Data", unique: true },
+      { value: "documents", label: "Documents", unique: true },
       { value: "text", label: "Texto", unique: false },
       { value: "number", label: "N\xFAmero", unique: false },
       { value: "list", label: "Lista", unique: false }
@@ -4080,6 +4080,24 @@ function DescriptionEditModal({
       },
       /* @__PURE__ */ import_react6.default.createElement(import_fi4.FiList, { size: 12 }),
       " Lista"
+    ), /* @__PURE__ */ import_react6.default.createElement(
+      "button",
+      {
+        onClick: () => insertAtCursor("1. "),
+        className: "flex items-center gap-1 px-3 py-1.5 rounded bg-slate-800 hover:bg-slate-700 border border-white/10 text-xs font-medium transition-colors whitespace-nowrap",
+        title: "Lista Numerada"
+      },
+      /* @__PURE__ */ import_react6.default.createElement("span", { className: "text-[10px] font-bold" }, "1."),
+      " Numerada"
+    ), /* @__PURE__ */ import_react6.default.createElement(
+      "button",
+      {
+        onClick: () => insertAtCursor("- [ ] "),
+        className: "flex items-center gap-1 px-3 py-1.5 rounded bg-slate-800 hover:bg-slate-700 border border-white/10 text-xs font-medium transition-colors whitespace-nowrap",
+        title: "Checklist (Checkbox)"
+      },
+      /* @__PURE__ */ import_react6.default.createElement(import_fi4.FiCheckSquare, { size: 12 }),
+      " Checklist"
     ), /* @__PURE__ */ import_react6.default.createElement(
       "button",
       {
@@ -4386,7 +4404,7 @@ var renderTextWithMentions = (text, availableNodes, onMentionClick, activeMentio
     );
   });
 };
-var formatLineContent2 = (line, availableNodes, onMentionClick, activeMentionIndex, mentionCounterRef, setRef, onImageClick) => {
+var formatLineContent2 = (line, availableNodes, onMentionClick, activeMentionIndex, mentionCounterRef, setRef, onImageClick, onToggleCheckbox, globalCheckboxCounterRef) => {
   const trimmedLine = line.replace(/\r$/, "");
   const processContent = (content) => renderTextWithMentions(content, availableNodes, onMentionClick, activeMentionIndex, mentionCounterRef, setRef, onImageClick);
   if (line.startsWith("# ")) {
@@ -4397,9 +4415,33 @@ var formatLineContent2 = (line, availableNodes, onMentionClick, activeMentionInd
     const content = line.replace("## ", "");
     return /* @__PURE__ */ import_react7.default.createElement("span", { className: "text-sm sm:text-base font-semibold text-indigo-200 leading-tight break-words" }, processContent(content));
   }
+  const checkboxMatch = trimmedLine.match(/^(\s*)- \[([ xX])\]\s+(.*)/);
+  if (checkboxMatch) {
+    const [_, space, state, content] = checkboxMatch;
+    const isChecked = state.toLowerCase() === "x";
+    const currentIdx = globalCheckboxCounterRef.current;
+    globalCheckboxCounterRef.current += 1;
+    return /* @__PURE__ */ import_react7.default.createElement("span", { className: "flex items-start gap-2.5 my-1 break-words ml-1" }, /* @__PURE__ */ import_react7.default.createElement(
+      "input",
+      {
+        type: "checkbox",
+        checked: isChecked,
+        onChange: (e) => {
+          e.stopPropagation();
+          if (onToggleCheckbox) onToggleCheckbox(currentIdx);
+        },
+        className: "mt-1 cursor-pointer accent-indigo-500 w-3.5 h-3.5 border-white/20 rounded-sm focus:ring-indigo-500 focus:ring-offset-slate-900"
+      }
+    ), /* @__PURE__ */ import_react7.default.createElement("span", { className: `transition-all duration-200 ${isChecked ? "line-through text-slate-500" : "text-slate-200"}` }, processContent(content)));
+  }
+  const numberMatch = trimmedLine.match(/^(\s*)(\d+\.)\s+(.*)/);
+  if (numberMatch) {
+    const [_, space, numberStr, content] = numberMatch;
+    return /* @__PURE__ */ import_react7.default.createElement("span", { className: "flex items-start gap-2 my-0.5 break-words ml-1" }, /* @__PURE__ */ import_react7.default.createElement("span", { className: "text-indigo-400 font-mono font-bold text-xs mt-[3px] shrink-0" }, numberStr), /* @__PURE__ */ import_react7.default.createElement("span", { className: "text-slate-200" }, processContent(content)));
+  }
   if (trimmedLine.trim().startsWith("- ") || trimmedLine.trim().startsWith("* ")) {
     const content = trimmedLine.trim().substring(2);
-    return /* @__PURE__ */ import_react7.default.createElement("span", { className: "pl-2 text-slate-200 break-words" }, /* @__PURE__ */ import_react7.default.createElement("span", { className: "text-indigo-400 font-bold mr-1.5" }, "\u2022"), processContent(content));
+    return /* @__PURE__ */ import_react7.default.createElement("span", { className: "flex items-start gap-2 my-0.5 break-words ml-1 text-slate-200" }, /* @__PURE__ */ import_react7.default.createElement("span", { className: "text-indigo-400 font-bold shrink-0 mt-[2px] text-xs" }, "\u2022"), /* @__PURE__ */ import_react7.default.createElement("span", null, processContent(content)));
   }
   return /* @__PURE__ */ import_react7.default.createElement("span", { className: "break-words" }, processContent(line));
 };
@@ -4411,14 +4453,32 @@ function DescriptionDisplay({
   onOpenReference,
   onMentionClick,
   onImageClick,
-  // <--- NOVA PROP RECEBIDA
   onSectionChange,
   onBranchNav,
   onHighlightNode,
   initialSectionId,
-  currentBranchDirection = null
+  currentBranchDirection = null,
+  onSaveDescription
+  // NOVO: Prop para salvar checklist
 }) {
-  const sections = (0, import_react7.useMemo)(() => parseDescriptionSections(description, savedSections), [description, savedSections]);
+  const [localDescription, setLocalDescription] = (0, import_react7.useState)(description || "");
+  (0, import_react7.useEffect)(() => {
+    setLocalDescription(description || "");
+  }, [description]);
+  const sections = (0, import_react7.useMemo)(() => parseDescriptionSections(localDescription, savedSections), [localDescription, savedSections]);
+  const globalCheckboxCounterRef = (0, import_react7.useRef)(0);
+  const handleToggleCheckbox = (targetIndex) => {
+    let currentIndex = 0;
+    const newDesc = localDescription.replace(/^(\s*)- \[([ xX])\]/gm, (match, space, state) => {
+      if (currentIndex === targetIndex) {
+        currentIndex++;
+        return state === " " ? `${space}- [x]` : `${space}- [ ]`;
+      }
+      currentIndex++;
+      return match;
+    });
+    setLocalDescription(newDesc);
+  };
   const flatNavigation = (0, import_react7.useMemo)(() => {
     const navItems = [];
     sections.forEach((section, sIdx) => {
@@ -4559,26 +4619,27 @@ function DescriptionDisplay({
       }
       const lines = part.replace(/\n$/, "").split("\n");
       return /* @__PURE__ */ import_react7.default.createElement(import_react7.default.Fragment, { key: `text-${parentIndex}-${partIndex}` }, lines.map((line, lineIndex) => {
-        const isLastLine = lineIndex === lines.length - 1;
         const isEmptyLine = line.trim() === "";
         if (isEmptyLine) {
           return /* @__PURE__ */ import_react7.default.createElement(import_react7.default.Fragment, { key: `${parentIndex}-${partIndex}-${lineIndex}` }, /* @__PURE__ */ import_react7.default.createElement("br", null));
         }
         return /* @__PURE__ */ import_react7.default.createElement(import_react7.default.Fragment, { key: `${parentIndex}-${partIndex}-${lineIndex}` }, /* @__PURE__ */ import_react7.default.createElement(
-          "span",
+          "div",
           {
             ref: isActiveSection && activeMentionIndex === -1 && partIndex === 0 && lineIndex === 0 ? setRef : null,
-            onClick: () => {
-              const idx = flatNavigation.findIndex((item) => item.type === "section" && item.sectionIndex === parentIndex);
-              if (idx !== -1) setCurrentStepIndex(idx);
+            onClick: (e) => {
+              if (e.target.type !== "checkbox") {
+                const idx = flatNavigation.findIndex((item) => item.type === "section" && item.sectionIndex === parentIndex);
+                if (idx !== -1) setCurrentStepIndex(idx);
+              }
             },
             className: `
-                                        transition-colors duration-200 cursor-pointer rounded-md px-1 py-0.5 -mx-1 box-decoration-clone
-                                        ${isActiveSection ? "bg-indigo-500/20 text-white ring-1 ring-indigo-500/30" : "hover:bg-white/5 hover:text-slate-200"}
+                                        transition-colors duration-200 cursor-pointer rounded-md px-1 py-0.5 -mx-1 box-decoration-clone inline-block w-full
+                                        ${isActiveSection ? "bg-indigo-500/10 text-white ring-1 ring-indigo-500/30" : "hover:bg-white/5 hover:text-slate-200"}
                                     `
           },
-          formatLineContent2(line, availableNodes, onMentionClick, isActiveSection ? activeMentionIndex : -1, mentionCounterRef, setRef, onImageClick)
-        ), !isLastLine && /* @__PURE__ */ import_react7.default.createElement("br", null));
+          formatLineContent2(line, availableNodes, onMentionClick, isActiveSection ? activeMentionIndex : -1, mentionCounterRef, setRef, onImageClick, handleToggleCheckbox, globalCheckboxCounterRef)
+        ));
       }));
     });
   };
@@ -4606,7 +4667,9 @@ function DescriptionDisplay({
                     ${isActiveSection ? "opacity-100" : "opacity-90"}
                 ` }, renderMixedContent(resolved.content, index, isActiveSection, -1, setRef)));
   };
-  return /* @__PURE__ */ import_react7.default.createElement("div", { className: "w-full text-sm leading-relaxed text-slate-300 break-words whitespace-pre-wrap px-3 pt-1 pb-2 pr-9" }, sections.map((section, index) => {
+  globalCheckboxCounterRef.current = 0;
+  const hasUnsavedChanges = localDescription !== (description || "");
+  return /* @__PURE__ */ import_react7.default.createElement("div", { className: "relative w-full h-full min-h-[100px]" }, /* @__PURE__ */ import_react7.default.createElement("div", { className: "w-full text-sm leading-relaxed text-slate-300 break-words whitespace-pre-wrap px-3 pt-1 pb-16 pr-9" }, sections.map((section, index) => {
     const currentNavItem = flatNavigation[currentStepIndex];
     const isSectionContextActive = currentNavItem && currentNavItem.sectionIndex === index;
     const activeMentionIndex = isSectionContextActive && currentNavItem.type === "mention" ? currentNavItem.mentionIndex : -1;
@@ -4622,7 +4685,18 @@ function DescriptionDisplay({
     if (index === 0) leadingSpace = "";
     const isRef = bodyText.trim().match(/^\[\[REF:(node|ancestry):([a-zA-Z0-9\-_]+):([a-zA-Z0-9\-_]+)\]\]$/);
     return /* @__PURE__ */ import_react7.default.createElement(import_react7.default.Fragment, { key: index }, /* @__PURE__ */ import_react7.default.createElement("span", null, leadingSpace), isRef ? renderReferenceSection(bodyText, index, isSectionContextActive, setRef) : renderMixedContent(bodyText, index, isSectionContextActive, activeMentionIndex, setRef), /* @__PURE__ */ import_react7.default.createElement("span", null, trailingSpace));
-  }));
+  })), hasUnsavedChanges && onSaveDescription && /* @__PURE__ */ import_react7.default.createElement("div", { className: "absolute bottom-4 left-1/2 -translate-x-1/2 z-[100] animate-in slide-in-from-bottom-4 fade-in duration-300" }, /* @__PURE__ */ import_react7.default.createElement(
+    "button",
+    {
+      onClick: (e) => {
+        e.stopPropagation();
+        onSaveDescription(localDescription);
+      },
+      className: "flex items-center gap-2 px-5 py-2.5 bg-emerald-600 hover:bg-emerald-500 text-white rounded-full shadow-[0_8px_20px_rgba(5,150,105,0.4)] font-semibold text-sm transition-all hover:scale-105 active:scale-95 border border-emerald-400/30"
+    },
+    /* @__PURE__ */ import_react7.default.createElement(import_fi5.FiSave, { size: 16 }),
+    " Salvar Checklist"
+  )));
 }
 
 // src/components/DescriptionReadModePanel.jsx
@@ -4712,7 +4786,8 @@ function DescriptionReadModePanel({
   userRole,
   abstractionTree = null,
   onRenderAbstractionTree = null,
-  initialShowAbstraction = false
+  initialShowAbstraction = false,
+  onSaveDescription
 }) {
   const [showProperties, setShowProperties] = (0, import_react8.useState)(false);
   const [showAbstraction, setShowAbstraction] = (0, import_react8.useState)(false);
@@ -4930,7 +5005,8 @@ function DescriptionReadModePanel({
         onHighlightNode,
         initialSectionId,
         currentBranchDirection,
-        onImageClick
+        onImageClick,
+        onSaveDescription
       }
     )),
     leftAction && !showAbstraction && !showProperties && /* @__PURE__ */ import_react8.default.createElement(
@@ -7712,6 +7788,11 @@ function NodeDetailsPanel({
       textureImageUrl: url
     });
   };
+  const handleSaveDescriptionInline = (newDescription) => {
+    setDescription(newDescription);
+    onDataUpdate({ ...node, description: newDescription });
+    triggerAutoSave({ description: newDescription });
+  };
   const handleSave = async (keepOpen = false, overrides = {}) => {
     const currentName = overrides.name !== void 0 ? overrides.name : name;
     const currentTypes = overrides.types !== void 0 ? overrides.types : types;
@@ -7806,7 +7887,8 @@ function NodeDetailsPanel({
         availableAncestries,
         onOpenReference,
         onMentionClick,
-        onImageClick: handleImageClickFromText
+        onImageClick: handleImageClickFromText,
+        onSaveDescription: handleSaveDescriptionInline
       }
     ) : /* @__PURE__ */ import_react16.default.createElement(import_react16.default.Fragment, null, /* @__PURE__ */ import_react16.default.createElement("div", { className: "h-[2px] bg-gradient-to-r from-indigo-400/0 via-indigo-400/70 to-indigo-400/0" }), /* @__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("span", { className: "inline-flex h-2.5 w-2.5 rounded-full bg-indigo-400/80 shadow-[0_0_18px_2px_rgba(99,102,241,0.55)]" }), /* @__PURE__ */ import_react16.default.createElement("p", { className: "text-xs/relaxed text-slate-300" }, "Detalhes do Node"), /* @__PURE__ */ import_react16.default.createElement(
       "button",
@@ -7874,7 +7956,8 @@ function NodeDetailsPanel({
         availableAncestries,
         onOpenReference,
         onMentionClick,
-        onImageClick: handleImageClickFromText
+        onImageClick: handleImageClickFromText,
+        onSaveDescription: handleSaveDescriptionInline
       }
     ), /* @__PURE__ */ import_react16.default.createElement("div", { className: "absolute top-0 right-0 flex bg-slate-900/50 rounded-bl-lg backdrop-blur-sm opacity-0 group-hover:opacity-100 focus-within:opacity-100 transition-opacity overflow-hidden border-b border-l border-white/5" }, /* @__PURE__ */ import_react16.default.createElement(
       "button",

package/dist/index.mjs

@@ -3172,8 +3172,8 @@ function CustomPropertyDisplay({
     const availableOptions = [
       { value: "links", label: "Links", unique: true },
       { value: "images", label: "Images", unique: true },
-      { value: "documents", label: "Documents", unique: true },
       { value: "date", label: "Data", unique: true },
+      { value: "documents", label: "Documents", unique: true },
       { value: "text", label: "Texto", unique: false },
       { value: "number", label: "N\xFAmero", unique: false },
       { value: "list", label: "Lista", unique: false }
@@ -3396,7 +3396,7 @@ import { FiPlus, FiEdit2 as FiEdit22, FiBookOpen } from "react-icons/fi";
 
 // src/components/DescriptionEditModal.jsx
 import React5, { useState as useState6, useEffect as useEffect5, useRef as useRef5, useMemo as useMemo4 } from "react";
-import { FiType, FiList, FiCode, FiLink as FiLink2, FiAtSign, FiSearch as FiSearch2, FiHexagon as FiHexagon2, FiGlobe, FiImage } from "react-icons/fi";
+import { FiType, FiList, FiCode, FiLink as FiLink2, FiAtSign, FiSearch as FiSearch2, FiHexagon as FiHexagon2, FiGlobe, FiImage, FiCheckSquare } from "react-icons/fi";
 
 // src/components/SectionImportModal.jsx
 import React4, { useState as useState5, useMemo as useMemo3, useRef as useRef4, useEffect as useEffect4 } from "react";
@@ -4036,6 +4036,24 @@ function DescriptionEditModal({
       },
       /* @__PURE__ */ React5.createElement(FiList, { size: 12 }),
       " Lista"
+    ), /* @__PURE__ */ React5.createElement(
+      "button",
+      {
+        onClick: () => insertAtCursor("1. "),
+        className: "flex items-center gap-1 px-3 py-1.5 rounded bg-slate-800 hover:bg-slate-700 border border-white/10 text-xs font-medium transition-colors whitespace-nowrap",
+        title: "Lista Numerada"
+      },
+      /* @__PURE__ */ React5.createElement("span", { className: "text-[10px] font-bold" }, "1."),
+      " Numerada"
+    ), /* @__PURE__ */ React5.createElement(
+      "button",
+      {
+        onClick: () => insertAtCursor("- [ ] "),
+        className: "flex items-center gap-1 px-3 py-1.5 rounded bg-slate-800 hover:bg-slate-700 border border-white/10 text-xs font-medium transition-colors whitespace-nowrap",
+        title: "Checklist (Checkbox)"
+      },
+      /* @__PURE__ */ React5.createElement(FiCheckSquare, { size: 12 }),
+      " Checklist"
     ), /* @__PURE__ */ React5.createElement(
       "button",
       {
@@ -4199,7 +4217,7 @@ function DescriptionEditModal({
 
 // src/components/DescriptionDisplay.jsx
 import React6, { useMemo as useMemo5, useState as useState7, useEffect as useEffect6, useRef as useRef6 } from "react";
-import { FiCopy as FiCopy2, FiCheck as FiCheck3, FiChevronDown as FiChevronDown3, FiChevronRight as FiChevronRight2, FiTerminal as FiTerminal2, FiCornerDownRight, FiExternalLink as FiExternalLink2, FiImage as FiImage2 } from "react-icons/fi";
+import { FiCopy as FiCopy2, FiCheck as FiCheck3, FiChevronDown as FiChevronDown3, FiChevronRight as FiChevronRight2, FiTerminal as FiTerminal2, FiCornerDownRight, FiExternalLink as FiExternalLink2, FiImage as FiImage2, FiSave } from "react-icons/fi";
 var CodeBlock2 = ({ content, isActive, onClick }) => {
   const [isExpanded, setIsExpanded] = useState7(false);
   const [copied, setCopied] = useState7(false);
@@ -4342,7 +4360,7 @@ var renderTextWithMentions = (text, availableNodes, onMentionClick, activeMentio
     );
   });
 };
-var formatLineContent2 = (line, availableNodes, onMentionClick, activeMentionIndex, mentionCounterRef, setRef, onImageClick) => {
+var formatLineContent2 = (line, availableNodes, onMentionClick, activeMentionIndex, mentionCounterRef, setRef, onImageClick, onToggleCheckbox, globalCheckboxCounterRef) => {
   const trimmedLine = line.replace(/\r$/, "");
   const processContent = (content) => renderTextWithMentions(content, availableNodes, onMentionClick, activeMentionIndex, mentionCounterRef, setRef, onImageClick);
   if (line.startsWith("# ")) {
@@ -4353,9 +4371,33 @@ var formatLineContent2 = (line, availableNodes, onMentionClick, activeMentionInd
     const content = line.replace("## ", "");
     return /* @__PURE__ */ React6.createElement("span", { className: "text-sm sm:text-base font-semibold text-indigo-200 leading-tight break-words" }, processContent(content));
   }
+  const checkboxMatch = trimmedLine.match(/^(\s*)- \[([ xX])\]\s+(.*)/);
+  if (checkboxMatch) {
+    const [_, space, state, content] = checkboxMatch;
+    const isChecked = state.toLowerCase() === "x";
+    const currentIdx = globalCheckboxCounterRef.current;
+    globalCheckboxCounterRef.current += 1;
+    return /* @__PURE__ */ React6.createElement("span", { className: "flex items-start gap-2.5 my-1 break-words ml-1" }, /* @__PURE__ */ React6.createElement(
+      "input",
+      {
+        type: "checkbox",
+        checked: isChecked,
+        onChange: (e) => {
+          e.stopPropagation();
+          if (onToggleCheckbox) onToggleCheckbox(currentIdx);
+        },
+        className: "mt-1 cursor-pointer accent-indigo-500 w-3.5 h-3.5 border-white/20 rounded-sm focus:ring-indigo-500 focus:ring-offset-slate-900"
+      }
+    ), /* @__PURE__ */ React6.createElement("span", { className: `transition-all duration-200 ${isChecked ? "line-through text-slate-500" : "text-slate-200"}` }, processContent(content)));
+  }
+  const numberMatch = trimmedLine.match(/^(\s*)(\d+\.)\s+(.*)/);
+  if (numberMatch) {
+    const [_, space, numberStr, content] = numberMatch;
+    return /* @__PURE__ */ React6.createElement("span", { className: "flex items-start gap-2 my-0.5 break-words ml-1" }, /* @__PURE__ */ React6.createElement("span", { className: "text-indigo-400 font-mono font-bold text-xs mt-[3px] shrink-0" }, numberStr), /* @__PURE__ */ React6.createElement("span", { className: "text-slate-200" }, processContent(content)));
+  }
   if (trimmedLine.trim().startsWith("- ") || trimmedLine.trim().startsWith("* ")) {
     const content = trimmedLine.trim().substring(2);
-    return /* @__PURE__ */ React6.createElement("span", { className: "pl-2 text-slate-200 break-words" }, /* @__PURE__ */ React6.createElement("span", { className: "text-indigo-400 font-bold mr-1.5" }, "\u2022"), processContent(content));
+    return /* @__PURE__ */ React6.createElement("span", { className: "flex items-start gap-2 my-0.5 break-words ml-1 text-slate-200" }, /* @__PURE__ */ React6.createElement("span", { className: "text-indigo-400 font-bold shrink-0 mt-[2px] text-xs" }, "\u2022"), /* @__PURE__ */ React6.createElement("span", null, processContent(content)));
   }
   return /* @__PURE__ */ React6.createElement("span", { className: "break-words" }, processContent(line));
 };
@@ -4367,14 +4409,32 @@ function DescriptionDisplay({
   onOpenReference,
   onMentionClick,
   onImageClick,
-  // <--- NOVA PROP RECEBIDA
   onSectionChange,
   onBranchNav,
   onHighlightNode,
   initialSectionId,
-  currentBranchDirection = null
+  currentBranchDirection = null,
+  onSaveDescription
+  // NOVO: Prop para salvar checklist
 }) {
-  const sections = useMemo5(() => parseDescriptionSections(description, savedSections), [description, savedSections]);
+  const [localDescription, setLocalDescription] = useState7(description || "");
+  useEffect6(() => {
+    setLocalDescription(description || "");
+  }, [description]);
+  const sections = useMemo5(() => parseDescriptionSections(localDescription, savedSections), [localDescription, savedSections]);
+  const globalCheckboxCounterRef = useRef6(0);
+  const handleToggleCheckbox = (targetIndex) => {
+    let currentIndex = 0;
+    const newDesc = localDescription.replace(/^(\s*)- \[([ xX])\]/gm, (match, space, state) => {
+      if (currentIndex === targetIndex) {
+        currentIndex++;
+        return state === " " ? `${space}- [x]` : `${space}- [ ]`;
+      }
+      currentIndex++;
+      return match;
+    });
+    setLocalDescription(newDesc);
+  };
   const flatNavigation = useMemo5(() => {
     const navItems = [];
     sections.forEach((section, sIdx) => {
@@ -4515,26 +4575,27 @@ function DescriptionDisplay({
       }
       const lines = part.replace(/\n$/, "").split("\n");
       return /* @__PURE__ */ React6.createElement(React6.Fragment, { key: `text-${parentIndex}-${partIndex}` }, lines.map((line, lineIndex) => {
-        const isLastLine = lineIndex === lines.length - 1;
         const isEmptyLine = line.trim() === "";
         if (isEmptyLine) {
           return /* @__PURE__ */ React6.createElement(React6.Fragment, { key: `${parentIndex}-${partIndex}-${lineIndex}` }, /* @__PURE__ */ React6.createElement("br", null));
         }
         return /* @__PURE__ */ React6.createElement(React6.Fragment, { key: `${parentIndex}-${partIndex}-${lineIndex}` }, /* @__PURE__ */ React6.createElement(
-          "span",
+          "div",
           {
             ref: isActiveSection && activeMentionIndex === -1 && partIndex === 0 && lineIndex === 0 ? setRef : null,
-            onClick: () => {
-              const idx = flatNavigation.findIndex((item) => item.type === "section" && item.sectionIndex === parentIndex);
-              if (idx !== -1) setCurrentStepIndex(idx);
+            onClick: (e) => {
+              if (e.target.type !== "checkbox") {
+                const idx = flatNavigation.findIndex((item) => item.type === "section" && item.sectionIndex === parentIndex);
+                if (idx !== -1) setCurrentStepIndex(idx);
+              }
             },
             className: `
-                                        transition-colors duration-200 cursor-pointer rounded-md px-1 py-0.5 -mx-1 box-decoration-clone
-                                        ${isActiveSection ? "bg-indigo-500/20 text-white ring-1 ring-indigo-500/30" : "hover:bg-white/5 hover:text-slate-200"}
+                                        transition-colors duration-200 cursor-pointer rounded-md px-1 py-0.5 -mx-1 box-decoration-clone inline-block w-full
+                                        ${isActiveSection ? "bg-indigo-500/10 text-white ring-1 ring-indigo-500/30" : "hover:bg-white/5 hover:text-slate-200"}
                                     `
           },
-          formatLineContent2(line, availableNodes, onMentionClick, isActiveSection ? activeMentionIndex : -1, mentionCounterRef, setRef, onImageClick)
-        ), !isLastLine && /* @__PURE__ */ React6.createElement("br", null));
+          formatLineContent2(line, availableNodes, onMentionClick, isActiveSection ? activeMentionIndex : -1, mentionCounterRef, setRef, onImageClick, handleToggleCheckbox, globalCheckboxCounterRef)
+        ));
       }));
     });
   };
@@ -4562,7 +4623,9 @@ function DescriptionDisplay({
                     ${isActiveSection ? "opacity-100" : "opacity-90"}
                 ` }, renderMixedContent(resolved.content, index, isActiveSection, -1, setRef)));
   };
-  return /* @__PURE__ */ React6.createElement("div", { className: "w-full text-sm leading-relaxed text-slate-300 break-words whitespace-pre-wrap px-3 pt-1 pb-2 pr-9" }, sections.map((section, index) => {
+  globalCheckboxCounterRef.current = 0;
+  const hasUnsavedChanges = localDescription !== (description || "");
+  return /* @__PURE__ */ React6.createElement("div", { className: "relative w-full h-full min-h-[100px]" }, /* @__PURE__ */ React6.createElement("div", { className: "w-full text-sm leading-relaxed text-slate-300 break-words whitespace-pre-wrap px-3 pt-1 pb-16 pr-9" }, sections.map((section, index) => {
     const currentNavItem = flatNavigation[currentStepIndex];
     const isSectionContextActive = currentNavItem && currentNavItem.sectionIndex === index;
     const activeMentionIndex = isSectionContextActive && currentNavItem.type === "mention" ? currentNavItem.mentionIndex : -1;
@@ -4578,7 +4641,18 @@ function DescriptionDisplay({
     if (index === 0) leadingSpace = "";
     const isRef = bodyText.trim().match(/^\[\[REF:(node|ancestry):([a-zA-Z0-9\-_]+):([a-zA-Z0-9\-_]+)\]\]$/);
     return /* @__PURE__ */ React6.createElement(React6.Fragment, { key: index }, /* @__PURE__ */ React6.createElement("span", null, leadingSpace), isRef ? renderReferenceSection(bodyText, index, isSectionContextActive, setRef) : renderMixedContent(bodyText, index, isSectionContextActive, activeMentionIndex, setRef), /* @__PURE__ */ React6.createElement("span", null, trailingSpace));
-  }));
+  })), hasUnsavedChanges && onSaveDescription && /* @__PURE__ */ React6.createElement("div", { className: "absolute bottom-4 left-1/2 -translate-x-1/2 z-[100] animate-in slide-in-from-bottom-4 fade-in duration-300" }, /* @__PURE__ */ React6.createElement(
+    "button",
+    {
+      onClick: (e) => {
+        e.stopPropagation();
+        onSaveDescription(localDescription);
+      },
+      className: "flex items-center gap-2 px-5 py-2.5 bg-emerald-600 hover:bg-emerald-500 text-white rounded-full shadow-[0_8px_20px_rgba(5,150,105,0.4)] font-semibold text-sm transition-all hover:scale-105 active:scale-95 border border-emerald-400/30"
+    },
+    /* @__PURE__ */ React6.createElement(FiSave, { size: 16 }),
+    " Salvar Checklist"
+  )));
 }
 
 // src/components/DescriptionReadModePanel.jsx
@@ -4682,7 +4756,8 @@ function DescriptionReadModePanel({
   userRole,
   abstractionTree = null,
   onRenderAbstractionTree = null,
-  initialShowAbstraction = false
+  initialShowAbstraction = false,
+  onSaveDescription
 }) {
   const [showProperties, setShowProperties] = useState8(false);
   const [showAbstraction, setShowAbstraction] = useState8(false);
@@ -4900,7 +4975,8 @@ function DescriptionReadModePanel({
         onHighlightNode,
         initialSectionId,
         currentBranchDirection,
-        onImageClick
+        onImageClick,
+        onSaveDescription
       }
     )),
     leftAction && !showAbstraction && !showProperties && /* @__PURE__ */ React7.createElement(
@@ -7698,6 +7774,11 @@ function NodeDetailsPanel({
       textureImageUrl: url
     });
   };
+  const handleSaveDescriptionInline = (newDescription) => {
+    setDescription(newDescription);
+    onDataUpdate({ ...node, description: newDescription });
+    triggerAutoSave({ description: newDescription });
+  };
   const handleSave = async (keepOpen = false, overrides = {}) => {
     const currentName = overrides.name !== void 0 ? overrides.name : name;
     const currentTypes = overrides.types !== void 0 ? overrides.types : types;
@@ -7792,7 +7873,8 @@ function NodeDetailsPanel({
         availableAncestries,
         onOpenReference,
         onMentionClick,
-        onImageClick: handleImageClickFromText
+        onImageClick: handleImageClickFromText,
+        onSaveDescription: handleSaveDescriptionInline
       }
     ) : /* @__PURE__ */ React15.createElement(React15.Fragment, null, /* @__PURE__ */ React15.createElement("div", { className: "h-[2px] bg-gradient-to-r from-indigo-400/0 via-indigo-400/70 to-indigo-400/0" }), /* @__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("span", { className: "inline-flex h-2.5 w-2.5 rounded-full bg-indigo-400/80 shadow-[0_0_18px_2px_rgba(99,102,241,0.55)]" }), /* @__PURE__ */ React15.createElement("p", { className: "text-xs/relaxed text-slate-300" }, "Detalhes do Node"), /* @__PURE__ */ React15.createElement(
       "button",
@@ -7860,7 +7942,8 @@ function NodeDetailsPanel({
         availableAncestries,
         onOpenReference,
         onMentionClick,
-        onImageClick: handleImageClickFromText
+        onImageClick: handleImageClickFromText,
+        onSaveDescription: handleSaveDescriptionInline
       }
     ), /* @__PURE__ */ React15.createElement("div", { className: "absolute top-0 right-0 flex bg-slate-900/50 rounded-bl-lg backdrop-blur-sm opacity-0 group-hover:opacity-100 focus-within:opacity-100 transition-opacity overflow-hidden border-b border-l border-white/5" }, /* @__PURE__ */ React15.createElement(
       "button",

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@lv-x-software-house/x_view",
-    "version": "1.2.2-dev.14",
+    "version": "1.2.2-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",