bopbop 0.0.0-stage → 0.1.0

package/dist/npm/emulation.js

@@ -0,0 +1,18 @@
+// Presets for the emulate tool: devices (CSS px, like DevTools device mode) and network throttling.
+const IOS_UA = 'Mozilla/5.0 (iPhone; CPU iPhone OS 18_0 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/18.0 Mobile/15E148 Safari/604.1';
+const ANDROID_UA = 'Mozilla/5.0 (Linux; Android 15; Pixel 8) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/130.0.0.0 Mobile Safari/537.36';
+export const DEVICES = {
+    'iphone-15': { width: 393, height: 852, deviceScaleFactor: 3, mobile: true, ua: IOS_UA },
+    'iphone-se': { width: 375, height: 667, deviceScaleFactor: 2, mobile: true, ua: IOS_UA },
+    'pixel-8': { width: 412, height: 915, deviceScaleFactor: 2.625, mobile: true, ua: ANDROID_UA },
+    ipad: { width: 820, height: 1180, deviceScaleFactor: 2, mobile: true, ua: IOS_UA.replace('iPhone; CPU iPhone OS', 'iPad; CPU OS') },
+    laptop: { width: 1280, height: 800, deviceScaleFactor: 1, mobile: false },
+    desktop: { width: 1440, height: 900, deviceScaleFactor: 1, mobile: false },
+};
+export const NETWORKS = {
+    offline: { offline: true, latency: 0, downloadThroughput: 0, uploadThroughput: 0 },
+    'slow-3g': { offline: false, latency: 2000, downloadThroughput: ((500 * 1024) / 8) * 0.8, uploadThroughput: ((500 * 1024) / 8) * 0.8 },
+    'fast-3g': { offline: false, latency: 563, downloadThroughput: ((1.6 * 1024 * 1024) / 8) * 0.9, uploadThroughput: ((750 * 1024) / 8) * 0.9 },
+    '4g': { offline: false, latency: 150, downloadThroughput: (9 * 1024 * 1024) / 8, uploadThroughput: (1.5 * 1024 * 1024) / 8 },
+    none: { offline: false, latency: 0, downloadThroughput: -1, uploadThroughput: -1 },
+};

package/dist/npm/format.js

@@ -0,0 +1,103 @@
+// Line diff for snapshot deltas (Myers O(ND)), rendered as compact hunks.
+const CONTEXT = 1;
+const MAX_D = 3000;
+/** Returns ops: array of [' '|'-'|'+', line]. Falls back to a multiset diff for huge edit distances. */
+function myers(a, b) {
+    const n = a.length, m = b.length, max = Math.min(n + m, MAX_D);
+    const v = new Int32Array(2 * max + 2);
+    const trace = [];
+    const off = max + 1;
+    for (let d = 0; d <= max; d++) {
+        trace.push(v.slice());
+        for (let k = -d; k <= d; k += 2) {
+            let x = k === -d || (k !== d && v[off + k - 1] < v[off + k + 1]) ? v[off + k + 1] : v[off + k - 1] + 1;
+            let y = x - k;
+            while (x < n && y < m && a[x] === b[y]) {
+                x++;
+                y++;
+            }
+            v[off + k] = x;
+            if (x >= n && y >= m)
+                return backtrack(trace, a, b, off);
+        }
+    }
+    return null;
+}
+function backtrack(trace, a, b, off) {
+    const ops = [];
+    let x = a.length, y = b.length;
+    for (let d = trace.length - 1; d >= 0; d--) {
+        const v = trace[d];
+        const k = x - y;
+        const prevK = k === -d || (k !== d && v[off + k - 1] < v[off + k + 1]) ? k + 1 : k - 1;
+        const px = v[off + prevK], py = px - prevK;
+        while (x > px && y > py) {
+            ops.push([' ', a[--x]]);
+            y--;
+        }
+        if (d > 0) {
+            if (x === px)
+                ops.push(['+', b[--y]]);
+            else
+                ops.push(['-', a[--x]]);
+        }
+    }
+    return ops.reverse();
+}
+function multiset(a, b) {
+    const count = new Map();
+    for (const l of b)
+        count.set(l, (count.get(l) || 0) + 1);
+    const ops = [];
+    for (const l of a) {
+        const c = count.get(l);
+        if (c)
+            count.set(l, c - 1);
+        else
+            ops.push(['-', l]);
+    }
+    const ca = new Map();
+    for (const l of a)
+        ca.set(l, (ca.get(l) || 0) + 1);
+    for (const l of b) {
+        const c = ca.get(l);
+        if (c)
+            ca.set(l, c - 1);
+        else
+            ops.push(['+', l]);
+    }
+    return ops;
+}
+export function diffLines(prev, next) {
+    const ops = myers(prev, next) || multiset(prev, next);
+    let added = 0, removed = 0;
+    for (const [t] of ops) {
+        if (t === '+')
+            added++;
+        else if (t === '-')
+            removed++;
+    }
+    if (!added && !removed)
+        return { changed: false, added, removed, text: '' };
+    // keep changed lines + CONTEXT lines around them
+    const keep = new Uint8Array(ops.length);
+    ops.forEach(([t], i) => {
+        if (t === ' ')
+            return;
+        for (let j = Math.max(0, i - CONTEXT); j <= Math.min(ops.length - 1, i + CONTEXT); j++)
+            keep[j] = 1;
+    });
+    const out = [];
+    let gap = false;
+    ops.forEach(([t, l], i) => {
+        if (!keep[i]) {
+            gap = true;
+            return;
+        }
+        if (gap && out.length)
+            out.push('…');
+        gap = false;
+        out.push(`${t} ${l}`);
+    });
+    return { changed: true, added, removed, text: out.join('\n') };
+}

package/dist/npm/label.js

@@ -0,0 +1,35 @@
+// Tab group names: "Agent:<code>". The code is 1-5 letters, digits or emoji (an emoji counts as one), short enough
+// for a tab group chip and different per session. Default: the project's initials + the session's slot number.
+import { basename } from 'node:path';
+const graphemes = (s) => [...new Intl.Segmenter(undefined, { granularity: 'grapheme' }).segment(s)].map((g) => g.segment);
+const isLetterOrDigit = (g) => /^[\p{L}\p{N}]\p{M}*$/u.test(g);
+const isEmoji = (g) => /\p{Extended_Pictographic}|\p{Regional_Indicator}/u.test(g) && !/[\p{L}\p{N}]/u.test(g.replace(/\p{Emoji_Component}/gu, '').normalize());
+/** The label, trimmed; throws unless it is 1-5 letters, digits or emoji. */
+export function checkLabel(label) {
+    const s = label.trim();
+    const gs = graphemes(s);
+    if (gs.length < 1 || gs.length > 5 || !gs.every((g) => isLetterOrDigit(g) || isEmoji(g))) {
+        throw new Error('label must be 1-5 letters, digits or emoji, e.g. CT2, ALD, 🧪 or 🦊🔥 (an emoji counts as one)');
+    }
+    return s;
+}
+/** Project initials (1-3 letters, or the first 2-3 letters of a one-word name) + slot number (1-based). */
+export function defaultLabel(projectDir, slot) {
+    const words = basename(projectDir)
+        .replace(/([a-z])([A-Z])/g, '$1 $2')
+        .split(/[^\p{L}\p{N}]+/u)
+        .filter((w) => /^\p{L}/u.test(w));
+    return abbreviate(words).toUpperCase() + String(slot + 1);
+}
+function abbreviate(words) {
+    if (words.length > 1)
+        return words
+            .slice(0, 3)
+            .map((w) => graphemes(w)[0])
+            .join('');
+    if (words.length === 1)
+        return graphemes(words[0])
+            .slice(0, words[0].length > 3 ? 3 : 2)
+            .join('');
+    return 'BB'; // no usable name
+}

package/dist/npm/network.js

@@ -0,0 +1,44 @@
+// Network formatting: cookie redaction, sizes, durations and DevTools-style timing phases.
+// Cookie and credential header values are often login sessions or keys: shown as a prefix + length unless BBM_SHOW_COOKIES=1 (a server
+// setting on purpose, so a page cannot talk the model into revealing them). Applies to the details view and HAR files.
+export const showCookies = () => process.env.BBM_SHOW_COOKIES === '1';
+export const redact = (v) => (showCookies() || v.length <= 6 ? v : `${v.slice(0, 4)}…(${v.length} chars)`);
+// Headers that carry credentials (tokens, keys) are shortened like cookie values.
+const CREDENTIAL_HEADER = /^(authorization|proxy-authorization|x-api-key|api-key|x-auth-token|x-access-token|x-csrf-token|x-xsrf-token|x-amz-security-token)$|token|secret|api[-_]?key|password/i;
+export const redactHeader = (name, value) => {
+    const n = name.toLowerCase();
+    if (CREDENTIAL_HEADER.test(n))
+        return String(value)
+            .split('\n')
+            .map((v) => redact(v))
+            .join('\n');
+    if (n === 'cookie')
+        return String(value)
+            .split(/;\s*/)
+            .map((kv) => {
+            const i = kv.indexOf('=');
+            return i < 0 ? kv : `${kv.slice(0, i)}=${redact(kv.slice(i + 1))}`;
+        })
+            .join('; ');
+    if (n === 'set-cookie')
+        return String(value)
+            .split('\n')
+            .map((line) => line.replace(/^([^=;]+)=([^;]*)/, (_, k, v) => `${k}=${redact(v)}`))
+            .join('\n');
+    return value;
+};
+export const kb = (n) => (n == null ? '' : n < 1024 ? `${n}B` : `${(n / 1024).toFixed(1)}kB`);
+export const durMs = (e) => (e.end != null ? Math.round((e.end - e.ts) * 1000) : null);
+/** DevTools-style phases from response.timing (ms). */
+export function phases(t) {
+    if (!t)
+        return null;
+    const d = (a, b) => (t[a] >= 0 && t[b] >= 0 ? Math.round(t[b] - t[a]) : 0);
+    return {
+        dns: d('dnsStart', 'dnsEnd'),
+        connect: d('connectStart', 'connectEnd'),
+        tls: d('sslStart', 'sslEnd'),
+        send: d('sendStart', 'sendEnd'),
+        wait: d('sendEnd', 'receiveHeadersEnd'),
+    };
+}