@walkeros/explorer 2.1.1 → 2.1.3

package/dist/index.mjs

@@ -5,14 +5,14 @@ import {
   loadPackageTypes,
   loadTypeLibraryFromURL,
   registerWalkerOSTypes
-} from "./chunk-4AJX6MFW.mjs";
+} from "./chunk-52ELVFJE.mjs";
 
 // src/components/demos/MappingDemo.tsx
 import { useState as useState6, useCallback as useCallback5, useEffect as useEffect5 } from "react";
 
 // src/components/molecules/code-box.tsx
 import { useState as useState4, useCallback as useCallback3, useRef as useRef4, useEffect as useEffect3 } from "react";
-import * as monacoNs from "monaco-editor";
+import { useMonaco } from "@monaco-editor/react";
 
 // src/components/atoms/box.tsx
 import { useState } from "react";
@@ -1114,9 +1114,14 @@ function registerFormatters(monacoInstance) {
 }
 
 // src/utils/monaco-json-schema.ts
-import { json } from "monaco-editor";
 var schemaRegistry = /* @__PURE__ */ new Map();
 var idCounter = 0;
+var _json;
+function initMonacoJson(monaco) {
+  if (_json) return;
+  _json = monaco.json;
+  if (schemaRegistry.size > 0) applySchemas();
+}
 function generateModelPath() {
   return `inmemory://walkeros/json-${++idCounter}.json`;
 }
@@ -1133,7 +1138,8 @@ function unregisterJsonSchema(modelPath) {
   applySchemas();
 }
 function applySchemas() {
-  json.jsonDefaults.setDiagnosticsOptions({
+  if (!_json) return;
+  _json.jsonDefaults.setDiagnosticsOptions({
     validate: true,
     schemaValidation: "error",
     schemaRequest: "ignore",
@@ -1182,19 +1188,19 @@ function useMonacoHeight({
     }
   }, [enabled, minHeight, maxHeight, onHeightChange]);
   const setEditor = useCallback(
-    (editor2) => {
+    (editor) => {
       if (updateTimeoutRef.current) {
         clearTimeout(updateTimeoutRef.current);
         updateTimeoutRef.current = null;
       }
-      editorRef.current = editor2;
-      if (!enabled || !editor2) {
+      editorRef.current = editor;
+      if (!enabled || !editor) {
         setHeight(defaultHeight);
         previousHeightRef.current = defaultHeight;
         return;
       }
       setTimeout(() => updateHeight(), 50);
-      const disposable = editor2.onDidContentSizeChange(() => {
+      const disposable = editor.onDidContentSizeChange(() => {
         if (updateTimeoutRef.current) {
           clearTimeout(updateTimeoutRef.current);
         }
@@ -1203,7 +1209,7 @@ function useMonacoHeight({
           updateTimeoutRef.current = null;
         }, 150);
       });
-      editor2.__heightDisposable = disposable;
+      editor.__heightDisposable = disposable;
     },
     [enabled, defaultHeight, updateHeight]
   );
@@ -1311,12 +1317,12 @@ function Code({
     };
   }, [isMounted, getDataTheme]);
   useEffect2(() => {
-    const editor2 = editorRef.current;
+    const editor = editorRef.current;
     const container = containerRef.current;
-    if (!editor2 || !container) return;
+    if (!editor || !container) return;
     const resizeObserver = new ResizeObserver(() => {
       requestAnimationFrame(() => {
-        editor2.layout();
+        editor.layout();
       });
     });
     resizeObserver.observe(container);
@@ -1360,11 +1366,12 @@ function Code({
   };
   const handleBeforeMount = async (monaco) => {
     monacoRef.current = monaco;
+    initMonacoJson(monaco);
     registerAllThemes(monaco);
     registerFormatters(monaco);
     if (packages && packages.length > 0) {
       registerWalkerOSTypes(monaco);
-      const { loadPackageTypes: loadPackageTypes2 } = await import("./monaco-types-KN2DINPW.mjs");
+      const { loadPackageTypes: loadPackageTypes2 } = await import("./monaco-types-ZGWM2633.mjs");
       for (const pkg of packages) {
         if (pkg !== "@walkeros/core") {
           await loadPackageTypes2(monaco, { package: pkg }).catch(() => {
@@ -1423,10 +1430,6 @@ function Code({
             endColumn: issue.endColumn ?? issue.column + 1
           }))
         );
-        onMarkerCountsRef.current?.({
-          errors: result.errors.length,
-          warnings: result.warnings.length
-        });
       };
       runValidation();
       const validateDisposable = monacoEditor.onDidChangeModelContent(() => {
@@ -1438,6 +1441,55 @@ function Code({
         validateDisposable.dispose();
       });
     }
+    if (onMarkerCountsRef.current && monacoRef.current) {
+      const monacoInstance = monacoRef.current;
+      const model = monacoEditor.getModel();
+      const hasCustomValidate = !!validateRef.current;
+      if (model) {
+        const reportMarkers = () => {
+          if (hasCustomValidate) {
+            monacoInstance.editor.setModelMarkers(model, "json", []);
+          }
+          const raw = monacoInstance.editor.getModelMarkers({
+            resource: model.uri
+          });
+          let errors = 0;
+          let warnings = 0;
+          const details = [];
+          for (const m of raw) {
+            if (m.severity === 8) {
+              errors++;
+              details.push({
+                message: m.message,
+                severity: "error",
+                line: m.startLineNumber,
+                column: m.startColumn
+              });
+            } else if (m.severity === 4) {
+              warnings++;
+              details.push({
+                message: m.message,
+                severity: "warning",
+                line: m.startLineNumber,
+                column: m.startColumn
+              });
+            }
+          }
+          onMarkerCountsRef.current?.({ errors, warnings, markers: details });
+        };
+        const markerDisposable = monacoInstance.editor.onDidChangeMarkers(
+          (uris) => {
+            if (uris.some((uri) => uri.toString() === model.uri.toString())) {
+              reportMarkers();
+            }
+          }
+        );
+        requestAnimationFrame(reportMarkers);
+        decorationsCleanupRef.current.push(() => {
+          markerDisposable.dispose();
+        });
+      }
+    }
     requestAnimationFrame(() => {
       monacoEditor.layout();
     });
@@ -1565,6 +1617,7 @@ function CodeBox({
   ...codeProps
 }) {
   const { onMount: userOnMount, ...restCodeProps } = codeProps;
+  const monaco = useMonaco();
   const [copied, setCopied] = useState4(false);
   const [showSettingsPanel, setShowSettingsPanel] = useState4(false);
   const [settings, setSettings] = useState4({
@@ -1575,18 +1628,23 @@ function CodeBox({
   });
   const settingsRef = useRef4(null);
   const [markerCounts, setMarkerCounts] = useState4({ errors: 0, warnings: 0 });
+  const [markerDetails, setMarkerDetails] = useState4([]);
+  const [openMarkerMenu, setOpenMarkerMenu] = useState4(null);
+  const markerMenuRef = useRef4(null);
   const editorInstanceRef = useRef4(null);
-  const lastJumpIndexRef = useRef4({ errors: -1, warnings: -1 });
   useEffect3(() => {
-    if (!showSettingsPanel) return;
+    if (!showSettingsPanel && !openMarkerMenu) return;
     const handleClickOutside = (e) => {
-      if (settingsRef.current && !settingsRef.current.contains(e.target)) {
+      if (showSettingsPanel && settingsRef.current && !settingsRef.current.contains(e.target)) {
         setShowSettingsPanel(false);
       }
+      if (openMarkerMenu && markerMenuRef.current && !markerMenuRef.current.contains(e.target)) {
+        setOpenMarkerMenu(null);
+      }
     };
     document.addEventListener("mousedown", handleClickOutside);
     return () => document.removeEventListener("mousedown", handleClickOutside);
-  }, [showSettingsPanel]);
+  }, [showSettingsPanel, openMarkerMenu]);
   const [currentTabId, setCurrentTabId] = useState4(
     controlledActiveTab ?? defaultTab ?? tabs?.[0]?.id ?? ""
   );
@@ -1627,33 +1685,20 @@ function CodeBox({
     [userOnMount]
   );
   const handleMarkerCounts = useCallback3(
-    (counts) => {
-      setMarkerCounts(counts);
-      lastJumpIndexRef.current = { errors: -1, warnings: -1 };
-      onValidationIssues?.(counts);
+    (info) => {
+      setMarkerCounts({ errors: info.errors, warnings: info.warnings });
+      setMarkerDetails(info.markers);
+      onValidationIssues?.({ errors: info.errors, warnings: info.warnings });
     },
     [onValidationIssues]
   );
-  const jumpToMarker = useCallback3((severity) => {
+  const jumpToLine = useCallback3((line, column) => {
     const ed = editorInstanceRef.current;
     if (!ed) return;
-    const model = ed.getModel();
-    if (!model) return;
-    const severityValue = severity === "error" ? 8 : 4;
-    const markers = monacoNs.editor.getModelMarkers({ resource: model.uri }).filter((m) => m.severity === severityValue).sort(
-      (a, b) => a.startLineNumber - b.startLineNumber || a.startColumn - b.startColumn
-    );
-    if (markers.length === 0) return;
-    const key = severity === "error" ? "errors" : "warnings";
-    const nextIndex = (lastJumpIndexRef.current[key] + 1) % markers.length;
-    lastJumpIndexRef.current[key] = nextIndex;
-    const marker = markers[nextIndex];
-    ed.revealLineInCenter(marker.startLineNumber);
-    ed.setPosition({
-      lineNumber: marker.startLineNumber,
-      column: marker.startColumn
-    });
+    ed.revealLineInCenter(line);
+    ed.setPosition({ lineNumber: line, column });
     ed.focus();
+    setOpenMarkerMenu(null);
   }, []);
   const settingsProps = {
     lineNumbers: settings.lineNumbers,
@@ -1663,56 +1708,88 @@ function CodeBox({
   };
   const actions = /* @__PURE__ */ jsxs3("div", { style: { display: "flex", gap: "4px", alignItems: "center" }, children: [
     markerCounts.errors > 0 && /* @__PURE__ */ jsxs3(
-      "button",
+      "div",
       {
-        className: "elb-codebox-marker-badge elb-codebox-marker-badge--error",
-        onClick: () => jumpToMarker("error"),
-        title: `${markerCounts.errors} error${markerCounts.errors !== 1 ? "s" : ""} \u2014 click to jump`,
+        ref: openMarkerMenu === "error" ? markerMenuRef : void 0,
+        style: { position: "relative" },
         children: [
           /* @__PURE__ */ jsxs3(
-            "svg",
+            "button",
             {
-              width: "14",
-              height: "14",
-              viewBox: "0 0 24 24",
-              fill: "none",
-              stroke: "currentColor",
-              strokeWidth: "2",
+              className: "elb-codebox-marker-badge elb-codebox-marker-badge--error",
+              onClick: () => setOpenMarkerMenu(openMarkerMenu === "error" ? null : "error"),
               children: [
-                /* @__PURE__ */ jsx4("circle", { cx: "12", cy: "12", r: "10" }),
-                /* @__PURE__ */ jsx4("line", { x1: "15", y1: "9", x2: "9", y2: "15" }),
-                /* @__PURE__ */ jsx4("line", { x1: "9", y1: "9", x2: "15", y2: "15" })
+                /* @__PURE__ */ jsxs3(
+                  "svg",
+                  {
+                    width: "14",
+                    height: "14",
+                    viewBox: "0 0 24 24",
+                    fill: "none",
+                    stroke: "currentColor",
+                    strokeWidth: "2",
+                    children: [
+                      /* @__PURE__ */ jsx4("circle", { cx: "12", cy: "12", r: "10" }),
+                      /* @__PURE__ */ jsx4("line", { x1: "15", y1: "9", x2: "9", y2: "15" }),
+                      /* @__PURE__ */ jsx4("line", { x1: "9", y1: "9", x2: "15", y2: "15" })
+                    ]
+                  }
+                ),
+                /* @__PURE__ */ jsx4("span", { children: markerCounts.errors })
               ]
             }
           ),
-          /* @__PURE__ */ jsx4("span", { children: markerCounts.errors })
+          openMarkerMenu === "error" && /* @__PURE__ */ jsx4(
+            MarkerMenu,
+            {
+              markers: markerDetails.filter((m) => m.severity === "error"),
+              onJump: jumpToLine
+            }
+          )
         ]
       }
     ),
     markerCounts.warnings > 0 && /* @__PURE__ */ jsxs3(
-      "button",
+      "div",
       {
-        className: "elb-codebox-marker-badge elb-codebox-marker-badge--warning",
-        onClick: () => jumpToMarker("warning"),
-        title: `${markerCounts.warnings} warning${markerCounts.warnings !== 1 ? "s" : ""} \u2014 click to jump`,
+        ref: openMarkerMenu === "warning" ? markerMenuRef : void 0,
+        style: { position: "relative" },
         children: [
           /* @__PURE__ */ jsxs3(
-            "svg",
+            "button",
             {
-              width: "14",
-              height: "14",
-              viewBox: "0 0 24 24",
-              fill: "none",
-              stroke: "currentColor",
-              strokeWidth: "2",
+              className: "elb-codebox-marker-badge elb-codebox-marker-badge--warning",
+              onClick: () => setOpenMarkerMenu(openMarkerMenu === "warning" ? null : "warning"),
               children: [
-                /* @__PURE__ */ jsx4("path", { d: "M12 3L2 21h20L12 3z" }),
-                /* @__PURE__ */ jsx4("line", { x1: "12", y1: "9", x2: "12", y2: "13" }),
-                /* @__PURE__ */ jsx4("line", { x1: "12", y1: "17", x2: "12.01", y2: "17" })
+                /* @__PURE__ */ jsxs3(
+                  "svg",
+                  {
+                    width: "14",
+                    height: "14",
+                    viewBox: "0 0 24 24",
+                    fill: "none",
+                    stroke: "currentColor",
+                    strokeWidth: "2",
+                    strokeLinecap: "round",
+                    strokeLinejoin: "round",
+                    children: [
+                      /* @__PURE__ */ jsx4("path", { d: "M10.29 3.86L1.82 18a2 2 0 001.71 3h16.94a2 2 0 001.71-3L13.71 3.86a2 2 0 00-3.42 0z" }),
+                      /* @__PURE__ */ jsx4("line", { x1: "12", y1: "9", x2: "12", y2: "13" }),
+                      /* @__PURE__ */ jsx4("circle", { cx: "12", cy: "17", r: ".5" })
+                    ]
+                  }
+                ),
+                /* @__PURE__ */ jsx4("span", { children: markerCounts.warnings })
               ]
             }
           ),
-          /* @__PURE__ */ jsx4("span", { children: markerCounts.warnings })
+          openMarkerMenu === "warning" && /* @__PURE__ */ jsx4(
+            MarkerMenu,
+            {
+              markers: markerDetails.filter((m) => m.severity === "warning"),
+              onJump: jumpToLine
+            }
+          )
         ]
       }
     ),
@@ -1907,6 +1984,26 @@ function CodeBox({
     }
   );
 }
+function MarkerMenu({
+  markers,
+  onJump
+}) {
+  return /* @__PURE__ */ jsx4("div", { className: "elb-codebox-marker-menu", children: markers.sort((a, b) => a.line - b.line || a.column - b.column).map((m, i) => /* @__PURE__ */ jsxs3(
+    "button",
+    {
+      className: "elb-codebox-marker-menu-item",
+      onClick: () => onJump(m.line, m.column),
+      children: [
+        /* @__PURE__ */ jsxs3("span", { className: "elb-codebox-marker-menu-line", children: [
+          "Ln ",
+          m.line
+        ] }),
+        /* @__PURE__ */ jsx4("span", { className: "elb-codebox-marker-menu-msg", children: m.message })
+      ]
+    },
+    i
+  )) });
+}
 
 // src/components/atoms/grid.tsx
 import {
@@ -2580,10 +2677,14 @@ function Preview({
             const createNoopLogger = () => ({
               error: () => {
               },
+              warn: () => {
+              },
               info: () => {
               },
               debug: () => {
               },
+              json: () => {
+              },
               throw: (msg) => {
                 throw msg instanceof Error ? msg : new Error(msg);
               },
@@ -2620,6 +2721,8 @@ function Preview({
               logger: noopLogger,
               setIngest: async () => {
               },
+              setRespond: () => {
+              },
               config,
               env
             });
@@ -18361,10 +18464,10 @@ function validateWalkerOSReferences(text, context) {
 }
 
 // src/utils/monaco-intellisense-flow-extractor.ts
-function extractFlowIntelliSenseContext(json2) {
+function extractFlowIntelliSenseContext(json) {
   let parsed;
   try {
-    parsed = JSON.parse(json2);
+    parsed = JSON.parse(json);
   } catch {
     return {};
   }