@lavalogic/scoria 0.12.3 → 0.13.2

package/dist/Components/Table/Body/Rows/Columns/TableNumberInput.svelte

@@ -48,7 +48,7 @@
 	let tdref: HTMLTableCellElement | undefined = $state();
 	let inputRef: HTMLInputElement | undefined = $state();
 
-	const tableContext = getContext<TableContext<T>>(TableContext.identifier);
+	const tableContext = getContext<TableContext<T, never>>(TableContext.identifier);
 	const { toast } = getContext<ToastContext>(ToastContext.identifier);
 
 	const editableAsync = $derived(
@@ -161,12 +161,13 @@
 			untrack(() => {
 				tick()
 					.then(() => {
-						if (validity === Validity.Invalid) {
-							tableContext.addInvalidValue(cell.row.original);
-						} else {
-							tableContext.removeInvalidValue(cell.row.original);
-						}
+						const x: Promise<void> =
+							validity === Validity.Invalid
+								? tableContext.addInvalidValue(cell.row.original)
+								: tableContext.removeInvalidValue(cell.row.original);
+
 						previousValidity = validity;
+						return x;
 					})
 					.catch(devCatch);
 			});

package/dist/Components/Table/Body/Rows/Columns/TableQueryColumn.d.ts

@@ -1,5 +1,6 @@
 import type { Column } from '../../../Types/Columns/Column.js';
 import type { QueryDef } from '../../../Types/Columns/Definitions/Accessors/QueryDef.svelte.js';
-export interface TableQueryColumn<T extends object> extends Column<T> {
+import type { SelectFilterValueType } from '../../../Types/Filtering/FilterFn.js';
+export interface TableQueryColumn<T extends object> extends Column<T, SelectFilterValueType<T>> {
     columnDef: QueryDef<T>;
 }

package/dist/Components/Table/Body/Rows/Columns/TableQuerySelect.svelte

@@ -29,7 +29,7 @@
 
 	let lastOptions: Array<SelectOption<unknown>> = $state([]);
 
-	const tableContext = getContext<TableContext<T>>(TableContext.identifier);
+	const tableContext = getContext<TableContext<T, never>>(TableContext.identifier);
 	const { toast } = getContext<ToastContext>(ToastContext.identifier);
 
 	const editableAsync = $derived(
@@ -175,12 +175,14 @@
 			untrack(() => {
 				tick()
 					.then(() => {
-						if (validity === Validity.Invalid) {
-							tableContext.addInvalidValue(cell.row.original);
-						} else {
-							tableContext.removeInvalidValue(cell.row.original);
-						}
+						const x =
+							validity === Validity.Invalid
+								? tableContext.addInvalidValue(cell.row.original)
+								: tableContext.removeInvalidValue(cell.row.original);
+
 						previousValidity = validity;
+
+						return x;
 					})
 					.catch(devCatch);
 			});

package/dist/Components/Table/Body/Rows/Columns/TableRowSelectionCheckbox.svelte

@@ -7,6 +7,7 @@
 	import type { BoolFilterValueType } from '../../../Types/Filtering/FilterFn.js';
 	import { TableFocusDetails } from '../../../Types/Focus/TableFocusDetails.svelte.js';
 	import { ToastContext } from '../../../../../Contexts/ToastContext.svelte.js';
+	import { devCatch } from '../../../../../Helpers/Helpers.svelte.js';
 	import { getContext } from 'svelte';
 	import type { ChangeEventHandler } from 'svelte/elements';
 
@@ -20,14 +21,14 @@
 <script lang="ts" generics="T extends object,">
 	const { cell, onchange: parentOnchange }: TableCheckboxProps<T> = $props();
 
-	const tableContext = getContext<TableContext<T>>(TableContext.identifier);
+	const tableContext = getContext<TableContext<T, never>>(TableContext.identifier);
 	const toastContext = getContext<ToastContext>(ToastContext.identifier);
 
 	const focusDetails: TableFocusDetails<T, BoolFilterValueType> = $derived(
 		new TableFocusDetails(cell, tableContext, toastContext.toast)
 	);
 
-	const key = $derived(tableContext.selectionExtractor(cell.row.original));
+	const key: Promise<unknown> = $derived(tableContext.selectionExtractor(cell.row.original));
 
 	const value = $derived(tableContext.selectedItems.has(key));
 
@@ -39,7 +40,9 @@
 	);
 
 	const onchange: ChangeEventHandler<HTMLInputElement> = (e) => {
-		tableContext.toggleSelected(cell.row.original, (e.target as HTMLInputElement).checked);
+		tableContext
+			.toggleSelected(cell.row.original, (e.target as HTMLInputElement).checked)
+			.catch(devCatch);
 		parentOnchange?.(e);
 	};
 
@@ -68,7 +71,7 @@
 	onkeyup={(e) => {
 		if (e.key === 'Enter') {
 			e.stopPropagation();
-			tableContext.toggleSelected(cell.row.original, !value);
+			tableContext.toggleSelected(cell.row.original, !value).catch(devCatch);
 
 			inputRef?.dispatchEvent(new InputEvent('change'));
 			// tableContext.onEditCell(cell.row.original, focusDetails.coordinates, !value);

package/dist/Components/Table/Body/Rows/Columns/TableSelect.svelte

@@ -27,7 +27,7 @@
 
 	const optional = $derived(cell.column.columnDef.optional);
 
-	const tableContext = getContext<TableContext<T>>(TableContext.identifier);
+	const tableContext = getContext<TableContext<T, never>>(TableContext.identifier);
 	const { toast } = getContext<ToastContext>(ToastContext.identifier);
 
 	const editableAsync = $derived(
@@ -139,12 +139,14 @@
 			untrack(() => {
 				tick()
 					.then(() => {
-						if (validity === Validity.Invalid) {
-							tableContext.addInvalidValue(cell.row.original);
-						} else {
-							tableContext.removeInvalidValue(cell.row.original);
-						}
+						const x =
+							validity === Validity.Invalid
+								? tableContext.addInvalidValue(cell.row.original)
+								: tableContext.removeInvalidValue(cell.row.original);
+
 						previousValidity = validity;
+
+						return x;
 					})
 					.catch(devCatch);
 			});

package/dist/Components/Table/Body/Rows/Columns/TableTextInput.svelte

@@ -56,7 +56,7 @@
 	let tdref = $state<HTMLTableCellElement | undefined>();
 	let inputRef = $state<HTMLInputElement | undefined>();
 
-	const tableContext = getContext<TableContext<T>>(TableContext.identifier);
+	const tableContext = getContext<TableContext<T, never>>(TableContext.identifier);
 	const toastContext = getContext<ToastContext>(ToastContext.identifier);
 
 	const focusDetails: TableFocusDetails<T, never> = $derived(
@@ -150,12 +150,14 @@
 			untrack(() => {
 				tick()
 					.then(() => {
-						if (validity === Validity.Invalid) {
-							tableContext.addInvalidValue(cell.row.original);
-						} else {
-							tableContext.removeInvalidValue(cell.row.original);
-						}
+						const x =
+							validity === Validity.Invalid
+								? tableContext.addInvalidValue(cell.row.original)
+								: tableContext.removeInvalidValue(cell.row.original);
+
 						previousValidity = validity;
+
+						return x;
 					})
 					.catch(devCatch);
 			});

package/dist/Components/Table/Body/Rows/Columns/ValidityCell.svelte

@@ -42,7 +42,7 @@
 
 	const { cell }: ValidityCellProps<T, FilterValueType> = $props();
 
-	const tableContext = getContext<TableContext<T>>(TableContext.identifier);
+	const tableContext = getContext<TableContext<T, never>>(TableContext.identifier);
 	const { toast } = getContext<ToastContext>(ToastContext.identifier);
 
 	const ColumnDef = $derived(cell.column.columnDef as AbstractDisplayDef<T, FilterValueType>);
@@ -76,9 +76,9 @@
 				const [validityValue] = await validity;
 
 				if (validityValue === Validity.Invalid) {
-					tableContext.addInvalidValue(cell.row.original);
+					return tableContext.addInvalidValue(cell.row.original);
 				} else {
-					tableContext.removeInvalidValue(cell.row.original);
+					return tableContext.removeInvalidValue(cell.row.original);
 				}
 			})().catch(devCatch);
 		});

package/dist/Components/Table/Body/Rows/TableRow.svelte

@@ -2,24 +2,25 @@
 
 <script lang="ts" generics="T extends object">
 	import { dev } from '$app/environment';
-	import { generateShortUUID } from '../../../../Helpers/Helpers.svelte.js';
+	import { devCatch, generateShortUUID } from '../../../../Helpers/Helpers.svelte.js';
 	import { getContext, untrack } from 'svelte';
 	import NestedTable from '../../NestedTable.svelte';
 	import type { ExpandDef } from '../../Types/Columns/Definitions/Expand/ExpandDef.svelte.js';
 	import type { DefsWrapper } from '../../Types/Columns/DefsWrapper.js';
 	import type { TableCell } from '../../Types/Columns/TableCell.js';
 	import { TableContext } from '../../Types/Context/TableContext.svelte.js';
+	import type { Primitive } from '../../Types/Context/TableInitOptions.js';
 	import ColumnHighlight from './ColumnHighlight.svelte';
 	import TableColumn from './Columns/TableColumn.svelte';
 	import type { TableRowProps } from './TableRowProps.js';
-	const tableContext = getContext<TableContext<T>>(TableContext.identifier);
+	const tableContext = getContext<TableContext<T, never>>(TableContext.identifier);
 
 	const { row, side, odd = false, customHeight, includeHighlight }: TableRowProps<T> = $props();
 
 	const hoverable = $derived(tableContext.changeColourOnHover);
 
 	//HACK converted this from derived to state+deffect because otherwise this throws an unsafe mutation error deeper down the stack
-	const cells: Array<TableCell<T, never>> = $derived(
+	const cells: Array<TableCell<T, unknown>> = $derived(
 		side === 'left'
 			? row.getLeftVisibleCells()
 			: side === 'right'
@@ -27,7 +28,7 @@
 				: row.getCenterVisibleCells()
 	);
 
-	let expandedColumnDef: ExpandDef<T> | undefined = $state();
+	let expandedColumnDef: ExpandDef<T, object, Primitive, unknown> | undefined = $state();
 
 	$effect(() => {
 		if (cells.length) {
@@ -44,7 +45,7 @@
 	let innerColumnDefs: DefsWrapper<object> = $state({ defs: [] });
 	let innerTableName: string | undefined = $state();
 
-	let prevExpandedColumnDef: ExpandDef<T> | undefined = $state();
+	let prevExpandedColumnDef: ExpandDef<T, object, Primitive, unknown> | undefined = $state();
 
 	const rowIndex = $derived(cells.at(0) && cells[0].row.visibleIndex);
 	const highlighted = $derived(
@@ -83,7 +84,7 @@
 		});
 	});
 
-	function onExpandChange(columnDef: ExpandDef<T>) {
+	function onExpandChange(columnDef: ExpandDef<T, object, Primitive, unknown>) {
 		if (expandedColumnDef?.id === columnDef.id) {
 			expandedColumnDef = undefined;
 		} else {
@@ -158,7 +159,7 @@ onMouseLeave={onMouseLeave} -->
 				})()}
 			{highlighted}
 			toggleHighlightedRow={() => {
-				tableContext.toggleHighlightedRow(row.original);
+				tableContext.toggleHighlightedRow(row.original).catch(devCatch);
 			}}
 		/>
 	{/if}

package/dist/Components/Table/Body/TableBody.svelte

@@ -10,7 +10,7 @@
 
 	let { side, heights, columns, includeHighlight }: TableBodyProps<T> = $props();
 
-	const tableContext = getContext<TableContext<T>>(TableContext.identifier);
+	const tableContext = getContext<TableContext<T, never>>(TableContext.identifier);
 
 	type HasHeight = {
 		trHeight: RefWrapper<number>;
@@ -33,24 +33,28 @@
 			{#if includeHighlight}
 				<td class="highlight-dud"><!-- accomodating for row marking --></td>
 			{/if}
-			{#each columns as column (column)}
+			{#each columns as column (column.id)}
 				<QuickSearchCell {column} customFilters={tableContext.remoteFilters} />
 			{/each}
 		</tr>
 	{/if}
-	{#each tableContext.paginationRowModel.rows as row, index (row)}
-		{@const customHeight = heights[index]?.applyTo.includes(side)
-			? heights[index].maxHeight
-			: undefined}
-		<TableRow
-			{includeHighlight}
-			{customHeight}
-			{row}
-			{side}
-			odd={index % 2 == 1}
-			bind:this={rows[index]}
-		/>
-	{/each}
+	<svelte:boundary>
+		{#await tableContext.paginationRowModel then prm}
+			{#each prm.rows as row, index (row)}
+				{@const customHeight = heights[index]?.applyTo.includes(side)
+					? heights[index].maxHeight
+					: undefined}
+				<TableRow
+					{includeHighlight}
+					{customHeight}
+					{row}
+					{side}
+					odd={index % 2 == 1}
+					bind:this={rows[index]}
+				/>
+			{/each}
+		{/await}
+	</svelte:boundary>
 </tbody>
 
 <style>td {

package/dist/Components/Table/Body/TableBodyProps.d.ts

@@ -3,6 +3,6 @@ import type { HeightData } from './HeightData.js';
 export interface TableBodyProps<T extends object> {
     side: 'left' | 'centre' | 'right';
     heights: Array<HeightData<T>>;
-    columns: Array<Column<T>>;
+    columns: Array<Column<T, unknown>>;
     includeHighlight: boolean;
 }

package/dist/Components/Table/ColumnDefinitions/ExampleItemColumnDefRepository.svelte.d.ts

@@ -2,4 +2,4 @@ import type { ExampleItem } from '../../../Types/Examples/ExampleItem.js';
 import { type Component } from 'svelte';
 import type { DisplayDefModalProps } from '../Types/Columns/Definitions/Display/AbstractDisplayDef.svelte.js';
 import type { DefsWrapper } from '../Types/Columns/DefsWrapper.js';
-export declare function generateExampleItemColumnDefs(modal: Component<DisplayDefModalProps<ExampleItem, never>, object, ''>): DefsWrapper<ExampleItem>;
+export declare function generateExampleItemColumnDefs(modal: Component<DisplayDefModalProps<ExampleItem, unknown>, object, ''>): DefsWrapper<ExampleItem>;

package/dist/Components/Table/ColumnDefinitions/ExampleItemColumnDefRepository.svelte.js

@@ -15,20 +15,21 @@ import { ProgressBarDef } from '../Types/Columns/Definitions/Display/ProgressBar
 import { ValidityDef } from '../Types/Columns/Definitions/Display/ValidityDef.svelte.js';
 import { ExpandDef } from '../Types/Columns/Definitions/Expand/ExpandDef.svelte.js';
 export function generateExampleItemColumnDefs(modal) {
+    const expandDef = new ExpandDef({
+        accessorFn: (it) => [it],
+        getInnerColumnDefs: () => generateExampleItemColumnDefs(modal),
+        header: 'Expand Cell',
+        id: 'expand',
+        headerIcon: 'access-token',
+        innerTableName: 'expand-inner',
+        innerTableOptions: {
+            selectionExtractor: (item) => Promise.resolve(item.id),
+            getUserId: () => '1'
+        },
+        isEnabled: () => true
+    });
     let defs = $state([
-        new ExpandDef({
-            accessorFn: (it) => [it],
-            getInnerColumnDefs: () => generateExampleItemColumnDefs(modal),
-            header: 'Expand Cell',
-            id: 'expand',
-            headerIcon: 'access-token',
-            innerTableName: 'expand-inner',
-            innerTableOptions: {
-                selectionExtractor: (item) => item.id,
-                getUserId: () => '1'
-            },
-            isEnabled: () => true
-        }),
+        expandDef,
         new ValidityDef({
             header: 'Valid',
             id: 'valid',
@@ -56,9 +57,10 @@ export function generateExampleItemColumnDefs(modal) {
             // TODO make filtering work with the below:
             accessorFn: async (item) => {
                 void item.id;
-                await asyncSleep(500);
+                await asyncSleep(10);
                 return item.id;
-            }
+            },
+            debug: true
         }),
         new QueryDef({
             header: 'simulated query def',

package/dist/Components/Table/Headers/HighlightAllHeader.svelte

@@ -8,7 +8,7 @@
 	import Action from '../../Action.svelte';
 	import { TableContext } from '../Types/Context/TableContext.svelte.js';
 
-	const tableContext = getContext<TableContext<T>>(TableContext.identifier);
+	const tableContext = getContext<TableContext<T, never>>(TableContext.identifier);
 
 	let allHighlighted = $state(false);
 
@@ -20,26 +20,39 @@
 			.catch(devCatch);
 	});
 
-	const backgroundColour = $derived(
-		tableContext.sortedData.length > 0 && allHighlighted
+	const backgroundColour = $derived.by(async () => {
+		return (await tableContext.sortedData).length > 0 && allHighlighted
 			? Colour['$brand-primary']
-			: Colour['$ui-white']
-	);
+			: Colour['$ui-white'];
+	});
 </script>
 
 <div class="checkbox-cell">
 	<div class="wrapper">
-		<Action
-			{backgroundColour}
-			hoverBackgroundColour={Colour['$brand-dark']}
-			size={Size.FillWidth}
-			icon={{
-				name: 'nothing'
-			}}
-			onclick={() => {
-				tableContext.onHighlightAll();
-			}}
-		/>
+		{#await backgroundColour}
+			<Action
+				hoverBackgroundColour={Colour['$brand-dark']}
+				size={Size.FillWidth}
+				icon={{
+					name: 'nothing'
+				}}
+				onclick={() => {
+					tableContext.onHighlightAll();
+				}}
+			/>
+		{:then backgroundColour}
+			<Action
+				{backgroundColour}
+				hoverBackgroundColour={Colour['$brand-dark']}
+				size={Size.FillWidth}
+				icon={{
+					name: 'nothing'
+				}}
+				onclick={() => {
+					tableContext.onHighlightAll();
+				}}
+			/>
+		{/await}
 	</div>
 </div>
 

package/dist/Components/Table/Headers/SelectAllHeader.svelte

@@ -4,7 +4,7 @@
 	import { getContext } from 'svelte';
 	import { TableContext } from '../Types/Context/TableContext.svelte.js';
 
-	const tableContext = getContext<TableContext<T>>(TableContext.identifier);
+	const tableContext = getContext<TableContext<T, never>>(TableContext.identifier);
 
 	const allSelected: Promise<boolean> = $derived(tableContext.allSelectedInCurrentPage);
 	const checked: Promise<boolean> = $derived.by(() => {

package/dist/Components/Table/Headers/TableHead.svelte

@@ -28,7 +28,7 @@
 <script lang="ts" generics="T extends object">
 	const { showHighlight, side = 'centre', oncontextmenu }: TableHeadProps = $props();
 
-	const tableContext = getContext<TableContext<T>>(TableContext.identifier);
+	const tableContext = getContext<TableContext<T, never>>(TableContext.identifier);
 	const tooltipContext = getContext<TooltipContext>(TooltipContext.identifier);
 
 	const groups: Array<HeaderGroup<T>> = $derived.by(() => {
@@ -59,7 +59,7 @@
 		currentDropTarget = target as HTMLTableCellElement | null;
 	}
 
-	function showtooltip(e: MouseEvent, columnDef: ColumnDef<T>): void {
+	function showtooltip(e: MouseEvent, columnDef: ColumnDef<T, unknown>): void {
 		if (columnDef instanceof ExpandDef) {
 			const rect = (e.target as HTMLElement).closest('th')?.getBoundingClientRect();
 
@@ -78,7 +78,7 @@
 		}
 	}
 
-	function hideTooltip(columnDef: ColumnDef<T>): void {
+	function hideTooltip(columnDef: ColumnDef<T, unknown>): void {
 		if (columnDef instanceof ExpandDef) {
 			tooltipContext.hideTooltip(
 				`Show ${typeof columnDef.header === 'string' ? columnDef.header : columnDef.id}`
@@ -101,7 +101,7 @@
 		currentDropTarget = null;
 	}
 
-	function setDragTarget(def: ColumnDef<T>) {
+	function setDragTarget(def: ColumnDef<T, unknown>) {
 		tableContext.dragTarget = def;
 	}
 

package/dist/Components/Table/Misc/ColumnPanel.svelte

@@ -11,7 +11,7 @@
 	import { getContext } from 'svelte';
 	import { TableContext } from '../Types/Context/TableContext.svelte.js';
 
-	const tableContext = getContext<TableContext<T>>(TableContext.identifier);
+	const tableContext = getContext<TableContext<T, never>>(TableContext.identifier);
 
 	const labelledPresets: Array<SelectOption<string>> = $derived(
 		tableContext.columnPresets.map((pr) => ({ label: pr.name, value: pr.name }))

package/dist/Components/Table/Misc/ColumnPanelModal.svelte

@@ -13,7 +13,7 @@
 	import { TableContext } from '../Types/Context/TableContext.svelte.js';
 	import type { ColumnPanelModalProps } from './ColumnPanelModalProps.js';
 
-	const tableContext = getContext<TableContext<T>>(TableContext.identifier);
+	const tableContext = getContext<TableContext<T, never>>(TableContext.identifier);
 
 	const { onclose }: ColumnPanelModalProps = $props();
 	const labelledPresets: Array<SelectOption<string>> = $derived(

package/dist/Components/Table/Misc/FilterInput.svelte

@@ -1,6 +1,6 @@
 <svelte:options runes />
 
-<script lang="ts" generics="T extends object">
+<script lang="ts" generics="T extends object,FilterValueType">
 	import { dev } from '$app/environment';
 	import Button from '../../Button.svelte';
 	import MultiSelect from '../../MultiSelect.svelte';
@@ -24,9 +24,9 @@
 	import { numberDateFilterTypes } from './numberDateFilterTypes.js';
 	import { stringFilterTypes } from './stringFilterTypes.js';
 
-	const tableContext = getContext<TableContext<T>>(TableContext.identifier);
+	const tableContext = getContext<TableContext<T, never>>(TableContext.identifier);
 
-	const { def, customFilters }: FilterInputProps<T> = $props();
+	const { def, customFilters }: FilterInputProps<T, FilterValueType> = $props();
 
 	const customFilter = $derived(customFilters?.get(def.id));
 
@@ -447,7 +447,6 @@
 
 						const newFilterType = newValue?.value ?? NumberDateFilterMode.In;
 						tableContext.paginationRepo?.setFilterMode(def.id, newFilterType);
-						tableContext.paginationRepo?.filterModes.set(def.id, newFilterType);
 
 						if (selectedNumberFilterType?.value !== oldFilterType?.value) {
 							if (oldFilterType?.value === NumberDateFilterMode.Between) {
@@ -521,7 +520,6 @@
 					onchange={(newValue: SelectOption<StringFilterMode> | null) => {
 						const filterType = newValue?.value ?? StringFilterMode.Contains;
 						tableContext.paginationRepo?.setFilterMode(def.id, filterType);
-						tableContext.paginationRepo?.filterModes.set(def.id, filterType);
 					}}
 					onkeydown={(e: KeyboardEvent) => {
 						e.stopPropagation();

package/dist/Components/Table/Misc/FilterInput.svelte.d.ts

@@ -1,25 +1,25 @@
 import type { FilterInputProps } from './FilterInputProps.js';
-declare function $$render<T extends object>(): {
-    props: FilterInputProps<T>;
+declare function $$render<T extends object, FilterValueType>(): {
+    props: FilterInputProps<T, FilterValueType>;
     exports: {};
     bindings: "";
     slots: {};
     events: {};
 };
-declare class __sveltets_Render<T extends object> {
-    props(): ReturnType<typeof $$render<T>>['props'];
-    events(): ReturnType<typeof $$render<T>>['events'];
-    slots(): ReturnType<typeof $$render<T>>['slots'];
+declare class __sveltets_Render<T extends object, FilterValueType> {
+    props(): ReturnType<typeof $$render<T, FilterValueType>>['props'];
+    events(): ReturnType<typeof $$render<T, FilterValueType>>['events'];
+    slots(): ReturnType<typeof $$render<T, FilterValueType>>['slots'];
     bindings(): "";
     exports(): {};
 }
 interface $$IsomorphicComponent {
-    new <T extends object>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<T>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<T>['props']>, ReturnType<__sveltets_Render<T>['events']>, ReturnType<__sveltets_Render<T>['slots']>> & {
-        $$bindings?: ReturnType<__sveltets_Render<T>['bindings']>;
-    } & ReturnType<__sveltets_Render<T>['exports']>;
-    <T extends object>(internal: unknown, props: ReturnType<__sveltets_Render<T>['props']> & {}): ReturnType<__sveltets_Render<T>['exports']>;
-    z_$$bindings?: ReturnType<__sveltets_Render<any>['bindings']>;
+    new <T extends object, FilterValueType>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<T, FilterValueType>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<T, FilterValueType>['props']>, ReturnType<__sveltets_Render<T, FilterValueType>['events']>, ReturnType<__sveltets_Render<T, FilterValueType>['slots']>> & {
+        $$bindings?: ReturnType<__sveltets_Render<T, FilterValueType>['bindings']>;
+    } & ReturnType<__sveltets_Render<T, FilterValueType>['exports']>;
+    <T extends object, FilterValueType>(internal: unknown, props: ReturnType<__sveltets_Render<T, FilterValueType>['props']> & {}): ReturnType<__sveltets_Render<T, FilterValueType>['exports']>;
+    z_$$bindings?: ReturnType<__sveltets_Render<any, any>['bindings']>;
 }
 declare const FilterInput: $$IsomorphicComponent;
-type FilterInput<T extends object> = InstanceType<typeof FilterInput<T>>;
+type FilterInput<T extends object, FilterValueType> = InstanceType<typeof FilterInput<T, FilterValueType>>;
 export default FilterInput;

package/dist/Components/Table/Misc/FilterInputProps.d.ts

@@ -1,6 +1,6 @@
 import type { ColumnDef } from '../Types/Columns/Definitions/ColumnDef.svelte.js';
 import type { CustomRemoteFilters } from '../Types/Filtering/CustomRemoteFilters.js';
-export interface FilterInputProps<T extends object> {
-    def: ColumnDef<T>;
+export interface FilterInputProps<T extends object, FilterValueType> {
+    def: ColumnDef<T, FilterValueType>;
     customFilters?: CustomRemoteFilters | undefined;
 }

package/dist/Components/Table/Misc/FilterPanel.svelte

@@ -4,11 +4,11 @@
 	import Button from '../../Button.svelte';
 	import { Size } from '../../../Types/Internal/Size.js';
 	import { Variant } from '../../../Types/Internal/Variant.js';
+	import { getContext } from 'svelte';
 	import { TableContext } from '../Types/Context/TableContext.svelte.js';
 	import FilterInput from './FilterInput.svelte';
-	import { getContext } from 'svelte';
 
-	const tableContext = getContext<TableContext<T>>(TableContext.identifier);
+	const tableContext = getContext<TableContext<T, never>>(TableContext.identifier);
 
 	function reset() {
 		tableContext.paginationRepo?.resetFilters();

package/dist/Components/Table/Misc/FilterPanelModal.svelte

@@ -15,10 +15,10 @@
 </script>
 
 <script lang="ts" generics="T extends object">
-	const tableContext = getContext<TableContext<T>>(TableContext.identifier);
+	const tableContext = getContext<TableContext<T, never>>(TableContext.identifier);
 
 	const { onclose }: FilterPanelModalProps = $props();
-	const refs: Array<FilterInput<T>> = $state([]);
+	const refs: Array<FilterInput<T, unknown>> = $state([]);
 
 	function reset() {
 		tableContext.paginationRepo?.resetFilters();

package/dist/Components/Table/Misc/TableFooter.svelte

@@ -25,7 +25,7 @@
 <script lang="ts" generics="T extends object">
 	let { onkeydown }: TableFooterProps = $props();
 
-	const tableContext = getContext<TableContext<T>>(TableContext.identifier);
+	const tableContext = getContext<TableContext<T, never>>(TableContext.identifier);
 	const alertContext = getContext<AlertContext>(AlertContext.identifier);
 
 	const pageSizes: Array<SelectOption<number>> = $state([

package/dist/Components/Table/Misc/TableHorizontalBar.svelte

@@ -14,7 +14,7 @@
 		default as ToolboxPanelModal
 	} from './FilterPanelModal.svelte';
 
-	const tableContext = getContext<TableContext<T>>(TableContext.identifier);
+	const tableContext = getContext<TableContext<T, never>>(TableContext.identifier);
 
 	const panels = {
 		[ExpandedPanel.None]: null,