@bian-womp/spark-workbench 0.1.23 → 0.1.25

package/lib/cjs/src/misc/DefaultContextMenu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DefaultContextMenu.d.ts","sourceRoot":"","sources":["../../../../src/misc/DefaultContextMenu.tsx"],"names":[],"mappings":"AAIA,wBAAgB,kBAAkB,CAAC,EACjC,IAAI,EACJ,SAAS,EACT,KAAK,EACL,OAAO,GACR,EAAE;IACD,IAAI,EAAE,OAAO,CAAC;IACd,SAAS,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,GAAG,IAAI,CAAC;IAC3C,KAAK,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IACpE,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB,kDA4HA"}
+{"version":3,"file":"DefaultContextMenu.d.ts","sourceRoot":"","sources":["../../../../src/misc/DefaultContextMenu.tsx"],"names":[],"mappings":"AAIA,wBAAgB,kBAAkB,CAAC,EACjC,IAAI,EACJ,SAAS,EACT,KAAK,EACL,OAAO,GACR,EAAE;IACD,IAAI,EAAE,OAAO,CAAC;IACd,SAAS,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,GAAG,IAAI,CAAC;IAC3C,KAAK,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IACpE,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB,kDAmKA"}

package/lib/esm/index.js

@@ -1754,8 +1754,13 @@ function DefaultContextMenu({ open, clientPos, onAdd, onClose, }) {
     const { registry } = useWorkbenchContext();
     const rf = useReactFlow();
     const ids = Array.from(registry.nodes.keys());
+    const [query, setQuery] = useState("");
+    const q = query.trim().toLowerCase();
+    const filteredIds = q
+        ? ids.filter((id) => id.toLowerCase().includes(q))
+        : ids;
     const root = { __children: {} };
-    for (const id of ids) {
+    for (const id of filteredIds) {
         const parts = id.split(".");
         let node = root;
         for (let i = 0; i < parts.length; i++) {
@@ -1766,7 +1771,7 @@ function DefaultContextMenu({ open, clientPos, onAdd, onClose, }) {
                 node.__self = id;
         }
     }
-    const totalCount = ids.length;
+    const totalCount = filteredIds.length;
     // Ref for focus/outside click handling
     const ref = useRef(null);
     // Close on outside click and on ESC
@@ -1790,10 +1795,12 @@ function DefaultContextMenu({ open, clientPos, onAdd, onClose, }) {
             window.removeEventListener("keydown", onKey);
         };
     }, [open, onClose]);
-    // Focus for keyboard accessibility
+    // Focus search input when menu opens
+    const inputRef = useRef(null);
     useEffect(() => {
-        if (open)
-            ref.current?.focus();
+        if (open) {
+            setTimeout(() => inputRef.current?.focus(), 0);
+        }
     }, [open]);
     if (!open || !clientPos)
         return null;
@@ -1814,14 +1821,19 @@ function DefaultContextMenu({ open, clientPos, onAdd, onClose, }) {
         return (jsx("div", { children: entries.map(([key, child]) => {
                 const label = key;
                 const hasChildren = Object.keys(child.__children).length > 0;
-                !!child.__self && !hasChildren;
-                return (jsxs("div", { children: [jsx("div", { className: "px-2 py-1 text-[11px] uppercase tracking-wide text-gray-400", children: label }), child.__self && (jsx("button", { onClick: () => handleClick(child.__self), className: "block w-full text-left px-3 py-1 hover:bg-gray-100 cursor-pointer", title: child.__self, children: child.__self.split(".").slice(-1)[0] })), hasChildren && (jsx("div", { className: "pl-2 border-l border-gray-200 ml-2", children: renderTree(child, [...path, key]) }))] }, [...path, key].join(".")));
+                const idKey = [...path, key].join(".");
+                if (!hasChildren) {
+                    // Leaf: render only the action button, no group header
+                    return child.__self ? (jsx("button", { onClick: () => handleClick(child.__self), className: "block w-full text-left px-3 py-1 hover:bg-gray-100 cursor-pointer", title: child.__self, children: label }, idKey)) : null;
+                }
+                // Group: show label, optional action for id at this level, and children
+                return (jsxs("div", { children: [jsx("div", { className: "px-2 py-1 text-[11px] uppercase tracking-wide text-gray-400", children: label }), child.__self && (jsx("button", { onClick: () => handleClick(child.__self), className: "block w-full text-left px-3 py-1 hover:bg-gray-100 cursor-pointer", title: child.__self, children: label })), jsx("div", { className: "pl-2 border-l border-gray-200 ml-2", children: renderTree(child, [...path, key]) })] }, idKey));
             }) }));
     };
     return (jsxs("div", { ref: ref, tabIndex: -1, className: "fixed z-[1000] bg-white border border-gray-300 rounded-none shadow-lg p-1 min-w-[180px] text-sm text-gray-700", style: { left: x, top: y }, onClick: (e) => e.stopPropagation(), onMouseDown: (e) => e.stopPropagation(), onWheel: (e) => e.stopPropagation(), onContextMenu: (e) => {
             e.preventDefault();
             e.stopPropagation();
-        }, children: [jsxs("div", { className: "px-2 py-1 font-semibold text-gray-700", children: ["Add Node ", jsxs("span", { className: "text-gray-500 font-normal", children: ["(", totalCount, ")"] })] }), jsx("div", { className: "max-h-60 overflow-auto", children: renderTree(root) })] }));
+        }, children: [jsxs("div", { className: "px-2 py-1 font-semibold text-gray-700", children: ["Add Node", " ", jsxs("span", { className: "text-gray-500 font-normal", children: ["(", totalCount, ")"] })] }), jsx("div", { className: "px-2 pb-1", children: jsx("input", { ref: inputRef, type: "text", value: query, onChange: (e) => setQuery(e.target.value), placeholder: "Filter nodes...", className: "w-full border border-gray-300 px-2 py-1 text-sm outline-none focus:border-gray-400", onClick: (e) => e.stopPropagation(), onMouseDown: (e) => e.stopPropagation(), onWheel: (e) => e.stopPropagation() }) }), jsx("div", { className: "max-h-60 overflow-auto", children: totalCount > 0 ? (renderTree(root)) : (jsx("div", { className: "px-3 py-2 text-gray-400", children: "No matches" })) })] }));
 }
 
 function NodeContextMenu({ open, clientPos, nodeId, onClose, }) {