@superblocksteam/library 1.99.99-next.2 → 2.0.0-SNAPSHOT.1b6ff49be85cc3b1

package/README.md

@@ -19,31 +19,6 @@ pnpm env:secrets:fetch
 pnpm migration:run
 ```
 
-In addition, open the [code-mode-ee](https://github.com/superblocksteam/superblocks/tree/code-mode-ee) branch and find the most recent build-codesandbox task. Click on "Details":
-
-![](https://i.imgur.com/kcUdLkE.png)
-
-And take the latest templateId from here, and copy it in to `server/.env`:
-
-![](https://i.imgur.com/tWNmucz.png)
-
-For example, `SUPERBLOCKS_CODE_SANDBOX_TEMPLATE_ID=6f8q2z`
-
----
-
-Then there is a one time task to setup built assets (non-editor UI):
-
-```
-cd packages/ui
-npm run copy-built-assets
-```
-
-You'll also want to ensure you've compiled the new CLI and library:
-
-```
-pnpm --filter cli --filter library build
-```
-
 ### Build
 
 Build a copy of the library using `pnpm build` (from this folder) or `pnpm --filter library build` (from root of the workspace).
@@ -63,7 +38,7 @@ If you make changes to the library, you need to rebuild, reinstall, and rerun th
 
 ### Running a code mode app (automated)
 
-A shortcut to above is to run `pnpm watch-lib-template` from the root of the workspace, which compiles the library and runs the dev server for `packages/demo-apps/code-demo-app`. This will also watch for changes in the `library` package and re-build, re-install, and re-run server for you.
+A shortcut to above is to run `pnpm watch-lib-template` from the root of the workspace, which compiles the library and runs the dev server for the active demo app (configured in `packages/demo-apps/config.json`). This will also watch for changes in the `library` package and re-build, re-install, and re-run server for you.
 
 ### Running a code mode app in editor
 

package/dist/build-manifest-BQAcrmit.js

@@ -0,0 +1,6 @@
+//#region src/lib/user-facing/build-manifest.js
+var build_manifest_default = {};
+//#endregion
+export { build_manifest_default as default };
+
+//# sourceMappingURL=build-manifest-BQAcrmit.js.map

package/dist/build-manifest-BQAcrmit.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"build-manifest-BQAcrmit.js","names":[],"sources":["../src/lib/user-facing/build-manifest.js"],"sourcesContent":["// This is a placeholder file that is replaced with the actual build manifest during the build process\n// This stub will be used primarily in tests and for the dev server\nexport default {};\n"],"mappings":";AAEA,IAAA,yBAAe,EAAE"}

package/dist/devtools-consolidated-C5sXwPGD.js

@@ -0,0 +1,156 @@
+import { makeAutoObservable, toJS } from "mobx";
+import { useCallback, useEffect } from "react";
+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";
+import "react-json-view-lite/dist/index.css";
+//#region src/lib/internal-details/lib/devtools/serialize-store-data.tsx
+function serializeStoreData(stores_) {
+	try {
+		const stores = toJS(stores_);
+		const seen = /* @__PURE__ */ new Set();
+		function serialize(obj) {
+			if (obj === null || typeof obj !== "object") return obj;
+			if (seen.has(obj)) return "[Already Seen]";
+			seen.add(obj);
+			if (Array.isArray(obj)) return obj.map(serialize);
+			const result = {};
+			for (const key of Object.keys(obj)) {
+				if (typeof obj[key] === "function") result[key] = "[Function]";
+				try {
+					const descriptor = Object.getOwnPropertyDescriptor(obj, key);
+					if (descriptor && descriptor.get) try {
+						result[key] = serialize(obj[key]);
+					} catch {
+						result[key] = "[Getter Error]";
+					}
+					else result[key] = serialize(obj[key]);
+				} catch {
+					result[key] = "[Access Error]";
+				}
+			}
+			if (obj.constructor && obj.constructor.name !== "Object") result.__type__ = obj.constructor.name;
+			return result;
+		}
+		return serialize(stores);
+	} catch (error) {
+		return { error: `Error serializing data: ${error instanceof Error ? error.message : "Unknown error"}` };
+	}
+}
+//#endregion
+//#region src/lib/internal-details/lib/devtools/devtools-consolidated.tsx
+var DevToolsState = class {
+	isVisible = false;
+	constructor() {
+		makeAutoObservable(this);
+	}
+	show() {
+		this.isVisible = true;
+	}
+	hide() {
+		this.isVisible = false;
+	}
+	toggle() {
+		this.isVisible = !this.isVisible;
+	}
+};
+const devToolsState = new DevToolsState();
+const registeredStores = {};
+function getRegisteredStores() {
+	return registeredStores;
+}
+const overlayStyles = {
+	position: "fixed",
+	top: 0,
+	left: 0,
+	right: 0,
+	bottom: 0,
+	backgroundColor: "rgba(0, 0, 0, 0.5)",
+	zIndex: 9999
+};
+const panelStyles = {
+	position: "fixed",
+	top: "50%",
+	left: "50%",
+	transform: "translate(-50%, -50%)",
+	width: "90vw",
+	height: "90vh",
+	backgroundColor: "#fff",
+	zIndex: 1e4,
+	display: "flex",
+	flexDirection: "column",
+	borderRadius: 12
+};
+const headerStyles = {
+	padding: 12,
+	borderBottom: "1px solid #ccc",
+	display: "flex",
+	justifyContent: "space-between",
+	alignItems: "center"
+};
+const closeButtonStyles = {
+	background: "none",
+	border: "none",
+	cursor: "pointer"
+};
+const contentStyles = {
+	padding: 8,
+	display: "flex",
+	flex: 1,
+	overflow: "auto",
+	flexDirection: "column"
+};
+const DevToolsPanelContent = observer(() => {
+	const stores = getRegisteredStores();
+	const storeNames = Object.keys(stores);
+	const serializedData = serializeStoreData(stores);
+	const onClose = useCallback(() => {
+		devToolsState.hide();
+	}, []);
+	return createPortal(/* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("div", {
+		style: overlayStyles,
+		onClick: onClose
+	}), /* @__PURE__ */ jsxs("div", {
+		style: panelStyles,
+		children: [/* @__PURE__ */ jsxs("div", {
+			style: headerStyles,
+			children: [/* @__PURE__ */ jsxs("h3", { children: [
+				"MobX DevTools (",
+				storeNames.length,
+				" store",
+				storeNames.length !== 1 ? "s" : "",
+				")"
+			] }), /* @__PURE__ */ jsx("button", {
+				style: closeButtonStyles,
+				onClick: onClose,
+				title: "Close (ESC)",
+				children: "×"
+			})]
+		}), storeNames.length === 0 ? /* @__PURE__ */ jsx("div", { children: "No stores registered yet." }) : /* @__PURE__ */ jsx("div", {
+			style: contentStyles,
+			children: /* @__PURE__ */ jsx(JsonView, {
+				data: serializedData,
+				clickToExpandNode: true,
+				shouldExpandNode: (level) => level < 2
+			})
+		})]
+	})] }), document.body);
+});
+const CustomDevTools = observer(() => {
+	useEffect(() => {
+		if (devToolsState.isVisible) {
+			const handleEscape = (event) => {
+				if (event.key === "Escape") devToolsState.hide();
+			};
+			document.addEventListener("keydown", handleEscape);
+			return () => document.removeEventListener("keydown", handleEscape);
+		}
+	}, []);
+	if (!devToolsState.isVisible) return null;
+	return /* @__PURE__ */ jsx(DevToolsPanelContent, {});
+});
+//#endregion
+export { CustomDevTools };
+
+//# sourceMappingURL=devtools-consolidated-C5sXwPGD.js.map

package/dist/devtools-consolidated-C5sXwPGD.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"devtools-consolidated-C5sXwPGD.js","names":[],"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\";\n\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// STORE ACCESS\n// ============================================================================\n\n// This will be populated by the registerStores function\nconst registeredStores: Record<string, any> = {};\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"],"mappings":"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"}

package/dist/early-console-buffer-BJWsc4E3.js

@@ -0,0 +1,133 @@
+import { SeverityNumber } from "@opentelemetry/api-logs";
+//#region src/lib/tracing/console-logging.ts
+var ConsoleLogAttributes = class ConsoleLogAttributes {
+	constructor(attributes) {
+		this.attributes = attributes;
+	}
+	static create(attrs) {
+		return new ConsoleLogAttributes(attrs);
+	}
+};
+const consoleLogAttributes = (attrs) => {
+	return new ConsoleLogAttributes(attrs);
+};
+//#endregion
+//#region src/lib/tracing/early-console-buffer.ts
+function mergeAllConsoleLogAttributes(args) {
+	if (args.length === 0) return void 0;
+	return args.reduce((merged, arg) => {
+		if (arg instanceof ConsoleLogAttributes) return {
+			...merged,
+			...arg.attributes
+		};
+		return merged;
+	}, {});
+}
+var LibraryEarlyConsoleBuffer = class LibraryEarlyConsoleBuffer {
+	static instance;
+	buffer = [];
+	maxBufferSize = 1e3;
+	originalMethods = {};
+	otelLogger = void 0;
+	isPatched = false;
+	static getInstance() {
+		if (!LibraryEarlyConsoleBuffer.instance) LibraryEarlyConsoleBuffer.instance = new LibraryEarlyConsoleBuffer();
+		return LibraryEarlyConsoleBuffer.instance;
+	}
+	patchEarly() {
+		if (this.isPatched) return;
+		this.originalMethods.log = console.log.bind(console);
+		this.originalMethods.info = console.info.bind(console);
+		this.originalMethods.debug = console.debug.bind(console);
+		this.originalMethods.warn = console.warn.bind(console);
+		this.originalMethods.error = console.error.bind(console);
+		this.patchMethod("log");
+		this.patchMethod("info");
+		this.patchMethod("debug");
+		this.patchMethod("warn");
+		this.patchMethod("error");
+		this.isPatched = true;
+	}
+	patchMethod(level) {
+		const originalMethod = this.originalMethods[level];
+		console[level] = (...args) => {
+			originalMethod(...args);
+			this.bufferLog(level, args);
+			if (this.otelLogger) this.sendToOpenTelemetry(level, args);
+		};
+	}
+	bufferLog(level, args) {
+		if (this.buffer.length >= this.maxBufferSize) this.buffer.shift();
+		this.buffer.push({
+			level,
+			args,
+			timestamp: Date.now()
+		});
+	}
+	enableOpenTelemetry(otelLogger) {
+		console.info("[internal] [EarlyConsoleBuffer] Enabling OpenTelemetry integration");
+		this.otelLogger = otelLogger;
+		this.flushBuffer();
+	}
+	flushBuffer() {
+		if (!this.otelLogger) return;
+		const bufferCount = this.buffer.length;
+		if (bufferCount === 0) {
+			console.info("[internal] [EarlyConsoleBuffer] No buffered logs to flush");
+			return;
+		}
+		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(`[internal] [EarlyConsoleBuffer] Successfully sent ${bufferCount} buffered logs to OpenTelemetry logger`);
+	}
+	sendToOpenTelemetry(level, args, timestamp, fromBuffer) {
+		if (!this.otelLogger) return;
+		const severityMap = {
+			debug: SeverityNumber.DEBUG,
+			log: SeverityNumber.INFO,
+			info: SeverityNumber.INFO,
+			warn: SeverityNumber.WARN,
+			error: SeverityNumber.ERROR
+		};
+		const attributes = {
+			...fromBuffer && { source: "early-console-buffer" },
+			...mergeAllConsoleLogAttributes(args)
+		};
+		this.otelLogger.emit({
+			severityNumber: severityMap[level],
+			severityText: level,
+			body: this.formatConsoleArgs(args),
+			timestamp,
+			attributes
+		});
+	}
+	formatConsoleArgs(args) {
+		return args.filter((arg) => !(arg instanceof ConsoleLogAttributes)).map((arg) => {
+			if (typeof arg === "string") return arg;
+			if (arg === null) return "null";
+			if (arg === void 0) return "undefined";
+			if (typeof arg === "object") try {
+				return JSON.stringify(arg, null, 2);
+			} catch {
+				return "[object Object]";
+			}
+			return String(arg);
+		}).join(" ");
+	}
+	getBufferSize() {
+		return this.buffer.length;
+	}
+	isConsolePatched() {
+		return this.isPatched;
+	}
+	isOpenTelemetryEnabled() {
+		return this.otelLogger !== void 0;
+	}
+};
+//#endregion
+export { consoleLogAttributes as n, LibraryEarlyConsoleBuffer as t };
+
+//# sourceMappingURL=early-console-buffer-BJWsc4E3.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"early-console-buffer-BJWsc4E3.js","names":[],"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 type { Logger as OTelLogger } from \"@opentelemetry/api-logs\";\n\nimport { ConsoleLogAttributes } from \"./console-logging.js\";\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.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"],"mappings":";QAUQ,MAAA;EAAA,UACI,MAAA;IACR,yBAAA;IACA,aAAA;EAAA;AAAA;AAAA,iBAuDY,MAAA,CACd,IAAA,OACA,KAAA,OACA,GAAA,OACA,gBAAA,OACA,MAAA,OACA,IAAA;;;cCxEW,QAAA"}

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

@@ -0,0 +1,52 @@
+import { n as root_store_default, o as tracker } from "../root-store-DFc-KUI6.js";
+import { t as makeWrappedComponent } from "../jsx-wrapper-CAKd0FsI.js";
+import { SOURCE_ID_ATTRIBUTE } from "@superblocksteam/library-shared";
+import * as ReactJsxDevRuntime from "react/jsx-dev-runtime";
+//#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)) {
+			const CachedWrappedComponent = getOrSetCachedWrappedComponent(type);
+			tracker.reportJSXActivity();
+			return reactJsxDEV(CachedWrappedComponent, 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":["rootStore"],"sources":["../../src/jsx-dev-runtime/jsx-dev-runtime.ts","../../src/jsx-dev-runtime/index.ts"],"sourcesContent":["import * as ReactJsxDevRuntime from \"react/jsx-dev-runtime\";\n\nimport { SOURCE_ID_ATTRIBUTE } from \"@superblocksteam/library-shared\";\n\nimport { makeWrappedComponent } from \"../edit-mode/jsx-wrapper.js\";\nimport ApiHmrTracker from \"../lib/internal-details/lib/features/api-hmr-tracker.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      ApiHmrTracker.reportJSXActivity();\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":";;;;;AAQA,MAAM,cAAe,mBAA2B;AAShD,SAAS,aAAsB;AAC7B,KAAI,OAAO,WAAW,YAAa,QAAO;AAE1C,KAAI,OAAO,8BAA8B,KAAA,EACvC,QAAO,OAAO;AAIhB,KADiB,OAAO,kBACP,OAAO;AACtB,SAAO,4BAA4B;AACnC,SAAO;;CAIT,MAAM,SAAS;AACf,QAAO,4BAA4B;AACnC,QAAO;;AAGT,MAAM,+BAAe,IAAI,SAAmB;AAC5C,MAAM,kCAAkB,IAAI,KAAkB;AAI9C,SAAS,+BAA+B,MAA4B;CAClE,MAAM,gBACH,OAAO,SAAS,YAAY,OAAO,SAAS,eAAe,SAAS;CACvE,MAAM,aAAa,eACf,aAAa,IAAI,KAAK,GACtB,gBAAgB,IAAI,KAAK;AAC7B,KAAI,WACF,QAAO;CAET,MAAM,eAAe,qBAAqB,KAAK;AAC/C,KAAI,aACF,cAAa,IAAI,MAAM,aAAa;KAEpC,iBAAgB,IAAI,MAAM,aAAa;AAEzC,QAAO;;AAGT,MAAM,qBAAqB,SAAgD;AACzE,KAAI,OAAO,SAAS,SAClB,QAAOA,mBAAU,kBAAkB,aAAa,KAAK;AAEvD,QACE,QAAQ,SAAS,OAAO,SAAS,YAAY,OAAO,SAAS;;AAIjE,SAAgB,OACd,MACA,OACA,KACA,kBACA,QACA,MACA;CACA,MAAM,WAAW,QAAQ;AACzB,KAAI;AACF,MAAI,YAAY,YAAY,IAAI,kBAAkB,KAAK,EAAE;GACvD,MAAM,yBAAyB,+BAC7B,KACD;AACD,WAAc,mBAAmB;AACjC,UAAO,YACL,wBACA,OACA,GAAG,IAAI,GAAG,YACV,kBACA,QACA,KACD;;UAEI,GAAG;AACV,UAAQ,MAAM,yBAAyB,EAAE;;AAE3C,QAAO,YAAY,MAAM,OAAO,KAAK,kBAAkB,QAAQ,KAAK;;;;AC7FtE,MAAa,WAAY,mBAA2B"}

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"],"mappings":";cAEa,GAAA;AAAA,cACA,IAAA;AAAA,cACA,QAAA"}

package/dist/jsx-runtime/index.js

@@ -0,0 +1,9 @@
+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"}