@lv-x-software-house/x_view 1.2.6-dev.16 → 1.2.6-dev.18

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) => {
@@ -13334,7 +13383,7 @@ var BoardItem = ({
           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(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),
@@ -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) => {
@@ -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

@@ -12960,6 +12960,8 @@ import {
   FiTrash2 as FiTrash23,
   FiArrowLeft as FiArrowLeft3,
   FiArrowRight as FiArrowRight2,
+  FiArrowUp,
+  FiArrowDown,
   FiCheckCircle,
   FiLoader as FiLoader5,
   FiX as FiX8,
@@ -13335,9 +13337,10 @@ var BoardItem = ({
   index,
   onUpdate,
   onDelete,
-  onAddSubgroup,
   onIndent,
   onOutdent,
+  onMoveUp,
+  onMoveDown,
   searchItems,
   onMentionClick,
   onEnterFolder,
@@ -13346,6 +13349,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 +13376,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) => {
@@ -13382,7 +13433,7 @@ var BoardItem = ({
           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(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 +13456,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),
@@ -13440,6 +13508,8 @@ var BoardItem = ({
       onAddSubgroup,
       onIndent,
       onOutdent,
+      onMoveUp,
+      onMoveDown,
       searchItems,
       onMentionClick,
       onEnterFolder,
@@ -13523,6 +13593,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) => {
@@ -13631,6 +13713,7 @@ function AncestryBoard({
       }
       siblings.splice(index, 1);
       targetParent.children.push(group);
+      triggerInstantSave(next);
       return next;
     });
   };
@@ -13647,6 +13730,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 +13834,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.16",
+  "version": "1.2.6-dev.18",
   "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",