@lavalogic/scoria 0.11.14 → 0.12.0

package/dist/Components/Table/Types/Context/TableSettings.d.ts

@@ -6,3 +6,11 @@ export interface TableSettings {
     copyWithHeaders: boolean;
     commaSeparatedCopy: boolean;
 }
+export interface SavedTableSettings {
+    isCompact?: boolean;
+    singleClickEditing?: boolean;
+    alternateRowColours?: boolean;
+    changeColourOnHover?: boolean;
+    copyWithHeaders?: boolean;
+    commaSeparatedCopy?: boolean;
+}

package/dist/Components/Table/Types/DataRepository/IDataRepository.d.ts

@@ -1,12 +1,12 @@
 import type { SvelteMap } from 'svelte/reactivity';
-import type { FilterMode } from '../Filtering/FilterMode.js';
-import type { PaginationState } from '../Pagination/PaginationState.js';
-import type { OnChangeFn } from '../OnChangeFn.js';
-import type { SortingState } from './SortingState.js';
 import type { ColumnFiltersState } from '../Filtering/ColumnFiltersState.js';
 import type { BoolFilterValueType, DateFilterValueType, FilterFn, NumberFilterValueType, SelectFilterValueType, StringFilterValueType } from '../Filtering/FilterFn.js';
-import type { PaginationType } from '../Pagination/PaginationType.js';
+import type { FilterMode } from '../Filtering/FilterMode.js';
 import type { FilterType } from '../Filtering/FilterType.js';
+import type { OnChangeFn } from '../OnChangeFn.js';
+import type { PaginationState } from '../Pagination/PaginationState.js';
+import type { PaginationType } from '../Pagination/PaginationType.js';
+import type { SortingState } from './SortingState.js';
 export interface IDataRepository<T extends object> {
     paginationState: PaginationState;
     setPageSize: (size: number) => void;
@@ -34,7 +34,7 @@ export interface IDataRepository<T extends object> {
     __queryValues: SvelteMap<string, unknown>;
     readonly paginationType: PaginationType;
     filterType: FilterType;
-    data: T[];
+    data: Array<T>;
     totalRows: number;
     addEmptyRow?: (() => void) | undefined;
     isLoading?: boolean;

package/dist/Components/Table/Types/DataRepository/ILocalDataRepository.d.ts

@@ -1,8 +1,8 @@
 import type { SvelteMap } from 'svelte/reactivity';
 import type { ColumnFiltersState } from '../Filtering/ColumnFiltersState.js';
+import type { BoolFilterValueType, DateFilterValueType, FilterFn, NumberFilterValueType, SelectFilterValueType, StringFilterValueType } from '../Filtering/FilterFn.js';
 import type { FilterMode } from '../Filtering/FilterMode.js';
 import type { IDataRepository } from './IDataRepository.js';
-import type { BoolFilterValueType, DateFilterValueType, FilterFn, NumberFilterValueType, SelectFilterValueType, StringFilterValueType } from '../Filtering/FilterFn.js';
 export interface ILocalDataRepository<T extends object> extends IDataRepository<T> {
     readonly paginationType: 'Local';
     setPageSize: (size: number | string) => void;

package/dist/Components/Table/Types/DataRepository/LocalTableDataRepository.svelte.d.ts

@@ -14,13 +14,13 @@ export declare const allowedEmptyFilterModes: SvelteSet<StringFilterMode | Numbe
 export declare class LocalTableDataRepository<T extends object> extends TableDataRepository<T> implements ILocalDataRepository<T> {
     addEmptyRow?: (() => void) | undefined;
     readonly filterType: "Real";
-    constructor(tableName: string, dataRef: RefWrapper<T[]>, // reactive
+    constructor(tableName: string, dataRef: RefWrapper<Array<T>>, // reactive
     getUserId: () => string | undefined, addEmptyRow?: (() => void) | undefined);
     private _isLoading;
     get isLoading(): boolean;
     set isLoading(v: boolean);
     private _dataRef;
-    get data(): T[];
+    get data(): Array<T>;
     private _lastPage;
     get lastPage(): number;
     private _sorting;

package/dist/Components/Table/Types/DataRepository/LocalTableDataRepository.svelte.js

@@ -1,4 +1,3 @@
-import { Delay } from '../../../../Delay/Delay.js';
 import { SvelteSet } from 'svelte/reactivity';
 import { FilterType } from '../Filtering/FilterType.js';
 import { NumberDateFilterMode } from '../Filtering/NumberDateFilterMode.js';
@@ -19,7 +18,7 @@ export class LocalTableDataRepository extends TableDataRepository {
         this.addEmptyRow = addEmptyRow;
         this._dataRef = $derived(dataRef);
         this._lastPage = $derived(Math.ceil(this._dataRef.value.length / this.paginationState.pageSize));
-        this._totalRows = $derived(this._dataRef.value?.length ?? -1);
+        this._totalRows = $derived(this._dataRef.value.length);
     }
     _isLoading = $state(false);
     get isLoading() {
@@ -86,10 +85,12 @@ export class LocalTableDataRepository extends TableDataRepository {
             if (oldIndex > -1) {
                 newFiltering.splice(oldIndex, 1);
             }
-            const hasValue = allowedEmptyFilterModes.has(this.filterModes.get(id)) ||
-                !(value == null ||
-                    (typeof value === 'object' && Array.isArray(value) && value.length === 0) ||
-                    (typeof value === 'string' && value.length === 0));
+            const filterMode = this.filterModes.get(id);
+            const hasValue = filterMode &&
+                (allowedEmptyFilterModes.has(filterMode) ||
+                    !(value == null ||
+                        (typeof value === 'object' && Array.isArray(value) && value.length === 0) ||
+                        (typeof value === 'string' && value.length === 0)));
             if (hasValue) {
                 newFiltering.push({ id, value });
             }
@@ -176,9 +177,10 @@ export class LocalTableDataRepository extends TableDataRepository {
         const columnValue = await row.getValue(columnId);
         const filterType = this.filterModes.get(columnId) ?? NumberDateFilterMode.In;
         if (filterType == NumberDateFilterMode.null) {
-            return columnValue == null || isNaN(columnValue);
+            // TODO test
+            return columnValue == null || typeof columnValue != 'number' || isNaN(columnValue);
         }
-        if (!columnValue) {
+        if (!columnValue || typeof columnValue != 'number') {
             return false;
         }
         switch (filterType) {

package/dist/Components/Table/Types/DataRepository/SortingState.d.ts

@@ -2,4 +2,4 @@ export interface ColumnSort {
     desc: boolean;
     id: string;
 }
-export type SortingState = ColumnSort[];
+export type SortingState = Array<ColumnSort>;

package/dist/Components/Table/Types/DataRepository/TableDataRepository.svelte.d.ts

@@ -1,9 +1,9 @@
 import { SvelteMap } from 'svelte/reactivity';
+import type { ColumnFiltersState } from '../Filtering/ColumnFiltersState.js';
 import type { FilterMode } from '../Filtering/FilterMode.js';
 import type { FilterType } from '../Filtering/FilterType.js';
 import type { PaginationState } from '../Pagination/PaginationState.js';
 import type { IDataRepository } from './IDataRepository.js';
-import type { ColumnFiltersState } from '../Filtering/ColumnFiltersState.js';
 import type { SortingState } from './SortingState.js';
 export interface ReadonlyPaginationState extends PaginationState {
     readonly pageIndex: number;
@@ -16,7 +16,7 @@ export declare abstract class TableDataRepository<T extends object> implements I
     abstract filterType: FilterType;
     abstract totalRows: number;
     abstract isLoading: boolean;
-    abstract data: T[];
+    abstract data: Array<T>;
     abstract setPageSize: (size: number) => void;
     abstract filtering: ColumnFiltersState;
     abstract setFilterMode: (id: string, mode: FilterMode) => void;
@@ -41,7 +41,7 @@ export declare abstract class TableDataRepository<T extends object> implements I
     get forceRefresh(): () => void;
     set forceRefresh(v: () => void);
     readonly registerRefreshMethod: (method: () => void) => void;
-    protected getValueSet(values: (string | number | undefined)[]): Set<number>;
-    static getValues(values: (string | number | undefined)[]): number[];
-    static getMinMax(values: (string | number | undefined)[]): number[] | undefined[];
+    protected getValueSet(values: Array<string | number | undefined>): Set<number>;
+    static getValues(values: Array<string | number | undefined>): Array<number>;
+    static getMinMax(values: Array<string | number | undefined>): number[] | undefined[];
 }

package/dist/Components/Table/Types/DataRepository/TableDataRepository.svelte.js

@@ -1,5 +1,5 @@
-import { SvelteMap } from 'svelte/reactivity';
 import { browser } from '$app/environment';
+import { SvelteMap } from 'svelte/reactivity';
 export class TableDataRepository {
     tableName;
     getUserId;
@@ -16,7 +16,7 @@ export class TableDataRepository {
         return this._paginationState;
     }
     set paginationState(v) {
-        this._previouslyViewedPage = this._paginationState?.pageIndex;
+        this._previouslyViewedPage = this._paginationState.pageIndex;
         this._paginationState = v;
         if (browser) {
             localStorage.setItem(`${this.getUserId()}-${this.tableName}-page-size`, v.pageSize.toString());
@@ -44,6 +44,8 @@ export class TableDataRepository {
         this._forceRefresh = method;
     };
     getValueSet(values) {
+        // FIXME
+        // eslint-disable-next-line svelte/prefer-svelte-reactivity
         return new Set(TableDataRepository.getValues(values));
     }
     static getValues(values) {
@@ -51,7 +53,7 @@ export class TableDataRepository {
             .toString()
             .split(',')
             .map((it) => {
-            return parseFloat(it.toString());
+            return parseFloat(it);
         })
             .filter((it) => !isNaN(it));
     }

package/dist/Components/Table/Types/Filtering/ColumnFiltersState.d.ts

@@ -2,4 +2,4 @@ export interface ColumnFilter<T = unknown> {
     id: string;
     value: T;
 }
-export type ColumnFiltersState = ColumnFilter[];
+export type ColumnFiltersState = Array<ColumnFilter>;

package/dist/Components/Table/Types/Filtering/FilterFn.d.ts

@@ -6,4 +6,4 @@ export type SelectFilterValueType<T, columnType = T[keyof T]> = string | Array<u
 } | undefined;
 export type BoolFilterValueType = boolean | null;
 export type StringFilterValueType = string | null;
-export type FilterFn<T extends object, FilterValueType> = (row: Row<T>, columnId: string, filterValue: FilterValueType) => boolean | Promise<boolean>;
+export type FilterFn<T extends object, FilterValueType> = (row: Row<T>, columnId: string, filterValue: FilterValueType) => Promise<boolean>;

package/dist/Components/Table/Types/Focus/TableFocusDetails.svelte.js

@@ -47,12 +47,13 @@ export class TableFocusDetails {
     get isMultiFocusStart() {
         return this._isMultiFocusStart;
     }
-    _topToBottom = $derived(this.hasMultipleFocus && this.tableContext.focusStart.row < this.tableContext.focusEnd.row);
+    _topToBottom = $derived(this.hasMultipleFocus &&
+        (this.tableContext.focusStart?.row ?? 0) < (this.tableContext.focusEnd?.row ?? 0));
     get topToBottom() {
         return this._topToBottom;
     }
     _leftToRight = $derived(this.hasMultipleFocus &&
-        this.tableContext.focusStart.column < this.tableContext.focusEnd.column);
+        (this.tableContext.focusStart?.column ?? 0) < (this.tableContext.focusEnd?.column ?? 0));
     get leftToRight() {
         return this._leftToRight;
     }

package/dist/Components/TextArea.svelte

@@ -1,38 +1,10 @@
 <svelte:options runes />
 
-<script lang="ts" module>
-	export interface TextAreaProps {
-		value: string;
-
-		onblur?: (e: FocusEvent) => void;
-		onfocus?: (e: FocusEvent) => void;
-		labelTop?: string | undefined;
-		labelRight?: string;
-		placeholder?: string | undefined;
-		required?: boolean;
-		variant?: InputVariant;
-		selectNone?: boolean;
-		optional?: boolean;
-		uppercase?: boolean;
-		disabled?: boolean;
-		invalid?: boolean;
-		maxWidth?: boolean;
-		showErrorColours?: boolean;
-		leftIcon?: PartialIconProps;
-		rightIcon?: PartialIconProps;
-		onLeftIconClick?: () => void;
-		onRightIconClick?: () => void;
-		rows?: number;
-		textAreaRef?: HTMLTextAreaElement | undefined;
-		noresize?: boolean;
-	}
-</script>
-
 <script lang="ts">
 	import { InputVariant } from '../Types/Internal/InputVariant.js';
 	import { Size } from '../Types/Internal/Size.js';
-
-	import Icon, { type PartialIconProps } from './Icon.svelte';
+	import Icon from './Icon.svelte';
+	import type { TextAreaProps } from './TextAreaProps.js';
 
 	let {
 		value = $bindable(''),

package/dist/Components/TextArea.svelte.d.ts

@@ -1,29 +1,4 @@
-export interface TextAreaProps {
-    value: string;
-    onblur?: (e: FocusEvent) => void;
-    onfocus?: (e: FocusEvent) => void;
-    labelTop?: string | undefined;
-    labelRight?: string;
-    placeholder?: string | undefined;
-    required?: boolean;
-    variant?: InputVariant;
-    selectNone?: boolean;
-    optional?: boolean;
-    uppercase?: boolean;
-    disabled?: boolean;
-    invalid?: boolean;
-    maxWidth?: boolean;
-    showErrorColours?: boolean;
-    leftIcon?: PartialIconProps;
-    rightIcon?: PartialIconProps;
-    onLeftIconClick?: () => void;
-    onRightIconClick?: () => void;
-    rows?: number;
-    textAreaRef?: HTMLTextAreaElement | undefined;
-    noresize?: boolean;
-}
-import { InputVariant } from '../Types/Internal/InputVariant.js';
-import { type PartialIconProps } from './Icon.svelte';
+import type { TextAreaProps } from './TextAreaProps.js';
 declare const TextArea: import("svelte").Component<TextAreaProps, {}, "value" | "textAreaRef">;
 type TextArea = ReturnType<typeof TextArea>;
 export default TextArea;

package/dist/Components/TextAreaProps.d.ts

@@ -0,0 +1,26 @@
+import type { InputVariant } from '../Types/Internal/InputVariant.js';
+import type { PartialIconProps } from './PartialIconProps.js';
+export interface TextAreaProps {
+    value: string;
+    onblur?: (e: FocusEvent) => void;
+    onfocus?: (e: FocusEvent) => void;
+    labelTop?: string | undefined;
+    labelRight?: string;
+    placeholder?: string | undefined;
+    required?: boolean;
+    variant?: InputVariant;
+    selectNone?: boolean;
+    optional?: boolean;
+    uppercase?: boolean;
+    disabled?: boolean;
+    invalid?: boolean;
+    maxWidth?: boolean;
+    showErrorColours?: boolean;
+    leftIcon?: PartialIconProps;
+    rightIcon?: PartialIconProps;
+    onLeftIconClick?: () => void;
+    onRightIconClick?: () => void;
+    rows?: number;
+    textAreaRef?: HTMLTextAreaElement | undefined;
+    noresize?: boolean;
+}

package/dist/Components/TextAreaProps.js

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

package/dist/Components/TextInput.svelte

@@ -1,47 +1,13 @@
 <svelte:options runes />
 
-<script lang="ts" module>
-	import type { FormEventHandler } from 'svelte/elements';
-	import type { PartialIconProps } from './Icon.svelte';
+<script lang="ts">
+	import { isValidEmailAddress } from '../Helpers/Helpers.svelte.js';
+	import { Colour, ColourSet } from '../scss/colours.js';
 	import { InputVariant } from '../Types/Internal/InputVariant.js';
 	import { Size } from '../Types/Internal/Size.js';
-	import Icon from './Icon.svelte';
-	import { Colour, ColourSet } from '../scss/colours.js';
 	import Action from './Action.svelte';
-	import { isValidEmailAddress } from '../Helpers/Helpers.svelte.js';
-
-	export interface TextInputProps {
-		value?: string | null;
-
-		type?: 'text' | 'tel' | 'email';
-		optional?: boolean;
-		id?: string;
-		labelTop?: string | undefined;
-		labelRight?: string | undefined;
-		placeholder?: string | undefined;
-		required?: boolean;
-		variant?: InputVariant;
-		selectNone?: boolean;
-		uppercase?: boolean;
-		disabled?: boolean;
-		invalid?: boolean;
-		showErrorColours?: boolean;
-		leftIcon?: PartialIconProps;
-		rightIcon?: PartialIconProps;
-		leftIconDisabled?: boolean;
-		rightIconDisabled?: boolean;
-		onLeftIconClick?: () => void;
-		onRightIconClick?: () => void;
-		inputRef?: HTMLInputElement | undefined;
-		'data-type'?: string;
-		onblur?: (e: FocusEvent) => void;
-		onfocus?: (e: FocusEvent) => void;
-		onkeydown?: (e: KeyboardEvent) => void;
-		oninput?: FormEventHandler<HTMLInputElement>;
-	}
-</script>
-
-<script lang="ts">
+	import Icon from './Icon.svelte';
+	import type { TextInputProps } from './TextInputProps.js';
 	let {
 		id,
 		value = $bindable(''),
@@ -57,7 +23,7 @@
 		invalid = false,
 		showErrorColours = true,
 		rightIconDisabled = false,
-		leftIconDisabled = false,
+		// leftIconDisabled = false,
 		leftIcon,
 		rightIcon,
 		type,

package/dist/Components/TextInput.svelte.d.ts

@@ -1,34 +1,4 @@
-import type { FormEventHandler } from 'svelte/elements';
-import type { PartialIconProps } from './Icon.svelte';
-import { InputVariant } from '../Types/Internal/InputVariant.js';
-export interface TextInputProps {
-    value?: string | null;
-    type?: 'text' | 'tel' | 'email';
-    optional?: boolean;
-    id?: string;
-    labelTop?: string | undefined;
-    labelRight?: string | undefined;
-    placeholder?: string | undefined;
-    required?: boolean;
-    variant?: InputVariant;
-    selectNone?: boolean;
-    uppercase?: boolean;
-    disabled?: boolean;
-    invalid?: boolean;
-    showErrorColours?: boolean;
-    leftIcon?: PartialIconProps;
-    rightIcon?: PartialIconProps;
-    leftIconDisabled?: boolean;
-    rightIconDisabled?: boolean;
-    onLeftIconClick?: () => void;
-    onRightIconClick?: () => void;
-    inputRef?: HTMLInputElement | undefined;
-    'data-type'?: string;
-    onblur?: (e: FocusEvent) => void;
-    onfocus?: (e: FocusEvent) => void;
-    onkeydown?: (e: KeyboardEvent) => void;
-    oninput?: FormEventHandler<HTMLInputElement>;
-}
+import type { TextInputProps } from './TextInputProps.js';
 declare const TextInput: import("svelte").Component<TextInputProps, {}, "value" | "inputRef">;
 type TextInput = ReturnType<typeof TextInput>;
 export default TextInput;

package/dist/Components/TextInputProps.d.ts

@@ -0,0 +1,31 @@
+import type { InputVariant } from '../Types/Internal/InputVariant.js';
+import type { FormEventHandler } from 'svelte/elements';
+import type { PartialIconProps } from './PartialIconProps.js';
+export interface TextInputProps {
+    value?: string | null;
+    type?: 'text' | 'tel' | 'email';
+    optional?: boolean;
+    id?: string;
+    labelTop?: string | undefined;
+    labelRight?: string | undefined;
+    placeholder?: string | undefined;
+    required?: boolean;
+    variant?: InputVariant;
+    selectNone?: boolean;
+    uppercase?: boolean;
+    disabled?: boolean;
+    invalid?: boolean;
+    showErrorColours?: boolean;
+    leftIcon?: PartialIconProps;
+    rightIcon?: PartialIconProps;
+    leftIconDisabled?: boolean;
+    rightIconDisabled?: boolean;
+    onLeftIconClick?: () => void;
+    onRightIconClick?: () => void;
+    inputRef?: HTMLInputElement | undefined;
+    'data-type'?: string;
+    onblur?: (e: FocusEvent) => void;
+    onfocus?: (e: FocusEvent) => void;
+    onkeydown?: (e: KeyboardEvent) => void;
+    oninput?: FormEventHandler<HTMLInputElement>;
+}

package/dist/Components/TextInputProps.js

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

package/dist/Components/ThreeStateRadio.svelte

@@ -1,36 +1,17 @@
 <svelte:options runes />
 
 <script lang="ts" module>
-	import type { ChangeEventHandler } from 'svelte/elements';
-	import Action from './Action.svelte';
-	import { untrack } from 'svelte';
-	import { generateShortUUID } from '../Helpers/Helpers.svelte.js';
 	import { Colour, ColourSet } from '../scss/colours.js';
 	import { Ternary } from '../Types/Internal/Ternary.js';
-	import type { PartialIconProps } from './Icon.svelte';
-	export interface ThreeStateRadioProps {
-		label?: string;
-		value?: Ternary;
-		onchange?: (value: Ternary) => void;
-		id?: string;
-		disabled?: boolean;
-		isValid?: boolean;
-		noDisabled?: boolean;
-		yesDisabled?: boolean;
-		neutralDisabled?: boolean;
-		noLabel?: string;
-		yesLabel?: string;
-		neutralLabel?: string;
-		noIcon?: PartialIconProps;
-		yesIcon?: PartialIconProps;
-		neutralIcon?: PartialIconProps;
-	}
+	import { untrack } from 'svelte';
+	import Action from './Action.svelte';
+	import type { ThreeStateRadioProps } from './ThreeStateRadioProps.js';
 </script>
 
 <script lang="ts">
 	let {
 		value = $bindable(Ternary.Neutral),
-		id = generateShortUUID(),
+		// id = generateShortUUID(),
 		label,
 		disabled,
 		isValid,

package/dist/Components/ThreeStateRadio.svelte.d.ts

@@ -1,22 +1,4 @@
-import { Ternary } from '../Types/Internal/Ternary.js';
-import type { PartialIconProps } from './Icon.svelte';
-export interface ThreeStateRadioProps {
-    label?: string;
-    value?: Ternary;
-    onchange?: (value: Ternary) => void;
-    id?: string;
-    disabled?: boolean;
-    isValid?: boolean;
-    noDisabled?: boolean;
-    yesDisabled?: boolean;
-    neutralDisabled?: boolean;
-    noLabel?: string;
-    yesLabel?: string;
-    neutralLabel?: string;
-    noIcon?: PartialIconProps;
-    yesIcon?: PartialIconProps;
-    neutralIcon?: PartialIconProps;
-}
+import type { ThreeStateRadioProps } from './ThreeStateRadioProps.js';
 declare const ThreeStateRadio: import("svelte").Component<ThreeStateRadioProps, {}, "value">;
 type ThreeStateRadio = ReturnType<typeof ThreeStateRadio>;
 export default ThreeStateRadio;

package/dist/Components/ThreeStateRadioProps.d.ts

@@ -0,0 +1,19 @@
+import type { Ternary } from '../Types/Internal/Ternary.js';
+import type { PartialIconProps } from './PartialIconProps.js';
+export interface ThreeStateRadioProps {
+    label?: string;
+    value?: Ternary;
+    onchange?: (value: Ternary) => void;
+    id?: string;
+    disabled?: boolean;
+    isValid?: boolean;
+    noDisabled?: boolean;
+    yesDisabled?: boolean;
+    neutralDisabled?: boolean;
+    noLabel?: string;
+    yesLabel?: string;
+    neutralLabel?: string;
+    noIcon?: PartialIconProps;
+    yesIcon?: PartialIconProps;
+    neutralIcon?: PartialIconProps;
+}

package/dist/Components/ThreeStateRadioProps.js

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

package/dist/Components/Touch/BoolCard.svelte

@@ -5,7 +5,8 @@
 	import { Colour } from '../../scss/colours.js';
 	import { Size } from '../../Types/Internal/Size.js';
 	import type { Snippet } from 'svelte';
-	import Icon, { type IconProps } from '../Icon.svelte';
+	import Icon from '../Icon.svelte';
+	import type { IconProps } from '../IconProps.js';
 
 	export interface BoolCardProps {
 		value?: boolean;
@@ -27,7 +28,7 @@
 		size = Size.Medium
 	}: BoolCardProps = $props();
 
-	const iconName = $derived(value === true ? 'circle-tick' : ('circle' as IconProps['name']));
+	const iconName = $derived(value ? 'circle-tick' : ('circle' as IconProps['name']));
 </script>
 
 <button

package/dist/Components/Touch/DateModal.svelte

@@ -1,15 +1,15 @@
 <svelte:options runes />
 
 <script lang="ts" module>
-	import { tick, type Snippet } from 'svelte';
-	import TouchModal from './TouchModal.svelte';
-	import { passthrough } from '../../Helpers/Helpers.svelte.js';
+	import { devCatch, passthrough } from '../../Helpers/Helpers.svelte.js';
 	import { ColourSet } from '../../scss/colours.js';
 	import { InputVariant } from '../../Types/Internal/InputVariant.js';
 	import { Size } from '../../Types/Internal/Size.js';
+	import { tick, type Snippet } from 'svelte';
 	import Action from '../Action.svelte';
 	import DatePicker from '../DatePicker.svelte';
 	import TextInput from '../TextInput.svelte';
+	import TouchModal from './TouchModal.svelte';
 
 	export interface DateModalProps {
 		header: string;
@@ -47,7 +47,9 @@
 		showTime = false
 	}: DateModalProps = $props();
 
+	//  svelte-ignore state_referenced_locally
 	let valueSnapshot = $state(value);
+	//  svelte-ignore state_referenced_locally
 	let tempValue = $state(value ?? new Date());
 	let overrideValue = $state(new Date());
 	let isBeingEdited = $state(false);
@@ -70,13 +72,15 @@
 	$effect(() => {
 		void isBeingEdited;
 		void allowOverride;
-		tick().then(() => {
-			if (isBeingEdited) {
-				overrideInputRef?.focus();
-			} else {
-				inputRef?.focus();
-			}
-		});
+		tick()
+			.then(() => {
+				if (isBeingEdited) {
+					overrideInputRef?.focus();
+				} else {
+					inputRef?.focus();
+				}
+			})
+			.catch(devCatch);
 	});
 
 	function onsubmit(e?: SubmitEvent) {
@@ -136,6 +140,7 @@
 	{#if showScanner}
 		<div class="inputs">
 			{#if allowOverride}
+				<!-- eslint-disable-next-line @typescript-eslint/no-confusing-void-expression -->
 				{@render overrideButton()}
 			{/if}
 			{#if isBeingEdited}
@@ -156,6 +161,7 @@
 			/>
 		</div>
 	{:else if allowOverride}
+		<!-- eslint-disable-next-line @typescript-eslint/no-confusing-void-expression -->
 		{@render overrideButton()}
 	{/if}
 
@@ -169,7 +175,13 @@
 	{#snippet footer()}
 		<div class="modal-footer">
 			<button onkeydown={passthrough} type="submit" disabled={!isValid}>Confirm</button>
-			<button onkeydown={passthrough} type="button" onclick={() => cancelEditing()}>Cancel</button>
+			<button
+				onkeydown={passthrough}
+				type="button"
+				onclick={() => {
+					cancelEditing();
+				}}>Cancel</button
+			>
 		</div>
 	{/snippet}
 </TouchModal>

package/dist/Components/Touch/DefaultTimer.d.ts

@@ -0,0 +1,5 @@
+export interface DefaultTimer {
+    time: number;
+    action: 'submit' | 'close';
+    callback?: () => void;
+}

package/dist/Components/Touch/DefaultTimer.js

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