agentic-ui-libs 1.0.0-beta.12 → 1.0.0-beta.13

package/dist/features/md-editor/components/SlashMenu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SlashMenu.d.ts","sourceRoot":"","sources":["../../../../src/features/md-editor/components/SlashMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoF,MAAM,OAAO,CAAC;AACzG,OAAO,KAAK,EAKV,cAAc,EACf,MAAM,UAAU,CAAC;AAwJlB,MAAM,WAAW,YAAY;IAC3B,SAAS,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,OAAO,CAAC;CAC9C;AAED,UAAU,sBAAuB,SAAQ,cAAc;IACrD,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,KAAK,CAAC,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,EAAE,EAAE,MAAM,CAAA;KAAE,CAAC;IACrC,gBAAgB,CAAC,EAAE,MAAM,EAAE,CAAC;CAC7B;AAED,eAAO,MAAM,SAAS,6FAkmBrB,CAAC"}
+{"version":3,"file":"SlashMenu.d.ts","sourceRoot":"","sources":["../../../../src/features/md-editor/components/SlashMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoF,MAAM,OAAO,CAAC;AACzG,OAAO,KAAK,EAKV,cAAc,EACf,MAAM,UAAU,CAAC;AAwJlB,MAAM,WAAW,YAAY;IAC3B,SAAS,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,OAAO,CAAC;CAC9C;AAED,UAAU,sBAAuB,SAAQ,cAAc;IACrD,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,KAAK,CAAC,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,EAAE,EAAE,MAAM,CAAA;KAAE,CAAC;IACrC,gBAAgB,CAAC,EAAE,MAAM,EAAE,CAAC;CAC7B;AAED,eAAO,MAAM,SAAS,6FAypBrB,CAAC"}

package/dist/index.js

@@ -69158,6 +69158,7 @@ const SlashMenu = forwardRef(
     const [activeCategory, setActiveCategory] = useState(null);
     const [selectedIndex, setSelectedIndex] = useState(0);
     const [subcategorySearch, setSubcategorySearch] = useState("");
+    const [nestedPath, setNestedPath] = useState([]);
     const menuRef = useRef(null);
     const blockItemsRef = useRef(null);
     const categoryListRef = useRef(null);
@@ -69261,6 +69262,12 @@ const SlashMenu = forwardRef(
           items = contentVariables;
           break;
       }
+      if (nestedPath.length > 0) {
+        const lastInPath = nestedPath[nestedPath.length - 1];
+        if (lastInPath.children && lastInPath.children.length > 0) {
+          items = lastInPath.children;
+        }
+      }
       const searchTerm = subcategorySearch.toLowerCase();
       if (searchTerm) {
         items = items.filter((item) => {
@@ -69277,7 +69284,7 @@ const SlashMenu = forwardRef(
         });
       }
       return items;
-    }, [activeCategory, subcategorySearch, agents2, tools2, knowledge2, envVariables2, memoryVariables, systemVariables2, contentVariables, allCategories]);
+    }, [activeCategory, subcategorySearch, nestedPath, agents2, tools2, knowledge2, envVariables2, memoryVariables, systemVariables2, contentVariables, allCategories]);
     const currentItems = getCurrentItems();
     const getAllNavigableItems = useCallback(() => {
       if (activeCategory) {
@@ -69299,7 +69306,7 @@ const SlashMenu = forwardRef(
     const navigableItems = getAllNavigableItems();
     useEffect(() => {
       setSelectedIndex(0);
-    }, [navigableItems.length, activeCategory, query, subcategorySearch]);
+    }, [navigableItems.length, activeCategory, query, subcategorySearch, nestedPath.length]);
     useEffect(() => {
       const itemElement = itemRefs.current.get(selectedIndex);
       if (itemElement) {
@@ -69352,6 +69359,11 @@ const SlashMenu = forwardRef(
           return true;
         }
         if (event.key === "Escape") {
+          if (nestedPath.length > 0) {
+            setNestedPath((prev) => prev.slice(0, -1));
+            setSubcategorySearch("");
+            return true;
+          }
           if (activeCategory) {
             setActiveCategory(null);
             setSubcategorySearch("");
@@ -69359,14 +69371,19 @@ const SlashMenu = forwardRef(
           }
           return false;
         }
-        if (event.key === "Backspace" && !query && !subcategorySearch && activeCategory) {
-          setActiveCategory(null);
-          setSubcategorySearch("");
-          return true;
+        if (event.key === "Backspace" && !query && !subcategorySearch) {
+          if (nestedPath.length > 0) {
+            setNestedPath((prev) => prev.slice(0, -1));
+            return true;
+          }
+          if (activeCategory) {
+            setActiveCategory(null);
+            return true;
+          }
         }
         return false;
       },
-      [navigableItems, selectedIndex, activeCategory, query, findNextEnabledIndex]
+      [navigableItems, selectedIndex, activeCategory, query, nestedPath, findNextEnabledIndex]
     );
     useImperativeHandle(ref, () => ({
       onKeyDown
@@ -69384,6 +69401,7 @@ const SlashMenu = forwardRef(
         setActiveCategory(item.id);
         setSelectedIndex(0);
         setSubcategorySearch("");
+        setNestedPath([]);
         return;
       }
       if ("action" in item && typeof item.action === "function") {
@@ -69410,12 +69428,24 @@ const SlashMenu = forwardRef(
       }
       if ("path" in item && "type" in item) {
         const variable = item;
+        if (variable.children && variable.children.length > 0) {
+          setNestedPath((prev) => [...prev, variable]);
+          setSelectedIndex(0);
+          setSubcategorySearch("");
+          return;
+        }
         deleteSlashTrigger();
+        let fullPath = variable.path;
+        if (nestedPath.length > 0) {
+          const pathParts = nestedPath.map((v) => v.name);
+          pathParts.push(variable.name);
+          fullPath = pathParts.join(".");
+        }
         editor.chain().focus().insertContent({
           type: "variableChip",
           attrs: {
             variableType: variable.type,
-            path: variable.path,
+            path: fullPath,
             displayName: variable.name
           }
         }).insertContent(" ").run();
@@ -69424,6 +69454,12 @@ const SlashMenu = forwardRef(
       command2(item);
     };
     const handleBack = () => {
+      if (nestedPath.length > 0) {
+        setNestedPath((prev) => prev.slice(0, -1));
+        setSelectedIndex(0);
+        setSubcategorySearch("");
+        return;
+      }
       setActiveCategory(null);
       setSelectedIndex(0);
       setSubcategorySearch("");
@@ -69462,7 +69498,12 @@ const SlashMenu = forwardRef(
     const getTitle = () => {
       if (!activeCategory) return "Insert from:";
       const category = categories.find((c3) => c3.id === activeCategory);
-      return (category == null ? void 0 : category.label) || activeCategory;
+      const categoryLabel = (category == null ? void 0 : category.label) || activeCategory;
+      if (nestedPath.length > 0) {
+        const pathNames = nestedPath.map((v) => v.name);
+        return `${categoryLabel} › ${pathNames.join(" › ")}`;
+      }
+      return categoryLabel;
     };
     const blocksSource = showBlocks ? BLOCK_ITEMS : [];
     const filteredBlockItems = query ? blocksSource.filter((item) => {
@@ -71804,7 +71845,7 @@ const AIRefinePanel = ({
             "data-id": "md-editor-ai-selection-box",
             children: [
               /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: `shrink-0 px-2 py-0.5 text-[10px] font-semibold uppercase tracking-wide rounded-md transition-all duration-300 ${showSelectionHighlight ? "text-white bg-gradient-to-r from-violet-500 to-indigo-500 scale-105 shadow-md" : isDark ? "text-violet-400 bg-violet-500/20" : "text-violet-600 bg-violet-500/10"}`, children: context.type === "selection" ? "Selection" : "Full" }),
-              /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1 min-w-0", children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: `text-xs leading-snug break-words whitespace-pre-wrap ${isDark ? "text-gray-300" : "text-gray-600"} ${isContentExpanded ? "" : "line-clamp-4"}`, children: context.originalText || "(No content selected)" }) }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1 min-w-0", children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: `text-xs leading-snug break-words ${isDark ? "text-gray-300" : "text-gray-600"} ${isContentExpanded ? "" : "line-clamp-4"}`, children: context.originalText || "(No content selected)" }) }),
               context.originalText && context.originalText.length > 100 && /* @__PURE__ */ jsxRuntimeExports.jsx(
                 "button",
                 {

package/dist/ui-libs.umd.js

@@ -69176,6 +69176,7 @@ ${code2}
       const [activeCategory, setActiveCategory] = React.useState(null);
       const [selectedIndex, setSelectedIndex] = React.useState(0);
       const [subcategorySearch, setSubcategorySearch] = React.useState("");
+      const [nestedPath, setNestedPath] = React.useState([]);
       const menuRef = React.useRef(null);
       const blockItemsRef = React.useRef(null);
       const categoryListRef = React.useRef(null);
@@ -69279,6 +69280,12 @@ ${code2}
             items = contentVariables;
             break;
         }
+        if (nestedPath.length > 0) {
+          const lastInPath = nestedPath[nestedPath.length - 1];
+          if (lastInPath.children && lastInPath.children.length > 0) {
+            items = lastInPath.children;
+          }
+        }
         const searchTerm = subcategorySearch.toLowerCase();
         if (searchTerm) {
           items = items.filter((item) => {
@@ -69295,7 +69302,7 @@ ${code2}
           });
         }
         return items;
-      }, [activeCategory, subcategorySearch, agents2, tools2, knowledge2, envVariables2, memoryVariables, systemVariables2, contentVariables, allCategories]);
+      }, [activeCategory, subcategorySearch, nestedPath, agents2, tools2, knowledge2, envVariables2, memoryVariables, systemVariables2, contentVariables, allCategories]);
       const currentItems = getCurrentItems();
       const getAllNavigableItems = React.useCallback(() => {
         if (activeCategory) {
@@ -69317,7 +69324,7 @@ ${code2}
       const navigableItems = getAllNavigableItems();
       React.useEffect(() => {
         setSelectedIndex(0);
-      }, [navigableItems.length, activeCategory, query, subcategorySearch]);
+      }, [navigableItems.length, activeCategory, query, subcategorySearch, nestedPath.length]);
       React.useEffect(() => {
         const itemElement = itemRefs.current.get(selectedIndex);
         if (itemElement) {
@@ -69370,6 +69377,11 @@ ${code2}
             return true;
           }
           if (event.key === "Escape") {
+            if (nestedPath.length > 0) {
+              setNestedPath((prev) => prev.slice(0, -1));
+              setSubcategorySearch("");
+              return true;
+            }
             if (activeCategory) {
               setActiveCategory(null);
               setSubcategorySearch("");
@@ -69377,14 +69389,19 @@ ${code2}
             }
             return false;
           }
-          if (event.key === "Backspace" && !query && !subcategorySearch && activeCategory) {
-            setActiveCategory(null);
-            setSubcategorySearch("");
-            return true;
+          if (event.key === "Backspace" && !query && !subcategorySearch) {
+            if (nestedPath.length > 0) {
+              setNestedPath((prev) => prev.slice(0, -1));
+              return true;
+            }
+            if (activeCategory) {
+              setActiveCategory(null);
+              return true;
+            }
           }
           return false;
         },
-        [navigableItems, selectedIndex, activeCategory, query, findNextEnabledIndex]
+        [navigableItems, selectedIndex, activeCategory, query, nestedPath, findNextEnabledIndex]
       );
       React.useImperativeHandle(ref, () => ({
         onKeyDown
@@ -69402,6 +69419,7 @@ ${code2}
           setActiveCategory(item.id);
           setSelectedIndex(0);
           setSubcategorySearch("");
+          setNestedPath([]);
           return;
         }
         if ("action" in item && typeof item.action === "function") {
@@ -69428,12 +69446,24 @@ ${code2}
         }
         if ("path" in item && "type" in item) {
           const variable = item;
+          if (variable.children && variable.children.length > 0) {
+            setNestedPath((prev) => [...prev, variable]);
+            setSelectedIndex(0);
+            setSubcategorySearch("");
+            return;
+          }
           deleteSlashTrigger();
+          let fullPath = variable.path;
+          if (nestedPath.length > 0) {
+            const pathParts = nestedPath.map((v) => v.name);
+            pathParts.push(variable.name);
+            fullPath = pathParts.join(".");
+          }
           editor.chain().focus().insertContent({
             type: "variableChip",
             attrs: {
               variableType: variable.type,
-              path: variable.path,
+              path: fullPath,
               displayName: variable.name
             }
           }).insertContent(" ").run();
@@ -69442,6 +69472,12 @@ ${code2}
         command2(item);
       };
       const handleBack = () => {
+        if (nestedPath.length > 0) {
+          setNestedPath((prev) => prev.slice(0, -1));
+          setSelectedIndex(0);
+          setSubcategorySearch("");
+          return;
+        }
         setActiveCategory(null);
         setSelectedIndex(0);
         setSubcategorySearch("");
@@ -69480,7 +69516,12 @@ ${code2}
       const getTitle = () => {
         if (!activeCategory) return "Insert from:";
         const category = categories.find((c2) => c2.id === activeCategory);
-        return (category == null ? void 0 : category.label) || activeCategory;
+        const categoryLabel = (category == null ? void 0 : category.label) || activeCategory;
+        if (nestedPath.length > 0) {
+          const pathNames = nestedPath.map((v) => v.name);
+          return `${categoryLabel} › ${pathNames.join(" › ")}`;
+        }
+        return categoryLabel;
       };
       const blocksSource = showBlocks ? BLOCK_ITEMS : [];
       const filteredBlockItems = query ? blocksSource.filter((item) => {
@@ -71822,7 +71863,7 @@ ${code2}
               "data-id": "md-editor-ai-selection-box",
               children: [
                 /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: `shrink-0 px-2 py-0.5 text-[10px] font-semibold uppercase tracking-wide rounded-md transition-all duration-300 ${showSelectionHighlight ? "text-white bg-gradient-to-r from-violet-500 to-indigo-500 scale-105 shadow-md" : isDark ? "text-violet-400 bg-violet-500/20" : "text-violet-600 bg-violet-500/10"}`, children: context.type === "selection" ? "Selection" : "Full" }),
-                /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1 min-w-0", children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: `text-xs leading-snug break-words whitespace-pre-wrap ${isDark ? "text-gray-300" : "text-gray-600"} ${isContentExpanded ? "" : "line-clamp-4"}`, children: context.originalText || "(No content selected)" }) }),
+                /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex-1 min-w-0", children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: `text-xs leading-snug break-words ${isDark ? "text-gray-300" : "text-gray-600"} ${isContentExpanded ? "" : "line-clamp-4"}`, children: context.originalText || "(No content selected)" }) }),
                 context.originalText && context.originalText.length > 100 && /* @__PURE__ */ jsxRuntimeExports.jsx(
                   "button",
                   {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "agentic-ui-libs",
-  "version": "1.0.0-beta.12",
+  "version": "1.0.0-beta.13",
   "type": "module",
   "description": "A modular, config-driven analytics library for React and Angular applications",
   "main": "dist/index.js",