bunnyquery 1.4.5 → 1.5.0

package/bunnyquery.css

@@ -162,6 +162,87 @@
     to { transform: rotate(360deg); }
 }
 
+/* jumping ASCII bunny — full-area "loading/fetching" indicator (page/gate loads,
+   initial history fetch, settings panel). Ported from www.bunnyquery.com
+   bunnyLoader.vue. Two <pre> frames toggle + hop across the track and flip. */
+.bq-bunny-loader {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    gap: 0.75rem;
+}
+.bq-bunny-loader--overlay {
+    position: absolute;
+    inset: 0;
+    pointer-events: none;
+    z-index: 4;
+}
+.bq-bunny-stage {
+    display: inline-block;
+    position: relative;
+    text-align: left;
+}
+.bq-bunny-track {
+    position: relative;
+    height: 3.6rem;
+    width: 100%;
+    animation: bq-bunny-move 9s steps(12) infinite;
+}
+.bq-bunny-dir {
+    display: inline-block;
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    animation: bq-bunny-flip 9s steps(1) infinite;
+}
+.bq-frame {
+    margin: 0;
+    /* Pin a Latin monospace font. Without it the <pre> falls back to the UA
+       `monospace` keyword, which on Korean/Japanese systems can resolve to a
+       CJK font that renders U+005C (backslash) as ₩ / ¥ — wrecking the art. */
+    font-family: var(--bq-mono);
+    font-size: 1rem;
+    line-height: 1.2;
+    white-space: pre;
+    color: var(--bq-ink);
+}
+.bq-frame-a {
+    animation: bq-bunny-toggle-a 1s steps(1) infinite;
+}
+.bq-frame-b {
+    animation: bq-bunny-toggle-b 1s steps(1) infinite;
+    opacity: 0;
+}
+.bq-bunny-loader__label {
+    color: var(--bq-ink);
+    font-family: var(--bq-mono);
+    font-size: 0.83rem;
+}
+@keyframes bq-bunny-move {
+    0%     { transform: translateX(-11ch); }
+    25%    { transform: translateX(4ch); }
+    37.5%  { transform: translateX(4ch); }
+    50%    { transform: translateX(4ch); }
+    75%    { transform: translateX(-11ch); }
+    87.5%  { transform: translateX(-11ch); }
+    100%   { transform: translateX(-11ch); }
+}
+@keyframes bq-bunny-flip {
+    0%   { transform: scaleX(1); }
+    50%  { transform: scaleX(-1); }
+}
+@keyframes bq-bunny-toggle-a {
+    0%   { opacity: 1; }
+    25%  { opacity: 0; }
+    100% { opacity: 1; }
+}
+@keyframes bq-bunny-toggle-b {
+    0%   { opacity: 0; }
+    25%  { opacity: 1; }
+    100% { opacity: 0; }
+}
+
 /* ============================================================================
  * AUTH VIEWS (login / signup / forgot / verify / settings)
  * ==========================================================================*/

package/bunnyquery.js

@@ -1036,10 +1036,18 @@ ${options.inlineContentPlaceholder}
   }
 
   // src/engine/session.ts
-  function sleep(ms) {
-    return new Promise(function(r) {
-      setTimeout(r, ms);
-    });
+  var _g = typeof globalThis !== "undefined" ? globalThis : {};
+  function nowMs() {
+    return _g.performance && typeof _g.performance.now === "function" ? _g.performance.now() : Date.now();
+  }
+  function nextFrame(cb) {
+    if (typeof _g.requestAnimationFrame === "function") {
+      _g.requestAnimationFrame(cb);
+      return;
+    }
+    setTimeout(function() {
+      cb(nowMs());
+    }, 16);
   }
   var ChatSession = class {
     constructor(host) {
@@ -1126,35 +1134,26 @@ ${options.inlineContentPlaceholder}
         if (dispatchItemId) self.historyItemPolls.delete(dispatchItemId);
         var existing = self.aiChatHistoryCache[params.key] || { messages: [], endOfList: false, startKeyHistory: [] };
         var reply = { role: "assistant", content: result.content, isError: result.isError };
-        var onThisVisibleChat = self.host.isViewMounted() && self.getHistoryCacheKey() === params.key;
-        if (onThisVisibleChat) {
-          self.aiChatHistoryCache[params.key] = {
-            messages: existing.messages.concat([reply]),
-            endOfList: existing.endOfList,
-            startKeyHistory: existing.startKeyHistory
-          };
-        } else {
-          var msgs = existing.messages.slice();
-          var idx = -1;
-          for (var i = msgs.length - 1; i >= 0; i--) {
-            var m = msgs[i];
-            if (m && m.isPending && m.role === "assistant" && !m.isBackgroundTask) {
-              idx = i;
-              break;
-            }
-          }
-          if (idx !== -1) {
-            reply._serverItemId = msgs[idx]._serverItemId;
-            msgs[idx] = reply;
-          } else {
-            msgs.push(reply);
+        var msgs = existing.messages.slice();
+        var idx = -1;
+        for (var i = msgs.length - 1; i >= 0; i--) {
+          var m = msgs[i];
+          if (m && m.isPending && m.role === "assistant" && !m.isBackgroundTask) {
+            idx = i;
+            break;
           }
-          self.aiChatHistoryCache[params.key] = {
-            messages: msgs,
-            endOfList: existing.endOfList,
-            startKeyHistory: existing.startKeyHistory
-          };
         }
+        if (idx !== -1) {
+          reply._serverItemId = msgs[idx]._serverItemId;
+          msgs[idx] = reply;
+        } else {
+          msgs.push(reply);
+        }
+        self.aiChatHistoryCache[params.key] = {
+          messages: msgs,
+          endOfList: existing.endOfList,
+          startKeyHistory: existing.startKeyHistory
+        };
         return result;
       });
       this.pendingAgentRequests[params.key] = run;
@@ -1297,7 +1296,9 @@ ${options.inlineContentPlaceholder}
       if (existing._serverItemId !== void 0) promoted._serverItemId = existing._serverItemId;
       if (existing.isSendingToServer) promoted.isSendingToServer = true;
       this.state.messages[nextIdx] = promoted;
-      this.state.messages.splice(nextIdx + 1, 0, { role: "assistant", content: "", isPending: true });
+      var placeholder = { role: "assistant", content: "", isPending: true };
+      if (existing._serverItemId !== void 0) placeholder._serverItemId = existing._serverItemId;
+      this.state.messages.splice(nextIdx + 1, 0, placeholder);
       this.host.notify();
     }
     resolveQueuedUserBubble(serverId) {
@@ -1507,61 +1508,118 @@ ${options.inlineContentPlaceholder}
       });
     }
     // --- typewriter -------------------------------------------------------
+    // Reveal `fullText` into a message bubble at a constant wall-clock RATE
+    // (chars/second) driven by requestAnimationFrame, rather than a fixed number
+    // of characters per fixed-delay tick. This is what keeps typing smooth and
+    // cheap on slow machines:
+    //
+    //   * Each frame reveals `elapsed_ms * CHARS_PER_SEC` characters, so the
+    //     visual speed is the same regardless of how long a frame actually took.
+    //   * As the bubble's markdown grows, each re-render gets more expensive, so
+    //     frames get longer — which makes each frame reveal MORE characters and
+    //     therefore do FEWER, larger renders. That converts the old O(n^2)
+    //     "re-render the whole growing string once per 3 characters" (which got
+    //     slower and slower and pegged the CPU) into roughly O(n): the number of
+    //     renders self-throttles to what the machine can actually paint.
+    //   * rAF paces us to the browser's paint cycle and pauses in background
+    //     tabs, so we never queue work faster than it can be drawn.
     typewriteIntoIndex(idx, fullText, localId) {
       var self = this;
       if (!fullText) return Promise.resolve();
-      var TICK_MS = 16, charsPerTick = 3, FENCE_REVEAL_MS = 200;
-      var fenceTicks = Math.max(1, Math.floor(FENCE_REVEAL_MS / TICK_MS));
-      var fenceRegions = [], m;
+      var CHARS_PER_SEC = 300;
+      var MIN_STEP = 1;
+      var MAX_FRAME_MS = 1e3;
+      var regions = [], m;
       var fenceRegex = /```[\w.-]+\.[a-zA-Z0-9]+\n[\s\S]*?```/g;
-      while ((m = fenceRegex.exec(fullText)) !== null) fenceRegions.push({ start: m.index, end: m.index + m[0].length });
-      var linkRegions = [], lm;
+      while ((m = fenceRegex.exec(fullText)) !== null) regions.push({ start: m.index, end: m.index + m[0].length });
       var linkRegex = createInlineLinkRegex();
-      while ((lm = linkRegex.exec(fullText)) !== null) linkRegions.push({ start: lm.index, end: lm.index + lm[0].length });
+      while ((m = linkRegex.exec(fullText)) !== null) regions.push({ start: m.index, end: m.index + m[0].length });
+      regions.sort(function(a, b) {
+        return a.start - b.start;
+      });
       this.state.typing = true;
       this.state.typingAbort = false;
       var i = 0;
-      return (function loop() {
-        if (self.state.typingAbort || i >= fullText.length) return Promise.resolve();
-        var step = charsPerTick;
-        var region = fenceRegions.find(function(r) {
-          return i >= r.start && i < r.end;
-        });
-        var linkRegion = linkRegions.find(function(r) {
-          return i >= r.start && i < r.end;
-        });
-        if (region) step = Math.max(charsPerTick, Math.ceil((region.end - i) / fenceTicks));
-        else if (linkRegion) step = Math.max(charsPerTick, linkRegion.end - i);
-        else {
-          var nextLink = linkRegions.find(function(r) {
-            return i < r.start && i + step > r.start;
-          });
-          if (nextLink) step = nextLink.end - i;
+      var last = nowMs();
+      return new Promise(function(resolve) {
+        var done = false;
+        var doc = _g.document;
+        function isHidden() {
+          return !!(doc && doc.hidden);
+        }
+        function cleanup() {
+          if (doc && doc.removeEventListener) doc.removeEventListener("visibilitychange", onVisibility);
+        }
+        function finish() {
+          if (done) return;
+          done = true;
+          cleanup();
+          if (!self.state.typingAbort) {
+            var fi = localId ? self.state.messages.findIndex(function(mm) {
+              return mm._localId === localId;
+            }) : idx;
+            if (fi !== -1) {
+              var t = self.state.messages[fi];
+              if (t) {
+                t.content = fullText;
+                self.host.refreshMessageBubble(fi);
+              }
+            }
+          }
+          self.state.typing = false;
+          resolve();
         }
-        i = Math.min(fullText.length, i + step);
-        var currentIdx = localId ? self.state.messages.findIndex(function(mm) {
-          return mm._localId === localId;
-        }) : idx;
-        if (currentIdx === -1) return Promise.resolve();
-        var target = self.state.messages[currentIdx];
-        if (!target) return Promise.resolve();
-        target.content = fullText.slice(0, i);
-        self.host.refreshMessageBubble(currentIdx);
-        return Promise.resolve(self.host.scrollToBottomIfSticky()).then(function() {
-          return sleep(TICK_MS);
-        }).then(loop);
-      })().then(function() {
-        if (!self.state.typingAbort) {
-          var fi = localId ? self.state.messages.findIndex(function(mm) {
+        function onVisibility() {
+          if (isHidden()) finish();
+        }
+        if (doc && doc.addEventListener) doc.addEventListener("visibilitychange", onVisibility);
+        function frame(t) {
+          if (done) return;
+          if (self.state.typingAbort || i >= fullText.length || isHidden()) {
+            finish();
+            return;
+          }
+          var dt = t - last;
+          last = t;
+          if (!(dt > 0)) dt = 16;
+          if (dt > MAX_FRAME_MS) dt = MAX_FRAME_MS;
+          var step = Math.round(dt * CHARS_PER_SEC / 1e3);
+          if (step < MIN_STEP) step = MIN_STEP;
+          var next = Math.min(fullText.length, i + step);
+          for (var changed = true; changed; ) {
+            changed = false;
+            for (var k = 0; k < regions.length; k++) {
+              var r = regions[k];
+              if (next > r.start && i < r.end && r.end > next) {
+                next = r.end;
+                changed = true;
+              }
+            }
+          }
+          if (next > fullText.length) next = fullText.length;
+          i = next;
+          var currentIdx = localId ? self.state.messages.findIndex(function(mm) {
             return mm._localId === localId;
           }) : idx;
-          var t = fi !== -1 ? self.state.messages[fi] : self.state.messages[idx];
-          if (t) {
-            t.content = fullText;
-            self.host.refreshMessageBubble(fi !== -1 ? fi : idx);
+          if (currentIdx === -1) {
+            finish();
+            return;
           }
+          var target = self.state.messages[currentIdx];
+          if (!target) {
+            finish();
+            return;
+          }
+          target.content = fullText.slice(0, i);
+          self.host.refreshMessageBubble(currentIdx);
+          self.host.scrollToBottomIfSticky();
+          nextFrame(frame);
+        }
+        if (isHidden()) {
+          finish();
+          return;
         }
-        self.state.typing = false;
+        nextFrame(frame);
       });
     }
     enqueueTypewrite(idx, fullText, localId) {
@@ -1875,7 +1933,7 @@ ${options.inlineContentPlaceholder}
             if (item.status !== "running" && item.status !== "pending") return;
             if (!item.poll || !item.id) return;
             if (self.historyItemPolls.has(item.id)) return;
-            if ((item.status === "running" || item.status === "pending") && self.pendingAgentRequests[self.getHistoryCacheKey()]) return;
+            if (self.pendingAgentRequests[self.getHistoryCacheKey()] && !item._isBgTask && !item._isOnBgQueue) return;
             self.historyItemPolls.set(item.id, true);
             var capturedId = item.id;
             var pp = item.poll({
@@ -2118,7 +2176,7 @@ ${options.inlineContentPlaceholder}
   (function() {
     var MCP_PROD = "https://mcp.broadwayinc.computer";
     var MCP_DEV = "https://mcp-dev.broadwayinc.computer";
-    var BQ_VERSION = "1.4.5" ;
+    var BQ_VERSION = "1.5.0" ;
     var ATTACHMENT_URL_EXPIRES_SECONDS = 600;
     var GOOGLE_AUTH_URL = "https://accounts.google.com/o/oauth2/v2/auth";
     var GOOGLE_TOKEN_URL = "https://oauth2.googleapis.com/token";
@@ -2373,13 +2431,40 @@ ${options.inlineContentPlaceholder}
         })
       );
     }
+    var BUNNY_FRAME_A = '  (\\(\\\n  ( - -)\n c(")(")';
+    var BUNNY_FRAME_B = '  /)/)\n ( . .)\nc(")(")';
+    function bunnyLoader(label, overlay) {
+      return h(
+        "div",
+        {
+          class: "bq-bunny-loader" + (""),
+          "aria-hidden": "true",
+          translate: "no"
+        },
+        h(
+          "div",
+          { class: "bq-bunny-stage" },
+          h(
+            "div",
+            { class: "bq-bunny-track" },
+            h(
+              "div",
+              { class: "bq-bunny-dir" },
+              h("pre", { class: "bq-frame bq-frame-a", translate: "no", text: BUNNY_FRAME_A }),
+              h("pre", { class: "bq-frame bq-frame-b", translate: "no", text: BUNNY_FRAME_B })
+            )
+          )
+        ),
+        label ? h("div", { class: "bq-bunny-loader__label", text: label }) : null
+      );
+    }
     function showLoading(label) {
       render("loading", function() {
         return pageRoot(
           h(
             "div",
             { class: "bq-disabled-inner", style: { marginTop: "3rem" } },
-            h("span", { class: "bq-loader", text: "Loading" })
+            bunnyLoader("Loading...")
           )
         );
       });
@@ -3265,7 +3350,7 @@ ${options.inlineContentPlaceholder}
       CS.messagesBox.appendChild(h(
         "div",
         { class: "bq-chat-settings" },
-        h("div", { class: "bq-chat-settings-loading" }, h("span", { class: "bq-loader", text: "Loading" }))
+        h("div", { class: "bq-chat-settings-loading" }, bunnyLoader("Loading..."))
       ));
       Promise.all([getProfile(), getNewsletterStatus()]).then(function(res) {
         if (res[0]) S.user = res[0];
@@ -4785,9 +4870,16 @@ ${options.inlineContentPlaceholder}
       return h("div", { class: cls.join(" "), dataset: { msgIndex: String(idx) } }, bubble);
     }
     function historyLoadingEl(initial) {
+      if (initial) {
+        return h(
+          "div",
+          { class: "bq-history-loading is-initial" },
+          bunnyLoader("Fetching history...")
+        );
+      }
       return h(
         "div",
-        { class: "bq-history-loading" + (initial ? " is-initial" : "") },
+        { class: "bq-history-loading" },
         h("span", { text: "Fetching history" }),
         h("span", { class: "bq-loader" })
       );
@@ -4851,7 +4943,6 @@ ${options.inlineContentPlaceholder}
       CS.settingsBtnEl = null;
       CS.composerEl = null;
       CS.gateRefreshToken += 1;
-      historyItemPolls.clear();
       if (CS.pollTimer) {
         clearInterval(CS.pollTimer);
         CS.pollTimer = null;