import { ScaleType , getBounds , getValidDomainForScale } from '@h5web/shared' ; import { useEventListener } from '@react-hookz/web' ; import { useFrame , useThree } from '@react-three/fiber' ; import type { NdArray } from 'ndarray' ; import { useCallback , useMemo , useState } from 'react' ; import type { RefCallback } from 'react' ; import { createMemo } from 'react-use' ; import { getAxisDomain , getCombinedDomain , getValueToIndexScale , } from './utils' ; const useBounds = createMemo ( getBounds ) ; const useValidDomainForScale = createMemo ( getValidDomainForScale ) ; export const useAxisDomain = createMemo ( getAxisDomain ) ; export function useDomain ( valuesArray , scaleType = ScaleType . Linear , errorArray ? ) { const bounds = useBounds ( valuesArray , errorArray ) ; return useValidDomainForScale ( bounds , scaleType ) ; } export function useFrameRendering ( ) { const [ , setNum ] = useState ( 0 ) ; useFrame ( ( ) => { setNum ( Math . random ( ) ) ; } ) ; } export function useDomains ( valuesArrays , scaleType = ScaleType . Linear ) { const allBounds = useMemo ( ( ) => { return valuesArrays . map ( ( arr ) => getBounds ( arr ) ) ; } , [ valuesArrays ] ) ; return useMemo ( ( ) => allBounds . map ( ( bounds ) => getValidDomainForScale ( bounds , scaleType ) ) , [ allBounds , scaleType ] ) ; } function onWheel ( evt ) { evt . preventDefault ( ) ; } export function useWheelCapture ( ) { const { domElement } = useThree ( ( state ) => state . gl ) ; useEventListener ( domElement , 'wheel' , onWheel , { passive : false } ) ; } export const useCombinedDomain = createMemo ( getCombinedDomain ) ; export const useValueToIndexScale = createMemo ( getValueToIndexScale ) ; export function useCSSCustomProperties ( ... names ) { const [ styles , setStyles ] = useState < CSSStyleDeclaration > ( ) ; const refCallback = useCallback ( ( elem ) => setStyles ( elem ? window . getComputedStyle ( elem ) : undefined ) , [ setStyles ] ) ; return { colors : names . map ( ( name ) => { return styles ? styles . getPropertyValue ( name ) . trim ( ) : 'transparent' ; } ) , refCallback , } ; }