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

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,

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

@@ -1 +1 @@
-{"version":3,"file":"selection.js","names":[],"sources":["../../../../src/composables/tables/data-table/selection.ts"],"sourcesContent":["import type { ComputedRef, MaybeRefOrGetter, Ref } from 'vue';\nimport { type GroupedTableRow, isRow } from '@/composables/tables/data-table/types';\nimport { useTimeoutManager } from '@/composables/timeout-manager';\nimport { assert } from '@/utils/assert';\n\nexport interface UseTableSelectionOptions<T extends object, IdType extends keyof T> {\n  /** The property on each row used as the unique row identifier. */\n  rowAttr: IdType;\n  /** Whether selection persists across pages. */\n  multiPageSelect: boolean;\n  /** Rows that cannot be selected or deselected by the user. */\n  disabledRows: MaybeRefOrGetter<readonly T[] | undefined>;\n}\n\nexport interface UseTableSelectionDeps<T extends object, IdType extends keyof T> {\n  selectedData: Ref<T[IdType][] | undefined>;\n  filtered: ComputedRef<GroupedTableRow<T>[]>;\n}\n\nexport interface UseTableSelectionReturn<T extends object, IdType extends keyof T> {\n  visibleIdentifiers: ComputedRef<T[IdType][]>;\n  isAllSelected: ComputedRef<boolean>;\n  indeterminate: ComputedRef<boolean>;\n  isSelected: (identifier: T[IdType]) => boolean;\n  isDisabledRow: (rowKey: T[IdType]) => boolean;\n  isSelectable: (rowKey: T[IdType]) => boolean;\n  mustSelect: (rowKey: T[IdType]) => boolean;\n  onToggleAll: (checked: boolean) => void;\n  onSelect: (checked: boolean, value: T[IdType], userAction?: boolean) => void;\n  onCheckboxClick: (event: MouseEvent, value: T[IdType], index: number) => void;\n  deselectRemovedRows: () => void;\n  resetCheckboxShiftState: () => void;\n}\n\nexport function useTableSelection<T extends object, IdType extends keyof T>(\n  options: UseTableSelectionOptions<T, IdType>,\n  deps: UseTableSelectionDeps<T, IdType>,\n): UseTableSelectionReturn<T, IdType> {\n  const { rowAttr, multiPageSelect, disabledRows } = options;\n  const { selectedData, filtered } = deps;\n\n  const shiftClicked: Ref<boolean> = shallowRef(false);\n  const lastSelectedIndex: Ref<number> = shallowRef(-1);\n  const internalSelectedData: Ref<T[IdType][]> = shallowRef([]);\n  const { create: scheduleShiftSelect } = useTimeoutManager();\n\n  // Sync external selection model to internal state\n  watch(selectedData, val => set(internalSelectedData, val ?? []), { immediate: true });\n\n  const visibleIdentifiers = computed<T[IdType][]>(() =>\n    get(filtered)\n      .filter(isRow)\n      .map(row => row[rowAttr]),\n  );\n\n  const selectedSet = computed<Set<T[IdType]>>(() => new Set(get(selectedData) ?? []));\n\n  const disabledRowKeySet = computed<Set<T[IdType]>>(() => {\n    const currentDisabledRows = toValue(disabledRows);\n    if (!currentDisabledRows || !rowAttr)\n      return new Set<T[IdType]>();\n    return new Set<T[IdType]>(currentDisabledRows.map((row: T) => row[rowAttr]));\n  });\n\n  const isAllSelected = computed<boolean>(() => {\n    const selectedRows = get(selectedData);\n    if (!selectedRows || selectedRows.length === 0)\n      return false;\n\n    const selected = get(selectedSet);\n    return get(visibleIdentifiers).every(id => selected.has(id));\n  });\n\n  const indeterminate = computed<boolean>(() => {\n    const selectedRows = get(selectedData);\n    if (!selectedRows)\n      return false;\n\n    return selectedRows.length > 0 && !get(isAllSelected);\n  });\n\n  function isSelected(identifier: T[IdType]): boolean {\n    return get(selectedSet).has(identifier);\n  }\n\n  function isDisabledRow(rowKey: T[IdType]): boolean {\n    return get(disabledRowKeySet).has(rowKey);\n  }\n\n  function isSelectable(rowKey: T[IdType]): boolean {\n    return isSelected(rowKey) || !isDisabledRow(rowKey);\n  }\n\n  function mustSelect(rowKey: T[IdType]): boolean {\n    return isSelected(rowKey) && isDisabledRow(rowKey);\n  }\n\n  function resetCheckboxShiftState(): void {\n    set(shiftClicked, false);\n    set(lastSelectedIndex, -1);\n  }\n\n  function onToggleAll(checked: boolean): void {\n    const selectedRows = get(selectedData);\n\n    if (!isDefined(selectedRows))\n      return;\n\n    if (!multiPageSelect) {\n      if (checked)\n        set(selectedData, get(visibleIdentifiers).filter(isSelectable));\n      else set(selectedData, get(visibleIdentifiers).filter(mustSelect));\n    }\n    else {\n      if (checked) {\n        set(\n          selectedData,\n          Array.from(new Set([...selectedRows, ...get(visibleIdentifiers).filter(isSelectable)])),\n        );\n      }\n      else {\n        const visibleSet = new Set(get(visibleIdentifiers));\n        const mustSelectSet = new Set(get(visibleIdentifiers).filter(mustSelect));\n        set(\n          selectedData,\n          selectedRows.filter(rowKey => !visibleSet.has(rowKey) || mustSelectSet.has(rowKey)),\n        );\n      }\n    }\n  }\n\n  function onSelect(checked: boolean, value: T[IdType], userAction: boolean = false): void {\n    if (get(shiftClicked) && userAction)\n      return;\n\n    const selectedRows = get(internalSelectedData);\n    if (!selectedRows)\n      return;\n\n    const selected = isSelected(value);\n\n    if (checked && !selected) {\n      set(internalSelectedData, [...selectedRows, value]);\n    }\n    else if (!checked && selected) {\n      set(\n        internalSelectedData,\n        selectedRows.filter(r => r !== value),\n      );\n    }\n\n    if (userAction)\n      set(selectedData, get(internalSelectedData));\n  }\n\n  function onCheckboxClick(event: MouseEvent, value: T[IdType], index: number): void {\n    const currentTarget = event.currentTarget;\n    if (!(currentTarget instanceof HTMLElement))\n      return;\n\n    const input = currentTarget.querySelector('input');\n    const target = event.target;\n    const nodeName = target instanceof HTMLElement ? target.nodeName : undefined;\n\n    const shiftKey = event.shiftKey;\n    set(shiftClicked, shiftKey);\n\n    if (input && nodeName !== 'INPUT') {\n      if (shiftKey) {\n        scheduleShiftSelect(() => {\n          let lastIndex = get(lastSelectedIndex);\n          if (lastIndex === -1)\n            lastIndex = index;\n          const tableData = get(filtered);\n          const lastSelectedData = tableData[lastIndex];\n          assert(lastSelectedData);\n\n          if (isRow(lastSelectedData)) {\n            const valueToApply = isSelected(lastSelectedData[rowAttr]);\n\n            if (lastIndex === index) {\n              onSelect(!valueToApply, value);\n            }\n            else {\n              const from = Math.min(lastIndex, index);\n              const to = Math.max(lastIndex, index);\n\n              // Batch: collect all IDs in range, then update once\n              const currentSelected = get(internalSelectedData);\n              const rangeIds: T[IdType][] = [];\n              for (let i = from; i <= to; i++) {\n                const currSelectedData = tableData[i];\n                assert(currSelectedData);\n                if (isRow(currSelectedData) && !isDisabledRow(currSelectedData[rowAttr]))\n                  rangeIds.push(currSelectedData[rowAttr]);\n              }\n\n              if (valueToApply) {\n                const existing = new Set(currentSelected);\n                const toAdd = rangeIds.filter(id => !existing.has(id));\n                set(internalSelectedData, [...currentSelected, ...toAdd]);\n              }\n              else {\n                const toRemove = new Set(rangeIds);\n                set(internalSelectedData, currentSelected.filter(id => !toRemove.has(id)));\n              }\n            }\n\n            set(lastSelectedIndex, index);\n            set(selectedData, get(internalSelectedData));\n          }\n        }, 1);\n      }\n      else {\n        set(lastSelectedIndex, index);\n      }\n    }\n  }\n\n  function deselectRemovedRows(): void {\n    const currentSelected = get(selectedData);\n    if (!currentSelected)\n      return;\n\n    const visibleSet = new Set(get(visibleIdentifiers));\n    const remaining = currentSelected.filter(key => visibleSet.has(key));\n\n    if (remaining.length !== currentSelected.length)\n      set(selectedData, remaining);\n  }\n\n  return {\n    visibleIdentifiers,\n    isAllSelected,\n    indeterminate,\n    isSelected,\n    isDisabledRow,\n    isSelectable,\n    mustSelect,\n    onToggleAll,\n    onSelect,\n    onCheckboxClick,\n    deselectRemovedRows,\n    resetCheckboxShiftState,\n  };\n}\n"],"mappings":"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"}
+{"version":3,"file":"selection.js","names":[],"sources":["../../../../src/composables/tables/data-table/selection.ts"],"sourcesContent":["import type { ComputedRef, MaybeRefOrGetter, Ref } from 'vue';\nimport { type GroupedTableRow, isRow } from '@/composables/tables/data-table/types';\nimport { useTimeoutManager } from '@/composables/timeout-manager';\nimport { assert } from '@/utils/assert';\n\nexport interface UseTableSelectionOptions<T extends object, IdType extends keyof T> {\n  /** The property on each row used as the unique row identifier. */\n  rowAttr: IdType;\n  /** Whether selection persists across pages. */\n  multiPageSelect: boolean;\n  /** Rows that cannot be selected or deselected by the user. */\n  disabledRows: MaybeRefOrGetter<readonly T[] | undefined>;\n}\n\nexport interface UseTableSelectionDeps<T extends object, IdType extends keyof T> {\n  selectedData: Ref<T[IdType][] | undefined>;\n  filtered: ComputedRef<GroupedTableRow<T>[]>;\n}\n\nexport interface UseTableSelectionReturn<T extends object, IdType extends keyof T> {\n  visibleIdentifiers: ComputedRef<T[IdType][]>;\n  isAllSelected: ComputedRef<boolean>;\n  indeterminate: ComputedRef<boolean>;\n  isSelected: (identifier: T[IdType]) => boolean;\n  isDisabledRow: (rowKey: T[IdType]) => boolean;\n  isSelectable: (rowKey: T[IdType]) => boolean;\n  mustSelect: (rowKey: T[IdType]) => boolean;\n  onToggleAll: (checked: boolean) => void;\n  onSelect: (checked: boolean, value: T[IdType], userAction?: boolean) => void;\n  onCheckboxClick: (event: MouseEvent, value: T[IdType], index: number) => void;\n  deselectRemovedRows: () => void;\n  resetCheckboxShiftState: () => void;\n}\n\nexport function useTableSelection<T extends object, IdType extends keyof T>(\n  options: UseTableSelectionOptions<T, IdType>,\n  deps: UseTableSelectionDeps<T, IdType>,\n): UseTableSelectionReturn<T, IdType> {\n  const { rowAttr, multiPageSelect, disabledRows } = options;\n  const { selectedData, filtered } = deps;\n\n  const shiftClicked: Ref<boolean> = shallowRef(false);\n  const lastSelectedIndex: Ref<number> = shallowRef(-1);\n  const internalSelectedData: Ref<T[IdType][]> = shallowRef([]);\n  const { create: scheduleShiftSelect } = useTimeoutManager();\n\n  // Sync external selection model to internal state\n  watch(selectedData, val => set(internalSelectedData, val ?? []), { immediate: true });\n\n  const visibleIdentifiers = computed<T[IdType][]>(() =>\n    get(filtered)\n      .filter(isRow)\n      .map(row => row[rowAttr]),\n  );\n\n  const selectedSet = computed<Set<T[IdType]>>(() => new Set(get(selectedData) ?? []));\n\n  const disabledRowKeySet = computed<Set<T[IdType]>>(() => {\n    const currentDisabledRows = toValue(disabledRows);\n    if (!currentDisabledRows || !rowAttr)\n      return new Set<T[IdType]>();\n    return new Set<T[IdType]>(currentDisabledRows.map((row: T) => row[rowAttr]));\n  });\n\n  const isAllSelected = computed<boolean>(() => {\n    const selectedRows = get(selectedData);\n    if (!selectedRows || selectedRows.length === 0)\n      return false;\n\n    const selected = get(selectedSet);\n    return get(visibleIdentifiers).every(id => selected.has(id));\n  });\n\n  const indeterminate = computed<boolean>(() => {\n    const selectedRows = get(selectedData);\n    if (!selectedRows)\n      return false;\n\n    return selectedRows.length > 0 && !get(isAllSelected);\n  });\n\n  function isSelected(identifier: T[IdType]): boolean {\n    return get(selectedSet).has(identifier);\n  }\n\n  function isDisabledRow(rowKey: T[IdType]): boolean {\n    return get(disabledRowKeySet).has(rowKey);\n  }\n\n  function isSelectable(rowKey: T[IdType]): boolean {\n    return isSelected(rowKey) || !isDisabledRow(rowKey);\n  }\n\n  function mustSelect(rowKey: T[IdType]): boolean {\n    return isSelected(rowKey) && isDisabledRow(rowKey);\n  }\n\n  function resetCheckboxShiftState(): void {\n    set(shiftClicked, false);\n    set(lastSelectedIndex, -1);\n  }\n\n  function onToggleAll(checked: boolean): void {\n    const selectedRows = get(selectedData);\n\n    if (!isDefined(selectedRows))\n      return;\n\n    if (!multiPageSelect) {\n      if (checked)\n        set(selectedData, get(visibleIdentifiers).filter(isSelectable));\n      else set(selectedData, get(visibleIdentifiers).filter(mustSelect));\n    }\n    else {\n      if (checked) {\n        set(\n          selectedData,\n          Array.from(new Set([...selectedRows, ...get(visibleIdentifiers).filter(isSelectable)])),\n        );\n      }\n      else {\n        const visibleSet = new Set(get(visibleIdentifiers));\n        const mustSelectSet = new Set(get(visibleIdentifiers).filter(mustSelect));\n        set(\n          selectedData,\n          selectedRows.filter(rowKey => !visibleSet.has(rowKey) || mustSelectSet.has(rowKey)),\n        );\n      }\n    }\n  }\n\n  function onSelect(checked: boolean, value: T[IdType], userAction: boolean = false): void {\n    if (get(shiftClicked) && userAction)\n      return;\n\n    const selectedRows = get(internalSelectedData);\n    if (!selectedRows)\n      return;\n\n    const selected = isSelected(value);\n\n    if (checked && !selected) {\n      set(internalSelectedData, [...selectedRows, value]);\n    }\n    else if (!checked && selected) {\n      set(\n        internalSelectedData,\n        selectedRows.filter(r => r !== value),\n      );\n    }\n\n    if (userAction)\n      set(selectedData, get(internalSelectedData));\n  }\n\n  function onCheckboxClick(event: MouseEvent, value: T[IdType], index: number): void {\n    const currentTarget = event.currentTarget;\n    if (!(currentTarget instanceof HTMLElement))\n      return;\n\n    const input = currentTarget.querySelector('input');\n    const target = event.target;\n    const nodeName = target instanceof HTMLElement ? target.nodeName : undefined;\n\n    const shiftKey = event.shiftKey;\n    set(shiftClicked, shiftKey);\n\n    if (input && nodeName !== 'INPUT') {\n      if (shiftKey) {\n        scheduleShiftSelect(() => {\n          let lastIndex = get(lastSelectedIndex);\n          if (lastIndex === -1)\n            lastIndex = index;\n          const tableData = get(filtered);\n          const lastSelectedData = tableData[lastIndex];\n          assert(lastSelectedData);\n\n          if (isRow(lastSelectedData)) {\n            const valueToApply = isSelected(lastSelectedData[rowAttr]);\n\n            if (lastIndex === index) {\n              onSelect(!valueToApply, value);\n            }\n            else {\n              const from = Math.min(lastIndex, index);\n              const to = Math.max(lastIndex, index);\n\n              // Batch: collect all IDs in range, then update once\n              const currentSelected = get(internalSelectedData);\n              const rangeIds: T[IdType][] = [];\n              for (let i = from; i <= to; i++) {\n                const currSelectedData = tableData[i];\n                assert(currSelectedData);\n                if (isRow(currSelectedData) && !isDisabledRow(currSelectedData[rowAttr]))\n                  rangeIds.push(currSelectedData[rowAttr]);\n              }\n\n              if (valueToApply) {\n                const existing = new Set(currentSelected);\n                const toAdd = rangeIds.filter(id => !existing.has(id));\n                set(internalSelectedData, [...currentSelected, ...toAdd]);\n              }\n              else {\n                const toRemove = new Set(rangeIds);\n                set(internalSelectedData, currentSelected.filter(id => !toRemove.has(id)));\n              }\n            }\n\n            set(lastSelectedIndex, index);\n            set(selectedData, get(internalSelectedData));\n          }\n        }, 1);\n      }\n      else {\n        set(lastSelectedIndex, index);\n      }\n    }\n  }\n\n  function deselectRemovedRows(): void {\n    const currentSelected = get(selectedData);\n    if (!currentSelected)\n      return;\n\n    const visibleSet = new Set(get(visibleIdentifiers));\n    const remaining = currentSelected.filter(key => visibleSet.has(key));\n\n    if (remaining.length !== currentSelected.length)\n      set(selectedData, remaining);\n  }\n\n  return {\n    visibleIdentifiers,\n    isAllSelected,\n    indeterminate,\n    isSelected,\n    isDisabledRow,\n    isSelectable,\n    mustSelect,\n    onToggleAll,\n    onSelect,\n    onCheckboxClick,\n    deselectRemovedRows,\n    resetCheckboxShiftState,\n  };\n}\n"],"mappings":"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"}

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

@@ -1,8 +1,8 @@
 import { assert } from "../../../utils/assert.js";
+import { get, set } from "../../../vendor/@vueuse/shared/dist/index.js";
 import { SortDirection } from "../../../components/tables/table-props.js";
 import { getObjectKeys } from "./types.js";
 import { computed, toValue } from "vue";
-import { get, set } from "@vueuse/shared";
 //#region src/composables/tables/data-table/sort.ts
 var SORT_COLLATOR = new Intl.Collator(void 0, {
 	sensitivity: "accent",

package/dist/composables/theme.js

@@ -1,7 +1,7 @@
+import { createSharedComposable, get, set } from "../vendor/@vueuse/shared/dist/index.js";
+import { defaultWindow, getSSRHandler, useColorMode } from "../vendor/@vueuse/core/dist/index.js";
 import { ThemeMode, defaultTheme } from "../types/theme.js";
 import { computed, ref } from "vue";
-import { createSharedComposable, defaultWindow, getSSRHandler, useColorMode } from "@vueuse/core";
-import { get as get$1, set as set$1 } from "@vueuse/shared";
 //#region src/composables/theme.ts
 var config = ref({ ...defaultTheme });
 /**
@@ -22,15 +22,15 @@ var useRotkiTheme = createSharedComposable(() => {
 		updateHTMLAttrs("html", "data-theme", mode);
 	} });
 	/** Whether the system picks the theme rather than the user. */
-	const isAutoControlled = computed(() => get$1(store) === ThemeMode.auto);
+	const isAutoControlled = computed(() => get(store) === ThemeMode.auto);
 	/** Whether the light theme is showing. */
-	const isLight = computed(() => get$1(state) === ThemeMode.light);
+	const isLight = computed(() => get(state) === ThemeMode.light);
 	/** Whether the dark theme is showing. */
-	const isDark = computed(() => get$1(state) === ThemeMode.dark);
+	const isDark = computed(() => get(state) === ThemeMode.dark);
 	/** The palette the current mode reads from. */
 	const theme = computed(() => {
-		if (get$1(isLight)) return get$1(config).light;
-		return get$1(config).dark;
+		if (get(isLight)) return get(config).light;
+		return get(config).dark;
 	});
 	/**
 	* Switches the theme.
@@ -38,15 +38,15 @@ var useRotkiTheme = createSharedComposable(() => {
 	* @param mode - the mode to switch to; an empty mode falls back to auto
 	*/
 	const switchThemeScheme = (mode) => {
-		set$1(store, mode || ThemeMode.auto);
+		set(store, mode || ThemeMode.auto);
 	};
 	/**
 	* toggle between auto|light|dark
 	*/
 	const toggleThemeMode = () => {
-		if (get$1(isAutoControlled)) switchThemeScheme(ThemeMode.light);
-		else if (get$1(isLight)) switchThemeScheme(ThemeMode.dark);
-		else if (get$1(isDark)) switchThemeScheme(ThemeMode.auto);
+		if (get(isAutoControlled)) switchThemeScheme(ThemeMode.light);
+		else if (get(isLight)) switchThemeScheme(ThemeMode.dark);
+		else if (get(isDark)) switchThemeScheme(ThemeMode.auto);
 	};
 	/**
 	* Replaces the palettes the theme draws from.
@@ -54,7 +54,7 @@ var useRotkiTheme = createSharedComposable(() => {
 	* @param newConfig - the light and dark palettes to use
 	*/
 	const setThemeConfig = (newConfig) => {
-		set$1(config, newConfig);
+		set(config, newConfig);
 	};
 	/**
 	* Sets the theme up. Call once, from the app's entry point.

package/dist/composables/theme.js.map

@@ -1 +1 @@
-{"version":3,"file":"theme.js","names":[],"sources":["../../src/composables/theme.ts"],"sourcesContent":["import { defaultWindow, getSSRHandler, useColorMode } from '@vueuse/core';\nimport { computed, type ComputedRef, type Ref, ref } from 'vue';\nimport {\n  defaultTheme,\n  type InitThemeOptions,\n  type ThemeConfig,\n  type ThemeContent,\n  type ThemeData,\n  ThemeMode,\n} from '@/types/theme';\n\nconst config: Ref<ThemeConfig> = ref({ ...defaultTheme });\n\n/**\n * The theme manager: the current mode and palette, and the calls that change\n * them. Shared, so every caller reads and writes the same theme.\n *\n * @returns the theme state and the operations on it\n */\nexport const useRotkiTheme = createSharedComposable<() => ThemeContent>(() => {\n  const updateHTMLAttrs = getSSRHandler(\n    'updateHTMLAttrs',\n    (selector, attribute, value) => {\n      if (typeof selector !== 'string' || !defaultWindow)\n        return;\n\n      const el = defaultWindow.document.querySelector(selector);\n      if (!el)\n        return;\n\n      el.setAttribute(attribute, value);\n    },\n  );\n\n  const { state, store } = useColorMode<ThemeMode>({\n    onChanged(mode, defaultHandler) {\n      defaultHandler(mode);\n      updateHTMLAttrs('html', 'data-theme', mode);\n    },\n  });\n\n  /** Whether the system picks the theme rather than the user. */\n  const isAutoControlled: ComputedRef<boolean> = computed(() => get(store) === ThemeMode.auto);\n\n  /** Whether the light theme is showing. */\n  const isLight: ComputedRef<boolean> = computed(() => get(state) === ThemeMode.light);\n\n  /** Whether the dark theme is showing. */\n  const isDark: ComputedRef<boolean> = computed(() => get(state) === ThemeMode.dark);\n\n  /** The palette the current mode reads from. */\n  const theme: ComputedRef<ThemeData> = computed(() => {\n    if (get(isLight))\n      return get(config).light;\n\n    return get(config).dark;\n  });\n\n  /**\n   * Switches the theme.\n   *\n   * @param mode - the mode to switch to; an empty mode falls back to auto\n   */\n  const switchThemeScheme = (mode: ThemeMode): void => {\n    set(store, mode || ThemeMode.auto);\n  };\n\n  /**\n   * toggle between auto|light|dark\n   */\n  const toggleThemeMode = (): void => {\n    if (get(isAutoControlled))\n      switchThemeScheme(ThemeMode.light);\n    else if (get(isLight))\n      switchThemeScheme(ThemeMode.dark);\n    else if (get(isDark))\n      switchThemeScheme(ThemeMode.auto);\n  };\n\n  /**\n   * Replaces the palettes the theme draws from.\n   *\n   * @param newConfig - the light and dark palettes to use\n   */\n  const setThemeConfig = (newConfig: ThemeConfig): void => {\n    set(config, newConfig);\n  };\n\n  /**\n   * Sets the theme up. Call once, from the app's entry point.\n   *\n   * @param options - the starting mode and palettes; each falls back to its\n   * default when left out\n   */\n  const init = (options: InitThemeOptions): void => {\n    switchThemeScheme(options.mode ?? ThemeMode.auto);\n    setThemeConfig(options.config ?? { ...defaultTheme });\n  };\n\n  return {\n    config,\n    init,\n    isAutoControlled,\n    isDark,\n    isLight,\n    setThemeConfig,\n    state,\n    store,\n    switchThemeScheme,\n    theme,\n    toggleThemeMode,\n  };\n});\n"],"mappings":";;;;;AAWA,IAAM,SAA2B,IAAI,EAAE,GAAG,aAAa,CAAC;;;;;;;AAQxD,IAAa,gBAAgB,6BAAiD;CAC5E,MAAM,kBAAkB,cACtB,oBACC,UAAU,WAAW,UAAU;EAC9B,IAAI,OAAO,aAAa,YAAY,CAAC,eACnC;EAEF,MAAM,KAAK,cAAc,SAAS,cAAc,QAAQ;EACxD,IAAI,CAAC,IACH;EAEF,GAAG,aAAa,WAAW,KAAK;CAClC,CACF;CAEA,MAAM,EAAE,OAAO,UAAU,aAAwB,EAC/C,UAAU,MAAM,gBAAgB;EAC9B,eAAe,IAAI;EACnB,gBAAgB,QAAQ,cAAc,IAAI;CAC5C,EACF,CAAC;;CAGD,MAAM,mBAAyC,eAAe,MAAI,KAAK,MAAM,UAAU,IAAI;;CAG3F,MAAM,UAAgC,eAAe,MAAI,KAAK,MAAM,UAAU,KAAK;;CAGnF,MAAM,SAA+B,eAAe,MAAI,KAAK,MAAM,UAAU,IAAI;;CAGjF,MAAM,QAAgC,eAAe;EACnD,IAAI,MAAI,OAAO,GACb,OAAO,MAAI,MAAM,CAAC,CAAC;EAErB,OAAO,MAAI,MAAM,CAAC,CAAC;CACrB,CAAC;;;;;;CAOD,MAAM,qBAAqB,SAA0B;EACnD,MAAI,OAAO,QAAQ,UAAU,IAAI;CACnC;;;;CAKA,MAAM,wBAA8B;EAClC,IAAI,MAAI,gBAAgB,GACtB,kBAAkB,UAAU,KAAK;OAC9B,IAAI,MAAI,OAAO,GAClB,kBAAkB,UAAU,IAAI;OAC7B,IAAI,MAAI,MAAM,GACjB,kBAAkB,UAAU,IAAI;CACpC;;;;;;CAOA,MAAM,kBAAkB,cAAiC;EACvD,MAAI,QAAQ,SAAS;CACvB;;;;;;;CAQA,MAAM,QAAQ,YAAoC;EAChD,kBAAkB,QAAQ,QAAQ,UAAU,IAAI;EAChD,eAAe,QAAQ,UAAU,EAAE,GAAG,aAAa,CAAC;CACtD;CAEA,OAAO;EACL;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF;AACF,CAAC"}
+{"version":3,"file":"theme.js","names":[],"sources":["../../src/composables/theme.ts"],"sourcesContent":["import { defaultWindow, getSSRHandler, useColorMode } from '@vueuse/core';\nimport { computed, type ComputedRef, type Ref, ref } from 'vue';\nimport {\n  defaultTheme,\n  type InitThemeOptions,\n  type ThemeConfig,\n  type ThemeContent,\n  type ThemeData,\n  ThemeMode,\n} from '@/types/theme';\n\nconst config: Ref<ThemeConfig> = ref({ ...defaultTheme });\n\n/**\n * The theme manager: the current mode and palette, and the calls that change\n * them. Shared, so every caller reads and writes the same theme.\n *\n * @returns the theme state and the operations on it\n */\nexport const useRotkiTheme = createSharedComposable<() => ThemeContent>(() => {\n  const updateHTMLAttrs = getSSRHandler(\n    'updateHTMLAttrs',\n    (selector, attribute, value) => {\n      if (typeof selector !== 'string' || !defaultWindow)\n        return;\n\n      const el = defaultWindow.document.querySelector(selector);\n      if (!el)\n        return;\n\n      el.setAttribute(attribute, value);\n    },\n  );\n\n  const { state, store } = useColorMode<ThemeMode>({\n    onChanged(mode, defaultHandler) {\n      defaultHandler(mode);\n      updateHTMLAttrs('html', 'data-theme', mode);\n    },\n  });\n\n  /** Whether the system picks the theme rather than the user. */\n  const isAutoControlled: ComputedRef<boolean> = computed(() => get(store) === ThemeMode.auto);\n\n  /** Whether the light theme is showing. */\n  const isLight: ComputedRef<boolean> = computed(() => get(state) === ThemeMode.light);\n\n  /** Whether the dark theme is showing. */\n  const isDark: ComputedRef<boolean> = computed(() => get(state) === ThemeMode.dark);\n\n  /** The palette the current mode reads from. */\n  const theme: ComputedRef<ThemeData> = computed(() => {\n    if (get(isLight))\n      return get(config).light;\n\n    return get(config).dark;\n  });\n\n  /**\n   * Switches the theme.\n   *\n   * @param mode - the mode to switch to; an empty mode falls back to auto\n   */\n  const switchThemeScheme = (mode: ThemeMode): void => {\n    set(store, mode || ThemeMode.auto);\n  };\n\n  /**\n   * toggle between auto|light|dark\n   */\n  const toggleThemeMode = (): void => {\n    if (get(isAutoControlled))\n      switchThemeScheme(ThemeMode.light);\n    else if (get(isLight))\n      switchThemeScheme(ThemeMode.dark);\n    else if (get(isDark))\n      switchThemeScheme(ThemeMode.auto);\n  };\n\n  /**\n   * Replaces the palettes the theme draws from.\n   *\n   * @param newConfig - the light and dark palettes to use\n   */\n  const setThemeConfig = (newConfig: ThemeConfig): void => {\n    set(config, newConfig);\n  };\n\n  /**\n   * Sets the theme up. Call once, from the app's entry point.\n   *\n   * @param options - the starting mode and palettes; each falls back to its\n   * default when left out\n   */\n  const init = (options: InitThemeOptions): void => {\n    switchThemeScheme(options.mode ?? ThemeMode.auto);\n    setThemeConfig(options.config ?? { ...defaultTheme });\n  };\n\n  return {\n    config,\n    init,\n    isAutoControlled,\n    isDark,\n    isLight,\n    setThemeConfig,\n    state,\n    store,\n    switchThemeScheme,\n    theme,\n    toggleThemeMode,\n  };\n});\n"],"mappings":";;;;;AAWA,IAAM,SAA2B,IAAI,EAAE,GAAG,aAAa,CAAC;;;;;;;AAQxD,IAAa,gBAAgB,6BAAiD;CAC5E,MAAM,kBAAkB,cACtB,oBACC,UAAU,WAAW,UAAU;EAC9B,IAAI,OAAO,aAAa,YAAY,CAAC,eACnC;EAEF,MAAM,KAAK,cAAc,SAAS,cAAc,QAAQ;EACxD,IAAI,CAAC,IACH;EAEF,GAAG,aAAa,WAAW,KAAK;CAClC,CACF;CAEA,MAAM,EAAE,OAAO,UAAU,aAAwB,EAC/C,UAAU,MAAM,gBAAgB;EAC9B,eAAe,IAAI;EACnB,gBAAgB,QAAQ,cAAc,IAAI;CAC5C,EACF,CAAC;;CAGD,MAAM,mBAAyC,eAAe,IAAI,KAAK,MAAM,UAAU,IAAI;;CAG3F,MAAM,UAAgC,eAAe,IAAI,KAAK,MAAM,UAAU,KAAK;;CAGnF,MAAM,SAA+B,eAAe,IAAI,KAAK,MAAM,UAAU,IAAI;;CAGjF,MAAM,QAAgC,eAAe;EACnD,IAAI,IAAI,OAAO,GACb,OAAO,IAAI,MAAM,CAAC,CAAC;EAErB,OAAO,IAAI,MAAM,CAAC,CAAC;CACrB,CAAC;;;;;;CAOD,MAAM,qBAAqB,SAA0B;EACnD,IAAI,OAAO,QAAQ,UAAU,IAAI;CACnC;;;;CAKA,MAAM,wBAA8B;EAClC,IAAI,IAAI,gBAAgB,GACtB,kBAAkB,UAAU,KAAK;OAC9B,IAAI,IAAI,OAAO,GAClB,kBAAkB,UAAU,IAAI;OAC7B,IAAI,IAAI,MAAM,GACjB,kBAAkB,UAAU,IAAI;CACpC;;;;;;CAOA,MAAM,kBAAkB,cAAiC;EACvD,IAAI,QAAQ,SAAS;CACvB;;;;;;;CAQA,MAAM,QAAQ,YAAoC;EAChD,kBAAkB,QAAQ,QAAQ,UAAU,IAAI;EAChD,eAAe,QAAQ,UAAU,EAAE,GAAG,aAAa,CAAC;CACtD;CAEA,OAAO;EACL;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF;AACF,CAAC"}

package/dist/composables/timeout-manager.js

@@ -1,5 +1,5 @@
+import { get, set } from "../vendor/@vueuse/shared/dist/index.js";
 import { onScopeDispose, ref } from "vue";
-import { get, set } from "@vueuse/shared";
 //#region src/composables/timeout-manager.ts
 function useTimeoutManager() {
 	const timeout = ref();

package/dist/consts/colors.d.ts

@@ -1,3 +1,7 @@
+/**
+ * The Material palette the library kept from 2.x. Only `grey` is left, because consumers still use
+ * it widely; new code takes the zinc `neutral` ramp, and the other Material hues were dropped in 3.0.
+ */
 export declare const baseColors: string[];
 export declare const baseColorsIntensities: string[];
 /**

package/dist/consts/colors.js

@@ -1,40 +1,4 @@
 //#region src/consts/colors.ts
-var baseColors = [
-	"grey",
-	"indigo",
-	"deep-purple",
-	"amber",
-	"orange",
-	"pink",
-	"deep-orange",
-	"green",
-	"red",
-	"light-green",
-	"purple",
-	"lime",
-	"light-blue",
-	"yellow",
-	"cyan",
-	"teal",
-	"blue",
-	"blue-gray"
-];
-var baseColorsIntensities = [
-	"50",
-	"100",
-	"200",
-	"300",
-	"400",
-	"500",
-	"600",
-	"700",
-	"800",
-	"900",
-	"a100",
-	"a200",
-	"a400",
-	"a700"
-];
 /**
 * The available context colors.
 * Keep in sync with build-web-types.mjs
@@ -48,6 +12,6 @@ var contextColors = [
 	"success"
 ];
 //#endregion
-export { baseColors, baseColorsIntensities, contextColors };
+export { contextColors };
 
 //# sourceMappingURL=colors.js.map

package/dist/consts/colors.js.map

@@ -1 +1 @@
-{"version":3,"file":"colors.js","names":[],"sources":["../../src/consts/colors.ts"],"sourcesContent":["export const baseColors = [\n  'grey',\n  'indigo',\n  'deep-purple',\n  'amber',\n  'orange',\n  'pink',\n  'deep-orange',\n  'green',\n  'red',\n  'light-green',\n  'purple',\n  'lime',\n  'light-blue',\n  'yellow',\n  'cyan',\n  'teal',\n  'blue',\n  'blue-gray',\n];\n\nexport const baseColorsIntensities = [\n  '50',\n  '100',\n  '200',\n  '300',\n  '400',\n  '500',\n  '600',\n  '700',\n  '800',\n  '900',\n  'a100',\n  'a200',\n  'a400',\n  'a700',\n];\n\n/**\n * The available context colors.\n * Keep in sync with build-web-types.mjs\n */\nexport const contextColors = [\n  'primary',\n  'secondary',\n  'error',\n  'warning',\n  'info',\n  'success',\n] as const;\n\nexport type ContextColorsType = (typeof contextColors)[number];\n\nexport const contextColorsIntensities = [\n  { name: 'Regular', prefix: '' },\n  { name: 'Darker', prefix: '-darker' },\n  { name: 'Lighter', prefix: '-lighter' },\n];\n"],"mappings":";AAAA,IAAa,aAAa;CACxB;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF;AAEA,IAAa,wBAAwB;CACnC;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF;;;;;AAMA,IAAa,gBAAgB;CAC3B;CACA;CACA;CACA;CACA;CACA;AACF"}
+{"version":3,"file":"colors.js","names":[],"sources":["../../src/consts/colors.ts"],"sourcesContent":["/**\n * The Material palette the library kept from 2.x. Only `grey` is left, because consumers still use\n * it widely; new code takes the zinc `neutral` ramp, and the other Material hues were dropped in 3.0.\n */\nexport const baseColors = [\n  'grey',\n];\n\nexport const baseColorsIntensities = [\n  '50',\n  '100',\n  '200',\n  '300',\n  '400',\n  '500',\n  '600',\n  '700',\n  '800',\n  '900',\n  'a100',\n  'a200',\n  'a400',\n  'a700',\n];\n\n/**\n * The available context colors.\n * Keep in sync with build-web-types.mjs\n */\nexport const contextColors = [\n  'primary',\n  'secondary',\n  'error',\n  'warning',\n  'info',\n  'success',\n] as const;\n\nexport type ContextColorsType = (typeof contextColors)[number];\n\nexport const contextColorsIntensities = [\n  { name: 'Regular', prefix: '' },\n  { name: 'Darker', prefix: '-darker' },\n  { name: 'Lighter', prefix: '-lighter' },\n];\n"],"mappings":";;;;;AA6BA,IAAa,gBAAgB;CAC3B;CACA;CACA;CACA;CACA;CACA;AACF"}

package/dist/consts/tokens.d.ts

@@ -0,0 +1,56 @@
+/**
+ * The theme's role tokens, named here so the generated theme and the class
+ * merger agree on them: `rounded-rui-control` and `shadow-rui-menu` only
+ * dedupe against `rounded-full` or `shadow-lg` when the merger knows the names.
+ */
+export declare const radiusRoles: readonly ["control", "panel", "card", "sm", "lg"];
+export type RadiusRole = (typeof radiusRoles)[number];
+export declare const shadowRoles: readonly ["menu", "drawer", "tooltip", "control"];
+export type ShadowRole = (typeof shadowRoles)[number];
+/**
+ * Surfaces by height: the page, a card, a menu, a drawer or notification. Held
+ * as bare channels in `--rui-*`, like the palette.
+ */
+export declare const surfaceColors: readonly ["background", "surface", "menu", "overlay"];
+/** Lines: dividers between rows, and the edge of an outlined control. Held as full colors. */
+export declare const lineColors: readonly ["divider", "outline"];
+/**
+ * State layers: translucent fills for a hovered or pressed row, item or chip. Held as full
+ * colors. The `state-layer` utility lays one over a fill as a background image, which tints
+ * the fill without touching the text, as a `brightness` filter would.
+ */
+export declare const stateColors: readonly ["hover", "pressed"];
+/**
+ * Surfaces between the others: `surface-muted` for tracks, wells and quiet chips (a step darker
+ * than the card), `surface-sunken` for an inset panel inside a card. Bare channels, per theme.
+ */
+export declare const insetSurfaceColors: readonly ["surface-muted", "surface-sunken"];
+/**
+ * The tints of each context color: `subtle` (5%) for a large area like a banner, `soft` (10%) for
+ * a selected row or a badge, `border` (30%) for its edge.
+ */
+export declare const contextTints: {
+    readonly subtle: 5;
+    readonly soft: 10;
+    readonly border: 30;
+};
+/**
+ * A categorical palette for charts and legends, eight hues that stay apart from each other and
+ * from the status colors, plus a neutral `chart-other` for the rest.
+ */
+export declare const chartColors: readonly ["chart-1", "chart-2", "chart-3", "chart-4", "chart-5", "chart-6", "chart-7", "chart-8", "chart-other"];
+/**
+ * The stacking layers, lowest first, as `--rui-z-*` and `z-rui-*`. Everything the library floats
+ * sits on one of them, so an app's own fixed parts can slot between instead of guessing a number.
+ */
+export declare const zLayers: readonly ["raised", "floating", "app-bar", "drawer", "dialog", "menu", "tooltip", "toast", "blocking"];
+export type ZLayer = (typeof zLayers)[number];
+/** RuiDialog's width presets, as `--rui-dialog-*` and `max-w-rui-dialog-*`. */
+export declare const dialogSizes: readonly ["sm", "md", "lg", "xl", "2xl"];
+export type DialogSize = (typeof dialogSizes)[number];
+/**
+ * The neutral ramp, `rui-neutral-50` to `rui-neutral-950`, for the greys that
+ * are not Material's `rui-grey`. Its hue is the one place the restyle picks
+ * between zinc and slate.
+ */
+export declare const neutralShades: readonly ["50", "100", "200", "300", "400", "500", "600", "700", "800", "900", "950"];

package/dist/consts/tokens.js

@@ -0,0 +1,46 @@
+//#region src/consts/tokens.ts
+/**
+* The theme's role tokens, named here so the generated theme and the class
+* merger agree on them: `rounded-rui-control` and `shadow-rui-menu` only
+* dedupe against `rounded-full` or `shadow-lg` when the merger knows the names.
+*/
+var radiusRoles = [
+	"control",
+	"panel",
+	"card",
+	"sm",
+	"lg"
+];
+var shadowRoles = [
+	"menu",
+	"drawer",
+	"tooltip",
+	"control"
+];
+/**
+* The stacking layers, lowest first, as `--rui-z-*` and `z-rui-*`. Everything the library floats
+* sits on one of them, so an app's own fixed parts can slot between instead of guessing a number.
+*/
+var zLayers = [
+	"raised",
+	"floating",
+	"app-bar",
+	"drawer",
+	"dialog",
+	"menu",
+	"tooltip",
+	"toast",
+	"blocking"
+];
+/** RuiDialog's width presets, as `--rui-dialog-*` and `max-w-rui-dialog-*`. */
+var dialogSizes = [
+	"sm",
+	"md",
+	"lg",
+	"xl",
+	"2xl"
+];
+//#endregion
+export { dialogSizes, radiusRoles, shadowRoles, zLayers };
+
+//# sourceMappingURL=tokens.js.map

package/dist/consts/tokens.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tokens.js","names":[],"sources":["../../src/consts/tokens.ts"],"sourcesContent":["/**\n * The theme's role tokens, named here so the generated theme and the class\n * merger agree on them: `rounded-rui-control` and `shadow-rui-menu` only\n * dedupe against `rounded-full` or `shadow-lg` when the merger knows the names.\n */\nexport const radiusRoles = ['control', 'panel', 'card', 'sm', 'lg'] as const;\n\nexport type RadiusRole = (typeof radiusRoles)[number];\n\nexport const shadowRoles = ['menu', 'drawer', 'tooltip', 'control'] as const;\n\nexport type ShadowRole = (typeof shadowRoles)[number];\n\n/**\n * Surfaces by height: the page, a card, a menu, a drawer or notification. Held\n * as bare channels in `--rui-*`, like the palette.\n */\nexport const surfaceColors = ['background', 'surface', 'menu', 'overlay'] as const;\n\n/** Lines: dividers between rows, and the edge of an outlined control. Held as full colors. */\nexport const lineColors = ['divider', 'outline'] as const;\n\n/**\n * State layers: translucent fills for a hovered or pressed row, item or chip. Held as full\n * colors. The `state-layer` utility lays one over a fill as a background image, which tints\n * the fill without touching the text, as a `brightness` filter would.\n */\nexport const stateColors = ['hover', 'pressed'] as const;\n\n/**\n * Surfaces between the others: `surface-muted` for tracks, wells and quiet chips (a step darker\n * than the card), `surface-sunken` for an inset panel inside a card. Bare channels, per theme.\n */\nexport const insetSurfaceColors = ['surface-muted', 'surface-sunken'] as const;\n\n/**\n * The tints of each context color: `subtle` (5%) for a large area like a banner, `soft` (10%) for\n * a selected row or a badge, `border` (30%) for its edge.\n */\nexport const contextTints = { subtle: 5, soft: 10, border: 30 } as const;\n\n/**\n * A categorical palette for charts and legends, eight hues that stay apart from each other and\n * from the status colors, plus a neutral `chart-other` for the rest.\n */\nexport const chartColors = ['chart-1', 'chart-2', 'chart-3', 'chart-4', 'chart-5', 'chart-6', 'chart-7', 'chart-8', 'chart-other'] as const;\n\n/**\n * The stacking layers, lowest first, as `--rui-z-*` and `z-rui-*`. Everything the library floats\n * sits on one of them, so an app's own fixed parts can slot between instead of guessing a number.\n */\nexport const zLayers = ['raised', 'floating', 'app-bar', 'drawer', 'dialog', 'menu', 'tooltip', 'toast', 'blocking'] as const;\n\nexport type ZLayer = (typeof zLayers)[number];\n\n/** RuiDialog's width presets, as `--rui-dialog-*` and `max-w-rui-dialog-*`. */\nexport const dialogSizes = ['sm', 'md', 'lg', 'xl', '2xl'] as const;\n\nexport type DialogSize = (typeof dialogSizes)[number];\n\n/**\n * The neutral ramp, `rui-neutral-50` to `rui-neutral-950`, for the greys that\n * are not Material's `rui-grey`. Its hue is the one place the restyle picks\n * between zinc and slate.\n */\nexport const neutralShades = ['50', '100', '200', '300', '400', '500', '600', '700', '800', '900', '950'] as const;\n"],"mappings":";;;;;;AAKA,IAAa,cAAc;CAAC;CAAW;CAAS;CAAQ;CAAM;AAAI;AAIlE,IAAa,cAAc;CAAC;CAAQ;CAAU;CAAW;AAAS;;;;;AA0ClE,IAAa,UAAU;CAAC;CAAU;CAAY;CAAW;CAAU;CAAU;CAAQ;CAAW;CAAS;AAAU;;AAKnH,IAAa,cAAc;CAAC;CAAM;CAAM;CAAM;CAAM;AAAK"}

package/dist/consts/typography.d.ts

@@ -1,38 +1,71 @@
+/**
+ * The type scale, largest first, as the typography docs page lists it: each utility with its size,
+ * line height and weight in pixels, and what it is for.
+ */
 export declare const typographyClasses: readonly [{
-    readonly className: "text-body-1";
-    readonly name: "Body 1";
-}, {
-    readonly className: "text-body-2";
-    readonly name: "Body 2";
-}, {
-    readonly className: "text-subtitle-1";
-    readonly name: "Subtitle 1";
-}, {
-    readonly className: "text-subtitle-2";
-    readonly name: "Subtitle 2";
-}, {
-    readonly className: "text-caption";
-    readonly name: "Caption";
-}, {
-    readonly className: "text-overline";
-    readonly name: "Overline";
-}, {
     readonly className: "text-h1";
     readonly name: "H1";
+    readonly spec: "60 / 72 semibold";
+    readonly use: "Marketing heroes";
 }, {
     readonly className: "text-h2";
     readonly name: "H2";
+    readonly spec: "48 / 56 semibold";
+    readonly use: "Landing page sections";
 }, {
     readonly className: "text-h3";
     readonly name: "H3";
+    readonly spec: "36 / 44 semibold";
+    readonly use: "Large numbers, empty states";
 }, {
     readonly className: "text-h4";
     readonly name: "H4";
+    readonly spec: "30 / 38 semibold";
+    readonly use: "Page titles on wide screens";
 }, {
     readonly className: "text-h5";
     readonly name: "H5";
+    readonly spec: "24 / 32 semibold";
+    readonly use: "Page titles";
 }, {
     readonly className: "text-h6";
     readonly name: "H6";
+    readonly spec: "20 / 32 semibold";
+    readonly use: "Card and dialog titles";
+}, {
+    readonly className: "text-subtitle-1";
+    readonly name: "Subtitle 1";
+    readonly spec: "16 / 28 medium";
+    readonly use: "Section headings";
+}, {
+    readonly className: "text-subtitle-2";
+    readonly name: "Subtitle 2";
+    readonly spec: "14 / 20 medium";
+    readonly use: "Labels, table headers";
+}, {
+    readonly className: "text-body-1";
+    readonly name: "Body 1";
+    readonly spec: "16 / 24 regular";
+    readonly use: "Running text";
+}, {
+    readonly className: "text-body-2";
+    readonly name: "Body 2";
+    readonly spec: "14 / 20 regular";
+    readonly use: "Controls, tables, dense text";
+}, {
+    readonly className: "text-caption";
+    readonly name: "Caption";
+    readonly spec: "12 / 20 regular";
+    readonly use: "Hints, timestamps, help text";
+}, {
+    readonly className: "text-caption-2";
+    readonly name: "Caption 2";
+    readonly spec: "10 / 16 regular";
+    readonly use: "Dense tags, axis labels";
+}, {
+    readonly className: "text-overline";
+    readonly name: "Overline";
+    readonly spec: "12 / 32 medium, tracked";
+    readonly use: "Eyebrows above a heading";
 }];
 export type TypographyClass = (typeof typographyClasses)[number];

package/dist/index.d.ts

@@ -1,17 +1,19 @@
 import type { App } from 'vue';
 import type { InitThemeOptions } from './types/theme.js';
+import { type FieldOptions } from './composables/defaults/field.js';
 import { type LogoOptions } from './composables/defaults/logo.js';
 import { type TableOptions } from './composables/defaults/table.js';
-import { StepperState } from './types/stepper.js';
+import { StepperOrientation, StepperState, type StepperStep } from './types/stepper.js';
 import './style.css';
 export * from './components/index.js';
 export { activatorHandlers, type ActivatorHandlers } from './components/overlays/menu/activator-handlers.js';
 export * from './composables/index.js';
+export { type FieldOptions, type LabelPlacement, provideFieldDefaults } from './composables/defaults/field.js';
 export type { LogoOptions, LogoResolver } from './composables/defaults/logo.js';
 export { contextColors, type ContextColorsType } from './consts/colors.js';
 export { translationKeys } from './i18n/keys.js';
 export * from './icons/index.js';
-export { StepperState };
+export { StepperOrientation, StepperState, type StepperStep };
 export type { VueClassValue } from './types/class-value';
 export { type InitThemeOptions, type ThemeConfig, type ThemeContent, type ThemeData, ThemeMode, } from './types/theme.js';
 export { createBlockie } from './utils/blockie.js';
@@ -21,6 +23,8 @@ export interface RuiOptions {
     theme?: InitThemeOptions;
     defaults?: {
         table?: Partial<TableOptions>;
+        /** `labelPlacement` for every text field, text area, select and picker; `top` when unset. */
+        field?: Partial<FieldOptions>;
     };
     /**
      * Where `RuiLogo` gets the image for its `logo` prop. Without it every
@@ -32,6 +36,7 @@ export declare function createRui(options?: RuiOptions): {
     defaults: Readonly<{
         icons: import("./composables/icons.js").UseIconsReturn;
         table: TableOptions;
+        field: FieldOptions;
     }>;
     install: (app: App) => void;
 };