@superblocksteam/library 2.0.69-next.2 → 2.0.70-next.0

package/dist/{devtools-consolidated-CfCo1nXs.js → devtools-consolidated-zKLoNTKB.js}

@@ -204,9 +204,9 @@ const CustomDevTools = observer(() => {
 });
 function initializeCustomDevTools() {
 	keyboardShortcutManager.startListening();
-	console.log("[CustomDevTools] Initialized - Press Ctrl+Shift+D (or Cmd+Shift+D) to open");
+	console.log("[internal] [CustomDevTools] Initialized - Press Ctrl+Shift+D (or Cmd+Shift+D) to open");
 }
 
 //#endregion
 export { CustomDevTools, initializeCustomDevTools, setRegisteredStores };
-//# sourceMappingURL=devtools-consolidated-CfCo1nXs.js.map
+//# sourceMappingURL=devtools-consolidated-zKLoNTKB.js.map

package/dist/{devtools-consolidated-CfCo1nXs.js.map → devtools-consolidated-zKLoNTKB.js.map}

@@ -1 +1 @@
-{"version":3,"file":"devtools-consolidated-CfCo1nXs.js","names":["result: any","registeredStores: Record<string, any>","overlayStyles: React.CSSProperties","panelStyles: React.CSSProperties","headerStyles: React.CSSProperties","closeButtonStyles: React.CSSProperties","contentStyles: React.CSSProperties","DevToolsPanelContent: React.FC","CustomDevTools: React.FC"],"sources":["../src/lib/internal-details/lib/devtools/serialize-store-data.tsx","../src/lib/internal-details/lib/devtools/devtools-consolidated.tsx"],"sourcesContent":["import { toJS } from \"mobx\";\n\nexport function serializeStoreData(\n  stores_: Record<string, any>,\n): Record<string, any> {\n  try {\n    const stores = toJS(stores_);\n    const seen = new Set();\n    function serialize(obj: any): any {\n      if (obj === null || typeof obj !== \"object\") {\n        return obj;\n      }\n\n      if (seen.has(obj)) {\n        return \"[Already Seen]\";\n      }\n\n      // Create new path for this branch of recursion\n      seen.add(obj);\n\n      if (Array.isArray(obj)) {\n        return obj.map(serialize);\n      }\n\n      const result: any = {};\n\n      for (const key of Object.keys(obj)) {\n        if (typeof obj[key] === \"function\") {\n          result[key] = \"[Function]\";\n        }\n\n        try {\n          const descriptor = Object.getOwnPropertyDescriptor(obj, key);\n          if (descriptor && descriptor.get) {\n            try {\n              result[key] = serialize(obj[key]);\n            } catch {\n              result[key] = \"[Getter Error]\";\n            }\n          } else {\n            result[key] = serialize(obj[key]);\n          }\n        } catch {\n          result[key] = \"[Access Error]\";\n        }\n      }\n\n      // Add type information\n      if (obj.constructor && obj.constructor.name !== \"Object\") {\n        result.__type__ = obj.constructor.name;\n      }\n\n      return result;\n    }\n\n    return serialize(stores);\n  } catch (error) {\n    return {\n      error: `Error serializing data: ${error instanceof Error ? error.message : \"Unknown error\"}`,\n    };\n  }\n}\n","import { makeAutoObservable } from \"mobx\";\nimport { observer } from \"mobx-react-lite\";\nimport React, { useCallback, useEffect } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { JsonView } from \"react-json-view-lite\";\nimport \"react-json-view-lite/dist/index.css\";\nimport { serializeStoreData } from \"./serialize-store-data.js\";\n\n// ============================================================================\n// STATE MANAGEMENT\n// ============================================================================\n\nclass DevToolsState {\n  isVisible = false;\n\n  constructor() {\n    makeAutoObservable(this);\n  }\n\n  show() {\n    this.isVisible = true;\n  }\n\n  hide() {\n    this.isVisible = false;\n  }\n\n  toggle() {\n    this.isVisible = !this.isVisible;\n  }\n}\n\nconst devToolsState = new DevToolsState();\n\n// ============================================================================\n// KEYBOARD SHORTCUT MANAGER\n// ============================================================================\n\nclass KeyboardShortcutManager {\n  private isListening = false;\n  private shortcutKeys = {\n    key: \"KeyD\",\n    ctrlKey: true,\n    shiftKey: true,\n    altKey: false,\n  };\n\n  constructor() {\n    this.handleKeyDown = this.handleKeyDown.bind(this);\n  }\n\n  private handleKeyDown(event: KeyboardEvent) {\n    const { ctrlKey, shiftKey, altKey, metaKey } = event;\n    const isModifierMatch = (ctrlKey || metaKey) && shiftKey && !altKey;\n    const isKeyMatch = event.code === this.shortcutKeys.key;\n    if (isModifierMatch && isKeyMatch) {\n      event.preventDefault();\n      event.stopPropagation();\n      devToolsState.toggle();\n    }\n  }\n\n  private handleEscapeKey = (event: KeyboardEvent) => {\n    if (event.key === \"Escape\" && devToolsState.isVisible) {\n      event.preventDefault();\n      devToolsState.hide();\n    }\n  };\n\n  startListening() {\n    if (this.isListening) return;\n\n    this.isListening = true;\n    document.addEventListener(\"keydown\", this.handleKeyDown, true);\n    document.addEventListener(\"keydown\", this.handleEscapeKey, true);\n  }\n\n  stopListening() {\n    if (!this.isListening) return;\n\n    this.isListening = false;\n    document.removeEventListener(\"keydown\", this.handleKeyDown, true);\n    document.removeEventListener(\"keydown\", this.handleEscapeKey, true);\n  }\n\n  updateShortcut(options: Partial<typeof this.shortcutKeys>) {\n    this.shortcutKeys = { ...this.shortcutKeys, ...options };\n  }\n}\n\nconst keyboardShortcutManager = new KeyboardShortcutManager();\n\n// ============================================================================\n// STORE ACCESS\n// ============================================================================\n\n// This will be populated by the registerStores function\nlet registeredStores: Record<string, any> = {};\n\nexport function setRegisteredStores(stores: Record<string, any>) {\n  registeredStores = stores;\n}\n\nfunction getRegisteredStores() {\n  return registeredStores;\n}\n\n// ============================================================================\n// DEVTOOLS PANEL COMPONENT\n// ============================================================================\n\nconst overlayStyles: React.CSSProperties = {\n  position: \"fixed\",\n  top: 0,\n  left: 0,\n  right: 0,\n  bottom: 0,\n  backgroundColor: \"rgba(0, 0, 0, 0.5)\",\n  zIndex: 9999,\n};\n\nconst panelStyles: React.CSSProperties = {\n  position: \"fixed\",\n  top: \"50%\",\n  left: \"50%\",\n  transform: \"translate(-50%, -50%)\",\n  width: \"90vw\",\n  height: \"90vh\",\n  backgroundColor: \"#fff\",\n  zIndex: 10000,\n  display: \"flex\",\n  flexDirection: \"column\",\n  borderRadius: 12,\n};\n\nconst headerStyles: React.CSSProperties = {\n  padding: 12,\n  borderBottom: \"1px solid #ccc\",\n  display: \"flex\",\n  justifyContent: \"space-between\",\n  alignItems: \"center\",\n};\n\nconst closeButtonStyles: React.CSSProperties = {\n  background: \"none\",\n  border: \"none\",\n  cursor: \"pointer\",\n};\n\nconst contentStyles: React.CSSProperties = {\n  padding: 8,\n  display: \"flex\",\n  flex: 1,\n  overflow: \"auto\",\n  flexDirection: \"column\",\n};\n\nconst DevToolsPanelContent: React.FC = observer(() => {\n  const stores = getRegisteredStores();\n  const storeNames = Object.keys(stores);\n\n  const serializedData = serializeStoreData(stores);\n  const onClose = useCallback(() => {\n    devToolsState.hide();\n  }, []);\n\n  return createPortal(\n    <>\n      <div style={overlayStyles} onClick={onClose} />\n      <div style={panelStyles}>\n        <div style={headerStyles}>\n          <h3>\n            MobX DevTools ({storeNames.length} store\n            {storeNames.length !== 1 ? \"s\" : \"\"})\n          </h3>\n          <button\n            style={closeButtonStyles}\n            onClick={onClose}\n            title=\"Close (ESC)\"\n          >\n            ×\n          </button>\n        </div>\n        {storeNames.length === 0 ? (\n          <div>No stores registered yet.</div>\n        ) : (\n          <div style={contentStyles}>\n            <JsonView\n              data={serializedData}\n              clickToExpandNode={true}\n              shouldExpandNode={(level) => level < 2}\n            />\n          </div>\n        )}\n      </div>\n    </>,\n    document.body,\n  );\n});\n\n// ============================================================================\n// PROVIDER COMPONENT\n// ============================================================================\n\nexport const CustomDevTools: React.FC = observer(() => {\n  useEffect(() => {\n    if (devToolsState.isVisible) {\n      const handleEscape = (event: KeyboardEvent) => {\n        if (event.key === \"Escape\") {\n          devToolsState.hide();\n        }\n      };\n      document.addEventListener(\"keydown\", handleEscape);\n      return () => document.removeEventListener(\"keydown\", handleEscape);\n    }\n  }, []);\n\n  if (!devToolsState.isVisible) {\n    return null;\n  }\n\n  return <DevToolsPanelContent />;\n});\n\n// ============================================================================\n// INITIALIZATION\n// ============================================================================\n\nexport function initializeCustomDevTools() {\n  keyboardShortcutManager.startListening();\n  console.log(\n    \"[CustomDevTools] Initialized - Press Ctrl+Shift+D (or Cmd+Shift+D) to open\",\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"devtools-consolidated-zKLoNTKB.js","names":["result: any","registeredStores: Record<string, any>","overlayStyles: React.CSSProperties","panelStyles: React.CSSProperties","headerStyles: React.CSSProperties","closeButtonStyles: React.CSSProperties","contentStyles: React.CSSProperties","DevToolsPanelContent: React.FC","CustomDevTools: React.FC"],"sources":["../src/lib/internal-details/lib/devtools/serialize-store-data.tsx","../src/lib/internal-details/lib/devtools/devtools-consolidated.tsx"],"sourcesContent":["import { toJS } from \"mobx\";\n\nexport function serializeStoreData(\n  stores_: Record<string, any>,\n): Record<string, any> {\n  try {\n    const stores = toJS(stores_);\n    const seen = new Set();\n    function serialize(obj: any): any {\n      if (obj === null || typeof obj !== \"object\") {\n        return obj;\n      }\n\n      if (seen.has(obj)) {\n        return \"[Already Seen]\";\n      }\n\n      // Create new path for this branch of recursion\n      seen.add(obj);\n\n      if (Array.isArray(obj)) {\n        return obj.map(serialize);\n      }\n\n      const result: any = {};\n\n      for (const key of Object.keys(obj)) {\n        if (typeof obj[key] === \"function\") {\n          result[key] = \"[Function]\";\n        }\n\n        try {\n          const descriptor = Object.getOwnPropertyDescriptor(obj, key);\n          if (descriptor && descriptor.get) {\n            try {\n              result[key] = serialize(obj[key]);\n            } catch {\n              result[key] = \"[Getter Error]\";\n            }\n          } else {\n            result[key] = serialize(obj[key]);\n          }\n        } catch {\n          result[key] = \"[Access Error]\";\n        }\n      }\n\n      // Add type information\n      if (obj.constructor && obj.constructor.name !== \"Object\") {\n        result.__type__ = obj.constructor.name;\n      }\n\n      return result;\n    }\n\n    return serialize(stores);\n  } catch (error) {\n    return {\n      error: `Error serializing data: ${error instanceof Error ? error.message : \"Unknown error\"}`,\n    };\n  }\n}\n","import { makeAutoObservable } from \"mobx\";\nimport { observer } from \"mobx-react-lite\";\nimport React, { useCallback, useEffect } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { JsonView } from \"react-json-view-lite\";\nimport \"react-json-view-lite/dist/index.css\";\nimport { serializeStoreData } from \"./serialize-store-data.js\";\n\n// ============================================================================\n// STATE MANAGEMENT\n// ============================================================================\n\nclass DevToolsState {\n  isVisible = false;\n\n  constructor() {\n    makeAutoObservable(this);\n  }\n\n  show() {\n    this.isVisible = true;\n  }\n\n  hide() {\n    this.isVisible = false;\n  }\n\n  toggle() {\n    this.isVisible = !this.isVisible;\n  }\n}\n\nconst devToolsState = new DevToolsState();\n\n// ============================================================================\n// KEYBOARD SHORTCUT MANAGER\n// ============================================================================\n\nclass KeyboardShortcutManager {\n  private isListening = false;\n  private shortcutKeys = {\n    key: \"KeyD\",\n    ctrlKey: true,\n    shiftKey: true,\n    altKey: false,\n  };\n\n  constructor() {\n    this.handleKeyDown = this.handleKeyDown.bind(this);\n  }\n\n  private handleKeyDown(event: KeyboardEvent) {\n    const { ctrlKey, shiftKey, altKey, metaKey } = event;\n    const isModifierMatch = (ctrlKey || metaKey) && shiftKey && !altKey;\n    const isKeyMatch = event.code === this.shortcutKeys.key;\n    if (isModifierMatch && isKeyMatch) {\n      event.preventDefault();\n      event.stopPropagation();\n      devToolsState.toggle();\n    }\n  }\n\n  private handleEscapeKey = (event: KeyboardEvent) => {\n    if (event.key === \"Escape\" && devToolsState.isVisible) {\n      event.preventDefault();\n      devToolsState.hide();\n    }\n  };\n\n  startListening() {\n    if (this.isListening) return;\n\n    this.isListening = true;\n    document.addEventListener(\"keydown\", this.handleKeyDown, true);\n    document.addEventListener(\"keydown\", this.handleEscapeKey, true);\n  }\n\n  stopListening() {\n    if (!this.isListening) return;\n\n    this.isListening = false;\n    document.removeEventListener(\"keydown\", this.handleKeyDown, true);\n    document.removeEventListener(\"keydown\", this.handleEscapeKey, true);\n  }\n\n  updateShortcut(options: Partial<typeof this.shortcutKeys>) {\n    this.shortcutKeys = { ...this.shortcutKeys, ...options };\n  }\n}\n\nconst keyboardShortcutManager = new KeyboardShortcutManager();\n\n// ============================================================================\n// STORE ACCESS\n// ============================================================================\n\n// This will be populated by the registerStores function\nlet registeredStores: Record<string, any> = {};\n\nexport function setRegisteredStores(stores: Record<string, any>) {\n  registeredStores = stores;\n}\n\nfunction getRegisteredStores() {\n  return registeredStores;\n}\n\n// ============================================================================\n// DEVTOOLS PANEL COMPONENT\n// ============================================================================\n\nconst overlayStyles: React.CSSProperties = {\n  position: \"fixed\",\n  top: 0,\n  left: 0,\n  right: 0,\n  bottom: 0,\n  backgroundColor: \"rgba(0, 0, 0, 0.5)\",\n  zIndex: 9999,\n};\n\nconst panelStyles: React.CSSProperties = {\n  position: \"fixed\",\n  top: \"50%\",\n  left: \"50%\",\n  transform: \"translate(-50%, -50%)\",\n  width: \"90vw\",\n  height: \"90vh\",\n  backgroundColor: \"#fff\",\n  zIndex: 10000,\n  display: \"flex\",\n  flexDirection: \"column\",\n  borderRadius: 12,\n};\n\nconst headerStyles: React.CSSProperties = {\n  padding: 12,\n  borderBottom: \"1px solid #ccc\",\n  display: \"flex\",\n  justifyContent: \"space-between\",\n  alignItems: \"center\",\n};\n\nconst closeButtonStyles: React.CSSProperties = {\n  background: \"none\",\n  border: \"none\",\n  cursor: \"pointer\",\n};\n\nconst contentStyles: React.CSSProperties = {\n  padding: 8,\n  display: \"flex\",\n  flex: 1,\n  overflow: \"auto\",\n  flexDirection: \"column\",\n};\n\nconst DevToolsPanelContent: React.FC = observer(() => {\n  const stores = getRegisteredStores();\n  const storeNames = Object.keys(stores);\n\n  const serializedData = serializeStoreData(stores);\n  const onClose = useCallback(() => {\n    devToolsState.hide();\n  }, []);\n\n  return createPortal(\n    <>\n      <div style={overlayStyles} onClick={onClose} />\n      <div style={panelStyles}>\n        <div style={headerStyles}>\n          <h3>\n            MobX DevTools ({storeNames.length} store\n            {storeNames.length !== 1 ? \"s\" : \"\"})\n          </h3>\n          <button\n            style={closeButtonStyles}\n            onClick={onClose}\n            title=\"Close (ESC)\"\n          >\n            ×\n          </button>\n        </div>\n        {storeNames.length === 0 ? (\n          <div>No stores registered yet.</div>\n        ) : (\n          <div style={contentStyles}>\n            <JsonView\n              data={serializedData}\n              clickToExpandNode={true}\n              shouldExpandNode={(level) => level < 2}\n            />\n          </div>\n        )}\n      </div>\n    </>,\n    document.body,\n  );\n});\n\n// ============================================================================\n// PROVIDER COMPONENT\n// ============================================================================\n\nexport const CustomDevTools: React.FC = observer(() => {\n  useEffect(() => {\n    if (devToolsState.isVisible) {\n      const handleEscape = (event: KeyboardEvent) => {\n        if (event.key === \"Escape\") {\n          devToolsState.hide();\n        }\n      };\n      document.addEventListener(\"keydown\", handleEscape);\n      return () => document.removeEventListener(\"keydown\", handleEscape);\n    }\n  }, []);\n\n  if (!devToolsState.isVisible) {\n    return null;\n  }\n\n  return <DevToolsPanelContent />;\n});\n\n// ============================================================================\n// INITIALIZATION\n// ============================================================================\n\nexport function initializeCustomDevTools() {\n  keyboardShortcutManager.startListening();\n  console.log(\n    \"[internal] [CustomDevTools] Initialized - Press Ctrl+Shift+D (or Cmd+Shift+D) to open\",\n  );\n}\n"],"mappings":"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"}

package/dist/{early-console-buffer-T4skeGWJ.js → early-console-buffer-D4wVuyBf.js}

@@ -67,7 +67,7 @@ var LibraryEarlyConsoleBuffer = class LibraryEarlyConsoleBuffer {
 		});
 	}
 	enableOpenTelemetry(otelLogger) {
-		console.info("[EarlyConsoleBuffer] Enabling OpenTelemetry integration");
+		console.info("[internal] [EarlyConsoleBuffer] Enabling OpenTelemetry integration");
 		this.otelLogger = otelLogger;
 		this.flushBuffer();
 	}
@@ -75,15 +75,15 @@ var LibraryEarlyConsoleBuffer = class LibraryEarlyConsoleBuffer {
 		if (!this.otelLogger) return;
 		const bufferCount = this.buffer.length;
 		if (bufferCount === 0) {
-			console.info("[EarlyConsoleBuffer] No buffered logs to flush");
+			console.info("[internal] [EarlyConsoleBuffer] No buffered logs to flush");
 			return;
 		}
-		console.info(`[EarlyConsoleBuffer] Flushing ${bufferCount} buffered logs to OpenTelemetry`);
+		console.info(`[internal] [EarlyConsoleBuffer] Flushing ${bufferCount} buffered logs to OpenTelemetry`);
 		this.buffer.forEach((entry) => {
 			this.sendToOpenTelemetry(entry.level, entry.args, entry.timestamp, true);
 		});
 		this.buffer = [];
-		console.info(`[EarlyConsoleBuffer] Successfully sent ${bufferCount} buffered logs to OpenTelemetry logger`);
+		console.info(`[internal] [EarlyConsoleBuffer] Successfully sent ${bufferCount} buffered logs to OpenTelemetry logger`);
 	}
 	sendToOpenTelemetry(level, args, timestamp, fromBuffer) {
 		if (!this.otelLogger) return;
@@ -133,4 +133,4 @@ var early_console_buffer_default = LibraryEarlyConsoleBuffer;
 
 //#endregion
 export { consoleLogAttributes as n, early_console_buffer_default as t };
-//# sourceMappingURL=early-console-buffer-T4skeGWJ.js.map
+//# sourceMappingURL=early-console-buffer-D4wVuyBf.js.map

package/dist/early-console-buffer-D4wVuyBf.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"early-console-buffer-D4wVuyBf.js","names":["attributes: Record<string, any>"],"sources":["../src/lib/tracing/console-logging.ts","../src/lib/tracing/early-console-buffer.ts"],"sourcesContent":["// The attributes that should be passed to OTEL logs as part of the message context.\n// To use, use consoleLogAttributes() to create an instance of this class, and pass as an argument to console.* methods.\nexport class ConsoleLogAttributes {\n  constructor(public readonly attributes: Record<string, any>) {}\n\n  // Optional: Add validation or transformation\n  static create(attrs: Record<string, any>): ConsoleLogAttributes {\n    return new ConsoleLogAttributes(attrs);\n  }\n}\n\n// Convenience factory\nexport const consoleLogAttributes = (\n  attrs: Record<string, any>,\n): ConsoleLogAttributes => {\n  return new ConsoleLogAttributes(attrs);\n};\n","import { SeverityNumber } from \"@opentelemetry/api-logs\";\nimport { ConsoleLogAttributes } from \"./console-logging.js\";\nimport type { Logger as OTelLogger } from \"@opentelemetry/api-logs\";\n\ninterface LogEntry {\n  level: \"log\" | \"info\" | \"warn\" | \"error\" | \"debug\";\n  args: any[];\n  timestamp: number;\n}\n\nfunction mergeAllConsoleLogAttributes(\n  args: any[],\n): Record<string, any> | undefined {\n  if (args.length === 0) return undefined;\n\n  return args.reduce((merged, arg) => {\n    if (arg instanceof ConsoleLogAttributes) {\n      return { ...merged, ...arg.attributes };\n    }\n    return merged;\n  }, {});\n}\n\nclass LibraryEarlyConsoleBuffer {\n  private static instance: LibraryEarlyConsoleBuffer;\n  private buffer: LogEntry[] = [];\n  private maxBufferSize = 1000;\n  private originalMethods: Record<string, (...args: any[]) => void> = {};\n  private otelLogger?: OTelLogger = undefined;\n  private isPatched = false;\n\n  static getInstance(): LibraryEarlyConsoleBuffer {\n    if (!LibraryEarlyConsoleBuffer.instance) {\n      LibraryEarlyConsoleBuffer.instance = new LibraryEarlyConsoleBuffer();\n    }\n    return LibraryEarlyConsoleBuffer.instance;\n  }\n\n  // Patch console methods immediately with buffering\n  patchEarly(): void {\n    if (this.isPatched) return;\n\n    // Store original methods\n    this.originalMethods.log = console.log.bind(console);\n    this.originalMethods.info = console.info.bind(console);\n    this.originalMethods.debug = console.debug.bind(console);\n    this.originalMethods.warn = console.warn.bind(console);\n    this.originalMethods.error = console.error.bind(console);\n\n    // Replace with buffering versions\n    this.patchMethod(\"log\");\n    this.patchMethod(\"info\");\n    this.patchMethod(\"debug\");\n    this.patchMethod(\"warn\");\n    this.patchMethod(\"error\");\n\n    this.isPatched = true;\n  }\n\n  private patchMethod(level: string): void {\n    const originalMethod = this.originalMethods[level];\n\n    (console as any)[level] = (...args: any[]) => {\n      // Always call original method for dev experience\n      originalMethod(...args);\n\n      // Buffer for OpenTelemetry\n      this.bufferLog(level as any, args);\n\n      // Send to OpenTelemetry if available\n      if (this.otelLogger) {\n        this.sendToOpenTelemetry(level as any, args);\n      }\n    };\n  }\n\n  private bufferLog(level: LogEntry[\"level\"], args: any[]): void {\n    if (this.buffer.length >= this.maxBufferSize) {\n      this.buffer.shift(); // Remove oldest entry\n    }\n\n    this.buffer.push({\n      level,\n      args,\n      timestamp: Date.now(),\n    });\n  }\n\n  enableOpenTelemetry(otelLogger: OTelLogger): void {\n    console.info(\n      \"[internal] [EarlyConsoleBuffer] Enabling OpenTelemetry integration\",\n    );\n    this.otelLogger = otelLogger;\n    this.flushBuffer();\n  }\n\n  private flushBuffer(): void {\n    if (!this.otelLogger) return;\n\n    const bufferCount = this.buffer.length;\n    if (bufferCount === 0) {\n      console.info(\"[internal] [EarlyConsoleBuffer] No buffered logs to flush\");\n      return;\n    }\n\n    console.info(\n      `[internal] [EarlyConsoleBuffer] Flushing ${bufferCount} buffered logs to OpenTelemetry`,\n    );\n\n    this.buffer.forEach((entry) => {\n      this.sendToOpenTelemetry(entry.level, entry.args, entry.timestamp, true); // true = from buffer\n    });\n\n    this.buffer = []; // Clear buffer\n    console.info(\n      `[internal] [EarlyConsoleBuffer] Successfully sent ${bufferCount} buffered logs to OpenTelemetry logger`,\n    );\n  }\n\n  private sendToOpenTelemetry(\n    level: LogEntry[\"level\"],\n    args: any[],\n    timestamp?: number,\n    fromBuffer?: boolean,\n  ): void {\n    if (!this.otelLogger) return;\n\n    const severityMap = {\n      debug: SeverityNumber.DEBUG,\n      log: SeverityNumber.INFO,\n      info: SeverityNumber.INFO,\n      warn: SeverityNumber.WARN,\n      error: SeverityNumber.ERROR,\n    };\n\n    // Only add 'source' attribute if this log came from the buffer flush\n    const attributes = {\n      ...(fromBuffer && { source: \"early-console-buffer\" }),\n      ...mergeAllConsoleLogAttributes(args),\n    };\n\n    this.otelLogger.emit({\n      severityNumber: severityMap[level],\n      severityText: level,\n      body: this.formatConsoleArgs(args),\n      timestamp: timestamp,\n      attributes,\n    });\n  }\n\n  private formatConsoleArgs(args: any[]): string {\n    return args\n      .filter((arg) => !(arg instanceof ConsoleLogAttributes))\n      .map((arg) => {\n        if (typeof arg === \"string\") return arg;\n        if (arg === null) return \"null\";\n        if (arg === undefined) return \"undefined\";\n        if (typeof arg === \"object\") {\n          try {\n            return JSON.stringify(arg, null, 2);\n          } catch {\n            return \"[object Object]\";\n          }\n        }\n        return String(arg);\n      })\n      .join(\" \");\n  }\n\n  // Method to check if we have buffered logs (for testing/debugging)\n  getBufferSize(): number {\n    return this.buffer.length;\n  }\n\n  // Method to check if console is patched (for testing/debugging)\n  isConsolePatched(): boolean {\n    return this.isPatched;\n  }\n\n  // Method to check if OpenTelemetry is enabled (for testing/debugging)\n  isOpenTelemetryEnabled(): boolean {\n    return this.otelLogger !== undefined;\n  }\n}\n\nexport default LibraryEarlyConsoleBuffer;\n"],"mappings":"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"}

package/dist/jsx-dev-runtime/index.js

@@ -1,4 +1,4 @@
-import { S as api_hmr_tracker_default, _ as root_store_default, t as makeWrappedComponent } from "../jsx-wrapper-CuenCDCW.js";
+import { S as api_hmr_tracker_default, _ as root_store_default, t as makeWrappedComponent } from "../jsx-wrapper-DZ9RpgLV.js";
 import "../utils-Clb3lSiX.js";
 import { SOURCE_ID_ATTRIBUTE } from "@superblocksteam/library-shared";
 import * as ReactJsxDevRuntime from "react/jsx-dev-runtime";

package/dist/{jsx-wrapper-CuenCDCW.js → jsx-wrapper-DZ9RpgLV.js}

@@ -736,7 +736,9 @@ var DeployedParentBridge = class {
 	sendAiLoaderState(_shouldShowLoader) {}
 	sendRuntimeError(_data) {}
 	sendClearRuntimeError(_id) {}
+	sendConsoleLog(_data) {}
 	setInteractionMode(_mode) {}
+	sendCaptureScreenshotResponse(_callbackId, _dataUrl, _error) {}
 };
 
 //#endregion
@@ -1051,16 +1053,22 @@ var SuperblocksEditorBridge = class SuperblocksEditorBridge {
 			payload: { message }
 		});
 	}
-	sendRuntimeError(data) {
+	sendRuntimeError(data, forceSend = false) {
 		this.sendImmediate({
 			type: "runtime-error",
 			payload: data
-		});
+		}, forceSend);
 	}
-	sendClearRuntimeError(id) {
+	sendClearRuntimeError(id, forceSend = false) {
 		this.sendImmediate({
 			type: "clear-runtime-error",
 			payload: { id }
+		}, forceSend);
+	}
+	sendConsoleLog(data) {
+		this.sendImmediate({
+			type: "console-log",
+			payload: data
 		});
 	}
 	setInteractionMode(mode) {
@@ -1069,6 +1077,16 @@ var SuperblocksEditorBridge = class SuperblocksEditorBridge {
 			payload: { interactionMode: mode }
 		});
 	}
+	sendCaptureScreenshotResponse(callbackId, dataUrl, error) {
+		this.sendImmediate({
+			type: "capture-screenshot-response",
+			payload: {
+				callbackId,
+				dataUrl,
+				error
+			}
+		});
+	}
 	queueMessage(message, mergeOptions) {
 		if (!this.connectedToParent) this.messagesToSend.push({
 			payload: message,
@@ -1613,7 +1631,7 @@ function resolveById(id, payload) {
 			rejectorMap.delete(id);
 		}
 	} catch (e) {
-		console.log("Error resolving promise", e);
+		console.log("[internal] [resolveById] Error resolving promise", e);
 	}
 }
 function rejectById(id, payload) {
@@ -1628,10 +1646,124 @@ function rejectById(id, payload) {
 			rejectorMap.delete(id);
 		}
 	} catch (e) {
-		console.log("Error rejecting promise", e);
+		console.log("[internal] [rejectById] Error rejecting promise", e);
 	}
 }
 
+//#endregion
+//#region src/lib/internal-details/lib/features/api-activity-tracker.ts
+/**
+* Tracks in-flight API requests to enable waiting for APIs to settle
+* before capturing screenshots. This is used by the screenshot handler
+* to avoid capturing loading states.
+*/
+const API_ACTIVITY_EVENT = "sb-api-activity-changed";
+var ApiActivityTracker = class {
+	inFlightTokens = /* @__PURE__ */ new Set();
+	lastActivityTime = Date.now();
+	eventTarget = new EventTarget();
+	/**
+	* Call when an API request starts.
+	* Returns a unique token that must be passed to trackEnd().
+	*/
+	trackStart() {
+		const token = Symbol("api-request");
+		this.inFlightTokens.add(token);
+		this.lastActivityTime = Date.now();
+		console.log(`[ApiActivityTracker] API started. In-flight count: ${this.inFlightTokens.size}`);
+		this.emitChange();
+		return token;
+	}
+	/**
+	* Call when an API request completes (success, error, or cancellation).
+	* The token must match the one returned by trackStart().
+	* Calling with an unknown or already-ended token is a no-op (guards against double trackEnd).
+	*/
+	trackEnd(token) {
+		if (!this.inFlightTokens.has(token)) return;
+		this.inFlightTokens.delete(token);
+		this.lastActivityTime = Date.now();
+		console.log(`[ApiActivityTracker] API finished. In-flight count: ${this.inFlightTokens.size}`);
+		this.emitChange();
+	}
+	/**
+	* Get the current in-flight count.
+	*/
+	get inFlightCount() {
+		return this.inFlightTokens.size;
+	}
+	/**
+	* Get the current API activity state.
+	*/
+	getState() {
+		return {
+			inFlightCount: this.inFlightTokens.size,
+			lastActivityTime: this.lastActivityTime
+		};
+	}
+	/**
+	* Check if there are any in-flight API requests.
+	*/
+	isIdle() {
+		return this.inFlightTokens.size === 0;
+	}
+	/**
+	* Wait for all APIs to become idle, with a timeout.
+	* Resolves when either:
+	* - All in-flight requests complete
+	* - The timeout is reached
+	*
+	* @param timeoutMs Maximum time to wait (default: 10000ms)
+	* @returns Promise that resolves with { timedOut: boolean }
+	*/
+	waitForIdle(timeoutMs = 1e4) {
+		return new Promise((resolve) => {
+			if (this.isIdle()) {
+				console.log(`[ApiActivityTracker] waitForIdle: Already idle, resolving immediately`);
+				resolve({ timedOut: false });
+				return;
+			}
+			console.log(`[ApiActivityTracker] waitForIdle: Waiting for ${this.inFlightTokens.size} in-flight request(s) to complete (timeout: ${timeoutMs}ms)`);
+			let resolved = false;
+			const timeoutId = setTimeout(() => {
+				if (resolved) return;
+				if (this.isIdle()) {
+					resolved = true;
+					this.eventTarget.removeEventListener(API_ACTIVITY_EVENT, handleChange);
+					console.log(`[ApiActivityTracker] waitForIdle: All APIs now idle, proceeding`);
+					resolve({ timedOut: false });
+					return;
+				}
+				console.warn(`[ApiActivityTracker] Timeout waiting for APIs to become idle after ${timeoutMs}ms. ${this.inFlightTokens.size} request(s) still in flight.`);
+				this.eventTarget.removeEventListener(API_ACTIVITY_EVENT, handleChange);
+				resolve({ timedOut: true });
+			}, timeoutMs);
+			const handleChange = () => {
+				if (resolved) return;
+				if (this.isIdle()) {
+					resolved = true;
+					clearTimeout(timeoutId);
+					this.eventTarget.removeEventListener(API_ACTIVITY_EVENT, handleChange);
+					console.log(`[ApiActivityTracker] waitForIdle: All APIs now idle, proceeding`);
+					resolve({ timedOut: false });
+				}
+			};
+			this.eventTarget.addEventListener(API_ACTIVITY_EVENT, handleChange);
+		});
+	}
+	/**
+	* Reset the tracker state. Useful for testing.
+	*/
+	reset() {
+		this.inFlightTokens.clear();
+		this.lastActivityTime = Date.now();
+	}
+	emitChange() {
+		this.eventTarget.dispatchEvent(new Event(API_ACTIVITY_EVENT));
+	}
+};
+const apiActivityTracker = new ApiActivityTracker();
+
 //#endregion
 //#region src/lib/internal-details/lib/features/api-hmr-tracker.ts
 var ApiHmrTracker = class ApiHmrTracker {
@@ -1678,6 +1810,9 @@ var ApiHmrTracker = class ApiHmrTracker {
 	incReloadCount() {
 		this.reloadCount++;
 	}
+	dontSkipUntilNextReload() {
+		this.propagatedReloadCount = Math.max(this.propagatedReloadCount, this.reloadCount);
+	}
 	mountLikeTimer = null;
 	reportJSXActivity() {
 		const reloadCount = this.reloadCount;
@@ -1775,7 +1910,7 @@ async function executeV2Api(params) {
 	} catch (err) {
 		const message = `Failed to execute ${apiName || "API"}. ${err}`;
 		const suppressError = viewMode !== ViewMode.EDITOR && err?.code === 20;
-		if (notifyOnSystemError && !suppressError) console.log(message);
+		if (notifyOnSystemError && !suppressError) console.log(`[internal] [executeV2Api] ${message}`);
 		return {
 			systemError: message,
 			statusCode: err instanceof HttpError ? err.code : void 0
@@ -1834,7 +1969,7 @@ const stream = async ({ url, headers, body, onMessage, onComplete, onError, defa
 			done = readerDone && lastChunk === "";
 		}
 	} catch (e) {
-		if (e.name === "AbortError") console.log("Fetch was cancelled");
+		if (e.name === "AbortError") console.log("[internal] [stream] Fetch was cancelled");
 		else onError(e.message ?? defaultError, e.code);
 	} finally {
 		onComplete();
@@ -2015,9 +2150,14 @@ var ApiManager = class {
 	accessToken;
 	runningApiControllers = {};
 	waitForInitApiPromise = void 0;
+	waitForBootstrapPromise = void 0;
+	resolveBootstrapPromise = void 0;
 	callContexts = {};
 	constructor(rootStore) {
 		this.rootStore = rootStore;
+		this.waitForBootstrapPromise = new Promise((resolve) => {
+			this.resolveBootstrapPromise = resolve;
+		});
 	}
 	set agentUrls(urls) {
 		this._agentUrls = urls;
@@ -2041,6 +2181,12 @@ var ApiManager = class {
 	async awaitInitApiIfNeeded() {
 		if (this.waitForInitApiPromise) await this.waitForInitApiPromise;
 	}
+	async awaitBootstrapIfNeeded() {
+		if (this.waitForBootstrapPromise) await this.waitForBootstrapPromise;
+	}
+	notifyBootstrapComplete() {
+		if (this.resolveBootstrapPromise) this.resolveBootstrapPromise();
+	}
 	loadApiManifest({ apis = {} }) {
 		const apisToSet = Object.values(apis).map(({ api, scopeId }) => {
 			api.apiPb.metadata.id = api.apiPb.metadata.name;
@@ -2096,6 +2242,7 @@ var ApiManager = class {
 			hasCallback: !!callback
 		});
 		await this.awaitInitApiIfNeeded();
+		await this.awaitBootstrapIfNeeded();
 		const apiName = path.match(/^\/apis\/([^/]+)\/api\.yaml$/)?.[1];
 		if (!apiName) {
 			console.error("[api-store] Invalid path:", path);
@@ -2104,23 +2251,28 @@ var ApiManager = class {
 		console.debug("[api-store.runApiByPath] Extracted apiName:", apiName);
 		editorBridge.setApiStarted(apiName);
 		console.debug("[api-store.runApiByPath] Executing API internally...");
-		const result = await this.executeApi({
-			apiId: apiName,
-			apiName,
-			path,
-			inputs,
-			options: inputs ?? {},
-			callId,
-			isTestRun,
-			callback,
-			injectedCallerId
-		});
-		console.debug("[api-store.runApiByPath] Execution complete, calling setApiResponse for:", apiName);
-		editorBridge.setApiResponse(apiName, result.parsedResult);
-		return {
-			data: result.data,
-			error: result.error
-		};
+		const activityToken = isEditMode() ? apiActivityTracker.trackStart() : void 0;
+		try {
+			const result = await this.executeApi({
+				apiId: apiName,
+				apiName,
+				path,
+				inputs,
+				options: inputs ?? {},
+				callId,
+				isTestRun,
+				callback,
+				injectedCallerId
+			});
+			console.debug("[api-store.runApiByPath] Execution complete, calling setApiResponse for:", apiName);
+			editorBridge.setApiResponse(apiName, result.parsedResult);
+			return {
+				data: result.data,
+				error: result.error
+			};
+		} finally {
+			if (activityToken) apiActivityTracker.trackEnd(activityToken);
+		}
 	}
 	getHMRCallHash(params) {
 		return `${params.injectedCallerId ?? ""}-${params.apiId}`;
@@ -3512,5 +3664,5 @@ const useJSXContext = () => {
 };
 
 //#endregion
-export { useSuperblocksUser as A, Section as B, rejectById as C, useSuperblocksContext as D, getAppMode as E, isEmbeddedBySuperblocksFirstParty as F, getEditStore as H, isEditMode as I, createManagedPropsList as L, colors as M, editorBridge as N, useSuperblocksGroups as O, iframeMessageHandler as P, Prop as R, api_hmr_tracker_default as S, SuperblocksContextProvider as T, createPropertiesPanelDefinition as V, root_store_default as _, FixWithClarkButton as a, createIframeSpan as b, ErrorContent as c, ErrorMessage as d, ErrorStack as f, StyledClarkIcon as g, SecondaryButton as h, getWidgetRectAnchorName as i, sendNotification as j, useSuperblocksProfiles as k, ErrorDetails as l, ErrorTitle as m, useJSXContext as n, ActionsContainer as o, ErrorSummary as p, getWidgetAnchorName as r, ErrorContainer as s, makeWrappedComponent as t, ErrorIconContainer as u, startEditorSync as v, resolveById as w, getContextFromTraceHeaders as x, generateId as y, PropsCategory as z };
-//# sourceMappingURL=jsx-wrapper-CuenCDCW.js.map
+export { useSuperblocksProfiles as A, PropsCategory as B, apiActivityTracker as C, getAppMode as D, SuperblocksContextProvider as E, iframeMessageHandler as F, createPropertiesPanelDefinition as H, isEmbeddedBySuperblocksFirstParty as I, isEditMode as L, sendNotification as M, colors as N, useSuperblocksContext as O, editorBridge as P, createManagedPropsList as R, api_hmr_tracker_default as S, resolveById as T, getEditStore as U, Section as V, root_store_default as _, FixWithClarkButton as a, createIframeSpan as b, ErrorContent as c, ErrorMessage as d, ErrorStack as f, StyledClarkIcon as g, SecondaryButton as h, getWidgetRectAnchorName as i, useSuperblocksUser as j, useSuperblocksGroups as k, ErrorDetails as l, ErrorTitle as m, useJSXContext as n, ActionsContainer as o, ErrorSummary as p, getWidgetAnchorName as r, ErrorContainer as s, makeWrappedComponent as t, ErrorIconContainer as u, startEditorSync as v, rejectById as w, getContextFromTraceHeaders as x, generateId as y, Prop as z };
+//# sourceMappingURL=jsx-wrapper-DZ9RpgLV.js.map