ByoungSooPark/modeling-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add isReducedMotion util (#333)

Browse Source
This commit is contained in:
Kurt Hutten
2023-08-28 18:48:31 +10:00
committed by GitHub
parent 0f3f0b3b68
commit 25b9b4cf98
2 changed files with 11 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
src/components/DebugPanel.tsx
View File

@ -5,6 +5,7 @@ import { EngineCommand } from '../lang/std/engineConnection'
import { useState } from 'react' import { useState } from 'react'
import { ActionButton } from '../components/ActionButton' import { ActionButton } from '../components/ActionButton'
import { faCheck } from '@fortawesome/free-solid-svg-icons' import { faCheck } from '@fortawesome/free-solid-svg-icons'
import { isReducedMotion } from 'lang/util'
type SketchModeCmd = Extract< type SketchModeCmd = Extract<
Extract<EngineCommand, { type: 'modeling_cmd_req' }>['cmd'], Extract<EngineCommand, { type: 'modeling_cmd_req' }>['cmd'],
@ -22,7 +23,7 @@ export const DebugPanel = ({ className, ...props }: CollapsiblePanelProps) => {
y_axis: { x: 0, y: 1, z: 0 }, y_axis: { x: 0, y: 1, z: 0 },
distance_to_plane: 100, distance_to_plane: 100,
ortho: true, ortho: true,
animated: true, // TODO #273 get prefers reduced motion from CSS animated: !isReducedMotion(),
}) })
if (!sketchModeCmd) return null if (!sketchModeCmd) return null
return ( return (

9
src/lang/util.ts
View File

@ -26,3 +26,12 @@ export function updateCursors(
setCursor(newSelections) setCursor(newSelections)
} }
} }
export function isReducedMotion(): boolean {
return (
typeof window !== 'undefined' &&
window.matchMedia &&
// TODO/Note I (Kurt) think '(prefers-reduced-motion: reduce)' and '(prefers-reduced-motion)' are equivalent, but not 100% sure
window.matchMedia('(prefers-reduced-motion)').matches
)
}