@lv-x-software-house/x_view 1.2.6-dev.15 → 1.2.6-dev.17

package/dist/index.js

@@ -13287,9 +13287,10 @@ var BoardItem = ({
   index,
   onUpdate,
   onDelete,
-  onAddSubgroup,
   onIndent,
   onOutdent,
+  onMoveUp,
+  onMoveDown,
   searchItems,
   onMentionClick,
   onEnterFolder,
@@ -13298,6 +13299,8 @@ var BoardItem = ({
   var _a;
   const isFolder = item.type === "folder";
   const canIndent = index > 0;
+  const canMoveUp = index > 0;
+  const isFirstItem = index === 0;
   const handleContentChange = (content) => {
     onUpdate(item.id, { ...item, content });
   };
@@ -13323,7 +13326,53 @@ var BoardItem = ({
           placeholder: "Nome da pasta..."
         }
       ) : /* @__PURE__ */ import_react29.default.createElement("span", { className: "text-sm font-medium text-slate-200" }, item.name), /* @__PURE__ */ import_react29.default.createElement("div", { className: "flex items-center gap-2 mt-0.5" }, /* @__PURE__ */ import_react29.default.createElement("span", { className: "text-[10px] text-slate-500 uppercase tracking-wider font-semibold" }, ((_a = item.children) == null ? void 0 : _a.length) || 0, " itens"))),
-      /* @__PURE__ */ import_react29.default.createElement("div", { className: "flex items-center gap-2 opacity-0 group-hover/folder:opacity-100 transition-opacity" }, canEdit && /* @__PURE__ */ import_react29.default.createElement(
+      /* @__PURE__ */ import_react29.default.createElement("div", { className: "flex items-center gap-1.5 opacity-0 group-item/item:opacity-100 group-hover/folder:opacity-100 transition-opacity" }, canEdit && /* @__PURE__ */ import_react29.default.createElement("div", { className: "flex items-center gap-0.5 bg-slate-900/80 backdrop-blur-sm p-1 rounded-lg border border-white/5 shadow-xl" }, /* @__PURE__ */ import_react29.default.createElement(
+        "button",
+        {
+          onClick: (e) => {
+            e.stopPropagation();
+            onMoveUp(item.id);
+          },
+          disabled: !canMoveUp,
+          className: `p-1.5 rounded transition-colors ${!canMoveUp ? "text-slate-800 cursor-not-allowed" : "text-slate-400 hover:text-white hover:bg-white/10"}`,
+          title: "Subir"
+        },
+        /* @__PURE__ */ import_react29.default.createElement(import_fi23.FiArrowUp, { size: 14 })
+      ), /* @__PURE__ */ import_react29.default.createElement(
+        "button",
+        {
+          onClick: (e) => {
+            e.stopPropagation();
+            onMoveDown(item.id);
+          },
+          className: "p-1.5 text-slate-400 hover:text-white hover:bg-white/10 rounded transition-colors",
+          title: "Descer"
+        },
+        /* @__PURE__ */ import_react29.default.createElement(import_fi23.FiArrowDown, { size: 14 })
+      ), /* @__PURE__ */ import_react29.default.createElement("div", { className: "w-px h-3 bg-white/10 mx-0.5" }), /* @__PURE__ */ import_react29.default.createElement(
+        "button",
+        {
+          onClick: (e) => {
+            e.stopPropagation();
+            onIndent(item.id);
+          },
+          disabled: !canIndent,
+          className: `p-1.5 rounded transition-colors ${!canIndent ? "text-slate-800 cursor-not-allowed" : "text-slate-400 hover:text-white hover:bg-white/10"}`,
+          title: "Aninhar"
+        },
+        /* @__PURE__ */ import_react29.default.createElement(import_fi23.FiArrowRight, { size: 14 })
+      ), /* @__PURE__ */ import_react29.default.createElement(
+        "button",
+        {
+          onClick: (e) => {
+            e.stopPropagation();
+            onOutdent(item.id);
+          },
+          className: "p-1.5 text-slate-400 hover:text-white hover:bg-white/10 rounded transition-colors",
+          title: "Desaninhar"
+        },
+        /* @__PURE__ */ import_react29.default.createElement(import_fi23.FiArrowLeft, { size: 14 })
+      ), /* @__PURE__ */ import_react29.default.createElement("div", { className: "w-px h-3 bg-white/10 mx-0.5" }), /* @__PURE__ */ import_react29.default.createElement(
         "button",
         {
           onClick: (e) => {
@@ -13333,8 +13382,8 @@ var BoardItem = ({
           className: "p-1.5 text-slate-500 hover:text-red-400 hover:bg-red-500/10 rounded transition-colors",
           title: "Remover Pasta"
         },
-        /* @__PURE__ */ import_react29.default.createElement(import_fi23.FiTrash2, { size: 14 })
-      ), /* @__PURE__ */ import_react29.default.createElement(import_fi23.FiChevronRight, { className: "text-slate-500 group-hover/folder:translate-x-1 transition-transform" }))
+        /* @__PURE__ */ import_react29.default.createElement(FiTrash2, { size: 14 })
+      )), /* @__PURE__ */ import_react29.default.createElement(import_fi23.FiChevronRight, { className: "text-slate-500 group-hover/folder:translate-x-1 transition-transform" }))
     ));
   }
   return /* @__PURE__ */ import_react29.default.createElement("div", { className: "flex flex-col gap-2 mb-3 pl-3 border-l border-white/10 relative group/item animate-in fade-in slide-in-from-left-2 duration-300" }, /* @__PURE__ */ import_react29.default.createElement("div", { className: "absolute -left-[1px] top-4 w-2 h-px bg-white/20" }), /* @__PURE__ */ import_react29.default.createElement("div", { className: "flex flex-col gap-2 py-2 px-3 transition-all duration-200 hover:bg-white/5 border-l-2 border-transparent hover:border-white/20" }, /* @__PURE__ */ import_react29.default.createElement(
@@ -13357,6 +13406,23 @@ var BoardItem = ({
     /* @__PURE__ */ import_react29.default.createElement(import_fi23.FiPlus, { size: 12 }),
     /* @__PURE__ */ import_react29.default.createElement("span", null, "Subgrupo")
   )), /* @__PURE__ */ import_react29.default.createElement("div", { className: "flex items-center gap-1" }, /* @__PURE__ */ import_react29.default.createElement(
+    "button",
+    {
+      onClick: () => onMoveUp(item.id),
+      disabled: !canMoveUp,
+      className: `p-1.5 rounded transition-colors ${!canMoveUp ? "text-slate-800 cursor-not-allowed" : "text-slate-500 hover:text-white hover:bg-white/10"}`,
+      title: "Subir"
+    },
+    /* @__PURE__ */ import_react29.default.createElement(import_fi23.FiArrowUp, { size: 14 })
+  ), /* @__PURE__ */ import_react29.default.createElement(
+    "button",
+    {
+      onClick: () => onMoveDown(item.id),
+      className: "p-1.5 text-slate-500 hover:text-white hover:bg-white/10 rounded transition-colors",
+      title: "Descer"
+    },
+    /* @__PURE__ */ import_react29.default.createElement(import_fi23.FiArrowDown, { size: 14 })
+  ), /* @__PURE__ */ import_react29.default.createElement("div", { className: "w-px h-3 bg-white/10 mx-1" }), /* @__PURE__ */ import_react29.default.createElement(
     "button",
     {
       onClick: () => onIndent(item.id),
@@ -13380,7 +13446,7 @@ var BoardItem = ({
       className: "p-1.5 text-slate-600 hover:text-red-400 hover:bg-red-500/10 rounded transition-colors",
       title: "Remover Grupo"
     },
-    /* @__PURE__ */ import_react29.default.createElement(import_fi23.FiTrash2, { size: 14 })
+    /* @__PURE__ */ import_react29.default.createElement(FiTrash2, { size: 14 })
   )))), item.children && item.children.length > 0 && /* @__PURE__ */ import_react29.default.createElement("div", { className: "ml-2" }, item.children.map((child, idx) => /* @__PURE__ */ import_react29.default.createElement(
     BoardItem,
     {
@@ -13392,6 +13458,8 @@ var BoardItem = ({
       onAddSubgroup,
       onIndent,
       onOutdent,
+      onMoveUp,
+      onMoveDown,
       searchItems,
       onMentionClick,
       onEnterFolder,
@@ -13475,6 +13543,18 @@ function AncestryBoard({
     }, 3e3);
     return () => clearTimeout(id);
   }, [groups, isLoaded, onSave]);
+  const triggerInstantSave = async (updatedGroups) => {
+    if (!onSave) return;
+    setSaveStatus("saving");
+    try {
+      await onSave(sanitizeGroups(updatedGroups));
+      setSaveStatus("saved");
+      setTimeout(() => setSaveStatus("idle"), 3e3);
+    } catch (err) {
+      console.error("Erro ao salvar board:", err);
+      setSaveStatus("error");
+    }
+  };
   (0, import_react29.useEffect)(() => {
     if (!isOpen) return;
     const handler = (e) => {
@@ -13524,11 +13604,11 @@ function AncestryBoard({
       children: []
     };
     if (navigationStack.length === 0) {
-      setGroups((prev) => [newItem, ...prev]);
+      setGroups((prev) => [...prev, newItem]);
     } else {
       const parentId = navigationStack[navigationStack.length - 1];
       const add = (list) => list.map(
-        (g) => g.id === parentId ? { ...g, children: [newItem, ...g.children] } : { ...g, children: add(g.children) }
+        (g) => g.id === parentId ? { ...g, children: [...g.children, newItem] } : { ...g, children: add(g.children) }
       );
       setGroups((prev) => add(prev));
     }
@@ -13544,7 +13624,7 @@ function AncestryBoard({
           content: [],
           children: []
         };
-        return { ...g, children: [newItem, ...g.children] };
+        return { ...g, children: [...g.children, newItem] };
       }
       return { ...g, children: add(g.children) };
     });
@@ -13583,6 +13663,7 @@ function AncestryBoard({
       }
       siblings.splice(index, 1);
       targetParent.children.push(group);
+      triggerInstantSave(next);
       return next;
     });
   };
@@ -13599,6 +13680,33 @@ function AncestryBoard({
       } else {
         next.push(group);
       }
+      triggerInstantSave(next);
+      return next;
+    });
+  };
+  const handleMoveUp = (id) => {
+    setGroups((prev) => {
+      const next = JSON.parse(JSON.stringify(prev));
+      const found = findGroupAndParent(next, id);
+      if (!found || found.index === 0) return prev;
+      const { siblings, index } = found;
+      const item = siblings[index];
+      siblings.splice(index, 1);
+      siblings.splice(index - 1, 0, item);
+      triggerInstantSave(next);
+      return next;
+    });
+  };
+  const handleMoveDown = (id) => {
+    setGroups((prev) => {
+      const next = JSON.parse(JSON.stringify(prev));
+      const found = findGroupAndParent(next, id);
+      if (!found || found.index === found.siblings.length - 1) return prev;
+      const { siblings, index } = found;
+      const item = siblings[index];
+      siblings.splice(index, 1);
+      siblings.splice(index + 1, 0, item);
+      triggerInstantSave(next);
       return next;
     });
   };
@@ -13676,6 +13784,8 @@ function AncestryBoard({
           onAddSubgroup: handleAddSubgroup,
           onIndent: handleIndent,
           onOutdent: handleOutdent,
+          onMoveUp: handleMoveUp,
+          onMoveDown: handleMoveDown,
           searchItems: allSearchableItems,
           onMentionClick: handleMentionClick,
           onEnterFolder: navigateTo,

package/dist/index.mjs

@@ -4387,7 +4387,7 @@ import { v4 as uuidv43 } from "uuid";
 
 // src/components/CustomPropertyDisplay.jsx
 import React3, { useState as useState4, useRef as useRef3, useEffect as useEffect3 } from "react";
-import { FiCheck, FiX, FiEdit3, FiTrash2, FiExternalLink, FiFileText, FiChevronDown, FiUpload, FiLoader } from "react-icons/fi";
+import { FiCheck, FiX, FiEdit3, FiTrash2 as FiTrash22, FiExternalLink, FiFileText, FiChevronDown, FiUpload, FiLoader } from "react-icons/fi";
 function CustomPropertyDisplay({
   prop,
   onUpdate,
@@ -4744,7 +4744,7 @@ function CustomPropertyDisplay({
       onMouseLeave: () => setIsHovered(false)
     },
     isEditing ? renderEditView() : renderDisplayView(),
-    !isEditing && !readOnly && /* @__PURE__ */ React3.createElement("div", { className: `absolute top-2 right-2 flex items-center gap-1 transition-opacity ${isHovered ? "opacity-100" : "opacity-0"}` }, /* @__PURE__ */ React3.createElement("button", { onClick: () => setIsEditing(true), className: "w-7 h-7 grid place-items-center rounded-lg bg-slate-700/80 hover:bg-slate-600/80 text-slate-200 transition-colors", title: "Editar" }, /* @__PURE__ */ React3.createElement(FiEdit3, { size: 14 })), /* @__PURE__ */ React3.createElement("button", { onClick: onRemove, className: "w-7 h-7 grid place-items-center rounded-lg bg-red-700/80 hover:bg-red-600/80 text-slate-200 transition-colors", title: "Remover" }, /* @__PURE__ */ React3.createElement(FiTrash2, { size: 14 })))
+    !isEditing && !readOnly && /* @__PURE__ */ React3.createElement("div", { className: `absolute top-2 right-2 flex items-center gap-1 transition-opacity ${isHovered ? "opacity-100" : "opacity-0"}` }, /* @__PURE__ */ React3.createElement("button", { onClick: () => setIsEditing(true), className: "w-7 h-7 grid place-items-center rounded-lg bg-slate-700/80 hover:bg-slate-600/80 text-slate-200 transition-colors", title: "Editar" }, /* @__PURE__ */ React3.createElement(FiEdit3, { size: 14 })), /* @__PURE__ */ React3.createElement("button", { onClick: onRemove, className: "w-7 h-7 grid place-items-center rounded-lg bg-red-700/80 hover:bg-red-600/80 text-slate-200 transition-colors", title: "Remover" }, /* @__PURE__ */ React3.createElement(FiTrash22, { size: 14 })))
   );
 }
 
@@ -6644,7 +6644,7 @@ import {
   FiPlus as FiPlus2,
   FiLock as FiLock2,
   FiLink as FiLink4,
-  FiTrash2 as FiTrash22
+  FiTrash2 as FiTrash23
 } from "react-icons/fi";
 import { v4 as uuidv44 } from "uuid";
 
@@ -8083,7 +8083,7 @@ function CreateAncestryPanel({
         className: "flex items-center gap-1.5 text-xs text-rose-400/80 hover:text-white hover:bg-rose-500/20 px-2 py-1 rounded transition-colors",
         title: "Excluir permanentemente esta ramifica\xE7\xE3o e seu conte\xFAdo"
       },
-      /* @__PURE__ */ React10.createElement(FiTrash22, null),
+      /* @__PURE__ */ React10.createElement(FiTrash23, null),
       " Excluir Ramifica\xE7\xE3o"
     ))), /* @__PURE__ */ React10.createElement("div", { className: "px-6 pb-4 pt-2 overflow-y-auto flex-grow custom-scrollbar" }, branchStack.length > 0 && /* @__PURE__ */ React10.createElement("div", { className: "mb-4" }, isContextLinked ? /* @__PURE__ */ React10.createElement("div", { className: "p-3 rounded-lg bg-indigo-500/10 border border-indigo-500/30 flex items-center justify-between" }, /* @__PURE__ */ React10.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React10.createElement("div", { className: "w-8 h-8 rounded bg-indigo-500/20 text-indigo-300 grid place-content-center" }, /* @__PURE__ */ React10.createElement(FiLayers5, null)), /* @__PURE__ */ React10.createElement("div", null, /* @__PURE__ */ React10.createElement("div", { className: "text-xs text-indigo-200 font-semibold uppercase tracking-wider" }, "Ancestralidade Vinculada"), /* @__PURE__ */ React10.createElement("div", { className: "text-sm text-white font-medium truncate max-w-[200px]" }, currentContext.name.replace("[REF] ", "")))), /* @__PURE__ */ React10.createElement(
       "button",
@@ -12957,9 +12957,10 @@ import {
   FiCornerUpRight as FiCornerUpRight4,
   FiPlay,
   FiPlus as FiPlus10,
-  FiTrash2 as FiTrash23,
   FiArrowLeft as FiArrowLeft3,
   FiArrowRight as FiArrowRight2,
+  FiArrowUp,
+  FiArrowDown,
   FiCheckCircle,
   FiLoader as FiLoader5,
   FiX as FiX8,
@@ -13335,9 +13336,10 @@ var BoardItem = ({
   index,
   onUpdate,
   onDelete,
-  onAddSubgroup,
   onIndent,
   onOutdent,
+  onMoveUp,
+  onMoveDown,
   searchItems,
   onMentionClick,
   onEnterFolder,
@@ -13346,6 +13348,8 @@ var BoardItem = ({
   var _a;
   const isFolder = item.type === "folder";
   const canIndent = index > 0;
+  const canMoveUp = index > 0;
+  const isFirstItem = index === 0;
   const handleContentChange = (content) => {
     onUpdate(item.id, { ...item, content });
   };
@@ -13371,7 +13375,53 @@ var BoardItem = ({
           placeholder: "Nome da pasta..."
         }
       ) : /* @__PURE__ */ React28.createElement("span", { className: "text-sm font-medium text-slate-200" }, item.name), /* @__PURE__ */ React28.createElement("div", { className: "flex items-center gap-2 mt-0.5" }, /* @__PURE__ */ React28.createElement("span", { className: "text-[10px] text-slate-500 uppercase tracking-wider font-semibold" }, ((_a = item.children) == null ? void 0 : _a.length) || 0, " itens"))),
-      /* @__PURE__ */ React28.createElement("div", { className: "flex items-center gap-2 opacity-0 group-hover/folder:opacity-100 transition-opacity" }, canEdit && /* @__PURE__ */ React28.createElement(
+      /* @__PURE__ */ React28.createElement("div", { className: "flex items-center gap-1.5 opacity-0 group-item/item:opacity-100 group-hover/folder:opacity-100 transition-opacity" }, canEdit && /* @__PURE__ */ React28.createElement("div", { className: "flex items-center gap-0.5 bg-slate-900/80 backdrop-blur-sm p-1 rounded-lg border border-white/5 shadow-xl" }, /* @__PURE__ */ React28.createElement(
+        "button",
+        {
+          onClick: (e) => {
+            e.stopPropagation();
+            onMoveUp(item.id);
+          },
+          disabled: !canMoveUp,
+          className: `p-1.5 rounded transition-colors ${!canMoveUp ? "text-slate-800 cursor-not-allowed" : "text-slate-400 hover:text-white hover:bg-white/10"}`,
+          title: "Subir"
+        },
+        /* @__PURE__ */ React28.createElement(FiArrowUp, { size: 14 })
+      ), /* @__PURE__ */ React28.createElement(
+        "button",
+        {
+          onClick: (e) => {
+            e.stopPropagation();
+            onMoveDown(item.id);
+          },
+          className: "p-1.5 text-slate-400 hover:text-white hover:bg-white/10 rounded transition-colors",
+          title: "Descer"
+        },
+        /* @__PURE__ */ React28.createElement(FiArrowDown, { size: 14 })
+      ), /* @__PURE__ */ React28.createElement("div", { className: "w-px h-3 bg-white/10 mx-0.5" }), /* @__PURE__ */ React28.createElement(
+        "button",
+        {
+          onClick: (e) => {
+            e.stopPropagation();
+            onIndent(item.id);
+          },
+          disabled: !canIndent,
+          className: `p-1.5 rounded transition-colors ${!canIndent ? "text-slate-800 cursor-not-allowed" : "text-slate-400 hover:text-white hover:bg-white/10"}`,
+          title: "Aninhar"
+        },
+        /* @__PURE__ */ React28.createElement(FiArrowRight2, { size: 14 })
+      ), /* @__PURE__ */ React28.createElement(
+        "button",
+        {
+          onClick: (e) => {
+            e.stopPropagation();
+            onOutdent(item.id);
+          },
+          className: "p-1.5 text-slate-400 hover:text-white hover:bg-white/10 rounded transition-colors",
+          title: "Desaninhar"
+        },
+        /* @__PURE__ */ React28.createElement(FiArrowLeft3, { size: 14 })
+      ), /* @__PURE__ */ React28.createElement("div", { className: "w-px h-3 bg-white/10 mx-0.5" }), /* @__PURE__ */ React28.createElement(
         "button",
         {
           onClick: (e) => {
@@ -13381,8 +13431,8 @@ var BoardItem = ({
           className: "p-1.5 text-slate-500 hover:text-red-400 hover:bg-red-500/10 rounded transition-colors",
           title: "Remover Pasta"
         },
-        /* @__PURE__ */ React28.createElement(FiTrash23, { size: 14 })
-      ), /* @__PURE__ */ React28.createElement(FiChevronRight7, { className: "text-slate-500 group-hover/folder:translate-x-1 transition-transform" }))
+        /* @__PURE__ */ React28.createElement(FiTrash2, { size: 14 })
+      )), /* @__PURE__ */ React28.createElement(FiChevronRight7, { className: "text-slate-500 group-hover/folder:translate-x-1 transition-transform" }))
     ));
   }
   return /* @__PURE__ */ React28.createElement("div", { className: "flex flex-col gap-2 mb-3 pl-3 border-l border-white/10 relative group/item animate-in fade-in slide-in-from-left-2 duration-300" }, /* @__PURE__ */ React28.createElement("div", { className: "absolute -left-[1px] top-4 w-2 h-px bg-white/20" }), /* @__PURE__ */ React28.createElement("div", { className: "flex flex-col gap-2 py-2 px-3 transition-all duration-200 hover:bg-white/5 border-l-2 border-transparent hover:border-white/20" }, /* @__PURE__ */ React28.createElement(
@@ -13405,6 +13455,23 @@ var BoardItem = ({
     /* @__PURE__ */ React28.createElement(FiPlus10, { size: 12 }),
     /* @__PURE__ */ React28.createElement("span", null, "Subgrupo")
   )), /* @__PURE__ */ React28.createElement("div", { className: "flex items-center gap-1" }, /* @__PURE__ */ React28.createElement(
+    "button",
+    {
+      onClick: () => onMoveUp(item.id),
+      disabled: !canMoveUp,
+      className: `p-1.5 rounded transition-colors ${!canMoveUp ? "text-slate-800 cursor-not-allowed" : "text-slate-500 hover:text-white hover:bg-white/10"}`,
+      title: "Subir"
+    },
+    /* @__PURE__ */ React28.createElement(FiArrowUp, { size: 14 })
+  ), /* @__PURE__ */ React28.createElement(
+    "button",
+    {
+      onClick: () => onMoveDown(item.id),
+      className: "p-1.5 text-slate-500 hover:text-white hover:bg-white/10 rounded transition-colors",
+      title: "Descer"
+    },
+    /* @__PURE__ */ React28.createElement(FiArrowDown, { size: 14 })
+  ), /* @__PURE__ */ React28.createElement("div", { className: "w-px h-3 bg-white/10 mx-1" }), /* @__PURE__ */ React28.createElement(
     "button",
     {
       onClick: () => onIndent(item.id),
@@ -13428,7 +13495,7 @@ var BoardItem = ({
       className: "p-1.5 text-slate-600 hover:text-red-400 hover:bg-red-500/10 rounded transition-colors",
       title: "Remover Grupo"
     },
-    /* @__PURE__ */ React28.createElement(FiTrash23, { size: 14 })
+    /* @__PURE__ */ React28.createElement(FiTrash2, { size: 14 })
   )))), item.children && item.children.length > 0 && /* @__PURE__ */ React28.createElement("div", { className: "ml-2" }, item.children.map((child, idx) => /* @__PURE__ */ React28.createElement(
     BoardItem,
     {
@@ -13440,6 +13507,8 @@ var BoardItem = ({
       onAddSubgroup,
       onIndent,
       onOutdent,
+      onMoveUp,
+      onMoveDown,
       searchItems,
       onMentionClick,
       onEnterFolder,
@@ -13523,6 +13592,18 @@ function AncestryBoard({
     }, 3e3);
     return () => clearTimeout(id);
   }, [groups, isLoaded, onSave]);
+  const triggerInstantSave = async (updatedGroups) => {
+    if (!onSave) return;
+    setSaveStatus("saving");
+    try {
+      await onSave(sanitizeGroups(updatedGroups));
+      setSaveStatus("saved");
+      setTimeout(() => setSaveStatus("idle"), 3e3);
+    } catch (err) {
+      console.error("Erro ao salvar board:", err);
+      setSaveStatus("error");
+    }
+  };
   useEffect23(() => {
     if (!isOpen) return;
     const handler = (e) => {
@@ -13572,11 +13653,11 @@ function AncestryBoard({
       children: []
     };
     if (navigationStack.length === 0) {
-      setGroups((prev) => [newItem, ...prev]);
+      setGroups((prev) => [...prev, newItem]);
     } else {
       const parentId = navigationStack[navigationStack.length - 1];
       const add = (list) => list.map(
-        (g) => g.id === parentId ? { ...g, children: [newItem, ...g.children] } : { ...g, children: add(g.children) }
+        (g) => g.id === parentId ? { ...g, children: [...g.children, newItem] } : { ...g, children: add(g.children) }
       );
       setGroups((prev) => add(prev));
     }
@@ -13592,7 +13673,7 @@ function AncestryBoard({
           content: [],
           children: []
         };
-        return { ...g, children: [newItem, ...g.children] };
+        return { ...g, children: [...g.children, newItem] };
       }
       return { ...g, children: add(g.children) };
     });
@@ -13631,6 +13712,7 @@ function AncestryBoard({
       }
       siblings.splice(index, 1);
       targetParent.children.push(group);
+      triggerInstantSave(next);
       return next;
     });
   };
@@ -13647,6 +13729,33 @@ function AncestryBoard({
       } else {
         next.push(group);
       }
+      triggerInstantSave(next);
+      return next;
+    });
+  };
+  const handleMoveUp = (id) => {
+    setGroups((prev) => {
+      const next = JSON.parse(JSON.stringify(prev));
+      const found = findGroupAndParent(next, id);
+      if (!found || found.index === 0) return prev;
+      const { siblings, index } = found;
+      const item = siblings[index];
+      siblings.splice(index, 1);
+      siblings.splice(index - 1, 0, item);
+      triggerInstantSave(next);
+      return next;
+    });
+  };
+  const handleMoveDown = (id) => {
+    setGroups((prev) => {
+      const next = JSON.parse(JSON.stringify(prev));
+      const found = findGroupAndParent(next, id);
+      if (!found || found.index === found.siblings.length - 1) return prev;
+      const { siblings, index } = found;
+      const item = siblings[index];
+      siblings.splice(index, 1);
+      siblings.splice(index + 1, 0, item);
+      triggerInstantSave(next);
       return next;
     });
   };
@@ -13724,6 +13833,8 @@ function AncestryBoard({
           onAddSubgroup: handleAddSubgroup,
           onIndent: handleIndent,
           onOutdent: handleOutdent,
+          onMoveUp: handleMoveUp,
+          onMoveDown: handleMoveDown,
           searchItems: allSearchableItems,
           onMentionClick: handleMentionClick,
           onEnterFolder: navigateTo,

package/package.json

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