diff options
| author | rxliuli <rxliuli@gmail.com> | 2025-11-04 05:03:50 +0800 |
|---|---|---|
| committer | rxliuli <rxliuli@gmail.com> | 2025-11-04 05:03:50 +0800 |
| commit | bce557cc2dc767628bed6aac87301a1be7c5431b (patch) | |
| tree | b51a051228d01fe3306cd7626d4a96768aadb944 /shared/components/src/stores/prefers-reduced-motion.ts | |
init commit
Diffstat (limited to 'shared/components/src/stores/prefers-reduced-motion.ts')
| -rw-r--r-- | shared/components/src/stores/prefers-reduced-motion.ts | 27 |
1 files changed, 27 insertions, 0 deletions
diff --git a/shared/components/src/stores/prefers-reduced-motion.ts b/shared/components/src/stores/prefers-reduced-motion.ts new file mode 100644 index 0000000..03d9393 --- /dev/null +++ b/shared/components/src/stores/prefers-reduced-motion.ts @@ -0,0 +1,27 @@ +import { readable } from 'svelte/store'; + +const DEFAULT_SETTING = false; + +export const prefersReducedMotion = readable(DEFAULT_SETTING, (set) => { + if (typeof window === 'undefined' || typeof matchMedia === 'undefined') { + set(DEFAULT_SETTING); + return; + } + + const motionQuery = matchMedia('(prefers-reduced-motion)'); + + /* istanbul ignore next */ + const motionQueryListener = (): void => { + set(motionQuery.matches); + }; + + // `addListener` is deprecated but should still be used for compatibility with more browsers. + motionQuery.addListener(motionQueryListener); + + set(motionQuery.matches); + + return function (): void { + // `removeListener` is deprecated but should still be used for compatibility with more browsers. + motionQuery.removeListener(motionQueryListener); + }; +}); |
