@tooluminati/react-troubleshooting 0.1.0 → 0.2.0

package/dist/WebMcpTroubleshootingPanel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"WebMcpTroubleshootingPanel.d.ts","sourceRoot":"","sources":["../src/WebMcpTroubleshootingPanel.tsx"],"names":[],"mappings":"AAiBA,MAAM,WAAW,+BAA+B;IAC9C,QAAQ,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IACrC,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,iBAAiB,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CAC5C;AAYD,wBAAgB,0BAA0B,CAAC,EACzC,QAAe,EACf,cAAc,EACd,iBAAiB,GAClB,EAAE,+BAA+B,sCAkTjC"}
+{"version":3,"file":"WebMcpTroubleshootingPanel.d.ts","sourceRoot":"","sources":["../src/WebMcpTroubleshootingPanel.tsx"],"names":[],"mappings":"AAkBA,MAAM,WAAW,+BAA+B;IAC9C,QAAQ,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IACrC,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,iBAAiB,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CAC5C;AAYD,wBAAgB,0BAA0B,CAAC,EACzC,QAAe,EACf,cAAc,EACd,iBAAiB,GAClB,EAAE,+BAA+B,sCAsTjC"}

package/dist/WebMcpTroubleshootingPanel.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useEffect, useMemo, useState } from 'react';
-import { filterPanelEvents, serializeTroubleshootingDiagnostics, } from '@tooluminati/diagnostics';
+import { filterPanelEvents, serializeTroubleshootingDiagnostics, ensureDeclarativeFocusStyles, } from '@tooluminati/diagnostics';
 import { useWebMcpTroubleshootingContext } from './WebMcpTroubleshootingContext';
 const PALETTE = {
     surface: '#0a0e1a',
@@ -24,6 +24,9 @@ export function WebMcpTroubleshootingPanel({ position = 'br', startCollapsed, on
     const [openErrors, setOpenErrors] = useState({});
     const [copied, setCopied] = useState(false);
     const [spinning, setSpinning] = useState(false);
+    useEffect(() => {
+        ensureDeclarativeFocusStyles();
+    }, []);
     useEffect(() => {
         if (startCollapsed) {
             visibility.setCollapsed(true);

package/dist/declarative-form.d.ts

@@ -1,4 +1,5 @@
 import { type FormEventHandler, type InputHTMLAttributes, type ReactNode, type SelectHTMLAttributes, type TextareaHTMLAttributes, type FormHTMLAttributes } from 'react';
+export { isAgentInvokedSubmit, respondWithAgentResult, WEBMCP_DECLARATIVE_FOCUS_STYLES, ensureDeclarativeFocusStyles, } from '@tooluminati/diagnostics';
 export interface WebMcpFormProps extends FormHTMLAttributes<HTMLFormElement> {
     toolName: string;
     toolDescription: string;
@@ -16,6 +17,7 @@ export declare function WebMcpTextarea(props: TextareaHTMLAttributes<HTMLTextAre
     toolParamDescription?: string;
 }): import("react").JSX.Element;
 export declare function useAgentInvokedSubmit(handler: FormEventHandler<HTMLFormElement>): FormEventHandler<HTMLFormElement>;
+export declare function useAgentSubmitRespondWith(getResult: () => unknown | Promise<unknown>): FormEventHandler<HTMLFormElement>;
 export interface DeclarativeFormToolEventsOptions {
     formSelector?: string;
 }

package/dist/declarative-form.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"declarative-form.d.ts","sourceRoot":"","sources":["../src/declarative-form.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,gBAAgB,EACrB,KAAK,mBAAmB,EACxB,KAAK,SAAS,EACd,KAAK,oBAAoB,EACzB,KAAK,sBAAsB,EAC3B,KAAK,kBAAkB,EACxB,MAAM,OAAO,CAAC;AAIf,MAAM,WAAW,eAAgB,SAAQ,kBAAkB,CAAC,eAAe,CAAC;IAC1E,QAAQ,EAAE,MAAM,CAAC;IACjB,eAAe,EAAE,MAAM,CAAC;IACxB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,wBAAgB,UAAU,CAAC,EACzB,QAAQ,EACR,eAAe,EACf,cAAc,EACd,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,eAAe,+BAWjB;AAED,wBAAgB,WAAW,CACzB,KAAK,EAAE,mBAAmB,CAAC,gBAAgB,CAAC,GAAG;IAC7C,oBAAoB,CAAC,EAAE,MAAM,CAAC;CAC/B,+BAWF;AAED,wBAAgB,YAAY,CAC1B,KAAK,EAAE,oBAAoB,CAAC,iBAAiB,CAAC,GAAG;IAC/C,oBAAoB,CAAC,EAAE,MAAM,CAAC;CAC/B,+BAWF;AAED,wBAAgB,cAAc,CAC5B,KAAK,EAAE,sBAAsB,CAAC,mBAAmB,CAAC,GAAG;IACnD,oBAAoB,CAAC,EAAE,MAAM,CAAC;CAC/B,+BAWF;AAED,wBAAgB,qBAAqB,CACnC,OAAO,EAAE,gBAAgB,CAAC,eAAe,CAAC,GACzC,gBAAgB,CAAC,eAAe,CAAC,CAOnC;AAED,MAAM,WAAW,gCAAgC;IAC/C,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,wBAAgB,4BAA4B,CAC1C,QAAQ,GAAE,gCAAqC,GAC9C,IAAI,CAEN"}
+{"version":3,"file":"declarative-form.d.ts","sourceRoot":"","sources":["../src/declarative-form.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,gBAAgB,EACrB,KAAK,mBAAmB,EACxB,KAAK,SAAS,EACd,KAAK,oBAAoB,EACzB,KAAK,sBAAsB,EAC3B,KAAK,kBAAkB,EACxB,MAAM,OAAO,CAAC;AAMf,OAAO,EACL,oBAAoB,EACpB,sBAAsB,EACtB,+BAA+B,EAC/B,4BAA4B,GAC7B,MAAM,0BAA0B,CAAC;AAElC,MAAM,WAAW,eAAgB,SAAQ,kBAAkB,CAAC,eAAe,CAAC;IAC1E,QAAQ,EAAE,MAAM,CAAC;IACjB,eAAe,EAAE,MAAM,CAAC;IACxB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,wBAAgB,UAAU,CAAC,EACzB,QAAQ,EACR,eAAe,EACf,cAAc,EACd,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,eAAe,+BAWjB;AAED,wBAAgB,WAAW,CACzB,KAAK,EAAE,mBAAmB,CAAC,gBAAgB,CAAC,GAAG;IAC7C,oBAAoB,CAAC,EAAE,MAAM,CAAC;CAC/B,+BAWF;AAED,wBAAgB,YAAY,CAC1B,KAAK,EAAE,oBAAoB,CAAC,iBAAiB,CAAC,GAAG;IAC/C,oBAAoB,CAAC,EAAE,MAAM,CAAC;CAC/B,+BAWF;AAED,wBAAgB,cAAc,CAC5B,KAAK,EAAE,sBAAsB,CAAC,mBAAmB,CAAC,GAAG;IACnD,oBAAoB,CAAC,EAAE,MAAM,CAAC;CAC/B,+BAWF;AAED,wBAAgB,qBAAqB,CACnC,OAAO,EAAE,gBAAgB,CAAC,eAAe,CAAC,GACzC,gBAAgB,CAAC,eAAe,CAAC,CAMnC;AAED,wBAAgB,yBAAyB,CACvC,SAAS,EAAE,MAAM,OAAO,GAAG,OAAO,CAAC,OAAO,CAAC,GAC1C,gBAAgB,CAAC,eAAe,CAAC,CAcnC;AAED,MAAM,WAAW,gCAAgC;IAC/C,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,wBAAgB,4BAA4B,CAC1C,QAAQ,GAAE,gCAAqC,GAC9C,IAAI,CAEN"}

package/dist/declarative-form.js

@@ -1,4 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
+import { isAgentInvokedSubmit, respondWithAgentResult, } from '@tooluminati/diagnostics';
+export { isAgentInvokedSubmit, respondWithAgentResult, WEBMCP_DECLARATIVE_FOCUS_STYLES, ensureDeclarativeFocusStyles, } from '@tooluminati/diagnostics';
 export function WebMcpForm({ toolName, toolDescription, toolAutoSubmit, children, ...props }) {
     return (_jsx("form", { ...props, toolname: toolName, tooldescription: toolDescription, ...(toolAutoSubmit ? { toolautosubmit: '' } : {}), children: children }));
 }
@@ -22,12 +24,22 @@ export function WebMcpTextarea(props) {
 }
 export function useAgentInvokedSubmit(handler) {
     return (event) => {
-        const submitEvent = event.nativeEvent;
-        if (submitEvent.agentInvoked) {
+        if (isAgentInvokedSubmit(event.nativeEvent)) {
             handler(event);
         }
     };
 }
+export function useAgentSubmitRespondWith(getResult) {
+    return (event) => {
+        const nativeEvent = event.nativeEvent;
+        if (!isAgentInvokedSubmit(nativeEvent) ||
+            typeof nativeEvent.respondWith !== 'function') {
+            return;
+        }
+        // Supply respondWith synchronously; capture synchronous handler failures in its promise.
+        respondWithAgentResult(nativeEvent, Promise.resolve().then(getResult));
+    };
+}
 export function useDeclarativeFormToolEvents(_options = {}) {
     // Agent form submits are captured by createWebMcpLifecycleCollector().
 }

package/dist/index.cjs

@@ -20,6 +20,7 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/index.ts
 var index_exports = {};
 __export(index_exports, {
+  WEBMCP_DECLARATIVE_FOCUS_STYLES: () => import_diagnostics6.WEBMCP_DECLARATIVE_FOCUS_STYLES,
   WebMcpErrorBoundary: () => WebMcpErrorBoundary,
   WebMcpForm: () => WebMcpForm,
   WebMcpInput: () => WebMcpInput,
@@ -29,12 +30,16 @@ __export(index_exports, {
   WebMcpTroubleshootingPanel: () => WebMcpTroubleshootingPanel,
   WebMcpTroubleshootingProvider: () => WebMcpTroubleshootingProvider,
   createFormSubmitBlockersProvider: () => createFormSubmitBlockersProvider,
+  ensureDeclarativeFocusStyles: () => import_diagnostics6.ensureDeclarativeFocusStyles,
   getPanelVisibilityController: () => getPanelVisibilityController,
   hideWebMcpTroubleshootingPanel: () => hideWebMcpTroubleshootingPanel,
+  isAgentInvokedSubmit: () => import_diagnostics6.isAgentInvokedSubmit,
   resetPanelVisibilityController: () => resetPanelVisibilityController,
+  respondWithAgentResult: () => import_diagnostics6.respondWithAgentResult,
   showWebMcpTroubleshootingPanel: () => showWebMcpTroubleshootingPanel,
   toggleWebMcpTroubleshootingPanel: () => toggleWebMcpTroubleshootingPanel,
   useAgentInvokedSubmit: () => useAgentInvokedSubmit,
+  useAgentSubmitRespondWith: () => useAgentSubmitRespondWith,
   useDeclarativeFormToolEvents: () => useDeclarativeFormToolEvents,
   useFormSubmitBlockers: () => useFormSubmitBlockers,
   useTanStackQueryWebMcpTools: () => useTanStackQueryWebMcpTools,
@@ -98,6 +103,9 @@ function WebMcpTroubleshootingPanel({
   const [openErrors, setOpenErrors] = (0, import_react3.useState)({});
   const [copied, setCopied] = (0, import_react3.useState)(false);
   const [spinning, setSpinning] = (0, import_react3.useState)(false);
+  (0, import_react3.useEffect)(() => {
+    (0, import_diagnostics.ensureDeclarativeFocusStyles)();
+  }, []);
   (0, import_react3.useEffect)(() => {
     if (startCollapsed) {
       visibility.setCollapsed(true);
@@ -715,6 +723,8 @@ function useFormSubmitBlockers(options) {
 }
 
 // src/declarative-form.tsx
+var import_diagnostics5 = require("@tooluminati/diagnostics");
+var import_diagnostics6 = require("@tooluminati/diagnostics");
 var import_jsx_runtime4 = require("react/jsx-runtime");
 function WebMcpForm({
   toolName,
@@ -766,18 +776,26 @@ function WebMcpTextarea(props) {
 }
 function useAgentInvokedSubmit(handler) {
   return (event) => {
-    const submitEvent = event.nativeEvent;
-    if (submitEvent.agentInvoked) {
+    if ((0, import_diagnostics5.isAgentInvokedSubmit)(event.nativeEvent)) {
       handler(event);
     }
   };
 }
+function useAgentSubmitRespondWith(getResult) {
+  return (event) => {
+    const nativeEvent = event.nativeEvent;
+    if (!(0, import_diagnostics5.isAgentInvokedSubmit)(nativeEvent) || typeof nativeEvent.respondWith !== "function") {
+      return;
+    }
+    (0, import_diagnostics5.respondWithAgentResult)(nativeEvent, Promise.resolve().then(getResult));
+  };
+}
 function useDeclarativeFormToolEvents(_options = {}) {
 }
 
 // src/useTroubleshootingPanel.ts
 var import_react11 = require("react");
-var import_diagnostics5 = require("@tooluminati/diagnostics");
+var import_diagnostics7 = require("@tooluminati/diagnostics");
 function useTroubleshootingPanel() {
   const { viewModel } = useWebMcpTroubleshootingContext();
   const [snapshot, setSnapshot] = (0, import_react11.useState)(
@@ -792,7 +810,7 @@ function useTroubleshootingPanel() {
     snapshot,
     panelState: snapshot.panelState,
     refresh: () => setSnapshot(viewModel.refresh()),
-    copyDiagnostics: () => (0, import_diagnostics5.serializeTroubleshootingDiagnostics)(snapshot)
+    copyDiagnostics: () => (0, import_diagnostics7.serializeTroubleshootingDiagnostics)(snapshot)
   };
 }
 function useTroubleshootingPanelVisibility() {
@@ -808,6 +826,7 @@ function useTroubleshootingPanelVisibility() {
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
+  WEBMCP_DECLARATIVE_FOCUS_STYLES,
   WebMcpErrorBoundary,
   WebMcpForm,
   WebMcpInput,
@@ -817,12 +836,16 @@ function useTroubleshootingPanelVisibility() {
   WebMcpTroubleshootingPanel,
   WebMcpTroubleshootingProvider,
   createFormSubmitBlockersProvider,
+  ensureDeclarativeFocusStyles,
   getPanelVisibilityController,
   hideWebMcpTroubleshootingPanel,
+  isAgentInvokedSubmit,
   resetPanelVisibilityController,
+  respondWithAgentResult,
   showWebMcpTroubleshootingPanel,
   toggleWebMcpTroubleshootingPanel,
   useAgentInvokedSubmit,
+  useAgentSubmitRespondWith,
   useDeclarativeFormToolEvents,
   useFormSubmitBlockers,
   useTanStackQueryWebMcpTools,

package/dist/index.js

@@ -51,7 +51,8 @@ function useWebMcpTroubleshootingContext() {
 import { useEffect, useMemo, useState } from "react";
 import {
   filterPanelEvents,
-  serializeTroubleshootingDiagnostics
+  serializeTroubleshootingDiagnostics,
+  ensureDeclarativeFocusStyles
 } from "@tooluminati/diagnostics";
 import { jsx, jsxs } from "react/jsx-runtime";
 var PALETTE = {
@@ -82,6 +83,9 @@ function WebMcpTroubleshootingPanel({
   const [openErrors, setOpenErrors] = useState({});
   const [copied, setCopied] = useState(false);
   const [spinning, setSpinning] = useState(false);
+  useEffect(() => {
+    ensureDeclarativeFocusStyles();
+  }, []);
   useEffect(() => {
     if (startCollapsed) {
       visibility.setCollapsed(true);
@@ -703,6 +707,16 @@ function useFormSubmitBlockers(options) {
 }
 
 // src/declarative-form.tsx
+import {
+  isAgentInvokedSubmit,
+  respondWithAgentResult
+} from "@tooluminati/diagnostics";
+import {
+  isAgentInvokedSubmit as isAgentInvokedSubmit2,
+  respondWithAgentResult as respondWithAgentResult2,
+  WEBMCP_DECLARATIVE_FOCUS_STYLES,
+  ensureDeclarativeFocusStyles as ensureDeclarativeFocusStyles2
+} from "@tooluminati/diagnostics";
 import { jsx as jsx4 } from "react/jsx-runtime";
 function WebMcpForm({
   toolName,
@@ -754,12 +768,20 @@ function WebMcpTextarea(props) {
 }
 function useAgentInvokedSubmit(handler) {
   return (event) => {
-    const submitEvent = event.nativeEvent;
-    if (submitEvent.agentInvoked) {
+    if (isAgentInvokedSubmit(event.nativeEvent)) {
       handler(event);
     }
   };
 }
+function useAgentSubmitRespondWith(getResult) {
+  return (event) => {
+    const nativeEvent = event.nativeEvent;
+    if (!isAgentInvokedSubmit(nativeEvent) || typeof nativeEvent.respondWith !== "function") {
+      return;
+    }
+    respondWithAgentResult(nativeEvent, Promise.resolve().then(getResult));
+  };
+}
 function useDeclarativeFormToolEvents(_options = {}) {
 }
 
@@ -797,6 +819,7 @@ function useTroubleshootingPanelVisibility() {
   };
 }
 export {
+  WEBMCP_DECLARATIVE_FOCUS_STYLES,
   WebMcpErrorBoundary,
   WebMcpForm,
   WebMcpInput,
@@ -806,12 +829,16 @@ export {
   WebMcpTroubleshootingPanel,
   WebMcpTroubleshootingProvider,
   createFormSubmitBlockersProvider,
+  ensureDeclarativeFocusStyles2 as ensureDeclarativeFocusStyles,
   getPanelVisibilityController,
   hideWebMcpTroubleshootingPanel,
+  isAgentInvokedSubmit2 as isAgentInvokedSubmit,
   resetPanelVisibilityController,
+  respondWithAgentResult2 as respondWithAgentResult,
   showWebMcpTroubleshootingPanel,
   toggleWebMcpTroubleshootingPanel,
   useAgentInvokedSubmit,
+  useAgentSubmitRespondWith,
   useDeclarativeFormToolEvents,
   useFormSubmitBlockers,
   useTanStackQueryWebMcpTools,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tooluminati/react-troubleshooting",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "description": "React troubleshooting bundle with timeline, blockers, and dev panel.",
   "type": "module",
   "sideEffects": [
@@ -17,12 +17,12 @@
     }
   },
   "dependencies": {
-    "@tooluminati/core": "0.1.0",
-    "@tooluminati/react": "0.1.0",
-    "@tooluminati/diagnostics": "0.1.0",
-    "@tooluminati/policies": "0.1.0",
-    "@tooluminati/state": "0.1.0",
-    "@tooluminati/forms": "0.1.0"
+    "@tooluminati/core": "0.2.0",
+    "@tooluminati/diagnostics": "0.2.0",
+    "@tooluminati/policies": "0.2.0",
+    "@tooluminati/state": "0.2.0",
+    "@tooluminati/forms": "0.2.0",
+    "@tooluminati/react": "0.2.0"
   },
   "peerDependencies": {
     "react": ">=18.0.0",