@lavalogic/scoria 0.35.0 → 0.36.0

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

@@ -1,80 +1,80 @@
-<svelte:options runes />
-
-<script
-	lang="ts"
-	generics="T extends object"
->
-	import Button from '../../Button.svelte';
-	import SingleSelect from '../../SingleSelect.svelte';
-	import ColumnList from '../Body/Rows/ColumnList.svelte';
-	import TextInput from '../../TextInput.svelte';
-	import type { SelectOption } from '../../../Types/Internal/SelectOption.js';
-	import { Size } from '../../../Types/Internal/Size.js';
-	import { Variant } from '../../../Types/Internal/Variant.js';
-	import { getContext } from 'svelte';
-	import { TableContext } from '../Types/Context/TableContext.svelte.js';
-
-	const tableContext = getContext<TableContext<T, never>>(TableContext.identifier);
-
-	const labelledPresets: Array<SelectOption<string>> = $derived(
-		tableContext.columnPresets.map((pr) => ({ label: pr.name, value: pr.name }))
-	);
-
-	const selectedValue = $derived(
-		labelledPresets.find((it) => it.value === tableContext.selectedPreset?.name) ?? null
-	);
-	let searchValue = $state('');
-	let pendingPresetName = $state('');
-</script>
-
-<div class="column-panel top presets-and-filter">
-	<!-- TODO Select component -->
-	<div class="select">
-		<SingleSelect
-			label="Selected Preset"
-			name="Preset"
-			options={labelledPresets}
-			labelProp="label"
-			valueProp="value"
-			value={selectedValue}
-			valueAsObject
-			onchange={(newSelection: SelectOption<string> | null) => {
-				const preset =
-					newSelection && tableContext.columnPresets.find((p) => p.name === newSelection.label);
-				if (preset) {
-					tableContext.setSelectedPreset(preset);
-				}
-			}}
-		/>
-	</div>
-	<TextInput
-		bind:value={searchValue}
-		leftIcon={{ name: 'search', size: Size.Medium }}
-		placeholder="Search Columns"
-	/>
-</div>
-<ColumnList {searchValue} />
-<form
-	class="column-panel bottom save-preset-wrapper"
-	onsubmit={(e) => {
-		e.preventDefault();
-		tableContext.saveColumnPreset(pendingPresetName);
-		pendingPresetName = '';
-	}}
->
-	<!-- size={Size.MediumSmall} -->
-	<TextInput
-		placeholder="name"
-		bind:value={pendingPresetName}
-	/>
-	<Button
-		type="submit"
-		variant={Variant.Secondary}
-		nowrap
-		size={Size.MediumSmall}>Save Layout</Button
-	>
-</form>
-
+<svelte:options runes />
+
+<script
+	lang="ts"
+	generics="T extends object"
+>
+	import Button from '../../Button.svelte';
+	import SingleSelect from '../../SingleSelect.svelte';
+	import ColumnList from '../Body/Rows/ColumnList.svelte';
+	import TextInput from '../../TextInput.svelte';
+	import type { SelectOption } from '../../../Types/Internal/SelectOption.js';
+	import { Size } from '../../../Types/Internal/Size.js';
+	import { Variant } from '../../../Types/Internal/Variant.js';
+	import { getContext } from 'svelte';
+	import { TableContext } from '../Types/Context/TableContext.svelte.js';
+
+	const tableContext = getContext<TableContext<T, never>>(TableContext.identifier);
+
+	const labelledPresets: Array<SelectOption<string>> = $derived(
+		tableContext.columnPresets.map((pr) => ({ label: pr.name, value: pr.name }))
+	);
+
+	const selectedValue = $derived(
+		labelledPresets.find((it) => it.value === tableContext.selectedPreset?.name) ?? null
+	);
+	let searchValue = $state('');
+	let pendingPresetName = $state('');
+</script>
+
+<div class="column-panel top presets-and-filter">
+	<!-- TODO Select component -->
+	<div class="select">
+		<SingleSelect
+			label="Selected Preset"
+			name="Preset"
+			options={labelledPresets}
+			labelProp="label"
+			valueProp="value"
+			value={selectedValue}
+			valueAsObject
+			onchange={(newSelection: SelectOption<string> | null) => {
+				const preset =
+					newSelection && tableContext.columnPresets.find((p) => p.name === newSelection.label);
+				if (preset) {
+					tableContext.setSelectedPreset(preset);
+				}
+			}}
+		/>
+	</div>
+	<TextInput
+		bind:value={searchValue}
+		leftIcon={{ name: 'search', size: Size.Medium }}
+		placeholder="Search Columns"
+	/>
+</div>
+<ColumnList {searchValue} />
+<form
+	class="column-panel bottom save-preset-wrapper"
+	onsubmit={(e) => {
+		e.preventDefault();
+		tableContext.saveColumnPreset(pendingPresetName);
+		pendingPresetName = '';
+	}}
+>
+	<!-- size={Size.MediumSmall} -->
+	<TextInput
+		placeholder="name"
+		bind:value={pendingPresetName}
+	/>
+	<Button
+		type="submit"
+		variant={Variant.Secondary}
+		nowrap
+		size={Size.MediumSmall}>Save Layout</Button
+	>
+</form>
+
 <style>.column-panel {
   --input-height: 3rem;
   background-color: #ffffff;
@@ -102,4 +102,4 @@
 }
 .column-panel .select {
   width: 100%;
-}</style>
+}</style>

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

@@ -1,101 +1,101 @@
-<svelte:options runes />
-
-<script
-	lang="ts"
-	generics="T extends object"
->
-	import Button from '../../Button.svelte';
-	import SingleSelect from '../../SingleSelect.svelte';
-	import ColumnList from '../Body/Rows/ColumnList.svelte';
-	import TextInput from '../../TextInput.svelte';
-	import TouchModal from '../../Touch/TouchModal.svelte';
-	import type { SelectOption } from '../../../Types/Internal/SelectOption.js';
-	import { Size } from '../../../Types/Internal/Size.js';
-	import { Variant } from '../../../Types/Internal/Variant.js';
-	import { getContext } from 'svelte';
-	import { TableContext } from '../Types/Context/TableContext.svelte.js';
-	import type { ColumnPanelModalProps } from './ColumnPanelModalProps.js';
-
-	const tableContext = getContext<TableContext<T, never>>(TableContext.identifier);
-
-	const { onclose }: ColumnPanelModalProps = $props();
-	const labelledPresets: Array<SelectOption<string>> = $derived(
-		tableContext.columnPresets.map((pr) => ({ label: pr.name, value: pr.name }))
-	);
-	let searchValue = $state('');
-	let pendingPresetName = $state('');
-
-	const selectedValue = $derived(
-		labelledPresets.find((it) => it.value === tableContext.selectedPreset?.name) ?? null
-	);
-
-	function trySavePreset(e: KeyboardEvent) {
-		if (e.key === 'Enter') {
-			e.preventDefault();
-			tableContext.saveColumnPreset(pendingPresetName);
-			pendingPresetName = '';
-		}
-	}
-
-	function savePreset(e: MouseEvent) {
-		e.preventDefault();
-		tableContext.saveColumnPreset(pendingPresetName);
-		pendingPresetName = '';
-	}
-</script>
-
-<TouchModal
-	header="Modify Columns"
-	onclose={() => onclose?.()}
-	buttons={[{ label: 'Close', callback: () => onclose?.() }]}
->
-	<div class="flex">
-		<div class="column-panel top presets-and-filter">
-			<div class="select">
-				<SingleSelect
-					label="Selected Preset"
-					name="Preset"
-					options={labelledPresets}
-					labelProp="label"
-					valueProp="value"
-					value={selectedValue}
-					valueAsObject
-					onchange={(newSelection: SelectOption<string> | null) => {
-						const preset =
-							newSelection && tableContext.columnPresets.find((p) => p.name === newSelection.label);
-						if (preset) {
-							tableContext.setSelectedPreset(preset);
-						}
-					}}
-				/>
-			</div>
-			<TextInput
-				bind:value={searchValue}
-				leftIcon={{ name: 'search', size: Size.Medium }}
-				placeholder="Search Columns"
-			/>
-		</div>
-		<div class="scrollable">
-			<ColumnList {searchValue} />
-		</div>
-		<div class="column-panel bottom save-preset-wrapper">
-			<!-- size={Size.MediumSmall} -->
-			<TextInput
-				placeholder="name"
-				bind:value={pendingPresetName}
-				onkeydown={trySavePreset}
-			/>
-			<Button
-				type="submit"
-				variant={Variant.Secondary}
-				nowrap
-				size={Size.MediumSmall}
-				onclick={savePreset}>Save Layout</Button
-			>
-		</div>
-	</div>
-</TouchModal>
-
+<svelte:options runes />
+
+<script
+	lang="ts"
+	generics="T extends object"
+>
+	import Button from '../../Button.svelte';
+	import SingleSelect from '../../SingleSelect.svelte';
+	import ColumnList from '../Body/Rows/ColumnList.svelte';
+	import TextInput from '../../TextInput.svelte';
+	import TouchModal from '../../Touch/TouchModal.svelte';
+	import type { SelectOption } from '../../../Types/Internal/SelectOption.js';
+	import { Size } from '../../../Types/Internal/Size.js';
+	import { Variant } from '../../../Types/Internal/Variant.js';
+	import { getContext } from 'svelte';
+	import { TableContext } from '../Types/Context/TableContext.svelte.js';
+	import type { ColumnPanelModalProps } from './ColumnPanelModalProps.js';
+
+	const tableContext = getContext<TableContext<T, never>>(TableContext.identifier);
+
+	const { onclose }: ColumnPanelModalProps = $props();
+	const labelledPresets: Array<SelectOption<string>> = $derived(
+		tableContext.columnPresets.map((pr) => ({ label: pr.name, value: pr.name }))
+	);
+	let searchValue = $state('');
+	let pendingPresetName = $state('');
+
+	const selectedValue = $derived(
+		labelledPresets.find((it) => it.value === tableContext.selectedPreset?.name) ?? null
+	);
+
+	function trySavePreset(e: KeyboardEvent) {
+		if (e.key === 'Enter') {
+			e.preventDefault();
+			tableContext.saveColumnPreset(pendingPresetName);
+			pendingPresetName = '';
+		}
+	}
+
+	function savePreset(e: MouseEvent) {
+		e.preventDefault();
+		tableContext.saveColumnPreset(pendingPresetName);
+		pendingPresetName = '';
+	}
+</script>
+
+<TouchModal
+	header="Modify Columns"
+	onclose={() => onclose?.()}
+	buttons={[{ label: 'Close', callback: () => onclose?.() }]}
+>
+	<div class="flex">
+		<div class="column-panel top presets-and-filter">
+			<div class="select">
+				<SingleSelect
+					label="Selected Preset"
+					name="Preset"
+					options={labelledPresets}
+					labelProp="label"
+					valueProp="value"
+					value={selectedValue}
+					valueAsObject
+					onchange={(newSelection: SelectOption<string> | null) => {
+						const preset =
+							newSelection && tableContext.columnPresets.find((p) => p.name === newSelection.label);
+						if (preset) {
+							tableContext.setSelectedPreset(preset);
+						}
+					}}
+				/>
+			</div>
+			<TextInput
+				bind:value={searchValue}
+				leftIcon={{ name: 'search', size: Size.Medium }}
+				placeholder="Search Columns"
+			/>
+		</div>
+		<div class="scrollable">
+			<ColumnList {searchValue} />
+		</div>
+		<div class="column-panel bottom save-preset-wrapper">
+			<!-- size={Size.MediumSmall} -->
+			<TextInput
+				placeholder="name"
+				bind:value={pendingPresetName}
+				onkeydown={trySavePreset}
+			/>
+			<Button
+				type="submit"
+				variant={Variant.Secondary}
+				nowrap
+				size={Size.MediumSmall}
+				onclick={savePreset}>Save Layout</Button
+			>
+		</div>
+	</div>
+</TouchModal>
+
 <style>.flex {
   display: flex;
   flex-flow: column nowrap;
@@ -136,4 +136,4 @@
 }
 .column-panel .select {
   width: 100%;
-}</style>
+}</style>