From 4ab42d2819060c6c8d88bfd701d56351ad3dcc76 Mon Sep 17 00:00:00 2001 From: Bjorn Stromberg Date: Wed, 1 Dec 2021 20:45:45 +0100 Subject: [PATCH] v4.2.0 - 2021-12-01 --- CHANGELOG.md | 8 ++++++ README.md | 26 +++++++++--------- package.json | 2 +- src/Debug.tsx | 9 +++---- src/Provider.tsx | 70 +++++++++++++++++++++++++----------------------- src/index.tsx | 4 +-- 6 files changed, 65 insertions(+), 54 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index d3219aef..4d0c9d95 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,13 @@ # @react-three/cannon Changelog +## v4.2.0 - 2021-12-01 + +- [Types] Use `PropsWithChildren` from React instead of `children: ReactNode` (@bjornstar) +- [README.md] Update default Physics prop values (@bjornstar) +- export \* from `'./setup'` there are a lot of useful types in here (@bjornstar) +- Build using jsx runtime instead of React runtime for a slightly smaller bundle (@bjornstar) +- [CHANGELOG.md] Add details for v3.1.1 & v3.1.2 (@bjornstar) + ## v4.1.0 - 2021-11-21 - Update default gravity value from `-10` to `-9.81` (@alexandernanberg) diff --git a/README.md b/README.md index 3695e3b1..4f5a3821 100644 --- a/README.md +++ b/README.md @@ -123,24 +123,25 @@ ReactDOM.render( ```typescript function Physics({ + allowSleep = false, + axisIndex = 0, + broadphase = 'Naive', children, - shouldInvalidate = true, - step = 1 / 60, + defaultContactMaterial = { contactEquationStiffness: 1e6 }, gravity = [0, -9.81, 0], - tolerance = 0.001, iterations = 5, - allowSleep = false, - broadphase = 'Naive', - axisIndex = 0, - defaultContactMaterial = { - contactEquationStiffness: 1e6, - }, + quatNormalizeFast = false, + quatNormalizeSkip = 0, + shouldInvalidate = true, // Maximum amount of physics objects inside your scene // Lower this value to save memory, increase if 1000 isn't enough size = 1000, + solver = 'GS', + step = 1 / 60, + tolerance = 0.001, }: ProviderProps): JSX.Element -function Debug({ children, color = 'black', scale = 1 }: DebugProps): JSX.Element +function Debug({ color = 'black', scale = 1 }: DebugProps): JSX.Element function usePlane( fn: GetByIndex, @@ -350,8 +351,7 @@ interface RaycastVehiclePublicApi { ### Props ```typescript -type ProviderProps = { - children: React.ReactNode +type ProviderProps = React.PropsWithChildren<{ shouldInvalidate?: boolean gravity?: Triplet tolerance?: number @@ -369,7 +369,7 @@ type ProviderProps = { frictionEquationRelaxation?: number } size?: number -} +}> type AtomicProps = { allowSleep: boolean diff --git a/package.json b/package.json index 959e3b18..be34a0dd 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@react-three/cannon", - "version": "4.1.0", + "version": "4.2.0", "description": "physics based hooks for react-three-fiber", "keywords": [ "cannon", diff --git a/src/Debug.tsx b/src/Debug.tsx index 0f1dd64f..27fdc8da 100644 --- a/src/Debug.tsx +++ b/src/Debug.tsx @@ -7,7 +7,7 @@ import propsToBody from './propsToBody' import type { Body, Quaternion as CQuaternion, Vec3 } from 'cannon-es' import type { DebugOptions } from 'cannon-es-debugger' -import type { ReactNode } from 'react' +import type { PropsWithChildren } from 'react' import type { Color } from 'three' import type { BodyProps, BodyShapeType } from './hooks' @@ -19,12 +19,11 @@ export type DebuggerInterface = (scene: Scene, bodies: Body[], props?: DebugOpti export type DebugInfo = { bodies: Body[]; refs: { [uuid: string]: Body } } -export type DebugProps = { - children: ReactNode +export type DebugProps = PropsWithChildren<{ color?: string | number | Color - scale?: number impl?: DebuggerInterface -} + scale?: number +}> const v = new Vector3() const s = new Vector3(1, 1, 1) diff --git a/src/Provider.tsx b/src/Provider.tsx index 9d5f7107..f6ee5d2e 100644 --- a/src/Provider.tsx +++ b/src/Provider.tsx @@ -1,13 +1,15 @@ -import { useThree, useFrame } from '@react-three/fiber' -import { useState, useLayoutEffect, useRef, useMemo, useCallback } from 'react' -import { InstancedMesh, Vector3, Quaternion, Matrix4 } from 'three' +import { useFrame, useThree } from '@react-three/fiber' +import { useCallback, useLayoutEffect, useMemo, useRef, useState } from 'react' +import { InstancedMesh, Matrix4, Quaternion, Vector3 } from 'three' + import { context } from './setup' import { useUpdateWorldPropsEffect } from './useUpdateWorldPropsEffect' -import type { Shape } from 'cannon-es' -import type { ReactNode } from 'react' +import type { ContactMaterial, Shape } from 'cannon-es' +import type { PropsWithChildren } from 'react' import type { Object3D } from 'three' -import type { AtomicName, Buffers, PropValue, Refs, ProviderContext } from './setup' + +import type { AtomicName, Buffers, PropValue, ProviderContext, Refs } from './setup' import type { Triplet } from './hooks' // @ts-expect-error Types are not setup for this yet @@ -18,33 +20,35 @@ function noop() { } export type Broadphase = 'Naive' | 'SAP' +export type Solver = 'GS' | 'Split' -export type ProviderProps = { - children: ReactNode - shouldInvalidate?: boolean - - tolerance?: number - step?: number - iterations?: number +export type DefaultContactMaterial = Partial< + Pick< + ContactMaterial, + | 'contactEquationRelaxation' + | 'contactEquationStiffness' + | 'friction' + | 'frictionEquationRelaxation' + | 'frictionEquationStiffness' + | 'restitution' + > +> +export type ProviderProps = PropsWithChildren<{ allowSleep?: boolean + axisIndex?: number broadphase?: Broadphase + defaultContactMaterial?: DefaultContactMaterial gravity?: Triplet + iterations?: number quatNormalizeFast?: boolean quatNormalizeSkip?: number - solver?: 'GS' | 'Split' - - axisIndex?: number - defaultContactMaterial?: { - friction?: number - restitution?: number - contactEquationStiffness?: number - contactEquationRelaxation?: number - frictionEquationStiffness?: number - frictionEquationRelaxation?: number - } + shouldInvalidate?: boolean size?: number -} + solver?: Solver + step?: number + tolerance?: number +}> type Observation = { [K in AtomicName]: [id: number, value: PropValue, type: K] }[AtomicName] @@ -154,20 +158,20 @@ function apply(index: number, buffers: Buffers, object?: Object3D) { } export function Provider({ + allowSleep = false, + axisIndex = 0, + broadphase = 'Naive', children, - shouldInvalidate = true, - step = 1 / 60, + defaultContactMaterial = { contactEquationStiffness: 1e6 }, gravity = [0, -9.81, 0], - tolerance = 0.001, iterations = 5, - allowSleep = false, - broadphase = 'Naive', - axisIndex = 0, quatNormalizeFast = false, quatNormalizeSkip = 0, - solver = 'GS', - defaultContactMaterial = { contactEquationStiffness: 1e6 }, + shouldInvalidate = true, size = 1000, + solver = 'GS', + step = 1 / 60, + tolerance = 0.001, }: ProviderProps): JSX.Element { const { invalidate } = useThree() const [worker] = useState(() => new CannonWorker() as Worker) diff --git a/src/index.tsx b/src/index.tsx index 987de93e..39becb28 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -1,11 +1,11 @@ import { Suspense } from 'react' import { Provider } from './Provider' -import { context } from './setup' import type { ProviderProps } from './Provider' export * from './Debug' export * from './hooks' +export * from './setup' function Physics(props: ProviderProps) { return ( @@ -15,4 +15,4 @@ function Physics(props: ProviderProps) { ) } -export { Physics, context } +export { Physics }