@lavalogic/scoria 0.11.14 → 0.12.0

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

@@ -1,19 +1,12 @@
 <svelte:options runes />
 
-<script lang="ts" module>
-	import { getContext } from 'svelte';
-	import type { ColumnDef } from '../../Types/Columns/Definitions/ColumnDef.svelte.js';
-	import { TableContext } from '../../Types/Context/TableContext.svelte.js';
+<script lang="ts" generics="T extends object">
 	import Checkbox from '../../../Checkbox.svelte';
 	import Icon from '../../../Icon.svelte';
+	import { TableContext } from '../../Types/Context/TableContext.svelte.js';
 	import { Size } from '../../../../Types/Internal/Size.js';
-
-	export interface ColumnListRowProps<T extends object> {
-		columnDef: ColumnDef<T> | null;
-	}
-</script>
-
-<script lang="ts" generics="T extends object">
+	import { getContext } from 'svelte';
+	import type { ColumnListRowProps } from './ColumnListRowProps.js';
 	const tableContext = getContext<TableContext<T>>(TableContext.identifier);
 
 	const { columnDef }: ColumnListRowProps<T> = $props();
@@ -33,15 +26,15 @@
 		if (columnDef == null) return;
 
 		tableContext.setColumnPinning((pinning) => {
-			const leftPinIndex = pinning.left?.get(columnDef!.id) ?? -1;
+			const leftPinIndex = pinning.left?.get(columnDef.id) ?? -1;
 			const left = [...(pinning.left?.keys() ?? [])];
 			if (leftPinIndex !== -1) {
 				left.splice(leftPinIndex, 1);
 			} else {
-				left.push(columnDef!.id);
+				left.push(columnDef.id);
 			}
 
-			const rightPinIndex = pinning.right?.get(columnDef!.id) ?? -1;
+			const rightPinIndex = pinning.right?.get(columnDef.id) ?? -1;
 			const right = [...(pinning.right?.keys() ?? [])];
 			if (rightPinIndex !== -1) {
 				right.splice(rightPinIndex, 1);
@@ -58,16 +51,16 @@
 		if (columnDef == null) return;
 
 		tableContext.setColumnPinning((pinning) => {
-			const rightPinIndex = pinning.right?.get(columnDef!.id) ?? -1;
+			const rightPinIndex = pinning.right?.get(columnDef.id) ?? -1;
 			const right = [...(pinning.right?.keys() ?? [])];
 
 			if (rightPinIndex !== -1) {
 				right.splice(rightPinIndex, 1);
 			} else {
-				right.push(columnDef!.id);
+				right.push(columnDef.id);
 			}
 
-			const leftPinIndex = pinning.left?.get(columnDef!.id) ?? -1;
+			const leftPinIndex = pinning.left?.get(columnDef.id) ?? -1;
 			const left = [...(pinning.left?.keys() ?? [])];
 			if (leftPinIndex !== -1) {
 				left.splice(leftPinIndex, 1);
@@ -101,16 +94,12 @@
 		id="{tableContext.tableName}-column-settings-{columnDef.id}"
 		draggable={tableContext.allowColumnReordering}
 		ondragstart={() => {
-			if (!columnDef) {
-				throw new Error('null column def');
-			}
-
 			tableContext.dragTarget = columnDef;
 		}}
 		ondragend={disableDragVisual}
 		ondragover={(e) => {
 			e.preventDefault();
-			if (tableContext.dragTarget?.id !== columnDef?.id) {
+			if (tableContext.dragTarget?.id !== columnDef.id) {
 				isBeingTargeted = true;
 			}
 		}}
@@ -153,10 +142,11 @@
 			</div>
 		{/if}
 		{#if typeof columnDef.header === 'function'}
-			<!-- columnDef.header({} ) //as unknown as HeaderContext<T, unknown> // props is unknown to me. What is this? -->
-			<span>{columnDef.id}</span>
+			<!-- FIXME this needs testing -->
+			{@render columnDef.header()}
+			<!-- <span>{columnDef.id}</span> -->
 		{:else}
-			<span>{columnDef.header ?? columnDef.id}</span>
+			<span>{columnDef.header}</span>
 		{/if}
 	</li>
 {:else}

package/dist/Components/Table/Body/Rows/ColumnListRow.svelte.d.ts

@@ -1,7 +1,4 @@
-import type { ColumnDef } from '../../Types/Columns/Definitions/ColumnDef.svelte.js';
-export interface ColumnListRowProps<T extends object> {
-    columnDef: ColumnDef<T> | null;
-}
+import type { ColumnListRowProps } from './ColumnListRowProps.js';
 declare function $$render<T extends object>(): {
     props: ColumnListRowProps<T>;
     exports: {};

package/dist/Components/Table/Body/Rows/ColumnListRowProps.d.ts

@@ -0,0 +1,4 @@
+import type { ColumnDef } from '../../Types/Columns/Definitions/ColumnDef.svelte.js';
+export interface ColumnListRowProps<T extends object> {
+    columnDef: ColumnDef<T> | null;
+}

package/dist/Components/Table/Body/Rows/ColumnListRowProps.js

@@ -0,0 +1 @@
+export {};

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

@@ -1,21 +1,17 @@
 <svelte:options runes />
 
 <script lang="ts" module>
+	import { AccessorDef } from '../../../Types/Columns/Definitions/Accessors/AccessorDef.svelte.js';
+	import type { ColumnDef } from '../../../Types/Columns/Definitions/ColumnDef.svelte.js';
+	import type { Component } from 'svelte';
+	import type { AccessorComponentProps } from './AccessorComponentProps.js';
 	import FocusableImmutableCell from './FocusableImmutableCell.svelte';
-	import type { TableCell } from '../../../Types/Columns/TableCell.js';
-	import TableNumberInput from './TableNumberInput.svelte';
+	import TableCheckbox from './TableCheckbox.svelte';
 	import TableDatePicker from './TableDatePicker.svelte';
-	import TableSelect from './TableSelect.svelte';
+	import TableNumberInput from './TableNumberInput.svelte';
 	import TableQuerySelect from './TableQuerySelect.svelte';
-	import TableCheckbox from './TableCheckbox.svelte';
+	import TableSelect from './TableSelect.svelte';
 	import TableTextInput from './TableTextInput.svelte';
-	import type { Component } from 'svelte';
-	import { AccessorDef } from '../../../Types/Columns/Definitions/Accessors/AccessorDef.svelte.js';
-	import type { ColumnDef } from '../../../Types/Columns/Definitions/ColumnDef.svelte.js';
-
-	export interface AccessorComponentProps<T extends object> {
-		cell: TableCell<T>;
-	}
 
 	const cellTypes: Record<
 		'Number' | 'Date' | 'Select' | 'Checkbox' | 'Query' | 'Text',

package/dist/Components/Table/Body/Rows/Columns/AccessorComponent.svelte.d.ts

@@ -1,7 +1,4 @@
-import type { TableCell } from '../../../Types/Columns/TableCell.js';
-export interface AccessorComponentProps<T extends object> {
-    cell: TableCell<T>;
-}
+import type { AccessorComponentProps } from './AccessorComponentProps.js';
 declare function $$render<T extends object>(): {
     props: AccessorComponentProps<T>;
     exports: {};

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

@@ -0,0 +1,4 @@
+import type { TableCell } from '../../../Types/Columns/TableCell.js';
+export interface AccessorComponentProps<T extends object> {
+    cell: TableCell<T>;
+}

package/dist/Components/Table/Body/Rows/Columns/AccessorComponentProps.js

@@ -0,0 +1 @@
+export {};

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

@@ -3,28 +3,23 @@
 <script lang="ts" module>
 	import Action from '../../../../Action.svelte';
 	import Portal from '../../../../Portal.svelte';
+	import type { TableActionButton } from '../../../Types/Columns/TableActionButton.js';
+	import { TableContext } from '../../../Types/Context/TableContext.svelte.js';
+	import { MultiFocusEdge } from '../../../Types/Focus/MultiFocusEdge.js';
+	import { TableFocusDetails } from '../../../Types/Focus/TableFocusDetails.svelte.js';
 	import { ToastContext } from '../../../../../Contexts/ToastContext.svelte.js';
-	import { asyncMap, refWrapper } from '../../../../../Helpers/Helpers.svelte.js';
+	import { devCatch, refWrapper } from '../../../../../Helpers/Helpers.svelte.js';
 	import { Colour, ColourSet } from '../../../../../scss/colours.js';
 	import { Size } from '../../../../../Types/Internal/Size.js';
 	import { Validity } from '../../../../../Types/Internal/Validity.js';
-
-	export interface ActionsCellProps<T extends object> {
-		cell: ActionsTableCell<T>;
-	}
+	import { getContext, tick, untrack } from 'svelte';
+	import type { ActionsCellProps } from './ActionsCellProps.js';
+	import TableAction from './TableAction.svelte';
 
 	export let shownPopup = refWrapper<symbol | undefined>(undefined);
 </script>
 
 <script lang="ts" generics="T extends object">
-	import type { ActionsDef } from '../../../Types/Columns/Definitions/Actions/ActionsDef.svelte.js';
-	import type { TableActionButton } from '../../../Types/Columns/TableActionButton.js';
-	import { TableContext } from '../../../Types/Context/TableContext.svelte.js';
-	import { MultiFocusEdge } from '../../../Types/Focus/MultiFocusEdge.js';
-	import { TableFocusDetails } from '../../../Types/Focus/TableFocusDetails.svelte.js';
-	import { getContext, tick, untrack } from 'svelte';
-	import TableAction, { type ActionsTableCell } from './TableAction.svelte';
-
 	const { cell }: ActionsCellProps<T> = $props();
 
 	const value = $derived(cell.getValue());
@@ -32,18 +27,16 @@
 	const tableContext = getContext<TableContext<T>>(TableContext.identifier);
 	const toastContext = getContext<ToastContext>(ToastContext.identifier);
 
-	const actions: TableActionButton<T>[] = $derived(
-		(cell.column.columnDef as ActionsDef<T>).actions
-	);
+	const actions: Array<TableActionButton<T>> = $derived(cell.column.columnDef.actions);
 
 	const thisPopup = $state(Symbol());
 	const thisPopupIsVisibile = $derived(thisPopup === shownPopup.value);
 	const hasValue: boolean = $derived(value !== undefined);
-	const edge: MultiFocusEdge | undefined = $state(undefined);
+	const edge: MultiFocusEdge | undefined = $state();
 	const focusDetails: TableFocusDetails<T> = $derived(
 		new TableFocusDetails(cell, tableContext, toastContext.toast)
 	);
-	let popupRef: HTMLDivElement | undefined = $state();
+
 	let cellRef: HTMLDivElement | undefined = $state();
 
 	let x = $state(0);
@@ -77,26 +70,32 @@
 	let previousValidity: Validity = $state(Validity.Valid);
 	let validity: Validity = $state(Validity.Valid);
 	$effect(() => {
-		focusDetails.validityTuple.then(([newValidity]) => {
-			untrack(() => {
-				tick().then(() => {
-					validity = newValidity;
+		focusDetails.validityTuple
+			.then(([newValidity]) => {
+				untrack(() => {
+					tick()
+						.then(() => {
+							validity = newValidity;
+						})
+						.catch(devCatch);
 				});
-			});
-		});
+			})
+			.catch(devCatch);
 	});
 
 	$effect(() => {
 		if (validity != previousValidity) {
 			untrack(() => {
-				tick().then(() => {
-					if (validity === Validity.Invalid) {
-						tableContext.addInvalidValue(cell.row.original);
-					} else {
-						tableContext.removeInvalidValue(cell.row.original);
-					}
-					previousValidity = validity;
-				});
+				tick()
+					.then(() => {
+						if (validity === Validity.Invalid) {
+							tableContext.addInvalidValue(cell.row.original);
+						} else {
+							tableContext.removeInvalidValue(cell.row.original);
+						}
+						previousValidity = validity;
+					})
+					.catch(devCatch);
 			});
 		}
 	});
@@ -164,23 +163,15 @@
 		/>
 	</div>
 	{#if thisPopupIsVisibile}
-		{@const awaitedActions = asyncMap<TableActionButton<T>, [TableActionButton<T>, string]>(
-			actions,
-			async (item) => {
-				return [item, await item.getLabel(cell.row.original, cell.row.visibleIndex)];
-			}
-		)}
-		{#await awaitedActions then actions}
-			<Portal>
-				<div bind:this={popupRef} class="popup" style="--y: {y}px; --x: {x}px;">
-					<div class="action-container">
-						{#each actions as [action, label] (label)}
-							<TableAction {action} {cell} />
-						{/each}
-					</div>
+		<Portal>
+			<div class="popup" style="--y: {y}px; --x: {x}px;">
+				<div class="action-container">
+					{#each actions as action (action.getLabel(cell.row.original, cell.row.visibleIndex))}
+						<TableAction {action} {cell} />
+					{/each}
 				</div>
-			</Portal>
-		{/await}
+			</div>
+		</Portal>
 	{/if}
 </td>
 

package/dist/Components/Table/Body/Rows/Columns/ActionsCell.svelte.d.ts

@@ -1,8 +1,5 @@
-export interface ActionsCellProps<T extends object> {
-    cell: ActionsTableCell<T>;
-}
+import type { ActionsCellProps } from './ActionsCellProps.js';
 export declare let shownPopup: import("../../../../../index.js").RefWrapper<symbol | undefined>;
-import { type ActionsTableCell } from './TableAction.svelte';
 declare function $$render<T extends object>(): {
     props: ActionsCellProps<T>;
     exports: {};

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

@@ -0,0 +1,4 @@
+import type { ActionsTableCell } from './ActionsTableCell.js';
+export interface ActionsCellProps<T extends object> {
+    cell: ActionsTableCell<T>;
+}

package/dist/Components/Table/Body/Rows/Columns/ActionsCellProps.js

@@ -0,0 +1 @@
+export {};

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

@@ -0,0 +1,5 @@
+import type { Column } from '../../../Types/Columns/Column.js';
+import type { ActionsDef } from '../../../Types/Columns/Definitions/Actions/ActionsDef.svelte.js';
+export interface ActionsColumn<T extends object> extends Column<T> {
+    columnDef: ActionsDef<T>;
+}

package/dist/Components/Table/Body/Rows/Columns/ActionsColumn.js

@@ -0,0 +1 @@
+export {};

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

@@ -0,0 +1,5 @@
+import type { TableCell } from '../../../Types/Columns/TableCell.js';
+import type { ActionsColumn } from './ActionsColumn.js';
+export interface ActionsTableCell<T extends object> extends TableCell<T> {
+    column: ActionsColumn<T>;
+}

package/dist/Components/Table/Body/Rows/Columns/ActionsTableCell.js

@@ -0,0 +1 @@
+export {};

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

@@ -1,25 +1,20 @@
 <svelte:options runes />
 
-<script lang="ts" module>
-	export interface FocusableImmutableCellProps<T extends object> {
-		cell: TableCell<T>;
-	}
-</script>
-
 <!-- TODO editable version of this should contain a multi select -->
 <script lang="ts" generics="T extends object">
 	import Bubble from '../../../../Bubble.svelte';
+	import { BubbleDef } from '../../../Types/Columns/Definitions/Display/BubbleDef.svelte.js';
+	import { TableContext } from '../../../Types/Context/TableContext.svelte.js';
+	import { TableFocusDetails } from '../../../Types/Focus/TableFocusDetails.svelte.js';
 	import { ToastContext } from '../../../../../Contexts/ToastContext.svelte.js';
+	import { devCatch } from '../../../../../Helpers/Helpers.svelte.js';
 	import { Validity } from '../../../../../Types/Internal/Validity.js';
 	import { getContext, tick, untrack } from 'svelte';
-	import { TableContext } from '../../../Types/Context/TableContext.svelte.js';
-	import { TableFocusDetails } from '../../../Types/Focus/TableFocusDetails.svelte.js';
-	import type { TableCell } from '../../../Types/Columns/TableCell.js';
-	import { BubbleDef } from '../../../Types/Columns/Definitions/Display/BubbleDef.svelte.js';
+	import type { FocusableImmutableCellProps } from './FocusableImmutableCellProps.js';
 
 	const { cell }: FocusableImmutableCellProps<T> = $props();
 
-	const values = $derived(cell.getValue()) as string[] | Promise<string[]>;
+	const values = $derived(cell.getValue()) as Array<string> | Promise<Array<string>>;
 
 	const tableContext = getContext<TableContext<T>>(TableContext.identifier);
 	const toastContext = getContext<ToastContext>(ToastContext.identifier);
@@ -31,26 +26,32 @@
 	let previousValidity: Validity = $state(Validity.Valid);
 	let validity: Validity = $state(Validity.Valid);
 	$effect(() => {
-		focusDetails.validityTuple.then(([newValidity]) => {
-			untrack(() => {
-				tick().then(() => {
-					validity = newValidity;
+		focusDetails.validityTuple
+			.then(([newValidity]) => {
+				untrack(() => {
+					tick()
+						.then(() => {
+							validity = newValidity;
+						})
+						.catch(devCatch);
 				});
-			});
-		});
+			})
+			.catch(devCatch);
 	});
 
 	$effect(() => {
 		if (validity != previousValidity) {
 			untrack(() => {
-				tick().then(() => {
-					if (validity === Validity.Invalid) {
-						tableContext.addInvalidValue(cell.row.original);
-					} else {
-						tableContext.removeInvalidValue(cell.row.original);
-					}
-					previousValidity = validity;
-				});
+				tick()
+					.then(() => {
+						if (validity === Validity.Invalid) {
+							tableContext.addInvalidValue(cell.row.original);
+						} else {
+							tableContext.removeInvalidValue(cell.row.original);
+						}
+						previousValidity = validity;
+					})
+					.catch(devCatch);
 			});
 		}
 	});

package/dist/Components/Table/Body/Rows/Columns/BubbleCell.svelte.d.ts

@@ -1,7 +1,4 @@
-export interface FocusableImmutableCellProps<T extends object> {
-    cell: TableCell<T>;
-}
-import type { TableCell } from '../../../Types/Columns/TableCell.js';
+import type { FocusableImmutableCellProps } from './FocusableImmutableCellProps.js';
 declare function $$render<T extends object>(): {
     props: FocusableImmutableCellProps<T>;
     exports: {};

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

@@ -1,25 +1,16 @@
 <svelte:options runes />
 
-<script lang="ts" module>
-	export interface ExpandCellProps<T extends object> {
-		cell: ExpandTableCell<T>;
-		expandedColumnDef: ExpandDef<T, unknown & object> | undefined;
-		onExpandChange: (def: ExpandDef<T, unknown & object>) => void;
-	}
-</script>
-
-<script lang="ts" generics="T extends object">
+<script lang="ts" generics="T extends object, R extends object">
 	import Action from '../../../../Action.svelte';
+	import { TableContext } from '../../../Types/Context/TableContext.svelte.js';
+	import { TableFocusDetails } from '../../../Types/Focus/TableFocusDetails.svelte.js';
 	import { ToastContext } from '../../../../../Contexts/ToastContext.svelte.js';
 	import { ColourSet } from '../../../../../scss/colours.js';
 	import { Size } from '../../../../../Types/Internal/Size.js';
 	import { getContext } from 'svelte';
-	import { TableContext } from '../../../Types/Context/TableContext.svelte.js';
-	import { TableFocusDetails } from '../../../Types/Focus/TableFocusDetails.svelte.js';
-	import type { ExpandDef } from '../../../Types/Columns/Definitions/Expand/ExpandDef.svelte.js';
-	import type { ExpandTableCell } from '../../../Types/Columns/ExpandTableCell.js';
+	import type { ExpandCellProps } from './ExpandCellProps.js';
 
-	const { cell, expandedColumnDef, onExpandChange }: ExpandCellProps<T> = $props();
+	const { cell, expandedColumnDef, onExpandChange }: ExpandCellProps<T, R> = $props();
 
 	const tableContext = getContext<TableContext<T>>(TableContext.identifier);
 	const toastContext = getContext<ToastContext>(ToastContext.identifier);
@@ -28,7 +19,7 @@
 	);
 
 	const enabled: boolean | Promise<boolean> = $derived(
-		cell.column.columnDef.isEnabled?.(cell.row.original, cell.row.originalIndex)
+		cell.column.columnDef.isEnabled(cell.row.original, cell.row.originalIndex)
 	);
 </script>
 
@@ -61,9 +52,11 @@
 		class:multifocus-start={focusDetails.isMultiFocusStart}
 	>
 		{#await enabled}
+			<!-- eslint-disable-next-line @typescript-eslint/no-confusing-void-expression -->
 			{@render action(false)}
 		{:then enabled}
-			{@render action(enabled ?? true)}
+			<!-- eslint-disable-next-line @typescript-eslint/no-confusing-void-expression -->
+			{@render action(enabled)}
 		{/await}
 	</div>
 </td>
@@ -84,11 +77,11 @@
 			colourSet={expandedColumnDef?.id === cell.column.columnDef.id
 				? ColourSet.Primary
 				: ColourSet.Auxiliary}
-			onclick={(e) => {
+			onclick={(e: MouseEvent) => {
 				// FIXME why is this required? svelte bug?
 				e.stopImmediatePropagation();
 				// toastContext.toast("clicked")
-				onExpandChange(cell.column.columnDef as ExpandDef<T, unknown & object>);
+				onExpandChange(cell.column.columnDef);
 			}}
 		/>
 	</div>

package/dist/Components/Table/Body/Rows/Columns/ExpandCell.svelte.d.ts

@@ -1,31 +1,25 @@
-export interface ExpandCellProps<T extends object> {
-    cell: ExpandTableCell<T>;
-    expandedColumnDef: ExpandDef<T, unknown & object> | undefined;
-    onExpandChange: (def: ExpandDef<T, unknown & object>) => void;
-}
-import type { ExpandDef } from '../../../Types/Columns/Definitions/Expand/ExpandDef.svelte.js';
-import type { ExpandTableCell } from '../../../Types/Columns/ExpandTableCell.js';
-declare function $$render<T extends object>(): {
-    props: ExpandCellProps<T>;
+import type { ExpandCellProps } from './ExpandCellProps.js';
+declare function $$render<T extends object, R extends object>(): {
+    props: ExpandCellProps<T, R>;
     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, R extends object> {
+    props(): ReturnType<typeof $$render<T, R>>['props'];
+    events(): ReturnType<typeof $$render<T, R>>['events'];
+    slots(): ReturnType<typeof $$render<T, R>>['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, R extends object>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<T, R>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<T, R>['props']>, ReturnType<__sveltets_Render<T, R>['events']>, ReturnType<__sveltets_Render<T, R>['slots']>> & {
+        $$bindings?: ReturnType<__sveltets_Render<T, R>['bindings']>;
+    } & ReturnType<__sveltets_Render<T, R>['exports']>;
+    <T extends object, R extends object>(internal: unknown, props: ReturnType<__sveltets_Render<T, R>['props']> & {}): ReturnType<__sveltets_Render<T, R>['exports']>;
+    z_$$bindings?: ReturnType<__sveltets_Render<any, any>['bindings']>;
 }
 declare const ExpandCell: $$IsomorphicComponent;
-type ExpandCell<T extends object> = InstanceType<typeof ExpandCell<T>>;
+type ExpandCell<T extends object, R extends object> = InstanceType<typeof ExpandCell<T, R>>;
 export default ExpandCell;

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

@@ -0,0 +1,7 @@
+import type { ExpandDef } from '../../../Types/Columns/Definitions/Expand/ExpandDef.svelte.js';
+import type { ExpandTableCell } from '../../../Types/Columns/ExpandTableCell.js';
+export interface ExpandCellProps<T extends object, R extends object> {
+    cell: ExpandTableCell<T, R>;
+    expandedColumnDef: ExpandDef<T, R> | undefined;
+    onExpandChange: (def: ExpandDef<T, R>) => void;
+}

package/dist/Components/Table/Body/Rows/Columns/ExpandCellProps.js

@@ -0,0 +1 @@
+export {};

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

@@ -1,20 +1,14 @@
 <svelte:options runes />
 
-<script lang="ts" module>
-	import { ToastContext } from '../../../../../Contexts/ToastContext.svelte.js';
-	import { getContext, type Snippet } from 'svelte';
+<script lang="ts" generics="T extends object">
 	import { TableContext } from '../../../Types/Context/TableContext.svelte.js';
 	import { TableFocusDetails } from '../../../Types/Focus/TableFocusDetails.svelte.js';
+	import { ToastContext } from '../../../../../Contexts/ToastContext.svelte.js';
+	import { getErrorMessage } from '../../../../../Helpers/Helpers.svelte.js';
 	import type { SelectOption } from '../../../../../Types/Internal/SelectOption.js';
-	import type { TableCell } from '../../../Types/Columns/TableCell.js';
+	import { getContext } from 'svelte';
+	import type { FocusableImmutableCellProps } from './FocusableImmutableCellProps.js';
 
-	export interface FocusableImmutableCellProps<T extends object> {
-		cell: TableCell<T>;
-		children?: Snippet;
-	}
-</script>
-
-<script lang="ts" generics="T extends object">
 	const { cell, children }: FocusableImmutableCellProps<T> = $props();
 
 	const value = $derived(cell.getValue());
@@ -26,10 +20,10 @@
 	const tableContext = getContext<TableContext<T>>(TableContext.identifier);
 	const toastContext = getContext<ToastContext>(ToastContext.identifier);
 
-	const options: SelectOption<unknown>[] = $derived(
-		('options' in cell.column.columnDef
-			? cell.column.columnDef.options
-			: []) as SelectOption<unknown>[]
+	const options: Array<SelectOption<unknown>> = $derived(
+		('options' in cell.column.columnDef ? cell.column.columnDef.options : []) as Array<
+			SelectOption<unknown>
+		>
 	);
 	const hasValue: boolean = $derived(value !== undefined);
 
@@ -82,7 +76,7 @@ class:bottom={focusDetails.bottomEdge} -->
 				visibleValue ??
 				''}
 		{:catch e}
-			{e?.toString()}
+			{getErrorMessage(e)}
 		{/await}
 	{:else if children}
 		<div

package/dist/Components/Table/Body/Rows/Columns/FocusableImmutableCell.svelte.d.ts

@@ -1,9 +1,4 @@
-import { type Snippet } from 'svelte';
-import type { TableCell } from '../../../Types/Columns/TableCell.js';
-export interface FocusableImmutableCellProps<T extends object> {
-    cell: TableCell<T>;
-    children?: Snippet;
-}
+import type { FocusableImmutableCellProps } from './FocusableImmutableCellProps.js';
 declare function $$render<T extends object>(): {
     props: FocusableImmutableCellProps<T>;
     exports: {};

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

@@ -0,0 +1,6 @@
+import type { TableCell } from '../../../Types/Columns/TableCell.js';
+import type { Snippet } from 'svelte';
+export interface FocusableImmutableCellProps<T extends object> {
+    cell: TableCell<T>;
+    children?: Snippet;
+}

package/dist/Components/Table/Body/Rows/Columns/FocusableImmutableCellProps.js

@@ -0,0 +1 @@
+export {};