Skip to content

Commit 3bfb29b

Browse files
authored
Merge pull request #392 from pmndrs/chore/prop-types-audit
Chore/prop types audit
2 parents 9cd75c2 + 5222ec0 commit 3bfb29b

21 files changed

Lines changed: 216 additions & 142 deletions

‎docs/effects/bloom.mdx‎

Lines changed: 14 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -7,12 +7,11 @@ A bloom effect.
77

88
```jsx
99
import { Bloom } from '@react-three/postprocessing'
10-
import { BlurPass, Resizer, KernelSize, Resolution } from 'postprocessing'
10+
import { KernelSize, Resolution } from 'postprocessing'
1111

1212
return (
1313
<Bloom
1414
intensity={1.0} // The bloom intensity.
15-
blurPass={undefined} // A blur pass.
1615
kernelSize={KernelSize.LARGE} // blur kernel size
1716
luminanceThreshold={0.9} // luminance threshold. Raise this value to mask out darker elements in the scene.
1817
luminanceSmoothing={0.025} // smoothness of the luminance threshold. Range is [0, 1]
@@ -54,14 +53,16 @@ clamp colors between 0 and 1 again.
5453

5554
## Props
5655

57-
| Name | Type | Default | Description |
58-
| ------------------ | ------------------------------------------------------------------------------------------------------------ | -------------------- | ---------------------------------------------------------------------------------------------------- |
59-
| luminanceThreshold | Number | 0.9 | The luminance threshold. Raise this value to mask out darker elements in the scene. Range is [0, 1]. |
60-
| luminanceSmoothing | Number | 0.025 | Controls the smoothness of the luminance threshold. Range is [0, 1]. |
61-
| blendFunction | BlendFunction | BlendFunction.SCREEN | The blend function of this effect. |
62-
| intensity | Number | 1 | The intensity. |
63-
| resolutionX | Number | Resizer.AUTO_SIZE | The render width. |
64-
| resolutionY | Number | Resizer.AUTO_SIZE | The render height. |
65-
| kernelSize | Number | KernelSize.LARGE | The blur kernel size. |
66-
| blurPass | [BlurPass](https://vanruesc.github.io/postprocessing/public/docs/class/src/passes/BlurPass.js~BlurPass.html) | null | An efficient, incremental blur pass. |
67-
| mipMap | Boolean |
56+
| Name | Type | Default | Description |
57+
| ------------------ | ------------- | -------------------- | ---------------------------------------------------------------------------------------------------- |
58+
| luminanceThreshold | Number | 0.9 | The luminance threshold. Raise this value to mask out darker elements in the scene. Range is [0, 1]. |
59+
| luminanceSmoothing | Number | 0.025 | Controls the smoothness of the luminance threshold. Range is [0, 1]. |
60+
| blendFunction | BlendFunction | BlendFunction.ADD | The blend function of this effect. |
61+
| intensity | Number | 1 | The intensity. |
62+
| resolutionX | Number | Resolution.AUTO_SIZE | The render width. |
63+
| resolutionY | Number | Resolution.AUTO_SIZE | The render height. |
64+
| kernelSize | Number | KernelSize.LARGE | The blur kernel size. |
65+
| mipmapBlur | Boolean | true | Enables mipmap blur. |
66+
| radius | Number | 0.85 | The mipmap blur radius. Only used with mipmapBlur. |
67+
| levels | Number | 8 | The number of mipmap blur levels. Only used with mipmapBlur. |
68+
| opacity | Number | 1 | The opacity of this effect. |

‎docs/effects/grid.mdx‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -25,10 +25,10 @@ return (
2525

2626
## Props
2727

28-
| Name | Type | Default | Description |
29-
| ------------- | ------------- | -------------------- | ---------------------------------- |
30-
| blendFunction | BlendFunction | BlendFunction.NORMAL | The blend function of this effect. |
31-
| scale | Number | 1 | The scale of the grid pattern. |
32-
| lineWidth | Number | 0 | The blend function of this effect. |
33-
| width | Number | | Overrides the default pass width |
34-
| height | Number | | Overrides the default pass height |
28+
| Name | Type | Default | Description |
29+
| ------------- | ----------------------------------- | --------------------- | -------------------------------------------- |
30+
| blendFunction | BlendFunction | BlendFunction.OVERLAY | The blend function of this effect. |
31+
| scale | Number | 1 | The scale of the grid pattern. |
32+
| lineWidth | Number | 0 | The line width of the grid pattern. |
33+
| size | `{ width: Number, height: Number }` | | Overrides the default pass width and height. |
34+
| opacity | Number | 1 | The opacity of this effect. |

‎src/EffectComposer.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -45,7 +45,7 @@ export type EffectComposerProps = {
4545
enabled?: boolean
4646
children: ReactNode
4747
depthBuffer?: boolean
48-
/** Only used for SSGI currently, leave it disabled for everything else unless it's needed */
48+
/** Required by SSAO, leave it disabled otherwise. */
4949
enableNormalPass?: boolean
5050
stencilBuffer?: boolean
5151
autoClear?: boolean

‎src/effects/DepthOfField.tsx‎

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,13 +9,13 @@ import { applyPierced, readPierced, useDispose, useLiveDefaults } from '../util'
99
export type DepthOfFieldProps = ConstructorParameters<typeof DepthOfFieldEffect>[1] &
1010
Partial<{
1111
ref: Ref<DepthOfFieldEffect>
12+
opacity: number
1213
target: ReactThreeFiber.Vector3
1314
depthTexture: {
1415
texture: Texture
15-
// TODO: narrow to DepthPackingStrategies
1616
packing: number
1717
}
18-
// TODO: not used
18+
/** @deprecated Has no effect. */
1919
blur: number
2020
}>
2121

@@ -26,6 +26,7 @@ export type DepthOfFieldProps = ConstructorParameters<typeof DepthOfFieldEffect>
2626
// (needs `new Effect()` to work with zero args).
2727
const LIVE_KEYS = [
2828
'blendMode-blendFunction',
29+
'blendMode-opacity-value',
2930
'bokehScale',
3031
'cocMaterial-focusDistance',
3132
'cocMaterial-focusRange',
@@ -53,6 +54,7 @@ function set(effect: DepthOfFieldEffect, key: string, value: unknown): void {
5354
export function DepthOfField({
5455
ref,
5556
blendFunction,
57+
opacity,
5658
worldFocusDistance,
5759
worldFocusRange,
5860
focusDistance,
@@ -93,6 +95,7 @@ export function DepthOfField({
9395
effect,
9496
{
9597
'blendMode-blendFunction': blendFunction,
98+
'blendMode-opacity-value': opacity,
9699
bokehScale,
97100
'cocMaterial-focusDistance': focusDistance,
98101
'cocMaterial-focusRange': focusRange,

‎src/effects/FXAA.tsx‎

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,12 @@
11
import { FXAAEffect } from 'postprocessing'
22
import { createEffectComponent, type EffectOptions } from '../createEffectComponent'
33

4-
export const FXAA = /* @__PURE__ */ createEffectComponent<typeof FXAAEffect, EffectOptions<typeof FXAAEffect>>(
5-
FXAAEffect
6-
)
4+
// Not constructor options, but live setters on FXAAEffect
5+
export type FXAAProps = EffectOptions<typeof FXAAEffect> & {
6+
minEdgeThreshold?: number
7+
maxEdgeThreshold?: number
8+
subpixelQuality?: number
9+
samples?: number
10+
}
11+
12+
export const FXAA = /* @__PURE__ */ createEffectComponent<typeof FXAAEffect, FXAAProps>(FXAAEffect)

‎src/effects/GodRays.tsx‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,9 @@ import { Mesh, Points } from 'three'
55
import { EffectComposerContext } from '../EffectComposer'
66
import { applyPierced, readPierced, resolveRef, useDispose, useLiveDefaults } from '../util'
77

8-
type GodRaysProps = ConstructorParameters<typeof GodRaysEffect>[2] & {
8+
export type GodRaysProps = ConstructorParameters<typeof GodRaysEffect>[2] & {
99
sun: Mesh | Points | RefObject<Mesh | Points>
10+
opacity?: number
1011
ref?: Ref<GodRaysEffect>
1112
}
1213

@@ -18,6 +19,7 @@ type GodRaysProps = ConstructorParameters<typeof GodRaysEffect>[2] & {
1819
// with zero args).
1920
const LIVE_KEYS = [
2021
'blendMode-blendFunction',
22+
'blendMode-opacity-value',
2123
'godRaysMaterial-density',
2224
'godRaysMaterial-decay',
2325
'godRaysMaterial-weight',
@@ -42,6 +44,7 @@ function set(effect: GodRaysEffect, key: string, value: unknown): void {
4244
export function GodRays({
4345
sun,
4446
blendFunction,
47+
opacity,
4548
density,
4649
decay,
4750
weight,
@@ -82,6 +85,7 @@ export function GodRays({
8285
effect,
8386
{
8487
'blendMode-blendFunction': blendFunction,
88+
'blendMode-opacity-value': opacity,
8589
'godRaysMaterial-density': density,
8690
'godRaysMaterial-decay': decay,
8791
'godRaysMaterial-weight': weight,

‎src/effects/LUT.tsx‎

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -7,18 +7,23 @@ export type LUTProps = {
77
lut: Texture
88
blendFunction?: BlendFunction
99
tetrahedralInterpolation?: boolean
10+
opacity?: number
1011
ref?: Ref<LUT3DEffect>
1112
}
1213

13-
const LIVE_KEYS = ['blendMode-blendFunction', 'lut', 'tetrahedralInterpolation']
14+
const LIVE_KEYS = ['blendMode-blendFunction', 'blendMode-opacity-value', 'lut', 'tetrahedralInterpolation']
1415

1516
// lut is LUT3DEffect's required constructor arg (no default) - only used
1617
// for the initial instance, later changes go through its own live setter
1718
// (via useLiveDefaults below) instead of reconstructing.
18-
export function LUT({ lut, blendFunction, tetrahedralInterpolation, ref }: LUTProps) {
19+
export function LUT({ lut, blendFunction, opacity, tetrahedralInterpolation, ref }: LUTProps) {
1920
const effect = useMemo(() => new LUT3DEffect(lut), [])
2021

21-
useLiveDefaults(effect, { 'blendMode-blendFunction': blendFunction, lut, tetrahedralInterpolation }, LIVE_KEYS)
22+
useLiveDefaults(
23+
effect,
24+
{ 'blendMode-blendFunction': blendFunction, 'blendMode-opacity-value': opacity, lut, tetrahedralInterpolation },
25+
LIVE_KEYS
26+
)
2227
useDispose(effect)
2328

2429
return <primitive ref={ref} object={effect} />

‎src/effects/LensFlare.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -630,7 +630,7 @@ export class LensFlareEffect extends Effect {
630630
}
631631
}
632632

633-
type LensFlareProps = Omit<Partial<LensFlareEffectOptions>, 'lensPosition'> & {
633+
export type LensFlareProps = Omit<Partial<LensFlareEffectOptions>, 'lensPosition'> & {
634634
/** Position of the effect */
635635
lensPosition?: ReactThreeFiber.Vector3
636636
/** The time that it takes to fade the occlusion */

‎src/effects/Outline.tsx‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@ export type OutlineProps = Omit<OutlineEffectOptions, 'visibleEdgeColor' | 'hidd
1414
selectionLayer: number
1515
visibleEdgeColor: ColorRepresentation
1616
hiddenEdgeColor: ColorRepresentation
17+
opacity: number
1718
ref?: Ref<OutlineEffect>
1819
}>
1920

@@ -38,6 +39,7 @@ const LIVE_KEYS = [
3839
'xRay',
3940
'dithering',
4041
'blendMode-blendFunction',
42+
'blendMode-opacity-value',
4143
]
4244

4345
// The setter stores whatever it's given as-is, unlike the constructor -
@@ -51,6 +53,7 @@ export function Outline({
5153
selection = EMPTY_ARRAY,
5254
selectionLayer = 10,
5355
blendFunction,
56+
opacity,
5457
resolutionScale,
5558
resolutionX,
5659
resolutionY,
@@ -72,7 +75,10 @@ export function Outline({
7275

7376
useLiveDefaults(
7477
effect,
75-
{ ...liveProps, 'blendMode-blendFunction': blendFunction } as Record<string, unknown>,
78+
{ ...liveProps, 'blendMode-blendFunction': blendFunction, 'blendMode-opacity-value': opacity } as Record<
79+
string,
80+
unknown
81+
>,
7682
LIVE_KEYS,
7783
readPierced,
7884
set

‎src/effects/SMAA.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
1-
import { SMAAEffect } from 'postprocessing'
1+
import { BlendFunction, SMAAEffect } from 'postprocessing'
22
import type { Ref } from 'react'
33
import { useMemo } from 'react'
44
import { createEffectComponent, type EffectOptions } from '../createEffectComponent'
55

6-
type SMAAOptions = EffectOptions<typeof SMAAEffect>
6+
type SMAAOptions = EffectOptions<typeof SMAAEffect> & { blendFunction?: BlendFunction }
77

88
const SMAAImpl = /* @__PURE__ */ createEffectComponent<typeof SMAAEffect, SMAAOptions>(SMAAEffect)
99

0 commit comments

Comments
 (0)