@superblocksteam/library 2.0.54 → 2.0.56-next.0

package/dist/{devtools-consolidated-BJ2tPWBk.js → devtools-consolidated-Dm9AFGZs.js}

@@ -1,6 +1,6 @@
 import React, { useCallback, useEffect } from "react";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { makeAutoObservable, toJS } from "mobx";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { observer } from "mobx-react-lite";
 import { createPortal } from "react-dom";
 import { JsonView } from "react-json-view-lite";
@@ -209,4 +209,4 @@ function initializeCustomDevTools() {
 
 //#endregion
 export { CustomDevTools, initializeCustomDevTools, setRegisteredStores };
-//# sourceMappingURL=devtools-consolidated-BJ2tPWBk.js.map
+//# sourceMappingURL=devtools-consolidated-Dm9AFGZs.js.map

package/dist/{devtools-consolidated-BJ2tPWBk.js.map → devtools-consolidated-Dm9AFGZs.js.map}

@@ -1 +1 @@
-{"version":3,"file":"devtools-consolidated-BJ2tPWBk.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-Dm9AFGZs.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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"}

package/dist/{early-console-buffer-Bd5jqqBJ.js → early-console-buffer-SSPd-jq2.js}

@@ -106,4 +106,4 @@ var early_console_buffer_default = LibraryEarlyConsoleBuffer;
 
 //#endregion
 export { early_console_buffer_default as t };
-//# sourceMappingURL=early-console-buffer-Bd5jqqBJ.js.map
+//# sourceMappingURL=early-console-buffer-SSPd-jq2.js.map

package/dist/{early-console-buffer-Bd5jqqBJ.js.map → early-console-buffer-SSPd-jq2.js.map}

@@ -1 +1 @@
-{"version":3,"file":"early-console-buffer-Bd5jqqBJ.js","names":[],"sources":["../src/lib/tracing/early-console-buffer.ts"],"sourcesContent":["import { SeverityNumber } from \"@opentelemetry/api-logs\";\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\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(\"[EarlyConsoleBuffer] Enabling OpenTelemetry integration\");\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(\"[EarlyConsoleBuffer] No buffered logs to flush\");\n      return;\n    }\n\n    console.info(\n      `[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      `[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    };\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      .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":";;;AASA,IAAM,4BAAN,MAAM,0BAA0B;CAC9B,OAAe;CACf,AAAQ,SAAqB,EAAE;CAC/B,AAAQ,gBAAgB;CACxB,AAAQ,kBAA4D,EAAE;CACtE,AAAQ,aAA0B;CAClC,AAAQ,YAAY;CAEpB,OAAO,cAAyC;AAC9C,MAAI,CAAC,0BAA0B,SAC7B,2BAA0B,WAAW,IAAI,2BAA2B;AAEtE,SAAO,0BAA0B;;CAInC,aAAmB;AACjB,MAAI,KAAK,UAAW;AAGpB,OAAK,gBAAgB,MAAM,QAAQ,IAAI,KAAK,QAAQ;AACpD,OAAK,gBAAgB,OAAO,QAAQ,KAAK,KAAK,QAAQ;AACtD,OAAK,gBAAgB,QAAQ,QAAQ,MAAM,KAAK,QAAQ;AACxD,OAAK,gBAAgB,OAAO,QAAQ,KAAK,KAAK,QAAQ;AACtD,OAAK,gBAAgB,QAAQ,QAAQ,MAAM,KAAK,QAAQ;AAGxD,OAAK,YAAY,MAAM;AACvB,OAAK,YAAY,OAAO;AACxB,OAAK,YAAY,QAAQ;AACzB,OAAK,YAAY,OAAO;AACxB,OAAK,YAAY,QAAQ;AAEzB,OAAK,YAAY;;CAGnB,AAAQ,YAAY,OAAqB;EACvC,MAAM,iBAAiB,KAAK,gBAAgB;AAE5C,EAAC,QAAgB,UAAU,GAAG,SAAgB;AAE5C,kBAAe,GAAG,KAAK;AAGvB,QAAK,UAAU,OAAc,KAAK;AAGlC,OAAI,KAAK,WACP,MAAK,oBAAoB,OAAc,KAAK;;;CAKlD,AAAQ,UAAU,OAA0B,MAAmB;AAC7D,MAAI,KAAK,OAAO,UAAU,KAAK,cAC7B,MAAK,OAAO,OAAO;AAGrB,OAAK,OAAO,KAAK;GACf;GACA;GACA,WAAW,KAAK,KAAK;GACtB,CAAC;;CAGJ,oBAAoB,YAA8B;AAChD,UAAQ,KAAK,0DAA0D;AACvE,OAAK,aAAa;AAClB,OAAK,aAAa;;CAGpB,AAAQ,cAAoB;AAC1B,MAAI,CAAC,KAAK,WAAY;EAEtB,MAAM,cAAc,KAAK,OAAO;AAChC,MAAI,gBAAgB,GAAG;AACrB,WAAQ,KAAK,iDAAiD;AAC9D;;AAGF,UAAQ,KACN,iCAAiC,YAAY,iCAC9C;AAED,OAAK,OAAO,SAAS,UAAU;AAC7B,QAAK,oBAAoB,MAAM,OAAO,MAAM,MAAM,MAAM,WAAW,KAAK;IACxE;AAEF,OAAK,SAAS,EAAE;AAChB,UAAQ,KACN,0CAA0C,YAAY,wCACvD;;CAGH,AAAQ,oBACN,OACA,MACA,WACA,YACM;AACN,MAAI,CAAC,KAAK,WAAY;EAEtB,MAAM,cAAc;GAClB,OAAO,eAAe;GACtB,KAAK,eAAe;GACpB,MAAM,eAAe;GACrB,MAAM,eAAe;GACrB,OAAO,eAAe;GACvB;EAGD,MAAM,aAAa,EACjB,GAAI,cAAc,EAAE,QAAQ,wBAAwB,EACrD;AAED,OAAK,WAAW,KAAK;GACnB,gBAAgB,YAAY;GAC5B,cAAc;GACd,MAAM,KAAK,kBAAkB,KAAK;GACvB;GACX;GACD,CAAC;;CAGJ,AAAQ,kBAAkB,MAAqB;AAC7C,SAAO,KACJ,KAAK,QAAQ;AACZ,OAAI,OAAO,QAAQ,SAAU,QAAO;AACpC,OAAI,QAAQ,KAAM,QAAO;AACzB,OAAI,QAAQ,OAAW,QAAO;AAC9B,OAAI,OAAO,QAAQ,SACjB,KAAI;AACF,WAAO,KAAK,UAAU,KAAK,MAAM,EAAE;WAC7B;AACN,WAAO;;AAGX,UAAO,OAAO,IAAI;IAClB,CACD,KAAK,IAAI;;CAId,gBAAwB;AACtB,SAAO,KAAK,OAAO;;CAIrB,mBAA4B;AAC1B,SAAO,KAAK;;CAId,yBAAkC;AAChC,SAAO,KAAK,eAAe;;;AAI/B,mCAAe"}
+{"version":3,"file":"early-console-buffer-SSPd-jq2.js","names":[],"sources":["../src/lib/tracing/early-console-buffer.ts"],"sourcesContent":["import { SeverityNumber } from \"@opentelemetry/api-logs\";\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\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(\"[EarlyConsoleBuffer] Enabling OpenTelemetry integration\");\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(\"[EarlyConsoleBuffer] No buffered logs to flush\");\n      return;\n    }\n\n    console.info(\n      `[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      `[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    };\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      .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":";;;AASA,IAAM,4BAAN,MAAM,0BAA0B;CAC9B,OAAe;CACf,AAAQ,SAAqB,EAAE;CAC/B,AAAQ,gBAAgB;CACxB,AAAQ,kBAA4D,EAAE;CACtE,AAAQ,aAA0B;CAClC,AAAQ,YAAY;CAEpB,OAAO,cAAyC;AAC9C,MAAI,CAAC,0BAA0B,SAC7B,2BAA0B,WAAW,IAAI,2BAA2B;AAEtE,SAAO,0BAA0B;;CAInC,aAAmB;AACjB,MAAI,KAAK,UAAW;AAGpB,OAAK,gBAAgB,MAAM,QAAQ,IAAI,KAAK,QAAQ;AACpD,OAAK,gBAAgB,OAAO,QAAQ,KAAK,KAAK,QAAQ;AACtD,OAAK,gBAAgB,QAAQ,QAAQ,MAAM,KAAK,QAAQ;AACxD,OAAK,gBAAgB,OAAO,QAAQ,KAAK,KAAK,QAAQ;AACtD,OAAK,gBAAgB,QAAQ,QAAQ,MAAM,KAAK,QAAQ;AAGxD,OAAK,YAAY,MAAM;AACvB,OAAK,YAAY,OAAO;AACxB,OAAK,YAAY,QAAQ;AACzB,OAAK,YAAY,OAAO;AACxB,OAAK,YAAY,QAAQ;AAEzB,OAAK,YAAY;;CAGnB,AAAQ,YAAY,OAAqB;EACvC,MAAM,iBAAiB,KAAK,gBAAgB;AAE5C,EAAC,QAAgB,UAAU,GAAG,SAAgB;AAE5C,kBAAe,GAAG,KAAK;AAGvB,QAAK,UAAU,OAAc,KAAK;AAGlC,OAAI,KAAK,WACP,MAAK,oBAAoB,OAAc,KAAK;;;CAKlD,AAAQ,UAAU,OAA0B,MAAmB;AAC7D,MAAI,KAAK,OAAO,UAAU,KAAK,cAC7B,MAAK,OAAO,OAAO;AAGrB,OAAK,OAAO,KAAK;GACf;GACA;GACA,WAAW,KAAK,KAAK;GACtB,CAAC;;CAGJ,oBAAoB,YAA8B;AAChD,UAAQ,KAAK,0DAA0D;AACvE,OAAK,aAAa;AAClB,OAAK,aAAa;;CAGpB,AAAQ,cAAoB;AAC1B,MAAI,CAAC,KAAK,WAAY;EAEtB,MAAM,cAAc,KAAK,OAAO;AAChC,MAAI,gBAAgB,GAAG;AACrB,WAAQ,KAAK,iDAAiD;AAC9D;;AAGF,UAAQ,KACN,iCAAiC,YAAY,iCAC9C;AAED,OAAK,OAAO,SAAS,UAAU;AAC7B,QAAK,oBAAoB,MAAM,OAAO,MAAM,MAAM,MAAM,WAAW,KAAK;IACxE;AAEF,OAAK,SAAS,EAAE;AAChB,UAAQ,KACN,0CAA0C,YAAY,wCACvD;;CAGH,AAAQ,oBACN,OACA,MACA,WACA,YACM;AACN,MAAI,CAAC,KAAK,WAAY;EAEtB,MAAM,cAAc;GAClB,OAAO,eAAe;GACtB,KAAK,eAAe;GACpB,MAAM,eAAe;GACrB,MAAM,eAAe;GACrB,OAAO,eAAe;GACvB;EAGD,MAAM,aAAa,EACjB,GAAI,cAAc,EAAE,QAAQ,wBAAwB,EACrD;AAED,OAAK,WAAW,KAAK;GACnB,gBAAgB,YAAY;GAC5B,cAAc;GACd,MAAM,KAAK,kBAAkB,KAAK;GACvB;GACX;GACD,CAAC;;CAGJ,AAAQ,kBAAkB,MAAqB;AAC7C,SAAO,KACJ,KAAK,QAAQ;AACZ,OAAI,OAAO,QAAQ,SAAU,QAAO;AACpC,OAAI,QAAQ,KAAM,QAAO;AACzB,OAAI,QAAQ,OAAW,QAAO;AAC9B,OAAI,OAAO,QAAQ,SACjB,KAAI;AACF,WAAO,KAAK,UAAU,KAAK,MAAM,EAAE;WAC7B;AACN,WAAO;;AAGX,UAAO,OAAO,IAAI;IAClB,CACD,KAAK,IAAI;;CAId,gBAAwB;AACtB,SAAO,KAAK,OAAO;;CAIrB,mBAA4B;AAC1B,SAAO,KAAK;;CAId,yBAAkC;AAChC,SAAO,KAAK,eAAe;;;AAI/B,mCAAe"}

package/dist/jsx-dev-runtime/index.d.ts

@@ -0,0 +1,14 @@
+//#region src/jsx-dev-runtime/jsx-dev-runtime.d.ts
+declare global {
+  interface Window {
+    __SUPERBLOCKS_EDIT_MODE__?: boolean;
+    _SB_VIEW_MODE?: string;
+  }
+}
+declare function jsxDEV(type: any, props: any, key: any, isStaticChildren: any, source: any, self: any): any;
+//#endregion
+//#region src/jsx-dev-runtime/index.d.ts
+declare const Fragment: any;
+//#endregion
+export { Fragment, jsxDEV };
+//# sourceMappingURL=index.d.ts.map

package/dist/jsx-dev-runtime/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../src/jsx-dev-runtime/jsx-dev-runtime.ts","../../src/jsx-dev-runtime/index.ts"],"sourcesContent":[],"mappings":";;;IAiEgB,yBAAM,CAAA,EAAA,OAAA;;;;AC/DT,iBD+DG,MAAA,CC/D4C,IAAA,EAAA,GAAA,EAAA,KAAA,EAAA,GAAA,EAAA,GAAA,EAAA,GAAA,EAAA,gBAAA,EAAA,GAAA,EAAA,MAAA,EAAA,GAAA,EAAA,IAAA,EAAA,GAAA,CAAA,EAAA,GAAA;;;cAA/C"}

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

@@ -0,0 +1,329 @@
+import { C as generateId, L as isEditMode$1, M as colors, N as editorBridge, g as root_store_default, m as SecondaryButton, r as FixWithClarkButton, t as getWidgetAnchorName } from "../widget-wrapper-naming-ChBggw6W.js";
+import "../utils-AzBGeVXo.js";
+import * as ReactJsxDevRuntime from "react/jsx-dev-runtime";
+import { NO_SELECT_ATTRIBUTE, SELECTOR_ID_ATTRIBUTE, SOURCE_ID_ATTRIBUTE } from "@superblocksteam/library-shared";
+import React, { Component, useEffect, useMemo, useRef } from "react";
+import { reaction } from "mobx";
+import styled, { keyframes } from "styled-components";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Observer } from "mobx-react-lite";
+import polyfill from "@oddbird/css-anchor-positioning/fn";
+
+//#region src/lib/internal-details/css-constants.ts
+const CSS_CLASSES = {
+	SUSPENSE_FALLBACK: "sb-suspense-fallback",
+	ANCHOR_NAME: "sb-anchor-name"
+};
+
+//#endregion
+//#region src/lib/internal-details/lib/suspense/suspense-fallback.tsx
+const shimmerAnimation = keyframes`
+  0% {
+    background-position: -200px 0;
+  }
+  100% {
+    background-position: calc(200px + 100%) 0;
+  }
+`;
+const ShimmerDiv = styled.div`
+  min-height: 12px;
+  min-width: 12px;
+  background-color: ${(props) => props.$backgroundColor};
+  border-radius: ${(props) => props.$borderRadius};
+  position: relative;
+  overflow: hidden;
+  background: linear-gradient(
+    90deg,
+    ${(props) => props.$backgroundColor} 25%,
+    ${(props) => props.$shimmerHighlight} 50%,
+    ${(props) => props.$backgroundColor} 75%
+  );
+  background-size: max(100%, 200px) 100%;
+  animation: ${shimmerAnimation} 5s infinite linear;
+`;
+/**
+* Default fallback component displayed while components are suspended.
+*/
+function SuspenseFallback({ style, className, noBorderRadius }) {
+	const backgroundColor = "#f8f9fa";
+	const shimmerHighlight = "#ffffff";
+	const borderRadius = noBorderRadius ? "0px" : "4px";
+	const classes = useMemo(() => [CSS_CLASSES.ANCHOR_NAME, className].filter(Boolean).join(" "), [className]);
+	return /* @__PURE__ */ jsx(ShimmerDiv, {
+		$backgroundColor: backgroundColor,
+		$shimmerHighlight: shimmerHighlight,
+		$borderRadius: borderRadius,
+		style: style?.(),
+		className: classes,
+		"data-test": "suspense-fallback"
+	});
+}
+
+//#endregion
+//#region src/lib/user-facing/component-base/error-boundary.tsx
+const ErrorBoundaryContainer = styled.div`
+  background: white;
+  padding: 10px;
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  border: 1px solid ${colors.GREY_100};
+  border-left: 3px solid ${colors.RED_500};
+  border-radius: 4px;
+  width: 100%;
+  color: ${colors.GREY_700};
+`;
+const ErrorDetailsContainer = styled.div`
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+`;
+const ErrorActionsContainer = styled.div`
+  display: flex;
+  justify-content: flex-end;
+  align-items: center;
+  gap: 8px;
+`;
+var ErrorBoundary = class extends Component {
+	state = {
+		id: generateId(),
+		hasError: false
+	};
+	disposeAutoReset;
+	static getDerivedStateFromError(e) {
+		const error = e instanceof Error ? e : new Error(typeof e === "object" && e !== null ? JSON.stringify(e) : String(e));
+		return {
+			id: generateId(),
+			hasError: true,
+			error
+		};
+	}
+	componentDidCatch(error, errorInfo) {
+		console.error("Uncaught error:", error, errorInfo);
+		if (isEditMode$1()) root_store_default.editStore?.ai.handleRuntimeError({
+			id: this.state.id,
+			error: String(error),
+			errorInfo,
+			identifier: this.props.identifier
+		});
+	}
+	reset = () => {
+		if (isEditMode$1()) root_store_default.editStore?.ai.clearRuntimeError(this.state.id);
+		this.setState({
+			hasError: false,
+			error: void 0
+		});
+	};
+	componentWillUnmount() {
+		if (this.state.hasError && isEditMode$1()) root_store_default.editStore?.ai.clearRuntimeError(this.state.id);
+		this.disposeAutoReset?.();
+	}
+	handleFixWithClarkInitiated = () => {
+		const ai = root_store_default.editStore?.ai;
+		if (!ai) return;
+		this.disposeAutoReset?.();
+		this.disposeAutoReset = void 0;
+		let sawStart = ai.getIsEditing();
+		this.disposeAutoReset = reaction(() => ai.getIsEditing(), (isEditing) => {
+			if (!sawStart && isEditing) sawStart = true;
+			if (sawStart && !isEditing) {
+				this.reset();
+				this.disposeAutoReset?.();
+				this.disposeAutoReset = void 0;
+			}
+		}, {
+			fireImmediately: true,
+			name: "error-boundary-ai-auto-reset"
+		});
+	};
+	handleFixWithAi() {
+		const { identifier } = this.props;
+		if (identifier) editorBridge.addComponentToAiContext(identifier.sourceId, identifier.selectorId);
+		let prompt = `Fix this error: `;
+		if (this.state.error?.stack) {
+			const lines = this.state.error.stack.split("\n");
+			const nodeModulesIndex = lines.findIndex((line) => line.includes("node_modules"));
+			const relevantLines = nodeModulesIndex > -1 ? lines.slice(0, nodeModulesIndex) : lines;
+			prompt += relevantLines.slice(0, 5).join("\n");
+		} else prompt += this.state.error?.toString();
+		editorBridge.aiGenerate(prompt);
+	}
+	render() {
+		if (this.state.hasError) return /* @__PURE__ */ jsx(Observer, { children: () => {
+			if (root_store_default.editStore?.ai.getIsEditing() ?? false) return /* @__PURE__ */ jsx(SuspenseFallback, {});
+			return /* @__PURE__ */ jsxs(ErrorBoundaryContainer, { children: [/* @__PURE__ */ jsxs(ErrorDetailsContainer, { children: [/* @__PURE__ */ jsx("h3", { children: this.props.header || "Something went wrong." }), /* @__PURE__ */ jsxs("details", {
+				style: { fontSize: "0.8em" },
+				children: [/* @__PURE__ */ jsx("summary", {
+					style: { paddingLeft: "0.25rem" },
+					children: "Error details"
+				}), /* @__PURE__ */ jsx("div", {
+					style: {
+						marginTop: "0.5rem",
+						maxWidth: "100%",
+						overflowX: "auto",
+						scrollbarWidth: "thin"
+					},
+					children: /* @__PURE__ */ jsx("pre", {
+						style: { color: "gray" },
+						children: /* @__PURE__ */ jsx("code", { children: this.state.error?.stack ? this.state.error.stack : this.state.error?.toString() })
+					})
+				})]
+			})] }), /* @__PURE__ */ jsxs(ErrorActionsContainer, { children: [isEditMode$1() && /* @__PURE__ */ jsx(FixWithClarkButton, {
+				onClick: this.handleFixWithClarkInitiated,
+				error: this.state.error,
+				identifier: this.props.identifier
+			}), /* @__PURE__ */ jsx(SecondaryButton, {
+				onClick: this.reset,
+				children: "Try again"
+			})] })] });
+		} });
+		return this.props.children;
+	}
+};
+var error_boundary_default = ErrorBoundary;
+
+//#endregion
+//#region src/edit-mode/edit-wrapper.tsx
+if (typeof window !== "undefined" && typeof document.documentElement !== "undefined" && !("anchorName" in document.documentElement.style)) polyfill();
+const createAnchorNameStyle = (props) => {
+	return { "--anchor-name": getWidgetAnchorName(props.selectorId) };
+};
+
+//#endregion
+//#region src/edit-mode/instance-tracker.ts
+/**
+* Tracks and recycles instance numbers for each sourceId to generate stable, unique selector IDs.
+* When components unmount, their instance numbers are released and can be reused.
+*/
+var InstanceTracker = class {
+	sourceIdToUsedInstances = /* @__PURE__ */ new Map();
+	getNextAvailableInstance(sourceId) {
+		const usedInstances = this.sourceIdToUsedInstances.get(sourceId) ?? /* @__PURE__ */ new Set();
+		let instance = 0;
+		while (usedInstances.has(instance)) instance++;
+		usedInstances.add(instance);
+		this.sourceIdToUsedInstances.set(sourceId, usedInstances);
+		return instance;
+	}
+	releaseInstance(sourceId, instance) {
+		const usedInstances = this.sourceIdToUsedInstances.get(sourceId);
+		if (usedInstances) {
+			usedInstances.delete(instance);
+			if (usedInstances.size === 0) this.sourceIdToUsedInstances.delete(sourceId);
+		}
+	}
+};
+const instanceTracker = new InstanceTracker();
+
+//#endregion
+//#region src/edit-mode/jsx-wrapper.tsx
+const JSXContext = React.createContext({ selectorId: "S-<unknown>" });
+const makeWrappedComponent = (type) => {
+	const isTag = typeof type === "string";
+	const isRegisteredSbComponent = root_store_default.componentRegistry.hasComponent(type);
+	const Component$1 = React.forwardRef((props, ref) => {
+		const { selectorId: parentSelectorId } = useJSXContext();
+		const sourceId = props[SOURCE_ID_ATTRIBUTE];
+		const noSelect = props[NO_SELECT_ATTRIBUTE];
+		const instanceNumberRef = useRef();
+		const selectorId = useRef("S-<unknown>");
+		if (selectorId.current === "S-<unknown>") {
+			instanceNumberRef.current = instanceTracker.getNextAvailableInstance(sourceId);
+			selectorId.current = `S-x-${sourceId}-${instanceNumberRef.current}`;
+		}
+		useEffect(() => {
+			root_store_default.editStore?.runtimeTrackingStore.registerComponent(selectorId.current, {
+				sourceId,
+				type,
+				parentSelectorId,
+				isSbComponent: isRegisteredSbComponent,
+				isHtmlElement: isTag,
+				noSelect
+			});
+			return () => {
+				root_store_default.editStore?.runtimeTrackingStore.unregisterComponent(selectorId.current);
+				if (instanceNumberRef.current !== void 0) instanceTracker.releaseInstance(sourceId, instanceNumberRef.current);
+			};
+		}, []);
+		useEffect(() => {
+			root_store_default.editStore?.runtimeTrackingStore.updatePropsForComponent(selectorId.current, props);
+		}, [props]);
+		const jsxContext = useMemo(() => ({ selectorId: selectorId.current }), []);
+		const selectorProps = { [SELECTOR_ID_ATTRIBUTE]: selectorId.current };
+		if (parentSelectorId) selectorProps["data-sb-parent-selector-id"] = parentSelectorId;
+		const style = useMemo(() => {
+			return {
+				...props.style,
+				...createAnchorNameStyle({ selectorId: selectorId.current })
+			};
+		}, [props.style]);
+		const element = React.createElement(type, {
+			ref,
+			...props,
+			...selectorProps,
+			className: ["sb-anchor-name", props.className].filter(Boolean).join(" "),
+			style
+		});
+		if (!root_store_default.editStore?.isInitialized) return element;
+		return /* @__PURE__ */ jsx(JSXContext.Provider, {
+			value: jsxContext,
+			children: /* @__PURE__ */ jsx(error_boundary_default, { children: element })
+		});
+	});
+	try {
+		Component$1.displayName = typeof type === "string" ? type : type.displayName || type.name || "Component";
+	} catch (e) {
+		console.error("Error setting displayName", e);
+	}
+	return Component$1;
+};
+const useJSXContext = () => {
+	return React.useContext(JSXContext);
+};
+
+//#endregion
+//#region src/jsx-dev-runtime/jsx-dev-runtime.ts
+const reactJsxDEV = ReactJsxDevRuntime.jsxDEV;
+function isEditMode() {
+	if (typeof window === "undefined") return false;
+	if (window.__SUPERBLOCKS_EDIT_MODE__ !== void 0) return window.__SUPERBLOCKS_EDIT_MODE__;
+	if (window._SB_VIEW_MODE === "dev") {
+		window.__SUPERBLOCKS_EDIT_MODE__ = true;
+		return true;
+	}
+	const isEdit = false;
+	window.__SUPERBLOCKS_EDIT_MODE__ = isEdit;
+	return isEdit;
+}
+const objTypeCache = /* @__PURE__ */ new WeakMap();
+const stringTypeCache = /* @__PURE__ */ new Map();
+function getOrSetCachedWrappedComponent(type) {
+	const typeIsObject = (typeof type === "object" || typeof type === "function") && type !== null;
+	const cachedType = typeIsObject ? objTypeCache.get(type) : stringTypeCache.get(type);
+	if (cachedType) return cachedType;
+	const newComponent = makeWrappedComponent(type);
+	if (typeIsObject) objTypeCache.set(type, newComponent);
+	else stringTypeCache.set(type, newComponent);
+	return newComponent;
+}
+const shouldWrapTagType = (type) => {
+	if (typeof type === "string") return root_store_default.componentRegistry.hasComponent(type);
+	return type != null && (typeof type === "object" || typeof type === "function");
+};
+function jsxDEV(type, props, key, isStaticChildren, source, self) {
+	const sourceId = props?.[SOURCE_ID_ATTRIBUTE];
+	try {
+		if (sourceId && isEditMode() && shouldWrapTagType(type)) return reactJsxDEV(getOrSetCachedWrappedComponent(type), props, `${key}-${sourceId}`, isStaticChildren, source, self);
+	} catch (e) {
+		console.error("Error during JSX wrap", e);
+	}
+	return reactJsxDEV(type, props, key, isStaticChildren, source, self);
+}
+
+//#endregion
+//#region src/jsx-dev-runtime/index.ts
+const Fragment = ReactJsxDevRuntime.Fragment;
+
+//#endregion
+export { Fragment, jsxDEV };
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["isEditMode","rootStore","rootStore","Component","selectorProps: Record<string, string>","ErrorBoundary","rootStore"],"sources":["../../src/lib/internal-details/css-constants.ts","../../src/lib/internal-details/lib/suspense/suspense-fallback.tsx","../../src/lib/user-facing/component-base/error-boundary.tsx","../../src/edit-mode/edit-wrapper.tsx","../../src/edit-mode/instance-tracker.ts","../../src/edit-mode/jsx-wrapper.tsx","../../src/jsx-dev-runtime/jsx-dev-runtime.ts","../../src/jsx-dev-runtime/index.ts"],"sourcesContent":["export const CSS_CLASSES = {\n  SUSPENSE_FALLBACK: \"sb-suspense-fallback\",\n  ANCHOR_NAME: \"sb-anchor-name\",\n} as const;\n","import { useMemo, type CSSProperties, type ReactNode } from \"react\";\nimport styled, { keyframes } from \"styled-components\";\nimport { CSS_CLASSES } from \"../../css-constants.js\";\n\ninterface Props {\n  children?: ReactNode;\n  className?: string;\n  style?: () => CSSProperties;\n  noBorderRadius?: boolean;\n}\n\nconst shimmerAnimation = keyframes`\n  0% {\n    background-position: -200px 0;\n  }\n  100% {\n    background-position: calc(200px + 100%) 0;\n  }\n`;\n\nconst ShimmerDiv = styled.div<{\n  $backgroundColor: string;\n  $shimmerHighlight: string;\n  $borderRadius: string;\n}>`\n  min-height: 12px;\n  min-width: 12px;\n  background-color: ${(props) => props.$backgroundColor};\n  border-radius: ${(props) => props.$borderRadius};\n  position: relative;\n  overflow: hidden;\n  background: linear-gradient(\n    90deg,\n    ${(props) => props.$backgroundColor} 25%,\n    ${(props) => props.$shimmerHighlight} 50%,\n    ${(props) => props.$backgroundColor} 75%\n  );\n  background-size: max(100%, 200px) 100%;\n  animation: ${shimmerAnimation} 5s infinite linear;\n`;\n\n/**\n * Default fallback component displayed while components are suspended.\n */\nexport function SuspenseFallback({ style, className, noBorderRadius }: Props) {\n  const backgroundColor = \"#f8f9fa\";\n  const shimmerHighlight = \"#ffffff\";\n  const borderRadius = noBorderRadius ? \"0px\" : \"4px\";\n\n  const classes = useMemo(\n    () => [CSS_CLASSES.ANCHOR_NAME, className].filter(Boolean).join(\" \"),\n    [className],\n  );\n\n  return (\n    <ShimmerDiv\n      $backgroundColor={backgroundColor}\n      $shimmerHighlight={shimmerHighlight}\n      $borderRadius={borderRadius}\n      style={style?.()}\n      className={classes}\n      data-test=\"suspense-fallback\"\n    />\n  );\n}\n","import { reaction, type IReactionDisposer } from \"mobx\";\nimport { Observer } from \"mobx-react-lite\";\nimport React, { Component } from \"react\";\nimport styled from \"styled-components\";\nimport { editorBridge } from \"../../../edit-mode/superblocks-editor-bridge.js\";\nimport { SecondaryButton } from \"../../internal-details/internal-components/common.js\";\nimport { FixWithClarkButton } from \"../../internal-details/internal-components/fix-with-clark-button.jsx\";\nimport { isEditMode } from \"../../internal-details/is-edit-mode.js\";\nimport rootStore from \"../../internal-details/lib/root-store.js\";\nimport { SuspenseFallback } from \"../../internal-details/lib/suspense/suspense-fallback.js\";\nimport { generateId } from \"../../utils/generate-id.js\";\nimport { colors } from \"../styling/colors.js\";\nimport type { IdentifierInfo } from \"../../internal-details/types.js\";\n\nimport type { ErrorInfo, ReactNode } from \"react\";\n\nconst ErrorBoundaryContainer = styled.div`\n  background: white;\n  padding: 10px;\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  border: 1px solid ${colors.GREY_100};\n  border-left: 3px solid ${colors.RED_500};\n  border-radius: 4px;\n  width: 100%;\n  color: ${colors.GREY_700};\n`;\n\nconst ErrorDetailsContainer = styled.div`\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n`;\n\nconst ErrorActionsContainer = styled.div`\n  display: flex;\n  justify-content: flex-end;\n  align-items: center;\n  gap: 8px;\n`;\n\ninterface Props {\n  children: ReactNode;\n  header?: string;\n  identifier?: IdentifierInfo;\n}\n\ninterface State {\n  id: string;\n  hasError: boolean;\n  error?: Error;\n}\n\nclass ErrorBoundary extends Component<Props, State> {\n  state: State = {\n    id: generateId(),\n    hasError: false,\n  };\n\n  private disposeAutoReset?: IReactionDisposer;\n\n  static getDerivedStateFromError(e: Error): State {\n    const error =\n      e instanceof Error\n        ? e\n        : new Error(\n            typeof e === \"object\" && e !== null ? JSON.stringify(e) : String(e),\n          );\n    return {\n      id: generateId(),\n      hasError: true,\n      error,\n    };\n  }\n\n  componentDidCatch(error: Error, errorInfo: ErrorInfo) {\n    console.error(\"Uncaught error:\", error, errorInfo);\n    if (isEditMode()) {\n      rootStore.editStore?.ai.handleRuntimeError({\n        id: this.state.id,\n        error: String(error),\n        errorInfo,\n        identifier: this.props.identifier,\n      });\n    }\n  }\n\n  reset = () => {\n    if (isEditMode()) {\n      rootStore.editStore?.ai.clearRuntimeError(this.state.id);\n    }\n    this.setState({ hasError: false, error: undefined });\n  };\n\n  componentWillUnmount() {\n    // Clear runtime error if component unmounts while in error state\n    if (this.state.hasError && isEditMode()) {\n      rootStore.editStore?.ai.clearRuntimeError(this.state.id);\n    }\n    // Clean up auto-reset watcher if still pending\n    this.disposeAutoReset?.();\n  }\n\n  handleFixWithClarkInitiated = () => {\n    const ai = rootStore.editStore?.ai;\n    if (!ai) return;\n\n    // Clean up any existing watcher\n    this.disposeAutoReset?.();\n    this.disposeAutoReset = undefined;\n\n    // Set up one-shot watcher for AI completion\n    let sawStart = ai.getIsEditing();\n    this.disposeAutoReset = reaction(\n      () => ai.getIsEditing(),\n      (isEditing) => {\n        if (!sawStart && isEditing) {\n          sawStart = true;\n        }\n        if (sawStart && !isEditing) {\n          this.reset();\n          this.disposeAutoReset?.();\n          this.disposeAutoReset = undefined;\n        }\n      },\n      { fireImmediately: true, name: \"error-boundary-ai-auto-reset\" },\n    );\n  };\n\n  handleFixWithAi() {\n    const { identifier } = this.props;\n\n    if (identifier) {\n      editorBridge.addComponentToAiContext(\n        identifier.sourceId,\n        identifier.selectorId,\n      );\n    }\n\n    let prompt = `Fix this error: `;\n\n    if (this.state.error?.stack) {\n      const lines = this.state.error.stack.split(\"\\n\");\n      const nodeModulesIndex = lines.findIndex((line) =>\n        line.includes(\"node_modules\"),\n      );\n      const relevantLines =\n        nodeModulesIndex > -1 ? lines.slice(0, nodeModulesIndex) : lines;\n\n      prompt += relevantLines.slice(0, 5).join(\"\\n\");\n    } else {\n      prompt += this.state.error?.toString();\n    }\n\n    editorBridge.aiGenerate(prompt);\n  }\n\n  render() {\n    if (this.state.hasError) {\n      return (\n        <Observer>\n          {() => {\n            // Check if AI is currently generating\n            const isAIGenerating =\n              rootStore.editStore?.ai.getIsEditing() ?? false;\n\n            if (isAIGenerating) {\n              // During AI generation, show shimmer loader\n              // Error is already reported to AI in componentDidCatch\n              return <SuspenseFallback />;\n            }\n\n            // When AI is not generating, show full error UI\n            return (\n              <ErrorBoundaryContainer>\n                <ErrorDetailsContainer>\n                  <h3>{this.props.header || \"Something went wrong.\"}</h3>\n                  <details style={{ fontSize: \"0.8em\" }}>\n                    <summary style={{ paddingLeft: \"0.25rem\" }}>\n                      Error details\n                    </summary>\n                    <div\n                      style={{\n                        marginTop: \"0.5rem\",\n                        maxWidth: \"100%\",\n                        overflowX: \"auto\",\n                        scrollbarWidth: \"thin\",\n                      }}\n                    >\n                      <pre\n                        style={{\n                          color: \"gray\",\n                        }}\n                      >\n                        <code>\n                          {this.state.error?.stack\n                            ? this.state.error.stack\n                            : this.state.error?.toString()}\n                        </code>\n                      </pre>\n                    </div>\n                  </details>\n                </ErrorDetailsContainer>\n                <ErrorActionsContainer>\n                  {isEditMode() && (\n                    <FixWithClarkButton\n                      onClick={this.handleFixWithClarkInitiated}\n                      error={this.state.error}\n                      identifier={this.props.identifier}\n                    />\n                  )}\n                  <SecondaryButton onClick={this.reset}>\n                    Try again\n                  </SecondaryButton>\n                </ErrorActionsContainer>\n              </ErrorBoundaryContainer>\n            );\n          }}\n        </Observer>\n      );\n    }\n    return this.props.children;\n  }\n}\n\nexport default ErrorBoundary;\n","import polyfill from \"@oddbird/css-anchor-positioning/fn\";\n\nimport { getWidgetAnchorName } from \"../lib/utils/widget-wrapper-naming.js\";\n\nimport type { SbSelector } from \"@superblocksteam/library-shared/types\";\nimport type React from \"react\";\nimport type { CSSProperties } from \"react\";\n\nif (\n  typeof window !== \"undefined\" &&\n  typeof document.documentElement !== \"undefined\" &&\n  !(\"anchorName\" in document.documentElement.style)\n) {\n  polyfill();\n}\n\n// The variable --anchor-name is used in the CSS to set the anchor name for the widget\n// on the actual widget element.\nexport const createAnchorNameStyle = (props: {\n  selectorId: SbSelector;\n}): React.CSSProperties | undefined => {\n  return {\n    \"--anchor-name\": getWidgetAnchorName(props.selectorId),\n  } as CSSProperties;\n};\n","/**\n * Tracks and recycles instance numbers for each sourceId to generate stable, unique selector IDs.\n * When components unmount, their instance numbers are released and can be reused.\n */\nclass InstanceTracker {\n  private sourceIdToUsedInstances = new Map<string, Set<number>>();\n\n  getNextAvailableInstance(sourceId: string): number {\n    const usedInstances =\n      this.sourceIdToUsedInstances.get(sourceId) ?? new Set();\n\n    // Find the smallest unused instance number\n    let instance = 0;\n    while (usedInstances.has(instance)) {\n      instance++;\n    }\n\n    usedInstances.add(instance);\n    this.sourceIdToUsedInstances.set(sourceId, usedInstances);\n\n    return instance;\n  }\n\n  releaseInstance(sourceId: string, instance: number): void {\n    const usedInstances = this.sourceIdToUsedInstances.get(sourceId);\n    if (usedInstances) {\n      usedInstances.delete(instance);\n      if (usedInstances.size === 0) {\n        this.sourceIdToUsedInstances.delete(sourceId);\n      }\n    }\n  }\n}\n\nexport const instanceTracker = new InstanceTracker();\n","import {\n  NO_SELECT_ATTRIBUTE,\n  SELECTOR_ID_ATTRIBUTE,\n  SOURCE_ID_ATTRIBUTE,\n} from \"@superblocksteam/library-shared\";\nimport React, { useEffect, useMemo, useRef } from \"react\";\nimport rootStore from \"../lib/internal-details/lib/root-store.js\";\nimport ErrorBoundary from \"../lib/user-facing/component-base/error-boundary.js\";\nimport { createAnchorNameStyle } from \"./edit-wrapper.js\";\nimport { instanceTracker } from \"./instance-tracker.js\";\nimport type { SbSelector } from \"@superblocksteam/library-shared/types\";\n\nexport type JSXContextType = {\n  selectorId: SbSelector;\n};\n\nexport const JSXContext = React.createContext<JSXContextType>({\n  selectorId: \"S-<unknown>\" satisfies SbSelector,\n});\n\nexport const makeWrappedComponent = (type: any) => {\n  const isTag = typeof type === \"string\";\n  const isRegisteredSbComponent =\n    rootStore.componentRegistry.hasComponent(type);\n\n  const Component = React.forwardRef((props: any, ref: any) => {\n    const { selectorId: parentSelectorId } = useJSXContext();\n\n    const sourceId = props[SOURCE_ID_ATTRIBUTE];\n    const noSelect = props[NO_SELECT_ATTRIBUTE];\n\n    const instanceNumberRef = useRef<number>();\n    const selectorId = useRef<SbSelector>(\"S-<unknown>\" satisfies SbSelector);\n    if (selectorId.current === \"S-<unknown>\") {\n      instanceNumberRef.current =\n        instanceTracker.getNextAvailableInstance(sourceId);\n      selectorId.current =\n        `S-x-${sourceId}-${instanceNumberRef.current}` as SbSelector;\n    }\n\n    useEffect(() => {\n      rootStore.editStore?.runtimeTrackingStore.registerComponent(\n        selectorId.current,\n        {\n          sourceId,\n          type,\n          parentSelectorId,\n          isSbComponent: isRegisteredSbComponent,\n          isHtmlElement: isTag,\n          noSelect,\n        },\n      );\n      return () => {\n        rootStore.editStore?.runtimeTrackingStore.unregisterComponent(\n          selectorId.current,\n        );\n        if (instanceNumberRef.current !== undefined) {\n          instanceTracker.releaseInstance(sourceId, instanceNumberRef.current);\n        }\n      };\n      // These deps should NOT change during the component lifecycle\n      // eslint-disable-next-line react-hooks/exhaustive-deps\n    }, []);\n\n    useEffect(() => {\n      rootStore.editStore?.runtimeTrackingStore.updatePropsForComponent(\n        selectorId.current,\n        props,\n      );\n    }, [props]);\n\n    const jsxContext = useMemo(\n      () =>\n        ({\n          selectorId: selectorId.current,\n        }) satisfies JSXContextType,\n      [],\n    );\n\n    const selectorProps: Record<string, string> = {\n      [SELECTOR_ID_ATTRIBUTE]: selectorId.current,\n    };\n\n    if (parentSelectorId) {\n      selectorProps[\"data-sb-parent-selector-id\"] = parentSelectorId;\n    }\n\n    const style = useMemo(() => {\n      return {\n        ...props.style,\n        ...createAnchorNameStyle({\n          selectorId: selectorId.current,\n        }),\n      };\n    }, [props.style]);\n\n    const element = React.createElement(type, {\n      ref,\n      ...props,\n      ...selectorProps,\n      className: [\"sb-anchor-name\", props.className].filter(Boolean).join(\" \"),\n      style,\n    });\n\n    if (!rootStore.editStore?.isInitialized) {\n      return element;\n    }\n\n    return (\n      <JSXContext.Provider value={jsxContext}>\n        <ErrorBoundary>{element}</ErrorBoundary>\n      </JSXContext.Provider>\n    );\n  });\n  try {\n    Component.displayName =\n      typeof type === \"string\"\n        ? type\n        : type.displayName || type.name || \"Component\";\n  } catch (e) {\n    console.error(\"Error setting displayName\", e);\n  }\n\n  return Component;\n};\n\nconst useJSXContext = () => {\n  return React.useContext(JSXContext);\n};\n","import { SOURCE_ID_ATTRIBUTE } from \"@superblocksteam/library-shared\";\nimport * as ReactJsxDevRuntime from \"react/jsx-dev-runtime\";\nimport { makeWrappedComponent } from \"../edit-mode/jsx-wrapper.js\";\nimport rootStore from \"../lib/internal-details/lib/root-store.js\";\n\nconst reactJsxDEV = (ReactJsxDevRuntime as any).jsxDEV;\n\ndeclare global {\n  interface Window {\n    __SUPERBLOCKS_EDIT_MODE__?: boolean;\n    _SB_VIEW_MODE?: string;\n  }\n}\n\nfunction isEditMode(): boolean {\n  if (typeof window === \"undefined\") return false;\n\n  if (window.__SUPERBLOCKS_EDIT_MODE__ !== undefined) {\n    return window.__SUPERBLOCKS_EDIT_MODE__;\n  }\n\n  const viewMode = window._SB_VIEW_MODE;\n  if (viewMode === \"dev\") {\n    window.__SUPERBLOCKS_EDIT_MODE__ = true;\n    return true;\n  }\n\n  const envMode = import.meta.env?.MODE;\n  const isEdit = envMode === \"local-dev\";\n  window.__SUPERBLOCKS_EDIT_MODE__ = isEdit;\n  return isEdit;\n}\n\nconst objTypeCache = new WeakMap<any, any>();\nconst stringTypeCache = new Map<string, any>();\n\ntype SupportedElementType = React.ElementType | string;\n\nfunction getOrSetCachedWrappedComponent(type: SupportedElementType) {\n  const typeIsObject =\n    (typeof type === \"object\" || typeof type === \"function\") && type !== null;\n  const cachedType = typeIsObject\n    ? objTypeCache.get(type)\n    : stringTypeCache.get(type);\n  if (cachedType) {\n    return cachedType;\n  }\n  const newComponent = makeWrappedComponent(type);\n  if (typeIsObject) {\n    objTypeCache.set(type, newComponent);\n  } else {\n    stringTypeCache.set(type, newComponent);\n  }\n  return newComponent;\n}\n\nconst shouldWrapTagType = (type: unknown): type is SupportedElementType => {\n  if (typeof type === \"string\") {\n    return rootStore.componentRegistry.hasComponent(type);\n  }\n  return (\n    type != null && (typeof type === \"object\" || typeof type === \"function\")\n  );\n};\n\nexport function jsxDEV(\n  type: any,\n  props: any,\n  key: any,\n  isStaticChildren: any,\n  source: any,\n  self: any,\n) {\n  const sourceId = props?.[SOURCE_ID_ATTRIBUTE];\n  try {\n    if (sourceId && isEditMode() && shouldWrapTagType(type)) {\n      const CachedWrappedComponent = getOrSetCachedWrappedComponent(\n        type satisfies SupportedElementType,\n      );\n\n      return reactJsxDEV(\n        CachedWrappedComponent,\n        props,\n        `${key}-${sourceId}`,\n        isStaticChildren,\n        source,\n        self,\n      );\n    }\n  } catch (e) {\n    console.error(\"Error during JSX wrap\", e);\n  }\n  return reactJsxDEV(type, props, key, isStaticChildren, source, self);\n}\n","import * as ReactJsxDevRuntime from \"react/jsx-dev-runtime\";\n\nexport const Fragment = (ReactJsxDevRuntime as any).Fragment;\nexport { jsxDEV } from \"./jsx-dev-runtime.js\";\n"],"mappings":"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"}

package/dist/jsx-runtime/index.d.ts

@@ -0,0 +1,7 @@
+//#region src/jsx-runtime/index.d.ts
+declare const jsx: any;
+declare const jsxs: any;
+declare const Fragment: any;
+//#endregion
+export { Fragment, jsx, jsxs };
+//# sourceMappingURL=index.d.ts.map

package/dist/jsx-runtime/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","names":[],"sources":["../../src/jsx-runtime/index.ts"],"sourcesContent":[],"mappings":";cAEa;AAAA,cACA,IADkC,EAAA,GAAA;AAClC,cACA,QADoC,EAAA,GAAA"}

package/dist/jsx-runtime/index.js

@@ -0,0 +1,10 @@
+import * as ReactJsxRuntime from "react/jsx-runtime";
+
+//#region src/jsx-runtime/index.ts
+const jsx = ReactJsxRuntime.jsx;
+const jsxs = ReactJsxRuntime.jsxs;
+const Fragment = ReactJsxRuntime.Fragment;
+
+//#endregion
+export { Fragment, jsx, jsxs };
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../src/jsx-runtime/index.ts"],"sourcesContent":["import * as ReactJsxRuntime from \"react/jsx-runtime\";\n\nexport const jsx = (ReactJsxRuntime as any).jsx;\nexport const jsxs = (ReactJsxRuntime as any).jsxs;\nexport const Fragment = (ReactJsxRuntime as any).Fragment;\n"],"mappings":";;;AAEA,MAAa,MAAO,gBAAwB;AAC5C,MAAa,OAAQ,gBAAwB;AAC7C,MAAa,WAAY,gBAAwB"}

package/dist/{index.css → lib/index.css}

@@ -62,11 +62,6 @@
     border: 1px solid #0087e0;
   }
 
-  &.sb-edit-error {
-    border: 1px solid #f45252;
-    background: rgba(252, 190, 190, 0.3);
-  }
-
   &.sb-edit-target {
     border: 2px solid #c2b9dd;
   }
@@ -269,9 +264,14 @@
   position-try-fallbacks: flip-block, --actions-below-header;
 }
 
+.sb-edit-selection-name-pill {
+  max-width: 140px;
+}
+
 .sb-edit-selection-name-pill,
-.sb-edit-add-to-chat-button {
-  cursor: pointer;
+.sb-edit-add-to-chat-button,
+.sb-edit-edit-component-button {
+  cursor: pointer !important;
   display: block;
   font-size: 11px;
   color: white;
@@ -285,6 +285,10 @@
   border: none;
   outline: none;
 
+  * {
+    cursor: pointer !important;
+  }
+
   &:hover {
     box-shadow: 0px 3px 8px -1px #0087e0;
   }
@@ -296,7 +300,8 @@
 }
 
 .sb-edit-actions-target-mode .sb-edit-selection-name-pill,
-.sb-edit-actions-target-mode .sb-edit-add-to-chat-button {
+.sb-edit-actions-target-mode .sb-edit-add-to-chat-button,
+.sb-edit-actions-target-mode .sb-edit-edit-component-button {
   background-color: rgba(100, 58, 223, 1);
 
   &:hover {
@@ -309,14 +314,15 @@
   }
 }
 
-.sb-edit-add-to-chat-button {
+.sb-edit-add-to-chat-button,
+.sb-edit-edit-component-button {
   display: flex;
   align-items: center;
   justify-content: center;
 
   svg {
-    width: 12px;
-    height: 12px;
+    width: 16px;
+    height: 16px;
   }
 }
 

package/dist/lib/index.css.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.css","names":[],"sources":["../../src/edit-mode/edit-style.css"],"sourcesContent":[":root {\n  /* Edit mode z-index values */\n  --sb-edit-z-index-high: 1010;\n  --sb-edit-z-index-mid: 1002;\n  --sb-edit-z-index-base: 1001;\n}\n\n/* A class that sets the child anchor-name to a variable that is set in react */\n/* First level is the suspense provider, second level is the component */\n.sb-anchor-name {\n  anchor-name: var(--anchor-name);\n}\n\n.sb-draggable-wrapper {\n  &[data-is-dragged=\"true\"] {\n    visibility: hidden;\n  }\n}\n\n/**\n* Used to drag *new* components into the canvas.\n* It's a full height/width layer above the editor canvas.\n* Triggers the draggable preview box for the new component to be dropped.\n**/\n.sb-new-component-dragging-layer {\n  position: fixed;\n  width: 100vw;\n  height: 100vh;\n  z-index: var(--sb-edit-z-index-high);\n}\n\n.sb-interaction-layer-wrapper {\n  z-index: var(--sb-edit-z-index-high);\n  height: 0;\n  width: 0;\n  top: 0;\n  left: 0;\n}\n\n.sb-edit-drag-preview {\n  background: rgba(224, 0, 0, 0.16);\n  border: 1px solid red;\n  box-shadow: inset 0 0 0 3px rgba(224, 0, 0, 0.16);\n  width: 100%;\n  height: 100%;\n  pointer-events: none;\n\n  &[data-is-valid-drop=\"true\"] {\n    border: 1px solid #0087e0;\n    background: rgba(0, 135, 224, 0.16);\n    box-shadow: inset 0 0 0 3px rgba(0, 135, 224, 0.16);\n  }\n}\n\n.sb-edit-selection-rect {\n  position: absolute;\n  border: 2px solid #0087e0;\n  pointer-events: none;\n  z-index: var(--sb-edit-z-index-base);\n\n  &.sb-edit-focus {\n    border: 1px solid #0087e0;\n  }\n\n  &.sb-edit-target {\n    border: 2px solid #c2b9dd;\n  }\n\n  &.sb-edit-target-mode.sb-edit-focus {\n    border: 1px solid #c2b9dd;\n    background: rgba(124, 79, 248, 0.04);\n  }\n}\n\n/* ai target mode */\n\n.sb-target-mode-border {\n  position: absolute;\n  top: anchor(top);\n  left: anchor(left);\n  right: anchor(right);\n  bottom: anchor(bottom);\n  pointer-events: none;\n}\n\n.sb-target-mode-border-top-right,\n.sb-target-mode-border-top-left,\n.sb-target-mode-border-bottom-right,\n.sb-target-mode-border-bottom-left {\n  width: 12px;\n  height: 12px;\n  position: absolute;\n  box-sizing: border-box;\n}\n\n.sb-target-mode-border-top-right {\n  top: 0;\n  left: 0;\n  border-top: 2px solid rgba(124, 79, 248, 1);\n  border-left: 2px solid rgba(124, 79, 248, 1);\n}\n\n.sb-target-mode-border-top-left {\n  top: 0;\n  right: 0;\n  border-top: 2px solid rgba(124, 79, 248, 1);\n  border-right: 2px solid rgba(124, 79, 248, 1);\n}\n\n.sb-target-mode-border-bottom-right {\n  bottom: 0;\n  right: 0;\n  border-bottom: 2px solid rgba(124, 79, 248, 1);\n  border-right: 2px solid rgba(124, 79, 248, 1);\n}\n\n.sb-target-mode-border-bottom-left {\n  bottom: 0;\n  left: 0;\n  border-bottom: 2px solid rgba(124, 79, 248, 1);\n  border-left: 2px solid rgba(124, 79, 248, 1);\n}\n\n/*\n  Handles for resizing the selection rect.\n  These are the little circles that appear when you select a widget\n  Used in interaction-rect-handles.tsx\n*/\n\n.resize-handle {\n  position: absolute;\n  width: 12px;\n  height: 12px;\n  background-color: white;\n  border: 1px solid #0087e0;\n  border-radius: 50%;\n  z-index: var(--sb-edit-z-index-high);\n  pointer-events: auto;\n\n  .bp5-popover-target {\n    width: 100%;\n    height: 100%;\n  }\n\n  &.top-left-resize-handle {\n    top: -6px;\n    left: -6px;\n    cursor: nw-resize;\n  }\n\n  &.top-right-resize-handle {\n    top: -6px;\n    right: -6px;\n    cursor: ne-resize;\n  }\n\n  &.bottom-right-resize-handle {\n    bottom: -6px;\n    right: -6px;\n    cursor: se-resize;\n  }\n\n  &.bottom-left-resize-handle {\n    bottom: -6px;\n    left: -6px;\n    cursor: sw-resize;\n  }\n\n  &.top-resize-handle {\n    top: -6px;\n    left: 0;\n    right: 0;\n    height: 12px;\n    width: auto;\n    cursor: ns-resize;\n    background-color: transparent;\n    border: none;\n    pointer-events: auto;\n  }\n\n  &.right-resize-handle {\n    top: 0;\n    right: -6px;\n    bottom: 0;\n    width: 12px;\n    height: auto;\n    cursor: ew-resize;\n    background-color: transparent;\n    border: none;\n    pointer-events: auto;\n  }\n\n  &.bottom-resize-handle {\n    bottom: -6px;\n    left: 0;\n    right: 0;\n    height: 12px;\n    width: auto;\n    cursor: ns-resize;\n    background-color: transparent;\n    border: none;\n    pointer-events: auto;\n  }\n\n  &.left-resize-handle {\n    top: 0;\n    left: -6px;\n    bottom: 0;\n    width: 12px;\n    height: auto;\n    cursor: ew-resize;\n    background-color: transparent;\n    border: none;\n    pointer-events: auto;\n  }\n}\n\n.resize-handle-edge::after {\n  position: absolute;\n  content: \"\";\n  border-radius: 3px;\n  border: 1px solid rgb(0, 135, 224);\n  background: rgb(255, 255, 255);\n  box-sizing: border-box;\n  transition: height 0.2s ease-in-out;\n}\n\n.left-resize-handle-edge::after {\n  width: 6px;\n  height: 16px;\n  top: calc(50% - 8px);\n  left: calc(50% - 2px);\n}\n\n.right-resize-handle-edge::after {\n  width: 6px;\n  height: 16px;\n  top: calc(50% - 8px);\n  right: calc(50% - 2px);\n}\n\n.top-resize-handle-edge::after {\n  width: 16px;\n  height: 6px;\n  left: calc(50% - 8px);\n  top: calc(50% - 2px);\n}\n\n.bottom-resize-handle-edge::after {\n  width: 16px;\n  height: 6px;\n  left: calc(50% - 8px);\n  bottom: calc(50% - 2px);\n}\n\n.bp5-unstyled-popover > .bp5-popover-content {\n  padding: 0 !important;\n  background: none !important;\n}\n\n.sb-edit-interaction-rect-actions {\n  position: absolute;\n  /* This will flip the name pill when anchored */\n  position-try-fallbacks: flip-block, --actions-below-header;\n}\n\n.sb-edit-selection-name-pill {\n  max-width: 140px;\n}\n\n.sb-edit-selection-name-pill,\n.sb-edit-add-to-chat-button,\n.sb-edit-edit-component-button {\n  cursor: pointer !important;\n  display: block;\n  font-size: 11px;\n  color: white;\n  padding: 2px 4px;\n  white-space: nowrap;\n  background-color: #0087e0;\n  border-radius: 3px;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  z-index: var(--sb-edit-z-index-mid);\n  border: none;\n  outline: none;\n\n  * {\n    cursor: pointer !important;\n  }\n\n  &:hover {\n    box-shadow: 0px 3px 8px -1px #0087e0;\n  }\n\n  &:active,\n  &:focus {\n    background-color: #0373be;\n  }\n}\n\n.sb-edit-actions-target-mode .sb-edit-selection-name-pill,\n.sb-edit-actions-target-mode .sb-edit-add-to-chat-button,\n.sb-edit-actions-target-mode .sb-edit-edit-component-button {\n  background-color: rgba(100, 58, 223, 1);\n\n  &:hover {\n    box-shadow: 0px 3px 8px -1px rgba(100, 58, 223, 1);\n  }\n\n  &:active,\n  &:focus {\n    background-color: rgb(77, 50, 160);\n  }\n}\n\n.sb-edit-add-to-chat-button,\n.sb-edit-edit-component-button {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n\n  svg {\n    width: 16px;\n    height: 16px;\n  }\n}\n\n@position-try --actions-below-header {\n  margin-bottom: -24px;\n  margin-right: 3px;\n}\n\n.sb-reparent-rect {\n  position: absolute;\n  border: 1px solid #0087e0;\n  pointer-events: none;\n  z-index: var(--sb-edit-z-index-base);\n  animation: radial-gradient-animation 2s infinite;\n}\n\n@keyframes radial-gradient-animation {\n  0% {\n    box-shadow: inset 0 0 0 0 rgba(0, 135, 224, 0.5);\n  }\n  100% {\n    box-shadow: inset 0 0 20px 20px rgba(0, 135, 224, 0.1);\n  }\n}\n\n.sb-edit-drop-placeholder {\n  position: absolute;\n  pointer-events: none;\n  z-index: var(--sb-edit-z-index-base);\n\n  &[data-is-active=\"true\"] {\n    border: 1px solid #0087e0;\n    box-shadow: inset 0 0 0 3px rgba(0, 135, 224, 0.16);\n  }\n\n  &[data-is-valid-drop=\"false\"] {\n    border-color: #f45252;\n  }\n}\n\n.sb-edit-drop-target-outline {\n  position: absolute;\n  pointer-events: none;\n  z-index: var(--sb-edit-z-index-base);\n  border: 1px dashed #0087e0;\n  width: 100%;\n  height: 100%;\n  top: 0;\n  left: 0;\n\n  &[data-invalid-target=\"true\"] {\n    border-color: #f45252;\n  }\n}\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA"}