@rotki/ui-library 3.0.0-beta.1 → 3.0.0-beta.2

package/dist/composables/sticky-header.js.map

@@ -1 +1 @@
-{"version":3,"file":"sticky-header.js","names":[],"sources":["../../src/composables/sticky-header.ts"],"sourcesContent":["import type { MaybeRefOrGetter, Ref, ShallowRef } from 'vue';\n\nexport interface UseStickyTableHeaderRefs {\n  table: Readonly<ShallowRef<HTMLTableElement | null>>;\n}\n\ninterface StickyElements {\n  head: HTMLElement;\n  theadClone: HTMLElement;\n  root: HTMLTableElement;\n}\n\ninterface UseStickyTableHeaderReturn {\n  stick: Readonly<Ref<boolean>>;\n}\n\nconst SELECTORS = {\n  head: ':scope > thead[data-id=head-main]',\n  headClone: ':scope > thead[data-id=head-clone]',\n  row: ':scope > tbody > tr:not([hidden])',\n  th: ':scope > th',\n} as const;\n\nconst BORDER_PRECISION = -0.5;\n\nfunction queryHeadRow(root: HTMLTableElement, selector: string): HTMLTableRowElement | null {\n  return root.querySelector(`${selector} > tr`);\n}\n\nfunction queryColumns(row: HTMLTableRowElement | null): HTMLElement[] {\n  if (!row)\n    return [];\n  return Array.from(row.querySelectorAll<HTMLElement>(SELECTORS.th));\n}\n\nfunction readColumnWidths(columns: HTMLElement[]): number[] {\n  return columns.map(col => col.getBoundingClientRect().width);\n}\n\nfunction applyColumnWidths(columns: HTMLElement[], widths: number[]): void {\n  for (const [i, column] of columns.entries()) {\n    const width = widths[i];\n    if (width !== undefined)\n      column.style.width = `${width}px`;\n  }\n}\n\nfunction positionHeadAtRest(head: HTMLElement): void {\n  head.style.left = `${BORDER_PRECISION}px`;\n  head.style.top = '0';\n}\n\ninterface StuckPosition {\n  clonedRect: DOMRect;\n  tableRect: DOMRect;\n  lastRowHeight: number;\n  top: number;\n  origin: Point;\n}\n\nfunction positionHeadStuck(head: HTMLElement, { clonedRect, lastRowHeight, origin, tableRect, top }: StuckPosition): void {\n  head.style.left = `${clonedRect.left - origin.left + BORDER_PRECISION}px`;\n\n  const isNearBottom = tableRect.bottom <= lastRowHeight + clonedRect.height + top;\n  const viewportTop = isNearBottom ? tableRect.bottom - lastRowHeight - clonedRect.height : top;\n  head.style.top = `${viewportTop - origin.top}px`;\n}\n\nfunction isInStickyRange(tableRect: DOMRect, top: number): boolean {\n  return tableRect.top <= top && tableRect.bottom > top;\n}\n\ninterface Point {\n  left: number;\n  top: number;\n}\n\n/**\n * The nearest ancestor that currently scrolls vertically, e.g. a dialog or drawer body, or\n * `undefined` when only the page does. One that could scroll but has nothing to (a card body on a\n * page) is skipped, as is the table's own scroller, which only scrolls sideways.\n */\nfunction findScrollParent(element: HTMLElement): HTMLElement | undefined {\n  let parent = element.parentElement;\n  while (parent && parent !== document.body && parent !== document.documentElement) {\n    const { overflowY } = getComputedStyle(parent);\n    if ((overflowY === 'auto' || overflowY === 'scroll') && parent.scrollHeight > parent.clientHeight)\n      return parent;\n    parent = parent.parentElement;\n  }\n  return undefined;\n}\n\nfunction isSet(value: string | undefined): boolean {\n  return value !== undefined && value !== '' && value !== 'none';\n}\n\n/**\n * Whether an element becomes the containing block of its `position: fixed`\n * descendants. The individual `translate`, `rotate` and `scale` properties\n * count like `transform`: Tailwind 4 writes its translate utilities to\n * `translate`, so a dialog centred with `-translate-x-1/2` leaves `transform`\n * at `none`.\n */\nexport function createsFixedContainingBlock(style: CSSStyleDeclaration): boolean {\n  return isSet(style.transform)\n    || isSet(style.translate)\n    || isSet(style.rotate)\n    || isSet(style.scale)\n    || isSet(style.perspective)\n    || isSet(style.filter)\n    || isSet(style.backdropFilter)\n    || /transform|translate|rotate|scale|perspective|filter/.test(style.willChange)\n    || /paint|layout|strict|content/.test(style.contain);\n}\n\n/**\n * Where a `position: fixed` descendant's `top: 0; left: 0` lands in the viewport. That is the\n * viewport origin, unless an ancestor (a centred dialog is translated) becomes its containing block.\n */\nfunction getFixedOrigin(element: HTMLElement): Point {\n  let parent = element.parentElement;\n  while (parent) {\n    if (createsFixedContainingBlock(getComputedStyle(parent))) {\n      const rect = parent.getBoundingClientRect();\n      return { left: rect.left + parent.clientLeft, top: rect.top + parent.clientTop };\n    }\n    parent = parent.parentElement;\n  }\n  return { left: 0, top: 0 };\n}\n\nfunction getLastRowHeight(root: HTMLTableElement): number | undefined {\n  const rows = root.querySelectorAll(SELECTORS.row);\n  if (rows.length <= 1)\n    return undefined;\n  return rows.item(rows.length - 1)?.getBoundingClientRect().height ?? 0;\n}\n\n/**\n * Setup sticky table header\n */\nexport function useStickyTableHeader(\n  sticky: MaybeRefOrGetter<boolean> = shallowRef(false),\n  offsetTop: MaybeRefOrGetter<number | undefined>,\n  tableRefs: UseStickyTableHeaderRefs,\n): UseStickyTableHeaderReturn {\n  const { table } = tableRefs;\n  const stick = shallowRef<boolean>(false);\n\n  let resizeCleanups: (() => void)[] = [];\n  let syncRafId: number | null = null;\n  let rafId: number | null = null;\n\n  function cleanupResizeObservers(): void {\n    for (const cleanup of resizeCleanups)\n      cleanup();\n    resizeCleanups = [];\n  }\n\n  function cancelPendingSync(): void {\n    if (syncRafId !== null)\n      cancelAnimationFrame(syncRafId);\n    syncRafId = null;\n  }\n\n  function scheduleSyncWidths(cloneColumns: HTMLElement[], mainColumns: HTMLElement[]): void {\n    cancelPendingSync();\n\n    // One frame is enough: the main thead is positioned, so its widths never feed back into the clone's\n    syncRafId = requestAnimationFrame(() => {\n      syncRafId = null;\n      applyColumnWidths(mainColumns, readColumnWidths(cloneColumns));\n      // the head's own width too: left stale, it squeezes the columns and leaves an untinted strip at the end\n      toggleStickyClass();\n    });\n  }\n\n  function observeColumnResizes(cloneColumns: HTMLElement[], mainColumns: HTMLElement[]): void {\n    cleanupResizeObservers();\n\n    for (const th of cloneColumns) {\n      const { stop } = useResizeObserver(th, () => {\n        scheduleSyncWidths(cloneColumns, mainColumns);\n      });\n      resizeCleanups.push(stop);\n    }\n  }\n\n  function watchCellWidth(): void {\n    const root = get(table);\n    if (!toValue(sticky) || !root)\n      return;\n\n    const cloneRow = queryHeadRow(root, SELECTORS.headClone);\n    const mainRow = queryHeadRow(root, SELECTORS.head);\n    const cloneColumns = queryColumns(cloneRow);\n    const mainColumns = queryColumns(mainRow);\n\n    useMutationObserver(cloneRow, (mutations) => {\n      const hasRelevantMutation = mutations.some(\n        m => m.type === 'childList' || m.type === 'attributes',\n      );\n      if (hasRelevantMutation)\n        observeColumnResizes(queryColumns(cloneRow), queryColumns(mainRow));\n    }, { attributes: true, childList: true, subtree: true });\n\n    observeColumnResizes(cloneColumns, mainColumns);\n  }\n\n  function queryStickyElements(): StickyElements | undefined {\n    const root = get(table);\n    if (!toValue(sticky) || !root)\n      return undefined;\n\n    const theadClone = root.querySelector<HTMLElement>(SELECTORS.headClone);\n    const head = root.querySelector<HTMLElement>(SELECTORS.head);\n    if (!theadClone || !head)\n      return undefined;\n\n    return { head, root, theadClone };\n  }\n\n  function toggleStickyClass(): void {\n    const elements = queryStickyElements();\n    if (!elements)\n      return;\n\n    const { head, root, theadClone } = elements;\n    const clonedRect = theadClone.getBoundingClientRect();\n    const tableRect = root.getBoundingClientRect();\n    const pageTop = toValue(offsetTop) ?? 0;\n    const scrollParent = findScrollParent(root);\n    const top = scrollParent\n      ? Math.max(scrollParent.getBoundingClientRect().top + scrollParent.clientTop, pageTop)\n      : pageTop;\n\n    head.style.width = `${clonedRect.width}px`;\n\n    const lastRowHeight = getLastRowHeight(root);\n    if (lastRowHeight === undefined) {\n      set(stick, false);\n      positionHeadAtRest(head);\n      return;\n    }\n\n    if (isInStickyRange(tableRect, top)) {\n      set(stick, true);\n      positionHeadStuck(head, { clonedRect, lastRowHeight, origin: getFixedOrigin(head), tableRect, top });\n    }\n    else {\n      set(stick, false);\n      positionHeadAtRest(head);\n    }\n  }\n\n  function throttledToggleStickyClass(): void {\n    if (rafId !== null)\n      return;\n    rafId = requestAnimationFrame(() => {\n      toggleStickyClass();\n      rafId = null;\n    });\n  }\n\n  function onScroll(event: Event): void {\n    const root = get(table);\n    const target = event.target;\n    // scroll does not bubble, so this runs in capture for every scroll: only an ancestor's matters\n    if (!root || !(target instanceof Node) || !target.contains(root))\n      return;\n    throttledToggleStickyClass();\n  }\n\n  onMounted(() => {\n    toggleStickyClass();\n    useEventListener(document, 'scroll', onScroll, { capture: true, passive: true });\n    useEventListener(window, 'resize', throttledToggleStickyClass);\n    watchCellWidth();\n  });\n\n  return {\n    stick: readonly(stick),\n  };\n}\n"],"mappings":"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"}
+{"version":3,"file":"sticky-header.js","names":[],"sources":["../../src/composables/sticky-header.ts"],"sourcesContent":["import type { MaybeRefOrGetter, Ref, ShallowRef } from 'vue';\n\nexport interface UseStickyTableHeaderRefs {\n  table: Readonly<ShallowRef<HTMLTableElement | null>>;\n}\n\ninterface StickyElements {\n  head: HTMLElement;\n  theadClone: HTMLElement;\n  root: HTMLTableElement;\n}\n\ninterface UseStickyTableHeaderReturn {\n  stick: Readonly<Ref<boolean>>;\n}\n\nconst SELECTORS = {\n  head: ':scope > thead[data-id=head-main]',\n  headClone: ':scope > thead[data-id=head-clone]',\n  row: ':scope > tbody > tr:not([hidden])',\n  th: ':scope > th',\n} as const;\n\nconst BORDER_PRECISION = -0.5;\n\nfunction queryHeadRow(root: HTMLTableElement, selector: string): HTMLTableRowElement | null {\n  return root.querySelector(`${selector} > tr`);\n}\n\nfunction queryColumns(row: HTMLTableRowElement | null): HTMLElement[] {\n  if (!row)\n    return [];\n  return Array.from(row.querySelectorAll<HTMLElement>(SELECTORS.th));\n}\n\nfunction readColumnWidths(columns: HTMLElement[]): number[] {\n  return columns.map(col => col.getBoundingClientRect().width);\n}\n\nfunction applyColumnWidths(columns: HTMLElement[], widths: number[]): void {\n  for (const [i, column] of columns.entries()) {\n    const width = widths[i];\n    if (width !== undefined)\n      column.style.width = `${width}px`;\n  }\n}\n\nfunction positionHeadAtRest(head: HTMLElement): void {\n  head.style.left = `${BORDER_PRECISION}px`;\n  head.style.top = '0';\n}\n\ninterface StuckPosition {\n  clonedRect: DOMRect;\n  tableRect: DOMRect;\n  lastRowHeight: number;\n  top: number;\n  origin: Point;\n}\n\nfunction positionHeadStuck(head: HTMLElement, { clonedRect, lastRowHeight, origin, tableRect, top }: StuckPosition): void {\n  head.style.left = `${clonedRect.left - origin.left + BORDER_PRECISION}px`;\n\n  const isNearBottom = tableRect.bottom <= lastRowHeight + clonedRect.height + top;\n  const viewportTop = isNearBottom ? tableRect.bottom - lastRowHeight - clonedRect.height : top;\n  head.style.top = `${viewportTop - origin.top}px`;\n}\n\nfunction isInStickyRange(tableRect: DOMRect, top: number): boolean {\n  return tableRect.top <= top && tableRect.bottom > top;\n}\n\ninterface Point {\n  left: number;\n  top: number;\n}\n\n/**\n * The nearest ancestor that currently scrolls vertically, e.g. a dialog or drawer body, or\n * `undefined` when only the page does. One that could scroll but has nothing to (a card body on a\n * page) is skipped, as is the table's own scroller, which only scrolls sideways.\n */\nfunction findScrollParent(element: HTMLElement): HTMLElement | undefined {\n  let parent = element.parentElement;\n  while (parent && parent !== document.body && parent !== document.documentElement) {\n    const { overflowY } = getComputedStyle(parent);\n    if ((overflowY === 'auto' || overflowY === 'scroll') && parent.scrollHeight > parent.clientHeight)\n      return parent;\n    parent = parent.parentElement;\n  }\n  return undefined;\n}\n\nfunction isSet(value: string | undefined): boolean {\n  return value !== undefined && value !== '' && value !== 'none';\n}\n\n/**\n * Whether an element becomes the containing block of its `position: fixed`\n * descendants. The individual `translate`, `rotate` and `scale` properties\n * count like `transform`: Tailwind 4 writes its translate utilities to\n * `translate`, so a dialog centred with `-translate-x-1/2` leaves `transform`\n * at `none`.\n */\nexport function createsFixedContainingBlock(style: CSSStyleDeclaration): boolean {\n  return isSet(style.transform)\n    || isSet(style.translate)\n    || isSet(style.rotate)\n    || isSet(style.scale)\n    || isSet(style.perspective)\n    || isSet(style.filter)\n    || isSet(style.backdropFilter)\n    || /transform|translate|rotate|scale|perspective|filter/.test(style.willChange)\n    || /paint|layout|strict|content/.test(style.contain);\n}\n\n/**\n * Where a `position: fixed` descendant's `top: 0; left: 0` lands in the viewport. That is the\n * viewport origin, unless an ancestor (a centred dialog is translated) becomes its containing block.\n */\nfunction getFixedOrigin(element: HTMLElement): Point {\n  let parent = element.parentElement;\n  while (parent) {\n    if (createsFixedContainingBlock(getComputedStyle(parent))) {\n      const rect = parent.getBoundingClientRect();\n      return { left: rect.left + parent.clientLeft, top: rect.top + parent.clientTop };\n    }\n    parent = parent.parentElement;\n  }\n  return { left: 0, top: 0 };\n}\n\nfunction getLastRowHeight(root: HTMLTableElement): number | undefined {\n  const rows = root.querySelectorAll(SELECTORS.row);\n  if (rows.length <= 1)\n    return undefined;\n  return rows.item(rows.length - 1)?.getBoundingClientRect().height ?? 0;\n}\n\n/**\n * Setup sticky table header\n */\nexport function useStickyTableHeader(\n  sticky: MaybeRefOrGetter<boolean> = shallowRef(false),\n  offsetTop: MaybeRefOrGetter<number | undefined>,\n  tableRefs: UseStickyTableHeaderRefs,\n): UseStickyTableHeaderReturn {\n  const { table } = tableRefs;\n  const stick = shallowRef<boolean>(false);\n\n  let resizeCleanups: (() => void)[] = [];\n  let syncRafId: number | null = null;\n  let rafId: number | null = null;\n\n  function cleanupResizeObservers(): void {\n    for (const cleanup of resizeCleanups)\n      cleanup();\n    resizeCleanups = [];\n  }\n\n  function cancelPendingSync(): void {\n    if (syncRafId !== null)\n      cancelAnimationFrame(syncRafId);\n    syncRafId = null;\n  }\n\n  function scheduleSyncWidths(cloneColumns: HTMLElement[], mainColumns: HTMLElement[]): void {\n    cancelPendingSync();\n\n    // One frame is enough: the main thead is positioned, so its widths never feed back into the clone's\n    syncRafId = requestAnimationFrame(() => {\n      syncRafId = null;\n      applyColumnWidths(mainColumns, readColumnWidths(cloneColumns));\n      // the head's own width too: left stale, it squeezes the columns and leaves an untinted strip at the end\n      toggleStickyClass();\n    });\n  }\n\n  function observeColumnResizes(cloneColumns: HTMLElement[], mainColumns: HTMLElement[]): void {\n    cleanupResizeObservers();\n\n    for (const th of cloneColumns) {\n      const { stop } = useResizeObserver(th, () => {\n        scheduleSyncWidths(cloneColumns, mainColumns);\n      });\n      resizeCleanups.push(stop);\n    }\n  }\n\n  function watchCellWidth(): void {\n    const root = get(table);\n    if (!toValue(sticky) || !root)\n      return;\n\n    const cloneRow = queryHeadRow(root, SELECTORS.headClone);\n    const mainRow = queryHeadRow(root, SELECTORS.head);\n    const cloneColumns = queryColumns(cloneRow);\n    const mainColumns = queryColumns(mainRow);\n\n    useMutationObserver(cloneRow, (mutations) => {\n      const hasRelevantMutation = mutations.some(\n        m => m.type === 'childList' || m.type === 'attributes',\n      );\n      if (hasRelevantMutation)\n        observeColumnResizes(queryColumns(cloneRow), queryColumns(mainRow));\n    }, { attributes: true, childList: true, subtree: true });\n\n    observeColumnResizes(cloneColumns, mainColumns);\n  }\n\n  function queryStickyElements(): StickyElements | undefined {\n    const root = get(table);\n    if (!toValue(sticky) || !root)\n      return undefined;\n\n    const theadClone = root.querySelector<HTMLElement>(SELECTORS.headClone);\n    const head = root.querySelector<HTMLElement>(SELECTORS.head);\n    if (!theadClone || !head)\n      return undefined;\n\n    return { head, root, theadClone };\n  }\n\n  function toggleStickyClass(): void {\n    const elements = queryStickyElements();\n    if (!elements)\n      return;\n\n    const { head, root, theadClone } = elements;\n    const clonedRect = theadClone.getBoundingClientRect();\n    const tableRect = root.getBoundingClientRect();\n    const pageTop = toValue(offsetTop) ?? 0;\n    const scrollParent = findScrollParent(root);\n    const top = scrollParent\n      ? Math.max(scrollParent.getBoundingClientRect().top + scrollParent.clientTop, pageTop)\n      : pageTop;\n\n    head.style.width = `${clonedRect.width}px`;\n\n    const lastRowHeight = getLastRowHeight(root);\n    if (lastRowHeight === undefined) {\n      set(stick, false);\n      positionHeadAtRest(head);\n      return;\n    }\n\n    if (isInStickyRange(tableRect, top)) {\n      set(stick, true);\n      positionHeadStuck(head, { clonedRect, lastRowHeight, origin: getFixedOrigin(head), tableRect, top });\n    }\n    else {\n      set(stick, false);\n      positionHeadAtRest(head);\n    }\n  }\n\n  function throttledToggleStickyClass(): void {\n    if (rafId !== null)\n      return;\n    rafId = requestAnimationFrame(() => {\n      toggleStickyClass();\n      rafId = null;\n    });\n  }\n\n  function onScroll(event: Event): void {\n    const root = get(table);\n    const target = event.target;\n    // scroll does not bubble, so this runs in capture for every scroll: only an ancestor's matters\n    if (!root || !(target instanceof Node) || !target.contains(root))\n      return;\n    throttledToggleStickyClass();\n  }\n\n  onMounted(() => {\n    toggleStickyClass();\n    useEventListener(document, 'scroll', onScroll, { capture: true, passive: true });\n    useEventListener(window, 'resize', throttledToggleStickyClass);\n    watchCellWidth();\n  });\n\n  return {\n    stick: readonly(stick),\n  };\n}\n"],"mappings":"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"}

package/dist/composables/tables/data-table/columns.js

@@ -1,7 +1,7 @@
+import { get } from "../../../vendor/@vueuse/shared/dist/index.js";
 import { TableAlign, getAlignClass } from "../../../components/tables/table-props.js";
 import { getObjectKeys, isHeaderSlot } from "./types.js";
 import { computed, toValue } from "vue";
-import { get } from "@vueuse/shared";
 //#region src/composables/tables/data-table/columns.ts
 function useTableColumns(options) {
 	const { cols, columnAttr, expandable, groupKeys, isMobile, rows, selectedData, slots, tdResolver } = options;

package/dist/composables/tables/data-table/expansion.js

@@ -1,5 +1,5 @@
+import { get, set } from "../../../vendor/@vueuse/shared/dist/index.js";
 import { computed } from "vue";
-import { get, set } from "@vueuse/shared";
 //#region src/composables/tables/data-table/expansion.ts
 function useTableExpansion(options, deps) {
 	const { rowAttr, singleExpand } = options;

package/dist/composables/tables/data-table/grouping.js

@@ -1,57 +1,56 @@
 import { assert } from "../../../utils/assert.js";
+import { get, isDefined, set } from "../../../vendor/@vueuse/shared/dist/index.js";
 import { GROUP_HEADER_BRAND, isRow } from "./types.js";
 import { computed, ref, watch } from "vue";
-import { isDefined } from "@vueuse/core";
-import { get as get$1, set as set$1 } from "@vueuse/shared";
 //#region src/composables/tables/data-table/grouping.ts
 var GROUP_KEY_SEPARATOR = "\0";
 function useTableGrouping(options, deps) {
 	const { rowAttr } = options;
 	const { group, collapsed, sorted } = deps;
 	const collapsedRows = ref([]);
-	watch(collapsed, (value) => set$1(collapsedRows, value ?? []), { immediate: true });
+	watch(collapsed, (value) => set(collapsedRows, value ?? []), { immediate: true });
 	const groupKeys = computed(() => {
-		const groupBy = get$1(group);
+		const groupBy = get(group);
 		if (!groupBy) return [];
 		if (!Array.isArray(groupBy)) return [groupBy];
 		return groupBy;
 	});
 	const groupKey = computed(() => {
-		return get$1(groupKeys).join(":") || void 0;
+		return get(groupKeys).join(":") || void 0;
 	});
-	const isGrouped = computed(() => get$1(groupKey) !== void 0);
-	const collapsedIdentifierSet = computed(() => new Set(get$1(collapsedRows).map((row) => row[rowAttr])));
+	const isGrouped = computed(() => get(groupKey) !== void 0);
+	const collapsedIdentifierSet = computed(() => new Set(get(collapsedRows).map((row) => row[rowAttr])));
 	const collapsedGroupKeySet = computed(() => {
-		const grouping = get$1(groupKeys);
+		const grouping = get(groupKeys);
 		if (grouping.length === 0) return /* @__PURE__ */ new Set();
 		const seen = /* @__PURE__ */ new Set();
-		for (const row of get$1(collapsedRows)) seen.add(computeGroupKey(row, grouping));
+		for (const row of get(collapsedRows)) seen.add(computeGroupKey(row, grouping));
 		return seen;
 	});
 	function getRowGroup(row) {
 		const result = {};
-		for (const key of get$1(groupKeys)) result[key] = row[key];
+		for (const key of get(groupKeys)) result[key] = row[key];
 		return result;
 	}
 	function compareGroupsFn(a, b) {
-		const grouping = get$1(groupKeys);
+		const grouping = get(groupKeys);
 		if (grouping.length === 0) return false;
 		return grouping.every((key) => a[key] === b[key]);
 	}
 	function isExpandedGroup(value) {
-		const grouping = get$1(groupKeys);
+		const grouping = get(groupKeys);
 		let groupVal = "";
 		for (const gk of grouping) {
 			if (groupVal) groupVal += GROUP_KEY_SEPARATOR;
 			const val = value[gk];
 			groupVal += isDefined(val) ? val : "";
 		}
-		return !get$1(collapsedGroupKeySet).has(groupVal);
+		return !get(collapsedGroupKeySet).has(groupVal);
 	}
 	function isHiddenRow(row) {
-		if (!get$1(isGrouped)) return false;
+		if (!get(isGrouped)) return false;
 		if (!isRow(row)) return false;
-		return get$1(collapsedIdentifierSet).has(row[rowAttr]);
+		return get(collapsedIdentifierSet).has(row[rowAttr]);
 	}
 	function computeGroupKey(row, grouping) {
 		let key = "";
@@ -63,9 +62,9 @@ function useTableGrouping(options, deps) {
 		return key;
 	}
 	const mappedGroups = computed(() => {
-		const grouping = get$1(groupKeys);
+		const grouping = get(groupKeys);
 		if (grouping.length === 0) return {};
-		const result = get$1(sorted);
+		const result = get(sorted);
 		const identifier = rowAttr;
 		const acc = {};
 		for (const row of result) {
@@ -81,31 +80,31 @@ function useTableGrouping(options, deps) {
 		return acc;
 	});
 	const grouped = computed(() => {
-		const result = get$1(sorted);
-		if (!get$1(groupKey)) return result;
-		const groups = get$1(mappedGroups);
+		const result = get(sorted);
+		if (!get(groupKey)) return result;
+		const groups = get(mappedGroups);
 		const out = [];
 		for (const items of Object.values(groups)) for (const item of items) out.push(item);
 		return out;
 	});
 	function getGroupRows(groupVal) {
-		if (!get$1(isGrouped)) return [];
-		const groupRows = get$1(mappedGroups)[groupVal];
+		if (!get(isGrouped)) return [];
+		const groupRows = get(mappedGroups)[groupVal];
 		assert(groupRows);
 		return groupRows.filter(isRow);
 	}
 	function onToggleExpandGroup(groupPartial, value) {
 		if (!value) return;
-		const currentCollapsed = get$1(collapsedRows);
+		const currentCollapsed = get(collapsedRows);
 		const groupExpanded = isExpandedGroup(groupPartial);
 		const groupRows = getGroupRows(value);
-		set$1(collapsedRows, groupExpanded ? [...currentCollapsed, ...groupRows] : currentCollapsed.filter((row) => !compareGroupsFn(row, groupPartial)));
-		set$1(collapsed, get$1(collapsedRows));
+		set(collapsedRows, groupExpanded ? [...currentCollapsed, ...groupRows] : currentCollapsed.filter((row) => !compareGroupsFn(row, groupPartial)));
+		set(collapsed, get(collapsedRows));
 	}
 	function onUngroup() {
-		set$1(collapsedRows, []);
-		set$1(collapsed, []);
-		set$1(group, Array.isArray(get$1(group)) ? [] : void 0);
+		set(collapsedRows, []);
+		set(collapsed, []);
+		set(group, Array.isArray(get(group)) ? [] : void 0);
 	}
 	return {
 		groupKeys,

package/dist/composables/tables/data-table/grouping.js.map

@@ -1 +1 @@
-{"version":3,"file":"grouping.js","names":[],"sources":["../../../../src/composables/tables/data-table/grouping.ts"],"sourcesContent":["import type { ComputedRef, Ref } from 'vue';\nimport type { TableRowKey, TableRowKeyData } from '@/components/tables/RuiTableHead.vue';\nimport {\n  GROUP_HEADER_BRAND,\n  type GroupedTableRow,\n  type GroupHeader,\n  isRow,\n} from '@/composables/tables/data-table/types';\nimport { assert } from '@/utils/assert';\n\nexport interface UseTableGroupingOptions<T extends object, IdType extends keyof T> {\n  /** The property on each row used as the unique row identifier. */\n  rowAttr: IdType;\n}\n\nexport interface UseTableGroupingDeps<T extends object> {\n  group: Ref<TableRowKeyData<T>>;\n  collapsed: Ref<T[] | undefined>;\n  sorted: ComputedRef<readonly T[]>;\n}\n\nexport interface UseTableGroupingReturn<T extends object> {\n  groupKeys: ComputedRef<TableRowKey<T>[]>;\n  groupKey: ComputedRef<string | undefined>;\n  isGrouped: ComputedRef<boolean>;\n  mappedGroups: ComputedRef<Record<string, GroupedTableRow<T>[]>>;\n  grouped: ComputedRef<readonly GroupedTableRow<T>[]>;\n  getRowGroup: (row: T) => Partial<T>;\n  getGroupRows: (groupVal: string) => T[];\n  compareGroupsFn: (a: T, b: Partial<T>) => boolean;\n  isExpandedGroup: (value: Partial<T>) => boolean;\n  isHiddenRow: (row: GroupedTableRow<T>) => boolean;\n  onToggleExpandGroup: (group: Partial<T>, value?: string) => void;\n  onUngroup: () => void;\n}\n\n// Null character separator prevents false collisions when group values contain commas\nconst GROUP_KEY_SEPARATOR = '\\0';\n\nexport function useTableGrouping<T extends object, IdType extends keyof T>(\n  options: UseTableGroupingOptions<T, IdType>,\n  deps: UseTableGroupingDeps<T>,\n): UseTableGroupingReturn<T> {\n  const { rowAttr } = options;\n  const { group, collapsed, sorted } = deps;\n\n  const collapsedRows: Ref<T[]> = ref([]);\n\n  watch(collapsed, value => set(collapsedRows, value ?? []), { immediate: true });\n\n  const groupKeys: ComputedRef<TableRowKey<T>[]> = computed(() => {\n    const groupBy = get(group);\n\n    if (!groupBy)\n      return [];\n\n    if (!Array.isArray(groupBy))\n      return [groupBy];\n\n    return groupBy;\n  });\n\n  const groupKey = computed<string | undefined>(() => {\n    const key = get(groupKeys).join(':');\n    return key || undefined;\n  });\n\n  const isGrouped = computed<boolean>(() => get(groupKey) !== undefined);\n\n  const collapsedIdentifierSet = computed<Set<T[IdType]>>(\n    () => new Set(get(collapsedRows).map(row => row[rowAttr])),\n  );\n\n  const collapsedGroupKeySet = computed<Set<string>>(() => {\n    const grouping = get(groupKeys);\n    if (grouping.length === 0)\n      return new Set<string>();\n\n    const seen = new Set<string>();\n    for (const row of get(collapsedRows))\n      seen.add(computeGroupKey(row, grouping));\n    return seen;\n  });\n\n  function getRowGroup(row: T): Partial<T> {\n    const result: Partial<T> = {};\n    for (const key of get(groupKeys)) {\n      result[key] = row[key];\n    }\n    return result;\n  }\n\n  function compareGroupsFn(a: T, b: Partial<T>): boolean {\n    const grouping = get(groupKeys);\n    if (grouping.length === 0)\n      return false;\n\n    return grouping.every(key => a[key] === b[key]);\n  }\n\n  function isExpandedGroup(value: Partial<T>): boolean {\n    const grouping = get(groupKeys);\n    let groupVal = '';\n    for (const gk of grouping) {\n      if (groupVal)\n        groupVal += GROUP_KEY_SEPARATOR;\n      const val = value[gk];\n      groupVal += isDefined(val) ? val : '';\n    }\n    return !get(collapsedGroupKeySet).has(groupVal);\n  }\n\n  function isHiddenRow(row: GroupedTableRow<T>): boolean {\n    if (!get(isGrouped))\n      return false;\n    if (!isRow(row))\n      return false;\n    return get(collapsedIdentifierSet).has(row[rowAttr]);\n  }\n\n  function computeGroupKey(row: T, grouping: TableRowKey<T>[]): string {\n    let key = '';\n    for (const gk of grouping) {\n      if (key)\n        key += GROUP_KEY_SEPARATOR;\n      const val = row[gk];\n      key += isDefined(val) ? val : '';\n    }\n    return key;\n  }\n\n  const mappedGroups = computed<Record<string, GroupedTableRow<T>[]>>(() => {\n    const grouping = get(groupKeys);\n    if (grouping.length === 0)\n      return {};\n\n    const result = get(sorted);\n    const identifier = rowAttr;\n    const acc: Record<string, GroupedTableRow<T>[]> = {};\n\n    for (const row of result) {\n      if (!isDefined(row[identifier]) || row[identifier] === '')\n        continue;\n\n      const groupVal = computeGroupKey(row, grouping);\n      if (!acc[groupVal]) {\n        acc[groupVal] = [\n          {\n            [GROUP_HEADER_BRAND]: true,\n            group: getRowGroup(row),\n            identifier: groupVal,\n          } satisfies GroupHeader<T>,\n        ];\n      }\n\n      acc[groupVal].push(row);\n    }\n\n    return acc;\n  });\n\n  const grouped = computed<readonly GroupedTableRow<T>[]>(() => {\n    const result = get(sorted);\n    const groupByKey = get(groupKey);\n\n    if (!groupByKey)\n      return result;\n\n    const groups = get(mappedGroups);\n    const out: GroupedTableRow<T>[] = [];\n    for (const items of Object.values(groups)) {\n      for (const item of items)\n        out.push(item);\n    }\n    return out;\n  });\n\n  function getGroupRows(groupVal: string): T[] {\n    if (!get(isGrouped))\n      return [];\n\n    const groupRows = get(mappedGroups)[groupVal];\n    assert(groupRows);\n    return groupRows.filter(isRow);\n  }\n\n  function onToggleExpandGroup(groupPartial: Partial<T>, value?: string): void {\n    if (!value)\n      return;\n\n    const currentCollapsed = get(collapsedRows);\n\n    const groupExpanded = isExpandedGroup(groupPartial);\n\n    const groupRows = getGroupRows(value);\n\n    set(\n      collapsedRows,\n      groupExpanded\n        ? [...currentCollapsed, ...groupRows]\n        : currentCollapsed.filter(row => !compareGroupsFn(row, groupPartial)),\n    );\n\n    set(collapsed, get(collapsedRows));\n  }\n\n  function onUngroup(): void {\n    set(collapsedRows, []);\n\n    set(collapsed, []);\n    set(group, Array.isArray(get(group)) ? [] : undefined);\n  }\n\n  return {\n    groupKeys,\n    groupKey,\n    isGrouped,\n    mappedGroups,\n    grouped,\n    getRowGroup,\n    getGroupRows,\n    compareGroupsFn,\n    isExpandedGroup,\n    isHiddenRow,\n    onToggleExpandGroup,\n    onUngroup,\n  };\n}\n"],"mappings":"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"}
+{"version":3,"file":"grouping.js","names":[],"sources":["../../../../src/composables/tables/data-table/grouping.ts"],"sourcesContent":["import type { ComputedRef, Ref } from 'vue';\nimport type { TableRowKey, TableRowKeyData } from '@/components/tables/RuiTableHead.vue';\nimport {\n  GROUP_HEADER_BRAND,\n  type GroupedTableRow,\n  type GroupHeader,\n  isRow,\n} from '@/composables/tables/data-table/types';\nimport { assert } from '@/utils/assert';\n\nexport interface UseTableGroupingOptions<T extends object, IdType extends keyof T> {\n  /** The property on each row used as the unique row identifier. */\n  rowAttr: IdType;\n}\n\nexport interface UseTableGroupingDeps<T extends object> {\n  group: Ref<TableRowKeyData<T>>;\n  collapsed: Ref<T[] | undefined>;\n  sorted: ComputedRef<readonly T[]>;\n}\n\nexport interface UseTableGroupingReturn<T extends object> {\n  groupKeys: ComputedRef<TableRowKey<T>[]>;\n  groupKey: ComputedRef<string | undefined>;\n  isGrouped: ComputedRef<boolean>;\n  mappedGroups: ComputedRef<Record<string, GroupedTableRow<T>[]>>;\n  grouped: ComputedRef<readonly GroupedTableRow<T>[]>;\n  getRowGroup: (row: T) => Partial<T>;\n  getGroupRows: (groupVal: string) => T[];\n  compareGroupsFn: (a: T, b: Partial<T>) => boolean;\n  isExpandedGroup: (value: Partial<T>) => boolean;\n  isHiddenRow: (row: GroupedTableRow<T>) => boolean;\n  onToggleExpandGroup: (group: Partial<T>, value?: string) => void;\n  onUngroup: () => void;\n}\n\n// Null character separator prevents false collisions when group values contain commas\nconst GROUP_KEY_SEPARATOR = '\\0';\n\nexport function useTableGrouping<T extends object, IdType extends keyof T>(\n  options: UseTableGroupingOptions<T, IdType>,\n  deps: UseTableGroupingDeps<T>,\n): UseTableGroupingReturn<T> {\n  const { rowAttr } = options;\n  const { group, collapsed, sorted } = deps;\n\n  const collapsedRows: Ref<T[]> = ref([]);\n\n  watch(collapsed, value => set(collapsedRows, value ?? []), { immediate: true });\n\n  const groupKeys: ComputedRef<TableRowKey<T>[]> = computed(() => {\n    const groupBy = get(group);\n\n    if (!groupBy)\n      return [];\n\n    if (!Array.isArray(groupBy))\n      return [groupBy];\n\n    return groupBy;\n  });\n\n  const groupKey = computed<string | undefined>(() => {\n    const key = get(groupKeys).join(':');\n    return key || undefined;\n  });\n\n  const isGrouped = computed<boolean>(() => get(groupKey) !== undefined);\n\n  const collapsedIdentifierSet = computed<Set<T[IdType]>>(\n    () => new Set(get(collapsedRows).map(row => row[rowAttr])),\n  );\n\n  const collapsedGroupKeySet = computed<Set<string>>(() => {\n    const grouping = get(groupKeys);\n    if (grouping.length === 0)\n      return new Set<string>();\n\n    const seen = new Set<string>();\n    for (const row of get(collapsedRows))\n      seen.add(computeGroupKey(row, grouping));\n    return seen;\n  });\n\n  function getRowGroup(row: T): Partial<T> {\n    const result: Partial<T> = {};\n    for (const key of get(groupKeys)) {\n      result[key] = row[key];\n    }\n    return result;\n  }\n\n  function compareGroupsFn(a: T, b: Partial<T>): boolean {\n    const grouping = get(groupKeys);\n    if (grouping.length === 0)\n      return false;\n\n    return grouping.every(key => a[key] === b[key]);\n  }\n\n  function isExpandedGroup(value: Partial<T>): boolean {\n    const grouping = get(groupKeys);\n    let groupVal = '';\n    for (const gk of grouping) {\n      if (groupVal)\n        groupVal += GROUP_KEY_SEPARATOR;\n      const val = value[gk];\n      groupVal += isDefined(val) ? val : '';\n    }\n    return !get(collapsedGroupKeySet).has(groupVal);\n  }\n\n  function isHiddenRow(row: GroupedTableRow<T>): boolean {\n    if (!get(isGrouped))\n      return false;\n    if (!isRow(row))\n      return false;\n    return get(collapsedIdentifierSet).has(row[rowAttr]);\n  }\n\n  function computeGroupKey(row: T, grouping: TableRowKey<T>[]): string {\n    let key = '';\n    for (const gk of grouping) {\n      if (key)\n        key += GROUP_KEY_SEPARATOR;\n      const val = row[gk];\n      key += isDefined(val) ? val : '';\n    }\n    return key;\n  }\n\n  const mappedGroups = computed<Record<string, GroupedTableRow<T>[]>>(() => {\n    const grouping = get(groupKeys);\n    if (grouping.length === 0)\n      return {};\n\n    const result = get(sorted);\n    const identifier = rowAttr;\n    const acc: Record<string, GroupedTableRow<T>[]> = {};\n\n    for (const row of result) {\n      if (!isDefined(row[identifier]) || row[identifier] === '')\n        continue;\n\n      const groupVal = computeGroupKey(row, grouping);\n      if (!acc[groupVal]) {\n        acc[groupVal] = [\n          {\n            [GROUP_HEADER_BRAND]: true,\n            group: getRowGroup(row),\n            identifier: groupVal,\n          } satisfies GroupHeader<T>,\n        ];\n      }\n\n      acc[groupVal].push(row);\n    }\n\n    return acc;\n  });\n\n  const grouped = computed<readonly GroupedTableRow<T>[]>(() => {\n    const result = get(sorted);\n    const groupByKey = get(groupKey);\n\n    if (!groupByKey)\n      return result;\n\n    const groups = get(mappedGroups);\n    const out: GroupedTableRow<T>[] = [];\n    for (const items of Object.values(groups)) {\n      for (const item of items)\n        out.push(item);\n    }\n    return out;\n  });\n\n  function getGroupRows(groupVal: string): T[] {\n    if (!get(isGrouped))\n      return [];\n\n    const groupRows = get(mappedGroups)[groupVal];\n    assert(groupRows);\n    return groupRows.filter(isRow);\n  }\n\n  function onToggleExpandGroup(groupPartial: Partial<T>, value?: string): void {\n    if (!value)\n      return;\n\n    const currentCollapsed = get(collapsedRows);\n\n    const groupExpanded = isExpandedGroup(groupPartial);\n\n    const groupRows = getGroupRows(value);\n\n    set(\n      collapsedRows,\n      groupExpanded\n        ? [...currentCollapsed, ...groupRows]\n        : currentCollapsed.filter(row => !compareGroupsFn(row, groupPartial)),\n    );\n\n    set(collapsed, get(collapsedRows));\n  }\n\n  function onUngroup(): void {\n    set(collapsedRows, []);\n\n    set(collapsed, []);\n    set(group, Array.isArray(get(group)) ? [] : undefined);\n  }\n\n  return {\n    groupKeys,\n    groupKey,\n    isGrouped,\n    mappedGroups,\n    grouped,\n    getRowGroup,\n    getGroupRows,\n    compareGroupsFn,\n    isExpandedGroup,\n    isHiddenRow,\n    onToggleExpandGroup,\n    onUngroup,\n  };\n}\n"],"mappings":"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"}

package/dist/composables/tables/data-table/page-scroll.d.ts

@@ -1,5 +1,5 @@
-import type { MaybeComputedElementRef } from '@vueuse/core';
 import type { MaybeRefOrGetter, Ref } from 'vue';
+import type { MaybeElementRef } from '../../../types/dom';
 export interface UsePageScrollReturn {
     /** Scroll the table's top into view, if it has scrolled above the visible area. */
     revealTableTop: () => Promise<void>;
@@ -20,11 +20,13 @@ export declare function useStickyPaginationBar(wrapper: Readonly<Ref<HTMLElement
 /**
  * Publishes how much of the view's bottom a stuck pagination bar covers, as `--rui-sticky-bottom` on
  * the document root, so the page's own floating parts (a dock, a FAB) can rise above the bar instead of
- * covering its page buttons. Only a bar stuck to the page counts: one stuck inside a scrolling area
- * sits under nothing the page floats.
+ * covering its page buttons. A bar resting at its own place in the bottom band of the view counts too,
+ * since it sits in the same corner; it covers from its top down, which is more than its height when it
+ * rests above the view's bottom, so the parts keep the same gap above it as above a stuck bar. Only a
+ * bar at page level counts: one inside a scrolling area sits under nothing the page floats.
  *
- * @param sentinel - an empty element at the bar's own place after the rows; while it is below the view, the bar is stuck
+ * @param sentinel - an empty element at the bar's own place after the rows; while it is below the view's bottom band, the bar covers that corner
  * @param bar - the bar, measured for its height
  * @param canStick - whether the bar may stick at all
  */
-export declare function useStickyBottomInset(sentinel: Readonly<Ref<HTMLElement | null | undefined>>, bar: MaybeComputedElementRef, canStick: MaybeRefOrGetter<boolean>): void;
+export declare function useStickyBottomInset(sentinel: Readonly<Ref<HTMLElement | null | undefined>>, bar: MaybeElementRef, canStick: MaybeRefOrGetter<boolean>): void;

package/dist/composables/tables/data-table/page-scroll.js

@@ -1,6 +1,6 @@
-import { nextTick, onMounted, onScopeDispose, shallowRef, toValue, watchEffect } from "vue";
-import { useElementSize, useIntersectionObserver } from "@vueuse/core";
-import { get as get$1, set as set$1 } from "@vueuse/shared";
+import { get, set } from "../../../vendor/@vueuse/shared/dist/index.js";
+import { unrefElement, useElementSize, useEventListener, useIntersectionObserver, useWindowSize } from "../../../vendor/@vueuse/core/dist/index.js";
+import { nextTick, onMounted, onScopeDispose, shallowRef, toValue, watch, watchEffect } from "vue";
 //#region src/composables/tables/data-table/page-scroll.ts
 /**
 * How much of a table, from its top, must be on screen before its pagination bar sticks: the
@@ -34,7 +34,7 @@ function scrollPageBy(top) {
 function usePageScroll(wrapper, stickyOffset) {
 	async function revealTableTop() {
 		await nextTick();
-		const element = get$1(wrapper);
+		const element = get(wrapper);
 		if (!element) return;
 		const scroller = findScroller(element);
 		const viewTop = scroller ? scroller.getBoundingClientRect().top : toValue(stickyOffset) ?? 0;
@@ -54,19 +54,24 @@ function useStickyPaginationBar(wrapper, enabled) {
 	const canStick = shallowRef(true);
 	const root = shallowRef();
 	onMounted(() => {
-		const element = get$1(wrapper);
-		if (element) set$1(root, findScroller(element));
+		const element = get(wrapper);
+		if (element) set(root, findScroller(element));
 	});
-	useIntersectionObserver(() => toValue(enabled) ? get$1(wrapper) : void 0, ([entry]) => {
+	useIntersectionObserver(() => toValue(enabled) ? get(wrapper) : void 0, ([entry]) => {
 		if (!entry) return;
-		set$1(canStick, entry.isIntersecting || entry.boundingClientRect.bottom <= (entry.rootBounds?.top ?? 0));
+		set(canStick, entry.isIntersecting || entry.boundingClientRect.bottom <= (entry.rootBounds?.top ?? 0));
 	}, {
 		root,
 		rootMargin: `0px 0px -${STICK_AFTER}px 0px`
 	});
 	return canStick;
 }
-/** The height of each pagination bar stuck to the page, by table; the page's floating parts clear the tallest. */
+/**
+* How far above the bar a bar resting at its own place still counts as covered: a part docked in the
+* bottom corner (rotki's task dock is 82px with its offset) reaches over the bar's top by about this much.
+*/
+var RESTING_CLEARANCE = 48;
+/** How much of the view's bottom each pagination bar covers, by table; the page's floating parts clear the most. */
 var stuckBarHeights = /* @__PURE__ */ new Map();
 function publishStickyBottom() {
 	if (typeof document === "undefined") return;
@@ -77,10 +82,12 @@ function publishStickyBottom() {
 /**
 * Publishes how much of the view's bottom a stuck pagination bar covers, as `--rui-sticky-bottom` on
 * the document root, so the page's own floating parts (a dock, a FAB) can rise above the bar instead of
-* covering its page buttons. Only a bar stuck to the page counts: one stuck inside a scrolling area
-* sits under nothing the page floats.
+* covering its page buttons. A bar resting at its own place in the bottom band of the view counts too,
+* since it sits in the same corner; it covers from its top down, which is more than its height when it
+* rests above the view's bottom, so the parts keep the same gap above it as above a stuck bar. Only a
+* bar at page level counts: one inside a scrolling area sits under nothing the page floats.
 *
-* @param sentinel - an empty element at the bar's own place after the rows; while it is below the view, the bar is stuck
+* @param sentinel - an empty element at the bar's own place after the rows; while it is below the view's bottom band, the bar covers that corner
 * @param bar - the bar, measured for its height
 * @param canStick - whether the bar may stick at all
 */
@@ -88,21 +95,45 @@ function useStickyBottomInset(sentinel, bar, canStick) {
 	const id = Symbol("sticky-pagination-bar");
 	const belowView = shallowRef(false);
 	const pageLevel = shallowRef(false);
+	const covered = shallowRef(0);
 	const { height } = useElementSize(bar, void 0, { box: "border-box" });
+	const { height: viewHeight } = useWindowSize();
+	let frame = 0;
+	/** From the bar's top to the view's bottom; a stuck bar sits on that bottom, so this is its height. */
+	function measureCovered() {
+		frame = 0;
+		const element = unrefElement(bar);
+		if (!element) return;
+		set(covered, Math.max(get(height), Math.ceil(get(viewHeight) - element.getBoundingClientRect().top)));
+	}
+	/** A resting bar moves with the page, so while it is in the band, follow it once per frame. */
+	function scheduleMeasure() {
+		if (get(belowView) && !frame) frame = requestAnimationFrame(measureCovered);
+	}
+	useEventListener("scroll", scheduleMeasure, {
+		capture: true,
+		passive: true
+	});
 	onMounted(() => {
-		const element = get$1(sentinel);
-		set$1(pageLevel, !!element && !findScroller(element));
+		const element = get(sentinel);
+		set(pageLevel, !!element && !findScroller(element));
 	});
 	useIntersectionObserver(sentinel, ([entry]) => {
 		if (!entry) return;
-		set$1(belowView, !entry.isIntersecting && entry.boundingClientRect.top >= (entry.rootBounds?.bottom ?? Number.POSITIVE_INFINITY));
-	});
+		set(belowView, !entry.isIntersecting && entry.boundingClientRect.top >= (entry.rootBounds?.bottom ?? Number.POSITIVE_INFINITY));
+	}, { rootMargin: () => `0px 0px -${Math.ceil(get(height)) + RESTING_CLEARANCE}px 0px` });
+	watch([
+		belowView,
+		height,
+		viewHeight
+	], () => measureCovered());
 	watchEffect(() => {
-		if (get$1(pageLevel) && toValue(canStick) && get$1(belowView) && get$1(height) > 0) stuckBarHeights.set(id, get$1(height));
+		if (get(pageLevel) && toValue(canStick) && get(belowView) && get(height) > 0) stuckBarHeights.set(id, Math.max(get(height), get(covered)));
 		else stuckBarHeights.delete(id);
 		publishStickyBottom();
 	});
 	onScopeDispose(() => {
+		if (frame) cancelAnimationFrame(frame);
 		stuckBarHeights.delete(id);
 		publishStickyBottom();
 	});

package/dist/composables/tables/data-table/page-scroll.js.map

@@ -1 +1 @@
-{"version":3,"file":"page-scroll.js","names":[],"sources":["../../../../src/composables/tables/data-table/page-scroll.ts"],"sourcesContent":["import type { MaybeComputedElementRef } from '@vueuse/core';\nimport type { MaybeRefOrGetter, Ref } from 'vue';\n\nexport interface UsePageScrollReturn {\n  /** Scroll the table's top into view, if it has scrolled above the visible area. */\n  revealTableTop: () => Promise<void>;\n}\n\n/**\n * How much of a table, from its top, must be on screen before its pagination bar sticks: the\n * column header and the first rows. A table just scrolling in from below keeps its bar under the\n * rows, rather than showing the bar on top of the header.\n */\nconst STICK_AFTER = 128;\n\n/**\n * The nearest ancestor that scrolls vertically. `undefined` means the page itself does, through\n * the window or a scrolling `<body>`, which is where a sticky offset such as an app bar applies.\n */\nfunction findScroller(element: HTMLElement): HTMLElement | undefined {\n  let node = element.parentElement;\n  while (node && node !== document.body && node !== document.documentElement) {\n    const { overflowY } = getComputedStyle(node);\n    if ((overflowY === 'auto' || overflowY === 'scroll') && node.scrollHeight > node.clientHeight)\n      return node;\n    node = node.parentElement;\n  }\n  return undefined;\n}\n\nfunction scrollPageBy(top: number): void {\n  const body = document.body;\n  if (body.scrollHeight > body.clientHeight && ['auto', 'scroll'].includes(getComputedStyle(body).overflowY))\n    body.scrollBy({ top });\n  else\n    window.scrollBy({ top });\n}\n\n/**\n * After a page change, brings the table's first row back into view so the new page reads from the\n * top. It scrolls only when the table's top sits above the visible area, as it does after paging\n * from the bottom bar of a long page; a table that already shows its top stays put, so paging never\n * makes the view jump.\n */\nexport function usePageScroll(\n  wrapper: Readonly<Ref<HTMLElement | null | undefined>>,\n  stickyOffset: MaybeRefOrGetter<number | undefined>,\n): UsePageScrollReturn {\n  async function revealTableTop(): Promise<void> {\n    await nextTick();\n    const element = get(wrapper);\n    if (!element)\n      return;\n\n    const scroller = findScroller(element);\n    const viewTop = scroller ? scroller.getBoundingClientRect().top : (toValue(stickyOffset) ?? 0);\n    const distance = element.getBoundingClientRect().top - viewTop;\n    if (distance >= 0)\n      return;\n\n    if (scroller)\n      scroller.scrollBy({ top: distance });\n    else\n      scrollPageBy(distance);\n  }\n\n  return { revealTableTop };\n}\n\n/**\n * Whether the pagination bar may stick: true once the top {@link STICK_AFTER}px of the table are\n * inside its scrolling area. It starts true, so a page without IntersectionObserver keeps the bar\n * sticky.\n */\nexport function useStickyPaginationBar(\n  wrapper: Readonly<Ref<HTMLElement | null | undefined>>,\n  enabled: MaybeRefOrGetter<boolean>,\n): Readonly<Ref<boolean>> {\n  const canStick = shallowRef<boolean>(true);\n  const root = shallowRef<HTMLElement>();\n\n  onMounted(() => {\n    const element = get(wrapper);\n    if (element)\n      set(root, findScroller(element));\n  });\n\n  useIntersectionObserver(\n    () => (toValue(enabled) ? get(wrapper) : undefined),\n    ([entry]) => {\n      if (!entry)\n        return;\n      // also true once the table has scrolled past the top, when the bar is out of view anyway\n      set(canStick, entry.isIntersecting || entry.boundingClientRect.bottom <= (entry.rootBounds?.top ?? 0));\n    },\n    { root, rootMargin: `0px 0px -${STICK_AFTER}px 0px` },\n  );\n\n  return canStick;\n}\n\n/** The height of each pagination bar stuck to the page, by table; the page's floating parts clear the tallest. */\nconst stuckBarHeights = new Map<symbol, number>();\n\nfunction publishStickyBottom(): void {\n  if (typeof document === 'undefined')\n    return;\n  const style = document.documentElement.style;\n  if (stuckBarHeights.size === 0)\n    style.removeProperty('--rui-sticky-bottom');\n  else\n    style.setProperty('--rui-sticky-bottom', `${Math.max(...stuckBarHeights.values())}px`);\n}\n\n/**\n * Publishes how much of the view's bottom a stuck pagination bar covers, as `--rui-sticky-bottom` on\n * the document root, so the page's own floating parts (a dock, a FAB) can rise above the bar instead of\n * covering its page buttons. Only a bar stuck to the page counts: one stuck inside a scrolling area\n * sits under nothing the page floats.\n *\n * @param sentinel - an empty element at the bar's own place after the rows; while it is below the view, the bar is stuck\n * @param bar - the bar, measured for its height\n * @param canStick - whether the bar may stick at all\n */\nexport function useStickyBottomInset(\n  sentinel: Readonly<Ref<HTMLElement | null | undefined>>,\n  bar: MaybeComputedElementRef,\n  canStick: MaybeRefOrGetter<boolean>,\n): void {\n  const id = Symbol('sticky-pagination-bar');\n  const belowView = shallowRef<boolean>(false);\n  const pageLevel = shallowRef<boolean>(false);\n  const { height } = useElementSize(bar, undefined, { box: 'border-box' });\n\n  onMounted(() => {\n    const element = get(sentinel);\n    set(pageLevel, !!element && !findScroller(element));\n  });\n\n  useIntersectionObserver(sentinel, ([entry]) => {\n    if (!entry)\n      return;\n    // no root bounds (a cross-origin frame) reads as not stuck, which leaves the floating parts where they are\n    set(belowView, !entry.isIntersecting && entry.boundingClientRect.top >= (entry.rootBounds?.bottom ?? Number.POSITIVE_INFINITY));\n  });\n\n  watchEffect(() => {\n    if (get(pageLevel) && toValue(canStick) && get(belowView) && get(height) > 0)\n      stuckBarHeights.set(id, get(height));\n    else\n      stuckBarHeights.delete(id);\n    publishStickyBottom();\n  });\n\n  onScopeDispose(() => {\n    stuckBarHeights.delete(id);\n    publishStickyBottom();\n  });\n}\n"],"mappings":"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"}
+{"version":3,"file":"page-scroll.js","names":[],"sources":["../../../../src/composables/tables/data-table/page-scroll.ts"],"sourcesContent":["import type { MaybeRefOrGetter, Ref } from 'vue';\nimport type { MaybeElementRef } from '@/types/dom';\n\nexport interface UsePageScrollReturn {\n  /** Scroll the table's top into view, if it has scrolled above the visible area. */\n  revealTableTop: () => Promise<void>;\n}\n\n/**\n * How much of a table, from its top, must be on screen before its pagination bar sticks: the\n * column header and the first rows. A table just scrolling in from below keeps its bar under the\n * rows, rather than showing the bar on top of the header.\n */\nconst STICK_AFTER = 128;\n\n/**\n * The nearest ancestor that scrolls vertically. `undefined` means the page itself does, through\n * the window or a scrolling `<body>`, which is where a sticky offset such as an app bar applies.\n */\nfunction findScroller(element: HTMLElement): HTMLElement | undefined {\n  let node = element.parentElement;\n  while (node && node !== document.body && node !== document.documentElement) {\n    const { overflowY } = getComputedStyle(node);\n    if ((overflowY === 'auto' || overflowY === 'scroll') && node.scrollHeight > node.clientHeight)\n      return node;\n    node = node.parentElement;\n  }\n  return undefined;\n}\n\nfunction scrollPageBy(top: number): void {\n  const body = document.body;\n  if (body.scrollHeight > body.clientHeight && ['auto', 'scroll'].includes(getComputedStyle(body).overflowY))\n    body.scrollBy({ top });\n  else\n    window.scrollBy({ top });\n}\n\n/**\n * After a page change, brings the table's first row back into view so the new page reads from the\n * top. It scrolls only when the table's top sits above the visible area, as it does after paging\n * from the bottom bar of a long page; a table that already shows its top stays put, so paging never\n * makes the view jump.\n */\nexport function usePageScroll(\n  wrapper: Readonly<Ref<HTMLElement | null | undefined>>,\n  stickyOffset: MaybeRefOrGetter<number | undefined>,\n): UsePageScrollReturn {\n  async function revealTableTop(): Promise<void> {\n    await nextTick();\n    const element = get(wrapper);\n    if (!element)\n      return;\n\n    const scroller = findScroller(element);\n    const viewTop = scroller ? scroller.getBoundingClientRect().top : (toValue(stickyOffset) ?? 0);\n    const distance = element.getBoundingClientRect().top - viewTop;\n    if (distance >= 0)\n      return;\n\n    if (scroller)\n      scroller.scrollBy({ top: distance });\n    else\n      scrollPageBy(distance);\n  }\n\n  return { revealTableTop };\n}\n\n/**\n * Whether the pagination bar may stick: true once the top {@link STICK_AFTER}px of the table are\n * inside its scrolling area. It starts true, so a page without IntersectionObserver keeps the bar\n * sticky.\n */\nexport function useStickyPaginationBar(\n  wrapper: Readonly<Ref<HTMLElement | null | undefined>>,\n  enabled: MaybeRefOrGetter<boolean>,\n): Readonly<Ref<boolean>> {\n  const canStick = shallowRef<boolean>(true);\n  const root = shallowRef<HTMLElement>();\n\n  onMounted(() => {\n    const element = get(wrapper);\n    if (element)\n      set(root, findScroller(element));\n  });\n\n  useIntersectionObserver(\n    () => (toValue(enabled) ? get(wrapper) : undefined),\n    ([entry]) => {\n      if (!entry)\n        return;\n      // also true once the table has scrolled past the top, when the bar is out of view anyway\n      set(canStick, entry.isIntersecting || entry.boundingClientRect.bottom <= (entry.rootBounds?.top ?? 0));\n    },\n    { root, rootMargin: `0px 0px -${STICK_AFTER}px 0px` },\n  );\n\n  return canStick;\n}\n\n/**\n * How far above the bar a bar resting at its own place still counts as covered: a part docked in the\n * bottom corner (rotki's task dock is 82px with its offset) reaches over the bar's top by about this much.\n */\nconst RESTING_CLEARANCE = 48;\n\n/** How much of the view's bottom each pagination bar covers, by table; the page's floating parts clear the most. */\nconst stuckBarHeights = new Map<symbol, number>();\n\nfunction publishStickyBottom(): void {\n  if (typeof document === 'undefined')\n    return;\n  const style = document.documentElement.style;\n  if (stuckBarHeights.size === 0)\n    style.removeProperty('--rui-sticky-bottom');\n  else\n    style.setProperty('--rui-sticky-bottom', `${Math.max(...stuckBarHeights.values())}px`);\n}\n\n/**\n * Publishes how much of the view's bottom a stuck pagination bar covers, as `--rui-sticky-bottom` on\n * the document root, so the page's own floating parts (a dock, a FAB) can rise above the bar instead of\n * covering its page buttons. A bar resting at its own place in the bottom band of the view counts too,\n * since it sits in the same corner; it covers from its top down, which is more than its height when it\n * rests above the view's bottom, so the parts keep the same gap above it as above a stuck bar. Only a\n * bar at page level counts: one inside a scrolling area sits under nothing the page floats.\n *\n * @param sentinel - an empty element at the bar's own place after the rows; while it is below the view's bottom band, the bar covers that corner\n * @param bar - the bar, measured for its height\n * @param canStick - whether the bar may stick at all\n */\nexport function useStickyBottomInset(\n  sentinel: Readonly<Ref<HTMLElement | null | undefined>>,\n  bar: MaybeElementRef,\n  canStick: MaybeRefOrGetter<boolean>,\n): void {\n  const id = Symbol('sticky-pagination-bar');\n  const belowView = shallowRef<boolean>(false);\n  const pageLevel = shallowRef<boolean>(false);\n  const covered = shallowRef<number>(0);\n  const { height } = useElementSize(bar, undefined, { box: 'border-box' });\n  const { height: viewHeight } = useWindowSize();\n  let frame = 0;\n\n  /** From the bar's top to the view's bottom; a stuck bar sits on that bottom, so this is its height. */\n  function measureCovered(): void {\n    frame = 0;\n    const element = unrefElement(bar);\n    if (!element)\n      return;\n    set(covered, Math.max(get(height), Math.ceil(get(viewHeight) - element.getBoundingClientRect().top)));\n  }\n\n  /** A resting bar moves with the page, so while it is in the band, follow it once per frame. */\n  function scheduleMeasure(): void {\n    if (get(belowView) && !frame)\n      frame = requestAnimationFrame(measureCovered);\n  }\n\n  useEventListener('scroll', scheduleMeasure, { capture: true, passive: true });\n\n  onMounted(() => {\n    const element = get(sentinel);\n    set(pageLevel, !!element && !findScroller(element));\n  });\n\n  useIntersectionObserver(sentinel, ([entry]) => {\n    if (!entry)\n      return;\n    // no root bounds (a cross-origin frame) reads as not stuck, which leaves the floating parts where they are\n    set(belowView, !entry.isIntersecting && entry.boundingClientRect.top >= (entry.rootBounds?.bottom ?? Number.POSITIVE_INFINITY));\n  }, {\n    // the view's bottom edge, raised by the band a resting bar covers\n    rootMargin: () => `0px 0px -${Math.ceil(get(height)) + RESTING_CLEARANCE}px 0px`,\n  });\n\n  watch([belowView, height, viewHeight], () => measureCovered());\n\n  watchEffect(() => {\n    if (get(pageLevel) && toValue(canStick) && get(belowView) && get(height) > 0)\n      stuckBarHeights.set(id, Math.max(get(height), get(covered)));\n    else\n      stuckBarHeights.delete(id);\n    publishStickyBottom();\n  });\n\n  onScopeDispose(() => {\n    if (frame)\n      cancelAnimationFrame(frame);\n    stuckBarHeights.delete(id);\n    publishStickyBottom();\n  });\n}\n"],"mappings":"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"}

package/dist/composables/tables/data-table/pagination.js

@@ -1,6 +1,6 @@
+import { get, set } from "../../../vendor/@vueuse/shared/dist/index.js";
 import { isRow } from "./types.js";
 import { computed, readonly, ref, shallowRef, watch } from "vue";
-import { get, set } from "@vueuse/shared";
 //#region src/composables/tables/data-table/pagination.ts
 /**
 * Skip data rows until the page start offset, tracking the last group header seen.

package/dist/composables/tables/data-table/selection.js

@@ -1,9 +1,8 @@
 import { assert } from "../../../utils/assert.js";
+import { get, isDefined, set } from "../../../vendor/@vueuse/shared/dist/index.js";
 import { useTimeoutManager } from "../../timeout-manager.js";
 import { isRow } from "./types.js";
 import { computed, shallowRef, toValue, watch } from "vue";
-import { isDefined } from "@vueuse/core";
-import { get as get$1, set as set$1 } from "@vueuse/shared";
 //#region src/composables/tables/data-table/selection.ts
 function useTableSelection(options, deps) {
 	const { rowAttr, multiPageSelect, disabledRows } = options;
@@ -12,30 +11,30 @@ function useTableSelection(options, deps) {
 	const lastSelectedIndex = shallowRef(-1);
 	const internalSelectedData = shallowRef([]);
 	const { create: scheduleShiftSelect } = useTimeoutManager();
-	watch(selectedData, (val) => set$1(internalSelectedData, val ?? []), { immediate: true });
-	const visibleIdentifiers = computed(() => get$1(filtered).filter(isRow).map((row) => row[rowAttr]));
-	const selectedSet = computed(() => new Set(get$1(selectedData) ?? []));
+	watch(selectedData, (val) => set(internalSelectedData, val ?? []), { immediate: true });
+	const visibleIdentifiers = computed(() => get(filtered).filter(isRow).map((row) => row[rowAttr]));
+	const selectedSet = computed(() => new Set(get(selectedData) ?? []));
 	const disabledRowKeySet = computed(() => {
 		const currentDisabledRows = toValue(disabledRows);
 		if (!currentDisabledRows || !rowAttr) return /* @__PURE__ */ new Set();
 		return new Set(currentDisabledRows.map((row) => row[rowAttr]));
 	});
 	const isAllSelected = computed(() => {
-		const selectedRows = get$1(selectedData);
+		const selectedRows = get(selectedData);
 		if (!selectedRows || selectedRows.length === 0) return false;
-		const selected = get$1(selectedSet);
-		return get$1(visibleIdentifiers).every((id) => selected.has(id));
+		const selected = get(selectedSet);
+		return get(visibleIdentifiers).every((id) => selected.has(id));
 	});
 	const indeterminate = computed(() => {
-		const selectedRows = get$1(selectedData);
+		const selectedRows = get(selectedData);
 		if (!selectedRows) return false;
-		return selectedRows.length > 0 && !get$1(isAllSelected);
+		return selectedRows.length > 0 && !get(isAllSelected);
 	});
 	function isSelected(identifier) {
-		return get$1(selectedSet).has(identifier);
+		return get(selectedSet).has(identifier);
 	}
 	function isDisabledRow(rowKey) {
-		return get$1(disabledRowKeySet).has(rowKey);
+		return get(disabledRowKeySet).has(rowKey);
 	}
 	function isSelectable(rowKey) {
 		return isSelected(rowKey) || !isDisabledRow(rowKey);
@@ -44,30 +43,30 @@ function useTableSelection(options, deps) {
 		return isSelected(rowKey) && isDisabledRow(rowKey);
 	}
 	function resetCheckboxShiftState() {
-		set$1(shiftClicked, false);
-		set$1(lastSelectedIndex, -1);
+		set(shiftClicked, false);
+		set(lastSelectedIndex, -1);
 	}
 	function onToggleAll(checked) {
-		const selectedRows = get$1(selectedData);
+		const selectedRows = get(selectedData);
 		if (!isDefined(selectedRows)) return;
 		if (!multiPageSelect) {
-			if (checked) set$1(selectedData, get$1(visibleIdentifiers).filter(isSelectable));
-			else set$1(selectedData, get$1(visibleIdentifiers).filter(mustSelect));
-		} else if (checked) set$1(selectedData, Array.from(/* @__PURE__ */ new Set([...selectedRows, ...get$1(visibleIdentifiers).filter(isSelectable)])));
+			if (checked) set(selectedData, get(visibleIdentifiers).filter(isSelectable));
+			else set(selectedData, get(visibleIdentifiers).filter(mustSelect));
+		} else if (checked) set(selectedData, Array.from(/* @__PURE__ */ new Set([...selectedRows, ...get(visibleIdentifiers).filter(isSelectable)])));
 		else {
-			const visibleSet = new Set(get$1(visibleIdentifiers));
-			const mustSelectSet = new Set(get$1(visibleIdentifiers).filter(mustSelect));
-			set$1(selectedData, selectedRows.filter((rowKey) => !visibleSet.has(rowKey) || mustSelectSet.has(rowKey)));
+			const visibleSet = new Set(get(visibleIdentifiers));
+			const mustSelectSet = new Set(get(visibleIdentifiers).filter(mustSelect));
+			set(selectedData, selectedRows.filter((rowKey) => !visibleSet.has(rowKey) || mustSelectSet.has(rowKey)));
 		}
 	}
 	function onSelect(checked, value, userAction = false) {
-		if (get$1(shiftClicked) && userAction) return;
-		const selectedRows = get$1(internalSelectedData);
+		if (get(shiftClicked) && userAction) return;
+		const selectedRows = get(internalSelectedData);
 		if (!selectedRows) return;
 		const selected = isSelected(value);
-		if (checked && !selected) set$1(internalSelectedData, [...selectedRows, value]);
-		else if (!checked && selected) set$1(internalSelectedData, selectedRows.filter((r) => r !== value));
-		if (userAction) set$1(selectedData, get$1(internalSelectedData));
+		if (checked && !selected) set(internalSelectedData, [...selectedRows, value]);
+		else if (!checked && selected) set(internalSelectedData, selectedRows.filter((r) => r !== value));
+		if (userAction) set(selectedData, get(internalSelectedData));
 	}
 	function onCheckboxClick(event, value, index) {
 		const currentTarget = event.currentTarget;
@@ -76,12 +75,12 @@ function useTableSelection(options, deps) {
 		const target = event.target;
 		const nodeName = target instanceof HTMLElement ? target.nodeName : void 0;
 		const shiftKey = event.shiftKey;
-		set$1(shiftClicked, shiftKey);
+		set(shiftClicked, shiftKey);
 		if (input && nodeName !== "INPUT") {
 			if (shiftKey) scheduleShiftSelect(() => {
-				let lastIndex = get$1(lastSelectedIndex);
+				let lastIndex = get(lastSelectedIndex);
 				if (lastIndex === -1) lastIndex = index;
-				const tableData = get$1(filtered);
+				const tableData = get(filtered);
 				const lastSelectedData = tableData[lastIndex];
 				assert(lastSelectedData);
 				if (isRow(lastSelectedData)) {
@@ -90,7 +89,7 @@ function useTableSelection(options, deps) {
 					else {
 						const from = Math.min(lastIndex, index);
 						const to = Math.max(lastIndex, index);
-						const currentSelected = get$1(internalSelectedData);
+						const currentSelected = get(internalSelectedData);
 						const rangeIds = [];
 						for (let i = from; i <= to; i++) {
 							const currSelectedData = tableData[i];
@@ -100,25 +99,25 @@ function useTableSelection(options, deps) {
 						if (valueToApply) {
 							const existing = new Set(currentSelected);
 							const toAdd = rangeIds.filter((id) => !existing.has(id));
-							set$1(internalSelectedData, [...currentSelected, ...toAdd]);
+							set(internalSelectedData, [...currentSelected, ...toAdd]);
 						} else {
 							const toRemove = new Set(rangeIds);
-							set$1(internalSelectedData, currentSelected.filter((id) => !toRemove.has(id)));
+							set(internalSelectedData, currentSelected.filter((id) => !toRemove.has(id)));
 						}
 					}
-					set$1(lastSelectedIndex, index);
-					set$1(selectedData, get$1(internalSelectedData));
+					set(lastSelectedIndex, index);
+					set(selectedData, get(internalSelectedData));
 				}
 			}, 1);
-			else set$1(lastSelectedIndex, index);
+			else set(lastSelectedIndex, index);
 		}
 	}
 	function deselectRemovedRows() {
-		const currentSelected = get$1(selectedData);
+		const currentSelected = get(selectedData);
 		if (!currentSelected) return;
-		const visibleSet = new Set(get$1(visibleIdentifiers));
+		const visibleSet = new Set(get(visibleIdentifiers));
 		const remaining = currentSelected.filter((key) => visibleSet.has(key));
-		if (remaining.length !== currentSelected.length) set$1(selectedData, remaining);
+		if (remaining.length !== currentSelected.length) set(selectedData, remaining);
 	}
 	return {
 		visibleIdentifiers,