lynx-console 0.3.0 → 0.4.0

package/dist/setup.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"setup.mjs","names":[],"sources":["../src/shared/ensureConsoleStructure.ts","../src/setup/setupLogMonitor.ts","../src/setup/_setupMainThreadConsole.ts","../src/setup/setupMainThreadConsole.ts","../src/setup/setupNetworkMonitor.ts","../src/setup/setupPerformanceMonitor.ts"],"sourcesContent":["type LynxConsole = NonNullable<typeof globalThis.__LYNX_CONSOLE__>;\ntype ConsoleState = NonNullable<LynxConsole[\"state\"]>;\n\nexport const ensureConsoleStructure = (): {\n  lynxConsole: LynxConsole;\n  state: ConsoleState;\n} => {\n  if (!globalThis.__LYNX_CONSOLE__) {\n    globalThis.__LYNX_CONSOLE__ = {};\n  }\n\n  if (!globalThis.__LYNX_CONSOLE__.state) {\n    globalThis.__LYNX_CONSOLE__.state = {};\n  }\n\n  return {\n    lynxConsole: globalThis.__LYNX_CONSOLE__,\n    state: globalThis.__LYNX_CONSOLE__.state,\n  };\n};\n","import { ensureConsoleStructure } from \"../shared/ensureConsoleStructure\";\nimport type { LogEntry, LogLevel } from \"../types\";\n\ntype LogListener = (entry: LogEntry) => void;\n\nconst LOG_METHODS: LogLevel[] = [\"log\", \"warn\", \"error\", \"info\"];\nconst LOG_ID_PREFIX = \"background-thread\";\n\nconst generateLogId = (): string => {\n  return `${LOG_ID_PREFIX}-${Date.now()}-${Math.random()}`;\n};\n\nconst createLogEntry = (method: LogLevel, args: unknown[]): LogEntry => {\n  return {\n    id: generateLogId(),\n    level: method,\n    message: \"\",\n    timestamp: Date.now(),\n    args,\n  };\n};\n\nconst addLogEntry = (entry: LogEntry): void => {\n  const state = globalThis.__LYNX_CONSOLE__?.state;\n  if (!state?.logs || !state?.logListeners) {\n    console.error(\n      \"[LynxConsole] Cannot add log entry: Log monitor not initialized. Call initLogMonitor() first.\",\n    );\n    return;\n  }\n\n  state.logs.push(entry);\n  state.logListeners.forEach((listener) => {\n    listener(entry);\n  });\n};\n\n// Background Thread: Log monitoring 초기화\nexport const initLogMonitor = () => {\n  \"background only\";\n\n  const { lynxConsole, state } = ensureConsoleStructure();\n\n  if (lynxConsole.originalConsole) {\n    console.warn(\"[LynxConsole] Log monitor already initialized\");\n    return;\n  }\n\n  const originalConsole = globalThis.console;\n  lynxConsole.originalConsole = {\n    log: originalConsole.log.bind(originalConsole),\n    warn: originalConsole.warn.bind(originalConsole),\n    error: originalConsole.error.bind(originalConsole),\n    info: originalConsole.info.bind(originalConsole),\n  };\n\n  state.logs = [];\n  state.logListeners = new Set();\n  state.logSubscribe = (listener: LogListener) => {\n    state.logListeners?.add(listener);\n    return () => {\n      state.logListeners?.delete(listener);\n    };\n  };\n\n  // Background Thread console 오버라이드\n  LOG_METHODS.forEach((method) => {\n    globalThis.console[method] = ((...args: unknown[]) => {\n      lynxConsole.originalConsole?.[method](...args);\n      const entry = createLogEntry(method, args);\n      addLogEntry(entry);\n    }).bind(globalThis.console);\n  });\n\n  lynxConsole.originalConsole?.log(\n    \"[LynxConsole] ✅ Log monitoring initialized\",\n  );\n};\n","import { runOnBackground } from \"@lynx-js/react\";\nimport type { LogEntry, LogLevel } from \"../types\";\n\nconst _setupMainThreadConsole = (): void => {\n  \"main thread\";\n\n  //IMPORTANT: do not use external functions in main thread\n  if (!globalThis.__LYNX_CONSOLE__) globalThis.__LYNX_CONSOLE__ = {};\n  const lynxConsole = globalThis.__LYNX_CONSOLE__;\n\n  if (lynxConsole.mainThreadInitialized) {\n    console.warn(\"[LynxConsole] Main thread console already initialized\");\n    return;\n  }\n\n  const LOG_METHODS: LogLevel[] = [\"log\", \"warn\", \"error\", \"info\"];\n  const LOG_ID_PREFIX = \"main-thread\";\n\n  const serializeArgs = (args: unknown[]): unknown[] => {\n    return args.map((arg) => {\n      try {\n        JSON.stringify(arg);\n        return arg;\n      } catch {\n        return String(arg);\n      }\n    });\n  };\n\n  const generateLogId = (): string => {\n    return `${LOG_ID_PREFIX}-${Date.now()}-${Math.random()}`;\n  };\n\n  // Main Thread에서 Background Thread로 로그 전송하는 함수\n  const sendLogToBackground = runOnBackground((entry: LogEntry): void => {\n    const state = globalThis.__LYNX_CONSOLE__?.state;\n    if (!state) return;\n\n    state.logs?.push(entry);\n    state.logListeners?.forEach((listener) => {\n      listener(entry);\n    });\n  });\n\n  const originalConsole = globalThis.console;\n\n  const originalMethods = {\n    log: originalConsole.log.bind(originalConsole),\n    warn: originalConsole.warn.bind(originalConsole),\n    error: originalConsole.error.bind(originalConsole),\n    info: originalConsole.info.bind(originalConsole),\n  };\n\n  // Main Thread console 오버라이드\n  LOG_METHODS.forEach((method) => {\n    const original = originalMethods[method];\n    originalConsole[method] = ((...args: unknown[]) => {\n      // 원본 console 호출\n      original(...args);\n\n      const serializedArgs = serializeArgs(args);\n      const timestamp = Date.now();\n      const id = generateLogId();\n\n      sendLogToBackground({\n        id,\n        level: method,\n        message: \"\",\n        timestamp,\n        args: serializedArgs,\n      });\n    }).bind(originalConsole);\n  });\n\n  lynxConsole.mainThreadInitialized = true;\n\n  originalConsole.log(\"[LynxConsole] ✅ Main thread console initialized\");\n};\n\nexport default _setupMainThreadConsole;\n","// both thread;\nimport \"./_setupMainThreadConsole\";\n\nimport { runOnMainThread } from \"@lynx-js/react\";\nimport { ensureConsoleStructure } from \"../shared/ensureConsoleStructure\";\nimport _setupMainThreadConsole from \"./_setupMainThreadConsole\";\n\n// Main Thread: Console 초기화\n\nexport const initMainThreadConsole = async (): Promise<void> => {\n  \"background only\";\n\n  const { lynxConsole, state } = ensureConsoleStructure();\n\n  if (lynxConsole.mainThreadInitialized) {\n    console.error(\"[LynxConsole] Main thread console already initialized\");\n    return;\n  }\n\n  if (!state.logs) {\n    console.error(\"[LynxConsole] Background thread console not initialized\");\n    return;\n  }\n\n  try {\n    const setupOnMainThread = runOnMainThread(_setupMainThreadConsole);\n    await setupOnMainThread();\n  } catch (error) {\n    console.error(\n      \"[LynxConsole] Failed to initialize main thread console:\",\n      error,\n    );\n  }\n};\n","import { stringify } from \"javascript-stringify\";\nimport { ensureConsoleStructure } from \"../shared/ensureConsoleStructure\";\nimport type { NetworkEntry } from \"../types\";\n\nconst generateNetworkId = (): string => {\n  return `network-${Date.now()}-${Math.random()}`;\n};\n\nconst extractUrl = (input: RequestInfo | URL): string => {\n  if (typeof input === \"string\") return input;\n  if (input instanceof URL) return input.href;\n  return (input as Request).url;\n};\n\nconst extractMethod = (\n  input: RequestInfo | URL,\n  init?: RequestInit,\n): string | undefined => {\n  if (init?.method) return init.method;\n  if (typeof input === \"object\" && \"method\" in input) {\n    return (input as Request).method;\n  }\n  return \"GET\";\n};\n\nconst extractHeaders = (\n  headers: HeadersInit | undefined,\n): Record<string, string> => {\n  const result: Record<string, string> = {};\n  if (!headers) return result;\n\n  try {\n    if (headers instanceof Headers) {\n      headers.forEach((value, key) => {\n        result[key] = value;\n      });\n    } else if (Array.isArray(headers)) {\n      headers.forEach(([key, value]) => {\n        result[key] = value;\n      });\n    } else {\n      Object.entries(headers).forEach(([key, value]) => {\n        result[key] = value;\n      });\n    }\n  } catch (error) {\n    console.error(\"[LynxConsole] Failed to extract headers:\", error);\n  }\n\n  return result;\n};\n\nconst mergeRequestHeaders = (\n  input: RequestInfo | URL,\n  init?: RequestInit,\n): Record<string, string> => {\n  const merged: Record<string, string> = {};\n\n  // Request 객체나 URL 객체에서 헤더 추출\n  if (typeof input === \"object\" && \"headers\" in input) {\n    Object.assign(merged, extractHeaders(input.headers as HeadersInit));\n  }\n\n  // RequestInit에서 헤더 추출 (나중 값이 우선)\n  if (init?.headers) {\n    Object.assign(merged, extractHeaders(init.headers));\n  }\n\n  return merged;\n};\n\nconst addNetworkEntry = (entry: NetworkEntry): void => {\n  const state = globalThis.__LYNX_CONSOLE__?.state;\n  if (!state?.networks || !state?.networksMap || !state?.networkListeners) {\n    console.error(\n      \"[LynxConsole] Cannot add network entry: Network monitor not initialized. Call initNetworkMonitor() first.\",\n    );\n    return;\n  }\n\n  state.networks.push(entry);\n  state.networksMap.set(entry.id, entry);\n\n  state.networkListeners.forEach((listener) => {\n    listener(entry);\n  });\n};\n\nconst updateNetworkEntry = (\n  id: string,\n  updates: Partial<NetworkEntry>,\n): void => {\n  const state = globalThis.__LYNX_CONSOLE__?.state;\n  if (!state?.networks || !state?.networksMap || !state?.networkListeners) {\n    console.error(\n      \"[LynxConsole] Cannot update network entry: Network monitor not initialized. Call initNetworkMonitor() first.\",\n    );\n    return;\n  }\n\n  const existingEntry = state.networksMap.get(id);\n  if (!existingEntry) {\n    console.error(\n      `[LynxConsole] Cannot update network entry: Entry with id '${id}' not found.`,\n    );\n    return;\n  }\n\n  const updatedEntry = { ...existingEntry, ...updates };\n\n  const index = state.networks.findIndex((entry) => entry.id === id);\n  if (index !== -1) {\n    state.networks[index] = updatedEntry;\n  }\n\n  state.networksMap.set(id, updatedEntry);\n\n  state.networkListeners.forEach((listener) => {\n    listener(updatedEntry);\n  });\n};\n\nexport const initNetworkMonitor = () => {\n  if (!lynx.fetch) {\n    console.warn(\n      \"[LynxConsole] lynx.fetch not available, skipping network monitor\",\n    );\n    return;\n  }\n\n  const { state } = ensureConsoleStructure();\n\n  if (state.networks !== undefined) {\n    console.warn(\"[LynxConsole] Network monitor already initialized\");\n    return;\n  }\n\n  type NetworkListener = (entry: NetworkEntry) => void;\n  state.networks = [];\n  state.networksMap = new Map();\n  state.networkListeners = new Set();\n  state.subscribeNetwork = (listener: NetworkListener) => {\n    state.networkListeners?.add(listener);\n    return () => {\n      state.networkListeners?.delete(listener);\n    };\n  };\n\n  const originalFetch = fetch.bind(lynx);\n\n  const monitoredFetch = async (\n    input: RequestInfo | URL,\n    init?: RequestInit,\n  ): Promise<Response> => {\n    const id = generateNetworkId();\n    const startTime = Date.now();\n    const url = extractUrl(input);\n    const method = extractMethod(input, init);\n\n    const requestHeaders = mergeRequestHeaders(input, init);\n\n    // Request body 처리\n    let requestBody: string | undefined;\n    if (init?.body) {\n      if (typeof init.body === \"string\") {\n        requestBody = init.body;\n      } else if (init.body instanceof URLSearchParams) {\n        requestBody = init.body.toString();\n      } else {\n        // Lynx가 지원하지 않는 타입이거나 알 수 없는 타입\n        requestBody = String(init.body);\n      }\n    }\n\n    addNetworkEntry({\n      id,\n      url,\n      method: method || \"default\",\n      status: \"pending\",\n      startTime,\n      requestHeaders,\n      requestBody: requestBody ?? \"\",\n    });\n\n    try {\n      const response = await originalFetch(input, init);\n      const endTime = Date.now();\n\n      const responseHeaders: Record<string, string> = {};\n      response.headers.forEach((value, key) => {\n        responseHeaders[key] = value;\n      });\n\n      const clonedResponse = response.clone();\n      let responseBody: string | undefined;\n\n      try {\n        const headerMap: Record<string, string> = {};\n        response.headers.forEach((value, key) => {\n          headerMap[key.toLowerCase()] = value;\n        });\n\n        const contentType = headerMap[\"content-type\"];\n        if (contentType?.includes(\"application/json\")) {\n          const json = await clonedResponse.json();\n          responseBody = stringify(json, null, 2, { references: true }) ?? \"\";\n        } else if (contentType?.includes(\"text\")) {\n          responseBody = await clonedResponse.text();\n        }\n      } catch (error) {\n        responseBody = `[Unable to read response body] ${error}`;\n        console.error(\"[LynxConsole] Error reading response body:\", error);\n      }\n\n      updateNetworkEntry(id, {\n        status: \"success\",\n        statusCode: response.status,\n        statusText: response.statusText,\n        endTime,\n        duration: endTime - startTime,\n        responseHeaders,\n        responseBody: responseBody ?? \"\",\n      });\n\n      return response;\n    } catch (error) {\n      const endTime = Date.now();\n      updateNetworkEntry(id, {\n        status: \"error\",\n        endTime,\n        duration: endTime - startTime,\n        error: error instanceof Error ? error.message : String(error),\n      });\n      throw error;\n    }\n  };\n\n  // biome-ignore lint/suspicious/noTsIgnore: to assign fetch to global functionfetch\n  // @ts-ignore\n  // biome-ignore lint/suspicious/noGlobalAssign: to assign fetch to global functionfetch fetch\n  fetch = monitoredFetch as typeof fetch;\n\n  //fetch 대신 lynx.fetch를 사용하는 경우에도 모니터링 되도록 설정\n  lynx.fetch = monitoredFetch as typeof lynx.fetch;\n\n  console.log(\"[LynxConsole] ✅ Network monitoring initialized\");\n};\n","import { ensureConsoleStructure } from \"../shared/ensureConsoleStructure\";\nimport type { PerformanceEntryData, PerformanceEntryType } from \"../types\";\n\ntype PerformanceListener = (entry: PerformanceEntryData) => void;\n\nconst generatePerformanceId = (): string => {\n  return `performance-${Date.now()}-${Math.random()}`;\n};\n\nconst addPerformanceEntry = (entry: PerformanceEntryData): void => {\n  const state = globalThis.__LYNX_CONSOLE__?.state;\n  if (!state?.performances || !state?.performanceListeners) {\n    console.error(\n      \"[LynxConsole] Cannot add performance entry: Performance monitor not initialized. Call initPerformanceMonitor() first.\",\n    );\n    return;\n  }\n\n  state.performances.push(entry);\n  state.performanceListeners.forEach((listener) => {\n    listener(entry);\n  });\n};\n\nexport const initPerformanceMonitor = () => {\n  \"background only\";\n\n  if (!lynx.performance) {\n    console.warn(\n      \"[LynxConsole] lynx.performance not available, skipping performance monitor\",\n    );\n    return;\n  }\n\n  const { state } = ensureConsoleStructure();\n\n  if (state.performances !== undefined) {\n    console.warn(\"[LynxConsole] Performance monitor already initialized\");\n    return;\n  }\n\n  state.performances = [];\n  state.performanceListeners = new Set();\n  state.subscribePerformance = (listener: PerformanceListener) => {\n    state.performanceListeners?.add(listener);\n    return () => {\n      state.performanceListeners?.delete(listener);\n    };\n  };\n\n  const observer = lynx.performance.createObserver((entry) => {\n    const performanceEntry: PerformanceEntryData = {\n      id: generatePerformanceId(),\n      entryType: entry.entryType as PerformanceEntryType,\n      name: entry.name,\n      timestamp: Date.now(),\n      rawEntry: entry,\n    };\n\n    addPerformanceEntry(performanceEntry);\n  });\n\n  observer.observe([\n    \"pipeline\", // LoadBundleEntry\n    \"init\", // InitLynxviewEntry\n    \"metric\", // MetricEntry\n  ]);\n\n  console.log(\"[LynxConsole] ✅ Performance monitoring initialized\");\n};\n"],"mappings":"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"}
+{"version":3,"file":"setup.mjs","names":["devalueStringify","devalueParse","stringify"],"sources":["../src/shared/ensureConsoleStructure.ts","../src/setup/setupLogMonitor.ts","../src/setup/_setupMainThreadConsole.ts","../src/setup/setupMainThreadConsole.ts","../src/setup/setupNetworkMonitor.ts","../src/setup/setupPerformanceMonitor.ts"],"sourcesContent":["type LynxConsole = NonNullable<typeof globalThis.__LYNX_CONSOLE__>;\ntype ConsoleState = NonNullable<LynxConsole[\"state\"]>;\n\nexport const ensureConsoleStructure = (): {\n  lynxConsole: LynxConsole;\n  state: ConsoleState;\n} => {\n  if (!globalThis.__LYNX_CONSOLE__) {\n    globalThis.__LYNX_CONSOLE__ = {};\n  }\n\n  if (!globalThis.__LYNX_CONSOLE__.state) {\n    globalThis.__LYNX_CONSOLE__.state = {};\n  }\n\n  return {\n    lynxConsole: globalThis.__LYNX_CONSOLE__,\n    state: globalThis.__LYNX_CONSOLE__.state,\n  };\n};\n","import { ensureConsoleStructure } from \"../shared/ensureConsoleStructure\";\nimport type { LogEntry, LogLevel } from \"../types\";\n\ntype LogListener = (entry: LogEntry) => void;\n\nconst LOG_METHODS: LogLevel[] = [\"log\", \"warn\", \"error\", \"info\"];\nconst LOG_ID_PREFIX = \"background-thread\";\n\nconst generateLogId = (): string => {\n  return `${LOG_ID_PREFIX}-${Date.now()}-${Math.random()}`;\n};\n\nconst createLogEntry = (method: LogLevel, args: unknown[]): LogEntry => {\n  return {\n    id: generateLogId(),\n    level: method,\n    message: \"\",\n    timestamp: Date.now(),\n    args,\n  };\n};\n\nconst addLogEntry = (entry: LogEntry): void => {\n  const state = globalThis.__LYNX_CONSOLE__?.state;\n  if (!state?.logs || !state?.logListeners) {\n    console.error(\n      \"[LynxConsole] Cannot add log entry: Log monitor not initialized. Call initLogMonitor() first.\",\n    );\n    return;\n  }\n\n  state.logs.push(entry);\n  state.logListeners.forEach((listener) => {\n    listener(entry);\n  });\n};\n\n// Background Thread: Log monitoring 초기화\nexport const initLogMonitor = () => {\n  \"background only\";\n\n  const { lynxConsole, state } = ensureConsoleStructure();\n\n  if (lynxConsole.originalConsole) {\n    console.warn(\"[LynxConsole] Log monitor already initialized\");\n    return;\n  }\n\n  const originalConsole = globalThis.console;\n  lynxConsole.originalConsole = {\n    log: originalConsole.log.bind(originalConsole),\n    warn: originalConsole.warn.bind(originalConsole),\n    error: originalConsole.error.bind(originalConsole),\n    info: originalConsole.info.bind(originalConsole),\n  };\n\n  state.logs = [];\n  state.logListeners = new Set();\n  state.logSubscribe = (listener: LogListener) => {\n    state.logListeners?.add(listener);\n    return () => {\n      state.logListeners?.delete(listener);\n    };\n  };\n\n  // Background Thread console 오버라이드\n  LOG_METHODS.forEach((method) => {\n    globalThis.console[method] = ((...args: unknown[]) => {\n      lynxConsole.originalConsole?.[method](...args);\n      const entry = createLogEntry(method, args);\n      addLogEntry(entry);\n    }).bind(globalThis.console);\n  });\n\n  lynxConsole.originalConsole?.log(\n    \"[LynxConsole] ✅ Log monitoring initialized\",\n  );\n};\n","import { runOnBackground } from \"@lynx-js/react\";\nimport { stringify as devalueStringify } from \"devalue\" with {\n  runtime: \"shared\",\n};\nimport { parse as devalueParse } from \"devalue\";\nimport type { LogEntry, LogLevel } from \"../types\";\n\nconst _setupMainThreadConsole = (): void => {\n  \"main thread\";\n\n  //IMPORTANT: do not use external functions in main thread\n  if (!globalThis.__LYNX_CONSOLE__) globalThis.__LYNX_CONSOLE__ = {};\n  const lynxConsole = globalThis.__LYNX_CONSOLE__;\n\n  if (lynxConsole.mainThreadInitialized) {\n    console.warn(\"[LynxConsole] Main thread console already initialized\");\n    return;\n  }\n\n  const LOG_METHODS: LogLevel[] = [\"log\", \"warn\", \"error\", \"info\"];\n  const LOG_ID_PREFIX = \"main-thread\";\n\n  const serializeArgs = (args: unknown[]): string[] => {\n    return args.map((arg) => {\n      try {\n        return devalueStringify(arg);\n      } catch {\n        return devalueStringify(String(arg));\n      }\n    });\n  };\n\n  const generateLogId = (): string => {\n    return `${LOG_ID_PREFIX}-${Date.now()}-${Math.random()}`;\n  };\n\n  // Main Thread에서 Background Thread로 로그 전송하는 함수\n  const sendLogToBackground = runOnBackground((entry: LogEntry): void => {\n    const state = globalThis.__LYNX_CONSOLE__?.state;\n    if (!state) return;\n\n    // devalue 문자열을 원래 타입으로 복원\n    entry.args = entry.args.map((arg) => {\n      if (typeof arg !== \"string\") {\n        throw new Error(\n          `[LynxConsole] Expected devalue string, got ${typeof arg}`,\n        );\n      }\n      return devalueParse(arg);\n    });\n\n    state.logs?.push(entry);\n    state.logListeners?.forEach((listener) => {\n      listener(entry);\n    });\n  });\n\n  const originalConsole = globalThis.console;\n\n  const originalMethods = {\n    log: originalConsole.log.bind(originalConsole),\n    warn: originalConsole.warn.bind(originalConsole),\n    error: originalConsole.error.bind(originalConsole),\n    info: originalConsole.info.bind(originalConsole),\n  };\n\n  // Main Thread console 오버라이드\n  LOG_METHODS.forEach((method) => {\n    const original = originalMethods[method];\n    originalConsole[method] = ((...args: unknown[]) => {\n      // 원본 console 호출\n      original(...args);\n\n      const serializedArgs = serializeArgs(args);\n      const timestamp = Date.now();\n      const id = generateLogId();\n\n      sendLogToBackground({\n        id,\n        level: method,\n        message: \"\",\n        timestamp,\n        args: serializedArgs,\n      });\n    }).bind(originalConsole);\n  });\n\n  lynxConsole.mainThreadInitialized = true;\n\n  originalConsole.log(\"[LynxConsole] ✅ Main thread console initialized\");\n};\n\nexport default _setupMainThreadConsole;\n","// both thread;\nimport \"./_setupMainThreadConsole\";\n\nimport { runOnMainThread } from \"@lynx-js/react\";\nimport { ensureConsoleStructure } from \"../shared/ensureConsoleStructure\";\nimport _setupMainThreadConsole from \"./_setupMainThreadConsole\";\n\n// Main Thread: Console 초기화\n\nexport const initMainThreadConsole = async (): Promise<void> => {\n  \"background only\";\n\n  const { lynxConsole, state } = ensureConsoleStructure();\n\n  if (lynxConsole.mainThreadInitialized) {\n    console.error(\"[LynxConsole] Main thread console already initialized\");\n    return;\n  }\n\n  if (!state.logs) {\n    console.error(\"[LynxConsole] Background thread console not initialized\");\n    return;\n  }\n\n  try {\n    const setupOnMainThread = runOnMainThread(_setupMainThreadConsole);\n    await setupOnMainThread();\n  } catch (error) {\n    console.error(\n      \"[LynxConsole] Failed to initialize main thread console:\",\n      error,\n    );\n  }\n};\n","import { stringify } from \"javascript-stringify\";\nimport { ensureConsoleStructure } from \"../shared/ensureConsoleStructure\";\nimport type { NetworkEntry } from \"../types\";\n\nconst generateNetworkId = (): string => {\n  return `network-${Date.now()}-${Math.random()}`;\n};\n\nconst extractUrl = (input: RequestInfo | URL): string => {\n  if (typeof input === \"string\") return input;\n  if (input instanceof URL) return input.href;\n  return (input as Request).url;\n};\n\nconst extractMethod = (\n  input: RequestInfo | URL,\n  init?: RequestInit,\n): string | undefined => {\n  if (init?.method) return init.method;\n  if (typeof input === \"object\" && \"method\" in input) {\n    return (input as Request).method;\n  }\n  return \"GET\";\n};\n\nconst extractHeaders = (\n  headers: HeadersInit | undefined,\n): Record<string, string> => {\n  const result: Record<string, string> = {};\n  if (!headers) return result;\n\n  try {\n    if (headers instanceof Headers) {\n      headers.forEach((value, key) => {\n        result[key] = value;\n      });\n    } else if (Array.isArray(headers)) {\n      headers.forEach(([key, value]) => {\n        result[key] = value;\n      });\n    } else {\n      Object.entries(headers).forEach(([key, value]) => {\n        result[key] = value;\n      });\n    }\n  } catch (error) {\n    console.error(\"[LynxConsole] Failed to extract headers:\", error);\n  }\n\n  return result;\n};\n\nconst mergeRequestHeaders = (\n  input: RequestInfo | URL,\n  init?: RequestInit,\n): Record<string, string> => {\n  const merged: Record<string, string> = {};\n\n  // Request 객체나 URL 객체에서 헤더 추출\n  if (typeof input === \"object\" && \"headers\" in input) {\n    Object.assign(merged, extractHeaders(input.headers as HeadersInit));\n  }\n\n  // RequestInit에서 헤더 추출 (나중 값이 우선)\n  if (init?.headers) {\n    Object.assign(merged, extractHeaders(init.headers));\n  }\n\n  return merged;\n};\n\nconst addNetworkEntry = (entry: NetworkEntry): void => {\n  const state = globalThis.__LYNX_CONSOLE__?.state;\n  if (!state?.networks || !state?.networksMap || !state?.networkListeners) {\n    console.error(\n      \"[LynxConsole] Cannot add network entry: Network monitor not initialized. Call initNetworkMonitor() first.\",\n    );\n    return;\n  }\n\n  state.networks.push(entry);\n  state.networksMap.set(entry.id, entry);\n\n  state.networkListeners.forEach((listener) => {\n    listener(entry);\n  });\n};\n\nconst updateNetworkEntry = (\n  id: string,\n  updates: Partial<NetworkEntry>,\n): void => {\n  const state = globalThis.__LYNX_CONSOLE__?.state;\n  if (!state?.networks || !state?.networksMap || !state?.networkListeners) {\n    console.error(\n      \"[LynxConsole] Cannot update network entry: Network monitor not initialized. Call initNetworkMonitor() first.\",\n    );\n    return;\n  }\n\n  const existingEntry = state.networksMap.get(id);\n  if (!existingEntry) {\n    console.error(\n      `[LynxConsole] Cannot update network entry: Entry with id '${id}' not found.`,\n    );\n    return;\n  }\n\n  const updatedEntry = { ...existingEntry, ...updates };\n\n  const index = state.networks.findIndex((entry) => entry.id === id);\n  if (index !== -1) {\n    state.networks[index] = updatedEntry;\n  }\n\n  state.networksMap.set(id, updatedEntry);\n\n  state.networkListeners.forEach((listener) => {\n    listener(updatedEntry);\n  });\n};\n\nexport const initNetworkMonitor = () => {\n  if (!lynx.fetch) {\n    console.warn(\n      \"[LynxConsole] lynx.fetch not available, skipping network monitor\",\n    );\n    return;\n  }\n\n  const { state } = ensureConsoleStructure();\n\n  if (state.networks !== undefined) {\n    console.warn(\"[LynxConsole] Network monitor already initialized\");\n    return;\n  }\n\n  type NetworkListener = (entry: NetworkEntry) => void;\n  state.networks = [];\n  state.networksMap = new Map();\n  state.networkListeners = new Set();\n  state.subscribeNetwork = (listener: NetworkListener) => {\n    state.networkListeners?.add(listener);\n    return () => {\n      state.networkListeners?.delete(listener);\n    };\n  };\n\n  const originalFetch = fetch.bind(lynx);\n\n  const monitoredFetch = async (\n    input: RequestInfo | URL,\n    init?: RequestInit,\n  ): Promise<Response> => {\n    const id = generateNetworkId();\n    const startTime = Date.now();\n    const url = extractUrl(input);\n    const method = extractMethod(input, init);\n\n    const requestHeaders = mergeRequestHeaders(input, init);\n\n    // Request body 처리\n    let requestBody: string | undefined;\n    if (init?.body) {\n      if (typeof init.body === \"string\") {\n        requestBody = init.body;\n      } else if (init.body instanceof URLSearchParams) {\n        requestBody = init.body.toString();\n      } else {\n        // Lynx가 지원하지 않는 타입이거나 알 수 없는 타입\n        requestBody = String(init.body);\n      }\n    }\n\n    addNetworkEntry({\n      id,\n      url,\n      method: method || \"default\",\n      status: \"pending\",\n      startTime,\n      requestHeaders,\n      requestBody: requestBody ?? \"\",\n    });\n\n    try {\n      const response = await originalFetch(input, init);\n      const endTime = Date.now();\n\n      const responseHeaders: Record<string, string> = {};\n      response.headers.forEach((value, key) => {\n        responseHeaders[key] = value;\n      });\n\n      const clonedResponse = response.clone();\n      let responseBody: string | undefined;\n\n      try {\n        const headerMap: Record<string, string> = {};\n        response.headers.forEach((value, key) => {\n          headerMap[key.toLowerCase()] = value;\n        });\n\n        const contentType = headerMap[\"content-type\"];\n        if (contentType?.includes(\"application/json\")) {\n          const json = await clonedResponse.json();\n          responseBody = stringify(json, null, 2, { references: true }) ?? \"\";\n        } else if (contentType?.includes(\"text\")) {\n          responseBody = await clonedResponse.text();\n        }\n      } catch (error) {\n        responseBody = `[Unable to read response body] ${error}`;\n        console.error(\"[LynxConsole] Error reading response body:\", error);\n      }\n\n      updateNetworkEntry(id, {\n        status: \"success\",\n        statusCode: response.status,\n        statusText: response.statusText,\n        endTime,\n        duration: endTime - startTime,\n        responseHeaders,\n        responseBody: responseBody ?? \"\",\n      });\n\n      return response;\n    } catch (error) {\n      const endTime = Date.now();\n      updateNetworkEntry(id, {\n        status: \"error\",\n        endTime,\n        duration: endTime - startTime,\n        error: error instanceof Error ? error.message : String(error),\n      });\n      throw error;\n    }\n  };\n\n  // biome-ignore lint/suspicious/noTsIgnore: to assign fetch to global functionfetch\n  // @ts-ignore\n  // biome-ignore lint/suspicious/noGlobalAssign: to assign fetch to global functionfetch fetch\n  fetch = monitoredFetch as typeof fetch;\n\n  //fetch 대신 lynx.fetch를 사용하는 경우에도 모니터링 되도록 설정\n  lynx.fetch = monitoredFetch as typeof lynx.fetch;\n\n  console.log(\"[LynxConsole] ✅ Network monitoring initialized\");\n};\n","import { ensureConsoleStructure } from \"../shared/ensureConsoleStructure\";\nimport type { PerformanceEntryData, PerformanceEntryType } from \"../types\";\n\ntype PerformanceListener = (entry: PerformanceEntryData) => void;\n\nconst generatePerformanceId = (): string => {\n  return `performance-${Date.now()}-${Math.random()}`;\n};\n\nconst addPerformanceEntry = (entry: PerformanceEntryData): void => {\n  const state = globalThis.__LYNX_CONSOLE__?.state;\n  if (!state?.performances || !state?.performanceListeners) {\n    console.error(\n      \"[LynxConsole] Cannot add performance entry: Performance monitor not initialized. Call initPerformanceMonitor() first.\",\n    );\n    return;\n  }\n\n  state.performances.push(entry);\n  state.performanceListeners.forEach((listener) => {\n    listener(entry);\n  });\n};\n\nexport const initPerformanceMonitor = () => {\n  \"background only\";\n\n  if (!lynx.performance) {\n    console.warn(\n      \"[LynxConsole] lynx.performance not available, skipping performance monitor\",\n    );\n    return;\n  }\n\n  const { state } = ensureConsoleStructure();\n\n  if (state.performances !== undefined) {\n    console.warn(\"[LynxConsole] Performance monitor already initialized\");\n    return;\n  }\n\n  state.performances = [];\n  state.performanceListeners = new Set();\n  state.subscribePerformance = (listener: PerformanceListener) => {\n    state.performanceListeners?.add(listener);\n    return () => {\n      state.performanceListeners?.delete(listener);\n    };\n  };\n\n  const observer = lynx.performance.createObserver((entry) => {\n    const performanceEntry: PerformanceEntryData = {\n      id: generatePerformanceId(),\n      entryType: entry.entryType as PerformanceEntryType,\n      name: entry.name,\n      timestamp: Date.now(),\n      rawEntry: entry,\n    };\n\n    addPerformanceEntry(performanceEntry);\n  });\n\n  observer.observe([\n    \"pipeline\", // LoadBundleEntry\n    \"init\", // InitLynxviewEntry\n    \"metric\", // MetricEntry\n  ]);\n\n  console.log(\"[LynxConsole] ✅ Performance monitoring initialized\");\n};\n"],"mappings":"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"}

package/package.json

@@ -1,10 +1,9 @@
 {
   "name": "lynx-console",
-  "version": "0.3.0",
+  "version": "0.4.0",
   "type": "module",
   "sideEffects": [
-    "**/*.css",
-    "dist/index.css"
+    "**/*.css"
   ],
   "exports": {
     ".": {
@@ -16,8 +15,7 @@
       "types": "./dist/setup.d.mts",
       "import": "./dist/setup.mjs",
       "require": "./dist/setup.cjs"
-    },
-    "./style.css": "./dist/index.css"
+    }
   },
   "main": "dist/index.mjs",
   "types": "dist/index.d.mts",
@@ -38,11 +36,12 @@
     "typescript": "^5.9.3"
   },
   "peerDependencies": {
-    "@lynx-js/react": "^0.116.0",
-    "@lynx-js/types": "^3.7.0",
+    "@lynx-js/react": "^0.110.0",
+    "@lynx-js/types": "^3.6.0",
     "@types/react": "^18"
   },
   "dependencies": {
+    "devalue": "^5.6.4",
     "javascript-stringify": "^2.1.0"
   },
   "repository": {

package/src/components/LogPanel.tsx

@@ -4,6 +4,7 @@ import { stringify } from "javascript-stringify";
 import { useThemeColors } from "../styles/ThemeContext";
 import { fontWeight, type ThemeColors } from "../styles/theme";
 import type { LogEntry, LogLevel } from "../types";
+import { parseConsoleArgs } from "../utils/parseFormat";
 import "./ConsolePanel.css";
 
 const LOG_LEVELS: LogLevel[] = ["log", "info", "warn", "error"];
@@ -182,7 +183,6 @@ export const LogPanel = ({ logs, clearLogs }: LogPanelProps) => {
       ?.invoke({ method: "setValue", params: { value: "" } })
       .exec();
     runCode(trimmed);
-    setTimeout(() => scrollToBottom(false), 100);
   };
 
   const renderArg = (
@@ -537,19 +537,46 @@ export const LogPanel = ({ logs, clearLogs }: LogPanelProps) => {
                     </text>
                   </view>
                   <view className={"cp-logArgsContainer"}>
-                    {log.args.map((arg, index) => (
-                      <view
-                        key={`${log.id}-${index.toString()}`}
-                        className={"cp-logArgItem"}
-                        style={{ fontWeight: fontWeight.regular }}
-                      >
-                        {renderArg(
-                          arg,
-                          `${log.id}-${index.toString()}`,
-                          log.level,
-                        )}
-                      </view>
-                    ))}
+                    {(() => {
+                      const { segments, rest } = parseConsoleArgs(log.args);
+                      const baseTextStyle = {
+                        color: getStringColor(colors, log.level),
+                        fontWeight: fontWeight.regular,
+                      };
+                      const wrap = (key: string, content: React.ReactNode) => (
+                        <view
+                          key={key}
+                          className={"cp-logArgItem"}
+                          style={{ fontWeight: fontWeight.regular }}
+                        >
+                          {content}
+                        </view>
+                      );
+                      return (
+                        <>
+                          {segments.map((seg, index) => {
+                            const key = `${log.id}-seg-${index.toString()}`;
+                            return wrap(
+                              key,
+                              seg.type === "text" ? (
+                                <text
+                                  className={"cp-argString t3"}
+                                  style={{ ...baseTextStyle, ...seg.style }}
+                                >
+                                  {seg.text}
+                                </text>
+                              ) : (
+                                renderArg(seg.value, key, log.level)
+                              ),
+                            );
+                          })}
+                          {rest.map((arg, index) => {
+                            const key = `${log.id}-rest-${index.toString()}`;
+                            return wrap(key, renderArg(arg, key, log.level));
+                          })}
+                        </>
+                      );
+                    })()}
                   </view>
                 </view>
               </list-item>

package/src/setup/_setupMainThreadConsole.ts

@@ -1,4 +1,8 @@
 import { runOnBackground } from "@lynx-js/react";
+import { stringify as devalueStringify } from "devalue" with {
+  runtime: "shared",
+};
+import { parse as devalueParse } from "devalue";
 import type { LogEntry, LogLevel } from "../types";
 
 const _setupMainThreadConsole = (): void => {
@@ -16,13 +20,12 @@ const _setupMainThreadConsole = (): void => {
   const LOG_METHODS: LogLevel[] = ["log", "warn", "error", "info"];
   const LOG_ID_PREFIX = "main-thread";
 
-  const serializeArgs = (args: unknown[]): unknown[] => {
+  const serializeArgs = (args: unknown[]): string[] => {
     return args.map((arg) => {
       try {
-        JSON.stringify(arg);
-        return arg;
+        return devalueStringify(arg);
       } catch {
-        return String(arg);
+        return devalueStringify(String(arg));
       }
     });
   };
@@ -36,6 +39,16 @@ const _setupMainThreadConsole = (): void => {
     const state = globalThis.__LYNX_CONSOLE__?.state;
     if (!state) return;
 
+    // devalue 문자열을 원래 타입으로 복원
+    entry.args = entry.args.map((arg) => {
+      if (typeof arg !== "string") {
+        throw new Error(
+          `[LynxConsole] Expected devalue string, got ${typeof arg}`,
+        );
+      }
+      return devalueParse(arg);
+    });
+
     state.logs?.push(entry);
     state.logListeners?.forEach((listener) => {
       listener(entry);

package/src/utils/parseCssStyle.ts

@@ -0,0 +1,24 @@
+export type StyleObject = Record<string, string>;
+
+const DANGEROUS_VALUE = /url\s*\(|expression\s*\(|@import/i;
+
+const toCamelCase = (name: string): string => {
+  if (name.startsWith("--")) return name;
+  return name.replace(/-([a-z])/g, (_, c: string) => c.toUpperCase());
+};
+
+export const parseCssString = (css: string): StyleObject => {
+  const result: StyleObject = {};
+  for (const raw of css.split(";")) {
+    const decl = raw.trim();
+    if (!decl) continue;
+    const colon = decl.indexOf(":");
+    if (colon <= 0) continue;
+    const name = decl.slice(0, colon).trim().toLowerCase();
+    const value = decl.slice(colon + 1).trim();
+    if (!name || !value) continue;
+    if (DANGEROUS_VALUE.test(value)) continue;
+    result[toCamelCase(name)] = value;
+  }
+  return result;
+};

package/src/utils/parseFormat.ts

@@ -0,0 +1,90 @@
+import { parseCssString, type StyleObject } from "./parseCssStyle";
+
+export type LogSegment =
+  | { type: "text"; text: string; style?: StyleObject }
+  | { type: "arg"; value: unknown };
+
+export interface ParsedLogArgs {
+  segments: LogSegment[];
+  rest: unknown[];
+}
+
+const HAS_FORMAT = /%[csdifoO%]/;
+
+const formatNumber = (v: unknown, int: boolean): string => {
+  const n =
+    typeof v === "number"
+      ? int
+        ? Math.trunc(v)
+        : v
+      : typeof v === "symbol"
+        ? Number.NaN
+        : int
+          ? parseInt(String(v), 10)
+          : parseFloat(String(v));
+  return Number.isNaN(n) ? "NaN" : String(n);
+};
+
+export const parseConsoleArgs = (args: unknown[]): ParsedLogArgs => {
+  const first = args[0];
+  if (typeof first !== "string" || !HAS_FORMAT.test(first)) {
+    return { segments: [], rest: args };
+  }
+
+  const segments: LogSegment[] = [];
+  let currentText = "";
+  let currentStyle: StyleObject | undefined;
+  let argIndex = 1;
+  let lastIndex = 0;
+
+  const flushText = () => {
+    if (currentText) {
+      segments.push({ type: "text", text: currentText, style: currentStyle });
+      currentText = "";
+    }
+  };
+
+  const re = /%([csdifoO%])/g;
+  let match: RegExpExecArray | null = re.exec(first);
+  while (match !== null) {
+    currentText += first.slice(lastIndex, match.index);
+    lastIndex = re.lastIndex;
+    const spec = match[1];
+
+    if (spec === "%") {
+      currentText += "%";
+    } else if (argIndex >= args.length) {
+      currentText += match[0];
+    } else {
+      const arg = args[argIndex++];
+      switch (spec) {
+        case "c":
+          flushText();
+          currentStyle =
+            typeof arg === "string" ? parseCssString(arg) : undefined;
+          break;
+        case "s":
+          currentText += String(arg);
+          break;
+        case "d":
+        case "i":
+          currentText += formatNumber(arg, true);
+          break;
+        case "f":
+          currentText += formatNumber(arg, false);
+          break;
+        case "o":
+        case "O":
+          flushText();
+          segments.push({ type: "arg", value: arg });
+          break;
+      }
+    }
+
+    match = re.exec(first);
+  }
+  currentText += first.slice(lastIndex);
+  flushText();
+
+  return { segments, rest: args.slice(argIndex) };
+};

package/src/styles/tokens.json

@@ -1,80 +0,0 @@
-{
-  "dimensions": {
-    "$dimension.x0_5": "2px",
-    "$dimension.x1": "4px",
-    "$dimension.x1_5": "6px",
-    "$dimension.x2": "8px",
-    "$dimension.x2_5": "10px",
-    "$dimension.x3": "12px",
-    "$dimension.x3_5": "14px",
-    "$dimension.x4": "16px",
-    "$dimension.x4_5": "18px",
-    "$dimension.x5": "20px",
-    "$dimension.x6": "24px",
-    "$dimension.x7": "28px",
-    "$dimension.x8": "32px",
-    "$dimension.x9": "36px",
-    "$dimension.x10": "40px",
-    "$dimension.x12": "48px",
-    "$dimension.x13": "52px",
-    "$dimension.x14": "56px",
-    "$dimension.x16": "64px",
-    "$dimension.spacing-x.between-chips": "8px",
-    "$dimension.spacing-x.global-gutter": "16px",
-    "$dimension.spacing-y.component-default": "12px",
-    "$dimension.spacing-y.nav-to-title": "20px",
-    "$dimension.spacing-y.screen-bottom": "56px",
-    "$dimension.spacing-y.between-text": "6px",
-    "$font-size.t1": "0.6875rem",
-    "$font-size.t2": "0.75rem",
-    "$font-size.t3": "0.8125rem",
-    "$font-size.t4": "0.875rem",
-    "$font-size.t5": "1rem",
-    "$font-size.t6": "1.125rem",
-    "$font-size.t7": "1.25rem",
-    "$font-size.t8": "1.375rem",
-    "$font-size.t9": "1.5rem",
-    "$font-size.t10": "1.625rem",
-    "$font-size.t1-static": "11px",
-    "$font-size.t2-static": "12px",
-    "$font-size.t3-static": "13px",
-    "$font-size.t4-static": "14px",
-    "$font-size.t5-static": "16px",
-    "$font-size.t6-static": "18px",
-    "$font-size.t7-static": "20px",
-    "$font-size.t8-static": "22px",
-    "$font-size.t9-static": "24px",
-    "$font-size.t10-static": "26px",
-    "$line-height.t1": "0.9375rem",
-    "$line-height.t2": "1rem",
-    "$line-height.t3": "1.125rem",
-    "$line-height.t4": "1.1875rem",
-    "$line-height.t5": "1.375rem",
-    "$line-height.t6": "1.5rem",
-    "$line-height.t7": "1.6875rem",
-    "$line-height.t8": "1.875rem",
-    "$line-height.t9": "2rem",
-    "$line-height.t10": "2.1875rem",
-    "$line-height.t1-static": "15px",
-    "$line-height.t2-static": "16px",
-    "$line-height.t3-static": "18px",
-    "$line-height.t4-static": "19px",
-    "$line-height.t5-static": "22px",
-    "$line-height.t6-static": "24px",
-    "$line-height.t7-static": "27px",
-    "$line-height.t8-static": "30px",
-    "$line-height.t9-static": "32px",
-    "$line-height.t10-static": "35px",
-    "$radius.r0_5": "2px",
-    "$radius.r1": "4px",
-    "$radius.r1_5": "6px",
-    "$radius.r2": "8px",
-    "$radius.r2_5": "10px",
-    "$radius.r3": "12px",
-    "$radius.r3_5": "14px",
-    "$radius.r4": "16px",
-    "$radius.r5": "20px",
-    "$radius.r6": "24px",
-    "$radius.full": "9999px"
-  }
-}