@lavalogic/scoria 0.4.4 → 0.5.0

package/dist/Components/CollapsibleCard.svelte

@@ -9,6 +9,7 @@
 		children?: Snippet;
 		maxHeight?: number;
 		grow?: boolean;
+		isCollapsed?: boolean;
 	}
 </script>
 
@@ -17,9 +18,14 @@
 	import { Size } from '../Types/Internal/Size.js';
 	import { Colour } from '../scss/colours.js';
 
-	let { title, subtitle, maxHeight: maxHeight, children, grow }: CollapsibleCard = $props();
-
-	let isCollapsed = $state(false);
+	let {
+		title,
+		subtitle,
+		maxHeight: maxHeight,
+		children,
+		grow,
+		isCollapsed = $bindable(false)
+	}: CollapsibleCard = $props();
 
 	let cardRef: HTMLDivElement | undefined = $state();
 

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

@@ -5,6 +5,7 @@ export interface CollapsibleCard {
     children?: Snippet;
     maxHeight?: number;
     grow?: boolean;
+    isCollapsed?: boolean;
 }
 declare const CollapsibleCard: any;
 type CollapsibleCard = ReturnType<typeof CollapsibleCard>;

package/dist/Components/Contexts/Toast.svelte

@@ -57,7 +57,7 @@
 
 <style>article {
   font-weight: 700;
-  font-size: 1.12rem;
+  font-size: 1.125rem;
   padding: 0.75rem;
   border-radius: 4px;
 }

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

@@ -146,9 +146,16 @@
 		if (isRemoteSelect && !tableContext.paginationRepo?.filtering) {
 			return;
 		}
+		if (def.debug) {
+			console.log('filtering state value:', $state.snapshot(filteringStateValue));
+		}
 		void filteringStateValue;
 
 		if (hasQuery) {
+			if (def.debug) {
+				console.log('has query');
+			}
+
 			untrack(async () => {
 				try {
 					//  as unknown as string | number | undefined;
@@ -157,6 +164,10 @@
 						const x = tableContext.__queryValues.get(
 							customFilter?.label ?? customFilter?.objectName ?? customFilter?.queryKey ?? _uuid
 						);
+
+						if (def.debug) {
+							console.log('value:', x);
+						}
 						value = (x ?? null) as SelectOption<unknown> | null;
 					}
 				} catch (e) {
@@ -165,9 +176,16 @@
 				}
 			});
 		} else if (isSelect) {
+			if (def.debug) {
+				console.log('is select (not query)');
+			}
 			untrack(async () => {
 				try {
-					const x = (await options).filter((it) => {
+					const opts = await options;
+					if (def.debug) {
+						console.log('possible options:', $state.snapshot(options));
+					}
+					const x = opts.filter((it) => {
 						if (it.value != null && (typeof it.value == 'string' || typeof it.value == 'number')) {
 							return (
 								filteringStateValue as unknown as Array<string | number> | undefined
@@ -175,6 +193,9 @@
 						}
 						return false;
 					});
+					if (def.debug) {
+						console.log('selected options:', x);
+					}
 					selectedOptions = x;
 				} catch (e) {
 					console.warn(e);
@@ -211,7 +232,7 @@
 			) {
 				value = filteringStateValue;
 			} else {
-				console.log('unknown value type:', filteringStateValue);
+				console.warn('unknown value type:', $state.snapshot(filteringStateValue));
 				value = filteringStateValue as string; // HACK attempt to keep production running
 			}
 		}
@@ -354,7 +375,7 @@
 							<!-- TODO: multiselect -->
 
 							<QuerySelect
-								valueAsObject
+								valueAsObject={customFilter!.valueAsObject ?? true}
 								{label}
 								clearable
 								name={customFilter?.objectName ?? 'Item'}
@@ -366,7 +387,8 @@
 								onchange={(newValue) => {
 									tableContext.paginationRepo?.filterBy(def.id, newValue?.value ?? null);
 									tableContext.__queryValues.set(label ?? _uuid, newValue);
-									value = newValue as SelectOption<unknown> | null;
+									// FIXME <T> is lost when autoformatting. why?
+									value = newValue as SelectOption<T> | null;
 								}}
 							/>
 						{:else}

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

@@ -9,6 +9,7 @@ import type { FilterValueType } from '../../Filtering/FilterValueType.js';
 export interface ColumnDefProps<T extends object, FilterFnType = undefined> {
     id: string;
     header: string | Snippet;
+    debug?: boolean;
     index?: number;
     allowFiltering?: boolean;
     allowSorting?: boolean;
@@ -26,6 +27,7 @@ export interface ColumnDefProps<T extends object, FilterFnType = undefined> {
 export declare abstract class ColumnDef<T extends object, FilterFnType = undefined> {
     protected constructor(props: ColumnDefProps<T, FilterFnType>);
     readonly id: string;
+    debug: boolean;
     private _index;
     get index(): number;
     set index(v: number);

package/dist/Components/Table/Types/Columns/Definitions/ColumnDef.svelte.js

@@ -15,8 +15,10 @@ export class ColumnDef {
         this.header = $derived(props.header);
         this._filterValueType = $derived(props.filterValueType);
         this._getDisplayValue = $derived(props.getDisplayValue);
+        this.debug = $derived(props.debug ?? false);
     }
     id;
+    debug;
     _index;
     get index() {
         return this._index;

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

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

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

@@ -1,2 +1,3 @@
+import type { SvelteMap } from 'svelte/reactivity';
 import type { CustomFilter } from './CustomFilter.js';
-export type CustomRemoteFilters = Map<string, CustomFilter>;
+export type CustomRemoteFilters = SvelteMap<string, CustomFilter>;

package/dist/Components/Touch/BoolCard.svelte

@@ -174,7 +174,7 @@ button.card .value {
   padding: 0.375rem;
 }
 button.card .value.small {
-  font-size: 1.16rem;
+  font-size: 1.1875rem;
   font-weight: 600;
   padding: 0;
 }</style>

package/dist/Components/Touch/SummaryCard.svelte

@@ -284,7 +284,7 @@ button.summary-card h3 {
 }
 
 .card-detail {
-  font-size: 1.12rem;
+  font-size: 1.125rem;
   font-weight: 600;
   background-color: #f4f7f9;
   color: #3a4952;
@@ -301,7 +301,7 @@ button.summary-card h3 {
   cursor: unset;
 }
 .card-detail.uom {
-  font-size: 1.08rem;
+  font-size: 1.0625rem;
   color: #647d8e;
   --colour: #8096a5;
   text-transform: uppercase;
@@ -336,7 +336,7 @@ button.summary-card h3 {
 }
 .card-detail.optional {
   justify-content: end;
-  font-size: 1.08rem;
+  font-size: 1.0625rem;
   display: none;
   line-height: 1.5;
 }

package/dist/Components/Touch/UtilityButton.svelte

@@ -120,7 +120,7 @@
   display: flex;
   align-items: center;
   position: relative;
-  font-size: 1.12rem;
+  font-size: 1.125rem;
   font-weight: 600;
 }
 button.left, button.right {

package/dist/Helpers/Helpers.svelte.d.ts

@@ -25,4 +25,5 @@ interface IErrorResponse {
 export declare function isErrorResponse(error: unknown): error is IErrorResponse;
 export declare function getErrorMessage(error: unknown, includeUUID?: boolean): string;
 export declare function isValidEmailAddress(emailAddress: string): RegExpMatchArray | null;
+export declare function gridItem(element: HTMLElement): (() => void) | undefined;
 export {};

package/dist/Helpers/Helpers.svelte.js

@@ -1,3 +1,4 @@
+import { Sizing } from '../scss/sizing.js';
 export function autoPluralise(text, quantity = 2, { capitalise = false } = {}) {
     if (quantity === 1) {
         return text;
@@ -146,3 +147,21 @@ export function isValidEmailAddress(emailAddress) {
         .toLowerCase()
         .match(/^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|.(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/);
 }
+export function gridItem(element) {
+    const firstChild = element.firstElementChild;
+    if (!firstChild) {
+        return;
+    }
+    let height = $state(0);
+    const spanHeight = $derived.by(() => {
+        return Math.ceil((height + Sizing['$regular-gap']) / 4);
+    });
+    $effect(() => {
+        element.style.gridRow = spanHeight ? `span ${spanHeight}` : '';
+    });
+    const observer = new ResizeObserver((entries) => {
+        height = entries[0].borderBoxSize[0].blockSize;
+    });
+    observer.observe(firstChild);
+    return () => observer.unobserve(firstChild);
+}

package/dist/index.d.ts

@@ -123,7 +123,7 @@ export { TooltipContext } from './Contexts/TooltipContext.svelte.js';
 export { UntypedInputContext } from './Contexts/UntypedInputContext.svelte.js';
 export { Delay } from './Delay/Delay.js';
 export { DATAMatrix } from './Helpers/Datamatrix.js';
-export { autoPluralise, generateUUID, generateShortUUID, refWrapper, SQLFriendly, SQLFriendlyWithLocalTime, passthrough, getCanvasContext, getErrorMessage, isValidEmailAddress, localTimeFormat, vowels } from './Helpers/Helpers.svelte.js';
+export { gridItem, autoPluralise, generateUUID, generateShortUUID, refWrapper, SQLFriendly, SQLFriendlyWithLocalTime, passthrough, getCanvasContext, getErrorMessage, isValidEmailAddress, localTimeFormat, vowels } from './Helpers/Helpers.svelte.js';
 export { type INamed } from './Helpers/INamed.js';
 export { AttributeOperation } from './Types/Internal/AttributeOperation.js';
 export { type BigRadioOption } from './Types/Internal/BigRadioOption.js';
@@ -153,5 +153,6 @@ export { Validity } from './Types/Internal/Validity.js';
 export { type ValidityWrapper } from './Types/Internal/ValidityWrapper.js';
 export { Variant } from './Types/Internal/Variant.js';
 export { Colour, ColourSet } from './scss/colours.js';
+export { Sizing } from './scss/sizing.js';
 export { FilterValueType } from './Components/Table/Types/Filtering/FilterValueType.js';
 export { default as Pagination, type PaginationProps } from './Components/Base/Pagination.svelte';

package/dist/index.js

@@ -130,7 +130,7 @@ export { TooltipContext } from './Contexts/TooltipContext.svelte.js';
 export { UntypedInputContext } from './Contexts/UntypedInputContext.svelte.js';
 export { Delay } from './Delay/Delay.js';
 export { DATAMatrix } from './Helpers/Datamatrix.js';
-export { autoPluralise, generateUUID, generateShortUUID, refWrapper, SQLFriendly, SQLFriendlyWithLocalTime, passthrough, getCanvasContext, getErrorMessage, isValidEmailAddress, localTimeFormat, vowels } from './Helpers/Helpers.svelte.js';
+export { gridItem, autoPluralise, generateUUID, generateShortUUID, refWrapper, SQLFriendly, SQLFriendlyWithLocalTime, passthrough, getCanvasContext, getErrorMessage, isValidEmailAddress, localTimeFormat, vowels } from './Helpers/Helpers.svelte.js';
 export {} from './Helpers/INamed.js';
 export { AttributeOperation } from './Types/Internal/AttributeOperation.js';
 export {} from './Types/Internal/BigRadioOption.js';
@@ -158,5 +158,6 @@ export { Validity } from './Types/Internal/Validity.js';
 export {} from './Types/Internal/ValidityWrapper.js';
 export { Variant } from './Types/Internal/Variant.js';
 export { Colour, ColourSet } from './scss/colours.js';
+export { Sizing } from './scss/sizing.js';
 export { FilterValueType } from './Components/Table/Types/Filtering/FilterValueType.js';
 export { default as Pagination } from './Components/Base/Pagination.svelte';

package/dist/scss/_mixins.scss

@@ -2781,3 +2781,231 @@
 		background-color: rgba(0, 0, 0, 0.2);
 	}
 }
+
+@mixin grid {
+	//taken from https://medium.com/@genildocs/the-12-column-grid-system-why-it-still-matters-in-the-css-grid-era-855eb835e038
+	//adapted with https://css-tricks.com/piecing-together-approaches-for-a-css-masonry-layout/#aa-is-vertical-order-with-ragged-bottoms-ok
+
+	.grid {
+		display: grid;
+		grid-template-columns: repeat(12, 1fr);
+		grid-auto-rows: 4px;
+		width: 100%;
+
+		column-gap: sizing.$regular-gap;
+		padding: sizing.$regular-padding;
+		box-sizing: border-box;
+	}
+
+	.nested-grid {
+		display: grid;
+		grid-template-columns: repeat(12, 1fr);
+		gap: sizing.$regular-gap;
+	}
+
+	/* Responsive adjustments */
+	@media (max-width: 768px) {
+		.grid {
+			grid-template-columns: 1fr;
+			gap: sizing.$two-thirds-gap;
+			padding: sizing.$two-thirds-padding;
+		}
+	}
+
+	@media (max-width: 480px) {
+		.grid {
+			padding: sizing.$half-gap;
+			gap: sizing.$half-padding;
+		}
+	}
+
+	/* Column spanning utilities */
+	.col-1 {
+		grid-column: span 1;
+	}
+	.col-2 {
+		grid-column: span 2;
+	}
+	.col-3 {
+		grid-column: span 3;
+	}
+	.col-4 {
+		grid-column: span 4;
+	}
+	.col-5 {
+		grid-column: span 5;
+	}
+	.col-6 {
+		grid-column: span 6;
+	}
+	.col-7 {
+		grid-column: span 7;
+	}
+	.col-8 {
+		grid-column: span 8;
+	}
+	.col-9 {
+		grid-column: span 9;
+	}
+	.col-10 {
+		grid-column: span 10;
+	}
+	.col-11 {
+		grid-column: span 11;
+	}
+	.col-12 {
+		grid-column: span 12;
+	}
+
+	/* Mobile-first responsive utilities */
+	@media (min-width: 769px) {
+		.md-col-1 {
+			grid-column: span 1;
+		}
+		.md-col-2 {
+			grid-column: span 2;
+		}
+		.md-col-3 {
+			grid-column: span 3;
+		}
+		.md-col-4 {
+			grid-column: span 4;
+		}
+		.md-col-5 {
+			grid-column: span 5;
+		}
+		.md-col-6 {
+			grid-column: span 6;
+		}
+		.md-col-7 {
+			grid-column: span 7;
+		}
+		.md-col-8 {
+			grid-column: span 8;
+		}
+		.md-col-9 {
+			grid-column: span 9;
+		}
+		.md-col-10 {
+			grid-column: span 10;
+		}
+		.md-col-11 {
+			grid-column: span 11;
+		}
+		.md-col-12 {
+			grid-column: span 12;
+		}
+	}
+
+	@media (min-width: 1024px) {
+		.lg-col-1 {
+			grid-column: span 1;
+		}
+		.lg-col-2 {
+			grid-column: span 2;
+		}
+		.lg-col-3 {
+			grid-column: span 3;
+		}
+		.lg-col-4 {
+			grid-column: span 4;
+		}
+		.lg-col-5 {
+			grid-column: span 5;
+		}
+		.lg-col-6 {
+			grid-column: span 6;
+		}
+		.lg-col-7 {
+			grid-column: span 7;
+		}
+		.lg-col-8 {
+			grid-column: span 8;
+		}
+		.lg-col-9 {
+			grid-column: span 9;
+		}
+		.lg-col-10 {
+			grid-column: span 10;
+		}
+		.lg-col-11 {
+			grid-column: span 11;
+		}
+		.lg-col-12 {
+			grid-column: span 12;
+		}
+	}
+
+	/* Column start utilities */
+	.col-start-1 {
+		grid-column-start: 1;
+	}
+	.col-start-2 {
+		grid-column-start: 2;
+	}
+	.col-start-3 {
+		grid-column-start: 3;
+	}
+	.col-start-4 {
+		grid-column-start: 4;
+	}
+	.col-start-5 {
+		grid-column-start: 5;
+	}
+	.col-start-6 {
+		grid-column-start: 6;
+	}
+	.col-start-7 {
+		grid-column-start: 7;
+	}
+	.col-start-8 {
+		grid-column-start: 8;
+	}
+	.col-start-9 {
+		grid-column-start: 9;
+	}
+	.col-start-10 {
+		grid-column-start: 10;
+	}
+	.col-start-11 {
+		grid-column-start: 11;
+	}
+	.col-start-12 {
+		grid-column-start: 12;
+	}
+
+	/* Offset utilities (alternative approach) */
+	.offset-1 {
+		grid-column-start: 2;
+	}
+	.offset-2 {
+		grid-column-start: 3;
+	}
+	.offset-3 {
+		grid-column-start: 4;
+	}
+	.offset-4 {
+		grid-column-start: 5;
+	}
+	.offset-5 {
+		grid-column-start: 6;
+	}
+	.offset-6 {
+		grid-column-start: 7;
+	}
+	.offset-7 {
+		grid-column-start: 8;
+	}
+	.offset-8 {
+		grid-column-start: 9;
+	}
+	.offset-9 {
+		grid-column-start: 10;
+	}
+	.offset-10 {
+		grid-column-start: 11;
+	}
+	.offset-11 {
+		grid-column-start: 12;
+	}
+}

package/dist/scss/_sizing.scss

@@ -1,25 +1,22 @@
 $input-height: 3rem;
 $input-width: 12rem;
-// $input-width: 18.75rem;
-// $input-width: 26rem;
 
 $text-xx-large: 2rem;
 $text-x-large: 1.75rem;
 $text-large: 1.5rem;
 $text-medium-large: 1.25rem;
-$text-medium: 1.16rem;
-$text-small-medium: 1.12rem;
-$text-medium-small-medium: 1.08rem;
+$text-medium: 1.1875rem; //19 px. not ideal
+$text-small-medium: 1.125rem;
+$text-medium-small-medium: 1.0625rem;
 $text-regular: 1rem;
 $text-small-small-medium: 0.875rem;
-// $text-small: 0.84rem;
 $text-small: 0.8125rem;
 $text-extra-small: 0.75rem;
 
 $font-weight-touch: 600;
 
-$text-table: 0.95rem;
-$text-table-footer: 0.8rem;
+$text-table: 0.9375rem;
+$text-table-footer: 0.8125rem;
 
 $border-width-double: 2px;
 $border-width: 1px;

package/dist/scss/sizing.d.ts

@@ -0,0 +1,46 @@
+export declare const Sizing: {
+    '$input-height': number;
+    '$input-width': number;
+    '$text-xx-large': number;
+    '$text-x-large': number;
+    '$text-large': number;
+    '$text-medium-large': number;
+    '$text-medium': number;
+    '$text-small-medium': number;
+    '$text-medium-small-medium': number;
+    '$text-regular': number;
+    '$text-small-small-medium': number;
+    '$text-small': number;
+    '$text-extra-small': number;
+    '$text-table': number;
+    '$text-table-footer': number;
+    '$border-width-double': number;
+    '$border-width': number;
+    '$button-padding-xl': number;
+    '$button-padding-lg': number;
+    '$column-1-width': number;
+    '$column-3-width': number;
+    '$row-1-width': number;
+    '$double-padding': number;
+    '$double-gap': number;
+    '$five-quarters-padding': number;
+    '$five-quarters-gap': number;
+    '$regular-padding': number;
+    '$regular-gap': number;
+    '$two-thirds-gap': number;
+    '$two-thirds-padding': number;
+    '$half-gap': number;
+    '$half-padding': number;
+    '$third-gap': number;
+    '$third-padding': number;
+    '$quarter-gap': number;
+    '$quarter-padding': number;
+    '$button-card-inner-gap': number;
+    '$border-radius': number;
+    '$thick-border-radius': number;
+    '$min-modal-width': number;
+    '$max-modal-width': number;
+    '$table-header-height': number;
+    '$nav-height': number;
+};
+export type Sizing = (typeof Sizing)[keyof typeof Sizing];

package/dist/scss/sizing.js

@@ -0,0 +1,62 @@
+//HACK manually created copy of the scss values IN PIXELS
+// assumed font size is 16 for rem-px conversions
+// If the values get updated on one side
+// they MUST be manually updated on the other side too
+export const Sizing = {
+    '$input-height': 48,
+    '$input-width': 192,
+    '$text-xx-large': 32,
+    '$text-x-large': 28,
+    '$text-large': 24,
+    '$text-medium-large': 20,
+    '$text-medium': 19,
+    '$text-small-medium': 18,
+    '$text-medium-small-medium': 17,
+    '$text-regular': 16,
+    '$text-small-small-medium': 14,
+    '$text-small': 13,
+    '$text-extra-small': 12,
+    // '$font-weight-touch': '600', //unrepresentable
+    '$text-table': 15,
+    '$text-table-footer': 13,
+    '$border-width-double': 2,
+    '$border-width': 1,
+    '$button-padding-xl': 32,
+    // '$button-padding-lg-wide': '1rem 2rem', //unrepresentable
+    '$button-padding-lg': 16,
+    '$column-1-width': 400,
+    // '$column-2-width': '1fr', //unrepresentable
+    '$column-3-width': 400,
+    '$row-1-width': 64,
+    // '$row-2-width': '1fr',//unrepresentable
+    '$double-padding': 48,
+    '$double-gap': 48,
+    '$five-quarters-padding': 30,
+    '$five-quarters-gap': 30,
+    '$regular-padding': 24,
+    '$regular-gap': 24,
+    '$two-thirds-gap': 20,
+    '$two-thirds-padding': 20,
+    '$half-gap': 12,
+    '$half-padding': 12,
+    '$third-gap': 8,
+    '$third-padding': 8,
+    '$quarter-gap': 6,
+    '$quarter-padding': 6,
+    // '$circular-button-padding': '0.52rem',
+    // '$card-half-padding': '0.38rem',
+    // '$card-padding': '0.76rem',
+    // '$card-gap': '0.76rem',
+    // '$card-gap-half': '0.38rem',
+    // '$card-detail-padding': '4px 12px',
+    // '$card-title': '$text-large',
+    // '$card-inner-gap': '0.25rem',
+    '$button-card-inner-gap': 8,
+    '$border-radius': 4,
+    '$thick-border-radius': 5,
+    '$min-modal-width': 644,
+    '$max-modal-width': 1728,
+    '$table-header-height': 48,
+    '$nav-height': 52
+};
+Object.freeze(Sizing);

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@lavalogic/scoria",
   "description": "Svelte components used for the FloWMS Web Frontend",
-  "version": "0.4.4",
+  "version": "0.5.0",
   "publishConfig": {
     "access": "restricted"
   },
@@ -33,38 +33,38 @@
     "@eslint/compat": "^2.0.0",
     "@eslint/js": "^9.39.1",
     "@playwright/test": "^1.57.0",
-    "@storybook/addon-a11y": "^10.1.4",
-    "@storybook/addon-docs": "^10.1.4",
+    "@storybook/addon-a11y": "^10.1.7",
+    "@storybook/addon-docs": "^10.1.7",
     "@storybook/addon-svelte-csf": "^5.0.10",
-    "@storybook/addon-vitest": "^10.1.4",
-    "@storybook/sveltekit": "^10.1.4",
+    "@storybook/addon-vitest": "^10.1.7",
+    "@storybook/sveltekit": "^10.1.7",
     "@sveltejs/adapter-node": "^5.4.0",
-    "@sveltejs/kit": "^2.49.1",
+    "@sveltejs/kit": "^2.49.2",
     "@sveltejs/package": "^2.5.7",
     "@sveltejs/vite-plugin-svelte": "^6.2.1",
     "@types/eslint": "^9.6.1",
-    "@types/node": "^24.10.1",
-    "@typescript-eslint/eslint-plugin": "^8.48.1",
-    "@typescript-eslint/parser": "^8.48.1",
+    "@types/node": "^24.10.3",
+    "@typescript-eslint/eslint-plugin": "^8.49.0",
+    "@typescript-eslint/parser": "^8.49.0",
     "@vitest/browser": "^4.0.15",
     "eslint": "^9.39.1",
     "eslint-config-prettier": "^10.1.8",
     "eslint-plugin-storybook": "10.1.4",
-    "eslint-plugin-svelte": "^3.13.0",
+    "eslint-plugin-svelte": "^3.13.1",
     "globals": "^16.5.0",
     "mdsvex": "^0.12.6",
     "playwright": "^1.57.0",
     "prettier": "^3.7.4",
     "prettier-plugin-svelte": "^3.4.0",
-    "publint": "^0.3.15",
-    "sass-embedded": "^1.93.3",
-    "storybook": "^10.1.4",
-    "svelte": "^5.45.5",
+    "publint": "^0.3.16",
+    "sass-embedded": "^1.96.0",
+    "storybook": "^10.1.7",
+    "svelte": "^5.45.10",
     "svelte-check": "^4.3.4",
     "svelte-render-scan": "^1.1.0",
     "typescript": "^5.9.3",
-    "typescript-eslint": "^8.48.1",
-    "vite": "^7.2.6",
+    "typescript-eslint": "^8.49.0",
+    "vite": "^7.2.7",
     "vite-plugin-devtools-json": "^1.0.0",
     "vitest": "^4.0.15",
     "vitest-browser-svelte": "^2.0.1"