@lavalogic/scoria 0.37.44 → 0.37.46

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

@@ -1,26 +1,26 @@
 import type { Primitive } from '../Types/Context/TableInitOptions.js';
 import type { FilterInputProps } from './FilterInputProps.js';
-declare function $$render<T extends object, IdType extends Primitive, FilterValueType, FilterOptionsType>(): {
-    props: FilterInputProps<T, FilterValueType, FilterOptionsType>;
+declare function $$render<T extends object, IdType extends Primitive, FilterValueType>(): {
+    props: FilterInputProps<T, FilterValueType>;
     exports: {};
     bindings: "";
     slots: {};
     events: {};
 };
-declare class __sveltets_Render<T extends object, IdType extends Primitive, FilterValueType, FilterOptionsType> {
-    props(): ReturnType<typeof $$render<T, IdType, FilterValueType, FilterOptionsType>>['props'];
-    events(): ReturnType<typeof $$render<T, IdType, FilterValueType, FilterOptionsType>>['events'];
-    slots(): ReturnType<typeof $$render<T, IdType, FilterValueType, FilterOptionsType>>['slots'];
+declare class __sveltets_Render<T extends object, IdType extends Primitive, FilterValueType> {
+    props(): ReturnType<typeof $$render<T, IdType, FilterValueType>>['props'];
+    events(): ReturnType<typeof $$render<T, IdType, FilterValueType>>['events'];
+    slots(): ReturnType<typeof $$render<T, IdType, FilterValueType>>['slots'];
     bindings(): "";
     exports(): {};
 }
 interface $$IsomorphicComponent {
-    new <T extends object, IdType extends Primitive, FilterValueType, FilterOptionsType>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<T, IdType, FilterValueType, FilterOptionsType>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<T, IdType, FilterValueType, FilterOptionsType>['props']>, ReturnType<__sveltets_Render<T, IdType, FilterValueType, FilterOptionsType>['events']>, ReturnType<__sveltets_Render<T, IdType, FilterValueType, FilterOptionsType>['slots']>> & {
-        $$bindings?: ReturnType<__sveltets_Render<T, IdType, FilterValueType, FilterOptionsType>['bindings']>;
-    } & ReturnType<__sveltets_Render<T, IdType, FilterValueType, FilterOptionsType>['exports']>;
-    <T extends object, IdType extends Primitive, FilterValueType, FilterOptionsType>(internal: unknown, props: ReturnType<__sveltets_Render<T, IdType, FilterValueType, FilterOptionsType>['props']> & {}): ReturnType<__sveltets_Render<T, IdType, FilterValueType, FilterOptionsType>['exports']>;
-    z_$$bindings?: ReturnType<__sveltets_Render<any, any, any, any>['bindings']>;
+    new <T extends object, IdType extends Primitive, FilterValueType>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<T, IdType, FilterValueType>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<T, IdType, FilterValueType>['props']>, ReturnType<__sveltets_Render<T, IdType, FilterValueType>['events']>, ReturnType<__sveltets_Render<T, IdType, FilterValueType>['slots']>> & {
+        $$bindings?: ReturnType<__sveltets_Render<T, IdType, FilterValueType>['bindings']>;
+    } & ReturnType<__sveltets_Render<T, IdType, FilterValueType>['exports']>;
+    <T extends object, IdType extends Primitive, FilterValueType>(internal: unknown, props: ReturnType<__sveltets_Render<T, IdType, FilterValueType>['props']> & {}): ReturnType<__sveltets_Render<T, IdType, FilterValueType>['exports']>;
+    z_$$bindings?: ReturnType<__sveltets_Render<any, any, any>['bindings']>;
 }
 declare const FilterInput: $$IsomorphicComponent;
-type FilterInput<T extends object, IdType extends Primitive, FilterValueType, FilterOptionsType> = InstanceType<typeof FilterInput<T, IdType, FilterValueType, FilterOptionsType>>;
+type FilterInput<T extends object, IdType extends Primitive, FilterValueType> = InstanceType<typeof FilterInput<T, IdType, 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, FilterValueType, out FilterOptionsType> {
-    def: ColumnDef<T, FilterValueType, FilterOptionsType>;
+export interface FilterInputProps<T extends object, FilterValueType> {
+    def: ColumnDef<T, FilterValueType>;
     customFilters?: CustomRemoteFilters<FilterValueType> | undefined;
 }

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

@@ -1,259 +1,259 @@
-<svelte:options runes />
-
-<script
-	lang="ts"
-	generics="T extends object, IdType extends Primitive"
->
-	import Action from '../../Action.svelte';
-	import Button from '../../Button.svelte';
-	import TextInput from '../../TextInput.svelte';
-	import { Colour, ColourSet } from '../../../scss/colours.js';
-	import { Size } from '../../../Types/Internal/Size.js';
-	import { Variant } from '../../../Types/Internal/Variant.js';
-	import { SvelteSet } from 'svelte/reactivity';
-	import { getContext } from 'svelte';
-	import type { Primitive } from '../Types/Context/TableInitOptions.js';
-	import type { ColumnDef } from '../Types/Columns/Definitions/ColumnDef.svelte.js';
-	import { TableContext } from '../Types/Context/TableContext.svelte.js';
-	import FilterInput from './FilterInput.svelte';
-
-	const tableContext = getContext<TableContext<T, IdType>>(TableContext.identifier);
-
-	/** Fallback group label used for any filterable column whose
-	 *  `filterGroup` is undefined. Picked up by the same grouping +
-	 *  collapse machinery as user-declared groups. */
-	const FALLBACK_GROUP = 'Other';
-
-	const defs = $derived(tableContext.columnDefs as Array<ColumnDef<T, unknown>>);
-	const filterableDefs = $derived(defs.filter((d) => d.allowFiltering));
-
-	/** User-typed substring filter for the column-header text. Empty
-	 *  string is the "no filter" state. */
-	let quickFindValue: string = $state('');
-
-	/** Whether the Save Filter overflow menu is open. The chevron
-	 *  toggles it; clicking anywhere else (via the window-level
-	 *  listener below) closes it. */
-	let saveMenuOpen: boolean = $state(false);
-
-	/** Names of currently-collapsed groups. A name absent from this
-	 *  set is rendered expanded. Reactive via `SvelteSet` so the panel
-	 *  re-renders on toggle without manually re-assigning. */
-	const collapsedGroups = new SvelteSet<string>();
-
-	/** Filters the column-def list against `quickFindValue`. The match
-	 *  is case-insensitive against the header text (for string
-	 *  headers) and the column id as a fallback for Snippet headers. */
-	const matchingDefs: Array<ColumnDef<T, unknown>> = $derived.by(() => {
-		const q = quickFindValue.trim().toLowerCase();
-		if (q.length === 0) {
-			return filterableDefs;
-		}
-		return filterableDefs.filter((d) => {
-			if (typeof d.header === 'string' && d.header.toLowerCase().includes(q)) {
-				return true;
-			}
-			return d.id.toLowerCase().includes(q);
-		});
-	});
-
-	/** Ordered list of group names. The first column-def each group
-	 *  is seen on determines its position so groups appear in the
-	 *  source-declaration order. The fallback "Other" group is
-	 *  appended last so explicitly-named groups always lead. */
-	const orderedGroupNames: Array<string> = $derived.by(() => {
-		const seen = new Set<string>();
-		const out: Array<string> = [];
-		let sawFallback = false;
-		for (const def of matchingDefs) {
-			const name = def.filterGroup ?? FALLBACK_GROUP;
-			if (name === FALLBACK_GROUP) {
-				sawFallback = true;
-				continue;
-			}
-			if (!seen.has(name)) {
-				seen.add(name);
-				out.push(name);
-			}
-		}
-		if (sawFallback) {
-			out.push(FALLBACK_GROUP);
-		}
-		return out;
-	});
-
-	/** Group name -> column-defs in that group, preserving declaration
-	 *  order within the group. */
-	const groupedDefs: Map<string, Array<ColumnDef<T, unknown>>> = $derived.by(() => {
-		const map = new Map<string, Array<ColumnDef<T, unknown>>>();
-		for (const def of matchingDefs) {
-			const name = def.filterGroup ?? FALLBACK_GROUP;
-			let bucket = map.get(name);
-			if (!bucket) {
-				bucket = [];
-				map.set(name, bucket);
-			}
-			bucket.push(def);
-		}
-		return map;
-	});
-
-	function toggleGroup(name: string): void {
-		if (collapsedGroups.has(name)) {
-			collapsedGroups.delete(name);
-		} else {
-			collapsedGroups.add(name);
-		}
-	}
-
-	function resetFilters(): void {
-		tableContext.paginationRepo?.resetFilters();
-	}
-
-	/**
-	 * Placeholder for the future Save-Filter / preset workflow. For
-	 * now this just closes the overflow menu; consumers wire the real
-	 * persistence layer in a follow-up workorder. The chevron menu is
-	 * still useful today as a home for the Reset action and as the
-	 * insertion point for "Load Filter" / "Manage Filters" entries
-	 * once those land.
-	 */
-	function saveFilter(): void {
-		saveMenuOpen = false;
-		if (typeof window !== 'undefined') {
-			window.dispatchEvent(
-				new CustomEvent('scoria:save-filter', {
-					detail: { tableName: tableContext.tableName },
-				})
-			);
-		}
-	}
-
-	function handleWindowClick(e: MouseEvent): void {
-		if (!saveMenuOpen) {
-			return;
-		}
-		const target = e.target as HTMLElement | null;
-		if (target?.closest('.save-filter-cluster') == null) {
-			saveMenuOpen = false;
-		}
-	}
-
-	/**
-	 * No-op keydown handler used to override `TextInput`'s default
-	 * `passthrough` keydown (defined in `Helpers.svelte.ts`), which
-	 * blurs the focused input on every alphanumeric keypress so that
-	 * barcode-scanner buffers can flow into `UntypedInputContext`
-	 * instead. For a plain quick-find search field we want every key
-	 * to land in the input rather than the input blurring after the
-	 * first character. Returns immediately and lets the keystroke
-	 * continue to bubble so the side-panel's window-level Escape
-	 * handler still closes the panel.
-	 */
-	function noopKeydown(_e: KeyboardEvent): void {
-		// intentionally empty
-	}
-</script>
-
-<svelte:window onclick={handleWindowClick} />
-
-<section class="side-panel-section">
-	<header class="side-panel-header">
-		<h2>Advanced Filter</h2>
-	</header>
-
-	<div class="toolbar">
-		<div class="quick-find">
-			<TextInput
-				labelTop="Quick Find a Filter"
-				placeholder="Filter…"
-				bind:value={quickFindValue}
-				rightIcon={{ name: 'search', size: Size.Medium }}
-				onkeydown={noopKeydown}
-			/>
-		</div>
-
-		<div class="save-filter-cluster">
-			<Button
-				variant={Variant.Secondary}
-				nowrap
-				disabled
-				size={Size.MediumSmall}
-				onclick={saveFilter}>Save Filter</Button
-			>
-			<Action
-				label="More save options"
-				colourSet={ColourSet.Auxiliary}
-				icon={{ name: 'chevron-down', size: Size.Medium }}
-				onclick={() => {
-					saveMenuOpen = !saveMenuOpen;
-				}}
-			/>
-			{#if saveMenuOpen}
-				<div class="save-menu">
-					<button
-						type="button"
-						class="save-menu-item"
-						onclick={() => {
-							saveMenuOpen = false;
-							resetFilters();
-						}}>Reset all filters</button
-					>
-				</div>
-			{/if}
-		</div>
-	</div>
-
-	<div class="side-panel-body">
-		{#if filterableDefs.length === 0}
-			<p class="empty">No filterable columns.</p>
-		{:else if matchingDefs.length === 0}
-			<p class="empty">
-				No filters match &ldquo;{quickFindValue}&rdquo;.
-			</p>
-		{:else}
-			<div class="groups">
-				{#each orderedGroupNames as groupName (groupName)}
-					{@const defsInGroup = groupedDefs.get(groupName) ?? []}
-					{@const isCollapsed = collapsedGroups.has(groupName)}
-					{#if defsInGroup.length > 0}
-						<section
-							class="group"
-							class:collapsed={isCollapsed}
-						>
-							<header class="group-header">
-								<h3>{groupName}</h3>
-								<Action
-									label={isCollapsed ? `Expand ${groupName}` : `Collapse ${groupName}`}
-									colourSet={ColourSet.Auxiliary}
-									icon={{
-										name: isCollapsed ? 'circle-plus' : 'circle-minus',
-										size: Size.Medium,
-										colour: Colour['$ui-blue-9'],
-									}}
-									onclick={() => {
-										toggleGroup(groupName);
-									}}
-								/>
-							</header>
-							{#if !isCollapsed}
-								<div class="group-body">
-									{#each defsInGroup as def (def.id)}
-										<FilterInput
-											{def}
-											customFilters={tableContext.remoteFilters}
-										/>
-									{/each}
-								</div>
-							{/if}
-						</section>
-					{/if}
-				{/each}
-			</div>
-		{/if}
-	</div>
-</section>
-
+<svelte:options runes />
+
+<script
+	lang="ts"
+	generics="T extends object, IdType extends Primitive"
+>
+	import Action from '../../Action.svelte';
+	import Button from '../../Button.svelte';
+	import TextInput from '../../TextInput.svelte';
+	import { Colour, ColourSet } from '../../../scss/colours.js';
+	import { Size } from '../../../Types/Internal/Size.js';
+	import { Variant } from '../../../Types/Internal/Variant.js';
+	import { SvelteSet } from 'svelte/reactivity';
+	import { getContext } from 'svelte';
+	import type { Primitive } from '../Types/Context/TableInitOptions.js';
+	import type { ColumnDef } from '../Types/Columns/Definitions/ColumnDef.svelte.js';
+	import { TableContext } from '../Types/Context/TableContext.svelte.js';
+	import FilterInput from './FilterInput.svelte';
+
+	const tableContext = getContext<TableContext<T, IdType>>(TableContext.identifier);
+
+	/** Fallback group label used for any filterable column whose
+	 *  `filterGroup` is undefined. Picked up by the same grouping +
+	 *  collapse machinery as user-declared groups. */
+	const FALLBACK_GROUP = 'Other';
+
+	const defs = $derived(tableContext.columnDefs as Array<ColumnDef<T, unknown>>);
+	const filterableDefs = $derived(defs.filter((d) => d.allowFiltering));
+
+	/** User-typed substring filter for the column-header text. Empty
+	 *  string is the "no filter" state. */
+	let quickFindValue: string = $state('');
+
+	/** Whether the Save Filter overflow menu is open. The chevron
+	 *  toggles it; clicking anywhere else (via the window-level
+	 *  listener below) closes it. */
+	let saveMenuOpen: boolean = $state(false);
+
+	/** Names of currently-collapsed groups. A name absent from this
+	 *  set is rendered expanded. Reactive via `SvelteSet` so the panel
+	 *  re-renders on toggle without manually re-assigning. */
+	const collapsedGroups = new SvelteSet<string>();
+
+	/** Filters the column-def list against `quickFindValue`. The match
+	 *  is case-insensitive against the header text (for string
+	 *  headers) and the column id as a fallback for Snippet headers. */
+	const matchingDefs: Array<ColumnDef<T, unknown>> = $derived.by(() => {
+		const q = quickFindValue.trim().toLowerCase();
+		if (q.length === 0) {
+			return filterableDefs;
+		}
+		return filterableDefs.filter((d) => {
+			if (typeof d.header === 'string' && d.header.toLowerCase().includes(q)) {
+				return true;
+			}
+			return d.id.toLowerCase().includes(q);
+		});
+	});
+
+	/** Ordered list of group names. The first column-def each group
+	 *  is seen on determines its position so groups appear in the
+	 *  source-declaration order. The fallback "Other" group is
+	 *  appended last so explicitly-named groups always lead. */
+	const orderedGroupNames: Array<string> = $derived.by(() => {
+		const seen = new Set<string>();
+		const out: Array<string> = [];
+		let sawFallback = false;
+		for (const def of matchingDefs) {
+			const name = def.filterGroup ?? FALLBACK_GROUP;
+			if (name === FALLBACK_GROUP) {
+				sawFallback = true;
+				continue;
+			}
+			if (!seen.has(name)) {
+				seen.add(name);
+				out.push(name);
+			}
+		}
+		if (sawFallback) {
+			out.push(FALLBACK_GROUP);
+		}
+		return out;
+	});
+
+	/** Group name -> column-defs in that group, preserving declaration
+	 *  order within the group. */
+	const groupedDefs: Map<string, Array<ColumnDef<T, unknown>>> = $derived.by(() => {
+		const map = new Map<string, Array<ColumnDef<T, unknown>>>();
+		for (const def of matchingDefs) {
+			const name = def.filterGroup ?? FALLBACK_GROUP;
+			let bucket = map.get(name);
+			if (!bucket) {
+				bucket = [];
+				map.set(name, bucket);
+			}
+			bucket.push(def);
+		}
+		return map;
+	});
+
+	function toggleGroup(name: string): void {
+		if (collapsedGroups.has(name)) {
+			collapsedGroups.delete(name);
+		} else {
+			collapsedGroups.add(name);
+		}
+	}
+
+	function resetFilters(): void {
+		tableContext.paginationRepo?.resetFilters();
+	}
+
+	/**
+	 * Placeholder for the future Save-Filter / preset workflow. For
+	 * now this just closes the overflow menu; consumers wire the real
+	 * persistence layer in a follow-up workorder. The chevron menu is
+	 * still useful today as a home for the Reset action and as the
+	 * insertion point for "Load Filter" / "Manage Filters" entries
+	 * once those land.
+	 */
+	function saveFilter(): void {
+		saveMenuOpen = false;
+		if (typeof window !== 'undefined') {
+			window.dispatchEvent(
+				new CustomEvent('scoria:save-filter', {
+					detail: { tableName: tableContext.tableName },
+				})
+			);
+		}
+	}
+
+	function handleWindowClick(e: MouseEvent): void {
+		if (!saveMenuOpen) {
+			return;
+		}
+		const target = e.target as HTMLElement | null;
+		if (target?.closest('.save-filter-cluster') == null) {
+			saveMenuOpen = false;
+		}
+	}
+
+	/**
+	 * No-op keydown handler used to override `TextInput`'s default
+	 * `passthrough` keydown (defined in `Helpers.svelte.ts`), which
+	 * blurs the focused input on every alphanumeric keypress so that
+	 * barcode-scanner buffers can flow into `UntypedInputContext`
+	 * instead. For a plain quick-find search field we want every key
+	 * to land in the input rather than the input blurring after the
+	 * first character. Returns immediately and lets the keystroke
+	 * continue to bubble so the side-panel's window-level Escape
+	 * handler still closes the panel.
+	 */
+	function noopKeydown(_e: KeyboardEvent): void {
+		// intentionally empty
+	}
+</script>
+
+<svelte:window onclick={handleWindowClick} />
+
+<section class="side-panel-section">
+	<header class="side-panel-header">
+		<h2>Advanced Filter</h2>
+	</header>
+
+	<div class="toolbar">
+		<div class="quick-find">
+			<TextInput
+				labelTop="Quick Find a Filter"
+				placeholder="Filter…"
+				bind:value={quickFindValue}
+				rightIcon={{ name: 'search', size: Size.Medium }}
+				onkeydown={noopKeydown}
+			/>
+		</div>
+
+		<div class="save-filter-cluster">
+			<Button
+				variant={Variant.Secondary}
+				nowrap
+				disabled
+				size={Size.MediumSmall}
+				onclick={saveFilter}>Save Filter</Button
+			>
+			<Action
+				label="More save options"
+				colourSet={ColourSet.Auxiliary}
+				icon={{ name: 'chevron-down', size: Size.Medium }}
+				onclick={() => {
+					saveMenuOpen = !saveMenuOpen;
+				}}
+			/>
+			{#if saveMenuOpen}
+				<div class="save-menu">
+					<button
+						type="button"
+						class="save-menu-item"
+						onclick={() => {
+							saveMenuOpen = false;
+							resetFilters();
+						}}>Reset all filters</button
+					>
+				</div>
+			{/if}
+		</div>
+	</div>
+
+	<div class="side-panel-body">
+		{#if filterableDefs.length === 0}
+			<p class="empty">No filterable columns.</p>
+		{:else if matchingDefs.length === 0}
+			<p class="empty">
+				No filters match &ldquo;{quickFindValue}&rdquo;.
+			</p>
+		{:else}
+			<div class="groups">
+				{#each orderedGroupNames as groupName (groupName)}
+					{@const defsInGroup = groupedDefs.get(groupName) ?? []}
+					{@const isCollapsed = collapsedGroups.has(groupName)}
+					{#if defsInGroup.length > 0}
+						<section
+							class="group"
+							class:collapsed={isCollapsed}
+						>
+							<header class="group-header">
+								<h3>{groupName}</h3>
+								<Action
+									label={isCollapsed ? `Expand ${groupName}` : `Collapse ${groupName}`}
+									colourSet={ColourSet.Auxiliary}
+									icon={{
+										name: isCollapsed ? 'circle-plus' : 'circle-minus',
+										size: Size.Medium,
+										colour: Colour['$ui-blue-9'],
+									}}
+									onclick={() => {
+										toggleGroup(groupName);
+									}}
+								/>
+							</header>
+							{#if !isCollapsed}
+								<div class="group-body">
+									{#each defsInGroup as def (def.id)}
+										<FilterInput
+											{def}
+											customFilters={tableContext.remoteFilters}
+										/>
+									{/each}
+								</div>
+							{/if}
+						</section>
+					{/if}
+				{/each}
+			</div>
+		{/if}
+	</div>
+</section>
+
 <style>.side-panel-section {
   display: flex;
   flex-flow: column nowrap;
@@ -413,4 +413,4 @@ p.empty {
   display: flex;
   flex-flow: column nowrap;
   gap: 0.5rem;
-}</style>
+}</style>

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

@@ -1,32 +1,32 @@
-<svelte:options runes />
-
-<script
-	lang="ts"
-	module
->
-	import TouchModal from '../../Touch/TouchModal.svelte';
-	import FilterPanel from './FilterPanel.svelte';
-
-	export interface FilterPanelModalProps {
-		onclose?: () => void;
-	}
-</script>
-
-<script lang="ts">
-	const { onclose }: FilterPanelModalProps = $props();
-</script>
-
-<TouchModal
-	width="800px"
-	header="Filter by"
-	onclose={() => onclose?.()}
-	buttons={[{ label: 'Close', callback: () => onclose?.() }]}
->
-	<div class="flex">
-		<FilterPanel />
-	</div>
-</TouchModal>
-
+<svelte:options runes />
+
+<script
+	lang="ts"
+	module
+>
+	import TouchModal from '../../Touch/TouchModal.svelte';
+	import FilterPanel from './FilterPanel.svelte';
+
+	export interface FilterPanelModalProps {
+		onclose?: () => void;
+	}
+</script>
+
+<script lang="ts">
+	const { onclose }: FilterPanelModalProps = $props();
+</script>
+
+<TouchModal
+	width="800px"
+	header="Filter by"
+	onclose={() => onclose?.()}
+	buttons={[{ label: 'Close', callback: () => onclose?.() }]}
+>
+	<div class="flex">
+		<FilterPanel />
+	</div>
+</TouchModal>
+
 <style>.flex {
   display: flex;
   flex-flow: column nowrap;
@@ -34,4 +34,4 @@
   width: 100%;
   flex: 1;
   overflow: hidden;
-}</style>
+}</style>