@lavalogic/scoria 0.25.0 → 0.25.2

package/dist/Components/NumberInput.svelte

@@ -31,11 +31,10 @@
 		oninput,
 
 		inputRef = $bindable(),
-		'data-type': dataType
+		'data-type': dataType,
 	}: NumberInputProps = $props();
 
-	// HACK cannot alter signature because it's passed by a use: directive
-	// eslint-disable-next-line @typescript-eslint/no-unused-vars
+	// NOTE cannot alter signature because it's passed by a use: directive
 	function numberValidator(_node: HTMLInputElement, _newValue: number | null) {
 		return {
 			update(newValue: number) {
@@ -43,7 +42,7 @@
 				const overMaximum = max != undefined && max < newValue;
 
 				value = isNaN(newValue) ? 0 : underMinimum ? min : overMaximum ? max : newValue;
-			}
+			},
 		};
 	}
 
@@ -69,13 +68,18 @@
 				>{labelTop}{#if optional}<i>&nbsp;- optional</i>{/if}</span
 			>
 			{#if variant === InputVariant.Default}
-				<span class="border" class:invalid={isInvalid}
+				<span
+					class="border"
+					class:invalid={isInvalid}
 					>{labelTop}{#if optional}<i>&nbsp;- optional</i>{/if}</span
 				>
 			{/if}
 		{/if}
 		<!-- style="--background-colour: {leftIcon?.backgroundColour ?? rightIcon?.backgroundColour};" -->
-		<div class="icon-container" class:for-modal={variant == InputVariant.Modal}>
+		<div
+			class="icon-container"
+			class:for-modal={variant == InputVariant.Modal}
+		>
 			{#if leftIcon}
 				<Icon
 					name={leftIcon.name}
@@ -128,8 +132,9 @@
 				/>
 			{/if}
 			{#if labelRight}
-				<span class="right-label inset" class:for-modal={variant == InputVariant.Modal}
-					>{labelRight}</span
+				<span
+					class="right-label inset"
+					class:for-modal={variant == InputVariant.Modal}>{labelRight}</span
 				>
 			{/if}
 		</div>

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

@@ -46,29 +46,37 @@
 			tableContext.focusStartIsBeingEdited
 	);
 
+	function handleEditable(isEditable: boolean): Promise<void> {
+		if (isEditable) {
+			return tick().then(() => {
+				modalLock = true;
+			});
+		} else {
+			if (modalLock) {
+				return tick().then(() => {
+					if (!tableContext.singleClickEditing) {
+						tableContext.focusStartIsBeingEdited = false;
+					}
+					modalLock = false;
+				});
+			}
+
+			return Promise.resolve();
+		}
+	}
+
 	$effect(() => {
 		void editable;
 		if (wantsToBeEdited) {
-			editable
-				.then((isEditable) => {
-					if (isEditable) {
-						return tick().then(() => {
-							modalLock = true;
-						});
-					} else {
-						if (modalLock) {
-							return tick().then(() => {
-								if (!tableContext.singleClickEditing) {
-									tableContext.focusStartIsBeingEdited = false;
-								}
-								modalLock = false;
-							});
-						}
-
-						return;
-					}
-				})
-				.catch(devCatch);
+			if (editable instanceof Promise) {
+				editable
+					.then((isEditable) => {
+						return handleEditable(isEditable);
+					})
+					.catch(devCatch);
+			} else {
+				handleEditable(editable).catch(devCatch);
+			}
 		} else {
 			tick()
 				.then(() => {

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

@@ -89,71 +89,40 @@
 
 	let isBeingEdited = $state(false);
 
-	/*
-	 	$effect(() => {
-		void editable;
-		if (wantsToBeEdited) {
-			if (editable) {
-				tick()
-					.then(() => {
-						untrack(() => {
-							isBeingEdited = true;
-						});
-					})
-					.catch(devCatch);
-			} else {
-				tick()
-					.then(() => {
-						untrack(() => {
-							tableContext.focusStartIsBeingEdited = false;
-						});
-					})
-					.catch(devCatch);
-			}
+	function handleIsEditable(isEditable: boolean): Promise<void> {
+		if (isEditable) {
+			return tick().then(() => {
+				isBeingEdited = true;
+			});
 		} else {
 			if (isBeingEdited) {
-				tick()
+				return tick()
 					.then(() => {
-						untrack(() => {
-							if (!tableContext.singleClickEditing) {
-								tableContext.focusStartIsBeingEdited = false;
-							}
+						if (!tableContext.singleClickEditing) {
+							tableContext.focusStartIsBeingEdited = false;
+						}
 
-							isBeingEdited = false;
-						});
+						isBeingEdited = false;
 					})
 					.catch(devCatch);
 			}
 		}
-	});
-	*/
+		return Promise.resolve();
+	}
+
 	$effect(() => {
 		void editable;
 		if (wantsToBeEdited) {
-			editable
-				.then((isEditable) => {
-					if (isEditable) {
-						return tick().then(() => {
-							isBeingEdited = true;
-						});
-					} else {
-						if (isBeingEdited) {
-							return tick()
-								.then(() => {
-									if (!tableContext.singleClickEditing) {
-										tableContext.focusStartIsBeingEdited = false;
-									}
-
-									isBeingEdited = false;
-								})
-								.catch(devCatch);
-						}
-					}
-
-					return;
-				})
+			if (editable instanceof Promise) {
+				editable
+					.then((isEditable) => {
+						return handleIsEditable(isEditable);
+					})
 
-				.catch(devCatch);
+					.catch(devCatch);
+			} else {
+				handleIsEditable(editable).catch(devCatch);
+			}
 		} else {
 			tick()
 				.then(() => {

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

@@ -34,13 +34,27 @@
 	const keyOrPromise: RowIdType | Promise<RowIdType> = $derived(
 		tableContext.selectionExtractor(cell.row.original)
 	);
-	const isSelectable = $derived(
+	const isSelectableMaybePromise = $derived(
 		(cell.column.columnDef as RowSelectionDef<T>).isSelectable(
 			cell.row.original,
 			cell.row.originalIndex
 		)
 	);
 
+	let isSelectable = $state(false);
+
+	$effect(() => {
+		if (isSelectableMaybePromise instanceof Promise) {
+			isSelectableMaybePromise
+				.then((it) => {
+					isSelectable = it;
+				})
+				.catch(devCatch);
+		} else {
+			isSelectable = isSelectableMaybePromise;
+		}
+	});
+
 	// Sync path (common): uses selectedItems.has(key) for per-key reactive tracking —
 	// only this row's checkbox re-runs when its specific key changes.
 	// Async path (rare): returns null and defers to _isSelectedAsync updated by the $effect below.
@@ -56,7 +70,9 @@
 	let _isSelectedAsync: boolean = $state(false);
 	$effect(() => {
 		const k = keyOrPromise;
-		if (!(k instanceof Promise)) { return; }
+		if (!(k instanceof Promise)) {
+			return;
+		}
 		void tableContext.selectedItems.size; // re-run when selection changes
 		k.then((key) => {
 			_isSelectedAsync = tableContext.selectedItems.has(key);

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

@@ -51,33 +51,42 @@
 	);
 
 	let isBeingEdited = $derived(false);
+
+	function handleIsEditable(isEditable: boolean): Promise<void> {
+		if (isEditable) {
+			return tick().then(() => {
+				isBeingEdited = true;
+			});
+		} else {
+			if (isBeingEdited) {
+				return tick()
+					.then(() => {
+						if (!tableContext.singleClickEditing) {
+							tableContext.focusStartIsBeingEdited = false;
+						}
+
+						isBeingEdited = false;
+					})
+					.catch(devCatch);
+			}
+		}
+
+		return Promise.resolve();
+	}
+
 	$effect(() => {
 		void editable;
 		if (wantsToBeEdited) {
-			editable
-				.then((isEditable) => {
-					if (isEditable) {
-						return tick().then(() => {
-							isBeingEdited = true;
-						});
-					} else {
-						if (isBeingEdited) {
-							return tick()
-								.then(() => {
-									if (!tableContext.singleClickEditing) {
-										tableContext.focusStartIsBeingEdited = false;
-									}
-
-									isBeingEdited = false;
-								})
-								.catch(devCatch);
-						}
-					}
-
-					return;
-				})
+			if (editable instanceof Promise) {
+				editable
+					.then((isEditable) => {
+						return handleIsEditable(isEditable);
+					})
 
-				.catch(devCatch);
+					.catch(devCatch);
+			} else {
+				handleIsEditable(editable).catch(devCatch);
+			}
 		} else {
 			tick()
 				.then(() => {

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

@@ -82,7 +82,7 @@ export function generateExampleItemColumnDefs(modal) {
             getDisplayValue: (item) => {
                 return item.simulatedQuery?.value ?? null;
             },
-            isEditable: () => Promise.resolve(true),
+            isEditable: () => true,
             id: 'simulatedQuery',
             query: async (_v, item) => {
                 void item.someDate;
@@ -101,13 +101,13 @@ export function generateExampleItemColumnDefs(modal) {
         new TextInputDef({
             header: 'Name',
             id: 'name',
-            isEditable: () => Promise.resolve(true),
+            isEditable: () => true,
             isValid,
         }),
         new NumberInputDef({
             header: 'Some Number',
             id: 'someNumber',
-            isEditable: () => Promise.resolve(true),
+            isEditable: () => true,
             min: 0,
             max: 12345,
             isValid,
@@ -150,20 +150,20 @@ export function generateExampleItemColumnDefs(modal) {
         new DateInputDef({
             header: 'Some Date With Time',
             id: 'someDateWithTime',
-            isEditable: () => Promise.resolve(true),
+            isEditable: () => true,
             showTime: true,
             isValid,
         }),
         new DateInputDef({
             header: 'Flo Date',
             id: 'floDate',
-            isEditable: () => Promise.resolve(true),
+            isEditable: () => true,
             defaultHidden: true,
         }),
         new DateInputDef({
             header: 'Flo Date With Time',
             id: 'floDateWithTime',
-            isEditable: () => Promise.resolve(true),
+            isEditable: () => true,
             defaultHidden: true,
             showTime: true,
             isValid,
@@ -194,7 +194,7 @@ export function generateExampleItemColumnDefs(modal) {
                 ];
             },
             getDisplayValue: (item) => item.someSelect,
-            isEditable: () => Promise.resolve(true),
+            isEditable: () => true,
             isValid,
         }),
         new BubbleDef({

package/dist/Components/Table/Types/Columns/Definitions/ColumnDef.svelte.d.ts

@@ -17,7 +17,7 @@ export interface ColumnDefProps<T extends object, in FilterFnType, out OptionsTy
     defaultHidden?: boolean;
     minSize?: Pixels;
     width?: Pixels;
-    isEditable?: (item: T, index: number) => Promise<boolean>;
+    isEditable?: (item: T, index: number) => boolean | Promise<boolean>;
     resizable?: boolean;
     isValid?: ValidationFn<T>;
     filterFn?: FilterFn<T, FilterFnType>;
@@ -57,7 +57,7 @@ export declare abstract class ColumnDef<T extends object, in FilterFnType = neve
     set filterValueType(v: FilterValueType | undefined);
     readonly getDisplayValue: ((item: T, index: number) => string | null | Promise<string | null>) | undefined;
     toJSON(): ColumnJSONRepresentation;
-    readonly isEditable: (item: T, index: number) => Promise<boolean>;
+    readonly isEditable: (item: T, index: number) => boolean | Promise<boolean>;
     readonly resizable: boolean;
     readonly header: string | Snippet;
     readonly getOptions?: () => Array<SelectOption<OptionsType>> | Promise<Array<SelectOption<OptionsType>>>;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@lavalogic/scoria",
   "description": "Svelte components used for the FloWMS Web Frontend",
-  "version": "0.25.0",
+  "version": "0.25.2",
   "publishConfig": {
     "access": "restricted"
   },