@k2b/ui 0.45.0 → 0.46.0

package/dist/ssr/actions/ViewTabs.js

@@ -1,3 +1,4 @@
+import { memo as _$memo } from "solid-js/web";
 import { ssrAttribute as _$ssrAttribute } from "solid-js/web";
 import { createComponent as _$createComponent } from "solid-js/web";
 import { ssr as _$ssr } from "solid-js/web";
@@ -5,13 +6,15 @@ import { escape as _$escape } from "solid-js/web";
 var _tmpl$ = ["<span class=\"k2b-view-tabs__count\">", "</span>"],
   _tmpl$2 = ["<span class=\"k2b-view-tabs__label k2b-truncate-fade\">", "</span>"],
   _tmpl$3 = ["<i", " aria-hidden=\"true\"></i>"],
-  _tmpl$4 = ["<span class=\"k2b-view-tabs__label\">", "</span>"],
-  _tmpl$5 = ["<span class=\"k2b-view-tabs__more-count\" data-level=\"wide\">+", "</span>"],
-  _tmpl$6 = ["<span class=\"k2b-view-tabs__more-count\" data-level=\"compact\">+", "</span>"],
-  _tmpl$7 = "<i class=\"ti ti-chevron-down\" aria-hidden=\"true\"></i>",
-  _tmpl$8 = ["<li class=\"k2b-view-tabs__more\"", ">", "</li>"],
-  _tmpl$9 = ["<nav class=\"", "\"", "><ul class=\"k2b-view-tabs__list\" data-scroll-fade-mode=\"both\" data-scroll-fade-axis=\"horizontal\">", "", "</ul><script>", "</script></nav>"],
-  _tmpl$0 = ["<li class=\"k2b-view-tabs__item\"", "><a class=\"k2b-view-tabs__tab\"", ">", "</a></li>"];
+  _tmpl$4 = ["<span class=\"k2b-view-tabs__badge\">", "</span>"],
+  _tmpl$5 = ["<li class=\"k2b-view-tabs__item\"", "><a class=\"k2b-view-tabs__tab\"", ">", "</a></li>"],
+  _tmpl$6 = ["<span class=\"k2b-view-tabs__label\">", "</span>"],
+  _tmpl$7 = ["<span class=\"k2b-view-tabs__more-count\" data-level=\"wide\">+", "</span>"],
+  _tmpl$8 = ["<span class=\"k2b-view-tabs__more-count\" data-level=\"compact\">+", "</span>"],
+  _tmpl$9 = "<span class=\"k2b-view-tabs__more-count\" data-level=\"fit\"></span>",
+  _tmpl$0 = "<i class=\"ti ti-chevron-down\" aria-hidden=\"true\"></i>",
+  _tmpl$1 = ["<li class=\"k2b-view-tabs__more\"", ">", "</li>"],
+  _tmpl$10 = ["<nav class=\"", "\"", "><ul class=\"k2b-view-tabs__list\" data-scroll-fade-mode=\"both\" data-scroll-fade-axis=\"horizontal\"", ">", "", "", "</ul><script>", "</script></nav>"];
 import { createEffect, createMemo, createSignal, For, on, onCleanup, onMount, Show } from "solid-js";
 import { useUiMessages } from "../intl/messages";
 import { createScrollFade, scrollFadeEdges } from "../layout/scroll-fade";
@@ -20,10 +23,14 @@ import Dropdown from "./Dropdown";
 export function viewTabsLayout(items, current, max = 5) {
   // At least one slot keeps the current view visible, including for an invalid limit.
   const limit = Number.isFinite(max) ? Math.max(1, Math.floor(max)) : 5;
+  // Pinned views never overflow, so they take no slot.
+  const flowing = items.flatMap((item, index) => item.pinned ? [] : [index]);
+  const pinned = items.flatMap((item, index) => item.pinned ? [index] : []);
   const currentIndex = items.findIndex(item => item.id === current);
+  const currentPosition = flowing.indexOf(currentIndex);
   const visible = size => {
-    const indices = items.slice(0, size).map((_, index) => index);
-    if (currentIndex >= size) indices[indices.length - 1] = currentIndex;
+    const indices = flowing.slice(0, size);
+    if (currentPosition >= size) indices[indices.length - 1] = currentIndex;
     return indices;
   };
   const wide = visible(limit);
@@ -31,14 +38,50 @@ export function viewTabsLayout(items, current, max = 5) {
   return {
     wide,
     compact,
-    wideHidden: items.length - wide.length,
-    compactHidden: items.length - compact.length
+    pinned,
+    wideHidden: flowing.length - wide.length,
+    compactHidden: flowing.length - compact.length
   };
 }
 
-/** Self-contained: the server script embeds this before hydration. */
+/**
+ * Self-contained: the server script embeds this before hydration. A fitting strip first keeps only the views that fit
+ * its room and counts the rest in More; then the open or focused view scrolls into the strip.
+ */
 function settleViewTabs(list, edges, focused) {
   if (!(list instanceof HTMLElement)) return;
+  const more = list.querySelector(":scope > .k2b-view-tabs__more");
+  const fitCount = more?.querySelector('.k2b-view-tabs__more-count[data-level="fit"]');
+  const flowing = Array.from(list.querySelectorAll(":scope > .k2b-view-tabs__item:not([data-pinned])"));
+  for (const item of flowing) item.removeAttribute("data-fit-hidden");
+  more?.removeAttribute("data-fit");
+  // The shown entries against the strip's inner room, whatever its scroll and padding.
+  const overflows = () => {
+    const boxes = Array.from(list.children).filter(child => child instanceof HTMLElement && child.tagName === "LI" && child.getClientRects().length > 0).map(child => child.getBoundingClientRect());
+    if (boxes.length === 0) return false;
+    const style = getComputedStyle(list);
+    const room = list.clientWidth - (parseFloat(style.paddingLeft) || 0) - (parseFloat(style.paddingRight) || 0);
+    return Math.max(...boxes.map(box => box.right)) - Math.min(...boxes.map(box => box.left)) > room + 0.5;
+  };
+  // The phone head row keeps its scrolling strip: its CSS turns fitting off.
+  const fits = list.hasAttribute("data-fit-room") && getComputedStyle(list).getPropertyValue("--k2b-view-tabs-fit").trim() !== "none";
+  if (fits && more && fitCount && overflows()) {
+    // Count from the level on screen: the compact strip already keeps fewer views than the wide one.
+    const compact = more.querySelector('.k2b-view-tabs__more-count[data-level="compact"]');
+    const compactShown = Boolean(compact && getComputedStyle(compact).display !== "none");
+    const behind = Number(compactShown ? more.dataset.behindCompact : more.dataset.behindWide) || 0;
+    // The last views on screen leave first; the open view stays.
+    const candidates = flowing.filter(item => item.getClientRects().length > 0 && !item.querySelector("[aria-current=page]")).reverse();
+    more.setAttribute("data-fit", "");
+    let hidden = 0;
+    for (const item of candidates) {
+      item.setAttribute("data-fit-hidden", "");
+      hidden += 1;
+      fitCount.textContent = `+${behind + hidden}`;
+      if (!overflows()) break;
+    }
+    if (hidden === 0) more.removeAttribute("data-fit");
+  }
   const current = focused ?? list.querySelector(".k2b-view-tabs__tab[aria-current=page]");
   if (current && current.getClientRects().length > 0 && list.scrollWidth - list.clientWidth > 1) {
     const bounds = list.getBoundingClientRect();
@@ -63,9 +106,20 @@ function settleViewTabs(list, edges, focused) {
   const fade = edges(list);
   if (fade) list.setAttribute("data-scroll-fade", fade);else list.removeAttribute("data-scroll-fade");
 }
-/** Also embedded, so it must not close over module state. */
+/**
+ * Also embedded, so it must not close over module state.
+ *
+ * A fitting strip converges by construction. It fits again only when the strip renders, web fonts finish loading, or
+ * a notification finds another width of the head lead or of an entry that the last fit left shown. A fit only shows
+ * and hides entries: the lead is an inline-size container that takes no width from the strip, and every entry keeps
+ * its own width (`flex: none`), so the notifications a fit causes find the widths it ended with and stop there.
+ */
 function watchViewTabs(list, settle, edges) {
   if (!(list instanceof HTMLElement)) return;
+  const fits = list.hasAttribute("data-fit-room");
+  const roomOf = () => list.closest(".k2b-app-workspace__head-lead");
+  // What a fit depends on: the lead's width and each shown entry's width, which fonts, icons and labels change.
+  const measured = () => [roomOf()?.clientWidth ?? -1, ...Array.from(list.children, child => child.getBoundingClientRect().width)].join(" ");
   // A DOM property survives hydration: one observer and focus listener per reused list.
   let watch = list.__k2bViewTabsWatch;
   if (!watch) {
@@ -76,29 +130,66 @@ function watchViewTabs(list, settle, edges) {
         settle(list, edges, event.target);
       }
     };
+    const settleNow = () => {
+      const focused = document.activeElement;
+      if (watch?.preferCurrent === false && focused instanceof HTMLElement && list.contains(focused) && focused.matches(".k2b-view-tabs__tab:focus-visible")) settle(list, edges, focused);else settle(list, edges);
+    };
+    // Head actions parse after the views; settle again after their layout, before paint, and on later resizes.
+    const connect = () => {
+      if (!watch) return;
+      watch.resize.disconnect();
+      watch.resize.observe(list);
+      for (const child of Array.from(list.children)) watch.resize.observe(child);
+      const room = roomOf();
+      if (fits && room) watch.resize.observe(room);
+    };
+    // Fitting resizes the strip and possibly the head, which other observers may watch. Inside a ResizeObserver
+    // callback that would leave their notifications undelivered, so a fit runs in the next frame, still before it paints.
+    const schedule = () => {
+      if (!watch || watch.frame) return;
+      watch.frame = requestAnimationFrame(() => {
+        if (!watch) return;
+        watch.frame = 0;
+        if (!list.isConnected) return;
+        settleNow();
+        watch.room = measured();
+      });
+    };
     watch = {
       resize: new ResizeObserver(() => {
-        const focused = document.activeElement;
-        if (watch?.preferCurrent === false && focused instanceof HTMLElement && list.contains(focused) && focused.matches(".k2b-view-tabs__tab:focus-visible")) settle(list, edges, focused);else settle(list, edges);
+        // A scrolling strip only scrolls and settles at once.
+        if (!fits) return settleNow();
+        // Heights follow the fit, and hidden entries measure 0 by its own doing: only another measure counts.
+        if (watch && measured() !== watch.room) watch.schedule();
       }),
       focus,
-      preferCurrent: true
+      preferCurrent: true,
+      connect,
+      schedule,
+      frame: 0,
+      room: "",
+      fonts: () => watch?.schedule()
     };
     Object.defineProperty(list, "__k2bViewTabsWatch", {
       value: watch,
       configurable: true
     });
     list.addEventListener("focusin", focus);
+    // A first visit can paint before the web fonts load; the server frame and the client then fit the same metrics.
+    if (fits && document.fonts) {
+      document.fonts.addEventListener("loadingdone", watch.fonts);
+      void document.fonts.ready.then(watch.fonts);
+    }
   }
   watch.preferCurrent = true;
-  const {
-    resize
-  } = watch;
-  resize.disconnect();
-  // Head actions parse after the views; settle again after their layout, before paint, and on later resizes.
-  resize.observe(list);
-  for (const child of Array.from(list.children)) resize.observe(child);
+  watch.connect();
   settle(list, edges);
+  if (fits) {
+    watch.room = measured();
+    // The head's actions parse after the views. A frame's animation callbacks run before its first layout and
+    // paint, so this fit also counts their room in the first frame.
+    watch.schedule();
+  }
   return watch;
 }
 const VIEW_TABS_SCRIPT = `(${watchViewTabs})(document.currentScript&&document.currentScript.previousElementSibling,${settleViewTabs},${scrollFadeEdges})`;
@@ -125,6 +216,8 @@ export function ViewTabs(props) {
     onCleanup(() => {
       disposed = true;
       watch?.resize.disconnect();
+      if (watch?.frame) cancelAnimationFrame(watch.frame);
+      if (watch) document.fonts?.removeEventListener("loadingdone", watch.fonts);
       if (list && watch) {
         list.removeEventListener("focusin", watch.focus);
         Reflect.deleteProperty(list, "__k2bViewTabsWatch");
@@ -132,14 +225,17 @@ export function ViewTabs(props) {
     });
   });
   // User effects run after Solid's render effects, including For and aria-current, in the same task.
-  createEffect(on(() => props.current, () => watchViewTabs(list ?? null, settleViewTabs, scrollFadeEdges), {
+  // What the strip shows: another open view, view, label, count or badge can change what fits. Equal content in a new
+  // array settles nothing again.
+  const shown = createMemo(() => [props.current ?? "", layout().wide.join(","), ...props.items.map(item => `${item.id}\u0000${item.label}\u0000${item.count ?? ""}\u0000${item.badge ?? ""}`)].join("\u0001"));
+  createEffect(on(shown, () => watchViewTabs(list ?? null, settleViewTabs, scrollFadeEdges), {
     defer: true
   }));
   const [open, setOpen] = createSignal(false);
   const [menuItems, setMenuItems] = createSignal([]);
   const onOpenChange = next => {
     if (next) {
-      setMenuItems(props.items.filter((item, index) => item.id !== props.current && (!layout().wide.includes(index) || stripItems.get(index)?.getClientRects().length === 0)).map(item => ({
+      setMenuItems(props.items.filter((item, index) => !item.pinned && item.id !== props.current && (!layout().wide.includes(index) || stripItems.get(index)?.getClientRects().length === 0)).map(item => ({
         href: item.href,
         label: item.label,
         icon: item.icon,
@@ -160,22 +256,28 @@ export function ViewTabs(props) {
     get children() {
       return _$ssr(_tmpl$, _$escape(item.count));
     }
+  }), _$createComponent(Show, {
+    get when() {
+      return item.badge;
+    },
+    children: badge => _$ssr(_tmpl$4, _$escape(badge()))
   })];
-  return _$ssr(_tmpl$9, `k2b-view-tabs ${_$escape(props.class ?? "", true)}`, _$ssrAttribute("aria-label", _$escape(props.label, true), false), _$escape(_$createComponent(For, {
+  const stripItem = index => {
+    const item = () => props.items[index];
+    onCleanup(() => stripItems.delete(index));
+    return _$ssr(_tmpl$5, _$ssrAttribute("data-view-tab", _$escape(item().id, true), false) + _$ssrAttribute("data-pinned", item().pinned ? "" : _$escape(undefined, true), false) + _$ssrAttribute("data-compact-hidden", !item().pinned && !layout().compact.includes(index) ? "" : _$escape(undefined, true), false), _$ssrAttribute("href", _$escape(item().href, true), false) + _$ssrAttribute("aria-current", item().id === props.current ? "page" : _$escape(undefined, true), false), _$escape(tabContent(item())));
+  };
+  return _$ssr(_tmpl$10, `k2b-view-tabs ${_$escape(props.class ?? "", true)}`, _$ssrAttribute("aria-label", _$escape(props.label, true), false), _$ssrAttribute("data-fit-room", props.fit ? "" : _$escape(undefined, true), false), _$escape(_$createComponent(For, {
     get each() {
       return layout().wide;
     },
-    children: index => {
-      const item = () => props.items[index];
-      onCleanup(() => stripItems.delete(index));
-      return _$ssr(_tmpl$0, _$ssrAttribute("data-view-tab", _$escape(item().id, true), false) + _$ssrAttribute("data-compact-hidden", !layout().compact.includes(index) ? "" : _$escape(undefined, true), false), _$ssrAttribute("href", _$escape(item().href, true), false) + _$ssrAttribute("aria-current", item().id === props.current ? "page" : _$escape(undefined, true), false), _$escape(tabContent(item())));
-    }
+    children: stripItem
   })), _$escape(_$createComponent(Show, {
     get when() {
-      return layout().compactHidden + layout().wideHidden > 0;
+      return layout().compactHidden + layout().wideHidden > 0 || props.fit && layout().wide.length > 1;
     },
     get children() {
-      return _$ssr(_tmpl$8, _$ssrAttribute("data-wide", layout().wideHidden > 0 ? "" : _$escape(undefined, true), false), _$escape(_$createComponent(Dropdown.Root, {
+      return _$ssr(_tmpl$1, _$ssrAttribute("data-wide", layout().wideHidden > 0 ? "" : _$escape(undefined, true), false) + _$ssrAttribute("data-behind-wide", _$escape(layout().wideHidden, true), false) + _$ssrAttribute("data-behind-compact", _$escape(layout().compactHidden, true), false), _$escape(_$createComponent(Dropdown.Root, {
         get items() {
           return menuItems();
         },
@@ -194,26 +296,31 @@ export function ViewTabs(props) {
               return messages().moreViews;
             },
             get children() {
-              return [_$ssr(_tmpl$4, _$escape(messages().more)), _$createComponent(Show, {
+              return [_$ssr(_tmpl$6, _$escape(messages().more)), _$createComponent(Show, {
                 get when() {
                   return layout().wideHidden > 0;
                 },
                 get children() {
-                  return _$ssr(_tmpl$5, _$escape(layout().wideHidden));
+                  return _$ssr(_tmpl$7, _$escape(layout().wideHidden));
                 }
               }), _$createComponent(Show, {
                 get when() {
                   return layout().compactHidden > 0;
                 },
                 get children() {
-                  return _$ssr(_tmpl$6, _$escape(layout().compactHidden));
+                  return _$ssr(_tmpl$8, _$escape(layout().compactHidden));
                 }
-              }), _$ssr(_tmpl$7)];
+              }), _$ssr(_tmpl$9), _$ssr(_tmpl$0)];
             }
           });
         }
       })));
     }
+  })), _$escape(_$createComponent(For, {
+    get each() {
+      return layout().pinned;
+    },
+    children: stripItem
   })), VIEW_TABS_SCRIPT);
 }
 //# sourceMappingURL=ViewTabs.js.map

package/dist/ssr/actions/ViewTabs.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["actions/ViewTabs.tsx"],"sourcesContent":["import { createEffect, createMemo, createSignal, For, type JSX, on, onCleanup, onMount, Show } from \"solid-js\";\nimport { useUiMessages } from \"../intl/messages\";\nimport { createScrollFade, scrollFadeEdges } from \"../layout/scroll-fade\";\nimport Dropdown, { type DropdownItem } from \"./Dropdown\";\n\nexport type ViewTab = { id: string; label: string; href: string; icon?: string; count?: number | string };\nexport type ViewTabsProps = {\n  /** Accessible name of the navigation landmark, e.g. \"Views\". */\n  label: string;\n  items: readonly ViewTab[];\n  /** Id of the open view; the server reads it from `?view=`. Unknown ids select nothing. */\n  current: string | undefined;\n  /** Tabs shown before More (default 5). */\n  max?: number;\n  class?: string;\n};\n\n/** Two deterministic strip levels; only opening the menu reads CSS visibility. */\nexport function viewTabsLayout(items: readonly ViewTab[], current: string | undefined, max = 5) {\n  // At least one slot keeps the current view visible, including for an invalid limit.\n  const limit = Number.isFinite(max) ? Math.max(1, Math.floor(max)) : 5;\n  const currentIndex = items.findIndex((item) => item.id === current);\n  const visible = (size: number) => {\n    const indices = items.slice(0, size).map((_, index) => index);\n    if (currentIndex >= size) indices[indices.length - 1] = currentIndex;\n    return indices;\n  };\n  const wide = visible(limit);\n  const compact = visible(Math.min(limit, 3));\n  return { wide, compact, wideHidden: items.length - wide.length, compactHidden: items.length - compact.length };\n}\n\n/** Self-contained: the server script embeds this before hydration. */\nfunction settleViewTabs(list: Element | null, edges: (element: HTMLElement) => string | undefined, focused?: HTMLElement) {\n  if (!(list instanceof HTMLElement)) return;\n  const current = focused ?? list.querySelector(\".k2b-view-tabs__tab[aria-current=page]\");\n  if (current && current.getClientRects().length > 0 && list.scrollWidth - list.clientWidth > 1) {\n    const bounds = list.getBoundingClientRect();\n    const item = current.getBoundingClientRect();\n    const fade = edges(list);\n    const style = getComputedStyle(list);\n    const left = fade === \"top\" || fade === \"both\" ? parseFloat(style.scrollPaddingLeft) || 0 : 0;\n    const right = fade === \"bottom\" || fade === \"both\" ? parseFloat(style.scrollPaddingRight) || 0 : 0;\n    if (item.left < bounds.left + left || item.right > bounds.right - right) {\n      let offset = item.left - bounds.left - (bounds.width - item.width) / 2;\n      if (focused) {\n        // Reserve padding at the destination edge; native clamping drops it when that end is reached.\n        offset =\n          item.left < bounds.left + left\n            ? item.left - bounds.left - (parseFloat(style.scrollPaddingLeft) || 0)\n            : item.right - bounds.right + (parseFloat(style.scrollPaddingRight) || 0);\n      }\n      // Only the strip moves: scrollIntoView would also scroll the page. Instant keeps the first frame free of animation.\n      list.scrollTo({ left: list.scrollLeft + offset, behavior: \"instant\" });\n    }\n  }\n  const fade = edges(list);\n  if (fade) list.setAttribute(\"data-scroll-fade\", fade);\n  else list.removeAttribute(\"data-scroll-fade\");\n}\n\ntype WatchedViewTabs = HTMLElement & {\n  __k2bViewTabsWatch?: { resize: ResizeObserver; focus: (event: FocusEvent) => void; preferCurrent: boolean };\n};\n\n/** Also embedded, so it must not close over module state. */\nfunction watchViewTabs(list: WatchedViewTabs | null, settle: typeof settleViewTabs, edges: (element: HTMLElement) => string | undefined) {\n  if (!(list instanceof HTMLElement)) return;\n  // A DOM property survives hydration: one observer and focus listener per reused list.\n  let watch = list.__k2bViewTabsWatch;\n  if (!watch) {\n    const focus = (event: FocusEvent) => {\n      // Pointer focus must not move the target under the pointer.\n      if (watch && event.target instanceof HTMLElement && event.target.matches(\".k2b-view-tabs__tab:focus-visible\")) {\n        watch.preferCurrent = false;\n        settle(list, edges, event.target);\n      }\n    };\n    watch = {\n      resize: new ResizeObserver(() => {\n        const focused = document.activeElement;\n        if (\n          watch?.preferCurrent === false &&\n          focused instanceof HTMLElement &&\n          list.contains(focused) &&\n          focused.matches(\".k2b-view-tabs__tab:focus-visible\")\n        )\n          settle(list, edges, focused);\n        else settle(list, edges);\n      }),\n      focus,\n      preferCurrent: true,\n    };\n    Object.defineProperty(list, \"__k2bViewTabsWatch\", { value: watch, configurable: true });\n    list.addEventListener(\"focusin\", focus);\n  }\n  watch.preferCurrent = true;\n  const { resize } = watch;\n  resize.disconnect();\n  // Head actions parse after the views; settle again after their layout, before paint, and on later resizes.\n  resize.observe(list);\n  for (const child of Array.from(list.children)) resize.observe(child);\n  settle(list, edges);\n  return watch;\n}\nconst VIEW_TABS_SCRIPT = `(${watchViewTabs})(document.currentScript&&document.currentScript.previousElementSibling,${settleViewTabs},${scrollFadeEdges})`;\n\n/**\n * URL-backed object views. Every view is an ordinary document link, in the strip and under More, so reload, back,\n * and forward keep the view the URL names.\n */\nexport function ViewTabs(props: ViewTabsProps): JSX.Element {\n  const messages = useUiMessages();\n  const layout = createMemo(() => viewTabsLayout(props.items, props.current, props.max));\n  const stripItems = new Map<number, HTMLLIElement>();\n  let list: HTMLUListElement | undefined;\n  createScrollFade(\n    () => list,\n    () => true,\n  );\n  onMount(() => {\n    const watch = watchViewTabs(list ?? null, settleViewTabs, scrollFadeEdges);\n    let disposed = false;\n    // Later mount effects can invalidate WebKit's scroll layout after this\n    // initial settle. Finish once the mount task is complete, before its first\n    // frame; ResizeObserver alone runs too late for that frame.\n    queueMicrotask(() => {\n      if (!disposed && watch?.preferCurrent) settleViewTabs(list ?? null, scrollFadeEdges);\n    });\n    onCleanup(() => {\n      disposed = true;\n      watch?.resize.disconnect();\n      if (list && watch) {\n        list.removeEventListener(\"focusin\", watch.focus);\n        Reflect.deleteProperty(list, \"__k2bViewTabsWatch\");\n      }\n    });\n  });\n  // User effects run after Solid's render effects, including For and aria-current, in the same task.\n  createEffect(\n    on(\n      () => props.current,\n      () => watchViewTabs(list ?? null, settleViewTabs, scrollFadeEdges),\n      { defer: true },\n    ),\n  );\n  const [open, setOpen] = createSignal(false);\n  const [menuItems, setMenuItems] = createSignal<DropdownItem[]>([]);\n  const onOpenChange = (next: boolean) => {\n    if (next) {\n      setMenuItems(\n        props.items\n          .filter(\n            (item, index) =>\n              item.id !== props.current && (!layout().wide.includes(index) || stripItems.get(index)?.getClientRects().length === 0),\n          )\n          .map((item) => ({\n            href: item.href,\n            label: item.label,\n            icon: item.icon,\n            trailing: item.count !== undefined ? <span class=\"k2b-view-tabs__count\">{item.count}</span> : undefined,\n          })),\n      );\n    }\n    setOpen(next);\n  };\n  const tabContent = (item: ViewTab) => (\n    <>\n      <Show when={item.icon}>{(icon) => <i class={icon()} aria-hidden=\"true\" />}</Show>\n      <span class=\"k2b-view-tabs__label k2b-truncate-fade\">{item.label}</span>\n      <Show when={item.count !== undefined}>\n        <span class=\"k2b-view-tabs__count\">{item.count}</span>\n      </Show>\n    </>\n  );\n  return (\n    <nav class={`k2b-view-tabs ${props.class ?? \"\"}`} aria-label={props.label}>\n      <ul ref={list} class=\"k2b-view-tabs__list\" data-scroll-fade-mode=\"both\" data-scroll-fade-axis=\"horizontal\">\n        <For each={layout().wide}>\n          {(index) => {\n            const item = () => props.items[index]!;\n            onCleanup(() => stripItems.delete(index));\n            return (\n              <li\n                ref={(element) => stripItems.set(index, element)}\n                class=\"k2b-view-tabs__item\"\n                data-view-tab={item().id}\n                data-compact-hidden={!layout().compact.includes(index) ? \"\" : undefined}\n              >\n                <a class=\"k2b-view-tabs__tab\" href={item().href} aria-current={item().id === props.current ? \"page\" : undefined}>\n                  {tabContent(item())}\n                </a>\n              </li>\n            );\n          }}\n        </For>\n        <Show when={layout().compactHidden + layout().wideHidden > 0}>\n          <li class=\"k2b-view-tabs__more\" data-wide={layout().wideHidden > 0 ? \"\" : undefined}>\n            <Dropdown.Root items={menuItems()} open={open()} onOpenChange={onOpenChange} label={messages().moreViews}>\n              <Dropdown.Trigger appearance=\"plain\" class=\"k2b-view-tabs__tab k2b-view-tabs__more-trigger\" label={messages().moreViews}>\n                <span class=\"k2b-view-tabs__label\">{messages().more}</span>\n                <Show when={layout().wideHidden > 0}>\n                  <span class=\"k2b-view-tabs__more-count\" data-level=\"wide\">\n                    +{layout().wideHidden}\n                  </span>\n                </Show>\n                <Show when={layout().compactHidden > 0}>\n                  <span class=\"k2b-view-tabs__more-count\" data-level=\"compact\">\n                    +{layout().compactHidden}\n                  </span>\n                </Show>\n                <i class=\"ti ti-chevron-down\" aria-hidden=\"true\" />\n              </Dropdown.Trigger>\n            </Dropdown.Root>\n          </li>\n        </Show>\n      </ul>\n      <script innerHTML={VIEW_TABS_SCRIPT} />\n    </nav>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;AAAA,SAAS,YAAY,EAAE,UAAU,EAAE,YAAY,EAAE,GAAG,EAAY,EAAE,EAAE,SAAS,EAAE,OAAO,EAAE,IAAI,QAAQ,UAAU;AAC9G,SAAS,aAAa,QAAQ,kBAAkB;AAChD,SAAS,gBAAgB,EAAE,eAAe,QAAQ,uBAAuB;AACzE,OAAO,QAAQ,MAA6B,YAAY;AAcxD;AACA,OAAO,SAAS,cAAc,CAAC,KAAyB,EAAE,OAA2B,EAAE,GAAG,GAAG,CAAC,EAAE;EAC9F;EACA,MAAM,KAAK,GAAG,MAAM,CAAC,QAAQ,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC;EACrE,MAAM,YAAY,GAAG,KAAK,CAAC,SAAS,CAAE,IAAI,IAAK,IAAI,CAAC,EAAE,KAAK,OAAO,CAAC;EACnE,MAAM,OAAO,GAAI,IAAY,IAAK;IAChC,MAAM,OAAO,GAAG,KAAK,CAAC,KAAK,CAAC,CAAC,EAAE,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,KAAK,KAAK,CAAC;IAC7D,IAAI,YAAY,IAAI,IAAI,EAAE,OAAO,CAAC,OAAO,CAAC,MAAM,GAAG,CAAC,CAAC,GAAG,YAAY;IACpE,OAAO,OAAO;EAChB,CAAC;EACD,MAAM,IAAI,GAAG,OAAO,CAAC,KAAK,CAAC;EAC3B,MAAM,OAAO,GAAG,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;EAC3C,OAAO;IAAE,IAAI;IAAE,OAAO;IAAE,UAAU,EAAE,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC,MAAM;IAAE,aAAa,EAAE,KAAK,CAAC,MAAM,GAAG,OAAO,CAAC;EAAO,CAAC;AAChH;;AAEA;AACA,SAAS,cAAc,CAAC,IAAoB,EAAE,KAAmD,EAAE,OAAqB,EAAE;EACxH,IAAI,EAAE,IAAI,YAAY,WAAW,CAAC,EAAE;EACpC,MAAM,OAAO,GAAG,OAAO,IAAI,IAAI,CAAC,aAAa,CAAC,wCAAwC,CAAC;EACvF,IAAI,OAAO,IAAI,OAAO,CAAC,cAAc,CAAC,CAAC,CAAC,MAAM,GAAG,CAAC,IAAI,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,WAAW,GAAG,CAAC,EAAE;IAC7F,MAAM,MAAM,GAAG,IAAI,CAAC,qBAAqB,CAAC,CAAC;IAC3C,MAAM,IAAI,GAAG,OAAO,CAAC,qBAAqB,CAAC,CAAC;IAC5C,MAAM,IAAI,GAAG,KAAK,CAAC,IAAI,CAAC;IACxB,MAAM,KAAK,GAAG,gBAAgB,CAAC,IAAI,CAAC;IACpC,MAAM,IAAI,GAAG,IAAI,KAAK,KAAK,IAAI,IAAI,KAAK,MAAM,GAAG,UAAU,CAAC,KAAK,CAAC,iBAAiB,CAAC,IAAI,CAAC,GAAG,CAAC;IAC7F,MAAM,KAAK,GAAG,IAAI,KAAK,QAAQ,IAAI,IAAI,KAAK,MAAM,GAAG,UAAU,CAAC,KAAK,CAAC,kBAAkB,CAAC,IAAI,CAAC,GAAG,CAAC;IAClG,IAAI,IAAI,CAAC,IAAI,GAAG,MAAM,CAAC,IAAI,GAAG,IAAI,IAAI,IAAI,CAAC,KAAK,GAAG,MAAM,CAAC,KAAK,GAAG,KAAK,EAAE;MACvE,IAAI,MAAM,GAAG,IAAI,CAAC,IAAI,GAAG,MAAM,CAAC,IAAI,GAAG,CAAC,MAAM,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,IAAI,CAAC;MACtE,IAAI,OAAO,EAAE;QACX;QACA,MAAM,GACJ,IAAI,CAAC,IAAI,GAAG,MAAM,CAAC,IAAI,GAAG,IAAI,GAC1B,IAAI,CAAC,IAAI,GAAG,MAAM,CAAC,IAAI,IAAI,UAAU,CAAC,KAAK,CAAC,iBAAiB,CAAC,IAAI,CAAC,CAAC,GACpE,IAAI,CAAC,KAAK,GAAG,MAAM,CAAC,KAAK,IAAI,UAAU,CAAC,KAAK,CAAC,kBAAkB,CAAC,IAAI,CAAC,CAAC;MAC/E;MACA;MACA,IAAI,CAAC,QAAQ,CAAC;QAAE,IAAI,EAAE,IAAI,CAAC,UAAU,GAAG,MAAM;QAAE,QAAQ,EAAE;MAAU,CAAC,CAAC;IACxE;EACF;EACA,MAAM,IAAI,GAAG,KAAK,CAAC,IAAI,CAAC;EACxB,IAAI,IAAI,EAAE,IAAI,CAAC,YAAY,CAAC,kBAAkB,EAAE,IAAI,CAAC,CAAC,KACjD,IAAI,CAAC,eAAe,CAAC,kBAAkB,CAAC;AAC/C;AAMA;AACA,SAAS,aAAa,CAAC,IAA4B,EAAE,MAA6B,EAAE,KAAmD,EAAE;EACvI,IAAI,EAAE,IAAI,YAAY,WAAW,CAAC,EAAE;EACpC;EACA,IAAI,KAAK,GAAG,IAAI,CAAC,kBAAkB;EACnC,IAAI,CAAC,KAAK,EAAE;IACV,MAAM,KAAK,GAAI,KAAiB,IAAK;MACnC;MACA,IAAI,KAAK,IAAI,KAAK,CAAC,MAAM,YAAY,WAAW,IAAI,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,mCAAmC,CAAC,EAAE;QAC7G,KAAK,CAAC,aAAa,GAAG,KAAK;QAC3B,MAAM,CAAC,IAAI,EAAE,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC;MACnC;IACF,CAAC;IACD,KAAK,GAAG;MACN,MAAM,EAAE,IAAI,cAAc,CAAC,MAAM;QAC/B,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa;QACtC,IACE,KAAK,EAAE,aAAa,KAAK,KAAK,IAC9B,OAAO,YAAY,WAAW,IAC9B,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,IACtB,OAAO,CAAC,OAAO,CAAC,mCAAmC,CAAC,EAEpD,MAAM,CAAC,IAAI,EAAE,KAAK,EAAE,OAAO,CAAC,CAAC,KAC1B,MAAM,CAAC,IAAI,EAAE,KAAK,CAAC;MAC1B,CAAC,CAAC;MACF,KAAK;MACL,aAAa,EAAE;IACjB,CAAC;IACD,MAAM,CAAC,cAAc,CAAC,IAAI,EAAE,oBAAoB,EAAE;MAAE,KAAK,EAAE,KAAK;MAAE,YAAY,EAAE;IAAK,CAAC,CAAC;IACvF,IAAI,CAAC,gBAAgB,CAAC,SAAS,EAAE,KAAK,CAAC;EACzC;EACA,KAAK,CAAC,aAAa,GAAG,IAAI;EAC1B,MAAM;IAAE;EAAO,CAAC,GAAG,KAAK;EACxB,MAAM,CAAC,UAAU,CAAC,CAAC;EACnB;EACA,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC;EACpB,KAAK,MAAM,KAAK,IAAI,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC;EACpE,MAAM,CAAC,IAAI,EAAE,KAAK,CAAC;EACnB,OAAO,KAAK;AACd;AACA,MAAM,gBAAgB,GAAG,IAAI,aAAa,2EAA2E,cAAc,IAAI,eAAe,GAAG;;AAEzJ;AACA;AACA;AACA;AACA,OAAO,SAAS,QAAQ,CAAC,KAAoB,EAAe;EAC1D,MAAM,QAAQ,GAAG,aAAa,CAAC,CAAC;EAChC,MAAM,MAAM,GAAG,UAAU,CAAC,MAAM,cAAc,CAAC,KAAK,CAAC,KAAK,EAAE,KAAK,CAAC,OAAO,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC;EACtF,MAAM,UAAU,GAAG,IAAI,GAAG,CAAwB,CAAC;EACnD,IAAI,IAAkC;EACtC,gBAAgB,CACd,MAAM,IAAI,EACV,MAAM,IACR,CAAC;EACD,OAAO,CAAC,MAAM;IACZ,MAAM,KAAK,GAAG,aAAa,CAAC,IAAI,IAAI,IAAI,EAAE,cAAc,EAAE,eAAe,CAAC;IAC1E,IAAI,QAAQ,GAAG,KAAK;IACpB;IACA;IACA;IACA,cAAc,CAAC,MAAM;MACnB,IAAI,CAAC,QAAQ,IAAI,KAAK,EAAE,aAAa,EAAE,cAAc,CAAC,IAAI,IAAI,IAAI,EAAE,eAAe,CAAC;IACtF,CAAC,CAAC;IACF,SAAS,CAAC,MAAM;MACd,QAAQ,GAAG,IAAI;MACf,KAAK,EAAE,MAAM,CAAC,UAAU,CAAC,CAAC;MAC1B,IAAI,IAAI,IAAI,KAAK,EAAE;QACjB,IAAI,CAAC,mBAAmB,CAAC,SAAS,EAAE,KAAK,CAAC,KAAK,CAAC;QAChD,OAAO,CAAC,cAAc,CAAC,IAAI,EAAE,oBAAoB,CAAC;MACpD;IACF,CAAC,CAAC;EACJ,CAAC,CAAC;EACF;EACA,YAAY,CACV,EAAE,CACA,MAAM,KAAK,CAAC,OAAO,EACnB,MAAM,aAAa,CAAC,IAAI,IAAI,IAAI,EAAE,cAAc,EAAE,eAAe,CAAC,EAClE;IAAE,KAAK,EAAE;EAAK,CAChB,CACF,CAAC;EACD,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,YAAY,CAAC,KAAK,CAAC;EAC3C,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,YAAY,CAAiB,EAAE,CAAC;EAClE,MAAM,YAAY,GAAI,IAAa,IAAK;IACtC,IAAI,IAAI,EAAE;MACR,YAAY,CACV,KAAK,CAAC,KAAK,CACR,MAAM,CACL,CAAC,IAAI,EAAE,KAAK,KACV,IAAI,CAAC,EAAE,KAAK,KAAK,CAAC,OAAO,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,IAAI,UAAU,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE,cAAc,CAAC,CAAC,CAAC,MAAM,KAAK,CAAC,CACxH,CAAC,CACA,GAAG,CAAE,IAAI,KAAM;QACd,IAAI,EAAE,IAAI,CAAC,IAAI;QACf,KAAK,EAAE,IAAI,CAAC,KAAK;QACjB,IAAI,EAAE,IAAI,CAAC,IAAI;QACf,QAAQ,EAAE,IAAI,CAAC,KAAK,KAAK,SAAS,0BAAuC,IAAI,CAAC,KAAK,KAAW;MAChG,CAAC,CAAC,CACN,CAAC;IACH;IACA,OAAO,CAAC,IAAI,CAAC;EACf,CAAC;EACD,MAAM,UAAU,GAAI,IAAa,uBAE5B,IAAI;IAAA,IAAC,IAAI;MAAA,OAAE,IAAI,CAAC,IAAI;IAAA;IAAA,UAAI,IAAI,oDAAe,IAAI,CAAC,CAAC;EAAuB,4BACnB,IAAI,CAAC,KAAK,sBAC/D,IAAI;IAAA,IAAC,IAAI;MAAA,OAAE,IAAI,CAAC,KAAK,KAAK,SAAS;IAAA;IAAA;MAAA,8BACE,IAAI,CAAC,KAAK;IAAA;EAAA,GAGnD;EACD,sBACc,0BAAiB,KAAK,CAAC,KAAK,IAAI,EAAE,SAAE,wCAAc,KAAK,CAAC,KAAK,4CAEpE,GAAG;IAAA,IAAC,IAAI;MAAA,OAAE,MAAM,CAAC,CAAC,CAAC,IAAI;IAAA;IAAA,UACpB,KAAK,IAAK;MACV,MAAM,IAAI,GAAG,MAAM,KAAK,CAAC,KAAK,CAAC,KAAK,CAAE;MACtC,SAAS,CAAC,MAAM,UAAU,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;MACzC,+DAImB,IAAI,CAAC,CAAC,CAAC,EAAE,wDACH,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,GAAG,EAAE,YAAG,SAAS,iDAEnC,IAAI,CAAC,CAAC,CAAC,IAAI,iDAAgB,IAAI,CAAC,CAAC,CAAC,EAAE,KAAK,KAAK,CAAC,OAAO,GAAG,MAAM,YAAG,SAAS,0BAC5G,UAAU,CAAC,IAAI,CAAC,CAAC,CAAC;IAI3B;EAAC,gCAEF,IAAI;IAAA,IAAC,IAAI;MAAA,OAAE,MAAM,CAAC,CAAC,CAAC,aAAa,GAAG,MAAM,CAAC,CAAC,CAAC,UAAU,GAAG,CAAC;IAAA;IAAA;MAAA,kDACf,MAAM,CAAC,CAAC,CAAC,UAAU,GAAG,CAAC,GAAG,EAAE,YAAG,SAAS,4CAChF,QAAQ,CAAC,IAAI;QAAA,IAAC,KAAK;UAAA,OAAE,SAAS,CAAC,CAAC;QAAA;QAAA,IAAE,IAAI;UAAA,OAAE,IAAI,CAAC,CAAC;QAAA;QAAE,YAAY,EAAE,YAAY;QAAA,IAAE,KAAK;UAAA,OAAE,QAAQ,CAAC,CAAC,CAAC,SAAS;QAAA;QAAA;UAAA,yBACrG,QAAQ,CAAC,OAAO;YAAC,UAAU;YAAA;YAAA,IAAgE,KAAK;cAAA,OAAE,QAAQ,CAAC,CAAC,CAAC,SAAS;YAAA;YAAA;cAAA,gCACjF,QAAQ,CAAC,CAAC,CAAC,IAAI,sBAClD,IAAI;gBAAA,IAAC,IAAI;kBAAA,OAAE,MAAM,CAAC,CAAC,CAAC,UAAU,GAAG,CAAC;gBAAA;gBAAA;kBAAA,+BAE7B,MAAM,CAAC,CAAC,CAAC,UAAU;gBAAA;cAAA,sBAGxB,IAAI;gBAAA,IAAC,IAAI;kBAAA,OAAE,MAAM,CAAC,CAAC,CAAC,aAAa,GAAG,CAAC;gBAAA;gBAAA;kBAAA,+BAEhC,MAAM,CAAC,CAAC,CAAC,aAAa;gBAAA;cAAA;YAAA;UAAA;QAAA;MAAA;IAAA;EAAA,KASnB,gBAAgB;AAGzC","ignoreList":[]}
+{"version":3,"names":[],"sources":["actions/ViewTabs.tsx"],"sourcesContent":["import { createEffect, createMemo, createSignal, For, type JSX, on, onCleanup, onMount, Show } from \"solid-js\";\nimport { useUiMessages } from \"../intl/messages\";\nimport { createScrollFade, scrollFadeEdges } from \"../layout/scroll-fade\";\nimport Dropdown, { type DropdownItem } from \"./Dropdown\";\n\nexport type ViewTab = {\n  id: string;\n  label: string;\n  href: string;\n  icon?: string;\n  count?: number | string;\n  /** A short quiet label after the count, such as \"New\" for a view people have not opened yet. */\n  badge?: string;\n  /** Stays in the strip after More at every width, for a view of another kind than the ones that overflow. */\n  pinned?: boolean;\n};\nexport type ViewTabsProps = {\n  /** Accessible name of the navigation landmark, e.g. \"Views\". */\n  label: string;\n  items: readonly ViewTab[];\n  /** Id of the open view; the server reads it from `?view=`. Unknown ids select nothing. */\n  current: string | undefined;\n  /** At most this many views before More (default 5). */\n  max?: number;\n  /**\n   * The strip shows only the views that fit its room and counts the rest in More, instead of scrolling them. The open\n   * view and pinned views stay. Pair it with a larger `max` so a wide head shows more views.\n   */\n  fit?: boolean;\n  class?: string;\n};\n\n/** Two deterministic strip levels; only opening the menu reads CSS visibility. */\nexport function viewTabsLayout(items: readonly ViewTab[], current: string | undefined, max = 5) {\n  // At least one slot keeps the current view visible, including for an invalid limit.\n  const limit = Number.isFinite(max) ? Math.max(1, Math.floor(max)) : 5;\n  // Pinned views never overflow, so they take no slot.\n  const flowing = items.flatMap((item, index) => (item.pinned ? [] : [index]));\n  const pinned = items.flatMap((item, index) => (item.pinned ? [index] : []));\n  const currentIndex = items.findIndex((item) => item.id === current);\n  const currentPosition = flowing.indexOf(currentIndex);\n  const visible = (size: number) => {\n    const indices = flowing.slice(0, size);\n    if (currentPosition >= size) indices[indices.length - 1] = currentIndex;\n    return indices;\n  };\n  const wide = visible(limit);\n  const compact = visible(Math.min(limit, 3));\n  return { wide, compact, pinned, wideHidden: flowing.length - wide.length, compactHidden: flowing.length - compact.length };\n}\n\n/**\n * Self-contained: the server script embeds this before hydration. A fitting strip first keeps only the views that fit\n * its room and counts the rest in More; then the open or focused view scrolls into the strip.\n */\nfunction settleViewTabs(list: Element | null, edges: (element: HTMLElement) => string | undefined, focused?: HTMLElement) {\n  if (!(list instanceof HTMLElement)) return;\n  const more = list.querySelector<HTMLElement>(\":scope > .k2b-view-tabs__more\");\n  const fitCount = more?.querySelector<HTMLElement>('.k2b-view-tabs__more-count[data-level=\"fit\"]');\n  const flowing = Array.from(list.querySelectorAll<HTMLElement>(\":scope > .k2b-view-tabs__item:not([data-pinned])\"));\n\n  for (const item of flowing) item.removeAttribute(\"data-fit-hidden\");\n  more?.removeAttribute(\"data-fit\");\n  // The shown entries against the strip's inner room, whatever its scroll and padding.\n  const overflows = () => {\n    const boxes = Array.from(list.children)\n      .filter((child) => child instanceof HTMLElement && child.tagName === \"LI\" && child.getClientRects().length > 0)\n      .map((child) => child.getBoundingClientRect());\n    if (boxes.length === 0) return false;\n    const style = getComputedStyle(list);\n    const room = list.clientWidth - (parseFloat(style.paddingLeft) || 0) - (parseFloat(style.paddingRight) || 0);\n    return Math.max(...boxes.map((box) => box.right)) - Math.min(...boxes.map((box) => box.left)) > room + 0.5;\n  };\n  // The phone head row keeps its scrolling strip: its CSS turns fitting off.\n  const fits = list.hasAttribute(\"data-fit-room\") && getComputedStyle(list).getPropertyValue(\"--k2b-view-tabs-fit\").trim() !== \"none\";\n  if (fits && more && fitCount && overflows()) {\n    // Count from the level on screen: the compact strip already keeps fewer views than the wide one.\n    const compact = more.querySelector<HTMLElement>('.k2b-view-tabs__more-count[data-level=\"compact\"]');\n    const compactShown = Boolean(compact && getComputedStyle(compact).display !== \"none\");\n    const behind = Number(compactShown ? more.dataset.behindCompact : more.dataset.behindWide) || 0;\n    // The last views on screen leave first; the open view stays.\n    const candidates = flowing.filter((item) => item.getClientRects().length > 0 && !item.querySelector(\"[aria-current=page]\")).reverse();\n    more.setAttribute(\"data-fit\", \"\");\n    let hidden = 0;\n    for (const item of candidates) {\n      item.setAttribute(\"data-fit-hidden\", \"\");\n      hidden += 1;\n      fitCount.textContent = `+${behind + hidden}`;\n      if (!overflows()) break;\n    }\n    if (hidden === 0) more.removeAttribute(\"data-fit\");\n  }\n  const current = focused ?? list.querySelector(\".k2b-view-tabs__tab[aria-current=page]\");\n  if (current && current.getClientRects().length > 0 && list.scrollWidth - list.clientWidth > 1) {\n    const bounds = list.getBoundingClientRect();\n    const item = current.getBoundingClientRect();\n    const fade = edges(list);\n    const style = getComputedStyle(list);\n    const left = fade === \"top\" || fade === \"both\" ? parseFloat(style.scrollPaddingLeft) || 0 : 0;\n    const right = fade === \"bottom\" || fade === \"both\" ? parseFloat(style.scrollPaddingRight) || 0 : 0;\n    if (item.left < bounds.left + left || item.right > bounds.right - right) {\n      let offset = item.left - bounds.left - (bounds.width - item.width) / 2;\n      if (focused) {\n        // Reserve padding at the destination edge; native clamping drops it when that end is reached.\n        offset =\n          item.left < bounds.left + left\n            ? item.left - bounds.left - (parseFloat(style.scrollPaddingLeft) || 0)\n            : item.right - bounds.right + (parseFloat(style.scrollPaddingRight) || 0);\n      }\n      // Only the strip moves: scrollIntoView would also scroll the page. Instant keeps the first frame free of animation.\n      list.scrollTo({ left: list.scrollLeft + offset, behavior: \"instant\" });\n    }\n  }\n  const fade = edges(list);\n  if (fade) list.setAttribute(\"data-scroll-fade\", fade);\n  else list.removeAttribute(\"data-scroll-fade\");\n}\n\ntype WatchedViewTabs = HTMLElement & {\n  __k2bViewTabsWatch?: {\n    resize: ResizeObserver;\n    focus: (event: FocusEvent) => void;\n    preferCurrent: boolean;\n    connect: () => void;\n    /** Runs one fit in the next frame; calls before it runs share it. */\n    schedule: () => void;\n    frame: number;\n    /** The head lead's width and the widths of the shown entries when the last fit ended. */\n    room: string;\n    /** Fits again once web fonts finish loading: their metrics change every view's width, not the lead's. */\n    fonts: () => void;\n  };\n};\n\n/**\n * Also embedded, so it must not close over module state.\n *\n * A fitting strip converges by construction. It fits again only when the strip renders, web fonts finish loading, or\n * a notification finds another width of the head lead or of an entry that the last fit left shown. A fit only shows\n * and hides entries: the lead is an inline-size container that takes no width from the strip, and every entry keeps\n * its own width (`flex: none`), so the notifications a fit causes find the widths it ended with and stop there.\n */\nfunction watchViewTabs(list: WatchedViewTabs | null, settle: typeof settleViewTabs, edges: (element: HTMLElement) => string | undefined) {\n  if (!(list instanceof HTMLElement)) return;\n  const fits = list.hasAttribute(\"data-fit-room\");\n  const roomOf = () => list.closest<HTMLElement>(\".k2b-app-workspace__head-lead\");\n  // What a fit depends on: the lead's width and each shown entry's width, which fonts, icons and labels change.\n  const measured = () =>\n    [roomOf()?.clientWidth ?? -1, ...Array.from(list.children, (child) => child.getBoundingClientRect().width)].join(\" \");\n  // A DOM property survives hydration: one observer and focus listener per reused list.\n  let watch = list.__k2bViewTabsWatch;\n  if (!watch) {\n    const focus = (event: FocusEvent) => {\n      // Pointer focus must not move the target under the pointer.\n      if (watch && event.target instanceof HTMLElement && event.target.matches(\".k2b-view-tabs__tab:focus-visible\")) {\n        watch.preferCurrent = false;\n        settle(list, edges, event.target);\n      }\n    };\n    const settleNow = () => {\n      const focused = document.activeElement;\n      if (\n        watch?.preferCurrent === false &&\n        focused instanceof HTMLElement &&\n        list.contains(focused) &&\n        focused.matches(\".k2b-view-tabs__tab:focus-visible\")\n      )\n        settle(list, edges, focused);\n      else settle(list, edges);\n    };\n    // Head actions parse after the views; settle again after their layout, before paint, and on later resizes.\n    const connect = () => {\n      if (!watch) return;\n      watch.resize.disconnect();\n      watch.resize.observe(list);\n      for (const child of Array.from(list.children)) watch.resize.observe(child);\n      const room = roomOf();\n      if (fits && room) watch.resize.observe(room);\n    };\n    // Fitting resizes the strip and possibly the head, which other observers may watch. Inside a ResizeObserver\n    // callback that would leave their notifications undelivered, so a fit runs in the next frame, still before it paints.\n    const schedule = () => {\n      if (!watch || watch.frame) return;\n      watch.frame = requestAnimationFrame(() => {\n        if (!watch) return;\n        watch.frame = 0;\n        if (!list.isConnected) return;\n        settleNow();\n        watch.room = measured();\n      });\n    };\n    watch = {\n      resize: new ResizeObserver(() => {\n        // A scrolling strip only scrolls and settles at once.\n        if (!fits) return settleNow();\n        // Heights follow the fit, and hidden entries measure 0 by its own doing: only another measure counts.\n        if (watch && measured() !== watch.room) watch.schedule();\n      }),\n      focus,\n      preferCurrent: true,\n      connect,\n      schedule,\n      frame: 0,\n      room: \"\",\n      fonts: () => watch?.schedule(),\n    };\n    Object.defineProperty(list, \"__k2bViewTabsWatch\", { value: watch, configurable: true });\n    list.addEventListener(\"focusin\", focus);\n    // A first visit can paint before the web fonts load; the server frame and the client then fit the same metrics.\n    if (fits && document.fonts) {\n      document.fonts.addEventListener(\"loadingdone\", watch.fonts);\n      void document.fonts.ready.then(watch.fonts);\n    }\n  }\n  watch.preferCurrent = true;\n  watch.connect();\n  settle(list, edges);\n  if (fits) {\n    watch.room = measured();\n    // The head's actions parse after the views. A frame's animation callbacks run before its first layout and\n    // paint, so this fit also counts their room in the first frame.\n    watch.schedule();\n  }\n  return watch;\n}\nconst VIEW_TABS_SCRIPT = `(${watchViewTabs})(document.currentScript&&document.currentScript.previousElementSibling,${settleViewTabs},${scrollFadeEdges})`;\n\n/**\n * URL-backed object views. Every view is an ordinary document link, in the strip and under More, so reload, back,\n * and forward keep the view the URL names.\n */\nexport function ViewTabs(props: ViewTabsProps): JSX.Element {\n  const messages = useUiMessages();\n  const layout = createMemo(() => viewTabsLayout(props.items, props.current, props.max));\n  const stripItems = new Map<number, HTMLLIElement>();\n  let list: HTMLUListElement | undefined;\n  createScrollFade(\n    () => list,\n    () => true,\n  );\n  onMount(() => {\n    const watch = watchViewTabs(list ?? null, settleViewTabs, scrollFadeEdges);\n    let disposed = false;\n    // Later mount effects can invalidate WebKit's scroll layout after this\n    // initial settle. Finish once the mount task is complete, before its first\n    // frame; ResizeObserver alone runs too late for that frame.\n    queueMicrotask(() => {\n      if (!disposed && watch?.preferCurrent) settleViewTabs(list ?? null, scrollFadeEdges);\n    });\n    onCleanup(() => {\n      disposed = true;\n      watch?.resize.disconnect();\n      if (watch?.frame) cancelAnimationFrame(watch.frame);\n      if (watch) document.fonts?.removeEventListener(\"loadingdone\", watch.fonts);\n      if (list && watch) {\n        list.removeEventListener(\"focusin\", watch.focus);\n        Reflect.deleteProperty(list, \"__k2bViewTabsWatch\");\n      }\n    });\n  });\n  // User effects run after Solid's render effects, including For and aria-current, in the same task.\n  // What the strip shows: another open view, view, label, count or badge can change what fits. Equal content in a new\n  // array settles nothing again.\n  const shown = createMemo(() =>\n    [\n      props.current ?? \"\",\n      layout().wide.join(\",\"),\n      ...props.items.map((item) => `${item.id}\\u0000${item.label}\\u0000${item.count ?? \"\"}\\u0000${item.badge ?? \"\"}`),\n    ].join(\"\\u0001\"),\n  );\n  createEffect(on(shown, () => watchViewTabs(list ?? null, settleViewTabs, scrollFadeEdges), { defer: true }));\n  const [open, setOpen] = createSignal(false);\n  const [menuItems, setMenuItems] = createSignal<DropdownItem[]>([]);\n  const onOpenChange = (next: boolean) => {\n    if (next) {\n      setMenuItems(\n        props.items\n          .filter(\n            (item, index) =>\n              !item.pinned &&\n              item.id !== props.current &&\n              (!layout().wide.includes(index) || stripItems.get(index)?.getClientRects().length === 0),\n          )\n          .map((item) => ({\n            href: item.href,\n            label: item.label,\n            icon: item.icon,\n            trailing: item.count !== undefined ? <span class=\"k2b-view-tabs__count\">{item.count}</span> : undefined,\n          })),\n      );\n    }\n    setOpen(next);\n  };\n  const tabContent = (item: ViewTab) => (\n    <>\n      <Show when={item.icon}>{(icon) => <i class={icon()} aria-hidden=\"true\" />}</Show>\n      <span class=\"k2b-view-tabs__label k2b-truncate-fade\">{item.label}</span>\n      <Show when={item.count !== undefined}>\n        <span class=\"k2b-view-tabs__count\">{item.count}</span>\n      </Show>\n      <Show when={item.badge}>{(badge) => <span class=\"k2b-view-tabs__badge\">{badge()}</span>}</Show>\n    </>\n  );\n  const stripItem = (index: number) => {\n    const item = () => props.items[index]!;\n    onCleanup(() => stripItems.delete(index));\n    return (\n      <li\n        ref={(element) => stripItems.set(index, element)}\n        class=\"k2b-view-tabs__item\"\n        data-view-tab={item().id}\n        data-pinned={item().pinned ? \"\" : undefined}\n        data-compact-hidden={!item().pinned && !layout().compact.includes(index) ? \"\" : undefined}\n      >\n        <a class=\"k2b-view-tabs__tab\" href={item().href} aria-current={item().id === props.current ? \"page\" : undefined}>\n          {tabContent(item())}\n        </a>\n      </li>\n    );\n  };\n  return (\n    <nav class={`k2b-view-tabs ${props.class ?? \"\"}`} aria-label={props.label}>\n      <ul\n        ref={list}\n        class=\"k2b-view-tabs__list\"\n        data-scroll-fade-mode=\"both\"\n        data-scroll-fade-axis=\"horizontal\"\n        data-fit-room={props.fit ? \"\" : undefined}\n      >\n        <For each={layout().wide}>{stripItem}</For>\n        {/* A fitting strip keeps More ready, hidden until a view leaves the strip. */}\n        <Show when={layout().compactHidden + layout().wideHidden > 0 || (props.fit && layout().wide.length > 1)}>\n          <li\n            class=\"k2b-view-tabs__more\"\n            data-wide={layout().wideHidden > 0 ? \"\" : undefined}\n            data-behind-wide={layout().wideHidden}\n            data-behind-compact={layout().compactHidden}\n          >\n            <Dropdown.Root items={menuItems()} open={open()} onOpenChange={onOpenChange} label={messages().moreViews}>\n              <Dropdown.Trigger appearance=\"plain\" class=\"k2b-view-tabs__tab k2b-view-tabs__more-trigger\" label={messages().moreViews}>\n                <span class=\"k2b-view-tabs__label\">{messages().more}</span>\n                <Show when={layout().wideHidden > 0}>\n                  <span class=\"k2b-view-tabs__more-count\" data-level=\"wide\">\n                    +{layout().wideHidden}\n                  </span>\n                </Show>\n                <Show when={layout().compactHidden > 0}>\n                  <span class=\"k2b-view-tabs__more-count\" data-level=\"compact\">\n                    +{layout().compactHidden}\n                  </span>\n                </Show>\n                {/* Written by the strip's fit, never by the render, so a rerender keeps the count it measured. */}\n                <span class=\"k2b-view-tabs__more-count\" data-level=\"fit\" />\n                <i class=\"ti ti-chevron-down\" aria-hidden=\"true\" />\n              </Dropdown.Trigger>\n            </Dropdown.Root>\n          </li>\n        </Show>\n        <For each={layout().pinned}>{stripItem}</For>\n      </ul>\n      <script innerHTML={VIEW_TABS_SCRIPT} />\n    </nav>\n  );\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/ssr/content/FileGrid.js

@@ -11,17 +11,19 @@ var _tmpl$ = ["<div class=\"", "\"", " role=\"grid\"", ">", "</div>"],
   _tmpl$4 = ["<div class=\"k2b-file-grid__meta\">", "</div>"],
   _tmpl$5 = ["<div class=\"k2b-file-grid__actions\">", "</div>"],
   _tmpl$6 = ["<div role=\"row\" class=\"k2b-file-grid__row\">", "</div>"],
-  _tmpl$7 = ["<div class=\"", "\"", " data-open-items=\"true\" role=\"list\"", ">", "</div>"],
-  _tmpl$8 = ["<button type=\"button\" class=\"k2b-file-grid__open\" aria-labelledby=\"", "\"", "></button>"],
-  _tmpl$9 = ["<div class=\"k2b-file-grid__name\" id=\"", "\">", "</div>"],
-  _tmpl$0 = ["<div class=\"k2b-file-grid__meta\" id=\"", "\">", "</div>"],
-  _tmpl$1 = ["<div role=\"listitem\" class=\"k2b-file-grid__row\">", "</div>"],
-  _tmpl$10 = ["<div class=\"k2b-file-grid-stack__toolbar\">", "</div>"],
-  _tmpl$11 = ["<button type=\"button\" class=\"k2b-file-grid-stack__more\" aria-expanded=\"true\"><span>", "</span><i class=\"ti ti-chevron-up\" aria-hidden=\"true\"></i></button>"],
-  _tmpl$12 = ["<div class=\"k2b-file-grid-stack\"", ">", "", "", "</div>"],
-  _tmpl$13 = ["<div class=\"k2b-file-grid-stack__group\"><div class=\"k2b-file-grid-stack__label\"", ">", "<span class=\"k2b-file-grid-stack__count\">", "</span></div>", "</div>"],
-  _tmpl$14 = ["<span class=\"k2b-file-grid-stack__more-meta\">", "</span>"],
-  _tmpl$15 = ["<button type=\"button\" class=\"k2b-file-grid-stack__more\" aria-expanded=\"false\"><span>", "</span><i class=\"ti ti-chevron-down\" aria-hidden=\"true\"></i>", "</button>"];
+  _tmpl$7 = ["<span class=\"k2b-file-grid__check-box\"", "><i class=\"ti ti-check\"></i></span>"],
+  _tmpl$8 = ["<span class=\"k2b-file-grid__check\" aria-hidden=\"true\">", "</span>"],
+  _tmpl$9 = ["<div class=\"", "\"", " data-open-items=\"true\" role=\"list\"", ">", "</div>"],
+  _tmpl$0 = ["<button type=\"button\" class=\"k2b-file-grid__open\" aria-labelledby=\"", "\"", "></button>"],
+  _tmpl$1 = ["<div class=\"k2b-file-grid__name\" id=\"", "\">", "</div>"],
+  _tmpl$10 = ["<div class=\"k2b-file-grid__meta\" id=\"", "\">", "</div>"],
+  _tmpl$11 = ["<div role=\"listitem\" class=\"k2b-file-grid__row\">", "</div>"],
+  _tmpl$12 = ["<div class=\"k2b-file-grid-stack__toolbar\">", "</div>"],
+  _tmpl$13 = ["<button type=\"button\" class=\"k2b-file-grid-stack__more\" aria-expanded=\"true\"><span>", "</span><i class=\"ti ti-chevron-up\" aria-hidden=\"true\"></i></button>"],
+  _tmpl$14 = ["<div class=\"k2b-file-grid-stack\"", ">", "", "", "</div>"],
+  _tmpl$15 = ["<div class=\"k2b-file-grid-stack__group\"><div class=\"k2b-file-grid-stack__label\"", ">", "<span class=\"k2b-file-grid-stack__count\">", "</span></div>", "</div>"],
+  _tmpl$16 = ["<span class=\"k2b-file-grid-stack__more-meta\">", "</span>"],
+  _tmpl$17 = ["<button type=\"button\" class=\"k2b-file-grid-stack__more\" aria-expanded=\"false\"><span>", "</span><i class=\"ti ti-chevron-down\" aria-hidden=\"true\"></i>", "</button>"];
 import { createEffect, createMemo, createSignal, createUniqueId, For, Index, on, Show } from "solid-js";
 import { useFileListMessages } from "./file-list-messages";
 
@@ -61,7 +63,7 @@ function SelectableFileGrid(props) {
   };
   const columns = () => grid ? Math.max(1, getComputedStyle(grid).gridTemplateColumns.split(" ").length) : 1;
   const nested = event => event.target instanceof Element && !!event.target.closest("button,a,input,label,select,textarea,summary,[contenteditable],[role=button],[role=menu]");
-  return _$ssr(_tmpl$, `k2b-file-grid ${_$escape(props.class ?? "", true)}`, _$ssrAttribute("data-size", _$escape(props.size ?? "md", true), false) + _$ssrAttribute("data-layout", _$escape(props.layout ?? "grid", true), false) + _$ssrAttribute("data-action-visibility", _$escape(props.actionVisibility ?? "always", true), false), _$ssrAttribute("aria-label", _$escape(props.label, true), false) + _$ssrAttribute("aria-multiselectable", _$escape(props.selection.multiple, true), false), _$escape(_$createComponent(For, {
+  return _$ssr(_tmpl$, `k2b-file-grid ${_$escape(props.class ?? "", true)}`, _$ssrAttribute("data-size", _$escape(props.size ?? "md", true), false) + _$ssrAttribute("data-layout", _$escape(props.layout ?? "grid", true), false) + _$ssrAttribute("data-action-visibility", _$escape(props.actionVisibility ?? "always", true), false) + _$ssrAttribute("data-checks", props.checks ? "true" : _$escape(undefined, true), false), _$ssrAttribute("aria-label", _$escape(props.label, true), false) + _$ssrAttribute("aria-multiselectable", _$escape(props.selection.multiple, true), false), _$escape(_$createComponent(For, {
     get each() {
       return props.rows;
     },
@@ -80,7 +82,19 @@ function SelectableFileGrid(props) {
         get tabIndex() {
           return props.selection.focused() === id() ? 0 : -1;
         }
-      }), [_$ssr(_tmpl$2, _$escape(props.renderPreview(row))), _$ssr(_tmpl$3, _$escape(props.renderLabel(row))), _$ssr(_tmpl$4, _$escape(props.renderMeta?.(row))), _$ssr(_tmpl$5, _$escape(props.renderActions?.(row)))], false));
+      }), [_$escape(_$createComponent(Show, {
+        get when() {
+          return props.checks;
+        },
+        children: checks => _$ssr(_tmpl$8, _$escape(_$createComponent(Show, {
+          get when() {
+            return checks()(row);
+          },
+          get children() {
+            return _$ssr(_tmpl$7, _$ssrAttribute("data-shape", props.selection.multiple ? "box" : "circle", false));
+          }
+        })))
+      })), _$ssr(_tmpl$2, _$escape(props.renderPreview(row))), _$ssr(_tmpl$3, _$escape(props.renderLabel(row))), _$ssr(_tmpl$4, _$escape(props.renderMeta?.(row))), _$ssr(_tmpl$5, _$escape(props.renderActions?.(row)))], false));
     }
   })));
 }
@@ -112,23 +126,23 @@ function OpenFileGrid(props) {
     label: undefined,
     rows: full() || !limited() ? props.rows : props.rows.slice(0, props.limit)
   }]);
-  const list = (group, labelId) => _$ssr(_tmpl$7, `k2b-file-grid ${_$escape(props.class ?? "", true)}`, _$ssrAttribute("data-size", _$escape(props.size ?? "md", true), false) + _$ssrAttribute("data-layout", group().layout === "tiles" ? "tiles" : _$escape(props.layout ?? "grid", true), false) + _$ssrAttribute("data-action-visibility", _$escape(props.actionVisibility ?? "always", true), false), _$ssrAttribute("aria-label", labelId ? _$escape(undefined, true) : _$escape(props.label, true), false) + _$ssrAttribute("aria-labelledby", _$escape(labelId, true), false), _$escape(_$createComponent(For, {
+  const list = (group, labelId) => _$ssr(_tmpl$9, `k2b-file-grid ${_$escape(props.class ?? "", true)}`, _$ssrAttribute("data-size", _$escape(props.size ?? "md", true), false) + _$ssrAttribute("data-layout", group().layout === "tiles" ? "tiles" : _$escape(props.layout ?? "grid", true), false) + _$ssrAttribute("data-action-visibility", _$escape(props.actionVisibility ?? "always", true), false), _$ssrAttribute("aria-label", labelId ? _$escape(undefined, true) : _$escape(props.label, true), false) + _$ssrAttribute("aria-labelledby", _$escape(labelId, true), false), _$escape(_$createComponent(For, {
     get each() {
       return group().rows;
     },
     children: row => {
       const id = `k2b-file-grid-${createUniqueId()}`;
-      return _$ssr(_tmpl$1, _$ssrElement("div", _$mergeProps(() => props.itemProps?.(row), {
+      return _$ssr(_tmpl$11, _$ssrElement("div", _$mergeProps(() => props.itemProps?.(row), {
         "class": "k2b-file-grid__item"
-      }), [_$ssr(_tmpl$8, `${_$escape(id, true)}-name`, _$ssrAttribute("aria-describedby", props.renderMeta ? `${_$escape(id, true)}-meta` : _$escape(undefined, true), false)), _$ssr(_tmpl$2, _$escape(props.renderPreview(row))), _$ssr(_tmpl$9, `${_$escape(id, true)}-name`, _$escape(props.renderLabel(row))), _$ssr(_tmpl$0, `${_$escape(id, true)}-meta`, _$escape(props.renderMeta?.(row))), _$ssr(_tmpl$5, _$escape(props.renderActions?.(row)))], false));
+      }), [_$ssr(_tmpl$0, `${_$escape(id, true)}-name`, _$ssrAttribute("aria-describedby", props.renderMeta ? `${_$escape(id, true)}-meta` : _$escape(undefined, true), false)), _$ssr(_tmpl$2, _$escape(props.renderPreview(row))), _$ssr(_tmpl$1, `${_$escape(id, true)}-name`, _$escape(props.renderLabel(row))), _$ssr(_tmpl$10, `${_$escape(id, true)}-meta`, _$escape(props.renderMeta?.(row))), _$ssr(_tmpl$5, _$escape(props.renderActions?.(row)))], false));
     }
   })));
-  return _$ssr(_tmpl$12, _$ssrAttribute("data-expanded", full() ? "true" : _$escape(undefined, true), false), _$escape(_$createComponent(Show, {
+  return _$ssr(_tmpl$14, _$ssrAttribute("data-expanded", full() ? "true" : _$escape(undefined, true), false), _$escape(_$createComponent(Show, {
     get when() {
       return _$memo(() => !!full())() && props.toolbar;
     },
     get children() {
-      return _$ssr(_tmpl$10, _$escape(props.toolbar));
+      return _$ssr(_tmpl$12, _$escape(props.toolbar));
     }
   })), _$escape(_$createComponent(Index, {
     get each() {
@@ -144,7 +158,7 @@ function OpenFileGrid(props) {
           return list(group);
         },
         get children() {
-          return _$ssr(_tmpl$13, _$ssrAttribute("id", _$escape(labelId, true), false), _$escape(group().label), _$escape(group().rows.length), _$escape(list(group, labelId)));
+          return _$ssr(_tmpl$15, _$ssrAttribute("id", _$escape(labelId, true), false), _$escape(group().label), _$escape(group().rows.length), _$escape(list(group, labelId)));
         }
       });
     }
@@ -158,19 +172,19 @@ function OpenFileGrid(props) {
           return full();
         },
         get fallback() {
-          return _$ssr(_tmpl$15, _$escape(messages().showAll({
+          return _$ssr(_tmpl$17, _$escape(messages().showAll({
             count: props.rows.length
           })), _$escape(_$createComponent(Show, {
             get when() {
               return props.moreMeta;
             },
             get children() {
-              return _$ssr(_tmpl$14, _$escape(props.moreMeta));
+              return _$ssr(_tmpl$16, _$escape(props.moreMeta));
             }
           })));
         },
         get children() {
-          return _$ssr(_tmpl$11, _$escape(messages().showLess));
+          return _$ssr(_tmpl$13, _$escape(messages().showLess));
         }
       });
     }