js/webawesome
1
0
Fork 0
mirror of https://github.com/shoelace-style/webawesome.git synced 2026-01-12 12:09:26 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor

Browse Source
This commit is contained in:
Cory LaViska
2025-06-10 13:08:16 -04:00
parent 203c79a3d0
commit 771cf7f0b7
1 changed files with 11 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
packages/webawesome/docs/assets/scripts/view-transitions.js
View File

@@ -7,27 +7,21 @@ if (!initialPageLoadComplete) {
}
/**
* A wrapper around `document.startViewTransition()` that falls back to no transitions in unsupportive browsers.
* A wrapper around `document.startViewTransition()` that fails gracefully in unsupportive browsers.
*/
export function doViewTransition(callback, { behavior = 'smooth', ignoreInitialLoad = true } = {}) {
export async function doViewTransition(callback, { ignoreInitialLoad = true } = {}) {
// Skip transitions on initial page load
if (!initialPageLoadComplete && ignoreInitialLoad) {
callback();
return;
}
const canUseViewTransitions =
document.startViewTransition && !window.matchMedia('(prefers-reduced-motion: reduce)').matches;
// Skip transitions on initial page load
if (!initialPageLoadComplete && ignoreInitialLoad) {
callback(false);
return null;
}
if (canUseViewTransitions && behavior === 'smooth') {
const transition = document.startViewTransition(() => {
callback(true);
// Wait a brief delay before finishing the transition to prevent jumpiness
return new Promise(resolve => setTimeout(resolve, 200));
});
return transition;
if (canUseViewTransitions) {
await document.startViewTransition(callback).finished;
} else {
callback(false);
return null;
callback();
}
}