[diffs] Byte arena parsing experiments

apps/demo/index.html

@@ -30,10 +30,28 @@
             <input id="wrap-lines" type="checkbox" />
             Wrap
           </label>
+          <label>
+            <input id="lag-radar" type="checkbox" />
+            Lag Radar
+          </label>
         </div>
       </div>
-      <div id="wrapper" class="wrapper" />
+      <div id="wrapper" class="wrapper"></div>
     </div>
+    <!-- lag radar -->
+    <div
+      id="radar"
+      style="
+        display: none;
+        position: fixed;
+        bottom: 4px;
+        right: 4px;
+        width: 100px;
+        height: 100px;
+        z-index: 100;
+        pointer-events: none;
+      "
+    ></div>
     <script type="module" src="/src/main.ts"></script>
   </body>
 </html>

apps/demo/package.json

@@ -5,6 +5,7 @@
   "type": "module",
   "dependencies": {
     "@pierre/diffs": "workspace:*",
+    "@pierre/icons": "catalog:",
     "react": "catalog:",
     "react-dom": "catalog:",
     "shiki": "catalog:"

apps/demo/src/codeViewDemo.ts

@@ -14,6 +14,9 @@ import {
 import type { WorkerPoolManager } from '@pierre/diffs/worker';
 
 import { FAKE_DIFF_LINE_ANNOTATIONS, type LineCommentMetadata } from './mocks/';
+import { createHeaderFilenameSuffixBadge } from './utils/createHeaderFilenameSuffixBadge';
+
+const RENDER_FILENAME_SUFFIX = false;
 
 type CodeViewCommentMetadata =
   | CodeViewSavedCommentMetadata
@@ -95,6 +98,13 @@ export function renderDemoCodeView(
     renderAnnotation(annotation) {
       return renderCodeViewAnnotation(annotation, viewer, items);
     },
+    ...(RENDER_FILENAME_SUFFIX
+      ? {
+          renderHeaderFilenameSuffix() {
+            return createHeaderFilenameSuffixBadge('CodeView slot');
+          },
+        }
+      : null),
     lineHoverHighlight: 'both',
     expansionLineCount: 10,
     enableLineSelection: true,