@leavepulse/ui 0.94.1 → 0.95.0

package/dist/components/LpTable.vue.js

@@ -1,7 +1,7 @@
 import { defineComponent, computed, useAttrs, ref, shallowRef, watch, onMounted, useSlots, onBeforeUnmount, useId, h, openBlock, createElementBlock, normalizeClass, createVNode, withCtx, renderSlot, createCommentVNode, createBlock, createTextVNode, toDisplayString, Fragment, renderList, createElementVNode, Transition, mergeProps, normalizeStyle, withModifiers, TransitionGroup, unref, nextTick } from "vue";
 import { usePaletteScope, suppressPaletteDiscovery, usePaletteCommands } from "../composables/usePaletteCommands.js";
 import { menuPaletteCommands } from "./commandPalette.js";
-import { _ as _sfc_main$1 } from "../chunks/LpDataList-B56Gu6Yt.js";
+import { _ as _sfc_main$1 } from "../chunks/LpDataList-Cit9fOSp.js";
 import { _ as _sfc_main$d } from "../chunks/LpCheckbox-C9VnPIQf.js";
 import { _ as _sfc_main$c } from "../chunks/LpContextMenu-DEFirphS.js";
 import { _ as _sfc_main$g } from "../chunks/LpEditable-DfRUAGkA.js";
@@ -11,7 +11,7 @@ import { _ as _sfc_main$5 } from "../chunks/LpIcon-CxHFPwKt.js";
 import { _ as _sfc_main$e } from "../chunks/LpSkeleton-leTl53V9.js";
 import { _ as _sfc_main$h } from "../chunks/LpPagination-DGLntZJN.js";
 import { _ as _sfc_main$6 } from "../chunks/LpPopover-w2rr4x7n.js";
-import { _ as _sfc_main$b } from "../chunks/LpScrollArea-CqvwfZs2.js";
+import { _ as _sfc_main$b } from "../chunks/LpScrollArea-B_1KZOSS.js";
 import { _ as _sfc_main$9 } from "../chunks/LpRollingText-B54Pje7P.js";
 import { _ as _sfc_main$2 } from "../chunks/LpShift-DAgS_d2x.js";
 import { _ as _sfc_main$7 } from "../chunks/LpTableFilter-CILHffC1.js";
@@ -25,16 +25,17 @@ import { usePaintSelect } from "../composables/usePaintSelect.js";
 import { useRovingFocus } from "../composables/useRovingFocus.js";
 import { useLabels } from "../composables/useLpConfig.js";
 import { useResizeObserver } from "../composables/useResizeObserver.js";
-import { orderPinned, pinOffsets, groupRows, rowWindow, presetHidden, sortByKeys, nextSorts, clampColumnWidth } from "./tableFeatures.js";
+import { orderPinned, pinOffsets, groupRows, rowWindow, rowChanges, presetHidden, sortByKeys, nextSorts, clampColumnWidth } from "./tableFeatures.js";
 import { devWarn } from "../composables/devWarn.js";
 import { startPointerDrag } from "../composables/pointerDrag.js";
-import { isHTMLElement, nodeWindow } from "../composables/realm.js";
+import { nodeWindow, isHTMLElement } from "../composables/realm.js";
+import { prefersReducedMotion } from "../composables/easing.js";
 import { _ as _sfc_main$4 } from "../chunks/LpButton-BvVoF-PO.js";
 import { toCsv, downloadFile, fileStem } from "./exportData.js";
 import { toHiddenSets, sameHidden, summarizeShown, parseTableState, mergeRestored, serializeTableState, fromHiddenSets } from "./tableFilter.js";
 import { resolveRowMenu } from "./tableRowMenu.js";
 import { _ as _export_sfc } from "../chunks/_plugin-vue_export-helper-1tPrXgE0.js";
-import '../assets/LpTable-DxnthVz4.css';const _hoisted_1 = {
+import '../assets/LpTable-BJjNEvgJ.css';const _hoisted_1 = {
   key: 0,
   class: "flex min-h-8 flex-wrap items-center gap-x-3 gap-y-2 pb-3 text-xs"
 };
@@ -1044,6 +1045,29 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         emit("rowClick", row);
       }
     });
+    const ROW_MOTION_LIMIT = 12;
+    const rowsEl = shallowRef(null);
+    function setRowsEl(el) {
+      const node = el?.$el ?? null;
+      rowsEl.value = node;
+      roving.setContainer(node);
+    }
+    const motionIds = computed(() => (headerless.value ? allEntries.value : viewEntries.value).map((entry) => entry.id));
+    let shownIds = [];
+    const bigSwap = computed(() => rowChanges(shownIds, motionIds.value) > ROW_MOTION_LIMIT);
+    let settleFlip = false;
+    watch(
+      motionIds,
+      (ids) => {
+        const eased = bigSwap.value && shownIds.length > 0 && ids.length > 0;
+        shownIds = ids;
+        const body = rowsEl.value;
+        if (!eased || !body || props.virtualRowHeight || prefersReducedMotion(nodeWindow(body))) return;
+        settleFlip = !settleFlip;
+        body.dataset.lpSettle = settleFlip ? "a" : "b";
+      },
+      { flush: "post", immediate: true }
+    );
     function onRowKeydown(event) {
       if (event.key === " " && props.selectable && roving.activeId.value) {
         event.preventDefault();
@@ -1437,10 +1461,11 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                       createVNode(TransitionGroup, {
                         tag: "tbody",
                         name: "lp-row",
-                        css: animating.value && !__props.virtualRowHeight,
+                        css: animating.value && !__props.virtualRowHeight && !bigSwap.value,
+                        "move-class": bigSwap.value ? "lp-row-still" : void 0,
                         class: normalizeClass(busy.value && displayRows.value.length ? "opacity-60 transition-opacity" : "transition-opacity"),
                         "aria-busy": busy.value || void 0,
-                        ref: (el) => unref(roving).setContainer(el?.$el ?? null)
+                        ref: setRowsEl
                       }, {
                         default: withCtx(() => [
                           displayRows.value.length === 0 && busy.value ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(__props.skeletonRows, (n) => {
@@ -1647,7 +1672,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                           ])) : createCommentVNode("", true)
                         ]),
                         _: 3
-                      }, 8, ["css", "class", "aria-busy"])
+                      }, 8, ["css", "move-class", "class", "aria-busy"])
                     ], 14, _hoisted_11)
                   ]),
                   _: 3
@@ -1669,7 +1694,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                   key: activeLayout.value,
                   tag: "div",
                   name: "lp-row",
-                  css: animating.value
+                  css: animating.value && !bigSwap.value,
+                  "move-class": bigSwap.value ? "lp-row-still" : void 0
                 }, scrollAttrs.value, {
                   class: ["min-h-0 transition-opacity", [
                     busy.value && displayRows.value.length ? "opacity-60" : "",
@@ -1677,7 +1703,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                   ]],
                   style: activeLayout.value === "cards" ? { gridTemplateColumns: `repeat(auto-fill, minmax(min(${__props.cardWidth}, 100%), 1fr))` } : void 0,
                   "aria-busy": busy.value || void 0,
-                  ref: (el) => unref(roving).setContainer(el?.$el ?? null)
+                  ref: setRowsEl
                 }), {
                   default: withCtx(() => [
                     displayRows.value.length === 0 && busy.value ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(__props.skeletonRows, (n) => {
@@ -1896,7 +1922,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                     }), 128))
                   ]),
                   _: 3
-                }, 16, ["css", "class", "style", "aria-busy"]))
+                }, 16, ["css", "move-class", "class", "style", "aria-busy"]))
               ]),
               _: 3
             }, 8, ["items", "no-hint", "title", "subtitle", "title-icon", "title-image"]))
@@ -1915,7 +1941,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const LpTable = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-a346ca36"]]);
+const LpTable = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-a366adee"]]);
 export {
   LpTable as default
 };

package/dist/components/LpThemeStudio.vue.js

@@ -1,4 +1,4 @@
-import { _ as _sfc_main } from "../chunks/LpThemeStudio-BPPctXgd.js";
+import { _ as _sfc_main } from "../chunks/LpThemeStudio-yiEdFJQL.js";
 export {
   _sfc_main as default
 };

package/dist/components/LpThemeSwitcher.vue.js

@@ -1,4 +1,4 @@
-import { _ as _sfc_main } from "../chunks/LpThemeSwitcher-B3c44xFH.js";
+import { _ as _sfc_main } from "../chunks/LpThemeSwitcher-DKkCFaFk.js";
 export {
   _sfc_main as default
 };

package/dist/components/LpToaster.vue.js

@@ -1,4 +1,4 @@
-import { _ as _sfc_main } from "../chunks/LpToaster-Cdx1tnHB.js";
+import { _ as _sfc_main } from "../chunks/LpToaster-C7hHkGOA.js";
 export {
   _sfc_main as default
 };

package/dist/components/LpTooltip.vue.d.ts

@@ -46,11 +46,11 @@ type __VLS_Props = {
      */
     touch?: "hold" | "none";
 };
-declare var __VLS_24: {}, __VLS_41: {};
+declare var __VLS_9: {}, __VLS_50: {};
 type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_24) => any;
+    default?: (props: typeof __VLS_9) => any;
 } & {
-    content?: (props: typeof __VLS_41) => any;
+    content?: (props: typeof __VLS_50) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
     touch: "hold" | "none";

package/dist/components/LpTooltip.vue.js

@@ -1,4 +1,4 @@
-import { _ as _sfc_main } from "../chunks/LpTooltip-BKde8Xjv.js";
+import { _ as _sfc_main } from "../chunks/LpTooltip-Bt1ZFViJ.js";
 export {
   _sfc_main as default
 };

package/dist/components/LpTruncate.vue.js

@@ -1,4 +1,4 @@
-import { _ as _sfc_main } from "../chunks/LpTruncate-C_C8eiIE.js";
+import { _ as _sfc_main } from "../chunks/LpTruncate-DEHWL1OA.js";
 export {
   _sfc_main as default
 };

package/dist/components/LpUptimeBar.vue.js

@@ -1,4 +1,4 @@
-import { _ as _sfc_main } from "../chunks/LpUptimeBar-Dt6SY_-m.js";
+import { _ as _sfc_main } from "../chunks/LpUptimeBar-CXgzU5ym.js";
 export {
   _sfc_main as default
 };

package/dist/components/LpWorkspaceSwitcher.vue.js

@@ -1,4 +1,4 @@
-import { _ as _sfc_main } from "../chunks/LpWorkspaceSwitcher-DCIiOQt_.js";
+import { _ as _sfc_main } from "../chunks/LpWorkspaceSwitcher-CrUVSI7x.js";
 export {
   _sfc_main as default
 };

package/dist/components/RevealToggle.vue.js

@@ -1,4 +1,4 @@
-import { _ as _sfc_main } from "../chunks/RevealToggle-BsYxY6Oz.js";
+import { _ as _sfc_main } from "../chunks/RevealToggle-D9Vs88kM.js";
 export {
   _sfc_main as default
 };

package/dist/components/tableFeatures.d.ts

@@ -65,3 +65,4 @@ export declare function presetHidden(preset: Pick<ColumnPreset, "columns">, colu
  * - `list`: one compact line per row with no header, for narrow places.
  */
 export type TableLayout = "table" | "cards" | "list";
+export declare function rowChanges(before: readonly string[], after: readonly string[]): number;

package/dist/components/tableFeatures.js

@@ -74,6 +74,30 @@ function presetHidden(preset, columns) {
   const hidden = columns.filter((c) => !c.alwaysVisible && !shown.has(c.key)).map((c) => c.key);
   return hidden.length === columns.length ? /* @__PURE__ */ new Set() : new Set(hidden);
 }
+function rowChanges(before, after) {
+  const old = /* @__PURE__ */ new Map();
+  before.forEach((id, i) => old.set(id, i));
+  let entered = 0;
+  const kept = [];
+  for (const id of after) {
+    const at = old.get(id);
+    if (at === void 0) entered++;
+    else kept.push(at);
+  }
+  const left = before.length - kept.length;
+  const tails = [];
+  for (const at of kept) {
+    let lo = 0;
+    let hi = tails.length;
+    while (lo < hi) {
+      const mid = lo + hi >> 1;
+      if (tails[mid] < at) lo = mid + 1;
+      else hi = mid;
+    }
+    tails[lo] = at;
+  }
+  return entered + left + (kept.length - tails.length);
+}
 export {
   MIN_COLUMN_PX,
   clampColumnWidth,
@@ -82,6 +106,7 @@ export {
   orderPinned,
   pinOffsets,
   presetHidden,
+  rowChanges,
   rowWindow,
   sortByKeys
 };

package/dist/composables/useShift.js

@@ -1,6 +1,23 @@
 import { ref, watch, toValue, onBeforeUnmount, nextTick } from "vue";
 import { nodeWindow, isElement } from "./realm.js";
 import { prefersReducedMotion } from "./easing.js";
+const firstReads = /* @__PURE__ */ new Map();
+function firstRead(win, pass) {
+  let queue = firstReads.get(win);
+  if (!queue) {
+    const batch2 = /* @__PURE__ */ new Set();
+    queue = batch2;
+    firstReads.set(win, batch2);
+    win.requestAnimationFrame(() => {
+      firstReads.delete(win);
+      for (const p of batch2) p.read();
+      for (const p of batch2) p.write();
+    });
+  }
+  queue.add(pass);
+  const batch = queue;
+  return () => batch.delete(pass);
+}
 const TWEEN_MS = 160;
 const RETARGET_AFTER_MS = 40;
 function useShift(options = {}) {
@@ -9,7 +26,7 @@ function useShift(options = {}) {
   const resizing = ref(false);
   let ro;
   let mo;
-  let raf = 0;
+  let cancelFirstRead;
   let settleTimer;
   let lastHeight = 0;
   let lastWidth = 0;
@@ -95,7 +112,8 @@ function useShift(options = {}) {
     mo?.disconnect();
     ro = void 0;
     mo = void 0;
-    cancelAnimationFrame(raf);
+    cancelFirstRead?.();
+    cancelFirstRead = void 0;
     clearTimeout(settleTimer);
     tweening.value = false;
     resizing.value = false;
@@ -109,17 +127,16 @@ function useShift(options = {}) {
     ([node, enabled]) => {
       teardown();
       if (!enabled || !node) return;
-      lastHeight = node.offsetHeight;
-      lastWidth = node.offsetWidth;
-      laidOut = node.getClientRects().length > 0;
       scrollHost = node;
       node.addEventListener("scroll", rememberScroll, { capture: true, passive: true });
-      if (wantsHeight()) node.style.height = `${lastHeight}px`;
-      if (wantsWidth()) node.style.width = `${lastWidth}px`;
-      raf = requestAnimationFrame(() => {
-        tweening.value = true;
-        if (wantsHeight()) node.style.height = "";
-        if (wantsWidth()) node.style.width = "";
+      cancelFirstRead = firstRead(nodeWindow(node), {
+        read: () => {
+          if (inFlight) return;
+          lastHeight = node.offsetHeight;
+          lastWidth = node.offsetWidth;
+          laidOut = node.getClientRects().length > 0;
+        },
+        write: () => tweening.value = true
       });
       const watchChildren = () => {
         if (!ro) return;

package/dist/index.js

@@ -1,10 +1,10 @@
 import { _ } from "./chunks/LayoutCanvas-j4TZqx1A.js";
-import { _ as _2 } from "./chunks/LpAddressInput-BCqR0zmv.js";
+import { _ as _2 } from "./chunks/LpAddressInput-C5VIgRp0.js";
 import { _ as _3 } from "./chunks/LpMapPicker-V0Lybi10.js";
 import { OSM_TILES, createNominatimProvider, emptyAddress, formatAddress, project, tileUrl, unproject } from "./components/address.js";
 import { _ as _4 } from "./chunks/LpActionBar-43WHmTsM.js";
 import { _ as _5 } from "./chunks/LpAlert-Q0h7Gucu.js";
-import { _ as _6 } from "./chunks/LpAppShell-DlpQierx.js";
+import { _ as _6 } from "./chunks/LpAppShell-C4b3ySa_.js";
 import { _ as _7 } from "./chunks/LpAutocomplete-YPxAPHEo.js";
 import { _ as _8 } from "./chunks/LpAvatar-CfLBqlY1.js";
 import { _ as _9 } from "./chunks/LpBadge-Bh5roBr_.js";
@@ -19,7 +19,7 @@ import { chartView, lttbIndices, minMaxBuckets, panRange, slotOf, sourceOf, zoom
 import { useChartSync } from "./composables/useChartSync.js";
 import { createLinkedView, linkChart, linkLog, linkPipeline, linkTable, linkTopology, provideLinkedView, useLinkedView } from "./composables/useLinkedView.js";
 import { _ as _14 } from "./chunks/LpCheckbox-C9VnPIQf.js";
-import { _ as _15 } from "./chunks/LpCodeBlock-BgWcg2mk.js";
+import { _ as _15 } from "./chunks/LpCodeBlock-DTU40x8P.js";
 import { tokenizeLines } from "./components/codeHighlight.js";
 import { _ as _16 } from "./chunks/LpColorPicker-KGMG8QEh.js";
 import { DEFAULT_SWATCHES, clampHsv, formatColor, hsvToHsl, hsvToRgb, isLight, normalizeHue, opaqueCss, parseColor, parseHex, rgbToHex, rgbToHsv } from "./components/color.js";
@@ -33,8 +33,8 @@ import { default as default6 } from "./components/LpPaletteStats.vue.js";
 import { default as default7 } from "./components/LpPaletteSwatches.vue.js";
 import { default as default8 } from "./components/LpKeys.vue.js";
 import { comboKeys, comboSteps } from "./components/keys.js";
-import { _ as _18 } from "./chunks/LpConfirmDialog-y6k0ryWR.js";
-import { _ as _19 } from "./chunks/LpConfirmHost-D-X0tDym.js";
+import { _ as _18 } from "./chunks/LpConfirmDialog-DrHcIxRn.js";
+import { _ as _19 } from "./chunks/LpConfirmHost-D0Cd8FA_.js";
 import { confirm, useConfirm } from "./components/confirm.js";
 import { _ as _20 } from "./chunks/LpContextMenu-DEFirphS.js";
 import { _ as _21 } from "./chunks/LpDatePicker-Dlyvgsan.js";
@@ -43,11 +43,11 @@ import { _ as _23 } from "./chunks/LpRangeCalendar-9BvaLZji.js";
 import { clampRange, dayAllowed, defaultDatePresets, defaultRangePresets, formatRange, normalizeRange, sameRange } from "./components/dateRange.js";
 import { _ as _24 } from "./chunks/LpDisclosure-D4JZ-o8K.js";
 import { _ as _25 } from "./chunks/LpDivider-CUX46KR0.js";
-import { _ as _26 } from "./chunks/LpDrawer-BkWjFdV0.js";
+import { _ as _26 } from "./chunks/LpDrawer-BHlqi62K.js";
 import { _ as _27 } from "./chunks/LpDropdownMenu-CdCe7D2d.js";
 import { default as default9 } from "./components/LpDropzone.vue.js";
 import { _ as _28 } from "./chunks/LpEmptyState-DLOm07KH.js";
-import { _ as _29 } from "./chunks/LpFileTree-BN_zybBN.js";
+import { _ as _29 } from "./chunks/LpFileTree-gVjF_b6r.js";
 import { ancestorIds, checkStateOf, checkedCount, computeStats, fileIcon, formatModified, formatSize, sortNodes, subtreeIds, subtreeSize } from "./components/fileTree.js";
 import { _ as _30 } from "./chunks/LpFieldNotice-DUPo1Yii.js";
 import { _ as _31 } from "./chunks/LpFormField-jbM7K1Hg.js";
@@ -56,25 +56,25 @@ import { i, b, a, c } from "./chunks/icons-C8ccRCKw.js";
 import { default as default10 } from "./components/LpImageEditor.vue.js";
 import { _ as _33 } from "./chunks/LpInfraNode-tD5x5YOy.js";
 import { _ as _34 } from "./chunks/LpInput-DGMpxrcg.js";
-import { _ as _35 } from "./chunks/LpLightbox-DPgz7IsT.js";
+import { _ as _35 } from "./chunks/LpLightbox--EwvQGe-.js";
 import { fileNameOf, isVideoItem } from "./components/lightbox.js";
 import { _ as _36 } from "./chunks/LpLink-Krkjhe_y.js";
-import { _ as _37 } from "./chunks/LpLogViewer-BuIzr_6h.js";
+import { _ as _37 } from "./chunks/LpLogViewer-DSq9e8mT.js";
 import { _ as _38 } from "./chunks/LpLogInspector-BhJTJIst.js";
 import { compilePattern, findIds, messageShape, structuredPayload, timeMs } from "./components/logTools.js";
 import { countLevels, matchPositions, matchesTerm, ringWindow, stepMatch } from "./components/logSearch.js";
-import { _ as _39 } from "./chunks/LpMediaGallery-CTejKF2-.js";
-import { _ as _40 } from "./chunks/LpModal-D1E7rQzw.js";
-import { _ as _41 } from "./chunks/LpModalNav-BFjiHWbr.js";
-import { _ as _42 } from "./chunks/LpNotificationBell-KRgdRZs-.js";
-import { _ as _43 } from "./chunks/LpNotificationFeed-CMGYU8c-.js";
+import { _ as _39 } from "./chunks/LpMediaGallery-DlYJf3DS.js";
+import { _ as _40 } from "./chunks/LpModal-COMHrBKL.js";
+import { _ as _41 } from "./chunks/LpModalNav-Cj02cfhL.js";
+import { _ as _42 } from "./chunks/LpNotificationBell-DNGijtmW.js";
+import { _ as _43 } from "./chunks/LpNotificationFeed-BoovbtfL.js";
 import { _ as _44 } from "./chunks/LpNumberField-C0LSu-tl.js";
 import { _ as _45 } from "./chunks/LpTimeField-Dio7Tj9A.js";
 import { _ as _46 } from "./chunks/LpNumberFlow-Vqj0tP7B.js";
 import { _ as _47 } from "./chunks/LpOtpInput-C14XagVB.js";
 import { _ as _48 } from "./chunks/LpPagination-DGLntZJN.js";
-import { _ as _49 } from "./chunks/LpPasswordInput-LPVI7D3v.js";
-import { _ as _50 } from "./chunks/LpPie-CsiBXe-e.js";
+import { _ as _49 } from "./chunks/LpPasswordInput-BBDz2zyU.js";
+import { _ as _50 } from "./chunks/LpPie-CtC4XdhC.js";
 import { _ as _51 } from "./chunks/LpPhoneInput-BdglZsGH.js";
 import { filterCountries, flagEmoji, loadCountries, matchCountryByValue } from "./components/countries.js";
 import { _ as _52 } from "./chunks/LpPopover-w2rr4x7n.js";
@@ -82,9 +82,9 @@ import { _ as _53 } from "./chunks/LpProgress-D_MSjowb.js";
 import { _ as _54 } from "./chunks/LpRadio-4KyxeSz4.js";
 import { _ as _55 } from "./chunks/LpRadioGroup-Cr_fmrBY.js";
 import { _ as _56 } from "./chunks/LpRollingText-B54Pje7P.js";
-import { _ as _57 } from "./chunks/LpScrollArea-CqvwfZs2.js";
+import { _ as _57 } from "./chunks/LpScrollArea-B_1KZOSS.js";
 import { _ as _58 } from "./chunks/LpScrollStrip-D4tsOfAQ.js";
-import { _ as _59 } from "./chunks/LpPageScrollbar-C9sTeU-2.js";
+import { _ as _59 } from "./chunks/LpPageScrollbar-BniFeL2U.js";
 import { _ as _60 } from "./chunks/LpSegmented-DzFYP0ZF.js";
 import { _ as _61 } from "./chunks/LpSection-CwsfNR7N.js";
 import { _ as _62 } from "./chunks/LpSelect-Dffg5r4I.js";
@@ -94,7 +94,7 @@ import { _ as _64 } from "./chunks/LpShift-DAgS_d2x.js";
 import { _ as _65 } from "./chunks/LpSwap-M7nFeW3C.js";
 import { _ as _66 } from "./chunks/LpHintExample-YzCXiSUp.js";
 import { default as default11 } from "./components/LpShortcutsDialog.vue.js";
-import { _ as _67 } from "./chunks/LpSidebar-BKhVDsMt.js";
+import { _ as _67 } from "./chunks/LpSidebar-DPri9uyz.js";
 import { _ as _68 } from "./chunks/LpContextSwitcher-COw6GHPW.js";
 import { _ as _69 } from "./chunks/LpSkeleton-leTl53V9.js";
 import { _ as _70 } from "./chunks/LpSlider-DUd4gXnw.js";
@@ -122,10 +122,10 @@ import { _ as _80 } from "./chunks/LpBottomNav-9AqvZlRW.js";
 import { _ as _81 } from "./chunks/LpTagsInput-DD8-xe3F.js";
 import { addTags, splitTags } from "./components/tags.js";
 import { _ as _82 } from "./chunks/LpTextarea-CQg-dVxN.js";
-import { _ as _83 } from "./chunks/LpThemeSwitcher-B3c44xFH.js";
+import { _ as _83 } from "./chunks/LpThemeSwitcher-DKkCFaFk.js";
 import { _ as _84 } from "./chunks/LpTilt-B7KHX1zH.js";
-import { _ as _85 } from "./chunks/LpToaster-Cdx1tnHB.js";
-import { _ as _86 } from "./chunks/LpTooltip-BKde8Xjv.js";
+import { _ as _85 } from "./chunks/LpToaster-C7hHkGOA.js";
+import { _ as _86 } from "./chunks/LpTooltip-Bt1ZFViJ.js";
 import { _ as _87 } from "./chunks/LpTour-BGUKUxSZ.js";
 import { holeOf, openContextMenu, panelsAround } from "./components/tour.js";
 import { _ as _88 } from "./chunks/LpHintLayer-nuMqfzvy.js";
@@ -134,13 +134,13 @@ import { HINT_SIGNALS, contextMenuTip, createHintSystem, dropzoneTip, hintKey, h
 import { _ as _90 } from "./chunks/LpTooltipProvider-CftjV7Xc.js";
 import { _ as _91 } from "./chunks/LpTopologyCanvas-B1YFfMaq.js";
 import { clusterGraph, diffTopology, findPath, layeredLayout, neighborhood, topologyToSvg } from "./components/topologyGraph.js";
-import { _ as _92 } from "./chunks/LpUptimeBar-Dt6SY_-m.js";
+import { _ as _92 } from "./chunks/LpUptimeBar-CXgzU5ym.js";
 import { addLeaf, addTab, countBlocks, countLeaves, deserializeLayout, makeLayout, moveLeaf, removeBlock, removeLeaf, reorderTab, resizeAt, serializeLayout, setActiveTab } from "./layout/tree.js";
 import { blockTitle, defineBlocks } from "./layout/registry.js";
 import { layoutController, useLayout } from "./layout/useLayout.js";
 import { useWorkspaces } from "./layout/useWorkspaces.js";
-import { _ as _93 } from "./chunks/LpWorkspaceSwitcher-DCIiOQt_.js";
-import { _ as _94 } from "./chunks/LpInspector-oTfkOdYd.js";
+import { _ as _93 } from "./chunks/LpWorkspaceSwitcher-CrUVSI7x.js";
+import { _ as _94 } from "./chunks/LpInspector-DSL1lINx.js";
 import { _ as _95 } from "./chunks/LpWindow-DsPeiDCZ.js";
 import { WINDOW_DOCKS, clampRect, dockAt, dockedRect, isWindowRect, resizeRect, snapRect, useWindowLayer } from "./composables/windowing.js";
 import { THEME_COOKIE, applyTheme, applyThemeWithTransition, bootstrapTheme, cacheSystemThemes, normalizeTheme, parseTheme, prefersDarkScheme, revealTransition, serializeTheme, themeEntries, themeFromCookie, themeToCssRule, themeToCssVars, useTheme } from "./theme/useTheme.js";
@@ -192,14 +192,14 @@ import { useScrollStrip } from "./composables/useScrollStrip.js";
 import { useToast } from "./composables/useToast.js";
 import { _ as _96 } from "./chunks/LpThemeProvider-XK6ZeWAE.js";
 import { _ as _97 } from "./chunks/LpFrame-Bv5Fphte.js";
-import { _ as _98 } from "./chunks/LpThemeStudio-BPPctXgd.js";
+import { _ as _98 } from "./chunks/LpThemeStudio-yiEdFJQL.js";
 import { _ as _99 } from "./chunks/LpThemeStudioSection-B7bt8Iyg.js";
 import { isInternalHref, resolveLink } from "./components/link.js";
 import { _ as _100 } from "./chunks/LpRepeater-C0rns2xW.js";
 import { _ as _101 } from "./chunks/LpGauge-KZaQ_FDR.js";
 import { _ as _102 } from "./chunks/LpQuota-BaCq5YOQ.js";
 import { _ as _103 } from "./chunks/LpStatus-C6GqSHJj.js";
-import { _ as _104 } from "./chunks/LpRelativeTime-CN5bWD73.js";
+import { _ as _104 } from "./chunks/LpRelativeTime-9MHlbq6F.js";
 import { _ as _105 } from "./chunks/LpActivityLine-Ea-t5Vza.js";
 import { TONE_COLOR, TONE_SOFT, arcPath, capacityThresholds, meterFraction, toneAt } from "./components/meter.js";
 import { TONES, TONE_ALIASES, toneLook, toneOf } from "./components/tone.js";
@@ -207,7 +207,7 @@ import { formatAmount, quotaSegments, quotaState } from "./components/quota.js";
 import { compactNumber, decimalMark, formatBytes } from "./components/format.js";
 import { STATUS_LABELS, STATUS_LOOK } from "./components/status.js";
 import { formatRelativeTime } from "./components/relativeTime.js";
-import { _ as _106 } from "./chunks/LpPipeline-DVcoSs--.js";
+import { _ as _106 } from "./chunks/LpPipeline-aCALaUY8.js";
 import { _ as _107 } from "./chunks/LpStepMark-CPGVj1XG.js";
 import { childProgress, connectorFilled, currentStepIndex, isSettled, overallStatus, stepElapsed } from "./components/pipeline.js";
 import { _ as _108 } from "./chunks/LpLoader-Bf1yZwaU.js";
@@ -216,12 +216,12 @@ import { useAppUpdate } from "./composables/useAppUpdate.js";
 import { useNow } from "./composables/useNow.js";
 import { _ as _109 } from "./chunks/LpCountdown-DVl7vXI1.js";
 import { DEFAULT_MILESTONES, DEFAULT_UNIT_LABELS, ceilToSecond, crossedMilestone, formatElapsed, formatTime, msToNextSecond, splitTime, timeParts } from "./components/timeSpan.js";
-import { _ as _110 } from "./chunks/LpCopyButton-BGzw95Xc.js";
-import { _ as _111 } from "./chunks/LpSecretField-BwrZ4TfT.js";
-import { _ as _112 } from "./chunks/LpDataList-B56Gu6Yt.js";
+import { _ as _110 } from "./chunks/LpCopyButton-CiqUS4SX.js";
+import { _ as _111 } from "./chunks/LpSecretField-C9vwMFQ6.js";
+import { _ as _112 } from "./chunks/LpDataList-Cit9fOSp.js";
 import { _ as _113 } from "./chunks/LpEditable-DfRUAGkA.js";
-import { _ as _114 } from "./chunks/LpTruncate-C_C8eiIE.js";
-import { _ as _115 } from "./chunks/LpCodeDisplay-DBi1YPLp.js";
+import { _ as _114 } from "./chunks/LpTruncate-DEHWL1OA.js";
+import { _ as _115 } from "./chunks/LpCodeDisplay-F2hjLb0X.js";
 import { formatRemaining, groupCode, middleTruncate, normalizeCode } from "./components/fieldText.js";
 import { _ as _116 } from "./chunks/LpHoverCard-DYguY2AP.js";
 import { _ as _117 } from "./chunks/LpIdenticon-Dbbr4fvt.js";
@@ -251,7 +251,7 @@ import { _ as _129 } from "./chunks/LpCommandScope-DRUvHiX7.js";
 import { createPaletteRegistry, mergePaletteCommands, usePaletteCommands, vPalette } from "./composables/usePaletteCommands.js";
 import { commandShortcuts, commandToHotkey, commandToMenuItem, commandToPalette, useCommands } from "./composables/useCommands.js";
 import { usePaletteTheme } from "./theme/palette.js";
-import { _ as _130 } from "./chunks/LpPaletteTheme-CLwO-SDf.js";
+import { _ as _130 } from "./chunks/LpPaletteTheme-_FwkJO2o.js";
 const uk = {
   actionBar: { dismiss: "Закрити" },
   activityLine: { busy: "Завантаження" },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@leavepulse/ui",
-  "version": "0.94.1",
+  "version": "0.95.0",
   "type": "module",
   "description": "LeavePulse token-driven Vue component kit.",
   "repository": {

package/src/components/LpPageScrollbar.vue

@@ -75,9 +75,22 @@ function measure() {
   const height = Math.max(MIN_THUMB_PX, Math.round((track * view.clientHeight) / view.scrollHeight))
   thumb.value = { height, top: Math.round(((track - height) * view.scrollTop) / range) }
 }
+/*
+ * At most once a frame, and never in the middle of someone's render. A scroll
+ * or a resize of the window asks for the next frame. A change of the page's
+ * size is measured where the observer reports it, which is after the browser
+ * has laid the page out: the sizes are read for free there. Put off to the
+ * next frame instead, the read landed after whatever that frame had changed
+ * first (a list's rows starting their entrance) and laid the page out again
+ * for it, the cost of a whole table inside the frame that showed it.
+ */
 function measureSoon() {
   if (!frame && doc) frame = nodeWindow(doc).requestAnimationFrame(measure)
 }
+function measureLaidOut() {
+  if (frame && doc) nodeWindow(doc).cancelAnimationFrame(frame)
+  measure()
+}
 
 function onScroll() {
   measureSoon()
@@ -146,7 +159,7 @@ onMounted(() => {
   const win = nodeWindow(doc)
   win.addEventListener("scroll", onScroll, { passive: true })
   win.addEventListener("resize", measureSoon)
-  sizes = new win.ResizeObserver(measureSoon)
+  sizes = new win.ResizeObserver(measureLaidOut)
   sizes.observe(doc.body)
   if (host) sizes.observe(host)
   measure()

package/src/components/LpScrollArea.vue

@@ -155,8 +155,12 @@ function onViewportScroll(event: Event) {
 // state has to track content size even where the fade is off.
 let edgeResize: ResizeObserver | undefined
 let edgeMutation: MutationObserver | undefined
+let edgeFrame = 0
+let edgeWindow: Window | undefined
 
 function stopEdgeWatch() {
+  if (edgeFrame) edgeWindow?.cancelAnimationFrame(edgeFrame)
+  edgeFrame = 0
   edgeResize?.disconnect()
   edgeMutation?.disconnect()
   edgeResize = undefined
@@ -187,6 +191,14 @@ watch(
     // Rows arriving after the first paint are the common case — a list waiting
     // on a query renders empty, and observing only the boxes that existed then
     // left the fade off until something else happened to trigger a measure.
+    //
+    // Measured in the next frame, not here: a mutation is reported straight
+    // after the render that made it, before the browser has laid anything out,
+    // so reading the sizes here laid out fifty fresh table rows inside the
+    // click that brought them. The resize observer, which reports after layout,
+    // usually measures first anyway; the frame covers a change that resized
+    // nothing it watches.
+    edgeWindow = win
     if (win.MutationObserver) {
       edgeMutation = new win.MutationObserver(() => {
         if (edgeResize) {
@@ -194,7 +206,12 @@ watch(
           edgeResize.observe(el)
           for (const child of Array.from(el.children)) edgeResize.observe(child)
         }
-        remeasure()
+        if (!edgeFrame) {
+          edgeFrame = win.requestAnimationFrame(() => {
+            edgeFrame = 0
+            remeasure()
+          })
+        }
       })
       edgeMutation.observe(el, { childList: true, subtree: true })
     }