bumps and linting

Author: martrapp

package-lock.json

@@ -44,9 +44,12 @@
     "@eslint/js": "^9.24.0",
     "@types/dom-view-transitions": "^1.0.6",
     "eruda": "^3.4.1",
-    "esbuild": "^0.25.2",
+    "esbuild": "^0.27.2",
     "prettier": "^3.5.3",
-    "typescript": "^5.8.3",
-    "vite": "^6.2.5"
+    "typescript": "^5.9.3",
+    "vite": "^7.3.1"
+  },
+  "dependencies": {
+    "@astrojs/check": "^0.9.6"
   }
 }

package.json

@@ -1,4 +1,4 @@
-import { getNonDefaultPropNames, getNonDefaultProps } from './default-styles';
+import { getNonDefaultPropNames } from './default-styles';
 import { control, namesOfAnimation } from './panel/full-control';
 import { plugInPanel } from './panel/inner';
 import { getModus } from './panel/modus';
@@ -192,7 +192,7 @@ export function listAnimations(name: string) {
 					a.effect?.pseudoElement === `::view-transition-${pseudo}(${name})`
 				);
 			})
-			.forEach((animation, idx) => {
+			.forEach((animation) => {
 				const animationString = (a: Animation) => {
 					const t = a.effect?.getTiming();
 					return `${t?.duration || '0'}ms ${t?.easing ?? ''}  ${t?.delay ?? '0'}ms   ${t?.iterations ?? ''} ${t?.direction ?? ''} ${t?.fill ?? ''} ${a.playState}`;

src/animations.ts

@@ -1,6 +1,7 @@
 const allProps: string[] = [];
 const redundantProps = ['top', 'left', 'right', 'bottom'];
-const basicProps = [
+/*
+const _basicProps = [
 	'animation',
 	'direction',
 	'height',
@@ -15,7 +16,7 @@ const basicProps = [
 	'writing-mode',
 	'z-index',
 ];
-
+*/
 let defaultStyleValues: Record<string, string>;
 
 export function setNonDefaultProps(elemStyle: CSSStyleDeclaration, style: CSSStyleDeclaration) {

src/default-styles.ts

@@ -1,9 +1,13 @@
 declare global {
-	type UpdateCallback = undefined | (() => void | Promise<void>);
-	type StartViewTransitionParameter = { types?: string[] | Set<string>; update?: UpdateCallback };
-
 	interface Document {
-		startViewTransition?(param?: StartViewTransitionParameter | UpdateCallback): ViewTransition;
+		startViewTransition?(
+			param?: StartViewTransitionOptions | ViewTransitionUpdateCallback
+		): ViewTransition;
+	}
+	interface Element {
+		startViewTransition?(
+			param?: StartViewTransitionOptions | ViewTransitionUpdateCallback
+		): ViewTransition;
 	}
 	interface PageSwapEvent extends Event {
 		viewTransition?: ViewTransition;
@@ -31,6 +35,8 @@ declare global {
 
 	interface ViewTransition {
 		readonly types?: Set<string>;
+		readonly transitionRoot?: Element;
+		waitUntil(promise: Promise<any>): void;
 	}
 	interface Window {
 		navigation?: Navigation;

src/dom-view-transitions-level2.d.ts

@@ -54,12 +54,12 @@ export function initDragging(
 
 	draggable.ownerDocument.addEventListener(
 		'mouseup',
-		(e) => dragged === draggable && stopDragging(),
+		(_e) => dragged === draggable && stopDragging(),
 		{ passive: true }
 	);
 	draggable.ownerDocument.addEventListener(
 		'touchend',
-		(e) => dragged === draggable && stopDragging(),
+		(_e) => dragged === draggable && stopDragging(),
 		{ passive: true }
 	);
 }

src/dragging.ts

@@ -53,24 +53,24 @@ function initSpecimen() {
 		const originalStartViewTransition = top!.document.startViewTransition;
 		if (!originalStartViewTransition) return;
 
-		const rewrite = (cb?: UpdateCallback) => async () => {
+		const rewrite = (cb?: ViewTransitionUpdateCallback) => async () => {
 			await Promise.resolve();
 			cb && (await cb());
 			pageReveal();
 		};
 
 		if (CSS.supports('selector(:active-view-transition-type(x))')) {
 			// level 2 signature
-			frameDocument.startViewTransition = (obj: StartViewTransitionParameter | UpdateCallback) => {
-				const param: StartViewTransitionParameter = { types: [], update: undefined };
+			frameDocument.startViewTransition = (obj?: ViewTransitionUpdateCallback | StartViewTransitionOptions) => {
+				const param: StartViewTransitionOptions = { types: undefined, update: undefined };
 				('@vtbag');
 				pageSwap();
 
 				if (!obj || obj instanceof Function) {
 					param.update = rewrite(obj);
 				} else {
-					param.types = obj.types;
-					param.update = rewrite(obj.update);
+					param.types = obj.types ?? undefined;
+					param.update = rewrite(obj.update ?? undefined);
 				}
 				return (inspectionChamber.viewTransition = originalStartViewTransition.call(
 					frameDocument,
@@ -79,7 +79,7 @@ function initSpecimen() {
 			};
 		} else {
 			// level 1 signature
-			frameDocument.startViewTransition = (cb: UpdateCallback) => {
+			frameDocument.startViewTransition = (cb: ViewTransitionUpdateCallback) => {
 				'@vtbag';
 				pageSwap();
 				return (inspectionChamber.viewTransition = originalStartViewTransition.call(
@@ -111,7 +111,7 @@ function pageReveal() {
 
 function beforeUpdateCallbackDone() {
 	setVtActive();
-	const root = top!.document.documentElement;
+	// const _root = top!.document.documentElement;
 	const viewTransition = inspectionChamber.viewTransition!;
 	const modusFunction: Record<Modus, () => void> = {
 		bypass: () => {},

src/index.ts

@@ -1,6 +1,6 @@
 import { updateLiveValues } from '../animations';
 import { getModus } from './modus';
-import { showSomeAnimations, THROTTLING_DELAY, updateNameVisibility } from './names';
+import { THROTTLING_DELAY, updateNameVisibility } from './names';
 import { vtActive } from './transition';
 
 export function controlledPlay() {

src/panel/full-control.ts

@@ -26,7 +26,7 @@ export function updateNames(
 		top!.document.querySelector<HTMLElement>('#vtbag-ui-names div')!.style.display =
 			rightTransitionNames ? 'flex' : 'none';
 		const list = top!.document.querySelector('#vtbag-ui-names > ol')!;
-		(rightTransitionNames ? names! : [...leftTransitionNames].sort()).forEach((name, idx) => {
+		(rightTransitionNames ? names! : [...leftTransitionNames].sort()).forEach((name) => {
 			const li = top!.document.createElement('li');
 			li.innerText = name;
 			if (rightTransitionNames && leftTransitionNames.has(name)) {

src/panel/names.ts

@@ -56,7 +56,7 @@ function twinId(name: string, pseudo: string) {
 export async function syncTwins(hidden: Set<string>) {
 	top!.document.documentElement.classList.add('vtbag-twin-sync');
 	const inspectionChamber = top!.__vtbag.inspectionChamber!;
-	const root = inspectionChamber.frameDocument!.documentElement;
+	// const _root = inspectionChamber.frameDocument!.documentElement;
 	for (let group of [...(inspectionChamber.twin?.children || [])]) {
 		const name = (group as HTMLElement).dataset.vtbagTransitionName!;
 		if (hidden.has(name)) continue;