@lavalogic/scoria 0.24.0 → 0.25.1

package/dist/Components/Table/Types/Context/TableContext.svelte.d.ts

@@ -77,7 +77,7 @@ export declare class TableContext<T extends object, RowIdType extends Primitive>
     private _focusedRowIndices;
     get focusedRowIndices(): ReadonlySet<number>;
     private readonly _highlightedItems;
-    get highlightedItems(): SvelteMap<Awaited<unknown>, T>;
+    get highlightedItems(): SvelteMap<RowIdType, T>;
     _focusedColumnIds: ReadonlySet<string>;
     get focusedColumnIds(): ReadonlySet<string>;
     private _isMousingDown;

package/dist/Components/Table/Types/Context/TableContext.svelte.js

@@ -314,7 +314,6 @@ export class TableContext {
         if (browser) {
             this._getUserDefaults();
             const removeInvalidPresets = () => {
-                console.warn('invalid presets. removing:', localStorage.getItem(`${this.userId}-${tableName}-presets`));
                 localStorage.removeItem(`${this.userId}-${tableName}-presets`);
                 localStorage.removeItem(`${this.userId}-${tableName}-selected-preset-name`);
                 const visibilityState = {};
@@ -1241,6 +1240,7 @@ export class TableContext {
     };
     onHighlightAll = () => {
         if (this.allHighlighted) {
+            // console.debug('All were highlighted. Clearing');
             this.highlightedItems.clear();
             return Promise.resolve();
         }
@@ -2155,6 +2155,9 @@ export class TableContext {
             }
             indices.set(item, rowIndex);
         }
+        selectedRows.sort((left, right) => {
+            return (indices.get(left) ?? -1) - (indices.get(right) ?? -1);
+        });
         // TODO somewhere between here and the ending of the copy functionality, we end up with issues where instead of it using the accessor fn, it tries to pick up the select option, and ends up using the value ("1", etc)
         const selectedCells = [];
         const rowLength = selectedRows.length;

package/dist/Components/Touch/NumberKeyboard.svelte

@@ -3,7 +3,7 @@
 <script lang="ts">
 	import { devCatch, passthrough } from '../../Helpers/Helpers.svelte.js';
 	import { InputVariant } from '../../Types/Internal/InputVariant.js';
-	import { tick } from 'svelte';
+	import { tick, untrack } from 'svelte';
 	import Icon from '../Icon.svelte';
 	import TextInput from '../TextInput.svelte';
 	import type { NumberKeyboardProps } from './NumberKeyboardProps.js';
@@ -17,10 +17,29 @@
 		max,
 		decimal = false,
 		inputRef = $bindable(),
-		coerceValue = true
+		coerceValue = false,
 	}: NumberKeyboardProps = $props();
 
-	let _value: string = $derived(value?.toFixed(decimal ? 2 : 0) ?? '');
+	let _value: string = $derived(
+		value != null && value % 1 == 0 ? value.toString() : getDecimalValue()
+	);
+
+	function getDecimalPlaces(value: number): number {
+		const str = value.toString();
+		if (!str.includes('.')) {
+			return decimal ? 2 : 0;
+		}
+		return str.split('.')[1].length;
+	}
+
+	const decimalPlaces = $derived(
+		min != null ? getDecimalPlaces(min) : max != null ? getDecimalPlaces(max) : decimal ? 2 : 0
+	);
+
+	function getDecimalValue(): string {
+		//HACK this absolutely moronic line is intentional. It's the best way to allow arbitrary decimal places without adding leading zeroes
+		return value ? parseFloat(value.toFixed(decimalPlaces)).toString() : '';
+	}
 
 	const newValue = $derived.by(() => {
 		const v = decimal ? parseFloat(_value) : parseInt(_value);
@@ -32,22 +51,32 @@
 
 	$effect(() => {
 		{
-			value = coerceValue
-				? min != undefined && newValue != null && min > newValue
-					? min
-					: max != undefined && newValue != null && max < newValue
-						? max
-						: newValue
-				: newValue;
+			if (coerceValue) {
+				const v =
+					min != undefined && newValue != null && min > newValue
+						? min
+						: max != undefined && newValue != null && max < newValue
+							? max
+							: newValue;
 
-			tick()
-				.then(() => {
-					inputRef?.focus();
-				})
-				.catch(devCatch);
+				value = v;
+			} else {
+				value = newValue;
+			}
+
+			untrack(() => {
+				refocus();
+			});
 		}
 	});
 
+	function refocus() {
+		tick()
+			.then(() => {
+				inputRef?.focus();
+			})
+			.catch(devCatch);
+	}
 	function getPrevValue() {
 		if (inputRef) {
 			if (
@@ -62,6 +91,7 @@
 
 	function addDecimal() {
 		_value = getPrevValue() + '.';
+		refocus();
 	}
 
 	/* due to the fact that number inputs won't allow a leading dot, we have to use a text input 
@@ -74,16 +104,24 @@
 
 	function backspace() {
 		const preVvalue = getPrevValue();
-		_value = preVvalue && _value.slice(0, _value.length - 1);
+		const v = preVvalue && _value.slice(0, _value.length - 1);
+		_value = v;
 	}
 
 	function minus() {
-		_value = (((decimal ? parseFloat(_value) : parseInt(_value)) || 0) - 1).toString();
+		const v = ((decimal ? parseFloat(_value) : parseInt(_value)) || 0) - 1;
+
+		_value = (min != null ? Math.max(min, v) : v).toString();
 	}
 
 	function plus() {
-		_value = (((decimal ? parseFloat(_value) : parseInt(_value)) || 0) + 1).toString();
+		const v = ((decimal ? parseFloat(_value) : parseInt(_value)) || 0) + 1;
+
+		_value = (max != null ? Math.min(max, v) : v).toString();
 	}
+
+	const lessThanMin = $derived(min != null && (value == null || value < min));
+	const moreThanMax = $derived(max != null && (value == null || value > max));
 </script>
 
 <div class="number-input-wrapper">
@@ -98,6 +136,7 @@
 				bind:value={_value}
 				variant={InputVariant.Modal}
 				required
+				invalid={lessThanMin || moreThanMax}
 			/>
 			{#if max != undefined}
 				<TextInput
@@ -204,7 +243,7 @@
 		<button
 			onkeydown={passthrough}
 			type="button"
-			disabled={!decimal || (value != null && value % 1 !== 0)}
+			disabled={!decimal || (value != null && value % 1 !== 0) || _value.endsWith('.')}
 			onclick={addDecimal}>.</button
 		>
 		<button

package/dist/Components/VerticalTabGroup.svelte

@@ -2,18 +2,11 @@
 
 <script
 	lang="ts"
-	module
+	generics="CommonDenominator"
 >
-	import { dev } from '$app/environment';
 	import { onMount, untrack } from 'svelte';
 	import VerticalTabGroupButton from './VerticalTabGroupButton.svelte';
 	import type { VerticalTabGroupProps } from './VerticalTabGroupProps.js';
-</script>
-
-<script
-	lang="ts"
-	generics="CommonDenominator"
->
 	let {
 		name,
 		tabs,
@@ -24,27 +17,6 @@
 		nohistory = false,
 	}: VerticalTabGroupProps<CommonDenominator> = $props();
 
-	$effect(() => {
-		if (!dev) {
-			return;
-		}
-		for (const tab of tabs) {
-			if (tab.debug) {
-				$inspect(
-					tab.label,
-					tab.content,
-					tab.onclick,
-					tab.args,
-					tab.iconLeft,
-					tab.iconRight,
-					tab.isValid,
-					tab.disabled,
-					tab.visible
-				);
-			}
-		}
-	});
-
 	onMount(() => {
 		if (name && !nohistory) {
 			const tabName = sessionStorage.getItem(`${name}-active-tab`);

package/dist/Types/Internal/TabOption.d.ts

@@ -5,7 +5,6 @@ export interface TabOption<Args> {
     content: Snippet<[Args]>;
     onclick: () => void;
     args: Args;
-    debug?: boolean;
     iconLeft?: IconProps;
     iconRight?: IconProps;
     isValid?: boolean | Promise<boolean>;

package/package.json

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