From f4c8f9e9947f842e7fd80fe35777f8fe22cd45a6 Mon Sep 17 00:00:00 2001 From: __ Date: Thu, 7 Nov 2024 16:26:31 -0800 Subject: [PATCH] fix: bundled type declarations (#57) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * Declarations refactor (types.ts / globals.d.ts) typings.d.ts has been refactored—utility/data types are now in types.ts, and globals/module augmentations in globals.d.ts. Publicly consumed types are now included in declaration emit, module augmentations skipped. Missing type import and export have also been added. * type imports cleanup + usePerf refinement --- src/components/Graph.tsx | 18 +++++++++--------- src/components/HtmlMinimal.tsx | 2 +- src/components/Perf.tsx | 4 ++-- src/components/PerfHeadless.tsx | 6 +++--- src/components/Program.tsx | 7 +++---- src/components/TextsHighHZ.tsx | 6 +++--- src/globals.d.ts | 6 ++++++ src/helpers/countGeoDrawCalls.ts | 2 +- src/store.ts | 2 +- src/{typings.d.ts => types.ts} | 7 ++----- src/woff.d.ts | 1 - 11 files changed, 31 insertions(+), 30 deletions(-) create mode 100644 src/globals.d.ts rename src/{typings.d.ts => types.ts} (81%) delete mode 100644 src/woff.d.ts diff --git a/src/components/Graph.tsx b/src/components/Graph.tsx index 79fe5e3..48449d4 100644 --- a/src/components/Graph.tsx +++ b/src/components/Graph.tsx @@ -1,12 +1,12 @@ -import { FC, useMemo, useRef } from 'react'; +import { type FC, useMemo, useRef } from 'react'; import { matriceCount, matriceWorldCount } from './PerfHeadless'; import { Graph, Graphpc } from '../styles'; import { PauseIcon } from '@radix-ui/react-icons'; -import { Canvas, useFrame, Viewport } from '@react-three/fiber'; -import { getPerf, usePerf } from '..'; +import { Canvas, useFrame, type Viewport } from '@react-three/fiber'; +import { getPerf, usePerf } from '../store'; import { colorsGraph } from './Perf'; import * as THREE from 'three'; -import { PerfUIProps } from '../typings'; +import type { PerfUIProps } from '../types'; import { TextsHighHZ } from './TextsHighHZ'; export interface graphData { @@ -36,7 +36,7 @@ const ChartCurve:FC = ({colorBlind, minimal, chart= {length: 120, h const updatePoints = (element: string, factor: number = 1, ref: any, viewport: Viewport) => { let maxVal = 0; const {width: w, height: h} = viewport - + const chart = getPerf().chart.data[element]; if (!chart || chart.length === 0) { return @@ -51,17 +51,17 @@ const ChartCurve:FC = ({colorBlind, minimal, chart= {length: 120, h maxVal = chart[id] * factor; } dummyVec3.set(padding + i / (len - 1) * (w - padding * 2) - w / 2, (Math.min(100, chart[id]) * factor) / 100 * (h - padding * 2 - paddingTop) - h / 2, 0) - + dummyVec3.toArray(ref.attributes.position.array, i * 3) } } - + ref.attributes.position.needsUpdate = true; }; // const [supportMemory] = useState(window.performance.memory) useFrame(function updateChartCurve({viewport}) { - + updatePoints('fps', 1, fpsRef.current, viewport) if (fpsMatRef.current) { fpsMatRef.current.color.set(getPerf().overclockingFps ? colorsGraph(colorBlind).overClock.toString() : `rgb(${colorsGraph(colorBlind).fps.toString()})`) @@ -212,6 +212,6 @@ const Renderer = () =>{ matriceCount.value = 0 }, Infinity) - + return null } \ No newline at end of file diff --git a/src/components/HtmlMinimal.tsx b/src/components/HtmlMinimal.tsx index 88f6b24..c73fc4a 100644 --- a/src/components/HtmlMinimal.tsx +++ b/src/components/HtmlMinimal.tsx @@ -1,5 +1,5 @@ import { useThree } from '@react-three/fiber' -import React, { forwardRef, ReactNode, useLayoutEffect, useRef } from 'react' +import React, { forwardRef, type ReactNode, useLayoutEffect, useRef, useEffect } from 'react' // @ts-ignore import { createRoot, Root } from 'react-dom/client' diff --git a/src/components/Perf.tsx b/src/components/Perf.tsx index 14498e8..50e31c5 100644 --- a/src/components/Perf.tsx +++ b/src/components/Perf.tsx @@ -1,4 +1,4 @@ -import React, { FC, useRef } from 'react' +import React, { type FC, useRef } from 'react' import { ChartUI } from './Graph' import { ActivityLogIcon, @@ -23,7 +23,7 @@ import { PerfHeadless } from './PerfHeadless' import { Toggle, PerfS, PerfIContainer, PerfI, PerfB, ToggleContainer, ContainerScroll, PerfSmallI } from '../styles' import { ProgramsUI } from './Program' import { setPerf, usePerf } from '../store' -import { PerfPropsGui } from '../typings' +import type { PerfPropsGui } from '../types' interface colors { [index: string]: string diff --git a/src/components/PerfHeadless.tsx b/src/components/PerfHeadless.tsx index 1020931..770845d 100644 --- a/src/components/PerfHeadless.tsx +++ b/src/components/PerfHeadless.tsx @@ -1,11 +1,11 @@ -import { FC, HTMLAttributes, useEffect, useMemo } from 'react' +import { type FC, type HTMLAttributes, useEffect, useMemo } from 'react' import { addEffect, addAfterEffect, useThree, addTail } from '@react-three/fiber' import { overLimitFps, GLPerf } from '../internal' import * as THREE from 'three' import { countGeoDrawCalls } from '../helpers/countGeoDrawCalls' -import { getPerf, ProgramsPerfs, setPerf } from '../store' -import { PerfProps } from '../typings' +import { getPerf, type ProgramsPerfs, setPerf } from '../store' +import type { PerfProps } from '../types' import { emitEvent } from '@utsubo/events' // cameras from r3f-perf scene diff --git a/src/components/Program.tsx b/src/components/Program.tsx index 33c621b..9adc05a 100644 --- a/src/components/Program.tsx +++ b/src/components/Program.tsx @@ -1,4 +1,4 @@ -import { FC, useEffect, useState } from 'react'; +import { type FC, useEffect, useState } from 'react'; import { ProgramGeo, @@ -14,10 +14,9 @@ import { ProgramsGeoLi, ProgramsContainer, } from '../styles'; -import { usePerf } from '..'; import { ActivityLogIcon, ButtonIcon, CubeIcon, EyeNoneIcon, EyeOpenIcon, ImageIcon, LayersIcon, RocketIcon, TriangleDownIcon, TriangleUpIcon, VercelLogoIcon } from '@radix-ui/react-icons'; -import { ProgramsPerf } from '../store'; -import { PerfProps } from '../typings'; +import { usePerf, type ProgramsPerf } from '../store'; +import type { PerfProps } from '../types'; import { estimateBytesUsed } from '../helpers/estimateBytesUsed'; const addTextureUniforms = (id: string, texture: any) => { diff --git a/src/components/TextsHighHZ.tsx b/src/components/TextsHighHZ.tsx index db7273c..346e25a 100644 --- a/src/components/TextsHighHZ.tsx +++ b/src/components/TextsHighHZ.tsx @@ -1,11 +1,11 @@ -import { FC, memo, Suspense, useRef } from 'react' +import { type FC, memo, Suspense, useRef } from 'react' import { matriceCount, matriceWorldCount } from './PerfHeadless' -import { useFrame, useThree } from '@react-three/fiber' +import { useThree } from '@react-three/fiber' import { Text } from '@react-three/drei' import { getPerf } from '..' import { colorsGraph } from './Perf' import * as THREE from 'three' -import { customData, PerfUIProps } from '../typings' +import type { customData, PerfUIProps } from '../types' import { useEvent } from '@utsubo/events' import localFont from '../roboto.woff' diff --git a/src/globals.d.ts b/src/globals.d.ts new file mode 100644 index 0000000..84afe9f --- /dev/null +++ b/src/globals.d.ts @@ -0,0 +1,6 @@ +declare module '*.woff'; + +declare module '*.css' { + const content: { [className: string]: string } + export default content +} \ No newline at end of file diff --git a/src/helpers/countGeoDrawCalls.ts b/src/helpers/countGeoDrawCalls.ts index 55a0b70..3fe6751 100644 --- a/src/helpers/countGeoDrawCalls.ts +++ b/src/helpers/countGeoDrawCalls.ts @@ -1,4 +1,4 @@ -import { drawCounts, ProgramsPerfs } from '../store' +import type { drawCounts, ProgramsPerfs } from '../store' export const countGeoDrawCalls = (programs: ProgramsPerfs) => { programs.forEach((program, _pkey) => { diff --git a/src/store.ts b/src/store.ts index fb791f5..1ead129 100644 --- a/src/store.ts +++ b/src/store.ts @@ -178,7 +178,7 @@ export const usePerfImpl = createWithEqualityFn((set, get): any => { } }) -const usePerf = (sel: (state: State) => unknown) => usePerfImpl(sel, shallow) +const usePerf = (sel: (state: State) => S) => usePerfImpl(sel, shallow) Object.assign(usePerf, usePerfImpl) const { getState: getPerf, setState: setPerf } = usePerfImpl diff --git a/src/typings.d.ts b/src/types.ts similarity index 81% rename from src/typings.d.ts rename to src/types.ts index 4a5e83f..9252ceb 100644 --- a/src/typings.d.ts +++ b/src/types.ts @@ -1,7 +1,4 @@ -declare module '*.css' { - const content: { [className: string]: string } - export default content -} +import type { HTMLAttributes } from 'react' export type chart = { length: number @@ -34,7 +31,7 @@ export interface PerfPropsGui extends PerfProps { style?: object } -interface PerfUIProps extends HTMLAttributes { +export interface PerfUIProps extends HTMLAttributes { perfContainerRef?: any colorBlind?: boolean showGraph?: boolean diff --git a/src/woff.d.ts b/src/woff.d.ts deleted file mode 100644 index 80e98b7..0000000 --- a/src/woff.d.ts +++ /dev/null @@ -1 +0,0 @@ -declare module '*.woff'; \ No newline at end of file