@k2b/ui 0.9.1 → 0.11.0

package/dist/browser/content/FileView.js

@@ -1,39 +1,38 @@
 import { template as _$template } from "solid-js/web";
 import { delegateEvents as _$delegateEvents } from "solid-js/web";
-import { memo as _$memo } from "solid-js/web";
+import { addEventListener as _$addEventListener } from "solid-js/web";
+import { runHydrationEvents as _$runHydrationEvents } from "solid-js/web";
 import { setProperty as _$setProperty } from "solid-js/web";
 import { getNextMarker as _$getNextMarker } from "solid-js/web";
-import { insert as _$insert } from "solid-js/web";
-import { className as _$className } from "solid-js/web";
+import { memo as _$memo } from "solid-js/web";
+import { createComponent as _$createComponent } from "solid-js/web";
 import { setAttribute as _$setAttribute } from "solid-js/web";
+import { className as _$className } from "solid-js/web";
 import { effect as _$effect } from "solid-js/web";
 import { getNextElement as _$getNextElement } from "solid-js/web";
-import { runHydrationEvents as _$runHydrationEvents } from "solid-js/web";
-import { addEventListener as _$addEventListener } from "solid-js/web";
-import { createComponent as _$createComponent } from "solid-js/web";
-var _tmpl$ = /*#__PURE__*/_$template(`<button type=button class=k2b-content-file-view__action><i aria-hidden=true>`),
-  _tmpl$2 = /*#__PURE__*/_$template(`<a class=k2b-content-file-view__action><i aria-hidden=true></i><span class=k2b-sr-only>`),
+import { insert as _$insert } from "solid-js/web";
+import { use as _$use } from "solid-js/web";
+var _tmpl$ = /*#__PURE__*/_$template(`<a><i aria-hidden=true></i><span class=k2b-sr-only>`),
+  _tmpl$2 = /*#__PURE__*/_$template(`<i aria-hidden=true>`),
   _tmpl$3 = /*#__PURE__*/_$template(`<div class=k2b-content-file-view__overlay>`),
   _tmpl$4 = /*#__PURE__*/_$template(`<div class=k2b-content-file-view__panel><div class=k2b-content-file-view__preview></div><!$><!/>`),
-  _tmpl$5 = /*#__PURE__*/_$template(`<button type=button class=k2b-markdown-editor__tool tabindex=-1><i>`),
-  _tmpl$6 = /*#__PURE__*/_$template(`<div class=k2b-content-file-view__truncated>`),
-  _tmpl$7 = /*#__PURE__*/_$template(`<span>`),
-  _tmpl$8 = /*#__PURE__*/_$template(`<div>`),
-  _tmpl$9 = /*#__PURE__*/_$template(`<div class=k2b-content-file-view__document>`),
-  _tmpl$0 = /*#__PURE__*/_$template(`<div class=k2b-content-file-view__editor>`),
-  _tmpl$1 = /*#__PURE__*/_$template(`<div class=k2b-content-file-view__editor><div class=k2b-markdown-editor data-fill=true role=group><div class="k2b-markdown-editor__toolbar k2b-content-file-view__code-toolbar"><span class=k2b-content-file-view__code-language></span><span class=k2b-markdown-editor__trailing><!$><!/><!$><!/></span></div><div class=k2b-markdown-editor__surface><textarea class=k2b-content-file-view__code-input>`),
-  _tmpl$10 = /*#__PURE__*/_$template(`<a class=k2b-markdown-editor__tool><i class="ti ti-download">`),
-  _tmpl$11 = /*#__PURE__*/_$template(`<div class=k2b-content-file-view__settings><!$><!/><!$><!/><!$><!/>`),
-  _tmpl$12 = /*#__PURE__*/_$template(`<div class=k2b-content-file-view__sheet><table class=k2b-content-file-view__table><thead><tr></tr></thead><tbody></tbody></table><!$><!/><!$><!/>`),
-  _tmpl$13 = /*#__PURE__*/_$template(`<th scope=col><span>`),
-  _tmpl$14 = /*#__PURE__*/_$template(`<tr>`),
-  _tmpl$15 = /*#__PURE__*/_$template(`<td>`),
-  _tmpl$16 = /*#__PURE__*/_$template(`<div class=k2b-content-file-view__pagination><!$><!/><span><!$><!/>–<!$><!/> / <!$><!/></span><!$><!/>`),
-  _tmpl$17 = /*#__PURE__*/_$template(`<div class=k2b-content-file-view__media><img>`),
-  _tmpl$18 = /*#__PURE__*/_$template(`<object type=application/pdf class=k2b-content-file-view__pdf>`),
-  _tmpl$19 = /*#__PURE__*/_$template(`<div class=k2b-content-file-view__media data-kind=audio><audio controls preload=metadata>`),
-  _tmpl$20 = /*#__PURE__*/_$template(`<div class=k2b-content-file-view__media data-kind=video><video controls preload=metadata playsinline>`),
-  _tmpl$21 = /*#__PURE__*/_$template(`<a class=k2b-button data-variant=secondary data-size=sm download><i class="ti ti-download"aria-hidden=true></i><!$><!/>`);
+  _tmpl$5 = /*#__PURE__*/_$template(`<div class=k2b-content-file-view__truncated>`),
+  _tmpl$6 = /*#__PURE__*/_$template(`<span>`),
+  _tmpl$7 = /*#__PURE__*/_$template(`<div>`),
+  _tmpl$8 = /*#__PURE__*/_$template(`<div class=k2b-content-file-view__document>`),
+  _tmpl$9 = /*#__PURE__*/_$template(`<div class=k2b-content-file-view__editor>`),
+  _tmpl$0 = /*#__PURE__*/_$template(`<div class=k2b-content-file-view__editor><div class=k2b-markdown-editor data-fill=true role=group><div class="k2b-markdown-editor__toolbar k2b-content-file-view__code-toolbar"><span class=k2b-content-file-view__code-language></span><span class=k2b-markdown-editor__trailing><!$><!/><!$><!/></span></div><div class=k2b-markdown-editor__surface><textarea class=k2b-content-file-view__code-input>`),
+  _tmpl$1 = /*#__PURE__*/_$template(`<div class=k2b-content-file-view__settings><!$><!/><!$><!/><!$><!/>`),
+  _tmpl$10 = /*#__PURE__*/_$template(`<div class=k2b-content-file-view__sheet><table class=k2b-content-file-view__table><thead><tr></tr></thead><tbody></tbody></table><!$><!/><!$><!/>`),
+  _tmpl$11 = /*#__PURE__*/_$template(`<th scope=col><span>`),
+  _tmpl$12 = /*#__PURE__*/_$template(`<tr>`),
+  _tmpl$13 = /*#__PURE__*/_$template(`<td>`),
+  _tmpl$14 = /*#__PURE__*/_$template(`<div class=k2b-content-file-view__pagination><!$><!/><span><!$><!/>–<!$><!/> / <!$><!/></span><!$><!/>`),
+  _tmpl$15 = /*#__PURE__*/_$template(`<div class=k2b-content-file-view__media><img>`),
+  _tmpl$16 = /*#__PURE__*/_$template(`<object type=application/pdf class=k2b-content-file-view__pdf>`),
+  _tmpl$17 = /*#__PURE__*/_$template(`<div class=k2b-content-file-view__media data-kind=audio><audio controls preload=metadata>`),
+  _tmpl$18 = /*#__PURE__*/_$template(`<div class=k2b-content-file-view__media data-kind=video><video controls preload=metadata playsinline>`),
+  _tmpl$19 = /*#__PURE__*/_$template(`<a class=k2b-button data-variant=secondary data-size=sm download><i class="ti ti-download"aria-hidden=true></i><!$><!/>`);
 /**
  * FileView — renders one file through a small renderer registry keyed by
  * media type / path. Editing is enabled purely by the presence of `save`;
@@ -48,6 +47,7 @@ import { mutation } from "@k2b/stdlib/solid";
 import { createEffect, createMemo, createResource, createSignal, For, Match, onCleanup, onMount, Show, Switch, untrack } from "solid-js";
 import { Button } from "../actions/Button";
 import { prompts } from "../feedback/prompts";
+import { Tooltip } from "../feedback/Tooltip";
 import { toast } from "../feedback/toast";
 import { MarkdownEditor } from "../inputs/markdown/MarkdownEditor";
 import { Select } from "../inputs/Select";
@@ -80,6 +80,44 @@ const stripFrontmatter = text => {
   return match ? text.trimStart().slice(match[0].length) : text;
 };
 
+/** Icon-only download link with the shared tooltip, for toolbars that style their own controls. */
+function DownloadLink(props) {
+  let link;
+  return [(() => {
+    var _el$ = _$getNextElement(_tmpl$),
+      _el$2 = _el$.firstChild,
+      _el$3 = _el$2.nextSibling;
+    var _ref$ = link;
+    typeof _ref$ === "function" ? _$use(_ref$, _el$) : link = _el$;
+    _$insert(_el$3, () => props.label);
+    _$effect(_p$ => {
+      var _v$ = props.class,
+        _v$2 = props.href,
+        _v$3 = props.download,
+        _v$4 = props.label,
+        _v$5 = props.icon;
+      _v$ !== _p$.e && _$className(_el$, _p$.e = _v$);
+      _v$2 !== _p$.t && _$setAttribute(_el$, "href", _p$.t = _v$2);
+      _v$3 !== _p$.a && _$setAttribute(_el$, "download", _p$.a = _v$3);
+      _v$4 !== _p$.o && _$setAttribute(_el$, "aria-label", _p$.o = _v$4);
+      _v$5 !== _p$.i && _$className(_el$2, _p$.i = _v$5);
+      return _p$;
+    }, {
+      e: undefined,
+      t: undefined,
+      a: undefined,
+      o: undefined,
+      i: undefined
+    });
+    return _el$;
+  })(), _$createComponent(Tooltip, {
+    get content() {
+      return props.label;
+    },
+    target: () => link
+  })];
+}
+
 /** Icon-only action, IDE style — sits in the floating top-right cluster of previews. */
 function OverlayAction(props) {
   const classes = "k2b-content-file-view__action";
@@ -88,75 +126,62 @@ function OverlayAction(props) {
       return props.href;
     },
     get fallback() {
-      return (() => {
-        var _el$ = _$getNextElement(_tmpl$),
-          _el$2 = _el$.firstChild;
-        _$addEventListener(_el$, "click", props.onClick, true);
-        _$effect(_p$ => {
-          var _v$ = props.title,
-            _v$2 = props.title,
-            _v$3 = `ti ${props.icon}`;
-          _v$ !== _p$.e && _$setAttribute(_el$, "title", _p$.e = _v$);
-          _v$2 !== _p$.t && _$setAttribute(_el$, "aria-label", _p$.t = _v$2);
-          _v$3 !== _p$.a && _$className(_el$2, _p$.a = _v$3);
-          return _p$;
-        }, {
-          e: undefined,
-          t: undefined,
-          a: undefined
-        });
-        _$runHydrationEvents();
-        return _el$;
-      })();
-    },
-    children: href => (() => {
-      var _el$3 = _$getNextElement(_tmpl$2),
-        _el$4 = _el$3.firstChild,
-        _el$5 = _el$4.nextSibling;
-      _$insert(_el$5, () => props.title);
-      _$effect(_p$ => {
-        var _v$4 = href(),
-          _v$5 = props.download ?? "",
-          _v$6 = props.title,
-          _v$7 = props.title,
-          _v$8 = `ti ${props.icon}`;
-        _v$4 !== _p$.e && _$setAttribute(_el$3, "href", _p$.e = _v$4);
-        _v$5 !== _p$.t && _$setAttribute(_el$3, "download", _p$.t = _v$5);
-        _v$6 !== _p$.a && _$setAttribute(_el$3, "title", _p$.a = _v$6);
-        _v$7 !== _p$.o && _$setAttribute(_el$3, "aria-label", _p$.o = _v$7);
-        _v$8 !== _p$.i && _$className(_el$4, _p$.i = _v$8);
-        return _p$;
-      }, {
-        e: undefined,
-        t: undefined,
-        a: undefined,
-        o: undefined,
-        i: undefined
+      return _$createComponent(Tooltip.Trigger, {
+        type: "button",
+        "class": classes,
+        get content() {
+          return props.title;
+        },
+        get ["aria-label"]() {
+          return props.title;
+        },
+        get onClick() {
+          return props.onClick;
+        },
+        get children() {
+          var _el$4 = _$getNextElement(_tmpl$2);
+          _$effect(() => _$className(_el$4, `ti ${props.icon}`));
+          return _el$4;
+        }
       });
-      return _el$3;
-    })()
+    },
+    children: href => _$createComponent(DownloadLink, {
+      "class": classes,
+      get href() {
+        return href();
+      },
+      get download() {
+        return props.download ?? "";
+      },
+      get label() {
+        return props.title;
+      },
+      get icon() {
+        return `ti ${props.icon}`;
+      }
+    })
   });
 }
 
 /** Scrollable preview panel with the floating action cluster overlaid top-right. */
 function OverlayPanel(props) {
   return (() => {
-    var _el$6 = _$getNextElement(_tmpl$4),
-      _el$7 = _el$6.firstChild,
-      _el$9 = _el$7.nextSibling,
-      [_el$0, _co$] = _$getNextMarker(_el$9.nextSibling);
-    _$insert(_el$7, () => props.children);
-    _$insert(_el$6, _$createComponent(Show, {
+    var _el$5 = _$getNextElement(_tmpl$4),
+      _el$6 = _el$5.firstChild,
+      _el$8 = _el$6.nextSibling,
+      [_el$9, _co$] = _$getNextMarker(_el$8.nextSibling);
+    _$insert(_el$6, () => props.children);
+    _$insert(_el$5, _$createComponent(Show, {
       get when() {
         return props.actions;
       },
       get children() {
-        var _el$8 = _$getNextElement(_tmpl$3);
-        _$insert(_el$8, () => props.actions);
-        return _el$8;
+        var _el$7 = _$getNextElement(_tmpl$3);
+        _$insert(_el$7, () => props.actions);
+        return _el$7;
       }
-    }), _el$0, _co$);
-    return _el$6;
+    }), _el$9, _co$);
+    return _el$5;
   })();
 }
 const DownloadAction = props => {
@@ -182,30 +207,29 @@ const DownloadAction = props => {
 
 /** Toolbar-styled icon button — reuses the package markdown-editor tool primitive. */
 function EditorToolButton(props) {
-  return (() => {
-    var _el$1 = _$getNextElement(_tmpl$5),
-      _el$10 = _el$1.firstChild;
-    _$addEventListener(_el$1, "click", props.onClick, true);
-    _el$1.$$mousedown = e => e.preventDefault();
-    _$effect(_p$ => {
-      var _v$9 = props.title,
-        _v$0 = props.title,
-        _v$1 = props.disabled,
-        _v$10 = props.icon;
-      _v$9 !== _p$.e && _$setAttribute(_el$1, "title", _p$.e = _v$9);
-      _v$0 !== _p$.t && _$setAttribute(_el$1, "aria-label", _p$.t = _v$0);
-      _v$1 !== _p$.a && _$setProperty(_el$1, "disabled", _p$.a = _v$1);
-      _v$10 !== _p$.o && _$className(_el$10, _p$.o = _v$10);
-      return _p$;
-    }, {
-      e: undefined,
-      t: undefined,
-      a: undefined,
-      o: undefined
-    });
-    _$runHydrationEvents();
-    return _el$1;
-  })();
+  return _$createComponent(Tooltip.Trigger, {
+    type: "button",
+    "class": "k2b-markdown-editor__tool",
+    get content() {
+      return props.title;
+    },
+    get ["aria-label"]() {
+      return props.title;
+    },
+    tabIndex: -1,
+    get disabled() {
+      return props.disabled;
+    },
+    onMouseDown: e => e.preventDefault(),
+    get onClick() {
+      return props.onClick;
+    },
+    get children() {
+      var _el$0 = _$getNextElement(_tmpl$2);
+      _$effect(() => _$className(_el$0, props.icon));
+      return _el$0;
+    }
+  });
 }
 
 // ── Built-in renderers ──────────────────────────────────────────────────────
@@ -217,16 +241,16 @@ function MoreLines(props) {
       return props.count > 0;
     },
     get children() {
-      var _el$11 = _$getNextElement(_tmpl$6);
-      _$insert(_el$11, _$createComponent(Show, {
+      var _el$1 = _$getNextElement(_tmpl$5);
+      _$insert(_el$1, _$createComponent(Show, {
         get when() {
           return props.onClick;
         },
         get fallback() {
           return (() => {
-            var _el$12 = _$getNextElement(_tmpl$7);
-            _$insert(_el$12, () => messages().previewMoreLines(props.count));
-            return _el$12;
+            var _el$10 = _$getNextElement(_tmpl$6);
+            _$insert(_el$10, () => messages().previewMoreLines(props.count));
+            return _el$10;
           })();
         },
         get children() {
@@ -242,7 +266,7 @@ function MoreLines(props) {
           });
         }
       }));
-      return _el$11;
+      return _el$1;
     }
   });
 }
@@ -251,8 +275,8 @@ function TextExcerpt(props) {
   const limit = () => props.renderer.previewLines === undefined ? lines().length : Math.max(1, props.renderer.previewLines);
   const text = () => lines().slice(0, limit()).join("\n");
   return [(() => {
-    var _el$13 = _$getNextElement(_tmpl$8);
-    _$insert(_el$13, _$createComponent(Show, {
+    var _el$11 = _$getNextElement(_tmpl$7);
+    _$insert(_el$11, _$createComponent(Show, {
       get when() {
         return props.markdown;
       },
@@ -277,8 +301,8 @@ function TextExcerpt(props) {
         });
       }
     }));
-    _$effect(() => _el$13.classList.toggle("k2b-content-file-view__excerpt", !!(props.renderer.previewLines !== undefined)));
-    return _el$13;
+    _$effect(() => _el$11.classList.toggle("k2b-content-file-view__excerpt", !!(props.renderer.previewLines !== undefined)));
+    return _el$11;
   })(), _$createComponent(MoreLines, {
     get count() {
       return lines().length - limit();
@@ -314,23 +338,23 @@ function MarkdownRenderer(props) {
           }), _$createComponent(DownloadAction, props)];
         },
         get children() {
-          var _el$14 = _$getNextElement(_tmpl$9);
-          _$insert(_el$14, _$createComponent(TextExcerpt, {
+          var _el$12 = _$getNextElement(_tmpl$8);
+          _$insert(_el$12, _$createComponent(TextExcerpt, {
             renderer: props,
             get text() {
               return stripFrontmatter(props.editor?.draft() ?? props.content.content);
             },
             markdown: true
           }));
-          return _el$14;
+          return _el$12;
         }
       });
     },
     children: _ => {
       const editor = props.editor;
       return (() => {
-        var _el$15 = _$getNextElement(_tmpl$0);
-        _$insert(_el$15, _$createComponent(MarkdownEditor, {
+        var _el$13 = _$getNextElement(_tmpl$9);
+        _$insert(_el$13, _$createComponent(MarkdownEditor, {
           "class": "k2b-content-file-view__markdown-field",
           get ["aria-label"]() {
             return `Edit ${props.file.path.slice(props.file.path.lastIndexOf("/") + 1)}`;
@@ -360,7 +384,7 @@ function MarkdownRenderer(props) {
             });
           }
         }));
-        return _el$15;
+        return _el$13;
       })();
     }
   });
@@ -389,50 +413,43 @@ function TextRenderer(props) {
     children: editor => // Same chrome as the markdown editor — literally the same classes, so
     // border, radius, focus ring, toolbar height and text metrics cannot drift.
     (() => {
-      var _el$16 = _$getNextElement(_tmpl$1),
+      var _el$14 = _$getNextElement(_tmpl$0),
+        _el$15 = _el$14.firstChild,
+        _el$16 = _el$15.firstChild,
         _el$17 = _el$16.firstChild,
-        _el$18 = _el$17.firstChild,
+        _el$18 = _el$17.nextSibling,
         _el$19 = _el$18.firstChild,
-        _el$20 = _el$19.nextSibling,
-        _el$21 = _el$20.firstChild,
-        [_el$22, _co$2] = _$getNextMarker(_el$21.nextSibling),
-        _el$23 = _el$22.nextSibling,
-        [_el$24, _co$3] = _$getNextMarker(_el$23.nextSibling),
-        _el$25 = _el$18.nextSibling,
-        _el$26 = _el$25.firstChild;
-      _el$17.$$keydown = event => {
+        [_el$20, _co$2] = _$getNextMarker(_el$19.nextSibling),
+        _el$21 = _el$20.nextSibling,
+        [_el$22, _co$3] = _$getNextMarker(_el$21.nextSibling),
+        _el$23 = _el$16.nextSibling,
+        _el$24 = _el$23.firstChild;
+      _el$15.$$keydown = event => {
         if ((event.metaKey || event.ctrlKey) && event.key.toLowerCase() === "s") {
           event.preventDefault();
           if (editor().dirty() && !editor().saving()) void editor().save();
         }
       };
-      _$insert(_el$19, () => codeLanguage(props.file.path));
-      _$insert(_el$20, _$createComponent(Show, {
+      _$insert(_el$17, () => codeLanguage(props.file.path));
+      _$insert(_el$18, _$createComponent(Show, {
         get when() {
           return props.downloadHref;
         },
-        children: href => (() => {
-          var _el$27 = _$getNextElement(_tmpl$10);
-          _$effect(_p$ => {
-            var _v$11 = href(),
-              _v$12 = props.file.path.slice(props.file.path.lastIndexOf("/") + 1),
-              _v$13 = messages().download,
-              _v$14 = messages().download;
-            _v$11 !== _p$.e && _$setAttribute(_el$27, "href", _p$.e = _v$11);
-            _v$12 !== _p$.t && _$setAttribute(_el$27, "download", _p$.t = _v$12);
-            _v$13 !== _p$.a && _$setAttribute(_el$27, "title", _p$.a = _v$13);
-            _v$14 !== _p$.o && _$setAttribute(_el$27, "aria-label", _p$.o = _v$14);
-            return _p$;
-          }, {
-            e: undefined,
-            t: undefined,
-            a: undefined,
-            o: undefined
-          });
-          return _el$27;
-        })()
-      }), _el$22, _co$2);
-      _$insert(_el$20, _$createComponent(EditorToolButton, {
+        children: href => _$createComponent(DownloadLink, {
+          "class": "k2b-markdown-editor__tool",
+          get href() {
+            return href();
+          },
+          get download() {
+            return props.file.path.slice(props.file.path.lastIndexOf("/") + 1);
+          },
+          get label() {
+            return messages().download;
+          },
+          icon: "ti ti-download"
+        })
+      }), _el$20, _co$2);
+      _$insert(_el$18, _$createComponent(EditorToolButton, {
         get icon() {
           return editor().saving() ? "ti ti-loader-2 k2b-spin" : "ti ti-device-floppy";
         },
@@ -443,13 +460,13 @@ function TextRenderer(props) {
           return !editor().dirty() || editor().saving();
         },
         onClick: () => void editor().save()
-      }), _el$24, _co$3);
-      _el$26.$$input = event => editor().setDraft(event.currentTarget.value);
-      _$setAttribute(_el$26, "spellcheck", false);
-      _$effect(() => _$setAttribute(_el$17, "aria-label", messages().textEditor));
-      _$effect(() => _$setProperty(_el$26, "value", editor().draft()));
+      }), _el$22, _co$3);
+      _el$24.$$input = event => editor().setDraft(event.currentTarget.value);
+      _$setAttribute(_el$24, "spellcheck", false);
+      _$effect(() => _$setAttribute(_el$15, "aria-label", messages().textEditor));
+      _$effect(() => _$setProperty(_el$24, "value", editor().draft()));
       _$runHydrationEvents();
-      return _el$16;
+      return _el$14;
     })()
   });
 }
@@ -475,8 +492,8 @@ function JsonRenderer(props) {
       return _$createComponent(DownloadAction, props);
     },
     get children() {
-      var _el$28 = _$getNextElement(_tmpl$9);
-      _$insert(_el$28, _$createComponent(Show, {
+      var _el$25 = _$getNextElement(_tmpl$8);
+      _$insert(_el$25, _$createComponent(Show, {
         get when() {
           return parsed().ok;
         },
@@ -512,7 +529,7 @@ function JsonRenderer(props) {
           });
         }
       }));
-      return _el$28;
+      return _el$25;
     }
   });
 }
@@ -560,14 +577,14 @@ function DelimitedTextRenderer(props) {
     offset: page() * pageSize()
   }));
   const settings = () => prompts.dialog(() => (() => {
-    var _el$29 = _$getNextElement(_tmpl$11),
-      _el$30 = _el$29.firstChild,
-      [_el$31, _co$4] = _$getNextMarker(_el$30.nextSibling),
-      _el$32 = _el$31.nextSibling,
-      [_el$33, _co$5] = _$getNextMarker(_el$32.nextSibling),
-      _el$34 = _el$33.nextSibling,
-      [_el$35, _co$6] = _$getNextMarker(_el$34.nextSibling);
-    _$insert(_el$29, _$createComponent(Select, {
+    var _el$26 = _$getNextElement(_tmpl$1),
+      _el$27 = _el$26.firstChild,
+      [_el$28, _co$4] = _$getNextMarker(_el$27.nextSibling),
+      _el$29 = _el$28.nextSibling,
+      [_el$30, _co$5] = _$getNextMarker(_el$29.nextSibling),
+      _el$31 = _el$30.nextSibling,
+      [_el$32, _co$6] = _$getNextMarker(_el$31.nextSibling);
+    _$insert(_el$26, _$createComponent(Select, {
       get label() {
         return messages().csvEncoding;
       },
@@ -583,8 +600,8 @@ function DelimitedTextRenderer(props) {
           encoding: value
         });
       }
-    }), _el$31, _co$4);
-    _$insert(_el$29, _$createComponent(Select, {
+    }), _el$28, _co$4);
+    _$insert(_el$26, _$createComponent(Select, {
       get label() {
         return messages().csvSeparator;
       },
@@ -614,8 +631,8 @@ function DelimitedTextRenderer(props) {
           delimiter: value
         });
       }
-    }), _el$33, _co$5);
-    _$insert(_el$29, _$createComponent(Select, {
+    }), _el$30, _co$5);
+    _$insert(_el$26, _$createComponent(Select, {
       get label() {
         return messages().csvView;
       },
@@ -636,8 +653,8 @@ function DelimitedTextRenderer(props) {
           view: value
         });
       }
-    }), _el$35, _co$6);
-    return _el$29;
+    }), _el$32, _co$6);
+    return _el$26;
   })(), {
     title: messages().csvSettings
   });
@@ -683,58 +700,58 @@ function DelimitedTextRenderer(props) {
               });
             },
             get children() {
-              var _el$36 = _$getNextElement(_tmpl$12),
-                _el$37 = _el$36.firstChild,
-                _el$38 = _el$37.firstChild,
-                _el$39 = _el$38.firstChild,
-                _el$40 = _el$38.nextSibling,
-                _el$42 = _el$37.nextSibling,
-                [_el$43, _co$7] = _$getNextMarker(_el$42.nextSibling),
-                _el$44 = _el$43.nextSibling,
-                [_el$45, _co$8] = _$getNextMarker(_el$44.nextSibling);
-              _$insert(_el$39, _$createComponent(For, {
+              var _el$33 = _$getNextElement(_tmpl$10),
+                _el$34 = _el$33.firstChild,
+                _el$35 = _el$34.firstChild,
+                _el$36 = _el$35.firstChild,
+                _el$37 = _el$35.nextSibling,
+                _el$39 = _el$34.nextSibling,
+                [_el$40, _co$7] = _$getNextMarker(_el$39.nextSibling),
+                _el$41 = _el$40.nextSibling,
+                [_el$42, _co$8] = _$getNextMarker(_el$41.nextSibling);
+              _$insert(_el$36, _$createComponent(For, {
                 get each() {
                   return headers();
                 },
                 children: (header, index) => (() => {
-                  var _el$46 = _$getNextElement(_tmpl$13),
-                    _el$47 = _el$46.firstChild;
-                  _$insert(_el$47, () => header || messages().column({
+                  var _el$43 = _$getNextElement(_tmpl$11),
+                    _el$44 = _el$43.firstChild;
+                  _$insert(_el$44, () => header || messages().column({
                     number: index() + 1
                   }));
-                  return _el$46;
+                  return _el$43;
                 })()
               }));
-              _$insert(_el$40, _$createComponent(For, {
+              _$insert(_el$37, _$createComponent(For, {
                 get each() {
                   return rows();
                 },
                 children: row => (() => {
-                  var _el$48 = _$getNextElement(_tmpl$14);
-                  _$insert(_el$48, _$createComponent(For, {
+                  var _el$45 = _$getNextElement(_tmpl$12);
+                  _$insert(_el$45, _$createComponent(For, {
                     get each() {
                       return headers();
                     },
                     children: (_, index) => (() => {
-                      var _el$49 = _$getNextElement(_tmpl$15);
-                      _$insert(_el$49, () => row[index()] ?? "");
-                      return _el$49;
+                      var _el$46 = _$getNextElement(_tmpl$13);
+                      _$insert(_el$46, () => row[index()] ?? "");
+                      return _el$46;
                     })()
                   }));
-                  return _el$48;
+                  return _el$45;
                 })()
               }));
-              _$insert(_el$36, _$createComponent(Show, {
+              _$insert(_el$33, _$createComponent(Show, {
                 get when() {
                   return preview().columnsTruncated;
                 },
                 get children() {
-                  var _el$41 = _$getNextElement(_tmpl$6);
-                  _$insert(_el$41, () => messages().previewColumnsLimited);
-                  return _el$41;
+                  var _el$38 = _$getNextElement(_tmpl$5);
+                  _$insert(_el$38, () => messages().previewColumnsLimited);
+                  return _el$38;
                 }
-              }), _el$43, _co$7);
-              _$insert(_el$36, _$createComponent(Show, {
+              }), _el$40, _co$7);
+              _$insert(_el$33, _$createComponent(Show, {
                 get when() {
                   return props.previewLines !== undefined;
                 },
@@ -744,21 +761,21 @@ function DelimitedTextRenderer(props) {
                       return preview().totalRows > 201;
                     },
                     get children() {
-                      var _el$50 = _$getNextElement(_tmpl$16),
-                        _el$60 = _el$50.firstChild,
-                        [_el$61, _co$10] = _$getNextMarker(_el$60.nextSibling),
-                        _el$51 = _el$61.nextSibling,
-                        _el$54 = _el$51.firstChild,
-                        [_el$55, _co$9] = _$getNextMarker(_el$54.nextSibling),
-                        _el$52 = _el$55.nextSibling,
-                        _el$56 = _el$52.nextSibling,
-                        [_el$57, _co$0] = _$getNextMarker(_el$56.nextSibling),
-                        _el$53 = _el$57.nextSibling,
-                        _el$58 = _el$53.nextSibling,
-                        [_el$59, _co$1] = _$getNextMarker(_el$58.nextSibling),
-                        _el$62 = _el$51.nextSibling,
-                        [_el$63, _co$11] = _$getNextMarker(_el$62.nextSibling);
-                      _$insert(_el$50, _$createComponent(Button, {
+                      var _el$47 = _$getNextElement(_tmpl$14),
+                        _el$57 = _el$47.firstChild,
+                        [_el$58, _co$10] = _$getNextMarker(_el$57.nextSibling),
+                        _el$48 = _el$58.nextSibling,
+                        _el$51 = _el$48.firstChild,
+                        [_el$52, _co$9] = _$getNextMarker(_el$51.nextSibling),
+                        _el$49 = _el$52.nextSibling,
+                        _el$53 = _el$49.nextSibling,
+                        [_el$54, _co$0] = _$getNextMarker(_el$53.nextSibling),
+                        _el$50 = _el$54.nextSibling,
+                        _el$55 = _el$50.nextSibling,
+                        [_el$56, _co$1] = _$getNextMarker(_el$55.nextSibling),
+                        _el$59 = _el$48.nextSibling,
+                        [_el$60, _co$11] = _$getNextMarker(_el$59.nextSibling);
+                      _$insert(_el$47, _$createComponent(Button, {
                         size: "sm",
                         variant: "ghost",
                         get disabled() {
@@ -768,11 +785,11 @@ function DelimitedTextRenderer(props) {
                         get children() {
                           return messages().previous;
                         }
-                      }), _el$61, _co$10);
-                      _$insert(_el$51, () => page() * pageSize() + 1, _el$55, _co$9);
-                      _$insert(_el$51, () => Math.min((page() + 1) * pageSize(), preview().totalRows - 1), _el$57, _co$0);
-                      _$insert(_el$51, () => preview().totalRows - 1, _el$59, _co$1);
-                      _$insert(_el$50, _$createComponent(Button, {
+                      }), _el$58, _co$10);
+                      _$insert(_el$48, () => page() * pageSize() + 1, _el$52, _co$9);
+                      _$insert(_el$48, () => Math.min((page() + 1) * pageSize(), preview().totalRows - 1), _el$54, _co$0);
+                      _$insert(_el$48, () => preview().totalRows - 1, _el$56, _co$1);
+                      _$insert(_el$47, _$createComponent(Button, {
                         size: "sm",
                         variant: "ghost",
                         get disabled() {
@@ -782,8 +799,8 @@ function DelimitedTextRenderer(props) {
                         get children() {
                           return messages().next;
                         }
-                      }), _el$63, _co$11);
-                      return _el$50;
+                      }), _el$60, _co$11);
+                      return _el$47;
                     }
                   });
                 },
@@ -797,8 +814,8 @@ function DelimitedTextRenderer(props) {
                     }
                   });
                 }
-              }), _el$45, _co$8);
-              return _el$36;
+              }), _el$42, _co$8);
+              return _el$33;
             }
           });
         }
@@ -813,23 +830,23 @@ function ImageRenderer(props) {
       return _$createComponent(DownloadAction, props);
     },
     get children() {
-      var _el$64 = _$getNextElement(_tmpl$17),
-        _el$65 = _el$64.firstChild;
-      _$addEventListener(_el$65, "error", props.onPreviewError);
+      var _el$61 = _$getNextElement(_tmpl$15),
+        _el$62 = _el$61.firstChild;
+      _$addEventListener(_el$62, "error", props.onPreviewError);
       _$effect(_p$ => {
-        var _v$15 = props.crossOrigin,
-          _v$16 = mediaSource(props),
-          _v$17 = props.file.path;
-        _v$15 !== _p$.e && _$setAttribute(_el$65, "crossorigin", _p$.e = _v$15);
-        _v$16 !== _p$.t && _$setAttribute(_el$65, "src", _p$.t = _v$16);
-        _v$17 !== _p$.a && _$setAttribute(_el$65, "alt", _p$.a = _v$17);
+        var _v$6 = props.crossOrigin,
+          _v$7 = mediaSource(props),
+          _v$8 = props.file.path;
+        _v$6 !== _p$.e && _$setAttribute(_el$62, "crossorigin", _p$.e = _v$6);
+        _v$7 !== _p$.t && _$setAttribute(_el$62, "src", _p$.t = _v$7);
+        _v$8 !== _p$.a && _$setAttribute(_el$62, "alt", _p$.a = _v$8);
         return _p$;
       }, {
         e: undefined,
         t: undefined,
         a: undefined
       });
-      return _el$64;
+      return _el$61;
     }
   });
 }
@@ -889,18 +906,18 @@ function PdfRenderer(props) {
       });
     },
     children: href => (() => {
-      var _el$66 = _$getNextElement(_tmpl$18);
+      var _el$63 = _$getNextElement(_tmpl$16);
       _$effect(_p$ => {
-        var _v$18 = href(),
-          _v$19 = props.file.path;
-        _v$18 !== _p$.e && _$setAttribute(_el$66, "data", _p$.e = _v$18);
-        _v$19 !== _p$.t && _$setAttribute(_el$66, "aria-label", _p$.t = _v$19);
+        var _v$9 = href(),
+          _v$0 = props.file.path;
+        _v$9 !== _p$.e && _$setAttribute(_el$63, "data", _p$.e = _v$9);
+        _v$0 !== _p$.t && _$setAttribute(_el$63, "aria-label", _p$.t = _v$0);
         return _p$;
       }, {
         e: undefined,
         t: undefined
       });
-      return _el$66;
+      return _el$63;
     })()
   });
 }
@@ -911,24 +928,24 @@ function AudioRenderer(props) {
       return _$createComponent(DownloadAction, props);
     },
     get children() {
-      var _el$67 = _$getNextElement(_tmpl$19),
-        _el$68 = _el$67.firstChild;
-      _$addEventListener(_el$68, "error", props.onPreviewError);
-      _$insert(_el$68, () => messages().audioUnsupported);
+      var _el$64 = _$getNextElement(_tmpl$17),
+        _el$65 = _el$64.firstChild;
+      _$addEventListener(_el$65, "error", props.onPreviewError);
+      _$insert(_el$65, () => messages().audioUnsupported);
       _$effect(_p$ => {
-        var _v$20 = props.crossOrigin,
-          _v$21 = mediaSource(props),
-          _v$22 = props.file.path;
-        _v$20 !== _p$.e && _$setAttribute(_el$68, "crossorigin", _p$.e = _v$20);
-        _v$21 !== _p$.t && _$setAttribute(_el$68, "src", _p$.t = _v$21);
-        _v$22 !== _p$.a && _$setAttribute(_el$68, "aria-label", _p$.a = _v$22);
+        var _v$1 = props.crossOrigin,
+          _v$10 = mediaSource(props),
+          _v$11 = props.file.path;
+        _v$1 !== _p$.e && _$setAttribute(_el$65, "crossorigin", _p$.e = _v$1);
+        _v$10 !== _p$.t && _$setAttribute(_el$65, "src", _p$.t = _v$10);
+        _v$11 !== _p$.a && _$setAttribute(_el$65, "aria-label", _p$.a = _v$11);
         return _p$;
       }, {
         e: undefined,
         t: undefined,
         a: undefined
       });
-      return _el$67;
+      return _el$64;
     }
   });
 }
@@ -939,24 +956,24 @@ function VideoRenderer(props) {
       return _$createComponent(DownloadAction, props);
     },
     get children() {
-      var _el$69 = _$getNextElement(_tmpl$20),
-        _el$70 = _el$69.firstChild;
-      _$addEventListener(_el$70, "error", props.onPreviewError);
-      _$insert(_el$70, () => messages().videoUnsupported);
+      var _el$66 = _$getNextElement(_tmpl$18),
+        _el$67 = _el$66.firstChild;
+      _$addEventListener(_el$67, "error", props.onPreviewError);
+      _$insert(_el$67, () => messages().videoUnsupported);
       _$effect(_p$ => {
-        var _v$23 = props.crossOrigin,
-          _v$24 = mediaSource(props),
-          _v$25 = props.file.path;
-        _v$23 !== _p$.e && _$setAttribute(_el$70, "crossorigin", _p$.e = _v$23);
-        _v$24 !== _p$.t && _$setAttribute(_el$70, "src", _p$.t = _v$24);
-        _v$25 !== _p$.a && _$setAttribute(_el$70, "aria-label", _p$.a = _v$25);
+        var _v$12 = props.crossOrigin,
+          _v$13 = mediaSource(props),
+          _v$14 = props.file.path;
+        _v$12 !== _p$.e && _$setAttribute(_el$67, "crossorigin", _p$.e = _v$12);
+        _v$13 !== _p$.t && _$setAttribute(_el$67, "src", _p$.t = _v$13);
+        _v$14 !== _p$.a && _$setAttribute(_el$67, "aria-label", _p$.a = _v$14);
         return _p$;
       }, {
         e: undefined,
         t: undefined,
         a: undefined
       });
-      return _el$69;
+      return _el$66;
     }
   });
 }
@@ -976,13 +993,13 @@ function BinaryRenderer(props) {
           return props.downloadHref;
         },
         children: href => (() => {
-          var _el$71 = _$getNextElement(_tmpl$21),
-            _el$72 = _el$71.firstChild,
-            _el$73 = _el$72.nextSibling,
-            [_el$74, _co$12] = _$getNextMarker(_el$73.nextSibling);
-          _$insert(_el$71, () => messages().download, _el$74, _co$12);
-          _$effect(() => _$setAttribute(_el$71, "href", href()));
-          return _el$71;
+          var _el$68 = _$getNextElement(_tmpl$19),
+            _el$69 = _el$68.firstChild,
+            _el$70 = _el$69.nextSibling,
+            [_el$71, _co$12] = _$getNextMarker(_el$70.nextSibling);
+          _$insert(_el$68, () => messages().download, _el$71, _co$12);
+          _$effect(() => _$setAttribute(_el$68, "href", href()));
+          return _el$68;
         })()
       });
     }
@@ -1135,8 +1152,8 @@ export default function FileView(props) {
     save
   } : null;
   return (() => {
-    var _el$75 = _$getNextElement(_tmpl$8);
-    _$insert(_el$75, _$createComponent(Switch, {
+    var _el$72 = _$getNextElement(_tmpl$7);
+    _$insert(_el$72, _$createComponent(Switch, {
       get children() {
         return [_$createComponent(Match, {
           get when() {
@@ -1211,20 +1228,20 @@ export default function FileView(props) {
       }
     }));
     _$effect(_p$ => {
-      var _v$26 = `k2b-content-file-view ${props.class ?? ""}`,
-        _v$27 = props.variant,
-        _v$28 = props.previewLines !== undefined ? "true" : undefined;
-      _v$26 !== _p$.e && _$className(_el$75, _p$.e = _v$26);
-      _v$27 !== _p$.t && _$setAttribute(_el$75, "data-variant", _p$.t = _v$27);
-      _v$28 !== _p$.a && _$setAttribute(_el$75, "data-excerpt", _p$.a = _v$28);
+      var _v$15 = `k2b-content-file-view ${props.class ?? ""}`,
+        _v$16 = props.variant,
+        _v$17 = props.previewLines !== undefined ? "true" : undefined;
+      _v$15 !== _p$.e && _$className(_el$72, _p$.e = _v$15);
+      _v$16 !== _p$.t && _$setAttribute(_el$72, "data-variant", _p$.t = _v$16);
+      _v$17 !== _p$.a && _$setAttribute(_el$72, "data-excerpt", _p$.a = _v$17);
       return _p$;
     }, {
       e: undefined,
       t: undefined,
       a: undefined
     });
-    return _el$75;
+    return _el$72;
   })();
 }
-_$delegateEvents(["click", "mousedown", "keydown", "input"]);
+_$delegateEvents(["keydown", "input"]);
 //# sourceMappingURL=FileView.js.map