@leftium/gg 0.0.34 → 0.0.36

package/README.md

@@ -20,7 +20,27 @@ npm add @leftium/gg
 
 ## SvelteKit Quick Start
 
-### 1. Add Vite plugins
+### 1. Use `gg()` anywhere
+
+```svelte
+<script>
+	import { gg } from '@leftium/gg';
+
+	gg('Hello world');
+
+	// Log expressions (returns first argument)
+	const result = gg(someFunction());
+
+	// Multiple arguments
+	gg('User:', user, 'Status:', status);
+</script>
+```
+
+That's it! Output appears in the browser dev console and terminal. The following optional steps are highly recommended to unlock the full experience:
+
+### 2. Add Vite plugins (optional, recommended)
+
+Without plugins, namespaces are random word-tuples. With plugins, you get real file/function callpoints, open-in-editor links, and icecream-style source expressions.
 
 ```ts
 // vite.config.ts
@@ -39,7 +59,9 @@ export default defineConfig({
 - **Open-in-editor plugin** -- adds dev server middleware for click-to-open
 - **Automatic `es2022` target** -- required for top-level await
 
-### 2. Add the debug console
+### 3. Add the debug console (optional, recommended)
+
+An in-browser debug console (powered by Eruda) with a dedicated GG tab for filtering and inspecting logs — especially useful on mobile.
 
 ```svelte
 <!-- src/routes/+layout.svelte -->
@@ -51,23 +73,7 @@ export default defineConfig({
 {@render children()}
 ```
 
-### 3. Use `gg()` anywhere
-
-```svelte
-<script>
-	import { gg } from '@leftium/gg';
-
-	gg('Hello world');
-
-	// Log expressions (returns first argument)
-	const result = gg(someFunction());
-
-	// Multiple arguments
-	gg('User:', user, 'Status:', status);
-</script>
-```
-
-That's it! In development, a debug console appears automatically.
+In development, the debug console appears automatically.
 In production, add `?gg` to the URL or use a 5-tap gesture to activate.
 
 ## GgConsole Options

package/dist/OpenInEditorLink.svelte

@@ -1,22 +1,32 @@
 <script lang="ts">
 	import { dev } from '$app/environment';
 
+	type GgCallSiteInfo = { fileName: string; functionName: string; url: string };
+
 	let {
-		url,
-		fileName,
-		title = fileName
-	}: { url: string; fileName: string; title?: string } = $props();
+		gg,
+		url = gg?.url,
+		fileName = gg?.fileName,
+		title = gg ? `${gg.fileName}@${gg.functionName}` : fileName
+	}: {
+		gg?: GgCallSiteInfo;
+		url?: string;
+		fileName?: string;
+		title?: string;
+	} = $props();
 
 	// svelte-ignore non_reactive_update
 	let iframeElement: HTMLIFrameElement;
 
 	function onclick(event: MouseEvent) {
-		iframeElement.src = url;
-		event.preventDefault();
+		if (url) {
+			iframeElement.src = url;
+			event.preventDefault();
+		}
 	}
 </script>
 
-{#if dev}
+{#if dev && fileName}
 	[📝<a {onclick} href={url} {title} target="_open-in-editor" class="open-in-editor-link">
 		{fileName}
 	</a>

package/dist/OpenInEditorLink.svelte.d.ts

@@ -1,6 +1,12 @@
-type $$ComponentProps = {
-    url: string;
+type GgCallSiteInfo = {
     fileName: string;
+    functionName: string;
+    url: string;
+};
+type $$ComponentProps = {
+    gg?: GgCallSiteInfo;
+    url?: string;
+    fileName?: string;
     title?: string;
 };
 declare const OpenInEditorLink: import("svelte").Component<$$ComponentProps, {}, "">;

package/dist/eruda/plugin.js

@@ -521,7 +521,62 @@ export function createGgPlugin(options, gg) {
 					padding-bottom: 4px;
 					border-bottom: 1px solid #ddd;
 				}
-				.gg-filter-panel {
+				/* Level-based styling for info/warn/error entries */
+				.gg-level-info .gg-log-diff,
+				.gg-level-info .gg-log-ns,
+				.gg-level-info .gg-log-content {
+					background: rgba(23, 162, 184, 0.08);
+				}
+				.gg-level-info .gg-log-content {
+					border-left: 3px solid #17a2b8;
+					padding-left: 6px;
+				}
+				.gg-level-warn .gg-log-diff,
+				.gg-level-warn .gg-log-ns,
+				.gg-level-warn .gg-log-content {
+					background: rgba(255, 200, 0, 0.08);
+				}
+				.gg-level-warn .gg-log-content {
+					border-left: 3px solid #e6a700;
+					padding-left: 6px;
+				}
+				.gg-level-error .gg-log-diff,
+				.gg-level-error .gg-log-ns,
+				.gg-level-error .gg-log-content {
+					background: rgba(255, 50, 50, 0.08);
+				}
+				.gg-level-error .gg-log-content {
+					border-left: 3px solid #cc0000;
+					padding-left: 6px;
+				}
+				/* Stack trace toggle */
+				.gg-stack-toggle {
+					cursor: pointer;
+					font-size: 11px;
+					opacity: 0.6;
+					margin-left: 8px;
+					user-select: none;
+				}
+				.gg-stack-toggle:hover {
+					opacity: 1;
+				}
+				.gg-stack-content {
+					display: none;
+					font-size: 11px;
+					font-family: monospace;
+					white-space: pre;
+					padding: 6px 8px;
+					margin-top: 4px;
+					background: #f0f0f0;
+					border-radius: 3px;
+					overflow-x: auto;
+					color: #666;
+					line-height: 1.4;
+				}
+				.gg-stack-content.expanded {
+					display: block;
+				}
+			.gg-filter-panel {
 					background: #f5f5f5;
 					padding: 10px;
 					margin-bottom: 8px;
@@ -1214,6 +1269,19 @@ export function createGgPlugin(options, gg) {
                 }
                 return;
             }
+            // Handle stack trace toggle
+            if (target?.classList?.contains('gg-stack-toggle')) {
+                const stackId = target.getAttribute('data-stack-id');
+                if (!stackId)
+                    return;
+                const stackEl = containerEl.querySelector(`.gg-stack-content[data-stack-id="${stackId}"]`);
+                if (stackEl) {
+                    const isExpanded = stackEl.classList.contains('expanded');
+                    stackEl.classList.toggle('expanded');
+                    target.textContent = isExpanded ? '▶ stack' : '▼ stack';
+                }
+                return;
+            }
             // Handle clicking namespace to open in editor (when filter collapsed)
             if (target?.classList?.contains('gg-log-ns') &&
                 target.hasAttribute('data-file') &&
@@ -1404,7 +1472,27 @@ export function createGgPlugin(options, gg) {
             let detailsHTML = '';
             // Source expression for this entry (used in hover tooltips and expanded details)
             const srcExpr = entry.src?.trim() && !/^['"`]/.test(entry.src) ? escapeHtml(entry.src) : '';
-            if (entry.args.length > 0) {
+            // HTML table rendering for gg.table() entries
+            if (entry.tableData && entry.tableData.keys.length > 0) {
+                const { keys, rows: tableRows } = entry.tableData;
+                const headerCells = keys
+                    .map((k) => `<th style="padding: 2px 8px; border: 1px solid #ccc; background: #f0f0f0; font-size: 11px; white-space: nowrap;">${escapeHtml(k)}</th>`)
+                    .join('');
+                const bodyRowsHtml = tableRows
+                    .map((row) => {
+                    const cells = keys
+                        .map((k) => {
+                        const val = row[k];
+                        const display = val === undefined ? '' : escapeHtml(String(val));
+                        return `<td style="padding: 2px 8px; border: 1px solid #ddd; font-size: 11px; white-space: nowrap;">${display}</td>`;
+                    })
+                        .join('');
+                    return `<tr>${cells}</tr>`;
+                })
+                    .join('');
+                argsHTML = `<table style="border-collapse: collapse; margin: 2px 0; font-family: monospace;"><thead><tr>${headerCells}</tr></thead><tbody>${bodyRowsHtml}</tbody></table>`;
+            }
+            else if (entry.args.length > 0) {
                 argsHTML = entry.args
                     .map((arg, argIdx) => {
                     if (typeof arg === 'object' && arg !== null) {
@@ -1460,15 +1548,31 @@ export function createGgPlugin(options, gg) {
                 }
             }
             const fileTitle = fileTitleText ? ` title="${escapeHtml(fileTitleText)}"` : '';
+            // Level class for info/warn/error styling
+            const levelClass = entry.level === 'info'
+                ? ' gg-level-info'
+                : entry.level === 'warn'
+                    ? ' gg-level-warn'
+                    : entry.level === 'error'
+                        ? ' gg-level-error'
+                        : '';
+            // Stack trace toggle (for error/trace entries with captured stacks)
+            let stackHTML = '';
+            if (entry.stack) {
+                const stackId = `stack-${index}`;
+                stackHTML =
+                    `<span class="gg-stack-toggle" data-stack-id="${stackId}">▶ stack</span>` +
+                        `<div class="gg-stack-content" data-stack-id="${stackId}">${escapeHtml(entry.stack)}</div>`;
+            }
             // Desktop: grid layout, Mobile: stacked layout
-            return (`<div class="gg-log-entry">` +
+            return (`<div class="gg-log-entry${levelClass}">` +
                 `<div class="gg-log-header">` +
                 iconsCol +
                 `<div class="gg-log-diff${soloClass}" style="color: ${color};"${soloAttr}>${diff}</div>` +
                 `<div class="gg-log-ns${soloClass}" style="color: ${color};"${soloAttr}${fileAttr}${lineAttr}${colAttr}${fileTitle}>${ns}</div>` +
                 `<div class="gg-log-handle"></div>` +
                 `</div>` +
-                `<div class="gg-log-content"${entry.src?.trim() && !/^['"`]/.test(entry.src) ? ` data-src="${escapeHtml(entry.src)}"` : ''}>${argsHTML}</div>` +
+                `<div class="gg-log-content"${!entry.level && entry.src?.trim() && !/^['"`]/.test(entry.src) ? ` data-src="${escapeHtml(entry.src)}"` : ''}>${argsHTML}${stackHTML}</div>` +
                 detailsHTML +
                 `</div>`);
         })

package/dist/eruda/types.d.ts

@@ -18,6 +18,8 @@ export interface GgErudaOptions {
      */
     erudaOptions?: Record<string, unknown>;
 }
+/** Log severity level */
+export type LogLevel = 'debug' | 'info' | 'warn' | 'error';
 /**
  * A captured log entry from gg()
  */
@@ -42,6 +44,15 @@ export interface CapturedEntry {
     col?: number;
     /** Source expression text for icecream-style display (e.g., "user.name") */
     src?: string;
+    /** Log severity level (default: 'debug') */
+    level?: LogLevel;
+    /** Stack trace string (captured for error/trace calls) */
+    stack?: string;
+    /** Structured table data for gg.table() — Eruda renders as HTML table */
+    tableData?: {
+        keys: string[];
+        rows: Array<Record<string, unknown>>;
+    };
 }
 /**
  * Eruda plugin interface

package/dist/gg-call-sites-plugin.js

@@ -39,7 +39,17 @@ export default function ggCallSitesPlugin(options = {}) {
             if (!/\.(js|ts|svelte|jsx|tsx|mjs|mts)(\?.*)?$/.test(id))
                 return null;
             // Quick bail: no gg calls in this file
-            if (!code.includes('gg(') && !code.includes('gg.ns('))
+            if (!code.includes('gg(') &&
+                !code.includes('gg.ns(') &&
+                !code.includes('gg.info(') &&
+                !code.includes('gg.warn(') &&
+                !code.includes('gg.error(') &&
+                !code.includes('gg.table(') &&
+                !code.includes('gg.trace(') &&
+                !code.includes('gg.assert(') &&
+                !code.includes('gg.time(') &&
+                !code.includes('gg.timeLog(') &&
+                !code.includes('gg.timeEnd('))
                 return null;
             // Don't transform gg's own source files
             if (id.includes('/lib/gg.') || id.includes('/lib/debug'))
@@ -122,7 +132,7 @@ export function collectCodeRanges(code) {
         const functionScopes = [];
         // Script blocks (instance + module)
         // The Svelte AST Program node has start/end at runtime but TypeScript's
-        // estree Program type doesn't declare them — cast through any.
+        // estree Program type doesn't declare them — we know they exist.
         if (ast.instance) {
             const content = ast.instance.content;
             ranges.push({ start: content.start, end: content.end, context: 'script' });
@@ -643,61 +653,68 @@ export function transformGgCalls(code, shortPath, filePath, svelteInfo, jsFuncti
     // States for string/comment tracking
     let i = 0;
     while (i < code.length) {
-        // Skip single-line comments
-        if (code[i] === '/' && code[i + 1] === '/') {
-            const end = code.indexOf('\n', i);
-            i = end === -1 ? code.length : end + 1;
-            continue;
-        }
-        // Skip multi-line comments
-        if (code[i] === '/' && code[i + 1] === '*') {
-            const end = code.indexOf('*/', i + 2);
-            i = end === -1 ? code.length : end + 2;
-            continue;
-        }
-        // Skip template literals (backticks)
-        if (code[i] === '`') {
-            i++;
-            let depth = 0;
-            while (i < code.length) {
-                if (code[i] === '\\') {
-                    i += 2;
-                    continue;
-                }
-                if (code[i] === '$' && code[i + 1] === '{') {
-                    depth++;
-                    i += 2;
-                    continue;
-                }
-                if (code[i] === '}' && depth > 0) {
-                    depth--;
-                    i++;
-                    continue;
-                }
-                if (code[i] === '`' && depth === 0) {
+        // For .svelte files, only apply JS string/comment/backtick skipping inside
+        // code ranges (script blocks + template expressions). Outside code ranges,
+        // characters like ' " ` // /* are just HTML prose — NOT JS syntax.
+        // e.g. "Eruda's" contains an apostrophe that is NOT a JS string delimiter.
+        const inCodeRange = !svelteInfo || !!rangeAt(i);
+        if (inCodeRange) {
+            // Skip single-line comments
+            if (code[i] === '/' && code[i + 1] === '/') {
+                const end = code.indexOf('\n', i);
+                i = end === -1 ? code.length : end + 1;
+                continue;
+            }
+            // Skip multi-line comments
+            if (code[i] === '/' && code[i + 1] === '*') {
+                const end = code.indexOf('*/', i + 2);
+                i = end === -1 ? code.length : end + 2;
+                continue;
+            }
+            // Skip template literals (backticks)
+            if (code[i] === '`') {
+                i++;
+                let depth = 0;
+                while (i < code.length) {
+                    if (code[i] === '\\') {
+                        i += 2;
+                        continue;
+                    }
+                    if (code[i] === '$' && code[i + 1] === '{') {
+                        depth++;
+                        i += 2;
+                        continue;
+                    }
+                    if (code[i] === '}' && depth > 0) {
+                        depth--;
+                        i++;
+                        continue;
+                    }
+                    if (code[i] === '`' && depth === 0) {
+                        i++;
+                        break;
+                    }
                     i++;
-                    break;
                 }
-                i++;
+                continue;
             }
-            continue;
-        }
-        // Skip strings (single and double quotes)
-        if (code[i] === '"' || code[i] === "'") {
-            const quote = code[i];
-            i++;
-            while (i < code.length) {
-                if (code[i] === '\\') {
-                    i += 2;
-                    continue;
-                }
-                if (code[i] === quote) {
+            // Skip strings (single and double quotes)
+            if (code[i] === '"' || code[i] === "'") {
+                const quote = code[i];
+                i++;
+                while (i < code.length) {
+                    if (code[i] === '\\') {
+                        i += 2;
+                        continue;
+                    }
+                    if (code[i] === quote) {
+                        i++;
+                        break;
+                    }
                     i++;
-                    break;
                 }
-                i++;
+                continue;
             }
-            continue;
         }
         // Look for 'gg' pattern — could be gg( or gg.ns(
         if (code[i] === 'g' && code[i + 1] === 'g') {
@@ -783,7 +800,44 @@ export function transformGgCalls(code, shortPath, filePath, svelteInfo, jsFuncti
                 i += 6;
                 continue;
             }
-            // Skip other gg.* calls (gg.enable, gg.disable, gg._ns, gg._onLog, etc.)
+            // Case 1b: gg.info/warn/error/table/trace/assert → gg._info/_warn/_error/_table/_trace/_assert
+            // These methods are rewritten like bare gg() but with their internal variant.
+            const dotMethodMatch = code
+                .slice(i + 2)
+                .match(/^\.(info|warn|error|table|trace|assert|time|timeLog|timeEnd)\(/);
+            if (dotMethodMatch) {
+                const methodName = dotMethodMatch[1];
+                const internalName = `_${methodName}`;
+                const methodCallLen = 2 + 1 + methodName.length + 1; // 'gg' + '.' + method + '('
+                const openParenPos = i + methodCallLen - 1;
+                const { line, col } = getLineCol(code, i);
+                const fnName = getFunctionName(i, range);
+                const callpoint = `${shortPath}${fnName ? `@${fnName}` : ''}`;
+                const escapedNs = escapeForString(callpoint);
+                const closeParenPos = findMatchingParen(code, openParenPos);
+                if (closeParenPos === -1) {
+                    i += methodCallLen;
+                    continue;
+                }
+                const argsText = code.slice(openParenPos + 1, closeParenPos).trim();
+                result.push(code.slice(lastIndex, i));
+                if (argsText === '') {
+                    // gg.warn() → gg._warn(opts)
+                    result.push(`gg.${internalName}(${buildOptions(range, escapedNs, line, col)})`);
+                    lastIndex = closeParenPos + 1;
+                    i = closeParenPos + 1;
+                }
+                else {
+                    // gg.warn(expr) → gg._warn(opts, expr)
+                    const escapedSrc = escapeForString(argsText);
+                    result.push(`gg.${internalName}(${buildOptions(range, escapedNs, line, col, escapedSrc)}, `);
+                    lastIndex = openParenPos + 1; // keep original args
+                    i = openParenPos + 1;
+                }
+                modified = true;
+                continue;
+            }
+            // Skip other gg.* calls (gg.enable, gg.disable, gg._ns, gg._onLog, gg.time, etc.)
             if (code[i + 2] === '.') {
                 i += 3;
                 continue;

package/dist/gg.d.ts

@@ -1,6 +1,7 @@
 /**
  * Hook for capturing gg() output (used by Eruda plugin)
  */
+type LogLevel = 'debug' | 'info' | 'warn' | 'error';
 interface CapturedEntry {
     namespace: string;
     color: string;
@@ -12,6 +13,12 @@ interface CapturedEntry {
     line?: number;
     col?: number;
     src?: string;
+    level?: LogLevel;
+    stack?: string;
+    tableData?: {
+        keys: string[];
+        rows: Array<Record<string, unknown>>;
+    };
 }
 type OnLogCallback = (entry: CapturedEntry) => void;
 export declare function gg(): {
@@ -93,6 +100,8 @@ export declare namespace gg {
         line?: number;
         col?: number;
         src?: string;
+        level?: LogLevel;
+        stack?: string;
     }, ...args: unknown[]) => unknown;
     let _o: (ns: string, file?: string, line?: number, col?: number, src?: string) => {
         ns: string;
@@ -101,6 +110,78 @@ export declare namespace gg {
         col?: number;
         src?: string;
     };
+    let info: (...args: unknown[]) => unknown;
+    let warn: (...args: unknown[]) => unknown;
+    let error: (...args: unknown[]) => unknown;
+    let assert: (condition: unknown, ...args: unknown[]) => unknown;
+    let table: (data: unknown, columns?: string[]) => unknown;
+    let time: (label?: string) => void;
+    let timeLog: (label?: string, ...args: unknown[]) => void;
+    let timeEnd: (label?: string) => void;
+    let trace: (...args: unknown[]) => unknown;
+    let _info: (options: {
+        ns: string;
+        file?: string;
+        line?: number;
+        col?: number;
+        src?: string;
+    }, ...args: unknown[]) => unknown;
+    let _warn: (options: {
+        ns: string;
+        file?: string;
+        line?: number;
+        col?: number;
+        src?: string;
+    }, ...args: unknown[]) => unknown;
+    let _error: (options: {
+        ns: string;
+        file?: string;
+        line?: number;
+        col?: number;
+        src?: string;
+    }, ...args: unknown[]) => unknown;
+    let _assert: (options: {
+        ns: string;
+        file?: string;
+        line?: number;
+        col?: number;
+        src?: string;
+    }, condition: unknown, ...args: unknown[]) => unknown;
+    let _table: (options: {
+        ns: string;
+        file?: string;
+        line?: number;
+        col?: number;
+        src?: string;
+    }, data: unknown, columns?: string[]) => unknown;
+    let _trace: (options: {
+        ns: string;
+        file?: string;
+        line?: number;
+        col?: number;
+        src?: string;
+    }, ...args: unknown[]) => unknown;
+    let _time: (options: {
+        ns: string;
+        file?: string;
+        line?: number;
+        col?: number;
+        src?: string;
+    }, label?: string) => void;
+    let _timeLog: (options: {
+        ns: string;
+        file?: string;
+        line?: number;
+        col?: number;
+        src?: string;
+    }, label?: string, ...args: unknown[]) => void;
+    let _timeEnd: (options: {
+        ns: string;
+        file?: string;
+        line?: number;
+        col?: number;
+        src?: string;
+    }, label?: string) => void;
 }
 /**
  * Run gg diagnostics and log configuration status

package/dist/gg.js

@@ -207,53 +207,7 @@ export function gg(...args) {
     // Same call site always produces the same word pair (e.g. "calm-fox").
     // depth=2: skip "Error" header [0] and gg() frame [1]
     const callpoint = resolveCallpoint(2);
-    const namespace = `gg:${callpoint}`;
-    const ggLogFunction = namespaceToLogFunction.get(namespace) ||
-        namespaceToLogFunction.set(namespace, createGgDebugger(namespace)).get(namespace);
-    // Prepare args for logging
-    let logArgs;
-    let returnValue;
-    if (!args.length) {
-        // No arguments: return stub call-site info (no open-in-editor without plugin)
-        logArgs = [`    📝 ${callpoint} (install gg-call-sites-plugin for editor links)`];
-        returnValue = {
-            fileName: callpoint,
-            functionName: '',
-            url: ''
-        };
-    }
-    else if (args.length === 1) {
-        logArgs = [args[0]];
-        returnValue = args[0];
-    }
-    else {
-        logArgs = [args[0], ...args.slice(1)];
-        returnValue = args[0];
-    }
-    // Log to console via debug
-    if (logArgs.length === 1) {
-        ggLogFunction(logArgs[0]);
-    }
-    else {
-        ggLogFunction(logArgs[0], ...logArgs.slice(1));
-    }
-    // Call capture hook if registered (for Eruda plugin)
-    const entry = {
-        namespace,
-        color: ggLogFunction.color,
-        diff: ggLogFunction.diff || 0, // Millisecond diff from debug library
-        message: logArgs.length === 1 ? String(logArgs[0]) : logArgs.map(String).join(' '),
-        args: logArgs, // Keep raw args for object inspection
-        timestamp: Date.now()
-    };
-    if (_onLogCallback) {
-        _onLogCallback(entry);
-    }
-    else {
-        // Buffer early logs before Eruda initializes
-        earlyLogBuffer.push(entry);
-    }
-    return returnValue;
+    return ggLog({ ns: callpoint }, ...args);
 }
 /**
  * gg.ns() - Log with an explicit namespace (callpoint label).
@@ -291,19 +245,14 @@ gg.ns = function (nsLabel, ...args) {
     return gg._ns({ ns: nsLabel }, ...args);
 };
 /**
- * gg._ns() - Internal: log with namespace and source file metadata.
+ * Core logging function shared by all gg methods.
  *
- * Called by the ggCallSitesPlugin Vite plugin, which rewrites both bare gg()
- * calls and manual gg.ns() calls to gg._ns({ns, file, line, col}, ...) at
- * build time. This gives each call site a unique namespace plus the source
- * location for open-in-editor support.
- *
- * @param options - { ns: string; file?: string; line?: number; col?: number }
- * @param args - Same arguments as gg()
- * @returns Same as gg() - the first arg, or call-site info if no args
+ * All public methods (gg, gg.ns, gg.warn, gg.error, gg.table, etc.)
+ * funnel through this function. It handles namespace resolution,
+ * debug output, capture hook, and passthrough return.
  */
-gg._ns = function (options, ...args) {
-    const { ns: nsLabel, file, line, col, src } = options;
+function ggLog(options, ...args) {
+    const { ns: nsLabel, file, line, col, src, level, stack, tableData } = options;
     if (!ggConfig.enabled || isCloudflareWorker()) {
         return args.length ? args[0] : { fileName: '', functionName: '', url: '' };
     }
@@ -333,6 +282,16 @@ gg._ns = function (options, ...args) {
         logArgs = [args[0], ...args.slice(1)];
         returnValue = args[0];
     }
+    // Add level prefix emoji for info/warn/error
+    if (level === 'info') {
+        logArgs[0] = `ℹ️ ${logArgs[0]}`;
+    }
+    else if (level === 'warn') {
+        logArgs[0] = `⚠️ ${logArgs[0]}`;
+    }
+    else if (level === 'error') {
+        logArgs[0] = `⛔ ${logArgs[0]}`;
+    }
     // Log to console via debug
     if (logArgs.length === 1) {
         ggLogFunction(logArgs[0]);
@@ -351,7 +310,10 @@ gg._ns = function (options, ...args) {
         file,
         line,
         col,
-        src
+        src,
+        level,
+        stack,
+        tableData
     };
     if (_onLogCallback) {
         _onLogCallback(entry);
@@ -360,6 +322,21 @@ gg._ns = function (options, ...args) {
         earlyLogBuffer.push(entry);
     }
     return returnValue;
+}
+/**
+ * gg._ns() - Internal: log with namespace and source file metadata.
+ *
+ * Called by the ggCallSitesPlugin Vite plugin, which rewrites both bare gg()
+ * calls and manual gg.ns() calls to gg._ns({ns, file, line, col}, ...) at
+ * build time. This gives each call site a unique namespace plus the source
+ * location for open-in-editor support.
+ *
+ * @param options - { ns: string; file?: string; line?: number; col?: number }
+ * @param args - Same arguments as gg()
+ * @returns Same as gg() - the first arg, or call-site info if no args
+ */
+gg._ns = function (options, ...args) {
+    return ggLog(options, ...args);
 };
 /**
  * gg._o() - Internal: build options object for gg._ns() without object literal syntax.
@@ -390,6 +367,380 @@ gg.clearPersist = () => {
         }
     }
 };
+// ── Console-like methods ───────────────────────────────────────────────
+// Each public method (gg.warn, gg.error, etc.) has a corresponding internal
+// method (gg._warn, gg._error, etc.) that accepts call-site metadata from
+// the Vite plugin. The public methods use runtime stack-based callpoints
+// as a fallback when the plugin isn't installed.
+/**
+ * Capture a cleaned-up stack trace, stripping internal gg frames.
+ * @param skipFrames - Number of internal frames to strip from the top
+ */
+function captureStack(skipFrames) {
+    let stack = new Error().stack || undefined;
+    if (stack) {
+        const lines = stack.split('\n');
+        stack = lines.slice(skipFrames).join('\n');
+    }
+    return stack;
+}
+/**
+ * Get stack from an Error arg or capture a fresh one.
+ */
+function getErrorStack(firstArg, skipFrames) {
+    if (firstArg instanceof Error && firstArg.stack) {
+        return firstArg.stack;
+    }
+    return captureStack(skipFrames);
+}
+/**
+ * gg.info() - Log at info level.
+ *
+ * Passthrough: returns the first argument.
+ * In Eruda, entries are styled with a blue/info indicator.
+ *
+ * @example
+ * gg.info('System startup complete');
+ * const config = gg.info(loadedConfig, 'loaded config');
+ */
+gg.info = function (...args) {
+    if (!ggConfig.enabled || isCloudflareWorker()) {
+        return args.length ? args[0] : undefined;
+    }
+    const callpoint = resolveCallpoint(3);
+    return ggLog({ ns: callpoint, level: 'info' }, ...args);
+};
+/**
+ * gg._info() - Internal: info with call-site metadata from Vite plugin.
+ */
+gg._info = function (options, ...args) {
+    return ggLog({ ...options, level: 'info' }, ...args);
+};
+/**
+ * gg.warn() - Log at warning level.
+ *
+ * Passthrough: returns the first argument.
+ * In Eruda, entries are styled with a yellow/warning indicator.
+ *
+ * @example
+ * gg.warn('deprecated API used');
+ * const result = gg.warn(computeValue(), 'might be slow');
+ */
+gg.warn = function (...args) {
+    if (!ggConfig.enabled || isCloudflareWorker()) {
+        return args.length ? args[0] : undefined;
+    }
+    const callpoint = resolveCallpoint(3);
+    return ggLog({ ns: callpoint, level: 'warn' }, ...args);
+};
+/**
+ * gg._warn() - Internal: warn with call-site metadata from Vite plugin.
+ */
+gg._warn = function (options, ...args) {
+    return ggLog({ ...options, level: 'warn' }, ...args);
+};
+/**
+ * gg.error() - Log at error level.
+ *
+ * Passthrough: returns the first argument.
+ * Captures a stack trace silently — visible in Eruda via a collapsible toggle.
+ * If the first argument is an Error object, its .stack is used instead.
+ *
+ * @example
+ * gg.error('connection failed');
+ * gg.error(new Error('timeout'));
+ * const val = gg.error(response, 'unexpected status');
+ */
+gg.error = function (...args) {
+    if (!ggConfig.enabled || isCloudflareWorker()) {
+        return args.length ? args[0] : undefined;
+    }
+    const callpoint = resolveCallpoint(3);
+    const stack = getErrorStack(args[0], 4);
+    return ggLog({ ns: callpoint, level: 'error', stack }, ...args);
+};
+/**
+ * gg._error() - Internal: error with call-site metadata from Vite plugin.
+ */
+gg._error = function (options, ...args) {
+    const stack = getErrorStack(args[0], 3);
+    return ggLog({ ...options, level: 'error', stack }, ...args);
+};
+/**
+ * gg.assert() - Log only if condition is false.
+ *
+ * Like console.assert: if the first argument is falsy, logs the remaining
+ * arguments at error level. If the condition is truthy, does nothing.
+ * Passthrough: always returns the condition value.
+ *
+ * @example
+ * gg.assert(user != null, 'user should exist');
+ * gg.assert(list.length > 0, 'list is empty', list);
+ */
+gg.assert = function (condition, ...args) {
+    if (!condition) {
+        if (!ggConfig.enabled || isCloudflareWorker())
+            return condition;
+        const callpoint = resolveCallpoint(3);
+        const stack = captureStack(4);
+        const assertArgs = args.length > 0 ? args : ['Assertion failed'];
+        ggLog({ ns: callpoint, level: 'error', stack }, ...assertArgs);
+    }
+    return condition;
+};
+/**
+ * gg._assert() - Internal: assert with call-site metadata from Vite plugin.
+ */
+gg._assert = function (options, condition, ...args) {
+    if (!condition) {
+        if (!ggConfig.enabled || isCloudflareWorker())
+            return condition;
+        const stack = captureStack(3);
+        const assertArgs = args.length > 0 ? args : ['Assertion failed'];
+        ggLog({ ...options, level: 'error', stack }, ...assertArgs);
+    }
+    return condition;
+};
+/**
+ * gg.table() - Log tabular data.
+ *
+ * Formats an array of objects (or an object of objects) as an ASCII table.
+ * Passthrough: returns the data argument.
+ *
+ * @example
+ * gg.table([{name: 'Alice', age: 30}, {name: 'Bob', age: 25}]);
+ * gg.table({a: {x: 1}, b: {x: 2}});
+ */
+gg.table = function (data, columns) {
+    if (!ggConfig.enabled || isCloudflareWorker())
+        return data;
+    const callpoint = resolveCallpoint(3);
+    const { keys, rows } = formatTable(data, columns);
+    ggLog({ ns: callpoint, tableData: { keys, rows } }, '(table)');
+    // Also emit a native console.table for proper rendering in browser/Node consoles
+    if (columns) {
+        console.table(data, columns);
+    }
+    else {
+        console.table(data);
+    }
+    return data;
+};
+/**
+ * gg._table() - Internal: table with call-site metadata from Vite plugin.
+ */
+gg._table = function (options, data, columns) {
+    if (!ggConfig.enabled || isCloudflareWorker())
+        return data;
+    const { keys, rows } = formatTable(data, columns);
+    ggLog({ ...options, tableData: { keys, rows } }, '(table)');
+    if (columns) {
+        console.table(data, columns);
+    }
+    else {
+        console.table(data);
+    }
+    return data;
+};
+// Timer storage for gg.time / gg.timeEnd / gg.timeLog
+const timers = new Map();
+/**
+ * gg.time() - Start a named timer.
+ *
+ * @example
+ * gg.time('fetch');
+ * const data = await fetchData();
+ * gg.timeEnd('fetch'); // logs "+123ms fetch: 456ms"
+ */
+gg.time = function (label = 'default') {
+    if (!ggConfig.enabled || isCloudflareWorker())
+        return;
+    timers.set(label, performance.now());
+};
+/** gg._time() - Internal: time with call-site metadata from Vite plugin. */
+gg._time = function (_options, label = 'default') {
+    if (!ggConfig.enabled || isCloudflareWorker())
+        return;
+    timers.set(label, performance.now());
+};
+/**
+ * gg.timeLog() - Log the current elapsed time without stopping the timer.
+ *
+ * @example
+ * gg.time('process');
+ * // ... step 1 ...
+ * gg.timeLog('process', 'step 1 done');
+ * // ... step 2 ...
+ * gg.timeEnd('process');
+ */
+gg.timeLog = function (label = 'default', ...args) {
+    if (!ggConfig.enabled || isCloudflareWorker())
+        return;
+    const start = timers.get(label);
+    if (start === undefined) {
+        const callpoint = resolveCallpoint(3);
+        ggLog({ ns: callpoint, level: 'warn' }, `Timer '${label}' does not exist`);
+        return;
+    }
+    const elapsed = performance.now() - start;
+    const callpoint = resolveCallpoint(3);
+    ggLog({ ns: callpoint }, `${label}: ${formatElapsed(elapsed)}`, ...args);
+};
+/** gg._timeLog() - Internal: timeLog with call-site metadata from Vite plugin. */
+gg._timeLog = function (options, label = 'default', ...args) {
+    if (!ggConfig.enabled || isCloudflareWorker())
+        return;
+    const start = timers.get(label);
+    if (start === undefined) {
+        ggLog({ ...options, level: 'warn' }, `Timer '${label}' does not exist`);
+        return;
+    }
+    const elapsed = performance.now() - start;
+    ggLog(options, `${label}: ${formatElapsed(elapsed)}`, ...args);
+};
+/**
+ * gg.timeEnd() - Stop a named timer and log the elapsed time.
+ *
+ * @example
+ * gg.time('fetch');
+ * const data = await fetchData();
+ * gg.timeEnd('fetch'); // logs "fetch: 456.12ms"
+ */
+gg.timeEnd = function (label = 'default') {
+    if (!ggConfig.enabled || isCloudflareWorker())
+        return;
+    const start = timers.get(label);
+    if (start === undefined) {
+        const callpoint = resolveCallpoint(3);
+        ggLog({ ns: callpoint, level: 'warn' }, `Timer '${label}' does not exist`);
+        return;
+    }
+    const elapsed = performance.now() - start;
+    timers.delete(label);
+    const callpoint = resolveCallpoint(3);
+    ggLog({ ns: callpoint }, `${label}: ${formatElapsed(elapsed)}`);
+};
+/** gg._timeEnd() - Internal: timeEnd with call-site metadata from Vite plugin. */
+gg._timeEnd = function (options, label = 'default') {
+    if (!ggConfig.enabled || isCloudflareWorker())
+        return;
+    const start = timers.get(label);
+    if (start === undefined) {
+        ggLog({ ...options, level: 'warn' }, `Timer '${label}' does not exist`);
+        return;
+    }
+    const elapsed = performance.now() - start;
+    timers.delete(label);
+    ggLog(options, `${label}: ${formatElapsed(elapsed)}`);
+};
+/**
+ * gg.trace() - Log with a stack trace.
+ *
+ * Like console.trace: logs the arguments plus a full stack trace.
+ * Passthrough: returns the first argument.
+ *
+ * @example
+ * gg.trace('how did we get here?');
+ * const val = gg.trace(result, 'call path');
+ */
+gg.trace = function (...args) {
+    if (!ggConfig.enabled || isCloudflareWorker()) {
+        return args.length ? args[0] : undefined;
+    }
+    const callpoint = resolveCallpoint(3);
+    const stack = captureStack(4);
+    const traceArgs = args.length > 0 ? args : ['Trace'];
+    return ggLog({ ns: callpoint, stack }, ...traceArgs);
+};
+/**
+ * gg._trace() - Internal: trace with call-site metadata from Vite plugin.
+ */
+gg._trace = function (options, ...args) {
+    if (!ggConfig.enabled || isCloudflareWorker()) {
+        return args.length ? args[0] : undefined;
+    }
+    const stack = captureStack(3);
+    const traceArgs = args.length > 0 ? args : ['Trace'];
+    return ggLog({ ...options, stack }, ...traceArgs);
+};
+/**
+ * Format elapsed time with appropriate precision.
+ * < 1s → "123.45ms", >= 1s → "1.23s", >= 60s → "1m 2.3s"
+ */
+function formatElapsed(ms) {
+    if (ms < 1000)
+        return `${ms.toFixed(2)}ms`;
+    if (ms < 60000)
+        return `${(ms / 1000).toFixed(2)}s`;
+    const minutes = Math.floor(ms / 60000);
+    const seconds = (ms % 60000) / 1000;
+    return `${minutes}m ${seconds.toFixed(1)}s`;
+}
+/**
+ * Normalize data into structured keys + rows for table rendering.
+ * Used by both Eruda (HTML table) and console.table() delegation.
+ * Supports arrays of objects, arrays of primitives, and objects of objects.
+ */
+function formatTable(data, columns) {
+    if (data === null || data === undefined || typeof data !== 'object') {
+        return { keys: [], rows: [] };
+    }
+    // Normalize to rows: [{key, ...values}]
+    let rows;
+    let allKeys;
+    if (Array.isArray(data)) {
+        if (data.length === 0)
+            return { keys: [], rows: [] };
+        // Array of primitives
+        if (typeof data[0] !== 'object' || data[0] === null) {
+            allKeys = ['(index)', 'Value'];
+            rows = data.map((v, i) => ({ '(index)': i, Value: v }));
+        }
+        else {
+            // Array of objects
+            const keySet = new Set();
+            keySet.add('(index)');
+            for (const item of data) {
+                if (item && typeof item === 'object') {
+                    Object.keys(item).forEach((k) => keySet.add(k));
+                }
+            }
+            allKeys = Array.from(keySet);
+            rows = data.map((item, i) => ({
+                '(index)': i,
+                ...(item && typeof item === 'object' ? item : { Value: item })
+            }));
+        }
+    }
+    else {
+        // Object of objects/values
+        const entries = Object.entries(data);
+        if (entries.length === 0)
+            return { keys: [], rows: [] };
+        const keySet = new Set();
+        keySet.add('(index)');
+        for (const [, val] of entries) {
+            if (val && typeof val === 'object' && !Array.isArray(val)) {
+                Object.keys(val).forEach((k) => keySet.add(k));
+            }
+            else {
+                keySet.add('Value');
+            }
+        }
+        allKeys = Array.from(keySet);
+        rows = entries.map(([key, val]) => ({
+            '(index)': key,
+            ...(val && typeof val === 'object' && !Array.isArray(val)
+                ? val
+                : { Value: val })
+        }));
+    }
+    // Apply column filter
+    if (columns && columns.length > 0) {
+        allKeys = ['(index)', ...columns.filter((c) => allKeys.includes(c))];
+    }
+    return { keys: allKeys, rows };
+}
 /**
  * Parse color string to RGB values
  * Accepts: named colors, hex (#rgb, #rrggbb), rgb(r,g,b), rgba(r,g,b,a)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@leftium/gg",
-  "version": "0.0.34",
+  "version": "0.0.36",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/Leftium/gg.git"