@react-three/postprocessing 2.15.2 → 2.15.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/EffectComposer.cjs +4 -7
- package/dist/EffectComposer.cjs.map +1 -1
- package/dist/EffectComposer.js +5 -8
- package/dist/EffectComposer.js.map +1 -1
- package/dist/effects/ToneMapping.cjs +46 -2
- package/dist/effects/ToneMapping.cjs.map +1 -1
- package/dist/effects/ToneMapping.d.ts +3 -1
- package/dist/effects/ToneMapping.js +47 -3
- package/dist/effects/ToneMapping.js.map +1 -1
- package/package.json +1 -1
package/dist/EffectComposer.cjs
CHANGED
|
@@ -7,6 +7,7 @@ const fiber = require("@react-three/fiber");
|
|
|
7
7
|
const postprocessing = require("postprocessing");
|
|
8
8
|
const threeStdlib = require("three-stdlib");
|
|
9
9
|
const EffectComposerContext = React.createContext(null);
|
|
10
|
+
const isConvolution = (effect) => (effect.getAttributes() & postprocessing.EffectAttribute.CONVOLUTION) === postprocessing.EffectAttribute.CONVOLUTION;
|
|
10
11
|
const EffectComposer = React.memo(
|
|
11
12
|
React.forwardRef(
|
|
12
13
|
({
|
|
@@ -82,14 +83,10 @@ const EffectComposer = React.memo(
|
|
|
82
83
|
for (let i = 0; i < children2.length; i++) {
|
|
83
84
|
const child = children2[i];
|
|
84
85
|
if (child instanceof postprocessing.Effect) {
|
|
85
|
-
const effects = [];
|
|
86
|
-
while (
|
|
87
|
-
// Filter to effects
|
|
88
|
-
children2[i] instanceof postprocessing.Effect && // Don't merge convolution effects
|
|
89
|
-
(children2[i].getAttributes() & postprocessing.EffectAttribute.CONVOLUTION) !== 0
|
|
90
|
-
)
|
|
86
|
+
const effects = [child];
|
|
87
|
+
while (children2[i] instanceof postprocessing.Effect && !isConvolution(children2[i])) {
|
|
91
88
|
effects.push(children2[i++]);
|
|
92
|
-
|
|
89
|
+
}
|
|
93
90
|
const pass = new postprocessing.EffectPass(camera, ...effects);
|
|
94
91
|
passes.push(pass);
|
|
95
92
|
} else if (child instanceof postprocessing.Pass) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EffectComposer.cjs","sources":["../src/EffectComposer.tsx"],"sourcesContent":["import type { TextureDataType } from 'three'\nimport { HalfFloatType } from 'three'\nimport React, {\n forwardRef,\n useMemo,\n useEffect,\n useLayoutEffect,\n createContext,\n useRef,\n useImperativeHandle,\n} from 'react'\nimport { useThree, useFrame, useInstanceHandle } from '@react-three/fiber'\nimport {\n EffectComposer as EffectComposerImpl,\n RenderPass,\n EffectPass,\n NormalPass,\n // @ts-ignore\n DepthDownsamplingPass,\n Effect,\n Pass,\n EffectAttribute,\n} from 'postprocessing'\nimport { isWebGL2Available } from 'three-stdlib'\n\nexport const EffectComposerContext = createContext<{\n composer: EffectComposerImpl\n normalPass: NormalPass | null\n downSamplingPass: DepthDownsamplingPass | null\n camera: THREE.Camera\n scene: THREE.Scene\n resolutionScale?: number\n}>(null!)\n\nexport type EffectComposerProps = {\n enabled?: boolean\n children: JSX.Element | JSX.Element[]\n depthBuffer?: boolean\n disableNormalPass?: boolean\n stencilBuffer?: boolean\n autoClear?: boolean\n resolutionScale?: number\n multisampling?: number\n frameBufferType?: TextureDataType\n renderPriority?: number\n camera?: THREE.Camera\n scene?: THREE.Scene\n}\n\nexport const EffectComposer = React.memo(\n forwardRef(\n (\n {\n children,\n camera: _camera,\n scene: _scene,\n resolutionScale,\n enabled = true,\n renderPriority = 1,\n autoClear = true,\n depthBuffer,\n disableNormalPass,\n stencilBuffer,\n multisampling = 8,\n frameBufferType = HalfFloatType,\n }: EffectComposerProps,\n ref\n ) => {\n const { gl, scene: defaultScene, camera: defaultCamera, size } = useThree()\n const scene = _scene || defaultScene\n const camera = _camera || defaultCamera\n\n const [composer, normalPass, downSamplingPass] = useMemo(() => {\n const webGL2Available = isWebGL2Available()\n // Initialize composer\n const effectComposer = new EffectComposerImpl(gl, {\n depthBuffer,\n stencilBuffer,\n multisampling: multisampling > 0 && webGL2Available ? multisampling : 0,\n frameBufferType,\n })\n\n // Add render pass\n effectComposer.addPass(new RenderPass(scene, camera))\n\n // Create normal pass\n let downSamplingPass = null\n let normalPass = null\n if (!disableNormalPass) {\n normalPass = new NormalPass(scene, camera)\n normalPass.enabled = false\n effectComposer.addPass(normalPass)\n if (resolutionScale !== undefined && webGL2Available) {\n downSamplingPass = new DepthDownsamplingPass({ normalBuffer: normalPass.texture, resolutionScale })\n downSamplingPass.enabled = false\n effectComposer.addPass(downSamplingPass)\n }\n }\n\n return [effectComposer, normalPass, downSamplingPass]\n }, [\n camera,\n gl,\n depthBuffer,\n stencilBuffer,\n multisampling,\n frameBufferType,\n scene,\n disableNormalPass,\n resolutionScale,\n ])\n\n useEffect(() => composer?.setSize(size.width, size.height), [composer, size])\n useFrame(\n (_, delta) => {\n if (enabled) {\n const currentAutoClear = gl.autoClear\n gl.autoClear = autoClear\n if (stencilBuffer && !autoClear) gl.clearStencil()\n composer.render(delta)\n gl.autoClear = currentAutoClear\n }\n },\n enabled ? renderPriority : 0\n )\n\n const group = useRef(null)\n const instance = useInstanceHandle(group)\n useLayoutEffect(() => {\n const passes: Pass[] = []\n\n if (group.current && instance.current && composer) {\n const children = instance.current.objects as unknown[]\n\n for (let i = 0; i < children.length; i++) {\n const child = children[i]\n\n if (child instanceof Effect) {\n const effects: Effect[] = []\n while (
|
|
1
|
+
{"version":3,"file":"EffectComposer.cjs","sources":["../src/EffectComposer.tsx"],"sourcesContent":["import type { TextureDataType } from 'three'\nimport { HalfFloatType } from 'three'\nimport React, {\n forwardRef,\n useMemo,\n useEffect,\n useLayoutEffect,\n createContext,\n useRef,\n useImperativeHandle,\n} from 'react'\nimport { useThree, useFrame, useInstanceHandle } from '@react-three/fiber'\nimport {\n EffectComposer as EffectComposerImpl,\n RenderPass,\n EffectPass,\n NormalPass,\n // @ts-ignore\n DepthDownsamplingPass,\n Effect,\n Pass,\n EffectAttribute,\n} from 'postprocessing'\nimport { isWebGL2Available } from 'three-stdlib'\n\nexport const EffectComposerContext = createContext<{\n composer: EffectComposerImpl\n normalPass: NormalPass | null\n downSamplingPass: DepthDownsamplingPass | null\n camera: THREE.Camera\n scene: THREE.Scene\n resolutionScale?: number\n}>(null!)\n\nexport type EffectComposerProps = {\n enabled?: boolean\n children: JSX.Element | JSX.Element[]\n depthBuffer?: boolean\n disableNormalPass?: boolean\n stencilBuffer?: boolean\n autoClear?: boolean\n resolutionScale?: number\n multisampling?: number\n frameBufferType?: TextureDataType\n renderPriority?: number\n camera?: THREE.Camera\n scene?: THREE.Scene\n}\n\nconst isConvolution = (effect: Effect): boolean =>\n (effect.getAttributes() & EffectAttribute.CONVOLUTION) === EffectAttribute.CONVOLUTION\n\nexport const EffectComposer = React.memo(\n forwardRef(\n (\n {\n children,\n camera: _camera,\n scene: _scene,\n resolutionScale,\n enabled = true,\n renderPriority = 1,\n autoClear = true,\n depthBuffer,\n disableNormalPass,\n stencilBuffer,\n multisampling = 8,\n frameBufferType = HalfFloatType,\n }: EffectComposerProps,\n ref\n ) => {\n const { gl, scene: defaultScene, camera: defaultCamera, size } = useThree()\n const scene = _scene || defaultScene\n const camera = _camera || defaultCamera\n\n const [composer, normalPass, downSamplingPass] = useMemo(() => {\n const webGL2Available = isWebGL2Available()\n // Initialize composer\n const effectComposer = new EffectComposerImpl(gl, {\n depthBuffer,\n stencilBuffer,\n multisampling: multisampling > 0 && webGL2Available ? multisampling : 0,\n frameBufferType,\n })\n\n // Add render pass\n effectComposer.addPass(new RenderPass(scene, camera))\n\n // Create normal pass\n let downSamplingPass = null\n let normalPass = null\n if (!disableNormalPass) {\n normalPass = new NormalPass(scene, camera)\n normalPass.enabled = false\n effectComposer.addPass(normalPass)\n if (resolutionScale !== undefined && webGL2Available) {\n downSamplingPass = new DepthDownsamplingPass({ normalBuffer: normalPass.texture, resolutionScale })\n downSamplingPass.enabled = false\n effectComposer.addPass(downSamplingPass)\n }\n }\n\n return [effectComposer, normalPass, downSamplingPass]\n }, [\n camera,\n gl,\n depthBuffer,\n stencilBuffer,\n multisampling,\n frameBufferType,\n scene,\n disableNormalPass,\n resolutionScale,\n ])\n\n useEffect(() => composer?.setSize(size.width, size.height), [composer, size])\n useFrame(\n (_, delta) => {\n if (enabled) {\n const currentAutoClear = gl.autoClear\n gl.autoClear = autoClear\n if (stencilBuffer && !autoClear) gl.clearStencil()\n composer.render(delta)\n gl.autoClear = currentAutoClear\n }\n },\n enabled ? renderPriority : 0\n )\n\n const group = useRef(null)\n const instance = useInstanceHandle(group)\n useLayoutEffect(() => {\n const passes: Pass[] = []\n\n if (group.current && instance.current && composer) {\n const children = instance.current.objects as unknown[]\n\n for (let i = 0; i < children.length; i++) {\n const child = children[i]\n\n if (child instanceof Effect) {\n const effects: Effect[] = [child]\n while (children[i] instanceof Effect && !isConvolution(children[i] as Effect)) {\n effects.push(children[i++] as Effect)\n }\n\n const pass = new EffectPass(camera, ...effects)\n passes.push(pass)\n } else if (child instanceof Pass) {\n passes.push(child)\n }\n }\n\n for (const pass of passes) composer?.addPass(pass)\n\n if (normalPass) normalPass.enabled = true\n if (downSamplingPass) downSamplingPass.enabled = true\n }\n\n return () => {\n for (const pass of passes) composer?.removePass(pass)\n if (normalPass) normalPass.enabled = false\n if (downSamplingPass) downSamplingPass.enabled = false\n }\n }, [composer, children, camera, normalPass, downSamplingPass, instance])\n\n // Memoize state, otherwise it would trigger all consumers on every render\n const state = useMemo(\n () => ({ composer, normalPass, downSamplingPass, resolutionScale, camera, scene }),\n [composer, normalPass, downSamplingPass, resolutionScale, camera, scene]\n )\n\n // Expose the composer\n useImperativeHandle(ref, () => composer, [composer])\n\n return (\n <EffectComposerContext.Provider value={state}>\n <group ref={group}>{children}</group>\n </EffectComposerContext.Provider>\n )\n }\n )\n)\n"],"names":["createContext","EffectAttribute","forwardRef","HalfFloatType","useThree","useMemo","isWebGL2Available","EffectComposerImpl","RenderPass","downSamplingPass","normalPass","NormalPass","DepthDownsamplingPass","useEffect","useFrame","useRef","useInstanceHandle","useLayoutEffect","children","Effect","EffectPass","Pass","useImperativeHandle","jsx"],"mappings":"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"}
|
package/dist/EffectComposer.js
CHANGED
|
@@ -2,9 +2,10 @@ import { jsx } from "react/jsx-runtime";
|
|
|
2
2
|
import { HalfFloatType } from "three";
|
|
3
3
|
import React, { createContext, forwardRef, useMemo, useEffect, useRef, useLayoutEffect, useImperativeHandle } from "react";
|
|
4
4
|
import { useThree, useFrame, useInstanceHandle } from "@react-three/fiber";
|
|
5
|
-
import { EffectComposer as EffectComposer$1, RenderPass, NormalPass, DepthDownsamplingPass, Effect,
|
|
5
|
+
import { EffectComposer as EffectComposer$1, RenderPass, NormalPass, DepthDownsamplingPass, Effect, EffectPass, EffectAttribute, Pass } from "postprocessing";
|
|
6
6
|
import { isWebGL2Available } from "three-stdlib";
|
|
7
7
|
const EffectComposerContext = createContext(null);
|
|
8
|
+
const isConvolution = (effect) => (effect.getAttributes() & EffectAttribute.CONVOLUTION) === EffectAttribute.CONVOLUTION;
|
|
8
9
|
const EffectComposer = React.memo(
|
|
9
10
|
forwardRef(
|
|
10
11
|
({
|
|
@@ -80,14 +81,10 @@ const EffectComposer = React.memo(
|
|
|
80
81
|
for (let i = 0; i < children2.length; i++) {
|
|
81
82
|
const child = children2[i];
|
|
82
83
|
if (child instanceof Effect) {
|
|
83
|
-
const effects = [];
|
|
84
|
-
while (
|
|
85
|
-
// Filter to effects
|
|
86
|
-
children2[i] instanceof Effect && // Don't merge convolution effects
|
|
87
|
-
(children2[i].getAttributes() & EffectAttribute.CONVOLUTION) !== 0
|
|
88
|
-
)
|
|
84
|
+
const effects = [child];
|
|
85
|
+
while (children2[i] instanceof Effect && !isConvolution(children2[i])) {
|
|
89
86
|
effects.push(children2[i++]);
|
|
90
|
-
|
|
87
|
+
}
|
|
91
88
|
const pass = new EffectPass(camera, ...effects);
|
|
92
89
|
passes.push(pass);
|
|
93
90
|
} else if (child instanceof Pass) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EffectComposer.js","sources":["../src/EffectComposer.tsx"],"sourcesContent":["import type { TextureDataType } from 'three'\nimport { HalfFloatType } from 'three'\nimport React, {\n forwardRef,\n useMemo,\n useEffect,\n useLayoutEffect,\n createContext,\n useRef,\n useImperativeHandle,\n} from 'react'\nimport { useThree, useFrame, useInstanceHandle } from '@react-three/fiber'\nimport {\n EffectComposer as EffectComposerImpl,\n RenderPass,\n EffectPass,\n NormalPass,\n // @ts-ignore\n DepthDownsamplingPass,\n Effect,\n Pass,\n EffectAttribute,\n} from 'postprocessing'\nimport { isWebGL2Available } from 'three-stdlib'\n\nexport const EffectComposerContext = createContext<{\n composer: EffectComposerImpl\n normalPass: NormalPass | null\n downSamplingPass: DepthDownsamplingPass | null\n camera: THREE.Camera\n scene: THREE.Scene\n resolutionScale?: number\n}>(null!)\n\nexport type EffectComposerProps = {\n enabled?: boolean\n children: JSX.Element | JSX.Element[]\n depthBuffer?: boolean\n disableNormalPass?: boolean\n stencilBuffer?: boolean\n autoClear?: boolean\n resolutionScale?: number\n multisampling?: number\n frameBufferType?: TextureDataType\n renderPriority?: number\n camera?: THREE.Camera\n scene?: THREE.Scene\n}\n\nexport const EffectComposer = React.memo(\n forwardRef(\n (\n {\n children,\n camera: _camera,\n scene: _scene,\n resolutionScale,\n enabled = true,\n renderPriority = 1,\n autoClear = true,\n depthBuffer,\n disableNormalPass,\n stencilBuffer,\n multisampling = 8,\n frameBufferType = HalfFloatType,\n }: EffectComposerProps,\n ref\n ) => {\n const { gl, scene: defaultScene, camera: defaultCamera, size } = useThree()\n const scene = _scene || defaultScene\n const camera = _camera || defaultCamera\n\n const [composer, normalPass, downSamplingPass] = useMemo(() => {\n const webGL2Available = isWebGL2Available()\n // Initialize composer\n const effectComposer = new EffectComposerImpl(gl, {\n depthBuffer,\n stencilBuffer,\n multisampling: multisampling > 0 && webGL2Available ? multisampling : 0,\n frameBufferType,\n })\n\n // Add render pass\n effectComposer.addPass(new RenderPass(scene, camera))\n\n // Create normal pass\n let downSamplingPass = null\n let normalPass = null\n if (!disableNormalPass) {\n normalPass = new NormalPass(scene, camera)\n normalPass.enabled = false\n effectComposer.addPass(normalPass)\n if (resolutionScale !== undefined && webGL2Available) {\n downSamplingPass = new DepthDownsamplingPass({ normalBuffer: normalPass.texture, resolutionScale })\n downSamplingPass.enabled = false\n effectComposer.addPass(downSamplingPass)\n }\n }\n\n return [effectComposer, normalPass, downSamplingPass]\n }, [\n camera,\n gl,\n depthBuffer,\n stencilBuffer,\n multisampling,\n frameBufferType,\n scene,\n disableNormalPass,\n resolutionScale,\n ])\n\n useEffect(() => composer?.setSize(size.width, size.height), [composer, size])\n useFrame(\n (_, delta) => {\n if (enabled) {\n const currentAutoClear = gl.autoClear\n gl.autoClear = autoClear\n if (stencilBuffer && !autoClear) gl.clearStencil()\n composer.render(delta)\n gl.autoClear = currentAutoClear\n }\n },\n enabled ? renderPriority : 0\n )\n\n const group = useRef(null)\n const instance = useInstanceHandle(group)\n useLayoutEffect(() => {\n const passes: Pass[] = []\n\n if (group.current && instance.current && composer) {\n const children = instance.current.objects as unknown[]\n\n for (let i = 0; i < children.length; i++) {\n const child = children[i]\n\n if (child instanceof Effect) {\n const effects: Effect[] = []\n while (
|
|
1
|
+
{"version":3,"file":"EffectComposer.js","sources":["../src/EffectComposer.tsx"],"sourcesContent":["import type { TextureDataType } from 'three'\nimport { HalfFloatType } from 'three'\nimport React, {\n forwardRef,\n useMemo,\n useEffect,\n useLayoutEffect,\n createContext,\n useRef,\n useImperativeHandle,\n} from 'react'\nimport { useThree, useFrame, useInstanceHandle } from '@react-three/fiber'\nimport {\n EffectComposer as EffectComposerImpl,\n RenderPass,\n EffectPass,\n NormalPass,\n // @ts-ignore\n DepthDownsamplingPass,\n Effect,\n Pass,\n EffectAttribute,\n} from 'postprocessing'\nimport { isWebGL2Available } from 'three-stdlib'\n\nexport const EffectComposerContext = createContext<{\n composer: EffectComposerImpl\n normalPass: NormalPass | null\n downSamplingPass: DepthDownsamplingPass | null\n camera: THREE.Camera\n scene: THREE.Scene\n resolutionScale?: number\n}>(null!)\n\nexport type EffectComposerProps = {\n enabled?: boolean\n children: JSX.Element | JSX.Element[]\n depthBuffer?: boolean\n disableNormalPass?: boolean\n stencilBuffer?: boolean\n autoClear?: boolean\n resolutionScale?: number\n multisampling?: number\n frameBufferType?: TextureDataType\n renderPriority?: number\n camera?: THREE.Camera\n scene?: THREE.Scene\n}\n\nconst isConvolution = (effect: Effect): boolean =>\n (effect.getAttributes() & EffectAttribute.CONVOLUTION) === EffectAttribute.CONVOLUTION\n\nexport const EffectComposer = React.memo(\n forwardRef(\n (\n {\n children,\n camera: _camera,\n scene: _scene,\n resolutionScale,\n enabled = true,\n renderPriority = 1,\n autoClear = true,\n depthBuffer,\n disableNormalPass,\n stencilBuffer,\n multisampling = 8,\n frameBufferType = HalfFloatType,\n }: EffectComposerProps,\n ref\n ) => {\n const { gl, scene: defaultScene, camera: defaultCamera, size } = useThree()\n const scene = _scene || defaultScene\n const camera = _camera || defaultCamera\n\n const [composer, normalPass, downSamplingPass] = useMemo(() => {\n const webGL2Available = isWebGL2Available()\n // Initialize composer\n const effectComposer = new EffectComposerImpl(gl, {\n depthBuffer,\n stencilBuffer,\n multisampling: multisampling > 0 && webGL2Available ? multisampling : 0,\n frameBufferType,\n })\n\n // Add render pass\n effectComposer.addPass(new RenderPass(scene, camera))\n\n // Create normal pass\n let downSamplingPass = null\n let normalPass = null\n if (!disableNormalPass) {\n normalPass = new NormalPass(scene, camera)\n normalPass.enabled = false\n effectComposer.addPass(normalPass)\n if (resolutionScale !== undefined && webGL2Available) {\n downSamplingPass = new DepthDownsamplingPass({ normalBuffer: normalPass.texture, resolutionScale })\n downSamplingPass.enabled = false\n effectComposer.addPass(downSamplingPass)\n }\n }\n\n return [effectComposer, normalPass, downSamplingPass]\n }, [\n camera,\n gl,\n depthBuffer,\n stencilBuffer,\n multisampling,\n frameBufferType,\n scene,\n disableNormalPass,\n resolutionScale,\n ])\n\n useEffect(() => composer?.setSize(size.width, size.height), [composer, size])\n useFrame(\n (_, delta) => {\n if (enabled) {\n const currentAutoClear = gl.autoClear\n gl.autoClear = autoClear\n if (stencilBuffer && !autoClear) gl.clearStencil()\n composer.render(delta)\n gl.autoClear = currentAutoClear\n }\n },\n enabled ? renderPriority : 0\n )\n\n const group = useRef(null)\n const instance = useInstanceHandle(group)\n useLayoutEffect(() => {\n const passes: Pass[] = []\n\n if (group.current && instance.current && composer) {\n const children = instance.current.objects as unknown[]\n\n for (let i = 0; i < children.length; i++) {\n const child = children[i]\n\n if (child instanceof Effect) {\n const effects: Effect[] = [child]\n while (children[i] instanceof Effect && !isConvolution(children[i] as Effect)) {\n effects.push(children[i++] as Effect)\n }\n\n const pass = new EffectPass(camera, ...effects)\n passes.push(pass)\n } else if (child instanceof Pass) {\n passes.push(child)\n }\n }\n\n for (const pass of passes) composer?.addPass(pass)\n\n if (normalPass) normalPass.enabled = true\n if (downSamplingPass) downSamplingPass.enabled = true\n }\n\n return () => {\n for (const pass of passes) composer?.removePass(pass)\n if (normalPass) normalPass.enabled = false\n if (downSamplingPass) downSamplingPass.enabled = false\n }\n }, [composer, children, camera, normalPass, downSamplingPass, instance])\n\n // Memoize state, otherwise it would trigger all consumers on every render\n const state = useMemo(\n () => ({ composer, normalPass, downSamplingPass, resolutionScale, camera, scene }),\n [composer, normalPass, downSamplingPass, resolutionScale, camera, scene]\n )\n\n // Expose the composer\n useImperativeHandle(ref, () => composer, [composer])\n\n return (\n <EffectComposerContext.Provider value={state}>\n <group ref={group}>{children}</group>\n </EffectComposerContext.Provider>\n )\n }\n )\n)\n"],"names":["EffectComposerImpl","downSamplingPass","normalPass","children"],"mappings":"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"}
|
|
@@ -1,7 +1,51 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
+
const jsxRuntime = require("react/jsx-runtime");
|
|
3
4
|
const postprocessing = require("postprocessing");
|
|
4
|
-
const
|
|
5
|
-
const ToneMapping =
|
|
5
|
+
const React = require("react");
|
|
6
|
+
const ToneMapping = React.forwardRef(function ToneMapping2({
|
|
7
|
+
blendFunction,
|
|
8
|
+
adaptive,
|
|
9
|
+
mode,
|
|
10
|
+
resolution,
|
|
11
|
+
maxLuminance,
|
|
12
|
+
whitePoint,
|
|
13
|
+
middleGrey,
|
|
14
|
+
minLuminance,
|
|
15
|
+
averageLuminance,
|
|
16
|
+
adaptationRate,
|
|
17
|
+
...props
|
|
18
|
+
}, ref) {
|
|
19
|
+
const effect = React.useMemo(
|
|
20
|
+
() => new postprocessing.ToneMappingEffect({
|
|
21
|
+
blendFunction,
|
|
22
|
+
adaptive,
|
|
23
|
+
mode,
|
|
24
|
+
resolution,
|
|
25
|
+
maxLuminance,
|
|
26
|
+
whitePoint,
|
|
27
|
+
middleGrey,
|
|
28
|
+
minLuminance,
|
|
29
|
+
averageLuminance,
|
|
30
|
+
adaptationRate
|
|
31
|
+
}),
|
|
32
|
+
[
|
|
33
|
+
blendFunction,
|
|
34
|
+
adaptive,
|
|
35
|
+
mode,
|
|
36
|
+
resolution,
|
|
37
|
+
maxLuminance,
|
|
38
|
+
whitePoint,
|
|
39
|
+
middleGrey,
|
|
40
|
+
minLuminance,
|
|
41
|
+
averageLuminance,
|
|
42
|
+
adaptationRate
|
|
43
|
+
]
|
|
44
|
+
);
|
|
45
|
+
React.useEffect(() => {
|
|
46
|
+
effect.dispose();
|
|
47
|
+
}, [effect]);
|
|
48
|
+
return /* @__PURE__ */ jsxRuntime.jsx("primitive", { ...props, ref, object: effect, attributes: postprocessing.EffectAttribute.CONVOLUTION });
|
|
49
|
+
});
|
|
6
50
|
exports.ToneMapping = ToneMapping;
|
|
7
51
|
//# sourceMappingURL=ToneMapping.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ToneMapping.cjs","sources":["../../src/effects/ToneMapping.tsx"],"sourcesContent":["import { ToneMappingEffect } from 'postprocessing'\nimport {
|
|
1
|
+
{"version":3,"file":"ToneMapping.cjs","sources":["../../src/effects/ToneMapping.tsx"],"sourcesContent":["import { ToneMappingEffect, EffectAttribute } from 'postprocessing'\nimport { EffectProps } from '../util'\nimport { forwardRef, useEffect, useMemo } from 'react'\n\nexport type ToneMappingProps = EffectProps<typeof ToneMappingEffect>\n\nexport const ToneMapping = forwardRef<ToneMappingEffect, ToneMappingProps>(function ToneMapping(\n {\n blendFunction,\n adaptive,\n mode,\n resolution,\n maxLuminance,\n whitePoint,\n middleGrey,\n minLuminance,\n averageLuminance,\n adaptationRate,\n ...props\n },\n ref\n) {\n const effect = useMemo(\n () =>\n new ToneMappingEffect({\n blendFunction,\n adaptive,\n mode,\n resolution,\n maxLuminance,\n whitePoint,\n middleGrey,\n minLuminance,\n averageLuminance,\n adaptationRate,\n }),\n [\n blendFunction,\n adaptive,\n mode,\n resolution,\n maxLuminance,\n whitePoint,\n middleGrey,\n minLuminance,\n averageLuminance,\n adaptationRate,\n ]\n )\n\n useEffect(() => {\n effect.dispose()\n }, [effect])\n\n return <primitive {...props} ref={ref} object={effect} attributes={EffectAttribute.CONVOLUTION} />\n})\n"],"names":["forwardRef","ToneMapping","useMemo","ToneMappingEffect","useEffect","jsx","EffectAttribute"],"mappings":";;;;;AAMa,MAAA,cAAcA,MAAAA,WAAgD,SAASC,aAClF;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GACA,KACA;AACA,QAAM,SAASC,MAAA;AAAA,IACb,MACE,IAAIC,eAAAA,kBAAkB;AAAA,MACpB;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IAAA,CACD;AAAA,IACH;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EAAA;AAGFC,QAAAA,UAAU,MAAM;AACd,WAAO,QAAQ;AAAA,EAAA,GACd,CAAC,MAAM,CAAC;AAEJ,SAAAC,+BAAC,eAAW,GAAG,OAAO,KAAU,QAAQ,QAAQ,YAAYC,+BAAgB,YAAa,CAAA;AAClG,CAAC;;"}
|
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { ToneMappingEffect } from 'postprocessing';
|
|
3
|
+
import { EffectProps } from '../util';
|
|
4
|
+
export type ToneMappingProps = EffectProps<typeof ToneMappingEffect>;
|
|
3
5
|
export declare const ToneMapping: import("react").ForwardRefExoticComponent<Omit<import("@react-three/fiber").ExtendedColors<import("@react-three/fiber").Overwrite<Partial<ToneMappingEffect>, import("@react-three/fiber").NodeProps<ToneMappingEffect, typeof ToneMappingEffect>>> & {
|
|
4
6
|
blendFunction?: import("postprocessing").BlendFunction | undefined;
|
|
5
7
|
adaptive?: boolean | undefined;
|
|
@@ -14,4 +16,4 @@ export declare const ToneMapping: import("react").ForwardRefExoticComponent<Omit
|
|
|
14
16
|
} & {
|
|
15
17
|
blendFunction?: import("postprocessing").BlendFunction | undefined;
|
|
16
18
|
opacity?: number | undefined;
|
|
17
|
-
}, "ref"> & import("react").RefAttributes<
|
|
19
|
+
}, "ref"> & import("react").RefAttributes<ToneMappingEffect>>;
|
|
@@ -1,6 +1,50 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
3
|
-
|
|
1
|
+
import { jsx } from "react/jsx-runtime";
|
|
2
|
+
import { ToneMappingEffect, EffectAttribute } from "postprocessing";
|
|
3
|
+
import { forwardRef, useMemo, useEffect } from "react";
|
|
4
|
+
const ToneMapping = forwardRef(function ToneMapping2({
|
|
5
|
+
blendFunction,
|
|
6
|
+
adaptive,
|
|
7
|
+
mode,
|
|
8
|
+
resolution,
|
|
9
|
+
maxLuminance,
|
|
10
|
+
whitePoint,
|
|
11
|
+
middleGrey,
|
|
12
|
+
minLuminance,
|
|
13
|
+
averageLuminance,
|
|
14
|
+
adaptationRate,
|
|
15
|
+
...props
|
|
16
|
+
}, ref) {
|
|
17
|
+
const effect = useMemo(
|
|
18
|
+
() => new ToneMappingEffect({
|
|
19
|
+
blendFunction,
|
|
20
|
+
adaptive,
|
|
21
|
+
mode,
|
|
22
|
+
resolution,
|
|
23
|
+
maxLuminance,
|
|
24
|
+
whitePoint,
|
|
25
|
+
middleGrey,
|
|
26
|
+
minLuminance,
|
|
27
|
+
averageLuminance,
|
|
28
|
+
adaptationRate
|
|
29
|
+
}),
|
|
30
|
+
[
|
|
31
|
+
blendFunction,
|
|
32
|
+
adaptive,
|
|
33
|
+
mode,
|
|
34
|
+
resolution,
|
|
35
|
+
maxLuminance,
|
|
36
|
+
whitePoint,
|
|
37
|
+
middleGrey,
|
|
38
|
+
minLuminance,
|
|
39
|
+
averageLuminance,
|
|
40
|
+
adaptationRate
|
|
41
|
+
]
|
|
42
|
+
);
|
|
43
|
+
useEffect(() => {
|
|
44
|
+
effect.dispose();
|
|
45
|
+
}, [effect]);
|
|
46
|
+
return /* @__PURE__ */ jsx("primitive", { ...props, ref, object: effect, attributes: EffectAttribute.CONVOLUTION });
|
|
47
|
+
});
|
|
4
48
|
export {
|
|
5
49
|
ToneMapping
|
|
6
50
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ToneMapping.js","sources":["../../src/effects/ToneMapping.tsx"],"sourcesContent":["import { ToneMappingEffect } from 'postprocessing'\nimport {
|
|
1
|
+
{"version":3,"file":"ToneMapping.js","sources":["../../src/effects/ToneMapping.tsx"],"sourcesContent":["import { ToneMappingEffect, EffectAttribute } from 'postprocessing'\nimport { EffectProps } from '../util'\nimport { forwardRef, useEffect, useMemo } from 'react'\n\nexport type ToneMappingProps = EffectProps<typeof ToneMappingEffect>\n\nexport const ToneMapping = forwardRef<ToneMappingEffect, ToneMappingProps>(function ToneMapping(\n {\n blendFunction,\n adaptive,\n mode,\n resolution,\n maxLuminance,\n whitePoint,\n middleGrey,\n minLuminance,\n averageLuminance,\n adaptationRate,\n ...props\n },\n ref\n) {\n const effect = useMemo(\n () =>\n new ToneMappingEffect({\n blendFunction,\n adaptive,\n mode,\n resolution,\n maxLuminance,\n whitePoint,\n middleGrey,\n minLuminance,\n averageLuminance,\n adaptationRate,\n }),\n [\n blendFunction,\n adaptive,\n mode,\n resolution,\n maxLuminance,\n whitePoint,\n middleGrey,\n minLuminance,\n averageLuminance,\n adaptationRate,\n ]\n )\n\n useEffect(() => {\n effect.dispose()\n }, [effect])\n\n return <primitive {...props} ref={ref} object={effect} attributes={EffectAttribute.CONVOLUTION} />\n})\n"],"names":["ToneMapping"],"mappings":";;;AAMa,MAAA,cAAc,WAAgD,SAASA,aAClF;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GACA,KACA;AACA,QAAM,SAAS;AAAA,IACb,MACE,IAAI,kBAAkB;AAAA,MACpB;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IAAA,CACD;AAAA,IACH;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EAAA;AAGF,YAAU,MAAM;AACd,WAAO,QAAQ;AAAA,EAAA,GACd,CAAC,MAAM,CAAC;AAEJ,SAAA,oBAAC,eAAW,GAAG,OAAO,KAAU,QAAQ,QAAQ,YAAY,gBAAgB,YAAa,CAAA;AAClG,CAAC;"}
|