chore: initial import
This commit is contained in:
27
shared/components/src/stores/prefers-reduced-motion.ts
Normal file
27
shared/components/src/stores/prefers-reduced-motion.ts
Normal file
@@ -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);
|
||||
};
|
||||
});
|
||||
Reference in New Issue
Block a user